检查 HTML 元素类型以获取 React 测试库的 getByText 结果？

Question

我可以通过文本找到元素并检查它是否是以下链接：

const Link = Parent.getByText('This is a link', { exact: false });
expect(Link).toHaveAttribute('href', 'www.somewhere.com');

如何检查这个其他元素（我通过文本找到的）不是链接？

const NotALink = Parent.getByText('Not a link', { exact: false });

Answer 1

测试库文档有一个优先级，他们推荐的第一个查询是queryByRole，您可以在其中按特定角色进行查询，也可以按名称进行查询，这是您的情况。

你可以做：

expect(screen.getByRole('link', { name: /this is a link/i })).toBeInTheDocument();

expect(screen.queryByRole('link', { name: /not a link/i })).toBe(null);

请注意，如果元素不存在，则需要执行 queryBy，因为 getBy 查询将引发错误并使测试失败。