Кукловод - как нажать на внутренний элемент

Question

Я использую Puppeteer для тестирования e2e для приложения, созданного с использованием React и Material-UI.

В моей форме входа в систему я пытаюсь нажать на кнопку входа, но я получаю loginBtn.click is not a function - это потому, что пользовательский интерфейс для материала (версия 0.21.0) оборачивает <RaisedButton> дополнительным div, чтобы я могтолько достичь внешнего элемента.Мне нужен способ доступа к внутреннему элементу, а затем имитировать событие нажатия.

Я пробовал это:

const loginBtn = await page.$eval(
    '.login-form-button', 
    (element) => element.innerHTML
);
await loginBtn.click();

Но похоже, что element.innerHTML это просто текст и не кликабелен.

Есть идеи, как мне получить внутренний элемент?

Answer 1

page.$eval выбирает элемент (.login-form-button) и передает этот элемент второму аргументу ((element) => element.innerHTML), который в вашем случае вернет HTML-код узла в виде строки.Поэтому loginBtn это не кнопка, а строка.Чтобы щелкнуть элемент, вы можете использовать page.click .

Если вам нужно выполнить более сложный термин, я рекомендую использовать page.evaluate.В вашем случае вы можете использовать его таким образом, чтобы запросить элемент и щелкнуть его первый дочерний элемент:

await page.evaluate(() => {
  document.querySelector('.login-form-button').firstElementChild.click();
});