From e022e3bb405472ac7d51ff1114783fc2811dfe04 Mon Sep 17 00:00:00 2001 From: Alexander Akait <4567934+alexander-akait@users.noreply.github.com> Date: Wed, 3 Apr 2024 14:16:30 +0300 Subject: [PATCH] fix: do not break `@scope` at-rule without params (#1581) --- package-lock.json | 14 ++--- package.json | 2 +- .../__snapshots__/modules-option.test.js.snap | 63 +++++++++++++++++++ test/fixtures/modules/composes/global.css | 13 ++++ test/fixtures/modules/composes/global.js | 5 ++ test/fixtures/modules/scope/css.css | 6 ++ test/modules-option.test.js | 16 +++++ 7 files changed, 111 insertions(+), 8 deletions(-) create mode 100644 test/fixtures/modules/composes/global.css create mode 100644 test/fixtures/modules/composes/global.js diff --git a/package-lock.json b/package-lock.json index b56cb1e6..672d6c2b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -12,7 +12,7 @@ "icss-utils": "^5.1.0", "postcss": "^8.4.33", "postcss-modules-extract-imports": "^3.0.0", - "postcss-modules-local-by-default": "^4.0.4", + "postcss-modules-local-by-default": "^4.0.5", "postcss-modules-scope": "^3.1.2", "postcss-modules-values": "^4.0.0", "postcss-value-parser": "^4.2.0", @@ -13026,9 +13026,9 @@ } }, "node_modules/postcss-modules-local-by-default": { - "version": "4.0.4", - "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-4.0.4.tgz", - "integrity": "sha512-L4QzMnOdVwRm1Qb8m4x8jsZzKAaPAgrUF1r/hjDR2Xj7R+8Zsf97jAlSQzWtKx5YNiNGN8QxmPFIc/sh+RQl+Q==", + "version": "4.0.5", + "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-4.0.5.tgz", + "integrity": "sha512-6MieY7sIfTK0hYfafw1OMEG+2bg8Q1ocHCpoWLqOKj3JXlKu4G7btkmM/B7lFubYkYWmRSPLZi5chid63ZaZYw==", "dependencies": { "icss-utils": "^5.0.0", "postcss-selector-parser": "^6.0.2", @@ -25518,9 +25518,9 @@ "requires": {} }, "postcss-modules-local-by-default": { - "version": "4.0.4", - "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-4.0.4.tgz", - "integrity": "sha512-L4QzMnOdVwRm1Qb8m4x8jsZzKAaPAgrUF1r/hjDR2Xj7R+8Zsf97jAlSQzWtKx5YNiNGN8QxmPFIc/sh+RQl+Q==", + "version": "4.0.5", + "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-4.0.5.tgz", + "integrity": "sha512-6MieY7sIfTK0hYfafw1OMEG+2bg8Q1ocHCpoWLqOKj3JXlKu4G7btkmM/B7lFubYkYWmRSPLZi5chid63ZaZYw==", "requires": { "icss-utils": "^5.0.0", "postcss-selector-parser": "^6.0.2", diff --git a/package.json b/package.json index f78437ff..bd9674d8 100644 --- a/package.json +++ b/package.json @@ -58,7 +58,7 @@ "icss-utils": "^5.1.0", "postcss": "^8.4.33", "postcss-modules-extract-imports": "^3.0.0", - "postcss-modules-local-by-default": "^4.0.4", + "postcss-modules-local-by-default": "^4.0.5", "postcss-modules-scope": "^3.1.2", "postcss-modules-values": "^4.0.0", "postcss-value-parser": "^4.2.0", diff --git a/test/__snapshots__/modules-option.test.js.snap b/test/__snapshots__/modules-option.test.js.snap index cdb00fe4..ae599c55 100644 --- a/test/__snapshots__/modules-option.test.js.snap +++ b/test/__snapshots__/modules-option.test.js.snap @@ -10330,6 +10330,12 @@ ___CSS_LOADER_EXPORT___.push([module.id, \`@scope (.kthHR5ALtmYK9QgapjA3) { color: plum; } } + +@scope { + :scope { + color: red; + } +} \`, \\"\\"]); // Exports ___CSS_LOADER_EXPORT___.locals = { @@ -10366,6 +10372,12 @@ Array [ color: plum; } } + +@scope { + :scope { + color: red; + } +} ", "", ], @@ -20968,6 +20980,57 @@ Array [ exports[`"modules" option should work with composes when the "namedExport" is enabled and "exportLocalsConvention" options has "dashesOnly" value: warnings 1`] = `Array []`; +exports[`"modules" option should work with global compose: errors 1`] = `Array []`; + +exports[`"modules" option should work with global compose: module 1`] = ` +"// Imports +import ___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___ from \\"../../../../src/runtime/noSourceMaps.js\\"; +import ___CSS_LOADER_API_IMPORT___ from \\"../../../../src/runtime/api.js\\"; +var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___); +// Module +___CSS_LOADER_EXPORT___.push([module.id, \`.global-class { + color: red; +} + +.other-global-class { + color: red; +} + +.oNDnA1BRHWFMyAdR4iF1 { + color: blue; +} +\`, \\"\\"]); +// Exports +___CSS_LOADER_EXPORT___.locals = { + \\"otherClassName\\": \`oNDnA1BRHWFMyAdR4iF1 global-class other-global-class\` +}; +export default ___CSS_LOADER_EXPORT___; +" +`; + +exports[`"modules" option should work with global compose: result 1`] = ` +Array [ + Array [ + "./modules/composes/global.css", + ".global-class { + color: red; +} + +.other-global-class { + color: red; +} + +.oNDnA1BRHWFMyAdR4iF1 { + color: blue; +} +", + "", + ], +] +`; + +exports[`"modules" option should work with global compose: warnings 1`] = `Array []`; + exports[`"modules" option should work with the "[local]" placeholder for the "localIdentName" option: errors 1`] = `Array []`; exports[`"modules" option should work with the "[local]" placeholder for the "localIdentName" option: module 1`] = ` diff --git a/test/fixtures/modules/composes/global.css b/test/fixtures/modules/composes/global.css new file mode 100644 index 00000000..5b4cfcd1 --- /dev/null +++ b/test/fixtures/modules/composes/global.css @@ -0,0 +1,13 @@ +:global(.global-class) { + color: red; +} + +:global(.other-global-class) { + color: red; +} + +.otherClassName { + composes: global-class from global; + composes: other-global-class from global; + color: blue; +} diff --git a/test/fixtures/modules/composes/global.js b/test/fixtures/modules/composes/global.js new file mode 100644 index 00000000..e2e84944 --- /dev/null +++ b/test/fixtures/modules/composes/global.js @@ -0,0 +1,5 @@ +import css from './global.css'; + +__export__ = css; + +export default css; diff --git a/test/fixtures/modules/scope/css.css b/test/fixtures/modules/scope/css.css index e30abe49..96862906 100644 --- a/test/fixtures/modules/scope/css.css +++ b/test/fixtures/modules/scope/css.css @@ -18,3 +18,9 @@ color: plum; } } + +@scope { + :scope { + color: red; + } +} diff --git a/test/modules-option.test.js b/test/modules-option.test.js index ed4b9329..9529312b 100644 --- a/test/modules-option.test.js +++ b/test/modules-option.test.js @@ -2417,4 +2417,20 @@ describe('"modules" option', () => { expect(getWarnings(stats)).toMatchSnapshot("warnings"); expect(getErrors(stats)).toMatchSnapshot("errors"); }); + + it("should work with global compose", async () => { + const compiler = getCompiler("./modules/composes/global.js", { + modules: true, + }); + const stats = await compile(compiler); + + expect( + getModuleSource("./modules/composes/global.css", stats) + ).toMatchSnapshot("module"); + expect(getExecutedCode("main.bundle.js", compiler, stats)).toMatchSnapshot( + "result" + ); + expect(getWarnings(stats)).toMatchSnapshot("warnings"); + expect(getErrors(stats)).toMatchSnapshot("errors"); + }); });