test-library使用screen.getByText无法匹配跨元素文本有何替代方案？

test-library默认的getByText仅匹配单个DOM元素内部的完整文本，你场景中的"Hello"属于外层<div>，"world"属于内层<span>，文本拆分在两个元素中，因此正则无法直接匹配。

方案1：使用*ByRole查询（最推荐） #

可访问性名称计算会自动拼接同一容器下所有子元素的文本内容，完全贴合用户感知的页面内容，符合测试库最佳实践，直接调用即可：

screen.getByRole('generic', { name: /Hello world/i })

如果外层<div>有明确的语义角色（如paragraph、button等），将generic替换为对应角色即可。

方案2：配合测试ID+文本断言 #

你可以给外层<div>绑定data-testid属性，直接通过测试ID获取容器后断言完整文本：

// 对应HTML结构: <div data-testid="content-wrapper">Hello <span>world</span></div>
const contentWrapper = screen.getByTestId('content-wrapper')
expect(contentWrapper).toHaveTextContent(/Hello world/i)

额外提示：你报错信息里的正则为/Hello word/i存在拼写错误，请确认实际代码中正则为/Hello world/i，避免额外的匹配失败问题。

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