0

I'm trying to get all styles for all nodes on page and for that i want to use CSS.getMatchedStylesForNode from devtool-protocol, but its only working for one node. If loop through an array of nodes i get a lot of warning in console(code below) and nothing is returned. What i'm doing wrong ?

warning in console:

(node:5724) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 11): Error: Protocol error (CSS.getMatchedStylesForNode): Target closed.

my code

'use strict';

const puppeteer = require('puppeteer');

(async () => {
    const browser = await puppeteer.launch();
    const page = await browser.newPage();
    await page.goto('https://example.com');
    await page._client.send('DOM.enable');
    await page._client.send('CSS.enable');
    const doc = await page._client.send('DOM.getDocument');
    const nodes = await page._client.send('DOM.querySelectorAll', {
        nodeId: doc.root.nodeId,
        selector: '*'
    });

    const styleForSingleNode = await page._client.send('CSS.getMatchedStylesForNode', {nodeId: 3});
    const stylesForNodes = nodes.nodeIds.map(async (id) => {
        return await page._client.send('CSS.getMatchedStylesForNode', {nodeId: id});
    });

    console.log(JSON.stringify(stylesForNodes));
    console.log(JSON.stringify(styleForSingleNode));

    await browser.close();
})();
  • Puppeteer version: 0.13.0
  • Platform: Window 10
  • Node: 8.9.3
  • Try iterating the array sequentially. Currently you open connections for all nodes simultaneously. – wOxxOm Dec 19 '17 at 00:02

1 Answers1

3

Works using for of loop

const stylesForNodes = []
for (id of nodes.nodeIds) {
  stylesForNodes.push(await page._client.send('CSS.getMatchedStylesForNode', {nodeId: id}));
}