如何获取元素的值而非元素本身？测试断言失败问题咨询

你遇到的问题是screen.getByTestId返回的是完整的DOM元素对象，不是元素内部的文本内容，所以直接和字符串"Yes"断言会失败。这里有两种常用的解决方式：

方法1：提取元素的文本内容 #

通过DOM元素的textContent属性获取内部文本，再进行断言：

const writeProtected = screen.getByTestId('write-protected-value')
expect(writeProtected.textContent).toEqual('Yes')

也可以用innerText，但textContent更稳定（不受元素样式隐藏影响）。

方法2：直接断言元素的文本内容（推荐） #

React Testing Library提供了专门的断言方法toHaveTextContent，可以直接验证元素是否包含指定文本，更符合测试的语义化：

expect(screen.getByTestId('write-protected-value')).toHaveTextContent('Yes')

这种方式不需要手动提取文本，直接验证元素的显示内容，更贴合测试页面行为的初衷。

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