Javascript 如何在Ezyme中呈现假DOM中的组件？

我有一个组件库和一个

Tooltip

组件，它在文档正文的最底部呈现tooltipdiv。如何在伪DOM中呈现

工具提示

组件，然后在悬停

工具提示

组件后测试div元素是否出现

因此：

首先，我必须首先渲染/装载工具提示组件

模拟事件fe

wrapper.find（'span'）.Simulate（'mouseenter'）

检查

元素是否出现在正确的位置（作为最后一个子实体）

---

我被困在第一点和第三点。我如何测试它呢？我应该使用JSDom吗？

我这样做似乎很有效，因为Ezyme为您提供了全局文档对象，您可以参考，开箱即用：

test("shows tooltip when mouse enters child element", () => {
  const div = global.document.createElement("div");
  global.document.body.appendChild(div);

  const wrapper = mount(
    <Tooltip content="You got me!">
      <p>Hello</p>
    </Tooltip>,
    { attachTo: div }
  );

  wrapper.ref("overlay").simulate("mouseEnter");

  // do stuff...
});

test（“当鼠标进入子元素时显示工具提示”，（）=>{
const div=global.document.createElement（“div”）；
全局.document.body.appendChild（div）；
常量包装器=装入(
你好

,
{附件：div}
);
wrapper.ref（“覆盖”）.simulate（“鼠标指针”）；
//做些事情。。。
});

---

问题在于我的组件本身。这是一个非常复杂的问题，我不知道为什么在测试过程中，它会在我模拟了onmouseeve之后触发

onmouseeve

。但测试和我预期的一样，可以与其他一些更简单的工具提示组件一起工作，尽管Oo

您描述的是一个功能测试。为此，最好使用类似nightwatch的框架。如果你想使用Ezyme，那么只需测试工具提示是否正确呈现，并通过一个简单的单元测试，测试事件是否被触发。感谢Ben推荐nightwatch-我会尝试一下！