Кукольник закрыть окно предупреждения JavaScript - PullRequest
0 голосов
/ 20 марта 2019

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

Я только начал экспериментировать с Puppeteer, вот код, который я сейчас использую этот простой код:

const ptr = require('puppeteer');

ptr.launch().then(async browser => {

const page = await browser.newPage();

await page.setViewport({ width: 1280, height: 800 });
await page.goto('https://portaleperiti.grupporealemutua.it/PPVET/VetrinaWebPortalePeriti/');

//This is the alert button selector 
await page.click("#BoxAlertBtnOk");

//This is the button on the page i want to click on 
await page.click("input[value='Perito RE / G.F.']");

await page.screenshot({
    path: 'screenshot.png',
    fullPage: true
});

await browser.close();
});

Это ошибка, которую я получаю: UnhandledPromiseRejectionWarning: Ошибка: узел либо не виден, либо не является HTMLElement на ElementHandle._clickablePoint

Любая помощь будет очень признательна, спасибо!

Ответы [ 2 ]

3 голосов
/ 20 марта 2019

На этой странице мало что происходит,

  • Окно предупреждения загружается только после загрузки страницы (в теге body имеется свойство onload). Поэтому вам следует подождать, пока сеть не будет работать.
  • Нажатие на эти кнопки «Perito» создает новое окно / вкладку из-за кода window.open(), помещенного в обработчик onclick.
  • Новая вкладка перенаправляет несколько раз и показывает страницу входа, если пользователь еще не вошел в систему.

Решение:

1. Убедитесь, что страница загружена правильно.

Просто добавьте { waitUntil: "networkidle0" } к .goto или .waitForNavigation.

await page.goto(
    "https://portaleperiti.grupporealemutua.it/PPVET/VetrinaWebPortalePeriti/",
    { waitUntil: "networkidle0" }
    // <-- Make sure the whole page is completely loaded
);

2. Подождите, пока элемент не нажмет

Уже предложено для других ответов, дождитесь элемента, используя waitFor.

// wait and click the alert button
await page.waitFor("#BoxAlertBtnOk");
await page.click("#BoxAlertBtnOk");

3. Необязательно, добавьте несколько секунд, прежде чем делать снимок экрана после нажатия кнопки. // optional, add few seconds before taking this screenshot // just to make sure it works even on slow machine await page.waitFor(2000); await page.screenshot({ path: "screenshot_before.png", fullPage: true }); 4. Используйте page.evaluate и document.querySelector, чтобы получить элемент

page.click не будет обрабатывать все виды кликов. Иногда существуют разные события, связанные с некоторыми элементами, и вы должны рассматривать это отдельно.

// we can click using querySelector and the native
// just page.click does not trigger the onclick handler on this page
await page.evaluate(() =>
    document.querySelector("input[value='Perito RE / G.F.']").click()
);

5. Обработайте новую вкладку отдельно

Вместе с browser.once('targetcreated'), new Promise и browser.pages() вы можете поймать вновь созданную вкладку и работать с ней.

Примечание: прочитайте окончательный код в конце ответа перед использованием.

// this is the final page after clicking the input on previous page
// https://italy.grupporealemutua.it/FIM/sps/IDPRMA/saml20/login
function newTabCatcher(browser) {
  // we resolve this promise after doing everything we need to do on this page
  // or in error
  return new Promise((resolve, reject) => {
    // set the listener before clicking the button to have proper interaction
    // we listen for only one new tab
    browser.once("targetcreated", async function() {
      console.log("New Tab Created");
      try {
        // get the newly created window
        const tabs = await browser.pages();
        const lastTab = tabs[tabs.length - 1];

        // Wait for navigation to finish as well as specific login form
        await Promise.all([
          lastTab.waitForNavigation({ waitUntil: "networkidle0" }),
          lastTab.waitFor("#div_login")
        ]);

        // browser will switch to this tab just when it takes the screenshot
        await lastTab.screenshot({
          path: "screenshot_newtab.png",
          fullPage: true
        });

        resolve(true);
      } catch (error) {
        reject(error);
      }
    });
  });
}

Итоговый код:

Просто для ясности, вот как я использовал все фрагменты кода, указанные выше.

const ptr = require("puppeteer");

ptr.launch({ headless: false }).then(async browser => {
  const page = await browser.newPage();

  await page.setViewport({ width: 1280, height: 800 });
  await page.goto(
    "https://portaleperiti.grupporealemutua.it/PPVET/VetrinaWebPortalePeriti/",
    { waitUntil: "networkidle0" }
    // <-- Make sure the whole page is completely loaded
  );

  // wait and click the alert button
  await page.waitFor("#BoxAlertBtnOk");
  await page.click("#BoxAlertBtnOk");

  // optional, add few seconds before taking this screenshot
  // just to make sure it works even on slow machine
  await page.waitFor(2000);
  await page.screenshot({
    path: "screenshot_before.png",
    fullPage: true
  });

  // we can click using querySelector and the native
  // just page.click does not trigger the onclick handler on this page
  await page.evaluate(() =>
    document.querySelector("input[value='Perito RE / G.F.']").click()
  );

  // here we go and process the new tab
  // aka get screenshot, fill form etc
  await newTabCatcher(browser);

  // rest of your code
  // ... 

  await browser.close();
});

Результат:

Работало без нареканий!

Примечание:

Обратите внимание, как я использовал новые Promise и async, ожидающие вместе. Возможно, это не лучшая практика, но теперь у вас есть пример того, что нужно искать при создании скребка для некоторых старых веб-сайтов.

0 голосов
/ 20 марта 2019

Ваша кнопка - #BoxAlertBtnOk появится на веб-странице через мгновение, когда вы наберете await page.click("#BoxAlertBtnOk");, кнопка невидима.Попробуйте подождать, пока оно не станет видимым, затем выполните действие:

await page.waitForSelector("#BoxAlertBtnOk");
await page.click("#BoxAlertBtnOk");

await page.waitForSelector("input[value='Perito RE / G.F.']");
await page.click("input[value='Perito RE / G.F.']");
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...