How To Download Styles Via Chrome Debugger Api

I need to get styles with exact, not computed values for my extension. I can use document.styleSheets in some cases, but in case when css styles hosted on other domain, I am gettin

Solution 1:

The only problem I see is that frameId is an internal id of the frame which you can get from res.frameTree.frame.id, it's not related to tabId.

Might process all frames recursively, at least of the same origin, and use the modern syntax:

chrome.debugger.attach(debuggeeId, '1.3', async () => {
  constsend = (cmd, params = null) =>
    newPromise(resolve =>
      chrome.debugger.sendCommand(debuggeeId, cmd, params, resolve));
  awaitsend('Page.enable');
  const {frameTree} = awaitsend('Page.getResourceTree');
  const frameQueue = [frameTree];
  const results = [];
  for (const {frame, childFrames, resources} of frameQueue) {
    frameQueue.push(...childFrames);
    const frameId = frame.id;
    for (const {url, type} of resources) {
      if (type === 'Stylesheet') {
        results.push({
          url,
          frameUrl: frame.url,
          ...awaitsend('Page.getResourceContent', {frameId, url}),
        });
      }
    }
  }
  console.log(results);
});