Headless false — фокус всегда на адресной строке
Я использую puppeteer с опцией headless=false, чтобы пользователь мог ввести некоторые данные в форму, а затем программно прочитать результат.
Я хочу, чтобы курсор/фокус был на первом поле ввода при загрузке страницы, но фокус всегда был на адресной строке.
Есть ли способ переместить курсор/фокус внутри страницы?
Я уже пробовал await page.focus(selector).
Пожалуйста, найдите приведенный ниже пример:
const puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch({ headless: false});
const page = await browser.newPage();
let selector = ".w3-white.w3-padding.notranslate>form>input[name='firstname']";
await page.goto('https://www.w3schools.com/html/html_forms.asp');
await page.waitForSelector(selector,{waitUntil :"networkidle2"});
await page.focus(selector);
await page.type(selector,"aaa");
//await browser.close();
})();
Я хотел бы, чтобы после загрузки страницы пользователь мог вводить текст в поле ввода без необходимости сначала «перемещаться» в поле (с помощью мыши или вкладки).
Ответы 3
Есть одна мелочь, которую нужно исправить, waitUntil вариант для page.goto:
await page.goto('https://www.w3schools.com/html/html_forms.asp',{waitUntil :"networkidle2"});
При этом ваш пример отлично работает с puppeteer 1.11 и node 8.6.
Проблема, с которой вы столкнулись, заключается в том, что вы устанавливаете курсор внутри страницы, но фокус самого браузера все еще находится на адресной строке.
Чтобы браузер сфокусировал саму страницу, вам нужно вызвать page.bringToFront(), который установит фокус браузера на вкладку. Вы должны сделать это сразу после создания страницы следующим образом:
const page = await browser.newPage();
await page.bringToFront();
Кроме того, как уже указывалось в другом ответе, вы указываете недопустимые параметры для функции page.waitForSelector. Это просто игнорируется кукловодом (и не связано с вашей проблемой), но должно быть удалено.
Я вызвал функцию mouse.click(), чтобы переместить курсор из адресной строки на страницу.
await page.mouse.click(0, 0);
Способ использования browser.newPage() работает так, как я ожидаю, но в этом случае используется больше памяти. Поэтому я использую функцию click().