Integrating Strapi logging with Puppeteer: How to make it work?

Other Questions Puppeteer
1

I’m trying to get Strapi’s logging to work with Puppeteer, but I’m running into some issues. I’ve set up Strapi and it’s working fine in the main app. However, when I pass the log function to Puppeteer, it’s not behaving as expected.

The console shows some output, but the messages inside Puppeteer’s evaluate function aren’t showing up. I’m not sure what’s going wrong here.

Here’s a simplified version of my Puppeteer code:

async function scrapePage(log) {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  
  log && page.on('console', msg => log('Browser Log:', msg.text()));
  
  await page.goto('https://example.com');
  
  const results = await page.evaluate(() => {
    console.log('This message is not visible');
    return 'Some data';
  });
  
  await browser.close();
  return results;
}

// Calling the function
scrapePage(strapi.log.debug.bind(strapi.log));

My Strapi logging config looks like this:

// config/logger.js
module.exports = {
  level: 'debug',
  transports: [
    // Console transport configuration
  ]
};

Any ideas on how to make Strapi’s logging work properly with Puppeteer? Thanks!

2

I’ve dealt with this exact problem before, and it can be quite frustrating. One thing that worked for me was using the ‘page.on(‘console’)’ event listener outside of the evaluate function. Here’s a snippet that might help:

async function scrapePage(log) {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  
  page.on('console', message => {
    log('Browser Log:', message.text());
  });
  
  await page.goto('https://example.com');
  
  const results = await page.evaluate(() => {
    console.log('This message should now be visible');
    return 'Some data';
  });
  
  await browser.close();
  return results;
}

This approach captures all console messages from the page, including those inside evaluate(). Also, make sure your Strapi log level is set to ‘debug’ in your environment configuration. If you’re still having issues, you might want to check if there are any conflicts with other logging libraries or browser extensions.

3

I encountered a similar challenge when integrating Strapi logging with Puppeteer. One effective solution I found was to use the page.exposeFunction() method to bridge the gap between the browser context and Node.js environment. Here’s an approach that worked for me:

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

await page.exposeFunction(‘nodeLog’, (…args) => log(…args));

await page.evaluate(() => {
console.log = (…args) => window.nodeLog(‘Browser Log:’, …args);
});

await page.goto(‘https://example.com’);

const results = await page.evaluate(() => {
console.log(‘This message should now be visible’);
return ‘Some data’;
});

await browser.close();
return results;
}

This method overrides the console.log function in the browser context to use the exposed nodeLog function, which then calls your Strapi log function. It should capture all console logs, including those within page.evaluate().

4

hey there! i’ve run into similar issues. try adding dumpio: true to your puppeteer.launch() options. it’ll pipe browser process stdout and stderr to node process. Also, make sure you’re not using headless mode, as it can sometimes suppress console output. hope this helps!