reactjs - 如何使用React Testing Library查找并单击没有文本的按钮？

Question

许多React Testing Library示例显示了如何使用getByText查询来查找和单击按钮，如下所示:

fireEvent.click(getByText("Create"))

或者

userEvent.click(getByText("Create"))

但是，通常会出现没有文本且只有SVG图标的按钮，例如Material UI的 icon buttons或 floating action buttons。有没有建议的方法来查询和单击像这样的按钮？对于上下文，我使用了伴随的 user-event库提供的更高级别的事件。

Answer 1

有多种查询元素的方法，而看不到元素的层次结构，这很难说。但是，有几种查询元素的方法，可以使用getByText()代替getByRole('button')。如果要向元素添加data-testid，则可以使用getByTestId()。在这里找到更多可用的查询:https://testing-library.com/docs/dom-testing-library/api-queries