diff --git a/lib/data-url.js b/lib/data-url.js index a59c5fb5..69c4ce94 100644 --- a/lib/data-url.js +++ b/lib/data-url.js @@ -1,14 +1,26 @@ "use strict" -const dataURLRegexp = /^data:text\/css;base64,/i +const anyDataURLRegexp = /^data:text\/css(?:;(base64|plain))?,/i +const base64DataURLRegexp = /^data:text\/css;base64,/i +const plainDataURLRegexp = /^data:text\/css;plain,/i function isValid(url) { - return dataURLRegexp.test(url) + return anyDataURLRegexp.test(url) } function contents(url) { - // "data:text/css;base64,".length === 21 - return Buffer.from(url.slice(21), "base64").toString() + if (base64DataURLRegexp.test(url)) { + // "data:text/css;base64,".length === 21 + return Buffer.from(url.slice(21), "base64").toString() + } + + if (plainDataURLRegexp.test(url)) { + // "data:text/css;plain,".length === 20 + return decodeURIComponent(url.slice(20)) + } + + // "data:text/css,".length === 14 + return decodeURIComponent(url.slice(14)) } module.exports = { diff --git a/lib/parse-styles.js b/lib/parse-styles.js index 06bb755c..d26f0f8e 100644 --- a/lib/parse-styles.js +++ b/lib/parse-styles.js @@ -91,6 +91,11 @@ async function resolveImportId(result, stmt, options, state, postcss) { postcss ) + return + } else if (dataURL.isValid(stmt.from.slice(-1))) { + // Data urls can't be used a base url to resolve imports. + // When the parent statement has a data url + // and the current statement doesn't have a data url we ignore the statement. return } diff --git a/test/fixtures/data-url.css b/test/fixtures/data-url.css index 6f1276ef..4b2b4b37 100644 --- a/test/fixtures/data-url.css +++ b/test/fixtures/data-url.css @@ -4,3 +4,7 @@ /* Mixed imports: */ @import url(data:text/css;base64,QGltcG9ydCB1cmwoZm9vLmNzcyk7CgpwIHsKICBjb2xvcjogYmx1ZTsKfQo=); @import url(data-url.css); + +/* url encoded: */ +@import url(data:text/css;plain,bar%20%7B%20color%3A%20green%20%7D); +@import url(data:text/css,bar%20%7B%20color%3A%20pink%20%7D); diff --git a/test/fixtures/data-url.expected.css b/test/fixtures/data-url.expected.css index 207253e4..af160fc5 100644 --- a/test/fixtures/data-url.expected.css +++ b/test/fixtures/data-url.expected.css @@ -1,24 +1,6 @@ -p { color: green; } +@import url(foo.css);p { color: green; }p { color: blue; }@media (min-width: 320px){@layer foo{ +p { color: green; } } }@media (min-width: 320px){@layer foo{ -p { color: blue; } - -@media (min-width: 320px) { - - @layer foo { -p { color: green; } } } - -@media (min-width: 320px) { - - @layer foo { - -p { color: blue; } } } - -/* Mixed imports: */ - -foo{} - -p { +p { color: blue; } } }/* Mixed imports: */p { color: blue; -} - -p { color: pink; } +}p { color: pink; }/* url encoded: */bar { color: green }bar { color: pink }