如何在 Jest 测试中共享设置和拆卸？

IT技术 reactjs jestjs
2021-04-29 01:34:17

我发现react测试配方非常冗长，因为他们需要在每次测试后设置一个容器并清理它。

我想在需要但找不到方法的测试文件之间共享该设置-拆卸代码，并且我不想在每个组件测试中重复 beforeEach 和 afterEach。

我试过类似的东西：

# sample.test.js

#...
import container from './react_helpers.js'
#...

# react_helpers.js

import { unmountComponentAtNode } from "react-dom"

let container = null;

beforeEach(() => {
  // setup a DOM element as a render target
  container = document.createElement("div");
  document.body.appendChild(container);
});

afterEach(() => {
  // cleanup on exiting
  unmountComponentAtNode(container);
  container.remove();
  container = null;
});

export default container

但似乎 beforeEach 没有运行。

1个回答

有问题react_helpers。如果未使用导入，则不会评估 ES module，因此如果未在下面引用，import container from './react_helpers.js'则将container是空操作。并且 ES module仅在第一次导入时进行评估，因此它们可能不适合此任务。

如果有需要共享数据，共同的对象需要被共享commonSetup在那里的评估，像解释的背景和在这里：

export default function commonSetup(context = {}) {
  beforeEach(() => {
    context.container = ...;
    ...
  });
  afterEach(...);

  return context;
}

然后commonSetup可以在需要此设置的测试中导入和评估：

import commonSetup from './react_helpers.js'

...

let context = commonSetup();

it('...', () => {
  let { container } = context;
  ...
});
其它你可能感兴趣的问题
上一篇ReactJS：TypeError：this.state.data.map 不是函数 下一篇这个 forwardRef 可以移动到一个函数中以实现可重用性吗？