Skip to content

Commit 6e02c64

Browse files
feat: allow to extend conditionNames (#1092)
1 parent edab08f commit 6e02c64

File tree

12 files changed

+241
-6
lines changed

12 files changed

+241
-6
lines changed

src/utils.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -530,7 +530,7 @@ function getWebpackResolver(
530530
const webpackModuleResolve = promiseResolve(
531531
resolverFactory({
532532
dependencyType: "sass",
533-
conditionNames: ["sass", "style"],
533+
conditionNames: ["sass", "style", "..."],
534534
mainFields: ["sass", "style", "main", "..."],
535535
mainFiles: ["_index", "index", "..."],
536536
extensions: [".sass", ".scss", ".css"],
@@ -541,7 +541,7 @@ function getWebpackResolver(
541541
const webpackImportResolve = promiseResolve(
542542
resolverFactory({
543543
dependencyType: "sass",
544-
conditionNames: ["sass", "style"],
544+
conditionNames: ["sass", "style", "..."],
545545
mainFields: ["sass", "style", "main", "..."],
546546
mainFiles: ["_index.import", "_index", "index.import", "index", "..."],
547547
extensions: [".sass", ".scss", ".css"],

test/__snapshots__/loader.test.js.snap

+120
Original file line numberDiff line numberDiff line change
@@ -334390,6 +334390,126 @@ exports[`loader should work with a package with "sass" and "exports" fields ('sa
334390334390

334391334391
exports[`loader should work with a package with "sass" and "exports" fields ('sass-embedded', 'legacy' API, 'scss' syntax): warnings 1`] = `[]`;
334392334392

334393+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme1) ('dart-sass', 'legacy' API, 'sass' syntax): css 1`] = `
334394+
".load-me {
334395+
color: red;
334396+
}"
334397+
`;
334398+
334399+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme1) ('dart-sass', 'legacy' API, 'sass' syntax): errors 1`] = `[]`;
334400+
334401+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme1) ('dart-sass', 'legacy' API, 'sass' syntax): warnings 1`] = `[]`;
334402+
334403+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme1) ('dart-sass', 'legacy' API, 'scss' syntax): css 1`] = `
334404+
".load-me {
334405+
color: red;
334406+
}"
334407+
`;
334408+
334409+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme1) ('dart-sass', 'legacy' API, 'scss' syntax): errors 1`] = `[]`;
334410+
334411+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme1) ('dart-sass', 'legacy' API, 'scss' syntax): warnings 1`] = `[]`;
334412+
334413+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme1) ('node-sass', 'legacy' API, 'sass' syntax): css 1`] = `
334414+
".load-me {
334415+
color: red; }
334416+
"
334417+
`;
334418+
334419+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme1) ('node-sass', 'legacy' API, 'sass' syntax): errors 1`] = `[]`;
334420+
334421+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme1) ('node-sass', 'legacy' API, 'sass' syntax): warnings 1`] = `[]`;
334422+
334423+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme1) ('node-sass', 'legacy' API, 'scss' syntax): css 1`] = `
334424+
".load-me {
334425+
color: red; }
334426+
"
334427+
`;
334428+
334429+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme1) ('node-sass', 'legacy' API, 'scss' syntax): errors 1`] = `[]`;
334430+
334431+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme1) ('node-sass', 'legacy' API, 'scss' syntax): warnings 1`] = `[]`;
334432+
334433+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme1) ('sass-embedded', 'legacy' API, 'sass' syntax): css 1`] = `
334434+
".load-me {
334435+
color: red;
334436+
}"
334437+
`;
334438+
334439+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme1) ('sass-embedded', 'legacy' API, 'sass' syntax): errors 1`] = `[]`;
334440+
334441+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme1) ('sass-embedded', 'legacy' API, 'sass' syntax): warnings 1`] = `[]`;
334442+
334443+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme1) ('sass-embedded', 'legacy' API, 'scss' syntax): css 1`] = `
334444+
".load-me {
334445+
color: red;
334446+
}"
334447+
`;
334448+
334449+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme1) ('sass-embedded', 'legacy' API, 'scss' syntax): errors 1`] = `[]`;
334450+
334451+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme1) ('sass-embedded', 'legacy' API, 'scss' syntax): warnings 1`] = `[]`;
334452+
334453+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme2) ('dart-sass', 'legacy' API, 'sass' syntax): css 1`] = `
334454+
".load-me {
334455+
color: blue;
334456+
}"
334457+
`;
334458+
334459+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme2) ('dart-sass', 'legacy' API, 'sass' syntax): errors 1`] = `[]`;
334460+
334461+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme2) ('dart-sass', 'legacy' API, 'sass' syntax): warnings 1`] = `[]`;
334462+
334463+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme2) ('dart-sass', 'legacy' API, 'scss' syntax): css 1`] = `
334464+
".load-me {
334465+
color: blue;
334466+
}"
334467+
`;
334468+
334469+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme2) ('dart-sass', 'legacy' API, 'scss' syntax): errors 1`] = `[]`;
334470+
334471+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme2) ('dart-sass', 'legacy' API, 'scss' syntax): warnings 1`] = `[]`;
334472+
334473+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme2) ('node-sass', 'legacy' API, 'sass' syntax): css 1`] = `
334474+
".load-me {
334475+
color: blue; }
334476+
"
334477+
`;
334478+
334479+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme2) ('node-sass', 'legacy' API, 'sass' syntax): errors 1`] = `[]`;
334480+
334481+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme2) ('node-sass', 'legacy' API, 'sass' syntax): warnings 1`] = `[]`;
334482+
334483+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme2) ('node-sass', 'legacy' API, 'scss' syntax): css 1`] = `
334484+
".load-me {
334485+
color: blue; }
334486+
"
334487+
`;
334488+
334489+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme2) ('node-sass', 'legacy' API, 'scss' syntax): errors 1`] = `[]`;
334490+
334491+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme2) ('node-sass', 'legacy' API, 'scss' syntax): warnings 1`] = `[]`;
334492+
334493+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme2) ('sass-embedded', 'legacy' API, 'sass' syntax): css 1`] = `
334494+
".load-me {
334495+
color: blue;
334496+
}"
334497+
`;
334498+
334499+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme2) ('sass-embedded', 'legacy' API, 'sass' syntax): errors 1`] = `[]`;
334500+
334501+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme2) ('sass-embedded', 'legacy' API, 'sass' syntax): warnings 1`] = `[]`;
334502+
334503+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme2) ('sass-embedded', 'legacy' API, 'scss' syntax): css 1`] = `
334504+
".load-me {
334505+
color: blue;
334506+
}"
334507+
`;
334508+
334509+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme2) ('sass-embedded', 'legacy' API, 'scss' syntax): errors 1`] = `[]`;
334510+
334511+
exports[`loader should work with a package with "sass" and "exports" fields and a custom condition (theme2) ('sass-embedded', 'legacy' API, 'scss' syntax): warnings 1`] = `[]`;
334512+
334393334513
exports[`loader should work with an alias ('dart-sass', 'legacy' API, 'sass' syntax): css 1`] = `
334394334514
"a {
334395334515
color: red;

test/helpers/getCodeFromSass.js

+27-2
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import fs from "fs";
44

55
import { klona } from "klona/full";
66

7-
async function getCodeFromSass(testId, options) {
7+
async function getCodeFromSass(testId, options, context = {}) {
88
const loaderOptions = klona(options);
99
let sassOptions = options.sassOptions || {};
1010

@@ -56,6 +56,27 @@ async function getCodeFromSass(testId, options) {
5656
testFolder,
5757
"node_modules/package-with-exports/style.scss"
5858
);
59+
const pathToSassPackageWithExportsFieldsAndCustomConditionReplacer = () => {
60+
if (context.packageExportsCustomConditionTestVariant === 1) {
61+
return path.resolve(
62+
testFolder,
63+
"node_modules/package-with-exports-and-custom-condition/style-1.scss"
64+
);
65+
}
66+
67+
if (context.packageExportsCustomConditionTestVariant === 2) {
68+
return path.resolve(
69+
testFolder,
70+
"node_modules/package-with-exports-and-custom-condition/style-2.scss"
71+
);
72+
}
73+
74+
console.warn(
75+
"Expedted to receive .packageExportsCustomConditionTestVariant to properly resolve stylesheet in sass only compilation. "
76+
);
77+
return "";
78+
};
79+
5980
const pathToSCSSPackageWithIndexFile = path.resolve(
6081
testFolder,
6182
"node_modules/scss-package-with-index/index.scss"
@@ -765,7 +786,11 @@ async function getCodeFromSass(testId, options) {
765786
)
766787
.replace(/^~package-with-js-main-field/, pathToPackageWithJsMainField)
767788
.replace(/^~package-with-index/, pathToPackageWithIndex)
768-
.replace(/^package-with-exports/, pathToSassPackageWithExportsFields)
789+
.replace(
790+
/^package-with-exports-and-custom-condition$/,
791+
pathToSassPackageWithExportsFieldsAndCustomConditionReplacer
792+
)
793+
.replace(/^package-with-exports$/, pathToSassPackageWithExportsFields)
769794
.replace(/^file:\/\/\/language/, pathToLanguage)
770795
.replace(/^\/sass\/language.sass/, pathToLanguage)
771796
.replace(/^\/scss\/language.scss/, pathToLanguage)

test/loader.test.js

+58
Original file line numberDiff line numberDiff line change
@@ -1037,6 +1037,64 @@ describe("loader", () => {
10371037
});
10381038
}
10391039

1040+
if (!isModernAPI) {
1041+
it(`should work with a package with "sass" and "exports" fields and a custom condition (theme1) ('${implementationName}', '${api}' API, '${syntax}' syntax)`, async () => {
1042+
const testId = getTestId(
1043+
"import-package-with-exports-and-custom-condition",
1044+
syntax
1045+
);
1046+
const options = {
1047+
implementation,
1048+
api,
1049+
};
1050+
const compiler = getCompiler(testId, {
1051+
loader: { options },
1052+
resolve: {
1053+
conditionNames: ["theme1", "..."],
1054+
},
1055+
});
1056+
const stats = await compile(compiler);
1057+
const codeFromBundle = getCodeFromBundle(stats, compiler);
1058+
const codeFromSass = await getCodeFromSass(testId, options, {
1059+
packageExportsCustomConditionTestVariant: 1,
1060+
});
1061+
1062+
expect(codeFromBundle.css).toBe(codeFromSass.css);
1063+
expect(codeFromBundle.css).toMatchSnapshot("css");
1064+
expect(getWarnings(stats)).toMatchSnapshot("warnings");
1065+
expect(getErrors(stats)).toMatchSnapshot("errors");
1066+
});
1067+
}
1068+
1069+
if (!isModernAPI) {
1070+
it(`should work with a package with "sass" and "exports" fields and a custom condition (theme2) ('${implementationName}', '${api}' API, '${syntax}' syntax)`, async () => {
1071+
const testId = getTestId(
1072+
"import-package-with-exports-and-custom-condition",
1073+
syntax
1074+
);
1075+
const options = {
1076+
implementation,
1077+
api,
1078+
};
1079+
const compiler = getCompiler(testId, {
1080+
loader: { options },
1081+
resolve: {
1082+
conditionNames: ["theme2", "..."],
1083+
},
1084+
});
1085+
const stats = await compile(compiler);
1086+
const codeFromBundle = getCodeFromBundle(stats, compiler);
1087+
const codeFromSass = await getCodeFromSass(testId, options, {
1088+
packageExportsCustomConditionTestVariant: 2,
1089+
});
1090+
1091+
expect(codeFromBundle.css).toBe(codeFromSass.css);
1092+
expect(codeFromBundle.css).toMatchSnapshot("css");
1093+
expect(getWarnings(stats)).toMatchSnapshot("warnings");
1094+
expect(getErrors(stats)).toMatchSnapshot("errors");
1095+
});
1096+
}
1097+
10401098
if (!isModernAPI) {
10411099
it(`should support resolving using the "file" schema ('${implementationName}', '${api}' API, '${syntax}' syntax)`, async () => {
10421100
const testId = getTestId("import-file-scheme", syntax);

test/node_modules/package-with-exports-and-custom-condition/index.cjs

+1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

test/node_modules/package-with-exports-and-custom-condition/index.js

+1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

test/node_modules/package-with-exports-and-custom-condition/package.json

+22
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

test/node_modules/package-with-exports-and-custom-condition/style-1.scss

+3
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

test/node_modules/package-with-exports-and-custom-condition/style-2.scss

+3
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

test/node_modules/package-with-exports/package.json

+2-2
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
@import 'package-with-exports-and-custom-condition'
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
@import 'package-with-exports-and-custom-condition';

0 commit comments

Comments
 (0)