我目前正在努力为我拥有的项目升级npm依赖关系,并且由于组件的浅层渲染行为已更改,因此遇到了许多损坏的测试用例。
我已经从中迁移了react / enzyme / jest依赖项
"react": "15.6.1",
"enzyme": "3.3.0",
"enzyme-adapter-react-15": "1.0.5",
"jest": "23.6.0",
到
"react": "16.8.6",
"enzyme": "3.10.0",
"enzyme-adapter-react-16": "1.14.0"
"jest": "24.8.0",
在先前的组合中,以下测试成功:
describe("TpidTenantList", () => {
it("test components", () => {
const Foo = props => <div className="Foo" />;
const Bar = props => (
<div className="Bar">
<Foo />
<Foo />
</div>
);
const wrapper = shallow(<Bar />);
expect(wrapper.find(Foo).length).toBe(2);
});
});
但是,对于新的组合,此测试失败。查看包装器的渲染html,我可以看到浅层实际上已经渲染了Foo子组件,产生了
<div class="Bar">
<div class="Foo"></div>
<div class="Foo"></div>
</div>
如果我改为将测试更改为.find(".Foo")
,则测试通过,但是,某些要测试的组件包含HighChart和其他渲染困难的库。
我尝试包装被测组件,并为浅层组件提供disableLifecycleMethods
选项,但是完整的组件树似乎正在呈现。
理想情况下,我想将行为强制为旧组合库的行为,或者,如果有首选模式,我很乐意采用这种行为。