Как я могу найти и щелкнуть кнопку, на которой нет текста, с помощью библиотеки React Testing?

Question

Многие Библиотека React Testing примеры показывают, как найти и нажать кнопку, используя запрос getByText, например:

fireEvent.click(getByText("Create"))

OR

userEvent.click(getByText("Create"))

Однако, как правило, кнопки без текст и только значки SVG, например, кнопки пользовательского интерфейса для материала или кнопки с плавающим действием . Есть ли рекомендуемый способ запрашивать и нажимать кнопки, подобные этим? Для контекста я использую события более высокого уровня, предоставляемые сопутствующей user-event библиотекой.

Answer 1

Есть несколько способов запросить элемент, не видя иерархии элементов, трудно сказать. Но есть несколько способов запроса элемента, альтернативой использованию getByText() может быть getByRole('button'). Если вы хотите добавить data-testid к элементу, вы можете использовать getByTestId(). Есть еще несколько доступных запросов: https://testing-library.com/docs/dom-testing-library/api-queries