Можно ли щелкнуть каждый элемент на странице с динамическим содержимым? - PullRequest
1 голос
/ 02 мая 2019

Возможно ли при помощи кукловода зайти на веб-сайт, проверить, является ли каждый контент на странице кликабельным / ссылки работают, и все это с динамическим контентом, чтобы я мог автоматизировать свой UI-тестирование?

Проблемав том, что содержимое меняется, и не у каждого элемента есть идентификатор, но я все еще хочу, чтобы каждый элемент проверялся на странице.

1 Ответ

0 голосов
/ 02 мая 2019

Да, вообще можно нажать на любой элемент на странице.Даже элементы без идентификатора или класса, который их идентифицирует, имеют селектор.Может быть, будет сложнее получить их селектор.

Получение селектора элемента

Ниже приведен пример того, как получить селектор элемента внутри браузера Chrome.Я получаю селектор для первого p элемента вашего вопроса.Обратите внимание, что он также не имеет идентификатора или класса.document.querySelector('...') показывает, что он правильно идентифицирует узел.

Get an element descriptor


Даже если элемент генерируется динамически, он имеет селектор, он можетпросто будет сложнее его найти.Возможно, вы захотите проверить на этой странице о различных возможностях селекторов CSS.

Если элемент не легко идентифицировать, вы также можете подумать, имеет ли смысл использовать содержимоеэлемент для его идентификации.Например, вы можете использовать выражение XPath, чтобы найти элемент с определенным текстом внутри .

Щелкните элемент

После того, как у вас есть селектор, вы можете использовать page.click функция или elementHandle.click функция, подобная этой:

Пример: Запросить все элементы, выполнить итерацию по ним и щелкать один за другим

const elements = await page.$$('div.example a');
for (const element of elements) {
    await element.click();
}

Пример: Просто щелкните два элемента

await page.click('div.selector a.example');
await page.click('div.selector a.example2');

Нажмите все элементы на странице

Если вына самом деле вы хотите щелкнуть все элементов на странице, вы можете использовать селектор *:

const elements = await page.$$('*');

Вы можете перебрать этот массив, но помните, что он также содержит такие элементы, какscript теги, div контейнеры, html, head, body, а также элементы, на которые нельзя нажимать.Кроме того, некоторые элементы (например, теги a) могут выполнять навигационный запрос после нажатия на них.Другие элементы (например, кнопки) могут даже добавлять или удалять что-то из DOM.

...