如何仅在元素存在时执行Jest测试？

你遇到的问题核心是：getByTestId这类方法在找不到元素时会直接抛出测试失败的错误，根本无法执行后续的条件判断。要实现「元素存在则验证文本，不存在则跳过测试/直接通过」的逻辑，正确的做法是使用**queryByTestId**来安全查询元素。

正确实现代码 #

const elem = screen.queryByTestId('my-elem');
if (elem) {
  expect(elem).toHaveTextContent('hello');
}

为什么原来的写法行不通？ #

getByTestId属于「断言式查询方法」，它默认假设元素一定存在，找不到时会直接抛出错误终止测试，所以你的if判断根本没机会执行。而queryByTestId是「安全查询方法」，找不到元素时会返回null，不会抛出错误，这样就能正常进行条件判断了。

关于你的临时解决方案 #

你提到将不可见元素设为visibility: hidden而非不渲染，虽然能让getByTestId找到元素，但这种方式其实是绕过了「元素可能不渲染」的真实场景。相比之下，用queryByTestId做条件判断更贴合测试逻辑，也更符合React Testing Library的设计理念。

内容的提问来源于stack exchange，提问作者dmathisen