Когда elementHandle не elementHandle - PullRequest
       30

Когда elementHandle не elementHandle

0 голосов
/ 17 января 2020

В api docs кукловода определен ElementHandle:

ElementHandle represents an in-page DOM element. ElementHandles can be created with the page.$ method.

Итак, при наличии ElementHandle я должен иметь возможность выполнять все основные функции c, которые вы можете выполнять со страницей: .click,. $$,. $ x, .hover, et c

То же самое делает c определяет страницу. $ x (выражение)

expression <string> expression to evaluate (Xpath Expression)
returns: <Promise<Array<ElementHandle>>>

Итак, у меня есть следующее, которое возвращает массив ElementHandles:

const cameraRowList = await page.$x("//div[contains(@class, 'camera-row')]");

Я на самом деле получаю 5 элементов в массиве, как и ожидалось. Поэтому мне нужно l oop просмотреть этот список и проверить ElementHandles на наличие объекта svg с id = 'locationChecked'. Затем щелкните по нему, если это так. (у всех кроме 4го в настоящее время есть этот идентификатор)

for (const cameraRow of cameraRowList) {
   const [cameraHasLocation] = await cameraRow.$x("//div[@class='hasLocation']//*[@id='locationChecked']");
   if (cameraHasLocation) {
      const [cameraSelectBox] = await cameraRow.$x("//div[contains(@class, 'checkbox')]");
      await cameraSelectBox.click();
   }
}

Проблема в два раза.

Первый: когда он проходит через 5 ElementHandles в массиве, он всегда находит / оценивает объект 'locationChecked', даже если 4-го его там нет.

Второй: когда он выполняет cameraSelectionBox.click (); Он всегда щелкает первый.

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

Что я могу сделать, чтобы убедиться, что область остается в пределах используемого ElementHandle?

1 Ответ

0 голосов
/ 22 января 2020

Я понял это. Проблема в моем xpath.

const [cameraHasLocation] = await cameraRow.$x("//div[@class='hasLocation']//*[@id='locationChecked']");

Я должен был сделать поиск относительно "./" Я использовал Global "//", который игнорирует область elementHandle:

const [cameraHasLocation] = await cameraRow.$x("./div[@class='hasLocation']//*[@id='locationChecked']");
...