diff --git a/src/transformers/index.js b/src/transformers/index.js index bff21bd1..1f84e565 100644 --- a/src/transformers/index.js +++ b/src/transformers/index.js @@ -53,7 +53,7 @@ exports.addURLParams = (html, config) => addURLParams(html, config, true) exports.preventWidows = (html, config) => preventWidows(html, config) exports.replaceStrings = (html, config) => replaceStrings(html, config, true) exports.safeClassNames = (html, config) => safeClassNames(html, config, true) -exports.removeUnusedCSS = (html, config) => removeUnusedCSS(html, config) +exports.removeUnusedCSS = (html, config) => removeUnusedCSS(html, config, true) exports.removeAttributes = (html, config) => removeAttributes(html, config, true) exports.attributeToStyle = (html, config) => attributeToStyle(html, config, true) exports.removeInlineSizes = (html, config) => removeInlineSizes(html, config, true) diff --git a/src/transformers/removeUnusedCss.js b/src/transformers/removeUnusedCss.js index 60c79a74..c8269e90 100644 --- a/src/transformers/removeUnusedCss.js +++ b/src/transformers/removeUnusedCss.js @@ -1,10 +1,12 @@ const {comb} = require('email-comb') -const {get, merge} = require('lodash') +const {get, merge, isEmpty, isObject} = require('lodash') const removeInlinedClasses = require('./removeInlinedSelectors') -module.exports = async (html, config = {}) => { - // If it's explicitly disabled, return the HTML - if (get(config, 'removeUnusedCSS') === false) { +module.exports = async (html, config = {}, direct = false) => { + config = direct ? config : get(config, 'removeUnusedCSS') + + // Don't purge CSS if `removeUnusedCSS` is not set + if (!config || (isObject(config) && isEmpty(config))) { return html } @@ -34,9 +36,13 @@ module.exports = async (html, config = {}) => { whitelist: [...get(config, 'whitelist', []), ...safelist] } - const options = merge(defaultOptions, get(config, 'removeUnusedCSS', config)) + const options = merge(defaultOptions, get(config, 'removeUnusedCSS', {})) - html = await removeInlinedClasses(html, options) + /** + * Remove possibly inlined selectors, as long as we're not calling + * this function directly, i.e. Maizzle.removeUnusedCSS() + * */ + html = direct ? html : await removeInlinedClasses(html, options) return comb(html, options).result } diff --git a/test/test-posthtml.js b/test/test-posthtml.js index 19b47fec..0fde4bf2 100644 --- a/test/test-posthtml.js +++ b/test/test-posthtml.js @@ -60,8 +60,7 @@ test('components', async t => { components: { folders: ['test/stubs/layouts', 'test/stubs/components'] } - }, - removeUnusedCSS: false + } }, beforeRender(html, config) { config.foo = 'bar' @@ -90,8 +89,7 @@ test('components (legacy)', async t => { delimiters: ['[[', ']]'] } } - }, - removeUnusedCSS: false + } } } diff --git a/test/test-transformers.js b/test/test-transformers.js index 9c209998..6ce551e7 100644 --- a/test/test-transformers.js +++ b/test/test-transformers.js @@ -163,12 +163,12 @@ test('remove unused CSS', async t => { @@ -182,32 +182,19 @@ test('remove unused CSS', async t => { - - -
test div with some text
- - ` - - const unsetResult = ` - - - + .bar-baz {color: blue} +
test div with some text
` - const disabled = await Maizzle.removeUnusedCSS(html, {removeUnusedCSS: false}) + const disabled = await Maizzle.removeUnusedCSS(html) const withOptions = await Maizzle.removeUnusedCSS(html, {whitelist: ['.bar*']}) - const unset = await Maizzle.removeUnusedCSS(html) t.is(disabled, html) t.is(withOptions, withOptionsResult) - t.is(unset, unsetResult) }) test('remove attributes', async t => {