小编Dev*_*vEB的帖子

我在悬停上显示了一个弹出窗口，我想使用 Jest 和 React 测试库对其进行测试，以查看该元素是否默认隐藏。

当我手动测试时一切正常，而当我使用 RTL 测试时一切正常。

我尝试使用 not.toBeInTheDocument 和 not.toBeVisible 但似乎该元素始终存在于 DOM 中，不知道如何从 DOM 中删除它

JSX 代码：

<label
  htmlFor="terms_and_conditions"
  className="terms_and_conditions_box"
>
  I agree with{" "}
  <span className="terms_and_conditions_text" style={{ color: "blue" }}>
    Terms and conditions
  </span>
  <div className="pop_over">No ice cream will be delivered</div>
</label>

CSS代码：

.terms_and_conditions_text:hover + .pop_over {
  display: block;
}

.pop_over {
  background: rgb(199, 196, 196);
  padding: 2rem;
  width: 14rem;
  border-radius: 15px;
  position: absolute;
  right: -18rem;
  top: -2rem;
  display: none;
}

测试代码：

test("popover responds to hover", () …