Crawlee & Apify•2y ago

Noob Puppeteer Question

I'm trying to follow Apify's Puppeteer tutorial (https://docs.apify.com/academy/puppeteer-playwright/page/interacting-with-a-page) and getting nowhere. Their example will launch Chromium and execute through the 4th line of the code below. Then nothing. It looks like Google may have changed the page so that the button text that the example is looking for no longer exists. However, even if I replace the selector text to something that is indeed on the page that Chromium loads, noting happens. As in:

await page.click('button:has-text("I agree")');

await page.click('button:has-text("I agree")');

with:

await page.click('button:has-text("Stay signed out")');

await page.click('button:has-text("Stay signed out")');

And if I comment out that line, the following line the next line fails to execute as well.

// Type the query into the search box
await page.type('input[title="Search"]', 'hello world');

// Type the query into the search box
await page.type('input[title="Search"]', 'hello world');

Is it possible that my Puppeteer install is not complete? Or has something changed on the page that makes the example code outdated? Thanks!

Interacting with a page | Academy | Apify Documentation

Learn how to programmatically do actions on a page such as clicking, typing, and pressing keys. Also, discover a common roadblock that comes up when automating.

6 Replies

genetic-orange•2y ago

Hey @hargie, could you please send here also the error message and the full code so we can further review it?

foreign-sapphireOP•2y ago

Thanks. The error message after running the first block of code (shown below) on the Interacting With A Page tutorial shows the following error:

node:internal/process/esm_loader:46
      internalBinding('errors').triggerUncaughtException(
                                ^
page.click: Timeout 30000ms exceeded.
=========================== logs ===========================
waiting for locator('button:has-text("I agree")')
============================================================
    at file:///Users/username/Documents/WORK/StarterCulture/Offering/puppeteer-playwright/index.js:10:12 {
  name: 'TimeoutError'
}

Node.js v20.5.0

node:internal/process/esm_loader:46
      internalBinding('errors').triggerUncaughtException(
                                ^
page.click: Timeout 30000ms exceeded.
=========================== logs ===========================
waiting for locator('button:has-text("I agree")')
============================================================
    at file:///Users/username/Documents/WORK/StarterCulture/Offering/puppeteer-playwright/index.js:10:12 {
  name: 'TimeoutError'
}

Node.js v20.5.0

Here's code:

import { chromium } from 'playwright';

const browser = await chromium.launch({ headless: false });

const page = await browser.newPage();

await page.goto('https://google.com/');

// Click the "I agree" button
await page.click('button:has-text("I agree")');

// Type the query into the search box
await page.type('input[title="Search"]', 'hello world');

// Press enter
await page.keyboard.press('Enter');

await page.waitForTimeout(10000);
await browser.close();

import { chromium } from 'playwright';

const browser = await chromium.launch({ headless: false });

const page = await browser.newPage();

await page.goto('https://google.com/');

// Click the "I agree" button
await page.click('button:has-text("I agree")');

// Type the query into the search box
await page.type('input[title="Search"]', 'hello world');

// Press enter
await page.keyboard.press('Enter');

await page.waitForTimeout(10000);
await browser.close();

My Chromium launches, and loads the www.google.com page. However, there is no "I agree" button test to find so the code times out. I have tried waiting for the text on the sign in or don't sign in pop-up that does load on the Google page with the following, but that text is not detected and so I get another time out.

await page.click('button:has-text("Stay signed out")');

await page.click('button:has-text("Stay signed out")');

foreign-sapphireOP•2y ago

This is what the Google page that actually loads looks like.

Pepa J•2y ago

I think it is related to the cookie consent modal. That you might not see because you are outside of EU. Even the modal may changed the button label as the picture shows, thanks for letting us know we will try to update it.

foreign-sapphireOP•2y ago

Yes. it looks like that's what's up. I'm getting the sign in modal in the US (no GDPR to worry about here). But why wouldn't my "await page.click('button:has-text("Stay signed out")');" replacement find the text in the modal I do see? And if I comment out the "await" line for the modal, the

// Type the query into the search box
await page.type('input[title="Search"]', 'hello world');

// Type the query into the search box
await page.type('input[title="Search"]', 'hello world');

Doesn't work either, even if I manually click the "Stay signed out" button in the GUI before the script times out.

Pepa J•2y ago

@hargie I am sorry I can't reproduce the dialog. There might be some page logic that needs you to set the cursor on the button first before clicking etc. Are you waiting for the page to be fully loaded? What you mean by "it doesn't work"? are you waiting for the right selecteor? is the button really a <button> element?

Gaming

Programming

Noob Puppeteer Question

Did you find this page helpful?