Trouble passing the page object to a function in Puppeteer

Other Questions Puppeteer
1

I’m having issues with Puppeteer when I try to check for elements on a page using a function. I want the function to continue if the element is there, or log an error if it’s not. Here’s what I’ve tried:

const browser = await puppeteer.launch();
const page = await browser.newPage();

function checkElement(selector, pageObj) {
  try {
    await pageObj.waitForSelector(selector, { timeout: 1500 });
  } catch (error) {
    console.error('Element not found:', error);
    await browser.close();
  }
}

await page.goto('https://www.somewebsite.com');
checkElement('#target-element', page);

console.log('Finished');
await browser.close();

But I keep getting a ‘SyntaxError: Unexpected identifier’ message. It seems like the ‘page’ object isn’t being recognized in the function. I’ve tried passing it as a parameter, but I’m still getting the same error.

What’s the correct way to use the page object inside a function with Puppeteer? Any help would be great!

2

hey, i’ve dealt with this before. the issue is prolly that ur function isn’t async. try changing it to:

async function checkElement(selector, pageObj) {
// rest of ur code
}

and then call it like:

await checkElement(‘#target-element’, page);

that should fix the syntax error ur seeing. good luck!

3

I’ve run into similar issues with Puppeteer before, and I think I see what’s going on here. The problem is likely that your checkElement function is synchronous, but you’re using await inside it. This won’t work as expected.

Here’s how I’d modify your code to make it work:

const browser = await puppeteer.launch();
const page = await browser.newPage();

async function checkElement(selector, pageObj) {
  try {
    await pageObj.waitForSelector(selector, { timeout: 1500 });
  } catch (error) {
    console.error('Element not found:', error);
    await browser.close();
  }
}

await page.goto('https://www.somewebsite.com');
await checkElement('#target-element', page);

console.log('Finished');
await browser.close();

The key changes are making checkElement an async function and using await when calling it. This should resolve your SyntaxError and allow the page object to be recognized correctly within the function.

Remember, when working with Puppeteer, most operations are asynchronous, so you’ll often need to use async/await throughout your code.

4

The previous responses are on the right track, but there’s another aspect to consider. Your code structure suggests you’re mixing top-level await with regular function declarations, which isn’t allowed outside of modules. To resolve this, you should wrap your main logic in an async function:

async function main() {
const browser = await puppeteer.launch();
const page = await browser.newPage();

async function checkElement(selector, pageObj) {
try {
await pageObj.waitForSelector(selector, { timeout: 1500 });
} catch (error) {
console.error(‘Element not found:’, error);
await browser.close();
}
}

await page.goto(‘https://www.somewebsite.com’);
await checkElement(‘#target-element’, page);

console.log(‘Finished’);
await browser.close();
}

main().catch(console.error);

This approach ensures all asynchronous operations are properly handled and should resolve your syntax error. It’s a common pattern when working with Puppeteer and other asynchronous libraries.