diff --git a/src/transformers/inline.js b/src/transformers/inline.js index 9cfa6c31..13727aa5 100644 --- a/src/transformers/inline.js +++ b/src/transformers/inline.js @@ -189,30 +189,31 @@ export async function inline(html = '', options = {}) { // 1. `preferUnitlessValues` if (styleAttr) { - // Parse the inline styles using postcss - const root = postcss.parse(`* { ${styleAttr} }`) - - root.first.each((decl) => { - const property = decl.prop - let value = decl.value - - if (value && options.preferUnitlessValues) { - value = value.replace( - /\b0(px|rem|em|%|vh|vw|vmin|vmax|in|cm|mm|pt|pc|ex|ch)\b/g, - '0' - ) - } - - if (property) { - inlineStyles[property] = value - } - }) - - // Update the element's style attribute with the new value - $(el).attr( - 'style', - Object.entries(inlineStyles).map(([property, value]) => `${property}: ${value}`).join('; ') - ) + try { + const root = postcss.parse(`* { ${styleAttr} }`) + + root.first.each((decl) => { + const property = decl.prop + let value = decl.value + + if (value && options.preferUnitlessValues) { + value = value.replace( + /\b0(px|rem|em|%|vh|vw|vmin|vmax|in|cm|mm|pt|pc|ex|ch)\b/g, + '0' + ) + } + + if (property) { + inlineStyles[property] = value + } + }) + + // Update the element's style attribute with the new value + $(el).attr( + 'style', + Object.entries(inlineStyles).map(([property, value]) => `${property}: ${value}`).join('; ') + ) + } catch {} } // Get the classes from the element's class attribute diff --git a/test/transformers/inlineCSS.test.js b/test/transformers/inlineCSS.test.js index 1d77990e..a4d16dea 100644 --- a/test/transformers/inlineCSS.test.js +++ b/test/transformers/inlineCSS.test.js @@ -138,6 +138,19 @@ describe.concurrent('Inline CSS', () => {

test

`)) }) + test('`preferUnitlessValues` skips invalid inline CSS', async () => { + const result = cleanString( + await inlineCSS(` + +

test

` + ) + ) + + expect(result).toBe(cleanString(` + +

test

`)) + }) + test('Works with `excludedProperties` option', async () => { expect( cleanString(