Puppeteer won't load images if page is loaded using setContent

user_4416181 0
Viewed 1650

I'm facing the problem that Puppeteer does not load resources specified with relative path (e.g. background.png in image src or css url()). So that then I load content of the local file using setContent() the result is very different from then I do the same but using goto(file://).

Apparently, then one uses 'setContent()' the page stays at 'about:page' with prevents resources with relative paths to load. I wonder if there any way to specify document location and load content from the string?

I would use goto but I need to pre-process the html first with Handlebar.

For now, I do the following:

    await page.goto(framePath);
    let content = await page.content();

    //Preprocess content here
    
    await page.setContent(processedContent);

but it does not feel right, and I wonder if the is a better solution.

puppeteer node.js webautomation javascript
1 Answers

setContent internally is nothing more than this function call:

await this.evaluate(html => {
  document.open();
  document.write(html);
  document.close();
}, html);

Basically, it writes HTML on the document already loaded. Using goto to give some location is not bad at all. You could create an empty.html page, and use that as your own located empty canvas.

user_23732490
Related