Question

我正在使用Jest和Enzyme为这个非常简单的组件运行单元测试render()：

render() {
  return (<Input
    id='foo'
    ref={input => { this.refInput = input }}
  />)
}

it('should render Input', () => {
  wrapper = shallow(<Component />)
  expect(wrapper.find(Input)).toHaveLength(1)
})

我也在使用Jest的覆盖选项，在那里我看到了那行

ref={input => { this.refInput = input }}

不在我的测试范围内。如何为此样本组件进行完整的单元测试？

Answer 1

ref附加到组件的实例，因此您必须使用mount来获取组件的实例。

要测试df['y'].str.replace('nan|[{}\s]','').str.split(',').apply(set).str.join(',').str.strip(',').str.replace(",{2,}",",") # Replace all the braces and nan with `''`, then split and apply set and join，请添加以下行

ref

最终结果：

expect(wrapper.instance().refInput).toBeTruthy();

Answer 2

我解决了这样的问题：

const ref = React.createRef();
const props = { register: jest.fn(params => ref), label: "label text", ...params };
let wrapper = mount(
    <ThemeProvider theme={theme}>
        <Input {...props} />
    </ThemeProvider>
);
expect(wrapper.find(Entity).getElement().ref).toBe(ref);

我的输入中有实体组件，可以接收ref函数。

React / JestJS / Enzyme：如何测试参考功能？

2 个答案: