reactjs - 如何检查具有特定类的元素？

Question

我的测试代码有

<div className="foo">
    {this.props.foo ? "foo!" : ""}
</div>

我想像这样测试它：

it('shows no foo by default', () => {
    const wrapper = mount(
        <MyComponent/>
    );
    expect(wrapper).to.containMatchingElement(
        <div class="foo"/>
    );
});

但是，它永远不会找到元素并且测试失败，即使输出显示了我的元素：

AssertionError：预期<MyComponent />包含匹配项<div class="foo" />

    HTML:
    ...
    <div>
      <div class="foo"></div>
    </div>

如何断言<div>具有给定类的在输出中？

标签： reactjschai

Answer 1

it('shows no foo by default', () => {
    const wrapper = shallow(
        <MyComponent />
    );
    expect(wrapper.find(".foo")).doTestHere(
        <div class="foo"/>
    );
});

试试这个。

你想尝试的方式应该是这样的

expect(wrapper.containsMatchingElement(<div class="foo"></div>)).to.equal(true);

你写了不完整的测试