Why is Puppeteer Rendering a Blank Image When Trying to Take a Screenshot?

Help
1

This topic was automatically generated from Slack. You can find the original thread here.

I’m trying to use Puppeteer to take a screenshot, but I’m getting a blank image. What could be wrong?

2

I’m sorry to hear you’re having trouble with Puppeteer. To help you better, I’ll need more information about your setup and the code you’re using. In the meantime, you can try using the Pipedream’s Puppeteer integration to take a screenshot of a page by following these steps: 1. Search for the Puppeteer app from the step menu 2. Select the Screenshot a Page action 3. Connect your Puppeteer account 4. Select a URL or pass a string from a previous step. 5. At the bottom of the step, click Test to run the action and test the configuration. If you still need assistance, please provide more details about your issue, and I’ll be happy to help.

3

Some sites like X.com might employ anti-scraping methods. Which site are you trying to scrape?

4

tradingview.com
Ex:

5

Currently, I am using Browserless, but I wanted to test how it would be using Puppeteer.

6

You might need to wait for the page to render the chart. I believe the issue might be that the page is rendered by JS that needs to pull the data after the HTML is delivered.

7

I was able to get a screenshot after waiting for 3 seconds

Imgur

8 
import { puppeteer } from '@pipedream/browsers';

export default defineComponent({
  async run({ steps, $ }) {
    const browser = await puppeteer.browser();
    const page = await browser.newPage();
    await page.goto('https://www.tradingview.com/chart/ckDA1emo/?symbol=SAXO%3ACHFSGD&interval=D');
    await page.waitForTimeout(3000);
    const screenshot = await page.screenshot({ fullPage: true });
    await browser.close();
    return screenshot.toString('base64');
  },
});
9

Perfect!! Thank you very much!

10

I started receiving the following error now in Puppeteer:

Error
Failed to launch the browser process! TROUBLESHOOTING: https://pptr.dev/troubleshooting

DETAILS
    at null.onClose (file:///pipedream/dist/code/33e98d70beb820d345d07da7a90544bbf5f6c17280cc97f74def6d424d83ea49/node_modules/.pnpm/puppeteer-core@19.8.0/node_modules/puppeteer-core/lib/esm/puppeteer/node/BrowserRunner.js:270:20)
    at Interface.null (file:///pipedream/dist/code/33e98d70beb820d345d07da7a90544bbf5f6c17280cc97f74def6d424d83ea49/node_modules/.pnpm/puppeteer-core@19.8.0/node_modules/puppeteer-core/lib/esm/puppeteer/node/BrowserRunner.js:258:24)
    at Interface.emit (node:events:529:35)
    at Interface.close (node:internal/readline/interface:534:10)
    at Socket.onend (node:internal/readline/interface:260:10)
    at Socket.emit (node:events:529:35)
    at null.endReadableNT (node:internal/streams/readable:1368:12)
    at process.processTicksAndRejections (node:internal/process/task_queues:82:21)
11

Hi Higor, have you tried updating your workflow settings to use 2 gbs of memory? Instead of the 256 mb default?

12

I’m using 1 GB. I will try with 2 GB. Thanks

13

We have also shipped a new version of the @pipedream/browsers package, you’ll just need to make a small change to your workflow like adding a comment to the code step and redeploy it to pull the latest version of the package with a potential fix for the intermittent cache issue.

14

Ok! Thanks!