diff --git a/readme.md b/readme.md index 26c6419..fda4044 100644 --- a/readme.md +++ b/readme.md @@ -56,9 +56,9 @@ npm install extract-css-core yarn add extract-css-core ``` -## Problem, solution and shortcomings +## Motivation, solution and shortcomings -### Problem +### Motivation Existing packages like [get-css](https://github.com/cssstats/cssstats/tree/master/packages/get-css) @@ -95,6 +95,14 @@ Default: `exclude` Possible values: `exclude`, `include` +#### inlineStyles + +Type: `String` + +Default: `include` + +Possible values: `exclude`, `include` + #### waitUntil Type: `String` diff --git a/src/index.js b/src/index.js index 23235de..1e014ef 100644 --- a/src/index.js +++ b/src/index.js @@ -14,7 +14,7 @@ InvalidUrlError.prototype = Error.prototype * @param {string} waitUntil https://github.com/puppeteer/puppeteer/blob/master/docs/api.md#pagegotourl-options * @returns {string} All CSS that was found */ -module.exports = async (url, {waitUntil = 'networkidle0', origins = 'exclude'} = {}) => { +module.exports = async (url, {waitUntil = 'networkidle0', origins = 'exclude', inlineStyles = 'include'} = {}) => { // Setup a browser instance const browser = await puppeteer.launch() @@ -82,15 +82,18 @@ module.exports = async (url, {waitUntil = 'networkidle0', origins = 'exclude'} = // CSSRule: // [x-extract-css-inline-style] { color: red; } // - const inlineCssRules = await page.evaluate(() => { - return [...document.querySelectorAll('[style]')] - .map(element => element.getAttribute('style')) - // Filter out empty style="" attributes - .filter(Boolean) - }) - const inlineCss = inlineCssRules - .map(rule => `[x-extract-css-inline-style] { ${rule} }`) - .map(css => ({type: 'inline', href: url, css})) + let inlineCss = [] + if (inlineStyles !== 'exclude') { + const inlineCssRules = await page.evaluate(() => { + return [...document.querySelectorAll('[style]')] + .map(element => element.getAttribute('style')) + // Filter out empty style="" attributes + .filter(Boolean) + }) + inlineCss = inlineCssRules + .map(rule => `[x-extract-css-inline-style] { ${rule} }`) + .map(css => ({type: 'inline', href: url, css})) + } const links = coverage // Filter out the