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

【问题标题】：Testing fails because the prop was not rendered yet测试失败，因为道具尚未渲染
【发布时间】：2020-04-25 03:05:13
【问题描述】：

我正在尝试编写一个搜索渲染的 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");
  });

它失败了，因为它只看到第一个渲染，我该如何更改测试，以便它可以看到渲染后的 div 后 useEffect？

编辑：我尝试使用act，但它仍然不起作用

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

【问题讨论】：

你试过wrapper.render().find(".test")第二次渲染吗？

标签： javascript reactjs jestjs enzyme use-effect

【解决方案1】：

我之前也遇到过这个问题，相信你需要使用挂载包装器的update方法：

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

所以你的测试看起来像这样：

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

【讨论】：