Простой способ найти html-элемент, который был обработан React

Question

Для быстрого поиска элементов по Selenium, я думаю, это должен быть простой способ установить некоторые атрибуты для html-элементов, например: преобразовать React Component Key в data-attribute (если это возможно).

Конечно, я могу записывать id или атрибуты данных в мои span, div и все, что угодно в моих компонентах, но я не могу сделать это с компонентами сторонних библиотек - эти компоненты могут не иметь реквизита, как "id" и мне придется обернуть эти компоненты, а затем найти их по тегу или классу ...

Или, может быть, это плагин для веб-пакета для установки атрибутов данных для элементов с именами компонентов.

Тем не менее, как вы находите элементы в вашем реактивном приложении?

Я думаю, что не стоит искать элементы по классам или тегам

преобразование ключа следующим образом :

    <MyComponent key="SuperComponent" />
    ...
    <div data-attr="SuperComponent">...</div>

или автоматически устанавливать атрибуты имени компонента, как это :

    <MySuperComponent />
    ...
    <div data-attr="MySuperComponent">...</div>

Answer 1

От "Автоматизация тестирования до Селен" перспектива вряд ли имеет значение, если HTML состоит из id или атрибутов данных . При работе с Selenium тесты пишутся с помощью любых эффективных <tag> и связанных атрибутов . Однако есть предпочтительный список Стратегии локатора следующим образом:

Как найти элементы в приложении рендеринга реагирования?

AUT (тестируемое приложение) , являющееся ReactJS на основе грубого элемента, будет иметь динамические атрибуты. Стратегии локатора также могут быть динамическими. Вы можете найти пример использования Стратегий Динамического Локатора в обсуждении Как найти кнопку с динамическим ID

Наконец, в то время как Test Automation потребуется быстро перемещающийся экземпляр WebDriver для синхронизации с запаздывающим браузером. Соответствующее обсуждение можно найти в Есть ли у нас какие-либо общие функции, чтобы проверить, полностью ли загружена страница в Selenium