酶测试包含容器

Question

测试容器中存在的组件/元素是否有意义？

我有这个节点

<div className="App">
  <input type="text" onChange={[undefined]} />
  <button onClick={[undefined]}>
    Add
  </button>
</div>

但是为什么测试失败了？

const wrapper = shallow(<App />);
console.log(wrapper.debug())
expect(
  wrapper.contains('<input type="text" onChange={()=>{}} />')
).toBeTruthy();

https://codesandbox.io/s/rjl3p727wm

Answer 1

这有两个原因：

1. contains 函数需要传入一个或多个 ReactNode，而不是选择器，这意味着我们必须去掉引号。
2. ()=>{} 不等于 undefined，这是 App 组件内部的值。

合并这些更改：

expect(
  wrapper.contains(<input type="text" onChange={undefined} />)
).toBeTruthy();

A fork of codesandbox