Puppeteer log inside page.evaluate

Question

How can I console.log something inside the page.evaluate, passing it to node and using it during the evaluation of the page?

I actually want to log

Answer 1

Update for version 1.15.x and above - Jan 2020

In the latest version args has been replaced with _args.

So when you are using page.evaluate() or page.evaluateHandle() and you want to get the console.log() text from the browser context back to node, use the following code and make sure to set the listener before any console.log() calls:

Code:

    // First we register our listener.
    page.on('console', msg => {
    for (let i = 0; i < msg._args.length; ++i)
        console.log(`${i}: ${msg._args[i]}`);
    });

    // Then we call the log.
    page.evaluate(() => console.log('Hello World'));

Explanation:

You can't see the console.log() text in your node console or set node breakpoints inside page.evaluate() or page.evaluateHandle(), because the code inside those functions is running only in the browser context. If you would launch puppeteer in none headless mode you would see the console.log() message showing in the browser.

Sidenote:

In most cases you don't really need to log inside the browser context and you can do the same work in the 'Console' tab of your browser 'Developer tools' section.