diff --git a/.cspell.json b/.cspell.json index b85d24a8..0ad02b86 100644 --- a/.cspell.json +++ b/.cspell.json @@ -15,7 +15,8 @@ "klona", "sharename", "wekbit", - "commitlint" + "commitlint", + "bgcolor" ], "ignorePaths": [ diff --git a/lint-staged.config.js b/lint-staged.config.js index 4e51a30d..372e7ffc 100644 --- a/lint-staged.config.js +++ b/lint-staged.config.js @@ -1,4 +1,4 @@ module.exports = { - "*": ["prettier --write --ignore-unknown", "cspell"], + "*": ["prettier --write --ignore-unknown", "cspell --no-must-find-files"], "*.js": ["eslint --cache --fix"], }; diff --git a/src/index.js b/src/index.js index 2b0a0a0e..6dbcedf3 100644 --- a/src/index.js +++ b/src/index.js @@ -97,14 +97,16 @@ async function loader(content) { // Modern API if (typeof result.loadedUrls !== "undefined") { - result.loadedUrls.forEach((includedFile) => { - const normalizedIncludedFile = url.fileURLToPath(includedFile); - - // Custom `importer` can return only `contents` so includedFile will be relative - if (path.isAbsolute(normalizedIncludedFile)) { - this.addDependency(normalizedIncludedFile); - } - }); + result.loadedUrls + .filter((url) => url.protocol === "file") + .forEach((includedFile) => { + const normalizedIncludedFile = url.fileURLToPath(includedFile); + + // Custom `importer` can return only `contents` so includedFile will be relative + if (path.isAbsolute(normalizedIncludedFile)) { + this.addDependency(normalizedIncludedFile); + } + }); } // Legacy API else if ( diff --git a/test/__snapshots__/sassOptions-option.test.js.snap b/test/__snapshots__/sassOptions-option.test.js.snap index b270af18..55bee5f2 100644 --- a/test/__snapshots__/sassOptions-option.test.js.snap +++ b/test/__snapshots__/sassOptions-option.test.js.snap @@ -4158,6 +4158,22 @@ exports[`sassOptions option should work when the option like "Object" ('sass-emb exports[`sassOptions option should work when the option like "Object" ('sass-embedded', 'modern' API, 'scss' syntax): warnings 1`] = `[]`; +exports[`sassOptions option should work with custom scheme import ('dart-sass', 'modern' API, 'sass' syntax): errors 1`] = `[]`; + +exports[`sassOptions option should work with custom scheme import ('dart-sass', 'modern' API, 'sass' syntax): warnings 1`] = `[]`; + +exports[`sassOptions option should work with custom scheme import ('dart-sass', 'modern' API, 'scss' syntax): errors 1`] = `[]`; + +exports[`sassOptions option should work with custom scheme import ('dart-sass', 'modern' API, 'scss' syntax): warnings 1`] = `[]`; + +exports[`sassOptions option should work with custom scheme import ('sass-embedded', 'modern' API, 'sass' syntax): errors 1`] = `[]`; + +exports[`sassOptions option should work with custom scheme import ('sass-embedded', 'modern' API, 'sass' syntax): warnings 1`] = `[]`; + +exports[`sassOptions option should work with custom scheme import ('sass-embedded', 'modern' API, 'scss' syntax): errors 1`] = `[]`; + +exports[`sassOptions option should work with custom scheme import ('sass-embedded', 'modern' API, 'scss' syntax): warnings 1`] = `[]`; + exports[`sassOptions option should work with the "fiber" option ('dart-sass', 'legacy' API, 'sass' syntax): css 1`] = ` "@charset "UTF-8"; @import "./file.css"; diff --git a/test/sass/modern-vars.sass b/test/sass/modern-vars.sass new file mode 100644 index 00000000..35c06b47 --- /dev/null +++ b/test/sass/modern-vars.sass @@ -0,0 +1 @@ +$color-fg: #000 diff --git a/test/sass/modern.sass b/test/sass/modern.sass new file mode 100644 index 00000000..3f38808d --- /dev/null +++ b/test/sass/modern.sass @@ -0,0 +1,6 @@ +@import 'modern-vars' +// this is import by custom importer +@import 'bgcolor:cornflowerblue' + +a + --color-fg: $color-fg diff --git a/test/sassOptions-option.test.js b/test/sassOptions-option.test.js index bac298e5..07a65d26 100644 --- a/test/sassOptions-option.test.js +++ b/test/sassOptions-option.test.js @@ -149,6 +149,39 @@ describe("sassOptions option", () => { expect(getWarnings(stats)).toMatchSnapshot("warnings"); expect(getErrors(stats)).toMatchSnapshot("errors"); }); + + it(`should work with custom scheme import ('${implementationName}', '${api}' API, '${syntax}' syntax)`, async () => { + const testId = getTestId("modern", syntax); + const options = { + implementation, + api, + sassOptions: { + // https://sass-lang.com/documentation/js-api/interfaces/Importer + importers: [ + { + canonicalize(url) { + if (!url.startsWith("bgcolor:")) { + return null; + } + + return new URL(url); + }, + load(canonicalUrl) { + return { + contents: `body {background-color: ${canonicalUrl.pathname}}`, + syntax: "scss", + }; + }, + }, + ], + }, + }; + const compiler = getCompiler(testId, { loader: { options } }); + const stats = await compile(compiler); + + expect(getWarnings(stats)).toMatchSnapshot("warnings"); + expect(getErrors(stats)).toMatchSnapshot("errors"); + }); } else { it(`should ignore the "file" option ('${implementationName}', '${api}' API, '${syntax}' syntax)`, async () => { const testId = getTestId("language", syntax); diff --git a/test/scss/modern-vars.scss b/test/scss/modern-vars.scss new file mode 100644 index 00000000..a46f606a --- /dev/null +++ b/test/scss/modern-vars.scss @@ -0,0 +1 @@ +$color-fg: #000; diff --git a/test/scss/modern.scss b/test/scss/modern.scss new file mode 100644 index 00000000..e06a74ce --- /dev/null +++ b/test/scss/modern.scss @@ -0,0 +1,7 @@ +@import 'modern-vars'; +// this is import by custom importer +@import 'bgcolor:cornflowerblue'; + +a { + --color-fg: $color-fg; +}