Page.captureScreenshot transparent background?

[evan.m.r...@gmail.com]

I'm trying to replace PhantomJS with headless Chromium in my workflow to convert an SVG image to a PNG. The code is nothing special, here's the relevant snippet.

const captureScreenshot = (svgString) => new Promise((resolve, reject) => {

  Chrome.New().then((tab) => {

      return Chrome({ tab });

  }).then((client) => {

    client.send('Emulation.setVisibleSize', { height, width })

      .then(() => {

        client.Page.loadEventFired(() => {

          client.Page.captureScreenshot().then(data => {

            const img = new Buffer(data.data, 'base64');

            const tab = client.tab;

            Chrome.Close({ id: tab.id });

            resolve(img);

          }).catch(err => reject(err));

        });

        client.Page.enable();

        client.once('ready', () => {

          client.Page.navigate({ url: 'about:blank' })

            .then((result) => {

              client.Page.setDocumentContent({

                frameId: result.frameId,

                html: svgString,

              })

            });

        });

      })

  })

});

The problem I'm facing is that the resulting PNG buffer has a white background instead of the expected transparent background.

I've tried the obvious CSS to no avail.

<style>
html, body { margin: 0; padding: 0; background: transparent; }

svg { position: absolute; top: 0; left: 0; }
</style>

Is this a limitation or am I doing something wrong?

[Eric Seckler]

Hm, this sounds like a limitation. I think we're taking screenshots of the final composited result on the surface, which likely has a white background on its base layer. Maybe it's possible to make that configurable. FWIW, I tried setting the WebView's baseBackgroundColor to transparent, but this doesn't seem to be enough.

Feel free to file a bug about this with label "Proj-Headless". Thanks! :)

--
You received this message because you are subscribed to the Google Groups "headless-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to headless-dev...@chromium.org.
To post to this group, send email to headle...@chromium.org.
To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/headless-dev/af93eb75-87ab-4a2f-a642-c161afa466de%40chromium.org.

[Evan Rosenfeld]

Thanks, bug filed: https://bugs.chromium.org/p/chromium/issues/detail?id=689349

To unsubscribe from this group and stop receiving emails from it, send an email to headless-dev+unsubscribe@chromium.org.