测试失败，因为尚未渲染道具

Question

我正在尝试编写一个搜索呈现的Dom元素的测试，但是它是通过useEffect呈现的，因此该测试失败了，因为稍后将其呈现。例如：

const [isTrue, setIsTrue] = useState(false);
  useEffect(() => {
        setIsTrue(!isTrue);
      }, []);

    <div>
      {isTrue && <div className="test">test</div>}
    </div>

当dom使用className =“ test”渲染div时，仅在useEffect之后才渲染，但是我有一个名为：的测试：

 test("test", () => {
    expect(wrapper.find(".test").first().text()).toEqual("test");
  });

并且失败，因为它仅看到第一个渲染，我如何更改测试，以便它将在useEffect后看到渲染的div？

编辑：我尝试使用行为，但仍然无法正常工作

import { act } from "react-dom/test-utils";
  import { mount } from "enzyme";
  act(() => {
      component = mount(<App />);
    });

Answer 1

我以前遇到过此问题，我相信您需要使用已安装包装器的update方法：

https://enzymejs.github.io/enzyme/docs/api/ReactWrapper/update.html

所以您的测试将如下所示：

test("test", () => {
    wrapper.update();
    expect(wrapper.find(".test").first().text()).toEqual("test");
});