javascript - enzyme 描述功能内部的安装位置和卸载位置？

我正在尝试使React项目中的测试组件变得更糟。到目前为止，我在单个组件上只有一个测试文件，并且正在尝试将此文件准备为包含多个测试的测试套件。

import React from 'react';
import Enzyme, { mount } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';
import HamburgerIcon from './HamburgerIcon';

Enzyme.configure({ adapter: new Adapter() });

describe('<HamburgerIcon />', () => {

  const hamburgerIcon = mount(<HamburgerIcon showOverlay={showOverlay} />);

  it('displays on mobile', () => {
     ...
     ...
  });

  it('has class .open after click', () => {
    ...
    ...
  });

  hamburgerIcon.unmount();

});

我删除了这两个测试的内容，但是基本上，这两个测试都包装在describe函数中，并且我试图一次mount该组件和一次unmount该组件，以保持东西干（不要重复自己）。

我将mount放在两个it函数之前，以为在运行测试之前安装组件是合乎逻辑的。

我将unmount放在两个测试函数之后，这会导致错误：


  方法“模拟”旨在在1个节点上运行。找到0个代替。


我认为发生这种情况是因为在实际运行测试之前要先卸载组件。

如果我在两个测试中都mount和unmount，像这样...

describe('<HamburgerIcon />', () => {

  it('displays on mobile', () => {
     const hamburgerIcon = mount(<HamburgerIcon showOverlay={showOverlay} />);
     ...
     ...
     hamburgerIcon.unmount();
  });

  it('has class .open after click', () => {
    const hamburgerIcon = mount(<HamburgerIcon showOverlay={showOverlay} />);
    ...
    ...
    hamburgerIcon.unmount();
  });

});

...测试通过了。

但是，这似乎过度。如果我的测试套件具有十个测试功能怎么办？我是否应该在每次测试中都像这样安装和卸载？

最佳答案

您可以使用beforeEach和afterEach函数来设置和清除测试。

afterEach(() => {
    //do the unmounting and other stuff here
    //this will be called after each test case
});

beforeEach(() => {
    //do the mounting and setting up the test case here
    //this will be called before each test case
});