Почему функция щелчка Puppeteer не работает на этом сайте? - PullRequest
0 голосов
/ 06 апреля 2020

Моя цель - нажать кнопку «Начать тест» с помощью Puppeteer. Селектор -> "# start-quiz"

Я делал что-то в кукловоде и пытался щелкнуть этот элемент привязки ("a"), из проведенного анализа я вполне уверен, что у элемента есть jquery прослушиватель событий прилагается. Кажется, я не могу нажать кнопку через кукловода, я тоже пробовал page.evaluate и многие другие функции оценки. Ничто из этого не похоже на работу. Странно, если я запускаю его через консоль javascript на веб-сайте, он работает.

Когда я запускаю его, он успешно достигает сайта и затем прокручивается вниз, где находится кнопка, но тогда больше ничего не происходит. Я не уверен, нажал ли Puppeteer кнопку или веб-сайт просто не распознает щелчок Puppeteer.

Селектором элемента привязки является "# start-quiz".

Сайт: https://tonesavvy.com/music-practice-exercise/19/chord-identification-game-treble/

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch({headless: false});
  const page = await browser.newPage();
  await page.goto('https://tonesavvy.com/music-practice-exercise/19/chord-identification-game-treble/', {waitUntil: 'networkidle2'});

  const startButton = await page.$('#start-quiz');
  await startButton.click();

  /*await page.evaluate(_ => {
    // this will be executed within the page, that was loaded before
    document.querySelector("#start-quiz").click();
  });*/

  //await browser.close();
})();

Я боролся с этим весь день, спасибо за помощь:)

** Редактировать 1 **

Поэтому я обнаружил ошибку в консоли веб-сайта при запуске программы.

base.736551cd2ce2.js:1265 Uncaught TypeError: Cannot read property 'resume' of undefined
    at HTMLAnchorElement.<anonymous> (base.736551cd2ce2.js:1265)
    at HTMLAnchorElement.dispatch (jquery.min.js:3)
    at HTMLAnchorElement.r.handle (jquery.min.js:3)

Я также нашел этот код ниже, который является частью сценарий веб-сайта, это была строка, где произошла ошибка

$(".btn").click(function() {
    MIDI.WebAudio.getContext().resume();
});

Я понял, что причина, по которой это не работало, была в том, что MIDI.WebAudio.getContext () не определен, это не происходит при переходе на этот сайт нормально. Эта ошибка возникает только тогда, когда Puppeteer контролирует браузер. Эта ошибка привела меня к мысли, что Puppeteer нажимает кнопку до загрузки системы MIDI Web Audio, но я не уверен, что еще нужно добавить, как я указал "{waitUntil: 'networkidle2'}".

Теперь возникает вопрос, есть ли способ заставить Puppeteer ждать загрузки MIDI WebAudio System?

** Edit 2 **

Я узнал некоторые предупреждения

Предупреждения

Кстати, я обнаружил, что предупреждения возникали до щелчка, но ошибка произошла после нажатия

Хорошо, так что на самом деле проблема не в том, что система MIDI WebAudio не загружена. Я вставил приведенный ниже код и убедился, что сайт перестал загружаться, и он все еще совершил ту же ошибку.

await page.waitFor(10000);

Это означает, что в системе MIDI WebAudio просто есть проблема с щелчком Кукловода, у меня на самом деле нет теория, почему это просто не работает с щелчком кукловода.

Ответы [ 2 ]

1 голос
/ 06 апреля 2020

Вы можете отлаживать ошибки на самой странице, прикрепив обработчик, такой как

page.on('pageerror', (err) => {
  console.error(err);
});

В этом случае он показывает:

TypeError: Cannot read property 'resume' of undefined
    at HTMLAnchorElement.<anonymous> (https://tonesavvy.com/static/js/drills/base.736551cd2ce2.js:1265:32)
    at HTMLAnchorElement.dispatch (https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js:3:7537)
    at HTMLAnchorElement.r.handle (https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js:3:5620)

И это происходит , когда кукловод щелкает селектор , поэтому он останавливает дальнейшую навигацию.

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

0 голосов
/ 07 апреля 2020

Не берите в голову, я только что узнал, что Puppeteer не ждет загрузки MIDI WebAudio, поэтому я просто добавил опцию ожидания и никакой опции тайм-аута к коду.

await page.goto('https://tonesavvy.com/music-practice-exercise/19/chord-identification-game-treble/', {waitUntil: ["networkidle0"], timeout: 0});

Это работает отлично!

...