diff --git a/cspell.json b/cspell.json index deb0a9cd2..45154e2ab 100644 --- a/cspell.json +++ b/cspell.json @@ -107,6 +107,7 @@ "hashs", "hotpink", "hotupdatechunk", + "icss", "ident", "idents", "IIFE", diff --git a/lib/css/CssModulesPlugin.js b/lib/css/CssModulesPlugin.js index 6e7ccdcec..390cda815 100644 --- a/lib/css/CssModulesPlugin.js +++ b/lib/css/CssModulesPlugin.js @@ -25,7 +25,9 @@ const { const RuntimeGlobals = require("../RuntimeGlobals"); const SelfModuleFactory = require("../SelfModuleFactory"); const WebpackError = require("../WebpackError"); -const CssExportDependency = require("../dependencies/CssExportDependency"); +const CssIcssExportDependency = require("../dependencies/CssIcssExportDependency"); +const CssIcssImportDependency = require("../dependencies/CssIcssImportDependency"); +const CssIcssSymbolDependency = require("../dependencies/CssIcssSymbolDependency"); const CssImportDependency = require("../dependencies/CssImportDependency"); const CssLocalIdentifierDependency = require("../dependencies/CssLocalIdentifierDependency"); const CssSelfLocalIdentifierDependency = require("../dependencies/CssSelfLocalIdentifierDependency"); @@ -247,6 +249,14 @@ class CssModulesPlugin { (compilation, { normalModuleFactory }) => { const hooks = CssModulesPlugin.getCompilationHooks(compilation); const selfFactory = new SelfModuleFactory(compilation.moduleGraph); + compilation.dependencyFactories.set( + CssImportDependency, + normalModuleFactory + ); + compilation.dependencyTemplates.set( + CssImportDependency, + new CssImportDependency.Template() + ); compilation.dependencyFactories.set( CssUrlDependency, normalModuleFactory @@ -267,17 +277,21 @@ class CssModulesPlugin { CssSelfLocalIdentifierDependency, new CssSelfLocalIdentifierDependency.Template() ); - compilation.dependencyTemplates.set( - CssExportDependency, - new CssExportDependency.Template() - ); compilation.dependencyFactories.set( - CssImportDependency, + CssIcssImportDependency, normalModuleFactory ); compilation.dependencyTemplates.set( - CssImportDependency, - new CssImportDependency.Template() + CssIcssImportDependency, + new CssIcssImportDependency.Template() + ); + compilation.dependencyTemplates.set( + CssIcssExportDependency, + new CssIcssExportDependency.Template() + ); + compilation.dependencyTemplates.set( + CssIcssSymbolDependency, + new CssIcssSymbolDependency.Template() ); compilation.dependencyTemplates.set( StaticExportsDependency, diff --git a/lib/css/CssParser.js b/lib/css/CssParser.js index 3adb19ed8..864ab1f3b 100644 --- a/lib/css/CssParser.js +++ b/lib/css/CssParser.js @@ -13,7 +13,9 @@ const Parser = require("../Parser"); const UnsupportedFeatureWarning = require("../UnsupportedFeatureWarning"); const WebpackError = require("../WebpackError"); const ConstDependency = require("../dependencies/ConstDependency"); -const CssExportDependency = require("../dependencies/CssExportDependency"); +const CssIcssExportDependency = require("../dependencies/CssIcssExportDependency"); +const CssIcssImportDependency = require("../dependencies/CssIcssImportDependency"); +const CssIcssSymbolDependency = require("../dependencies/CssIcssSymbolDependency"); const CssImportDependency = require("../dependencies/CssImportDependency"); const CssLocalIdentifierDependency = require("../dependencies/CssLocalIdentifierDependency"); const CssSelfLocalIdentifierDependency = require("../dependencies/CssSelfLocalIdentifierDependency"); @@ -31,17 +33,16 @@ const walkCssTokens = require("./walkCssTokens"); /** @typedef {import("../Module").BuildMeta} BuildMeta */ /** @typedef {import("../Parser").ParserState} ParserState */ /** @typedef {import("../Parser").PreparsedAst} PreparsedAst */ +/** @typedef {import("./walkCssTokens").CssTokenCallbacks} CssTokenCallbacks */ /** @typedef {[number, number]} Range */ /** @typedef {{ line: number, column: number }} Position */ /** @typedef {{ value: string, range: Range, loc: { start: Position, end: Position } }} Comment */ -const CC_LEFT_CURLY = "{".charCodeAt(0); -const CC_RIGHT_CURLY = "}".charCodeAt(0); const CC_COLON = ":".charCodeAt(0); const CC_SLASH = "/".charCodeAt(0); -const CC_SEMICOLON = ";".charCodeAt(0); const CC_LEFT_PARENTHESIS = "(".charCodeAt(0); +const CC_RIGHT_PARENTHESIS = ")".charCodeAt(0); // https://www.w3.org/TR/css-syntax-3/#newline // We don't have `preprocessing` stage, so we need specify all of them @@ -54,6 +55,7 @@ const OPTIONALLY_VENDOR_PREFIXED_KEYFRAMES_AT_RULE = /^@(-\w+-)?keyframes$/; const OPTIONALLY_VENDOR_PREFIXED_ANIMATION_PROPERTY = /^(-\w+-)?animation(-name)?$/i; const IS_MODULES = /\.module(s)?\.[^.]+$/i; +const CSS_COMMENT = /\/\*((?!\*\/).*?)\*\//g; /** * @param {string} str url string @@ -145,6 +147,10 @@ const EMPTY_COMMENT_OPTIONS = { const CSS_MODE_TOP_LEVEL = 0; const CSS_MODE_IN_BLOCK = 1; +const eatUntilSemi = walkCssTokens.eatUntil(";"); +const eatUntilLeftCurly = walkCssTokens.eatUntil("{"); +const eatSemi = walkCssTokens.eatUntil(";"); + class CssParser extends Parser { /** * @param {object} options options @@ -237,10 +243,12 @@ class CssParser extends Parser { let modeData; /** @type {boolean} */ let inAnimationProperty = false; - /** @type {Set} */ - const declaredCssVariables = new Set(); /** @type {[number, number, boolean] | undefined} */ let lastIdentifier; + /** @type {Set} */ + const declaredCssVariables = new Set(); + /** @type {Map} */ + const icssDefinitions = new Map(); /** * @param {string} input input @@ -298,79 +306,156 @@ class CssParser extends Parser { } return [pos, text.trimEnd()]; }; - const eatSemi = walkCssTokens.eatUntil(";"); - const eatExportName = walkCssTokens.eatUntil(":};/"); - const eatExportValue = walkCssTokens.eatUntil("};/"); + /** + * @param {0 | 1} type import or export * @param {string} input input * @param {number} pos start position * @returns {number} position after parse */ - const parseExports = (input, pos) => { + const parseImportOrExport = (type, input, pos) => { pos = walkCssTokens.eatWhitespaceAndComments(input, pos); - const cc = input.charCodeAt(pos); - if (cc !== CC_LEFT_CURLY) { - this._emitWarning( - state, - `Unexpected '${input[pos]}' at ${pos} during parsing of ':export' (expected '{')`, - locConverter, - pos, - pos - ); - return pos; - } - pos++; - pos = walkCssTokens.eatWhitespaceAndComments(input, pos); - for (;;) { - if (input.charCodeAt(pos) === CC_RIGHT_CURLY) break; - pos = walkCssTokens.eatWhitespaceAndComments(input, pos); - if (pos === input.length) return pos; - const start = pos; - let name; - [pos, name] = eatText(input, pos, eatExportName); - if (pos === input.length) return pos; - if (input.charCodeAt(pos) !== CC_COLON) { + let importPath; + if (type === 0) { + let cc = input.charCodeAt(pos); + if (cc !== CC_LEFT_PARENTHESIS) { this._emitWarning( state, - `Unexpected '${input[pos]}' at ${pos} during parsing of export name in ':export' (expected ':')`, + `Unexpected '${input[pos]}' at ${pos} during parsing of ':import' (expected '(')`, locConverter, - start, + pos, pos ); return pos; } pos++; - if (pos === input.length) return pos; - pos = walkCssTokens.eatWhitespaceAndComments(input, pos); - if (pos === input.length) return pos; - let value; - [pos, value] = eatText(input, pos, eatExportValue); - if (pos === input.length) return pos; - const cc = input.charCodeAt(pos); - if (cc === CC_SEMICOLON) { - pos++; - if (pos === input.length) return pos; - pos = walkCssTokens.eatWhitespaceAndComments(input, pos); - if (pos === input.length) return pos; - } else if (cc !== CC_RIGHT_CURLY) { + const stringStart = pos; + const str = walkCssTokens.eatString(input, pos); + if (!str) { this._emitWarning( state, - `Unexpected '${input[pos]}' at ${pos} during parsing of export value in ':export' (expected ';' or '}')`, + `Unexpected '${input[pos]}' at ${pos} during parsing of ':import' (expected string)`, locConverter, - start, + stringStart, pos ); return pos; } - const dep = new CssExportDependency(name, value); - const { line: sl, column: sc } = locConverter.get(start); - const { line: el, column: ec } = locConverter.get(pos); - dep.setLoc(sl, sc, el, ec); - module.addDependency(dep); + importPath = input.slice(str[0] + 1, str[1] - 1); + pos = str[1]; + pos = walkCssTokens.eatWhitespaceAndComments(input, pos); + cc = input.charCodeAt(pos); + if (cc !== CC_RIGHT_PARENTHESIS) { + this._emitWarning( + state, + `Unexpected '${input[pos]}' at ${pos} during parsing of ':import' (expected ')')`, + locConverter, + pos, + pos + ); + return pos; + } + pos++; + pos = walkCssTokens.eatWhitespaceAndComments(input, pos); } - pos++; - if (pos === input.length) return pos; + + /** + * @param {string} name name + * @param {string} value value + * @param {number} start start of position + * @param {number} end end of position + */ + const createDep = (name, value, start, end) => { + if (type === 0) { + icssDefinitions.set(name, { + path: /** @type {string} */ (importPath), + value + }); + } else if (type === 1) { + const dep = new CssIcssExportDependency(name, value); + const { line: sl, column: sc } = locConverter.get(start); + const { line: el, column: ec } = locConverter.get(end); + dep.setLoc(sl, sc, el, ec); + module.addDependency(dep); + } + }; + + let needTerminate = false; + let balanced = 0; + /** @type {undefined | 0 | 1 | 2} */ + let scope; + + /** @type {[number, number] | undefined} */ + let name; + /** @type {number | undefined} */ + let value; + + /** @type {CssTokenCallbacks} */ + const callbacks = { + leftCurlyBracket: (_input, _start, end) => { + balanced++; + + if (scope === undefined) { + scope = 0; + } + + return end; + }, + rightCurlyBracket: (_input, _start, end) => { + balanced--; + + if (scope === 2) { + createDep( + input.slice(name[0], name[1]), + input.slice(value, end - 1).trim(), + name[1], + end - 1 + ); + scope = 0; + } + + if (balanced === 0 && scope === 0) { + needTerminate = true; + } + + return end; + }, + identifier: (_input, start, end) => { + if (scope === 0) { + name = [start, end]; + scope = 1; + } + + return end; + }, + colon: (_input, _start, end) => { + if (scope === 1) { + scope = 2; + value = walkCssTokens.eatWhitespace(input, end); + return value; + } + + return end; + }, + semicolon: (input, _start, end) => { + if (scope === 2) { + createDep( + input.slice(name[0], name[1]), + input.slice(value, end - 1), + name[1], + end - 1 + ); + scope = 0; + } + + return end; + }, + needTerminate: () => needTerminate + }; + + pos = walkCssTokens(input, pos, callbacks); pos = walkCssTokens.eatWhiteLine(input, pos); + return pos; }; const eatPropertyName = walkCssTokens.eatUntil(":{};"); @@ -431,9 +516,6 @@ class CssParser extends Parser { } }; - const eatUntilSemi = walkCssTokens.eatUntil(";"); - const eatUntilLeftCurly = walkCssTokens.eatUntil("{"); - /** * @param {string} input input * @param {number} start start @@ -458,7 +540,7 @@ class CssParser extends Parser { return end; }; - walkCssTokens(source, { + walkCssTokens(source, 0, { comment, leftCurlyBracket: (input, start, end) => { switch (scope) { @@ -705,7 +787,92 @@ class CssParser extends Parser { } default: { if (isModules) { - if (OPTIONALLY_VENDOR_PREFIXED_KEYFRAMES_AT_RULE.test(name)) { + if (name === "@value") { + const semi = eatUntilSemi(input, end); + const atRuleEnd = semi + 1; + const params = input.slice(end, semi); + let [alias, from] = params.split(/\s*from\s*/); + + if (from) { + const aliases = alias + .replace(CSS_COMMENT, " ") + .trim() + .replace(/^\(|\)$/g, "") + .split(/\s*,\s*/); + + from = from.replace(CSS_COMMENT, "").trim(); + + const isExplicitImport = from[0] === "'" || from[0] === '"'; + + if (isExplicitImport) { + from = from.slice(1, -1); + } + + for (const alias of aliases) { + const [name, aliasName] = alias.split(/\s*as\s*/); + + icssDefinitions.set(aliasName || name, { + value: name, + path: from + }); + } + } else { + const ident = walkCssTokens.eatIdentSequence(alias, 0); + + if (!ident) { + this._emitWarning( + state, + `Broken '@value' at-rule: ${input.slice( + start, + atRuleEnd + )}'`, + locConverter, + start, + atRuleEnd + ); + + const dep = new ConstDependency("", [start, atRuleEnd]); + module.addPresentationalDependency(dep); + return atRuleEnd; + } + + const pos = walkCssTokens.eatWhitespaceAndComments( + alias, + ident[1] + ); + + const name = alias.slice(ident[0], ident[1]); + let value = + alias.charCodeAt(pos) === CC_COLON + ? alias.slice(pos + 1) + : alias.slice(ident[1]); + + if (value && !/^\s+$/.test(value)) { + value = value.trim(); + } + + if (icssDefinitions.has(value)) { + const def = icssDefinitions.get(value); + + value = def.value; + } + + icssDefinitions.set(name, { value }); + + const dep = new CssIcssExportDependency(name, value); + const { line: sl, column: sc } = locConverter.get(start); + const { line: el, column: ec } = locConverter.get(end); + dep.setLoc(sl, sc, el, ec); + module.addDependency(dep); + } + + const dep = new ConstDependency("", [start, atRuleEnd]); + module.addPresentationalDependency(dep); + return atRuleEnd; + } else if ( + OPTIONALLY_VENDOR_PREFIXED_KEYFRAMES_AT_RULE.test(name) && + isLocalMode() + ) { const ident = walkCssTokens.eatIdentSequenceOrString( input, end @@ -715,38 +882,33 @@ class CssParser extends Parser { ident[2] === true ? input.slice(ident[0], ident[1]) : input.slice(ident[0] + 1, ident[1] - 1); - if (isLocalMode()) { - const { line: sl, column: sc } = locConverter.get(ident[0]); - const { line: el, column: ec } = locConverter.get(ident[1]); - const dep = new CssLocalIdentifierDependency(name, [ - ident[0], - ident[1] - ]); - dep.setLoc(sl, sc, el, ec); - module.addDependency(dep); - } + const { line: sl, column: sc } = locConverter.get(ident[0]); + const { line: el, column: ec } = locConverter.get(ident[1]); + const dep = new CssLocalIdentifierDependency(name, [ + ident[0], + ident[1] + ]); + dep.setLoc(sl, sc, el, ec); + module.addDependency(dep); return ident[1]; - } else if (name === "@property") { + } else if (name === "@property" && isLocalMode()) { const ident = walkCssTokens.eatIdentSequence(input, end); if (!ident) return end; let name = input.slice(ident[0], ident[1]); if (!name.startsWith("--")) return end; name = name.slice(2); declaredCssVariables.add(name); - if (isLocalMode()) { - const { line: sl, column: sc } = locConverter.get(ident[0]); - const { line: el, column: ec } = locConverter.get(ident[1]); - const dep = new CssLocalIdentifierDependency( - name, - [ident[0], ident[1]], - "--" - ); - dep.setLoc(sl, sc, el, ec); - module.addDependency(dep); - } + const { line: sl, column: sc } = locConverter.get(ident[0]); + const { line: el, column: ec } = locConverter.get(ident[1]); + const dep = new CssLocalIdentifierDependency( + name, + [ident[0], ident[1]], + "--" + ); + dep.setLoc(sl, sc, el, ec); + module.addDependency(dep); return ident[1]; - } else if (isModules && name === "@scope") { - modeData = isLocalMode() ? "local" : "global"; + } else if (name === "@scope") { isNextRulePrelude = true; return end; } @@ -770,19 +932,55 @@ class CssParser extends Parser { return end; }, identifier: (input, start, end) => { - switch (scope) { - case CSS_MODE_IN_BLOCK: { - if (isLocalMode()) { - // Handle only top level values and not inside functions - if (inAnimationProperty && balanced.length === 0) { - lastIdentifier = [start, end, true]; - } else { - return processLocalDeclaration(input, start, end); + if (isModules) { + if (icssDefinitions.has(input.slice(start, end))) { + const name = input.slice(start, end); + let { path, value } = icssDefinitions.get(name); + + if (path) { + if (icssDefinitions.has(path)) { + const definition = icssDefinitions.get(path); + + path = definition.value.slice(1, -1); } + + const dep = new CssIcssImportDependency(path, value, [ + start, + end - 1 + ]); + const { line: sl, column: sc } = locConverter.get(start); + const { line: el, column: ec } = locConverter.get(end - 1); + dep.setLoc(sl, sc, el, ec); + module.addDependency(dep); + } else { + const { line: sl, column: sc } = locConverter.get(start); + const { line: el, column: ec } = locConverter.get(end); + const dep = new CssIcssSymbolDependency(name, value, [ + start, + end + ]); + dep.setLoc(sl, sc, el, ec); + module.addDependency(dep); + } + + return end; + } + + switch (scope) { + case CSS_MODE_IN_BLOCK: { + if (isLocalMode()) { + // Handle only top level values and not inside functions + if (inAnimationProperty && balanced.length === 0) { + lastIdentifier = [start, end, true]; + } else { + return processLocalDeclaration(input, start, end); + } + } + break; } - break; } } + return end; }, delim: (input, start, end) => { @@ -830,8 +1028,13 @@ class CssParser extends Parser { switch (scope) { case CSS_MODE_TOP_LEVEL: { - if (name === "export") { - const pos = parseExports(input, ident[1]); + if (name === "import") { + const pos = parseImportOrExport(0, input, ident[1]); + const dep = new ConstDependency("", [start, pos]); + module.addPresentationalDependency(dep); + return pos; + } else if (name === "export") { + const pos = parseImportOrExport(1, input, ident[1]); const dep = new ConstDependency("", [start, pos]); module.addPresentationalDependency(dep); return pos; diff --git a/lib/css/walkCssTokens.js b/lib/css/walkCssTokens.js index 56704709c..7af3c7ce2 100644 --- a/lib/css/walkCssTokens.js +++ b/lib/css/walkCssTokens.js @@ -22,6 +22,7 @@ * @property {(function(string, number, number): number)=} rightCurlyBracket * @property {(function(string, number, number): number)=} semicolon * @property {(function(string, number, number): number)=} comma + * @property {(function(): boolean)=} needTerminate */ /** @typedef {function(string, number, CssTokenCallbacks): number} CharHandler */ @@ -77,13 +78,6 @@ const CC_HYPHEN_MINUS = "-".charCodeAt(0); const CC_LESS_THAN_SIGN = "<".charCodeAt(0); const CC_GREATER_THAN_SIGN = ">".charCodeAt(0); -/** - * @param {number} cc char code - * @returns {boolean} true, if cc is a newline - */ -const _isNewLine = cc => - cc === CC_LINE_FEED || cc === CC_CARRIAGE_RETURN || cc === CC_FORM_FEED; - /** @type {CharHandler} */ const consumeSpace = (input, pos, _callbacks) => { // Consume as much whitespace as possible. @@ -266,7 +260,7 @@ const consumeAStringToken = (input, pos, callbacks) => { // newline // This is a parse error. // Reconsume the current input code point, create a , and return it. - else if (_isNewLine(cc)) { + else if (_isNewline(cc)) { pos--; // bad string return pos; @@ -278,7 +272,7 @@ const consumeAStringToken = (input, pos, callbacks) => { return pos; } // Otherwise, if the next input code point is a newline, consume it. - else if (_isNewLine(input.charCodeAt(pos))) { + else if (_isNewline(input.charCodeAt(pos))) { pos++; } // Otherwise, (the stream starts with a valid escape) consume an escaped code point and append the returned code point to the ’s value. @@ -350,7 +344,7 @@ const _ifTwoCodePointsAreValidEscape = (input, pos, f, s) => { // If the first code point is not U+005C REVERSE SOLIDUS (\), return false. if (first !== CC_REVERSE_SOLIDUS) return false; // Otherwise, if the second code point is a newline, return false. - if (_isNewLine(second)) return false; + if (_isNewline(second)) return false; // Otherwise, return true. return true; }; @@ -1156,12 +1150,12 @@ const consumeAToken = (input, pos, callbacks) => { /** * @param {string} input input css - * @param {CssTokenCallbacks} callbacks callbacks - * @returns {void} + * @param {number=} pos pos + * @param {CssTokenCallbacks=} callbacks callbacks + * @returns {number} pos */ -module.exports = (input, callbacks) => { +module.exports = (input, pos = 0, callbacks = {}) => { // This section describes how to consume a token from a stream of code points. It will return a single token of any type. - let pos = 0; while (pos < input.length) { // Consume comments. pos = consumeComments(input, pos, callbacks); @@ -1169,7 +1163,13 @@ module.exports = (input, callbacks) => { // Consume the next input code point. pos++; pos = consumeAToken(input, pos, callbacks); + + if (callbacks.needTerminate && callbacks.needTerminate()) { + break; + } } + + return pos; }; module.exports.isIdentStartCodePoint = isIdentStartCodePoint; @@ -1253,7 +1253,7 @@ module.exports.eatWhiteLine = (input, pos) => { pos++; continue; } - if (_isNewLine(cc)) pos++; + if (_isNewline(cc)) pos++; // For `\r\n` if (cc === CC_CARRIAGE_RETURN && input.charCodeAt(pos + 1) === CC_LINE_FEED) pos++; diff --git a/lib/dependencies/CssExportDependency.js b/lib/dependencies/CssIcssExportDependency.js similarity index 83% rename from lib/dependencies/CssExportDependency.js rename to lib/dependencies/CssIcssExportDependency.js index ab9ee61e2..97d7fc0df 100644 --- a/lib/dependencies/CssExportDependency.js +++ b/lib/dependencies/CssIcssExportDependency.js @@ -23,7 +23,7 @@ const NullDependency = require("./NullDependency"); /** @typedef {import("../serialization/ObjectMiddleware").ObjectSerializerContext} ObjectSerializerContext */ /** @typedef {import("../util/Hash")} Hash */ -class CssExportDependency extends NullDependency { +class CssIcssExportDependency extends NullDependency { /** * @param {string} name name * @param {string} value value @@ -32,6 +32,7 @@ class CssExportDependency extends NullDependency { super(); this.name = name; this.value = value; + this._hashUpdate = undefined; } get type() { @@ -78,18 +79,21 @@ class CssExportDependency extends NullDependency { * @returns {void} */ updateHash(hash, { chunkGraph }) { - const module = /** @type {CssModule} */ ( - chunkGraph.moduleGraph.getParentModule(this) - ); - const generator = - /** @type {CssGenerator | CssExportsGenerator} */ - (module.generator); - const names = this.getExportsConventionNames( - this.name, - generator.convention - ); + if (this._hashUpdate === undefined) { + const module = + /** @type {CssModule} */ + (chunkGraph.moduleGraph.getParentModule(this)); + const generator = + /** @type {CssGenerator | CssExportsGenerator} */ + (module.generator); + const names = this.getExportsConventionNames( + this.name, + generator.convention + ); + this._hashUpdate = JSON.stringify(names); + } hash.update("exportsConvention"); - hash.update(JSON.stringify(names)); + hash.update(this._hashUpdate); } /** @@ -113,7 +117,7 @@ class CssExportDependency extends NullDependency { } } -CssExportDependency.Template = class CssExportDependencyTemplate extends ( +CssIcssExportDependency.Template = class CssIcssExportDependencyTemplate extends ( NullDependency.Template ) { /** @@ -127,7 +131,7 @@ CssExportDependency.Template = class CssExportDependencyTemplate extends ( source, { cssExportsData, module: m, runtime, moduleGraph } ) { - const dep = /** @type {CssExportDependency} */ (dependency); + const dep = /** @type {CssIcssExportDependency} */ (dependency); const module = /** @type {CssModule} */ (m); const convention = /** @type {CssGenerator | CssExportsGenerator} */ @@ -149,8 +153,8 @@ CssExportDependency.Template = class CssExportDependencyTemplate extends ( }; makeSerializable( - CssExportDependency, - "webpack/lib/dependencies/CssExportDependency" + CssIcssExportDependency, + "webpack/lib/dependencies/CssIcssExportDependency" ); -module.exports = CssExportDependency; +module.exports = CssIcssExportDependency; diff --git a/lib/dependencies/CssIcssImportDependency.js b/lib/dependencies/CssIcssImportDependency.js new file mode 100644 index 000000000..4253e344c --- /dev/null +++ b/lib/dependencies/CssIcssImportDependency.js @@ -0,0 +1,106 @@ +/* + MIT License http://www.opensource.org/licenses/mit-license.php + Author Ivan Kopeykin @vankop +*/ + +"use strict"; + +const makeSerializable = require("../util/makeSerializable"); +const CssIcssExportDependency = require("./CssIcssExportDependency"); +const ModuleDependency = require("./ModuleDependency"); + +/** @typedef {import("webpack-sources").ReplaceSource} ReplaceSource */ +/** @typedef {import("../Dependency")} Dependency */ +/** @typedef {import("../Dependency").ExportsSpec} ExportsSpec */ +/** @typedef {import("../DependencyTemplate").CssDependencyTemplateContext} DependencyTemplateContext */ +/** @typedef {import("../ModuleGraph")} ModuleGraph */ +/** @typedef {import("../serialization/ObjectMiddleware").ObjectDeserializerContext} ObjectDeserializerContext */ +/** @typedef {import("../serialization/ObjectMiddleware").ObjectSerializerContext} ObjectSerializerContext */ + +class CssIcssImportDependency extends ModuleDependency { + /** + * Example of dependency: + * + *:import('./style.css') { IMPORTED_NAME: v-primary } + * @param {string} request request request path which needs resolving + * @param {string} exportName export name + * @param {[number, number]} range the range of dependency + */ + constructor(request, exportName, range) { + super(request); + this.range = range; + this.exportName = exportName; + } + + get type() { + return "css :import"; + } + + get category() { + return "css-import"; + } + + /** + * @param {ObjectSerializerContext} context context + */ + serialize(context) { + const { write } = context; + write(this.range); + write(this.exportName); + super.serialize(context); + } + + /** + * @param {ObjectDeserializerContext} context context + */ + deserialize(context) { + const { read } = context; + this.range = read(); + this.exportName = read(); + super.deserialize(context); + } +} + +CssIcssImportDependency.Template = class CssIcssImportDependencyTemplate extends ( + ModuleDependency.Template +) { + /** + * @param {Dependency} dependency the dependency for which the template should be applied + * @param {ReplaceSource} source the current replace source which can be modified + * @param {DependencyTemplateContext} templateContext the context object + * @returns {void} + */ + apply(dependency, source, templateContext) { + const dep = /** @type {CssIcssImportDependency} */ (dependency); + const { range } = dep; + + const module = templateContext.moduleGraph.getModule(dep); + + let value; + + for (const item of module.dependencies) { + if ( + item instanceof CssIcssExportDependency && + item.name === dep.exportName + ) { + value = item.value; + break; + } + } + + if (!value) { + throw new Error( + `Imported '${dep.exportName}' name from '${dep.request}' not found` + ); + } + + source.replace(range[0], range[1], value); + } +}; + +makeSerializable( + CssIcssImportDependency, + "webpack/lib/dependencies/CssIcssImportDependency" +); + +module.exports = CssIcssImportDependency; diff --git a/lib/dependencies/CssIcssSymbolDependency.js b/lib/dependencies/CssIcssSymbolDependency.js new file mode 100644 index 000000000..c96e8388d --- /dev/null +++ b/lib/dependencies/CssIcssSymbolDependency.js @@ -0,0 +1,133 @@ +/* + MIT License http://www.opensource.org/licenses/mit-license.php + Author Alexander Akait @alexander-akait +*/ + +"use strict"; + +const makeSerializable = require("../util/makeSerializable"); +const NullDependency = require("./NullDependency"); + +/** @typedef {import("webpack-sources").ReplaceSource} ReplaceSource */ +/** @typedef {import("../Dependency")} Dependency */ +/** @typedef {import("../Dependency").ExportsSpec} ExportsSpec */ +/** @typedef {import("../Dependency").ReferencedExport} ReferencedExport */ +/** @typedef {import("../Dependency").UpdateHashContext} UpdateHashContext */ +/** @typedef {import("../DependencyTemplate").CssDependencyTemplateContext} DependencyTemplateContext */ +/** @typedef {import("../ModuleGraph")} ModuleGraph */ +/** @typedef {import("../css/CssParser").Range} Range */ +/** @typedef {import("../serialization/ObjectMiddleware").ObjectDeserializerContext} ObjectDeserializerContext */ +/** @typedef {import("../serialization/ObjectMiddleware").ObjectSerializerContext} ObjectSerializerContext */ +/** @typedef {import("../util/Hash")} Hash */ +/** @typedef {import("../util/runtime").RuntimeSpec} RuntimeSpec */ + +class CssIcssSymbolDependency extends NullDependency { + /** + * @param {string} name name + * @param {string} value value + * @param {Range} range range + */ + constructor(name, value, range) { + super(); + this.name = name; + this.value = value; + this.range = range; + this._hashUpdate = undefined; + } + + get type() { + return "css @value identifier"; + } + + get category() { + return "self"; + } + + /** + * Update the hash + * @param {Hash} hash hash to be updated + * @param {UpdateHashContext} context context + * @returns {void} + */ + updateHash(hash, context) { + if (this._hashUpdate === undefined) { + const hashUpdate = `${this.range}|${this.name}|${this.value}`; + this._hashUpdate = hashUpdate; + } + hash.update(this._hashUpdate); + } + + /** + * Returns the exported names + * @param {ModuleGraph} moduleGraph module graph + * @returns {ExportsSpec | undefined} export names + */ + getExports(moduleGraph) { + return { + exports: [ + { + name: this.name, + canMangle: true + } + ], + dependencies: undefined + }; + } + + /** + * Returns list of exports referenced by this dependency + * @param {ModuleGraph} moduleGraph module graph + * @param {RuntimeSpec} runtime the runtime for which the module is analysed + * @returns {(string[] | ReferencedExport)[]} referenced exports + */ + getReferencedExports(moduleGraph, runtime) { + return [[this.name]]; + } + + /** + * @param {ObjectSerializerContext} context context + */ + serialize(context) { + const { write } = context; + write(this.name); + write(this.value); + write(this.range); + super.serialize(context); + } + + /** + * @param {ObjectDeserializerContext} context context + */ + deserialize(context) { + const { read } = context; + this.name = read(); + this.value = read(); + this.range = read(); + super.deserialize(context); + } +} + +CssIcssSymbolDependency.Template = class CssValueAtRuleDependencyTemplate extends ( + NullDependency.Template +) { + /** + * @param {Dependency} dependency the dependency for which the template should be applied + * @param {ReplaceSource} source the current replace source which can be modified + * @param {DependencyTemplateContext} templateContext the context object + * @returns {void} + */ + apply(dependency, source, { cssExportsData }) { + const dep = /** @type {CssIcssSymbolDependency} */ (dependency); + + source.replace(dep.range[0], dep.range[1] - 1, dep.value); + + cssExportsData.exports.set(dep.name, dep.value); + } +}; + +makeSerializable( + CssIcssSymbolDependency, + "webpack/lib/dependencies/CssIcssSymbolDependency" +); + +module.exports = CssIcssSymbolDependency; diff --git a/lib/dependencies/CssLocalIdentifierDependency.js b/lib/dependencies/CssLocalIdentifierDependency.js index ca2b05b0f..416a4f66a 100644 --- a/lib/dependencies/CssLocalIdentifierDependency.js +++ b/lib/dependencies/CssLocalIdentifierDependency.js @@ -115,9 +115,9 @@ class CssLocalIdentifierDependency extends NullDependency { */ getExports(moduleGraph) { const module = /** @type {CssModule} */ (moduleGraph.getParentModule(this)); - const convention = /** @type {CssGenerator | CssExportsGenerator} */ ( - module.generator - ).convention; + const convention = + /** @type {CssGenerator | CssExportsGenerator} */ + (module.generator).convention; const names = this.getExportsConventionNames(this.name, convention); return { exports: names.map(name => ({ diff --git a/lib/library/AssignLibraryPlugin.js b/lib/library/AssignLibraryPlugin.js index 24859bcd7..abdcfcf41 100644 --- a/lib/library/AssignLibraryPlugin.js +++ b/lib/library/AssignLibraryPlugin.js @@ -330,7 +330,7 @@ class AssignLibraryPlugin extends AbstractLibraryPlugin { exports = "__webpack_exports_export__"; } result.add( - `for(var i in ${exports}) __webpack_export_target__[i] = ${exports}[i];\n` + `for(var __webpack_i__ in ${exports}) __webpack_export_target__[__webpack_i__] = ${exports}[__webpack_i__];\n` ); result.add( `if(${exports}.__esModule) Object.defineProperty(__webpack_export_target__, "__esModule", { value: true });\n` diff --git a/lib/util/internalSerializables.js b/lib/util/internalSerializables.js index 1cd63dbd5..3ca8f2b91 100644 --- a/lib/util/internalSerializables.js +++ b/lib/util/internalSerializables.js @@ -77,10 +77,14 @@ module.exports = { require("../dependencies/CssLocalIdentifierDependency"), "dependencies/CssSelfLocalIdentifierDependency": () => require("../dependencies/CssSelfLocalIdentifierDependency"), - "dependencies/CssExportDependency": () => - require("../dependencies/CssExportDependency"), + "dependencies/CssIcssImportDependency": () => + require("../dependencies/CssIcssImportDependency"), + "dependencies/CssIcssExportDependency": () => + require("../dependencies/CssIcssExportDependency"), "dependencies/CssUrlDependency": () => require("../dependencies/CssUrlDependency"), + "dependencies/CssIcssSymbolDependency": () => + require("../dependencies/CssIcssSymbolDependency"), "dependencies/DelegatedSourceDependency": () => require("../dependencies/DelegatedSourceDependency"), "dependencies/DllEntryDependency": () => diff --git a/package.json b/package.json index eac7034a4..47ab59024 100644 --- a/package.json +++ b/package.json @@ -7,9 +7,9 @@ "dependencies": { "@types/eslint-scope": "^3.7.7", "@types/estree": "^1.0.6", - "@webassemblyjs/ast": "^1.12.1", - "@webassemblyjs/wasm-edit": "^1.12.1", - "@webassemblyjs/wasm-parser": "^1.12.1", + "@webassemblyjs/ast": "^1.14.1", + "@webassemblyjs/wasm-edit": "^1.14.1", + "@webassemblyjs/wasm-parser": "^1.14.1", "acorn": "^8.14.0", "browserslist": "^4.24.0", "chrome-trace-event": "^1.0.2", diff --git a/test/__snapshots__/ConfigCacheTestCases.longtest.js.snap b/test/__snapshots__/ConfigCacheTestCases.longtest.js.snap index f85752422..b29873410 100644 --- a/test/__snapshots__/ConfigCacheTestCases.longtest.js.snap +++ b/test/__snapshots__/ConfigCacheTestCases.longtest.js.snap @@ -70,9 +70,261 @@ Object { `; exports[`ConfigCacheTestCases css css-modules exported tests should allow to create css modules: dev 2`] = ` -"/*!******************************!*\\\\ +"/*!*******************************!*\\\\ + !*** css ./colors.module.css ***! + \\\\*******************************/ + + + + + + + + + + + + + + +/*!**************************************!*\\\\ + !*** css ./at-rule-value.module.css ***! + \\\\**************************************/ + + +._at-rule-value_module_css-value-in-class { + color: blue; +} + + + + + + +@media (max-width: 599px) { + abbr:hover { + color: limegreen; + transition-duration: 1s; + } +} + + + +._at-rule-value_module_css-foo { color: red; } + + + +._at-rule-value_module_css-foo { + &._at-rule-value_module_css-bar { color: red; } +} + + + +._at-rule-value_module_css-foo { + @media (min-width: 1024px) { + &._at-rule-value_module_css-bar { color: red; } + } +} + + + +._at-rule-value_module_css-foo { + @media (min-width: 1024px) { + &._at-rule-value_module_css-bar { + @media (min-width: 1024px) { + color: red; + } + } + } +} + + + + +._at-rule-value_module_css-foo { height: 40px; height: 36px; } + + + +._at-rule-value_module_css-colorValue { + color: red; +} + + + +#_at-rule-value_module_css-colorValue-v1 { + color: red; +} + + + +._at-rule-value_module_css-colorValue-v2 > ._at-rule-value_module_css-colorValue-v2 { + color: red; +} + + + +.red { + color: .red; +} + + + +._at-rule-value_module_css-export { + color: blue; +} + + + +._at-rule-value_module_css-foo { color: red; } + + + +._at-rule-value_module_css-foo { color: red; } +._at-rule-value_module_css-bar { color: yellow } + + + + +._at-rule-value_module_css-foo { color: blue; } + + + + +._at-rule-value_module_css-foo { color: blue; } + + + + +._at-rule-value_module_css-class-a { color: red; } + + + + +._at-rule-value_module_css-class-a { margin: calc(base * 2); } + + + + +._at-rule-value_module_css-class-a { content: \\"test-a\\" \\"test-b\\"; } + + + +._at-rule-value_module_css-foo { color: var(--color); } + + + + + + + +._at-rule-value_module_css-foo { + color: red; + background-color: #0f0; + border-top-color: #00ff00; + border-bottom-color: rgba(34, 12, 64, 0.3); + outline-color: hsla(220, 13.0%, 18.0%, 1); +} + + + +._at-rule-value_module_css-foo { color: blue; } +._at-rule-value_module_css-bar { color: red } + + + +._at-rule-value_module_css-foo { box-shadow: 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +._at-rule-value_module_css-foo { color: color(red lightness(50%)); } + + + +:root { --_at-rule-value_module_css-color: red; } + + + +:root { --_at-rule-value_module_css-color: ; } + + + +:root { --_at-rule-value_module_css-color: ; } + + + +:root { --_at-rule-value_module_css-color:/* comment */; } + + + + +._at-rule-value_module_css-override { + color: red; +} + + + + +._at-rule-value_module_css-class { + color: red; + color: red; + color: blue; +} + + + +._at-rule-value_module_css-color { + color: /* test */red/* test */; +} + + + +._at-rule-value_module_css-color { + color: /* test *//* test */red/* test */; +} + + + +._at-rule-value_module_css-foo { box-shadow: 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +._at-rule-value_module_css-foo { box-shadow: 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +._at-rule-value_module_css-foo { box-shadow: /* test */ 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +._at-rule-value_module_css-foo { box-shadow: /* test */0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +._at-rule-value_module_css-foo { box-shadow: 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +._at-rule-value_module_css-foo { box-shadow: /* test */0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +._at-rule-value_module_css-foo { color: blue; } + + + +._at-rule-value_module_css-foo { color: blue; } + + + +._at-rule-value_module_css-foo { color: my-name-q; } + + + + +/*!******************************!*\\\\ !*** css ./style.module.css ***! \\\\******************************/ + ._style_module_css-class { color: red; } @@ -1235,7 +1487,7 @@ div { --_identifiers_module_css-variable-used-class: 10px; } -head{--webpack-use-style_js:class:__style_module_css-class/local1:__style_module_css-local1/local2:__style_module_css-local2/local3:__style_module_css-local3/local4:__style_module_css-local4/local5:__style_module_css-local5/local6:__style_module_css-local6/local7:__style_module_css-local7/disabled:__style_module_css-disabled/mButtonDisabled:__style_module_css-mButtonDisabled/tipOnly:__style_module_css-tipOnly/local8:__style_module_css-local8/parent1:__style_module_css-parent1/child1:__style_module_css-child1/vertical-tiny:__style_module_css-vertical-tiny/vertical-small:__style_module_css-vertical-small/otherDiv:__style_module_css-otherDiv/horizontal-tiny:__style_module_css-horizontal-tiny/horizontal-small:__style_module_css-horizontal-small/description:__style_module_css-description/local9:__style_module_css-local9/local10:__style_module_css-local10/local11:__style_module_css-local11/local12:__style_module_css-local12/local13:__style_module_css-local13/local14:__style_module_css-local14/local15:__style_module_css-local15/local16:__style_module_css-local16/nested1:__style_module_css-nested1/nested3:__style_module_css-nested3/ident:__style_module_css-ident/localkeyframes:__style_module_css-localkeyframes/pos1x:--_style_module_css-pos1x/pos1y:--_style_module_css-pos1y/pos2x:--_style_module_css-pos2x/pos2y:--_style_module_css-pos2y/localkeyframes2:__style_module_css-localkeyframes2/animation:__style_module_css-animation/vars:__style_module_css-vars/local-color:--_style_module_css-local-color/globalVars:__style_module_css-globalVars/wideScreenClass:__style_module_css-wideScreenClass/narrowScreenClass:__style_module_css-narrowScreenClass/displayGridInSupports:__style_module_css-displayGridInSupports/floatRightInNegativeSupports:__style_module_css-floatRightInNegativeSupports/displayFlexInMediaInSupports:__style_module_css-displayFlexInMediaInSupports/displayFlexInSupportsInMedia:__style_module_css-displayFlexInSupportsInMedia/displayFlexInSupportsInMediaUpperCase:__style_module_css-displayFlexInSupportsInMediaUpperCase/animationUpperCase:__style_module_css-animationUpperCase/localkeyframesUPPERCASE:__style_module_css-localkeyframesUPPERCASE/localkeyframes2UPPPERCASE:__style_module_css-localkeyframes2UPPPERCASE/localUpperCase:__style_module_css-localUpperCase/VARS:__style_module_css-VARS/LOCAL-COLOR:--_style_module_css-LOCAL-COLOR/globalVarsUpperCase:__style_module_css-globalVarsUpperCase/inSupportScope:__style_module_css-inSupportScope/a:__style_module_css-a/animationName:__style_module_css-animationName/b:__style_module_css-b/c:__style_module_css-c/d:__style_module_css-d/animation-name:--_style_module_css-animation-name/mozAnimationName:__style_module_css-mozAnimationName/my-color:--_style_module_css-my-color/my-color-1:--_style_module_css-my-color-1/my-color-2:--_style_module_css-my-color-2/padding-sm:__style_module_css-padding-sm/padding-lg:__style_module_css-padding-lg/nested-pure:__style_module_css-nested-pure/nested-media:__style_module_css-nested-media/nested-supports:__style_module_css-nested-supports/nested-layer:__style_module_css-nested-layer/not-selector-inside:__style_module_css-not-selector-inside/nested-var:__style_module_css-nested-var/again:__style_module_css-again/nested-with-local-pseudo:__style_module_css-nested-with-local-pseudo/local-nested:__style_module_css-local-nested/bar:--_style_module_css-bar/id-foo:__style_module_css-id-foo/id-bar:__style_module_css-id-bar/nested-parens:__style_module_css-nested-parens/local-in-global:__style_module_css-local-in-global/in-local-global-scope:__style_module_css-in-local-global-scope/class-local-scope:__style_module_css-class-local-scope/class-in-container:__style_module_css-class-in-container/deep-class-in-container:__style_module_css-deep-class-in-container/placeholder-gray-700:__style_module_css-placeholder-gray-700/placeholder-opacity:--_style_module_css-placeholder-opacity/test:--_style_module_css-test/baz:__style_module_css-baz/slidein:__style_module_css-slidein/my-global-class-again:__style_module_css-my-global-class-again/first-nested:__style_module_css-first-nested/first-nested-nested:__style_module_css-first-nested-nested/first-nested-at-rule:__style_module_css-first-nested-at-rule/first-nested-nested-at-rule-deep:__style_module_css-first-nested-nested-at-rule-deep/foo:--_style_module_css-foo/broken:__style_module_css-broken/comments:__style_module_css-comments/error:__style_module_css-error/err-404:__style_module_css-err-404/qqq:__style_module_css-qqq/parent:__style_module_css-parent/scope:__style_module_css-scope/limit:__style_module_css-limit/content:__style_module_css-content/card:__style_module_css-card/baz-1:__style_module_css-baz-1/baz-2:__style_module_css-baz-2/my-class:__style_module_css-my-class/feature:__style_module_css-feature/class-1:__style_module_css-class-1/infobox:__style_module_css-infobox/header:__style_module_css-header/item-size:--_style_module_css-item-size/container:__style_module_css-container/item-color:--_style_module_css-item-color/item:__style_module_css-item/two:__style_module_css-two/three:__style_module_css-three/initial:__style_module_css-initial/None:__style_module_css-None/item-1:__style_module_css-item-1/var:__style_module_css-var/main-color:--_style_module_css-main-color/FOO:--_style_module_css-FOO/accent-background:--_style_module_css-accent-background/external-link:--_style_module_css-external-link/custom-prop:--_style_module_css-custom-prop/default-value:--_style_module_css-default-value/main-bg-color:--_style_module_css-main-bg-color/backup-bg-color:--_style_module_css-backup-bg-color/var-order:__style_module_css-var-order/&\\\\.\\\\/style\\\\.module\\\\.css,myCssClass:__style_module_my-css-myCssClass/&\\\\.\\\\/style\\\\.module\\\\.my-css,&\\\\.\\\\/style\\\\.module\\\\.css\\\\.invalid,UnusedClassName:__identifiers_module_css-UnusedClassName/variable-unused-class:--_identifiers_module_css-variable-unused-class/UsedClassName:__identifiers_module_css-UsedClassName/variable-used-class:--_identifiers_module_css-variable-used-class/&\\\\.\\\\/identifiers\\\\.module\\\\.css;}" +head{--webpack-use-style_js:red-v1:blue/red-i:blue/blue-v1:red/blue-i:red/a:\\\\\\"test-a\\\\\\"/b:\\\\\\"test-b\\\\\\"/--red:var\\\\(--color\\\\)/test-v1:blue/test-v2:blue/red-v2:blue/green-v2:yellow/red-v3:blue/red-v4:blue/&\\\\.\\\\/colors\\\\.module\\\\.css,my-red:blue/value-in-class:__at-rule-value_module_css-value-in-class/v-comment-broken:/v-comment-broken-v1:\\\\/\\\\*\\\\ comment\\\\ \\\\*\\\\//small:\\\\(max-width\\\\:\\\\ 599px\\\\)/blue-v1:red/foo:__at-rule-value_module_css-foo/blue-v3:red/bar:__at-rule-value_module_css-bar/blue-v4:red/test-t:_40px/test_q:_36px/colorValue:red/colorValue-v1:red/colorValue-v2:red/colorValue-v3:\\\\.red/export:__at-rule-value_module_css-export/colors:\\\\\\"\\\\.\\\\/colors\\\\.module\\\\.css\\\\\\"/aaa:red/bbb:red/class-a:__at-rule-value_module_css-class-a/base:_10px/large:calc\\\\(base\\\\ \\\\*\\\\ 2\\\\)/named:red/__3char:\\\\#0f0/__6char:\\\\#00ff00/rgba:rgba\\\\(34\\\\,\\\\ 12\\\\,\\\\ 64\\\\,\\\\ 0\\\\.3\\\\)/hsla:hsla\\\\(220\\\\,\\\\ 13\\\\.0\\\\%\\\\,\\\\ 18\\\\.0\\\\%\\\\,\\\\ 1\\\\)/coolShadow:_0\\\\ 11px\\\\ 15px\\\\ -7px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.2\\\\)\\\\,0\\\\ 24px\\\\ 38px\\\\ 3px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.14\\\\)/func:color\\\\(red\\\\ lightness\\\\(50\\\\%\\\\)\\\\)/v-color:red/color:__at-rule-value_module_css-color/v-empty:\\\\ /v-empty-v2:\\\\ \\\\ \\\\ /v-empty-v3:\\\\/\\\\*\\\\ comment\\\\ \\\\*\\\\//override:red/class:__at-rule-value_module_css-class/blue-v5:\\\\/\\\\*\\\\ test\\\\ \\\\*\\\\/red\\\\/\\\\*\\\\ test\\\\ \\\\*\\\\//blue-v6:\\\\/\\\\*\\\\ test\\\\ \\\\*\\\\/\\\\/\\\\*\\\\ test\\\\ \\\\*\\\\/red\\\\/\\\\*\\\\ test\\\\ \\\\*\\\\//coolShadow-v2:_0\\\\ 11px\\\\ 15px\\\\ -7px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.2\\\\)\\\\,0\\\\ 24px\\\\ 38px\\\\ 3px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.14\\\\)/coolShadow-v3:_0\\\\ 11px\\\\ 15px\\\\ -7px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.2\\\\)\\\\,0\\\\ 24px\\\\ 38px\\\\ 3px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.14\\\\)/coolShadow-v4:\\\\/\\\\*\\\\ test\\\\ \\\\*\\\\/\\\\ \\\\ \\\\ 0\\\\ 11px\\\\ 15px\\\\ -7px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.2\\\\)\\\\,0\\\\ 24px\\\\ 38px\\\\ 3px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.14\\\\)/coolShadow-v5:\\\\/\\\\*\\\\ test\\\\ \\\\*\\\\/0\\\\ 11px\\\\ 15px\\\\ -7px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.2\\\\)\\\\,0\\\\ 24px\\\\ 38px\\\\ 3px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.14\\\\)/coolShadow-v6:_0\\\\ 11px\\\\ 15px\\\\ -7px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.2\\\\)\\\\,0\\\\ 24px\\\\ 38px\\\\ 3px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.14\\\\)/coolShadow-v7:\\\\/\\\\*\\\\ test\\\\ \\\\*\\\\/0\\\\ 11px\\\\ 15px\\\\ -7px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.2\\\\)\\\\,0\\\\ 24px\\\\ 38px\\\\ 3px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.14\\\\)/test:/&\\\\.\\\\/at-rule-value\\\\.module\\\\.css,class:__style_module_css-class/local1:__style_module_css-local1/local2:__style_module_css-local2/local3:__style_module_css-local3/local4:__style_module_css-local4/local5:__style_module_css-local5/local6:__style_module_css-local6/local7:__style_module_css-local7/disabled:__style_module_css-disabled/mButtonDisabled:__style_module_css-mButtonDisabled/tipOnly:__style_module_css-tipOnly/local8:__style_module_css-local8/parent1:__style_module_css-parent1/child1:__style_module_css-child1/vertical-tiny:__style_module_css-vertical-tiny/vertical-small:__style_module_css-vertical-small/otherDiv:__style_module_css-otherDiv/horizontal-tiny:__style_module_css-horizontal-tiny/horizontal-small:__style_module_css-horizontal-small/description:__style_module_css-description/local9:__style_module_css-local9/local10:__style_module_css-local10/local11:__style_module_css-local11/local12:__style_module_css-local12/local13:__style_module_css-local13/local14:__style_module_css-local14/local15:__style_module_css-local15/local16:__style_module_css-local16/nested1:__style_module_css-nested1/nested3:__style_module_css-nested3/ident:__style_module_css-ident/localkeyframes:__style_module_css-localkeyframes/pos1x:--_style_module_css-pos1x/pos1y:--_style_module_css-pos1y/pos2x:--_style_module_css-pos2x/pos2y:--_style_module_css-pos2y/localkeyframes2:__style_module_css-localkeyframes2/animation:__style_module_css-animation/vars:__style_module_css-vars/local-color:--_style_module_css-local-color/globalVars:__style_module_css-globalVars/wideScreenClass:__style_module_css-wideScreenClass/narrowScreenClass:__style_module_css-narrowScreenClass/displayGridInSupports:__style_module_css-displayGridInSupports/floatRightInNegativeSupports:__style_module_css-floatRightInNegativeSupports/displayFlexInMediaInSupports:__style_module_css-displayFlexInMediaInSupports/displayFlexInSupportsInMedia:__style_module_css-displayFlexInSupportsInMedia/displayFlexInSupportsInMediaUpperCase:__style_module_css-displayFlexInSupportsInMediaUpperCase/animationUpperCase:__style_module_css-animationUpperCase/localkeyframesUPPERCASE:__style_module_css-localkeyframesUPPERCASE/localkeyframes2UPPPERCASE:__style_module_css-localkeyframes2UPPPERCASE/localUpperCase:__style_module_css-localUpperCase/VARS:__style_module_css-VARS/LOCAL-COLOR:--_style_module_css-LOCAL-COLOR/globalVarsUpperCase:__style_module_css-globalVarsUpperCase/inSupportScope:__style_module_css-inSupportScope/a:__style_module_css-a/animationName:__style_module_css-animationName/b:__style_module_css-b/c:__style_module_css-c/d:__style_module_css-d/animation-name:--_style_module_css-animation-name/mozAnimationName:__style_module_css-mozAnimationName/my-color:--_style_module_css-my-color/my-color-1:--_style_module_css-my-color-1/my-color-2:--_style_module_css-my-color-2/padding-sm:__style_module_css-padding-sm/padding-lg:__style_module_css-padding-lg/nested-pure:__style_module_css-nested-pure/nested-media:__style_module_css-nested-media/nested-supports:__style_module_css-nested-supports/nested-layer:__style_module_css-nested-layer/not-selector-inside:__style_module_css-not-selector-inside/nested-var:__style_module_css-nested-var/again:__style_module_css-again/nested-with-local-pseudo:__style_module_css-nested-with-local-pseudo/local-nested:__style_module_css-local-nested/bar:--_style_module_css-bar/id-foo:__style_module_css-id-foo/id-bar:__style_module_css-id-bar/nested-parens:__style_module_css-nested-parens/local-in-global:__style_module_css-local-in-global/in-local-global-scope:__style_module_css-in-local-global-scope/class-local-scope:__style_module_css-class-local-scope/class-in-container:__style_module_css-class-in-container/deep-class-in-container:__style_module_css-deep-class-in-container/placeholder-gray-700:__style_module_css-placeholder-gray-700/placeholder-opacity:--_style_module_css-placeholder-opacity/test:--_style_module_css-test/baz:__style_module_css-baz/slidein:__style_module_css-slidein/my-global-class-again:__style_module_css-my-global-class-again/first-nested:__style_module_css-first-nested/first-nested-nested:__style_module_css-first-nested-nested/first-nested-at-rule:__style_module_css-first-nested-at-rule/first-nested-nested-at-rule-deep:__style_module_css-first-nested-nested-at-rule-deep/foo:--_style_module_css-foo/broken:__style_module_css-broken/comments:__style_module_css-comments/error:__style_module_css-error/err-404:__style_module_css-err-404/qqq:__style_module_css-qqq/parent:__style_module_css-parent/scope:__style_module_css-scope/limit:__style_module_css-limit/content:__style_module_css-content/card:__style_module_css-card/baz-1:__style_module_css-baz-1/baz-2:__style_module_css-baz-2/my-class:__style_module_css-my-class/feature:__style_module_css-feature/class-1:__style_module_css-class-1/infobox:__style_module_css-infobox/header:__style_module_css-header/item-size:--_style_module_css-item-size/container:__style_module_css-container/item-color:--_style_module_css-item-color/item:__style_module_css-item/two:__style_module_css-two/three:__style_module_css-three/initial:__style_module_css-initial/None:__style_module_css-None/item-1:__style_module_css-item-1/var:__style_module_css-var/main-color:--_style_module_css-main-color/FOO:--_style_module_css-FOO/accent-background:--_style_module_css-accent-background/external-link:--_style_module_css-external-link/custom-prop:--_style_module_css-custom-prop/default-value:--_style_module_css-default-value/main-bg-color:--_style_module_css-main-bg-color/backup-bg-color:--_style_module_css-backup-bg-color/var-order:__style_module_css-var-order/&\\\\.\\\\/style\\\\.module\\\\.css,myCssClass:__style_module_my-css-myCssClass/&\\\\.\\\\/style\\\\.module\\\\.my-css,&\\\\.\\\\/style\\\\.module\\\\.css\\\\.invalid,UnusedClassName:__identifiers_module_css-UnusedClassName/variable-unused-class:--_identifiers_module_css-variable-unused-class/UsedClassName:__identifiers_module_css-UsedClassName/variable-used-class:--_identifiers_module_css-variable-used-class/&\\\\.\\\\/identifiers\\\\.module\\\\.css;}" `; exports[`ConfigCacheTestCases css css-modules exported tests should allow to create css modules: prod 1`] = ` @@ -1287,9 +1539,261 @@ Object { `; exports[`ConfigCacheTestCases css css-modules exported tests should allow to create css modules: prod 2`] = ` -"/*!******************************!*\\\\ +"/*!*******************************!*\\\\ + !*** css ./colors.module.css ***! + \\\\*******************************/ + + + + + + + + + + + + + + +/*!**************************************!*\\\\ + !*** css ./at-rule-value.module.css ***! + \\\\**************************************/ + + +.my-app-744-value-in-class { + color: blue; +} + + + + + + +@media (max-width: 599px) { + abbr:hover { + color: limegreen; + transition-duration: 1s; + } +} + + + +.my-app-744-foo { color: red; } + + + +.my-app-744-foo { + &.my-app-744-bar { color: red; } +} + + + +.my-app-744-foo { + @media (min-width: 1024px) { + &.my-app-744-bar { color: red; } + } +} + + + +.my-app-744-foo { + @media (min-width: 1024px) { + &.my-app-744-bar { + @media (min-width: 1024px) { + color: red; + } + } + } +} + + + + +.my-app-744-foo { height: 40px; height: 36px; } + + + +.my-app-744-colorValue { + color: red; +} + + + +#my-app-744-colorValue-v1 { + color: red; +} + + + +.my-app-744-colorValue-v2 > .my-app-744-colorValue-v2 { + color: red; +} + + + +.red { + color: .red; +} + + + +.my-app-744-export { + color: blue; +} + + + +.my-app-744-foo { color: red; } + + + +.my-app-744-foo { color: red; } +.my-app-744-bar { color: yellow } + + + + +.my-app-744-foo { color: blue; } + + + + +.my-app-744-foo { color: blue; } + + + + +.my-app-744-class-a { color: red; } + + + + +.my-app-744-class-a { margin: calc(base * 2); } + + + + +.my-app-744-class-a { content: \\"test-a\\" \\"test-b\\"; } + + + +.my-app-744-foo { color: var(--color); } + + + + + + + +.my-app-744-foo { + color: red; + background-color: #0f0; + border-top-color: #00ff00; + border-bottom-color: rgba(34, 12, 64, 0.3); + outline-color: hsla(220, 13.0%, 18.0%, 1); +} + + + +.my-app-744-foo { color: blue; } +.my-app-744-bar { color: red } + + + +.my-app-744-foo { box-shadow: 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +.my-app-744-foo { color: color(red lightness(50%)); } + + + +:root { --my-app-744-color: red; } + + + +:root { --my-app-744-color: ; } + + + +:root { --my-app-744-color: ; } + + + +:root { --my-app-744-color:/* comment */; } + + + + +.my-app-744-override { + color: red; +} + + + + +.my-app-744-class { + color: red; + color: red; + color: blue; +} + + + +.my-app-744-color { + color: /* test */red/* test */; +} + + + +.my-app-744-color { + color: /* test *//* test */red/* test */; +} + + + +.my-app-744-foo { box-shadow: 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +.my-app-744-foo { box-shadow: 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +.my-app-744-foo { box-shadow: /* test */ 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +.my-app-744-foo { box-shadow: /* test */0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +.my-app-744-foo { box-shadow: 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +.my-app-744-foo { box-shadow: /* test */0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +.my-app-744-foo { color: blue; } + + + +.my-app-744-foo { color: blue; } + + + +.my-app-744-foo { color: my-name-q; } + + + + +/*!******************************!*\\\\ !*** css ./style.module.css ***! \\\\******************************/ + .my-app-235-zg { color: red; } @@ -2452,7 +2956,7 @@ div { --my-app-194-c5: 10px; } -head{--webpack-my-app-226:zg:my-app-235-Ā/HiĂĄĆĈĊČĐ/OBĒąćĉċ-Ě/VEĜĔğČĤę2ĦĞĖġ2ģjĭĕĠVjęHĴĨġHď5ĻįH5/aqŁĠņģNňĩNģMō-VM/AOŒŗďŇăĝĵėqę4ŒO4ďbŒHbęPŤPďwũw/nŨŝħįŵ/\\\\$QŒżQ/bDŒƃŻ$tſƈ/qđ--ŷĮĠƍ/xěƏƑş-ƖƇ6:ƘēƒČż6/gJƟƐơƚƧƕŒx/lYŒƲ/fŒf/uzƩƙļƻŅKŒaKŅ7ǃ7ƺƷƾįuƹsWŒǐ/TZŒǕŅƳnjʼnY/IIŒǟ/iijǛČǤ/zGŒǪ/DkŒǯ/XĥǦ-ǴǞ0ƽƫļI0/wƉǶȁŴcŒncǣǖǶiZ/ZŭƠŞļȐ/MƞǶȗ/rXǻȓįȜ/dǑǶȣ/cƄǶȨȖǺȒŸĠMǿVǺǶȳ/CđǶȸƂǂǶbDžY1ŒɁ/ƳȮƢ-ǝtƞɇƚɋ/KRŒɑ/FǰǶɖ/prȞȯČɛ/sƄɍļɢƦƼɤįgzģhŒVh/veɝɈɳƂāɩĠbg/BǑɺČɿ/WǠʁ-ʅȷɜʇCrǣ3ɵƚi3/tvʑļʖ/&_Ė,ɗǼ6ʢ-kʛ_ʢ6,ʜ81ʩRƨɤ194-ʯȏLĻʲʴZLȧŀʱʳ-cńʜʺ;}" +head{--webpack-my-app-226:red-v1:blue/ĀĂiĆĈĊćĉăąČ/Ēe-ĎĖa:\\\\\\"test-ağėĞĠĢĤbħ--Č:var\\\\(įcoloĵ)/ġģĔďĉĿīă2ŃĊČŇʼn/gĀenŌyelĻwċāă3ōŋv4ō&_220,myİāōijĐĚŒclass:Ũĥpp-744ăaŮiŰŲŴ/v-ĹmmőĬrokő:ƆƈoƊƌ-bƎƐŒĄĞ/\\\\*\\\\ ƉƋntƢƠ\\\\//smƀlĞ(Ʈx-width\\\\Ğ 599px\\\\ľĘłĖfooŶũaŹŻŽ-LjoėŮvŜĖbĴNjŸźżžǙrǔēş:ĖŀĤt:_40ǁŅģ_qǪ36ǮĹĻrVƀĉǥā/ǷļǺǕĕǾȀǹǻęvňĖȆȂǣŜ\\\\.ĖexpļǩŷǍǝǐȔȖrtǿĺļŵğȑƪȆsȑmoduleȑcŴħaȵǽdėbbȷǿƄsĥǛȚǏžűųȿaėųeǪ1ǭx/ŲrgɋcƀcĶǙsȰ Ʃ 2ǃ/naƋdȼ__3chǚ\\\\#0f0/ɧ6ɪɬɮɯɰɱɒǙǥgǙĶ34\\\\,Ƣ1ɟʄ 6ʂʈ0ȑ3ɠhsŲ:ʑŲĶŤʍʈ1ʏ.ʍ%ʃʅ8ȑʞʠ 1ɠĹĺSɫdowǪʍʦ1ǁʅ5ʴ ŻʷɻĦ(ʙʾʠ.ɟ)ʃʱ24ʷ38ˈʺɾʼʿ,ʙȑ1ʂľfunc:ȆĶČƢlightnĢȩ(5ʤ˃ľƇȆȼ˭șǎǞƔǸƓemptyƼ˵˷˹Ōƨɜ ˼˸ũǖƞɝƤƌƨơƫoverrƷɋȌȾɁ˱ǐɅƅDžv5̇ơ ǧ̋ƪ˝Ɵ̢̠ɜ̌Ǣȉ6̟Ƣ̨ƩƟ̦̯ị̄řdƪɝ̰̪ʩlʫaʭwŌ_ʱ1ʳǂʦʶ͈ʹ͈ʻĶˏˑˁǃ˄Ƣˆˈˊ͈3ˌɿʽ͔ːˀ˓ʨlj̾ʬʮśʰʅ͇ʵʷ͌Ƣ͎͟͝ͱȑ˂͔ɞˇ͙͘Ƣ͚͍ˍ͏͑͞͡ľ̽̿́ăŞ̵̹̩̹̌́Ƣ͉ͪͬͅ7͛ˎͿˀʹ͟Ͷ͗ˋͼ͐͜͠˔ȡʪ̡̝̮ͥ͂Ί̱Ώʷ1͊Ƣͭ ͯΟʄ͒˃Ι͖͸ΜͮͽͰˏ˒Ρ΃Τă̭̈́ͩάήʸΓΝΕͱ͑Θ˅ͷͺ͹ ͻλΞΖδ΁΢ͤ̀ͦv7Χ̻ƪΫ͈έΒΔ;ύΗ͓ηϑϔϓϕαμγοɠǧƒŢǞ,zg̗ź235-ϼ/HĎ˰ϿЁ-І/OBϾ-ЀЂЎ/VEАВ-ЖЍňЈБЊO2ЕjИЊVjЍHХГHЅ̞ОЙH5/aDzаЊеЕNЫКNЕMмVM/AOмхЅжnjǎбqЍŠзГ4ЅȻёЋbЍPмOPЅʯіHŘnѕыЉЂѣƟ$Qм\\\\ѪėDмbDѩȘѥПЂѭȠqĎįіѻ/xЏѽѶЙҁѩ̭҃ǜѷ-ѭ6ŎJ:҉ɂЙgJҀмɏlYмҚ/fмf/uzґ-іңдKмaKдϠіa7ҢҟҧҡsWмҷ/TZмҼдқҰY/IIмӅ/iФіӊ/zGмӏ/DkмӔ/XЗіәӄ0ҥіIɱwѵҊЙӣɡ˙і˘ӉҽӌZ/ZњҒьЊӱ/M̭іӸċXӟ҄ЊrX/dҸіԄǿѰіcѳMӞӳѦ-ԍЕӞіVɱCЇӿЂԘėҪіbҭYąіԢ/қԏҋӃt҈ҦԚ-ԫ/KRмԲ/FӕіԷ/prӾӥЊԼƬѰԨЙsѳgҤՄЊՈЕhсhƆɋՊЂ̏ėϽՓƘg/BҸ՘՜/Wӆ՘ա/CԽ՘զӉŜ՘i3ĿvԾғЊtv/ŢВ,ԸѶ6ռ-kն_ռ6,Ţ81փRҐԨ19ž։ӰLА֌žZLǿ̞֋֍ƈгŢ֓;}" `; exports[`ConfigCacheTestCases css css-modules-broken-keyframes exported tests should allow to create css modules: prod 1`] = ` @@ -5347,26 +5851,337 @@ head{--webpack-main:&\\\\.\\\\/style\\\\.css;}", ] `; +exports[`ConfigCacheTestCases css pseudo-import exported tests should compile 1`] = ` +Array [ + "/*!********************************!*\\\\ + !*** css ./export.modules.css ***! + \\\\********************************/ + +/*!*********************************!*\\\\ + !*** css ./library.modules.css ***! + \\\\*********************************/ + +/*!*******************************!*\\\\ + !*** css ./after.modules.css ***! + \\\\*******************************/ + +/*!********************************!*\\\\ + !*** css ./vars-1.modules.css ***! + \\\\********************************/ + +/*!*******************************!*\\\\ + !*** css ./style.modules.css ***! + \\\\*******************************/ + + +._style_modules_css-class { + color: red; + background: red; +} + + +._style_modules_css-class {background: red} + +._style_modules_css-class { + color: red; + color: red; + color: red; + color: red; +} + + +._style_modules_css-class { + color: red; +} + + +._style_modules_css-class { + color: red; +} + +/* TODO fix me */ +/*:import(\\"reexport.modules.css\\") { + primary-color: _my_color; +} + +.class {color: primary-color}*/ + + +._style_modules_css-class { + color: red, red, func() ; +} + +._style_modules_css-nest { + :import(\\"./export.modules.css\\") { + unknown: unknown; + } + + :export { + unknown: unknown; + } + + unknown: unknown; +} + +head{--webpack-main:primary-color:red/&\\\\.\\\\/export\\\\.modules\\\\.css,a:red/_-b:red/--c:red/__d:red/&\\\\.\\\\/library\\\\.modules\\\\.css,somevalue:red/&\\\\.\\\\/after\\\\.modules\\\\.css,multile-values:red\\\\,\\\\ red\\\\,\\\\ func\\\\(\\\\)/&\\\\.\\\\/vars-1\\\\.modules\\\\.css,class:__style_modules_css-class/nest:__style_modules_css-nest/&\\\\.\\\\/style\\\\.modules\\\\.css;}", +] +`; + exports[`ConfigCacheTestCases css pure-css exported tests should compile 1`] = ` Array [ - "/*!*******************************************!*\\\\ + "/*!***************************************************!*\\\\ + !*** css ../css-modules/at-rule-value.module.css ***! + \\\\***************************************************/ +@value my-red blue; + +.value-in-class { + color: my-red; +} + +@value v-comment-broken:; +@value v-comment-broken-v1:/* comment */; + +@value small: (max-width: 599px); + +@media small { + abbr:hover { + color: limegreen; + transition-duration: 1s; + } +} + +@value blue-v1: red; + +.foo { color: blue-v1; } + +@value blue-v3: red; + +.foo { + &.bar { color: blue-v3; } +} + +@value blue-v3: red; + +.foo { + @media (min-width: 1024px) { + &.bar { color: blue-v3; } + } +} + +@value blue-v4: red; + +.foo { + @media (min-width: 1024px) { + &.bar { + @media (min-width: 1024px) { + color: blue-v4; + } + } + } +} + +@value test-t: 40px; +@value test_q: 36px; + +.foo { height: test-t; height: test_q; } + +@value colorValue: red; + +.colorValue { + color: colorValue; +} + +@value colorValue-v1: red; + +#colorValue-v1 { + color: colorValue-v1; +} + +@value colorValue-v2: red; + +.colorValue-v2 > .colorValue-v2 { + color: colorValue-v2; +} + +@value colorValue-v3: .red; + +colorValue-v3 { + color: colorValue-v3; +} + +@value red-v2 from \\"./colors.module.css\\"; + +.export { + color: red-v2; +} + +@value blue-v1 as green from \\"./colors.module.css\\"; + +.foo { color: green; } + +@value blue-i, green-v2 from \\"./colors.module.css\\"; + +.foo { color: blue-i; } +.bar { color: green-v2 } + +@value red-v3 from colors; +@value colors: \\"./colors.module.css\\"; + +.foo { color: red-v3; } + +@value colors: \\"./colors.module.css\\"; +@value red-v4 from colors; + +.foo { color: red-v4; } + +@value aaa: red; +@value bbb: aaa; + +.class-a { color: bbb; } + +@value base: 10px; +@value large: calc(base * 2); + +.class-a { margin: large; } + +@value a from \\"./colors.module.css\\"; +@value b from \\"./colors.module.css\\"; + +.class-a { content: a b; } + +@value --red from \\"./colors.module.css\\"; + +.foo { color: --red; } + +@value named: red; +@value _3char #0f0; +@value _6char #00ff00; +@value rgba rgba(34, 12, 64, 0.3); +@value hsla hsla(220, 13.0%, 18.0%, 1); + +.foo { + color: named; + background-color: _3char; + border-top-color: _6char; + border-bottom-color: rgba; + outline-color: hsla; +} + +@value (blue-i, red-i) from \\"./colors.module.css\\"; + +.foo { color: red-i; } +.bar { color: blue-i } + +@value coolShadow: 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14) ; + +.foo { box-shadow: coolShadow; } + +@value func: color(red lightness(50%)); + +.foo { color: func; } + +@value v-color: red; + +:root { --color: v-color; } + +@value v-empty: ; + +:root { --color:v-empty; } + +@value v-empty-v2: ; + +:root { --color:v-empty-v2; } + +@value v-empty-v3: /* comment */; + +:root { --color:v-empty-v3; } + +@value override: blue; +@value override: red; + +.override { + color: override; +} + +@value (blue-v1 as my-name) from \\"./colors.module.css\\"; +@value (blue-v1 as my-name-again, red-v1) from \\"./colors.module.css\\"; + +.class { + color: my-name; + color: my-name-again; + color: red-v1; +} + +@value/* test */blue-v5/* test */:/* test */red/* test */; + +.color { + color: blue-v5; +} + +@value/* test */blue-v6/* test *//* test */red/* test */; + +.color { + color: blue-v6; +} + +@value coolShadow-v2 : 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14) ; + +.foo { box-shadow: coolShadow-v2; } + +@value /* test */ coolShadow-v3 /* test */ : 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14) ; + +.foo { box-shadow: coolShadow-v3; } + +@value /* test */ coolShadow-v4 /* test */ 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14) ; + +.foo { box-shadow: coolShadow-v4; } + +@value/* test */coolShadow-v5/* test */0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); + +.foo { box-shadow: coolShadow-v5; } + +@value/* test */coolShadow-v6/* test */:0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); + +.foo { box-shadow: coolShadow-v6; } + +@value/* test */coolShadow-v7/* test */:/* test */0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); + +.foo { box-shadow: coolShadow-v7; } + +@value /* test */ test-v1 /* test */ from /* test */ \\"./colors.module.css\\" /* test */; + +.foo { color: test-v1; } + +@value/* test */test-v2/* test */from/* test */\\"./colors.module.css\\"/* test */; + +.foo { color: test-v2; } + +@value/* test */(/* test */blue/* test */as/* test */my-name-q/* test */)/* test */from/* test */\\"./colors.module.css\\"/* test */; + +.foo { color: my-name-q; } + +@value; +@value test; + +/*!*******************************************!*\\\\ !*** css ../css-modules/style.module.css ***! \\\\*******************************************/ + .class { color: red; } .local1, -.local2 .global, +.local2 :global .global, .local3 { color: green; } -.global ._css-modules_style_module_css-local4 { +:global .global :local .local4 { color: yellow; } -.local5.global.local6 { +.local5:global(.global).local6 { color: blue; } @@ -5434,7 +6249,7 @@ Array [ overflow: hidden; } -._css-modules_style_module_css-nested1.nested2.nested3 { +:global(:global(:local(.nested1)).nested2).nested3 { color: pink; } @@ -5483,7 +6298,7 @@ Array [ --local-color: red; } -.globalVars { +.globalVars :global { color: var(--global-color); --global-color: red; } @@ -5569,7 +6384,7 @@ Array [ } } -.globalUpperCase ._css-modules_style_module_css-localUpperCase { +:GLOBAL .globalUpperCase :LOCAL .localUpperCase { color: yellow; } @@ -5578,7 +6393,7 @@ Array [ --LOCAL-COLOR: red; } -.globalVarsUpperCase { +.globalVarsUpperCase :GLOBAL { COLOR: VAR(--GLOBAR-COLOR); --GLOBAR-COLOR: red; } @@ -5754,31 +6569,31 @@ Array [ .nested-with-local-pseudo { color: red; - ._css-modules_style_module_css-local-nested { + :local .local-nested { color: red; } - .global-nested { + :global .global-nested { color: red; } - ._css-modules_style_module_css-local-nested { + :local(.local-nested) { color: red; } - .global-nested { + :global(.global-nested) { color: red; } - ._css-modules_style_module_css-local-nested, .global-nested-next { + :local .local-nested, :global .global-nested-next { color: red; } - ._css-modules_style_module_css-local-nested, .global-nested-next { + :local(.local-nested), :global(.global-nested-next) { color: red; } - .foo, .bar { + :global .foo, .bar { color: red; } } @@ -5799,12 +6614,12 @@ Array [ } } -.global-foo { +:global .global-foo { .nested-global { color: red; } - ._css-modules_style_module_css-local-in-global { + :local .local-in-global { color: blue; } } @@ -5817,9 +6632,9 @@ Array [ } } -.class ._css-modules_style_module_css-in-local-global-scope, -.class ._css-modules_style_module_css-in-local-global-scope, -._css-modules_style_module_css-class-local-scope .in-local-global-scope { +:global .class :local .in-local-global-scope, +:global .class :local .in-local-global-scope, +:local .class-local-scope :global .in-local-global-scope { color: red; } @@ -5895,14 +6710,14 @@ Array [ bar: env(foo, var(--baz)); } -.global-foo, ._css-modules_style_module_css-bar { - ._css-modules_style_module_css-local-in-global { +:global .global-foo, :local .bar { + :local .local-in-global { color: blue; } @media screen { - .my-global-class-again, - ._css-modules_style_module_css-my-global-class-again { + :global .my-global-class-again, + :local .my-global-class-again { color: red; } } @@ -5922,12 +6737,12 @@ Array [ } } -.again-global { +:global .again-global { color:red; } -.again-again-global { - .again-again-global { +:global .again-again-global { + :global .again-again-global { color: red; } } @@ -5936,22 +6751,22 @@ Array [ --foo: red; } -.again-again-global { +:global .again-again-global { color: var(--foo); - .again-again-global { + :global .again-again-global { color: var(--foo); } } -.again-again-global { +:global .again-again-global { animation: slidein 3s; - .again-again-global, .class, ._css-modules_style_module_css-nested1.nested2.nested3 { + :global .again-again-global, .class, :global(:global(:local(.nested1)).nested2).nested3 { animation: slidein 3s; } - .local2 .global, + .local2 :global .global, .local3 { color: red; } @@ -6019,19 +6834,19 @@ Array [ } .comments { - .class { + :/** test */global(.class) { color: red; } - .class { + :/** test */global .class { color: red; } - ._css-modules_style_module_css-class { + :/** test */local(.class) { color: red; } - ._css-modules_style_module_css-class { + :/** test */local .class { color: red; } @@ -6039,11 +6854,11 @@ Array [ color: red; } - ./** test **/_css-modules_style_module_css-class { + :local(./** test **/class) { color: red; } - ./** test **/_css-modules_style_module_css-class { + :local ./** test **/class { color: red; } } @@ -6503,28 +7318,31 @@ div { } } -._style_css-class { +:local(.class) { color: red; } -._style_css-class { +:local .class { color: green; } -.class { +:global(.class) { color: blue; } -.class { +:global .class { color: white; } +:export { + foo: bar; +} .class { animation: test 1s, test; } -head{--webpack-main:local4:__css-modules_style_module_css-local4/nested1:__css-modules_style_module_css-nested1/localUpperCase:__css-modules_style_module_css-localUpperCase/local-nested:__css-modules_style_module_css-local-nested/local-in-global:__css-modules_style_module_css-local-in-global/in-local-global-scope:__css-modules_style_module_css-in-local-global-scope/class-local-scope:__css-modules_style_module_css-class-local-scope/bar:__css-modules_style_module_css-bar/my-global-class-again:__css-modules_style_module_css-my-global-class-again/class:__css-modules_style_module_css-class/&\\\\.\\\\.\\\\/css-modules\\\\/style\\\\.module\\\\.css,class:__style_css-class/foo:bar/&\\\\.\\\\/style\\\\.css;}", +head{--webpack-main:&\\\\.\\\\.\\\\/css-modules\\\\/at-rule-value\\\\.module\\\\.css,&\\\\.\\\\.\\\\/css-modules\\\\/style\\\\.module\\\\.css,&\\\\.\\\\/style\\\\.css;}", ] `; diff --git a/test/__snapshots__/ConfigTestCases.basictest.js.snap b/test/__snapshots__/ConfigTestCases.basictest.js.snap index 4837046ba..55aabd6b3 100644 --- a/test/__snapshots__/ConfigTestCases.basictest.js.snap +++ b/test/__snapshots__/ConfigTestCases.basictest.js.snap @@ -70,9 +70,261 @@ Object { `; exports[`ConfigTestCases css css-modules exported tests should allow to create css modules: dev 2`] = ` -"/*!******************************!*\\\\ +"/*!*******************************!*\\\\ + !*** css ./colors.module.css ***! + \\\\*******************************/ + + + + + + + + + + + + + + +/*!**************************************!*\\\\ + !*** css ./at-rule-value.module.css ***! + \\\\**************************************/ + + +._at-rule-value_module_css-value-in-class { + color: blue; +} + + + + + + +@media (max-width: 599px) { + abbr:hover { + color: limegreen; + transition-duration: 1s; + } +} + + + +._at-rule-value_module_css-foo { color: red; } + + + +._at-rule-value_module_css-foo { + &._at-rule-value_module_css-bar { color: red; } +} + + + +._at-rule-value_module_css-foo { + @media (min-width: 1024px) { + &._at-rule-value_module_css-bar { color: red; } + } +} + + + +._at-rule-value_module_css-foo { + @media (min-width: 1024px) { + &._at-rule-value_module_css-bar { + @media (min-width: 1024px) { + color: red; + } + } + } +} + + + + +._at-rule-value_module_css-foo { height: 40px; height: 36px; } + + + +._at-rule-value_module_css-colorValue { + color: red; +} + + + +#_at-rule-value_module_css-colorValue-v1 { + color: red; +} + + + +._at-rule-value_module_css-colorValue-v2 > ._at-rule-value_module_css-colorValue-v2 { + color: red; +} + + + +.red { + color: .red; +} + + + +._at-rule-value_module_css-export { + color: blue; +} + + + +._at-rule-value_module_css-foo { color: red; } + + + +._at-rule-value_module_css-foo { color: red; } +._at-rule-value_module_css-bar { color: yellow } + + + + +._at-rule-value_module_css-foo { color: blue; } + + + + +._at-rule-value_module_css-foo { color: blue; } + + + + +._at-rule-value_module_css-class-a { color: red; } + + + + +._at-rule-value_module_css-class-a { margin: calc(base * 2); } + + + + +._at-rule-value_module_css-class-a { content: \\"test-a\\" \\"test-b\\"; } + + + +._at-rule-value_module_css-foo { color: var(--color); } + + + + + + + +._at-rule-value_module_css-foo { + color: red; + background-color: #0f0; + border-top-color: #00ff00; + border-bottom-color: rgba(34, 12, 64, 0.3); + outline-color: hsla(220, 13.0%, 18.0%, 1); +} + + + +._at-rule-value_module_css-foo { color: blue; } +._at-rule-value_module_css-bar { color: red } + + + +._at-rule-value_module_css-foo { box-shadow: 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +._at-rule-value_module_css-foo { color: color(red lightness(50%)); } + + + +:root { --_at-rule-value_module_css-color: red; } + + + +:root { --_at-rule-value_module_css-color: ; } + + + +:root { --_at-rule-value_module_css-color: ; } + + + +:root { --_at-rule-value_module_css-color:/* comment */; } + + + + +._at-rule-value_module_css-override { + color: red; +} + + + + +._at-rule-value_module_css-class { + color: red; + color: red; + color: blue; +} + + + +._at-rule-value_module_css-color { + color: /* test */red/* test */; +} + + + +._at-rule-value_module_css-color { + color: /* test *//* test */red/* test */; +} + + + +._at-rule-value_module_css-foo { box-shadow: 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +._at-rule-value_module_css-foo { box-shadow: 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +._at-rule-value_module_css-foo { box-shadow: /* test */ 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +._at-rule-value_module_css-foo { box-shadow: /* test */0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +._at-rule-value_module_css-foo { box-shadow: 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +._at-rule-value_module_css-foo { box-shadow: /* test */0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +._at-rule-value_module_css-foo { color: blue; } + + + +._at-rule-value_module_css-foo { color: blue; } + + + +._at-rule-value_module_css-foo { color: my-name-q; } + + + + +/*!******************************!*\\\\ !*** css ./style.module.css ***! \\\\******************************/ + ._style_module_css-class { color: red; } @@ -1235,7 +1487,7 @@ div { --_identifiers_module_css-variable-used-class: 10px; } -head{--webpack-use-style_js:class:__style_module_css-class/local1:__style_module_css-local1/local2:__style_module_css-local2/local3:__style_module_css-local3/local4:__style_module_css-local4/local5:__style_module_css-local5/local6:__style_module_css-local6/local7:__style_module_css-local7/disabled:__style_module_css-disabled/mButtonDisabled:__style_module_css-mButtonDisabled/tipOnly:__style_module_css-tipOnly/local8:__style_module_css-local8/parent1:__style_module_css-parent1/child1:__style_module_css-child1/vertical-tiny:__style_module_css-vertical-tiny/vertical-small:__style_module_css-vertical-small/otherDiv:__style_module_css-otherDiv/horizontal-tiny:__style_module_css-horizontal-tiny/horizontal-small:__style_module_css-horizontal-small/description:__style_module_css-description/local9:__style_module_css-local9/local10:__style_module_css-local10/local11:__style_module_css-local11/local12:__style_module_css-local12/local13:__style_module_css-local13/local14:__style_module_css-local14/local15:__style_module_css-local15/local16:__style_module_css-local16/nested1:__style_module_css-nested1/nested3:__style_module_css-nested3/ident:__style_module_css-ident/localkeyframes:__style_module_css-localkeyframes/pos1x:--_style_module_css-pos1x/pos1y:--_style_module_css-pos1y/pos2x:--_style_module_css-pos2x/pos2y:--_style_module_css-pos2y/localkeyframes2:__style_module_css-localkeyframes2/animation:__style_module_css-animation/vars:__style_module_css-vars/local-color:--_style_module_css-local-color/globalVars:__style_module_css-globalVars/wideScreenClass:__style_module_css-wideScreenClass/narrowScreenClass:__style_module_css-narrowScreenClass/displayGridInSupports:__style_module_css-displayGridInSupports/floatRightInNegativeSupports:__style_module_css-floatRightInNegativeSupports/displayFlexInMediaInSupports:__style_module_css-displayFlexInMediaInSupports/displayFlexInSupportsInMedia:__style_module_css-displayFlexInSupportsInMedia/displayFlexInSupportsInMediaUpperCase:__style_module_css-displayFlexInSupportsInMediaUpperCase/animationUpperCase:__style_module_css-animationUpperCase/localkeyframesUPPERCASE:__style_module_css-localkeyframesUPPERCASE/localkeyframes2UPPPERCASE:__style_module_css-localkeyframes2UPPPERCASE/localUpperCase:__style_module_css-localUpperCase/VARS:__style_module_css-VARS/LOCAL-COLOR:--_style_module_css-LOCAL-COLOR/globalVarsUpperCase:__style_module_css-globalVarsUpperCase/inSupportScope:__style_module_css-inSupportScope/a:__style_module_css-a/animationName:__style_module_css-animationName/b:__style_module_css-b/c:__style_module_css-c/d:__style_module_css-d/animation-name:--_style_module_css-animation-name/mozAnimationName:__style_module_css-mozAnimationName/my-color:--_style_module_css-my-color/my-color-1:--_style_module_css-my-color-1/my-color-2:--_style_module_css-my-color-2/padding-sm:__style_module_css-padding-sm/padding-lg:__style_module_css-padding-lg/nested-pure:__style_module_css-nested-pure/nested-media:__style_module_css-nested-media/nested-supports:__style_module_css-nested-supports/nested-layer:__style_module_css-nested-layer/not-selector-inside:__style_module_css-not-selector-inside/nested-var:__style_module_css-nested-var/again:__style_module_css-again/nested-with-local-pseudo:__style_module_css-nested-with-local-pseudo/local-nested:__style_module_css-local-nested/bar:--_style_module_css-bar/id-foo:__style_module_css-id-foo/id-bar:__style_module_css-id-bar/nested-parens:__style_module_css-nested-parens/local-in-global:__style_module_css-local-in-global/in-local-global-scope:__style_module_css-in-local-global-scope/class-local-scope:__style_module_css-class-local-scope/class-in-container:__style_module_css-class-in-container/deep-class-in-container:__style_module_css-deep-class-in-container/placeholder-gray-700:__style_module_css-placeholder-gray-700/placeholder-opacity:--_style_module_css-placeholder-opacity/test:--_style_module_css-test/baz:__style_module_css-baz/slidein:__style_module_css-slidein/my-global-class-again:__style_module_css-my-global-class-again/first-nested:__style_module_css-first-nested/first-nested-nested:__style_module_css-first-nested-nested/first-nested-at-rule:__style_module_css-first-nested-at-rule/first-nested-nested-at-rule-deep:__style_module_css-first-nested-nested-at-rule-deep/foo:--_style_module_css-foo/broken:__style_module_css-broken/comments:__style_module_css-comments/error:__style_module_css-error/err-404:__style_module_css-err-404/qqq:__style_module_css-qqq/parent:__style_module_css-parent/scope:__style_module_css-scope/limit:__style_module_css-limit/content:__style_module_css-content/card:__style_module_css-card/baz-1:__style_module_css-baz-1/baz-2:__style_module_css-baz-2/my-class:__style_module_css-my-class/feature:__style_module_css-feature/class-1:__style_module_css-class-1/infobox:__style_module_css-infobox/header:__style_module_css-header/item-size:--_style_module_css-item-size/container:__style_module_css-container/item-color:--_style_module_css-item-color/item:__style_module_css-item/two:__style_module_css-two/three:__style_module_css-three/initial:__style_module_css-initial/None:__style_module_css-None/item-1:__style_module_css-item-1/var:__style_module_css-var/main-color:--_style_module_css-main-color/FOO:--_style_module_css-FOO/accent-background:--_style_module_css-accent-background/external-link:--_style_module_css-external-link/custom-prop:--_style_module_css-custom-prop/default-value:--_style_module_css-default-value/main-bg-color:--_style_module_css-main-bg-color/backup-bg-color:--_style_module_css-backup-bg-color/var-order:__style_module_css-var-order/&\\\\.\\\\/style\\\\.module\\\\.css,myCssClass:__style_module_my-css-myCssClass/&\\\\.\\\\/style\\\\.module\\\\.my-css,&\\\\.\\\\/style\\\\.module\\\\.css\\\\.invalid,UnusedClassName:__identifiers_module_css-UnusedClassName/variable-unused-class:--_identifiers_module_css-variable-unused-class/UsedClassName:__identifiers_module_css-UsedClassName/variable-used-class:--_identifiers_module_css-variable-used-class/&\\\\.\\\\/identifiers\\\\.module\\\\.css;}" +head{--webpack-use-style_js:red-v1:blue/red-i:blue/blue-v1:red/blue-i:red/a:\\\\\\"test-a\\\\\\"/b:\\\\\\"test-b\\\\\\"/--red:var\\\\(--color\\\\)/test-v1:blue/test-v2:blue/red-v2:blue/green-v2:yellow/red-v3:blue/red-v4:blue/&\\\\.\\\\/colors\\\\.module\\\\.css,my-red:blue/value-in-class:__at-rule-value_module_css-value-in-class/v-comment-broken:/v-comment-broken-v1:\\\\/\\\\*\\\\ comment\\\\ \\\\*\\\\//small:\\\\(max-width\\\\:\\\\ 599px\\\\)/blue-v1:red/foo:__at-rule-value_module_css-foo/blue-v3:red/bar:__at-rule-value_module_css-bar/blue-v4:red/test-t:_40px/test_q:_36px/colorValue:red/colorValue-v1:red/colorValue-v2:red/colorValue-v3:\\\\.red/export:__at-rule-value_module_css-export/colors:\\\\\\"\\\\.\\\\/colors\\\\.module\\\\.css\\\\\\"/aaa:red/bbb:red/class-a:__at-rule-value_module_css-class-a/base:_10px/large:calc\\\\(base\\\\ \\\\*\\\\ 2\\\\)/named:red/__3char:\\\\#0f0/__6char:\\\\#00ff00/rgba:rgba\\\\(34\\\\,\\\\ 12\\\\,\\\\ 64\\\\,\\\\ 0\\\\.3\\\\)/hsla:hsla\\\\(220\\\\,\\\\ 13\\\\.0\\\\%\\\\,\\\\ 18\\\\.0\\\\%\\\\,\\\\ 1\\\\)/coolShadow:_0\\\\ 11px\\\\ 15px\\\\ -7px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.2\\\\)\\\\,0\\\\ 24px\\\\ 38px\\\\ 3px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.14\\\\)/func:color\\\\(red\\\\ lightness\\\\(50\\\\%\\\\)\\\\)/v-color:red/color:__at-rule-value_module_css-color/v-empty:\\\\ /v-empty-v2:\\\\ \\\\ \\\\ /v-empty-v3:\\\\/\\\\*\\\\ comment\\\\ \\\\*\\\\//override:red/class:__at-rule-value_module_css-class/blue-v5:\\\\/\\\\*\\\\ test\\\\ \\\\*\\\\/red\\\\/\\\\*\\\\ test\\\\ \\\\*\\\\//blue-v6:\\\\/\\\\*\\\\ test\\\\ \\\\*\\\\/\\\\/\\\\*\\\\ test\\\\ \\\\*\\\\/red\\\\/\\\\*\\\\ test\\\\ \\\\*\\\\//coolShadow-v2:_0\\\\ 11px\\\\ 15px\\\\ -7px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.2\\\\)\\\\,0\\\\ 24px\\\\ 38px\\\\ 3px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.14\\\\)/coolShadow-v3:_0\\\\ 11px\\\\ 15px\\\\ -7px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.2\\\\)\\\\,0\\\\ 24px\\\\ 38px\\\\ 3px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.14\\\\)/coolShadow-v4:\\\\/\\\\*\\\\ test\\\\ \\\\*\\\\/\\\\ \\\\ \\\\ 0\\\\ 11px\\\\ 15px\\\\ -7px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.2\\\\)\\\\,0\\\\ 24px\\\\ 38px\\\\ 3px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.14\\\\)/coolShadow-v5:\\\\/\\\\*\\\\ test\\\\ \\\\*\\\\/0\\\\ 11px\\\\ 15px\\\\ -7px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.2\\\\)\\\\,0\\\\ 24px\\\\ 38px\\\\ 3px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.14\\\\)/coolShadow-v6:_0\\\\ 11px\\\\ 15px\\\\ -7px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.2\\\\)\\\\,0\\\\ 24px\\\\ 38px\\\\ 3px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.14\\\\)/coolShadow-v7:\\\\/\\\\*\\\\ test\\\\ \\\\*\\\\/0\\\\ 11px\\\\ 15px\\\\ -7px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.2\\\\)\\\\,0\\\\ 24px\\\\ 38px\\\\ 3px\\\\ rgba\\\\(0\\\\,0\\\\,0\\\\,\\\\.14\\\\)/test:/&\\\\.\\\\/at-rule-value\\\\.module\\\\.css,class:__style_module_css-class/local1:__style_module_css-local1/local2:__style_module_css-local2/local3:__style_module_css-local3/local4:__style_module_css-local4/local5:__style_module_css-local5/local6:__style_module_css-local6/local7:__style_module_css-local7/disabled:__style_module_css-disabled/mButtonDisabled:__style_module_css-mButtonDisabled/tipOnly:__style_module_css-tipOnly/local8:__style_module_css-local8/parent1:__style_module_css-parent1/child1:__style_module_css-child1/vertical-tiny:__style_module_css-vertical-tiny/vertical-small:__style_module_css-vertical-small/otherDiv:__style_module_css-otherDiv/horizontal-tiny:__style_module_css-horizontal-tiny/horizontal-small:__style_module_css-horizontal-small/description:__style_module_css-description/local9:__style_module_css-local9/local10:__style_module_css-local10/local11:__style_module_css-local11/local12:__style_module_css-local12/local13:__style_module_css-local13/local14:__style_module_css-local14/local15:__style_module_css-local15/local16:__style_module_css-local16/nested1:__style_module_css-nested1/nested3:__style_module_css-nested3/ident:__style_module_css-ident/localkeyframes:__style_module_css-localkeyframes/pos1x:--_style_module_css-pos1x/pos1y:--_style_module_css-pos1y/pos2x:--_style_module_css-pos2x/pos2y:--_style_module_css-pos2y/localkeyframes2:__style_module_css-localkeyframes2/animation:__style_module_css-animation/vars:__style_module_css-vars/local-color:--_style_module_css-local-color/globalVars:__style_module_css-globalVars/wideScreenClass:__style_module_css-wideScreenClass/narrowScreenClass:__style_module_css-narrowScreenClass/displayGridInSupports:__style_module_css-displayGridInSupports/floatRightInNegativeSupports:__style_module_css-floatRightInNegativeSupports/displayFlexInMediaInSupports:__style_module_css-displayFlexInMediaInSupports/displayFlexInSupportsInMedia:__style_module_css-displayFlexInSupportsInMedia/displayFlexInSupportsInMediaUpperCase:__style_module_css-displayFlexInSupportsInMediaUpperCase/animationUpperCase:__style_module_css-animationUpperCase/localkeyframesUPPERCASE:__style_module_css-localkeyframesUPPERCASE/localkeyframes2UPPPERCASE:__style_module_css-localkeyframes2UPPPERCASE/localUpperCase:__style_module_css-localUpperCase/VARS:__style_module_css-VARS/LOCAL-COLOR:--_style_module_css-LOCAL-COLOR/globalVarsUpperCase:__style_module_css-globalVarsUpperCase/inSupportScope:__style_module_css-inSupportScope/a:__style_module_css-a/animationName:__style_module_css-animationName/b:__style_module_css-b/c:__style_module_css-c/d:__style_module_css-d/animation-name:--_style_module_css-animation-name/mozAnimationName:__style_module_css-mozAnimationName/my-color:--_style_module_css-my-color/my-color-1:--_style_module_css-my-color-1/my-color-2:--_style_module_css-my-color-2/padding-sm:__style_module_css-padding-sm/padding-lg:__style_module_css-padding-lg/nested-pure:__style_module_css-nested-pure/nested-media:__style_module_css-nested-media/nested-supports:__style_module_css-nested-supports/nested-layer:__style_module_css-nested-layer/not-selector-inside:__style_module_css-not-selector-inside/nested-var:__style_module_css-nested-var/again:__style_module_css-again/nested-with-local-pseudo:__style_module_css-nested-with-local-pseudo/local-nested:__style_module_css-local-nested/bar:--_style_module_css-bar/id-foo:__style_module_css-id-foo/id-bar:__style_module_css-id-bar/nested-parens:__style_module_css-nested-parens/local-in-global:__style_module_css-local-in-global/in-local-global-scope:__style_module_css-in-local-global-scope/class-local-scope:__style_module_css-class-local-scope/class-in-container:__style_module_css-class-in-container/deep-class-in-container:__style_module_css-deep-class-in-container/placeholder-gray-700:__style_module_css-placeholder-gray-700/placeholder-opacity:--_style_module_css-placeholder-opacity/test:--_style_module_css-test/baz:__style_module_css-baz/slidein:__style_module_css-slidein/my-global-class-again:__style_module_css-my-global-class-again/first-nested:__style_module_css-first-nested/first-nested-nested:__style_module_css-first-nested-nested/first-nested-at-rule:__style_module_css-first-nested-at-rule/first-nested-nested-at-rule-deep:__style_module_css-first-nested-nested-at-rule-deep/foo:--_style_module_css-foo/broken:__style_module_css-broken/comments:__style_module_css-comments/error:__style_module_css-error/err-404:__style_module_css-err-404/qqq:__style_module_css-qqq/parent:__style_module_css-parent/scope:__style_module_css-scope/limit:__style_module_css-limit/content:__style_module_css-content/card:__style_module_css-card/baz-1:__style_module_css-baz-1/baz-2:__style_module_css-baz-2/my-class:__style_module_css-my-class/feature:__style_module_css-feature/class-1:__style_module_css-class-1/infobox:__style_module_css-infobox/header:__style_module_css-header/item-size:--_style_module_css-item-size/container:__style_module_css-container/item-color:--_style_module_css-item-color/item:__style_module_css-item/two:__style_module_css-two/three:__style_module_css-three/initial:__style_module_css-initial/None:__style_module_css-None/item-1:__style_module_css-item-1/var:__style_module_css-var/main-color:--_style_module_css-main-color/FOO:--_style_module_css-FOO/accent-background:--_style_module_css-accent-background/external-link:--_style_module_css-external-link/custom-prop:--_style_module_css-custom-prop/default-value:--_style_module_css-default-value/main-bg-color:--_style_module_css-main-bg-color/backup-bg-color:--_style_module_css-backup-bg-color/var-order:__style_module_css-var-order/&\\\\.\\\\/style\\\\.module\\\\.css,myCssClass:__style_module_my-css-myCssClass/&\\\\.\\\\/style\\\\.module\\\\.my-css,&\\\\.\\\\/style\\\\.module\\\\.css\\\\.invalid,UnusedClassName:__identifiers_module_css-UnusedClassName/variable-unused-class:--_identifiers_module_css-variable-unused-class/UsedClassName:__identifiers_module_css-UsedClassName/variable-used-class:--_identifiers_module_css-variable-used-class/&\\\\.\\\\/identifiers\\\\.module\\\\.css;}" `; exports[`ConfigTestCases css css-modules exported tests should allow to create css modules: prod 1`] = ` @@ -1287,9 +1539,261 @@ Object { `; exports[`ConfigTestCases css css-modules exported tests should allow to create css modules: prod 2`] = ` -"/*!******************************!*\\\\ +"/*!*******************************!*\\\\ + !*** css ./colors.module.css ***! + \\\\*******************************/ + + + + + + + + + + + + + + +/*!**************************************!*\\\\ + !*** css ./at-rule-value.module.css ***! + \\\\**************************************/ + + +.my-app-744-value-in-class { + color: blue; +} + + + + + + +@media (max-width: 599px) { + abbr:hover { + color: limegreen; + transition-duration: 1s; + } +} + + + +.my-app-744-foo { color: red; } + + + +.my-app-744-foo { + &.my-app-744-bar { color: red; } +} + + + +.my-app-744-foo { + @media (min-width: 1024px) { + &.my-app-744-bar { color: red; } + } +} + + + +.my-app-744-foo { + @media (min-width: 1024px) { + &.my-app-744-bar { + @media (min-width: 1024px) { + color: red; + } + } + } +} + + + + +.my-app-744-foo { height: 40px; height: 36px; } + + + +.my-app-744-colorValue { + color: red; +} + + + +#my-app-744-colorValue-v1 { + color: red; +} + + + +.my-app-744-colorValue-v2 > .my-app-744-colorValue-v2 { + color: red; +} + + + +.red { + color: .red; +} + + + +.my-app-744-export { + color: blue; +} + + + +.my-app-744-foo { color: red; } + + + +.my-app-744-foo { color: red; } +.my-app-744-bar { color: yellow } + + + + +.my-app-744-foo { color: blue; } + + + + +.my-app-744-foo { color: blue; } + + + + +.my-app-744-class-a { color: red; } + + + + +.my-app-744-class-a { margin: calc(base * 2); } + + + + +.my-app-744-class-a { content: \\"test-a\\" \\"test-b\\"; } + + + +.my-app-744-foo { color: var(--color); } + + + + + + + +.my-app-744-foo { + color: red; + background-color: #0f0; + border-top-color: #00ff00; + border-bottom-color: rgba(34, 12, 64, 0.3); + outline-color: hsla(220, 13.0%, 18.0%, 1); +} + + + +.my-app-744-foo { color: blue; } +.my-app-744-bar { color: red } + + + +.my-app-744-foo { box-shadow: 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +.my-app-744-foo { color: color(red lightness(50%)); } + + + +:root { --my-app-744-color: red; } + + + +:root { --my-app-744-color: ; } + + + +:root { --my-app-744-color: ; } + + + +:root { --my-app-744-color:/* comment */; } + + + + +.my-app-744-override { + color: red; +} + + + + +.my-app-744-class { + color: red; + color: red; + color: blue; +} + + + +.my-app-744-color { + color: /* test */red/* test */; +} + + + +.my-app-744-color { + color: /* test *//* test */red/* test */; +} + + + +.my-app-744-foo { box-shadow: 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +.my-app-744-foo { box-shadow: 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +.my-app-744-foo { box-shadow: /* test */ 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +.my-app-744-foo { box-shadow: /* test */0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +.my-app-744-foo { box-shadow: 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +.my-app-744-foo { box-shadow: /* test */0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); } + + + +.my-app-744-foo { color: blue; } + + + +.my-app-744-foo { color: blue; } + + + +.my-app-744-foo { color: my-name-q; } + + + + +/*!******************************!*\\\\ !*** css ./style.module.css ***! \\\\******************************/ + .my-app-235-zg { color: red; } @@ -2452,7 +2956,7 @@ div { --my-app-194-c5: 10px; } -head{--webpack-my-app-226:zg:my-app-235-Ā/HiĂĄĆĈĊČĐ/OBĒąćĉċ-Ě/VEĜĔğČĤę2ĦĞĖġ2ģjĭĕĠVjęHĴĨġHď5ĻįH5/aqŁĠņģNňĩNģMō-VM/AOŒŗďŇăĝĵėqę4ŒO4ďbŒHbęPŤPďwũw/nŨŝħįŵ/\\\\$QŒżQ/bDŒƃŻ$tſƈ/qđ--ŷĮĠƍ/xěƏƑş-ƖƇ6:ƘēƒČż6/gJƟƐơƚƧƕŒx/lYŒƲ/fŒf/uzƩƙļƻŅKŒaKŅ7ǃ7ƺƷƾįuƹsWŒǐ/TZŒǕŅƳnjʼnY/IIŒǟ/iijǛČǤ/zGŒǪ/DkŒǯ/XĥǦ-ǴǞ0ƽƫļI0/wƉǶȁŴcŒncǣǖǶiZ/ZŭƠŞļȐ/MƞǶȗ/rXǻȓįȜ/dǑǶȣ/cƄǶȨȖǺȒŸĠMǿVǺǶȳ/CđǶȸƂǂǶbDžY1ŒɁ/ƳȮƢ-ǝtƞɇƚɋ/KRŒɑ/FǰǶɖ/prȞȯČɛ/sƄɍļɢƦƼɤįgzģhŒVh/veɝɈɳƂāɩĠbg/BǑɺČɿ/WǠʁ-ʅȷɜʇCrǣ3ɵƚi3/tvʑļʖ/&_Ė,ɗǼ6ʢ-kʛ_ʢ6,ʜ81ʩRƨɤ194-ʯȏLĻʲʴZLȧŀʱʳ-cńʜʺ;}" +head{--webpack-my-app-226:red-v1:blue/ĀĂiĆĈĊćĉăąČ/Ēe-ĎĖa:\\\\\\"test-ağėĞĠĢĤbħ--Č:var\\\\(įcoloĵ)/ġģĔďĉĿīă2ŃĊČŇʼn/gĀenŌyelĻwċāă3ōŋv4ō&_220,myİāōijĐĚŒclass:Ũĥpp-744ăaŮiŰŲŴ/v-ĹmmőĬrokő:ƆƈoƊƌ-bƎƐŒĄĞ/\\\\*\\\\ ƉƋntƢƠ\\\\//smƀlĞ(Ʈx-width\\\\Ğ 599px\\\\ľĘłĖfooŶũaŹŻŽ-LjoėŮvŜĖbĴNjŸźżžǙrǔēş:ĖŀĤt:_40ǁŅģ_qǪ36ǮĹĻrVƀĉǥā/ǷļǺǕĕǾȀǹǻęvňĖȆȂǣŜ\\\\.ĖexpļǩŷǍǝǐȔȖrtǿĺļŵğȑƪȆsȑmoduleȑcŴħaȵǽdėbbȷǿƄsĥǛȚǏžűųȿaėųeǪ1ǭx/ŲrgɋcƀcĶǙsȰ Ʃ 2ǃ/naƋdȼ__3chǚ\\\\#0f0/ɧ6ɪɬɮɯɰɱɒǙǥgǙĶ34\\\\,Ƣ1ɟʄ 6ʂʈ0ȑ3ɠhsŲ:ʑŲĶŤʍʈ1ʏ.ʍ%ʃʅ8ȑʞʠ 1ɠĹĺSɫdowǪʍʦ1ǁʅ5ʴ ŻʷɻĦ(ʙʾʠ.ɟ)ʃʱ24ʷ38ˈʺɾʼʿ,ʙȑ1ʂľfunc:ȆĶČƢlightnĢȩ(5ʤ˃ľƇȆȼ˭șǎǞƔǸƓemptyƼ˵˷˹Ōƨɜ ˼˸ũǖƞɝƤƌƨơƫoverrƷɋȌȾɁ˱ǐɅƅDžv5̇ơ ǧ̋ƪ˝Ɵ̢̠ɜ̌Ǣȉ6̟Ƣ̨ƩƟ̦̯ị̄řdƪɝ̰̪ʩlʫaʭwŌ_ʱ1ʳǂʦʶ͈ʹ͈ʻĶˏˑˁǃ˄Ƣˆˈˊ͈3ˌɿʽ͔ːˀ˓ʨlj̾ʬʮśʰʅ͇ʵʷ͌Ƣ͎͟͝ͱȑ˂͔ɞˇ͙͘Ƣ͚͍ˍ͏͑͞͡ľ̽̿́ăŞ̵̹̩̹̌́Ƣ͉ͪͬͅ7͛ˎͿˀʹ͟Ͷ͗ˋͼ͐͜͠˔ȡʪ̡̝̮ͥ͂Ί̱Ώʷ1͊Ƣͭ ͯΟʄ͒˃Ι͖͸ΜͮͽͰˏ˒Ρ΃Τă̭̈́ͩάήʸΓΝΕͱ͑Θ˅ͷͺ͹ ͻλΞΖδ΁΢ͤ̀ͦv7Χ̻ƪΫ͈έΒΔ;ύΗ͓ηϑϔϓϕαμγοɠǧƒŢǞ,zg̗ź235-ϼ/HĎ˰ϿЁ-І/OBϾ-ЀЂЎ/VEАВ-ЖЍňЈБЊO2ЕjИЊVjЍHХГHЅ̞ОЙH5/aDzаЊеЕNЫКNЕMмVM/AOмхЅжnjǎбqЍŠзГ4ЅȻёЋbЍPмOPЅʯіHŘnѕыЉЂѣƟ$Qм\\\\ѪėDмbDѩȘѥПЂѭȠqĎįіѻ/xЏѽѶЙҁѩ̭҃ǜѷ-ѭ6ŎJ:҉ɂЙgJҀмɏlYмҚ/fмf/uzґ-іңдKмaKдϠіa7ҢҟҧҡsWмҷ/TZмҼдқҰY/IIмӅ/iФіӊ/zGмӏ/DkмӔ/XЗіәӄ0ҥіIɱwѵҊЙӣɡ˙і˘ӉҽӌZ/ZњҒьЊӱ/M̭іӸċXӟ҄ЊrX/dҸіԄǿѰіcѳMӞӳѦ-ԍЕӞіVɱCЇӿЂԘėҪіbҭYąіԢ/қԏҋӃt҈ҦԚ-ԫ/KRмԲ/FӕіԷ/prӾӥЊԼƬѰԨЙsѳgҤՄЊՈЕhсhƆɋՊЂ̏ėϽՓƘg/BҸ՘՜/Wӆ՘ա/CԽ՘զӉŜ՘i3ĿvԾғЊtv/ŢВ,ԸѶ6ռ-kն_ռ6,Ţ81փRҐԨ19ž։ӰLА֌žZLǿ̞֋֍ƈгŢ֓;}" `; exports[`ConfigTestCases css css-modules-broken-keyframes exported tests should allow to create css modules: prod 1`] = ` @@ -5347,26 +5851,337 @@ head{--webpack-main:&\\\\.\\\\/style\\\\.css;}", ] `; +exports[`ConfigTestCases css pseudo-import exported tests should compile 1`] = ` +Array [ + "/*!********************************!*\\\\ + !*** css ./export.modules.css ***! + \\\\********************************/ + +/*!*********************************!*\\\\ + !*** css ./library.modules.css ***! + \\\\*********************************/ + +/*!*******************************!*\\\\ + !*** css ./after.modules.css ***! + \\\\*******************************/ + +/*!********************************!*\\\\ + !*** css ./vars-1.modules.css ***! + \\\\********************************/ + +/*!*******************************!*\\\\ + !*** css ./style.modules.css ***! + \\\\*******************************/ + + +._style_modules_css-class { + color: red; + background: red; +} + + +._style_modules_css-class {background: red} + +._style_modules_css-class { + color: red; + color: red; + color: red; + color: red; +} + + +._style_modules_css-class { + color: red; +} + + +._style_modules_css-class { + color: red; +} + +/* TODO fix me */ +/*:import(\\"reexport.modules.css\\") { + primary-color: _my_color; +} + +.class {color: primary-color}*/ + + +._style_modules_css-class { + color: red, red, func() ; +} + +._style_modules_css-nest { + :import(\\"./export.modules.css\\") { + unknown: unknown; + } + + :export { + unknown: unknown; + } + + unknown: unknown; +} + +head{--webpack-main:primary-color:red/&\\\\.\\\\/export\\\\.modules\\\\.css,a:red/_-b:red/--c:red/__d:red/&\\\\.\\\\/library\\\\.modules\\\\.css,somevalue:red/&\\\\.\\\\/after\\\\.modules\\\\.css,multile-values:red\\\\,\\\\ red\\\\,\\\\ func\\\\(\\\\)/&\\\\.\\\\/vars-1\\\\.modules\\\\.css,class:__style_modules_css-class/nest:__style_modules_css-nest/&\\\\.\\\\/style\\\\.modules\\\\.css;}", +] +`; + exports[`ConfigTestCases css pure-css exported tests should compile 1`] = ` Array [ - "/*!*******************************************!*\\\\ + "/*!***************************************************!*\\\\ + !*** css ../css-modules/at-rule-value.module.css ***! + \\\\***************************************************/ +@value my-red blue; + +.value-in-class { + color: my-red; +} + +@value v-comment-broken:; +@value v-comment-broken-v1:/* comment */; + +@value small: (max-width: 599px); + +@media small { + abbr:hover { + color: limegreen; + transition-duration: 1s; + } +} + +@value blue-v1: red; + +.foo { color: blue-v1; } + +@value blue-v3: red; + +.foo { + &.bar { color: blue-v3; } +} + +@value blue-v3: red; + +.foo { + @media (min-width: 1024px) { + &.bar { color: blue-v3; } + } +} + +@value blue-v4: red; + +.foo { + @media (min-width: 1024px) { + &.bar { + @media (min-width: 1024px) { + color: blue-v4; + } + } + } +} + +@value test-t: 40px; +@value test_q: 36px; + +.foo { height: test-t; height: test_q; } + +@value colorValue: red; + +.colorValue { + color: colorValue; +} + +@value colorValue-v1: red; + +#colorValue-v1 { + color: colorValue-v1; +} + +@value colorValue-v2: red; + +.colorValue-v2 > .colorValue-v2 { + color: colorValue-v2; +} + +@value colorValue-v3: .red; + +colorValue-v3 { + color: colorValue-v3; +} + +@value red-v2 from \\"./colors.module.css\\"; + +.export { + color: red-v2; +} + +@value blue-v1 as green from \\"./colors.module.css\\"; + +.foo { color: green; } + +@value blue-i, green-v2 from \\"./colors.module.css\\"; + +.foo { color: blue-i; } +.bar { color: green-v2 } + +@value red-v3 from colors; +@value colors: \\"./colors.module.css\\"; + +.foo { color: red-v3; } + +@value colors: \\"./colors.module.css\\"; +@value red-v4 from colors; + +.foo { color: red-v4; } + +@value aaa: red; +@value bbb: aaa; + +.class-a { color: bbb; } + +@value base: 10px; +@value large: calc(base * 2); + +.class-a { margin: large; } + +@value a from \\"./colors.module.css\\"; +@value b from \\"./colors.module.css\\"; + +.class-a { content: a b; } + +@value --red from \\"./colors.module.css\\"; + +.foo { color: --red; } + +@value named: red; +@value _3char #0f0; +@value _6char #00ff00; +@value rgba rgba(34, 12, 64, 0.3); +@value hsla hsla(220, 13.0%, 18.0%, 1); + +.foo { + color: named; + background-color: _3char; + border-top-color: _6char; + border-bottom-color: rgba; + outline-color: hsla; +} + +@value (blue-i, red-i) from \\"./colors.module.css\\"; + +.foo { color: red-i; } +.bar { color: blue-i } + +@value coolShadow: 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14) ; + +.foo { box-shadow: coolShadow; } + +@value func: color(red lightness(50%)); + +.foo { color: func; } + +@value v-color: red; + +:root { --color: v-color; } + +@value v-empty: ; + +:root { --color:v-empty; } + +@value v-empty-v2: ; + +:root { --color:v-empty-v2; } + +@value v-empty-v3: /* comment */; + +:root { --color:v-empty-v3; } + +@value override: blue; +@value override: red; + +.override { + color: override; +} + +@value (blue-v1 as my-name) from \\"./colors.module.css\\"; +@value (blue-v1 as my-name-again, red-v1) from \\"./colors.module.css\\"; + +.class { + color: my-name; + color: my-name-again; + color: red-v1; +} + +@value/* test */blue-v5/* test */:/* test */red/* test */; + +.color { + color: blue-v5; +} + +@value/* test */blue-v6/* test *//* test */red/* test */; + +.color { + color: blue-v6; +} + +@value coolShadow-v2 : 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14) ; + +.foo { box-shadow: coolShadow-v2; } + +@value /* test */ coolShadow-v3 /* test */ : 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14) ; + +.foo { box-shadow: coolShadow-v3; } + +@value /* test */ coolShadow-v4 /* test */ 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14) ; + +.foo { box-shadow: coolShadow-v4; } + +@value/* test */coolShadow-v5/* test */0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); + +.foo { box-shadow: coolShadow-v5; } + +@value/* test */coolShadow-v6/* test */:0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); + +.foo { box-shadow: coolShadow-v6; } + +@value/* test */coolShadow-v7/* test */:/* test */0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); + +.foo { box-shadow: coolShadow-v7; } + +@value /* test */ test-v1 /* test */ from /* test */ \\"./colors.module.css\\" /* test */; + +.foo { color: test-v1; } + +@value/* test */test-v2/* test */from/* test */\\"./colors.module.css\\"/* test */; + +.foo { color: test-v2; } + +@value/* test */(/* test */blue/* test */as/* test */my-name-q/* test */)/* test */from/* test */\\"./colors.module.css\\"/* test */; + +.foo { color: my-name-q; } + +@value; +@value test; + +/*!*******************************************!*\\\\ !*** css ../css-modules/style.module.css ***! \\\\*******************************************/ + .class { color: red; } .local1, -.local2 .global, +.local2 :global .global, .local3 { color: green; } -.global ._css-modules_style_module_css-local4 { +:global .global :local .local4 { color: yellow; } -.local5.global.local6 { +.local5:global(.global).local6 { color: blue; } @@ -5434,7 +6249,7 @@ Array [ overflow: hidden; } -._css-modules_style_module_css-nested1.nested2.nested3 { +:global(:global(:local(.nested1)).nested2).nested3 { color: pink; } @@ -5483,7 +6298,7 @@ Array [ --local-color: red; } -.globalVars { +.globalVars :global { color: var(--global-color); --global-color: red; } @@ -5569,7 +6384,7 @@ Array [ } } -.globalUpperCase ._css-modules_style_module_css-localUpperCase { +:GLOBAL .globalUpperCase :LOCAL .localUpperCase { color: yellow; } @@ -5578,7 +6393,7 @@ Array [ --LOCAL-COLOR: red; } -.globalVarsUpperCase { +.globalVarsUpperCase :GLOBAL { COLOR: VAR(--GLOBAR-COLOR); --GLOBAR-COLOR: red; } @@ -5754,31 +6569,31 @@ Array [ .nested-with-local-pseudo { color: red; - ._css-modules_style_module_css-local-nested { + :local .local-nested { color: red; } - .global-nested { + :global .global-nested { color: red; } - ._css-modules_style_module_css-local-nested { + :local(.local-nested) { color: red; } - .global-nested { + :global(.global-nested) { color: red; } - ._css-modules_style_module_css-local-nested, .global-nested-next { + :local .local-nested, :global .global-nested-next { color: red; } - ._css-modules_style_module_css-local-nested, .global-nested-next { + :local(.local-nested), :global(.global-nested-next) { color: red; } - .foo, .bar { + :global .foo, .bar { color: red; } } @@ -5799,12 +6614,12 @@ Array [ } } -.global-foo { +:global .global-foo { .nested-global { color: red; } - ._css-modules_style_module_css-local-in-global { + :local .local-in-global { color: blue; } } @@ -5817,9 +6632,9 @@ Array [ } } -.class ._css-modules_style_module_css-in-local-global-scope, -.class ._css-modules_style_module_css-in-local-global-scope, -._css-modules_style_module_css-class-local-scope .in-local-global-scope { +:global .class :local .in-local-global-scope, +:global .class :local .in-local-global-scope, +:local .class-local-scope :global .in-local-global-scope { color: red; } @@ -5895,14 +6710,14 @@ Array [ bar: env(foo, var(--baz)); } -.global-foo, ._css-modules_style_module_css-bar { - ._css-modules_style_module_css-local-in-global { +:global .global-foo, :local .bar { + :local .local-in-global { color: blue; } @media screen { - .my-global-class-again, - ._css-modules_style_module_css-my-global-class-again { + :global .my-global-class-again, + :local .my-global-class-again { color: red; } } @@ -5922,12 +6737,12 @@ Array [ } } -.again-global { +:global .again-global { color:red; } -.again-again-global { - .again-again-global { +:global .again-again-global { + :global .again-again-global { color: red; } } @@ -5936,22 +6751,22 @@ Array [ --foo: red; } -.again-again-global { +:global .again-again-global { color: var(--foo); - .again-again-global { + :global .again-again-global { color: var(--foo); } } -.again-again-global { +:global .again-again-global { animation: slidein 3s; - .again-again-global, .class, ._css-modules_style_module_css-nested1.nested2.nested3 { + :global .again-again-global, .class, :global(:global(:local(.nested1)).nested2).nested3 { animation: slidein 3s; } - .local2 .global, + .local2 :global .global, .local3 { color: red; } @@ -6019,19 +6834,19 @@ Array [ } .comments { - .class { + :/** test */global(.class) { color: red; } - .class { + :/** test */global .class { color: red; } - ._css-modules_style_module_css-class { + :/** test */local(.class) { color: red; } - ._css-modules_style_module_css-class { + :/** test */local .class { color: red; } @@ -6039,11 +6854,11 @@ Array [ color: red; } - ./** test **/_css-modules_style_module_css-class { + :local(./** test **/class) { color: red; } - ./** test **/_css-modules_style_module_css-class { + :local ./** test **/class { color: red; } } @@ -6503,28 +7318,31 @@ div { } } -._style_css-class { +:local(.class) { color: red; } -._style_css-class { +:local .class { color: green; } -.class { +:global(.class) { color: blue; } -.class { +:global .class { color: white; } +:export { + foo: bar; +} .class { animation: test 1s, test; } -head{--webpack-main:local4:__css-modules_style_module_css-local4/nested1:__css-modules_style_module_css-nested1/localUpperCase:__css-modules_style_module_css-localUpperCase/local-nested:__css-modules_style_module_css-local-nested/local-in-global:__css-modules_style_module_css-local-in-global/in-local-global-scope:__css-modules_style_module_css-in-local-global-scope/class-local-scope:__css-modules_style_module_css-class-local-scope/bar:__css-modules_style_module_css-bar/my-global-class-again:__css-modules_style_module_css-my-global-class-again/class:__css-modules_style_module_css-class/&\\\\.\\\\.\\\\/css-modules\\\\/style\\\\.module\\\\.css,class:__style_css-class/foo:bar/&\\\\.\\\\/style\\\\.css;}", +head{--webpack-main:&\\\\.\\\\.\\\\/css-modules\\\\/at-rule-value\\\\.module\\\\.css,&\\\\.\\\\.\\\\/css-modules\\\\/style\\\\.module\\\\.css,&\\\\.\\\\/style\\\\.css;}", ] `; diff --git a/test/configCases/css/async-chunk-node/index.js b/test/configCases/css/async-chunk-node/index.js index a57013d89..5f422e6a8 100644 --- a/test/configCases/css/async-chunk-node/index.js +++ b/test/configCases/css/async-chunk-node/index.js @@ -1,12 +1,12 @@ it("should allow to dynamic import a css module", done => { - import("../exports/style.module.css").then(x => { + import("../pseudo-export/style.module.css").then(x => { try { expect(x).toEqual( nsObj({ a: "a", abc: "a b c", - comments: "abc def", - "white space": "abc\n\tdef", + comments: "abc/****/ /* hello world *//****/ def", + whitespace: "abc\n\tdef", default: "default" }) ); diff --git a/test/configCases/css/css-modules/at-rule-value.module.css b/test/configCases/css/css-modules/at-rule-value.module.css new file mode 100644 index 000000000..980760c85 --- /dev/null +++ b/test/configCases/css/css-modules/at-rule-value.module.css @@ -0,0 +1,230 @@ +@value my-red blue; + +.value-in-class { + color: my-red; +} + +@value v-comment-broken:; +@value v-comment-broken-v1:/* comment */; + +@value small: (max-width: 599px); + +@media small { + abbr:hover { + color: limegreen; + transition-duration: 1s; + } +} + +@value blue-v1: red; + +.foo { color: blue-v1; } + +@value blue-v3: red; + +.foo { + &.bar { color: blue-v3; } +} + +@value blue-v3: red; + +.foo { + @media (min-width: 1024px) { + &.bar { color: blue-v3; } + } +} + +@value blue-v4: red; + +.foo { + @media (min-width: 1024px) { + &.bar { + @media (min-width: 1024px) { + color: blue-v4; + } + } + } +} + +@value test-t: 40px; +@value test_q: 36px; + +.foo { height: test-t; height: test_q; } + +@value colorValue: red; + +.colorValue { + color: colorValue; +} + +@value colorValue-v1: red; + +#colorValue-v1 { + color: colorValue-v1; +} + +@value colorValue-v2: red; + +.colorValue-v2 > .colorValue-v2 { + color: colorValue-v2; +} + +@value colorValue-v3: .red; + +colorValue-v3 { + color: colorValue-v3; +} + +@value red-v2 from "./colors.module.css"; + +.export { + color: red-v2; +} + +@value blue-v1 as green from "./colors.module.css"; + +.foo { color: green; } + +@value blue-i, green-v2 from "./colors.module.css"; + +.foo { color: blue-i; } +.bar { color: green-v2 } + +@value red-v3 from colors; +@value colors: "./colors.module.css"; + +.foo { color: red-v3; } + +@value colors: "./colors.module.css"; +@value red-v4 from colors; + +.foo { color: red-v4; } + +@value aaa: red; +@value bbb: aaa; + +.class-a { color: bbb; } + +@value base: 10px; +@value large: calc(base * 2); + +.class-a { margin: large; } + +@value a from "./colors.module.css"; +@value b from "./colors.module.css"; + +.class-a { content: a b; } + +@value --red from "./colors.module.css"; + +.foo { color: --red; } + +@value named: red; +@value _3char #0f0; +@value _6char #00ff00; +@value rgba rgba(34, 12, 64, 0.3); +@value hsla hsla(220, 13.0%, 18.0%, 1); + +.foo { + color: named; + background-color: _3char; + border-top-color: _6char; + border-bottom-color: rgba; + outline-color: hsla; +} + +@value (blue-i, red-i) from "./colors.module.css"; + +.foo { color: red-i; } +.bar { color: blue-i } + +@value coolShadow: 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14) ; + +.foo { box-shadow: coolShadow; } + +@value func: color(red lightness(50%)); + +.foo { color: func; } + +@value v-color: red; + +:root { --color: v-color; } + +@value v-empty: ; + +:root { --color:v-empty; } + +@value v-empty-v2: ; + +:root { --color:v-empty-v2; } + +@value v-empty-v3: /* comment */; + +:root { --color:v-empty-v3; } + +@value override: blue; +@value override: red; + +.override { + color: override; +} + +@value (blue-v1 as my-name) from "./colors.module.css"; +@value (blue-v1 as my-name-again, red-v1) from "./colors.module.css"; + +.class { + color: my-name; + color: my-name-again; + color: red-v1; +} + +@value/* test */blue-v5/* test */:/* test */red/* test */; + +.color { + color: blue-v5; +} + +@value/* test */blue-v6/* test *//* test */red/* test */; + +.color { + color: blue-v6; +} + +@value coolShadow-v2 : 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14) ; + +.foo { box-shadow: coolShadow-v2; } + +@value /* test */ coolShadow-v3 /* test */ : 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14) ; + +.foo { box-shadow: coolShadow-v3; } + +@value /* test */ coolShadow-v4 /* test */ 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14) ; + +.foo { box-shadow: coolShadow-v4; } + +@value/* test */coolShadow-v5/* test */0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); + +.foo { box-shadow: coolShadow-v5; } + +@value/* test */coolShadow-v6/* test */:0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); + +.foo { box-shadow: coolShadow-v6; } + +@value/* test */coolShadow-v7/* test */:/* test */0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14); + +.foo { box-shadow: coolShadow-v7; } + +@value /* test */ test-v1 /* test */ from /* test */ "./colors.module.css" /* test */; + +.foo { color: test-v1; } + +@value/* test */test-v2/* test */from/* test */"./colors.module.css"/* test */; + +.foo { color: test-v2; } + +@value/* test */(/* test */blue/* test */as/* test */my-name-q/* test */)/* test */from/* test */"./colors.module.css"/* test */; + +.foo { color: my-name-q; } + +@value; +@value test; diff --git a/test/configCases/css/css-modules/colors.module.css b/test/configCases/css/css-modules/colors.module.css new file mode 100644 index 000000000..8fd971693 --- /dev/null +++ b/test/configCases/css/css-modules/colors.module.css @@ -0,0 +1,13 @@ +@value red-v1 blue; +@value red-i: blue; +@value blue-v1 red; +@value blue-i: red; +@value a: "test-a"; +@value b: "test-b"; +@value --red: var(--color); +@value test-v1: blue; +@value test-v2: blue; +@value red-v2: blue; +@value green-v2: yellow; +@value red-v3: blue; +@value red-v4: blue; diff --git a/test/configCases/css/css-modules/style.module.css b/test/configCases/css/css-modules/style.module.css index 8a530b1fd..73f633796 100644 --- a/test/configCases/css/css-modules/style.module.css +++ b/test/configCases/css/css-modules/style.module.css @@ -1,3 +1,5 @@ +@import "at-rule-value.module.css"; + .class { color: red; } diff --git a/test/configCases/css/css-modules/use-style.js b/test/configCases/css/css-modules/use-style.js index abed76c79..ca4617758 100644 --- a/test/configCases/css/css-modules/use-style.js +++ b/test/configCases/css/css-modules/use-style.js @@ -6,7 +6,7 @@ import { UsedClassName } from "./identifiers.module.css"; // To prevent analysis export const isNotACSSModule = typeof notACssModule["c" + "lass"] === "undefined"; -const hasOwnProperty = (obj, p) => Object.hasOwnProperty.call(obj, p) +const hasOwnProperty = (obj, p) => Object.hasOwnProperty.call(obj, p); export default { global: style.global, diff --git a/test/configCases/css/css-modules/warnings.js b/test/configCases/css/css-modules/warnings.js index 8052a28b9..be7a71b2f 100644 --- a/test/configCases/css/css-modules/warnings.js +++ b/test/configCases/css/css-modules/warnings.js @@ -3,8 +3,10 @@ module.exports = [ [/export 'nested2' \(imported as 'style'\) was not found/], [/export 'global-color' \(imported as 'style'\) was not found/], [/export 'GLOBAL-COLOR' \(imported as 'style'\) was not found/], + [/Broken '@value' at-rule: @value;'/], [/export 'global' \(imported as 'style'\) was not found/], [/export 'nested2' \(imported as 'style'\) was not found/], [/export 'global-color' \(imported as 'style'\) was not found/], - [/export 'GLOBAL-COLOR' \(imported as 'style'\) was not found/] + [/export 'GLOBAL-COLOR' \(imported as 'style'\) was not found/], + [/Broken '@value' at-rule: @value;'/] ]; diff --git a/test/configCases/css/exports-in-node/index.js b/test/configCases/css/exports-in-node/index.js index 0c59f3e16..5ea47f3f1 100644 --- a/test/configCases/css/exports-in-node/index.js +++ b/test/configCases/css/exports-in-node/index.js @@ -1,14 +1,14 @@ -import * as style from "../exports/style.module.css?ns"; -import { a, abc } from "../exports/style.module.css?picked"; -import def from "../exports/style.module.css?default"; +import * as style from "../pseudo-export/style.module.css?ns"; +import { a, abc } from "../pseudo-export/style.module.css?picked"; +import def from "../pseudo-export/style.module.css?default"; it("should allow to import a css module", () => { expect(style).toEqual( nsObj({ a: "a", abc: "a b c", - comments: "abc def", - "white space": "abc\n\tdef", + comments: "abc/****/ /* hello world *//****/ def", + whitespace: "abc\n\tdef", default: "default" }) ); @@ -18,14 +18,14 @@ it("should allow to import a css module", () => { }); it("should allow to dynamic import a css module", done => { - import("../exports/style.module.css").then(x => { + import("../pseudo-export/style.module.css").then(x => { try { expect(x).toEqual( nsObj({ a: "a", abc: "a b c", - comments: "abc def", - "white space": "abc\n\tdef", + comments: "abc/****/ /* hello world *//****/ def", + whitespace: "abc\n\tdef", default: "default" }) ); @@ -37,14 +37,14 @@ it("should allow to dynamic import a css module", done => { }); it("should allow to reexport a css module", done => { - import("../exports/reexported").then(x => { + import("../pseudo-export/reexported").then(x => { try { expect(x).toEqual( nsObj({ a: "a", abc: "a b c", - comments: "abc def", - "white space": "abc\n\tdef" + comments: "abc/****/ /* hello world *//****/ def", + whitespace: "abc\n\tdef", }) ); } catch (e) { @@ -55,14 +55,14 @@ it("should allow to reexport a css module", done => { }); it("should allow to import a css module", done => { - import("../exports/imported").then(({ default: x }) => { + import("../pseudo-export/imported").then(({ default: x }) => { try { expect(x).toEqual( nsObj({ a: "a", abc: "a b c", - comments: "abc def", - "white space": "abc\n\tdef", + comments: "abc/****/ /* hello world *//****/ def", + whitespace: "abc\n\tdef", default: "default" }) ); diff --git a/test/configCases/css/exports-only-generator-options/index.js b/test/configCases/css/exports-only-generator-options/index.js index 1d827846c..f0835d411 100644 --- a/test/configCases/css/exports-only-generator-options/index.js +++ b/test/configCases/css/exports-only-generator-options/index.js @@ -1,16 +1,16 @@ it("should not have .css file", (done) => { - __non_webpack_require__("./exports_style_module_css.bundle0.js"); - __non_webpack_require__("./exports_style_module_css_exportsOnly.bundle0.js"); + __non_webpack_require__("./pseudo-export_style_module_css.bundle0.js"); + __non_webpack_require__("./pseudo-export_style_module_css_exportsOnly.bundle0.js"); Promise.all([ - import("../exports/style.module.css"), - import("../exports/style.module.css?module"), - import("../exports/style.module.css?exportsOnly"), + import("../pseudo-export/style.module.css"), + import("../pseudo-export/style.module.css?module"), + import("../pseudo-export/style.module.css?exportsOnly"), ]).then(([style1, style2, style3]) => { const ns = nsObj({ a: "a", abc: "a b c", - comments: "abc def", - "white space": "abc\n\tdef", + comments: "abc/****/ /* hello world *//****/ def", + whitespace: "abc\n\tdef", default: "default" }); expect(style1).toEqual(ns); @@ -19,8 +19,8 @@ it("should not have .css file", (done) => { }).then(() => { const fs = __non_webpack_require__("fs"); const path = __non_webpack_require__("path"); - expect(fs.existsSync(path.resolve(__dirname, "exports_style_module_css.bundle0.css"))).toBe(false); - expect(fs.existsSync(path.resolve(__dirname, "exports_style_module_css_exportsOnly.bundle0.css"))).toBe(false); + expect(fs.existsSync(path.resolve(__dirname, "pseudo-export_style_module_css.bundle0.css"))).toBe(false); + expect(fs.existsSync(path.resolve(__dirname, "pseudo-export_style_module_css_exportsOnly.bundle0.css"))).toBe(false); done() }).catch(e => done(e)) }); diff --git a/test/configCases/css/exports/imported.js b/test/configCases/css/pseudo-export/imported.js similarity index 100% rename from test/configCases/css/exports/imported.js rename to test/configCases/css/pseudo-export/imported.js diff --git a/test/configCases/css/exports/index.js b/test/configCases/css/pseudo-export/index.js similarity index 76% rename from test/configCases/css/exports/index.js rename to test/configCases/css/pseudo-export/index.js index b65dc05ae..67da96791 100644 --- a/test/configCases/css/exports/index.js +++ b/test/configCases/css/pseudo-export/index.js @@ -5,8 +5,8 @@ it("should allow to dynamic import a css module", done => { nsObj({ a: "a", abc: "a b c", - comments: "abc def", - "white space": "abc\n\tdef", + comments: "abc/****/ /* hello world *//****/ def", + whitespace: "abc\n\tdef", default: "default" }) ); @@ -25,8 +25,8 @@ it("should allow to reexport a css module", done => { nsObj({ a: "a", abc: "a b c", - comments: "abc def", - "white space": "abc\n\tdef" + comments: "abc/****/ /* hello world *//****/ def", + whitespace: "abc\n\tdef" }) ); } catch (e) { @@ -44,8 +44,8 @@ it("should allow to import a css module", done => { nsObj({ a: "a", abc: "a b c", - comments: "abc def", - "white space": "abc\n\tdef", + comments: "abc/****/ /* hello world *//****/ def", + whitespace: "abc\n\tdef", default: "default" }) ); diff --git a/test/configCases/css/exports/reexported.js b/test/configCases/css/pseudo-export/reexported.js similarity index 100% rename from test/configCases/css/exports/reexported.js rename to test/configCases/css/pseudo-export/reexported.js diff --git a/test/configCases/css/exports/style.module.css b/test/configCases/css/pseudo-export/style.module.css similarity index 92% rename from test/configCases/css/exports/style.module.css rename to test/configCases/css/pseudo-export/style.module.css index c64b4ff9a..24f1786c0 100644 --- a/test/configCases/css/exports/style.module.css +++ b/test/configCases/css/pseudo-export/style.module.css @@ -13,7 +13,7 @@ { - white space + whitespace : diff --git a/test/configCases/css/exports/webpack.config.js b/test/configCases/css/pseudo-export/webpack.config.js similarity index 100% rename from test/configCases/css/exports/webpack.config.js rename to test/configCases/css/pseudo-export/webpack.config.js diff --git a/test/configCases/css/pseudo-import/after.modules.css b/test/configCases/css/pseudo-import/after.modules.css new file mode 100644 index 000000000..2c01aa6cf --- /dev/null +++ b/test/configCases/css/pseudo-import/after.modules.css @@ -0,0 +1,3 @@ +:export { + somevalue: red; +} diff --git a/test/configCases/css/pseudo-import/export.modules.css b/test/configCases/css/pseudo-import/export.modules.css new file mode 100644 index 000000000..26d299380 --- /dev/null +++ b/test/configCases/css/pseudo-import/export.modules.css @@ -0,0 +1,3 @@ +:export { + primary-color: red; +} diff --git a/test/configCases/css/pseudo-import/index.js b/test/configCases/css/pseudo-import/index.js new file mode 100644 index 000000000..e50197956 --- /dev/null +++ b/test/configCases/css/pseudo-import/index.js @@ -0,0 +1,30 @@ +import './style.modules.css'; + +it("should compile", () => { + const links = document.getElementsByTagName("link"); + const css = []; + + // Skip first because import it by default + for (const link of links.slice(1)) { + css.push(link.sheet.css); + } + + expect(css).toMatchSnapshot(); +}); + +it("should re-export", (done) => { + import("./reexport.modules.css").then((module) => { + try { + expect(module).toEqual(nsObj({ + "className": "_reexport_modules_css-className", + "primary-color": "constructor", + "secondary-color": "toString", + })); + } catch(e) { + done(e); + return; + } + + done() + }, done) +}); diff --git a/test/configCases/css/pseudo-import/library.modules.css b/test/configCases/css/pseudo-import/library.modules.css new file mode 100644 index 000000000..08ed1e134 --- /dev/null +++ b/test/configCases/css/pseudo-import/library.modules.css @@ -0,0 +1,6 @@ +:export { + a: red; + -b: red; + --c: red; + _d: red; +} diff --git a/test/configCases/css/pseudo-import/reexport.modules.css b/test/configCases/css/pseudo-import/reexport.modules.css new file mode 100644 index 000000000..edcae7e7a --- /dev/null +++ b/test/configCases/css/pseudo-import/reexport.modules.css @@ -0,0 +1,14 @@ +:import("./vars.modules.css") { + constructor: primary-color; + toString: secondary-color; +} + +.className { + color: constructor; + display: toString; +} + +:export { + primary-color: constructor; + secondary-color: toString; +} diff --git a/test/configCases/css/pseudo-import/style.modules.css b/test/configCases/css/pseudo-import/style.modules.css new file mode 100644 index 000000000..bc8006bb5 --- /dev/null +++ b/test/configCases/css/pseudo-import/style.modules.css @@ -0,0 +1,68 @@ +:import( /* test */ "./export.modules.css" /* test */ ) { + IMPORTED_NAME: primary-color; +} + +:import("library.modules.css") { + i__imported_a_0: a; + i__imported__b_1: -b; + i__imported___c_2: --c; + i__imported__d_3: _d; +} + +.class { + color: IMPORTED_NAME; + background: IMPORTED_NAME; +} + + +.class {background: IMPORTED_NAME} + +.class { + color: i__imported_a_0; + color: i__imported__b_1; + color: i__imported___c_2; + color: i__imported__d_3; +} + +:import("./after.modules.css") { + something: somevalue; +} + +.class { + color: something; +} + +:import("./after.modules.css") { + again: somevalue; +} + +.class { + color: again; +} + +/* TODO fix me */ +/*:import("reexport.modules.css") { + primary-color: _my_color; +} + +.class {color: primary-color}*/ + +:import("vars-1.modules.css") { + _i_multile_values: multile-values; +} + +.class { + color: _i_multile_values ; +} + +.nest { + :import("./export.modules.css") { + unknown: unknown; + } + + :export { + unknown: unknown; + } + + unknown: unknown; +} diff --git a/test/configCases/css/pseudo-import/test.config.js b/test/configCases/css/pseudo-import/test.config.js new file mode 100644 index 000000000..059075728 --- /dev/null +++ b/test/configCases/css/pseudo-import/test.config.js @@ -0,0 +1,8 @@ +module.exports = { + moduleScope(scope) { + const link = scope.window.document.createElement("link"); + link.rel = "stylesheet"; + link.href = "bundle0.css"; + scope.window.document.head.appendChild(link); + } +}; diff --git a/test/configCases/css/pseudo-import/vars-1.modules.css b/test/configCases/css/pseudo-import/vars-1.modules.css new file mode 100644 index 000000000..eeffd40f3 --- /dev/null +++ b/test/configCases/css/pseudo-import/vars-1.modules.css @@ -0,0 +1,3 @@ +:export { + multile-values: red, red, func() +} diff --git a/test/configCases/css/pseudo-import/vars.modules.css b/test/configCases/css/pseudo-import/vars.modules.css new file mode 100644 index 000000000..0c56d212b --- /dev/null +++ b/test/configCases/css/pseudo-import/vars.modules.css @@ -0,0 +1,4 @@ +:export { + primary-color: red; + secondary-color: block; +} diff --git a/test/configCases/css/pseudo-import/warnings.js b/test/configCases/css/pseudo-import/warnings.js new file mode 100644 index 000000000..b9c29247d --- /dev/null +++ b/test/configCases/css/pseudo-import/warnings.js @@ -0,0 +1,3 @@ +module.exports = [ + // /ICSS import "NONE_IMPORT" has no value./ +]; diff --git a/test/configCases/css/pseudo-import/webpack.config.js b/test/configCases/css/pseudo-import/webpack.config.js new file mode 100644 index 000000000..cfb8e5c03 --- /dev/null +++ b/test/configCases/css/pseudo-import/webpack.config.js @@ -0,0 +1,8 @@ +/** @type {import("../../../../").Configuration} */ +module.exports = { + target: "web", + mode: "development", + experiments: { + css: true + } +}; diff --git a/test/configCases/css/pure-css/webpack.config.js b/test/configCases/css/pure-css/webpack.config.js index f3d73b278..53df0bf1f 100644 --- a/test/configCases/css/pure-css/webpack.config.js +++ b/test/configCases/css/pure-css/webpack.config.js @@ -6,11 +6,7 @@ module.exports = { rules: [ { test: /\.css$/i, - type: "css/global", - resolve: { - fullySpecified: true, - preferRelative: true - } + type: "css" } ] }, diff --git a/test/configCases/library/issue-18932/index.js b/test/configCases/library/issue-18932/index.js new file mode 100644 index 000000000..78b38524c --- /dev/null +++ b/test/configCases/library/issue-18932/index.js @@ -0,0 +1,7 @@ +it("should don't have variable name conflict", function() { + expect(true).toBe(true); +}); + +const i = 1; + +export default "test"; diff --git a/test/configCases/library/issue-18932/webpack.config.js b/test/configCases/library/issue-18932/webpack.config.js new file mode 100644 index 000000000..74ee19646 --- /dev/null +++ b/test/configCases/library/issue-18932/webpack.config.js @@ -0,0 +1,9 @@ +/** @type {import("../../../../").Configuration} */ +module.exports = { + mode: "production", + output: { + library: { + type: "commonjs" + } + } +}; diff --git a/test/configCases/wasm/reference-types/index.js b/test/configCases/wasm/reference-types/index.js new file mode 100644 index 000000000..43ffb723b --- /dev/null +++ b/test/configCases/wasm/reference-types/index.js @@ -0,0 +1,6 @@ +it("should work", function() { + return import("./pkg/wasm_lib.js").then(function(module) { + const cls = new module.Stuff(); + expect(cls.refThing("my-str")).toBe("my-str"); + }); +}); diff --git a/test/configCases/wasm/reference-types/pkg/wasm_lib.js b/test/configCases/wasm/reference-types/pkg/wasm_lib.js new file mode 100644 index 000000000..7341f72bb --- /dev/null +++ b/test/configCases/wasm/reference-types/pkg/wasm_lib.js @@ -0,0 +1,5 @@ +import * as wasm from "./wasm_lib_bg.wasm"; +export * from "./wasm_lib_bg.js"; +import { __wbg_set_wasm } from "./wasm_lib_bg.js"; +__wbg_set_wasm(wasm); +wasm.__wbindgen_start(); diff --git a/test/configCases/wasm/reference-types/pkg/wasm_lib_bg.js b/test/configCases/wasm/reference-types/pkg/wasm_lib_bg.js new file mode 100644 index 000000000..84bdb2a89 --- /dev/null +++ b/test/configCases/wasm/reference-types/pkg/wasm_lib_bg.js @@ -0,0 +1,279 @@ +let wasm; +export function __wbg_set_wasm(val) { + wasm = val; +} + + +let WASM_VECTOR_LEN = 0; + +let cachedUint8ArrayMemory0 = null; + +function getUint8ArrayMemory0() { + if (cachedUint8ArrayMemory0 === null || cachedUint8ArrayMemory0.byteLength === 0) { + cachedUint8ArrayMemory0 = new Uint8Array(wasm.memory.buffer); + } + return cachedUint8ArrayMemory0; +} + +const lTextEncoder = typeof TextEncoder === 'undefined' ? (0, module.require)('util').TextEncoder : TextEncoder; + +let cachedTextEncoder = new lTextEncoder('utf-8'); + +const encodeString = (typeof cachedTextEncoder.encodeInto === 'function' + ? function (arg, view) { + return cachedTextEncoder.encodeInto(arg, view); +} + : function (arg, view) { + const buf = cachedTextEncoder.encode(arg); + view.set(buf); + return { + read: arg.length, + written: buf.length + }; +}); + +function passStringToWasm0(arg, malloc, realloc) { + + if (typeof(arg) !== 'string') throw new Error(`expected a string argument, found ${typeof(arg)}`); + + if (realloc === undefined) { + const buf = cachedTextEncoder.encode(arg); + const ptr = malloc(buf.length, 1) >>> 0; + getUint8ArrayMemory0().subarray(ptr, ptr + buf.length).set(buf); + WASM_VECTOR_LEN = buf.length; + return ptr; + } + + let len = arg.length; + let ptr = malloc(len, 1) >>> 0; + + const mem = getUint8ArrayMemory0(); + + let offset = 0; + + for (; offset < len; offset++) { + const code = arg.charCodeAt(offset); + if (code > 0x7F) break; + mem[ptr + offset] = code; + } + + if (offset !== len) { + if (offset !== 0) { + arg = arg.slice(offset); + } + ptr = realloc(ptr, len, len = offset + arg.length * 3, 1) >>> 0; + const view = getUint8ArrayMemory0().subarray(ptr + offset, ptr + len); + const ret = encodeString(arg, view); + if (ret.read !== arg.length) throw new Error('failed to pass whole string'); + offset += ret.written; + ptr = realloc(ptr, len, offset, 1) >>> 0; + } + + WASM_VECTOR_LEN = offset; + return ptr; +} + +function isLikeNone(x) { + return x === undefined || x === null; +} + +let cachedDataViewMemory0 = null; + +function getDataViewMemory0() { + if (cachedDataViewMemory0 === null || cachedDataViewMemory0.buffer.detached === true || (cachedDataViewMemory0.buffer.detached === undefined && cachedDataViewMemory0.buffer !== wasm.memory.buffer)) { + cachedDataViewMemory0 = new DataView(wasm.memory.buffer); + } + return cachedDataViewMemory0; +} + +const lTextDecoder = typeof TextDecoder === 'undefined' ? (0, module.require)('util').TextDecoder : TextDecoder; + +let cachedTextDecoder = new lTextDecoder('utf-8', { ignoreBOM: true, fatal: true }); + +cachedTextDecoder.decode(); + +function getStringFromWasm0(ptr, len) { + ptr = ptr >>> 0; + return cachedTextDecoder.decode(getUint8ArrayMemory0().subarray(ptr, ptr + len)); +} + +export function start() { + wasm.start(); +} + +function _assertNum(n) { + if (typeof(n) !== 'number') throw new Error(`expected a number argument, found ${typeof(n)}`); +} + +function logError(f, args) { + try { + return f.apply(this, args); + } catch (e) { + let error = (function () { + try { + return e instanceof Error ? `${e.message}\n\nStack:\n${e.stack}` : e.toString(); + } catch(_) { + return ""; + } + }()); + console.error("wasm-bindgen: imported JS function that was not marked as `catch` threw an error:", error); + throw e; + } +} + +function addToExternrefTable0(obj) { + const idx = wasm.__wbindgen_export_5(); + wasm.__wbindgen_export_2.set(idx, obj); + return idx; +} + +function handleError(f, args) { + try { + return f.apply(this, args); + } catch (e) { + const idx = addToExternrefTable0(e); + wasm.__wbindgen_export_4(idx); + } +} + +const StuffFinalization = (typeof FinalizationRegistry === 'undefined') + ? { register: () => {}, unregister: () => {} } + : new FinalizationRegistry(ptr => wasm.__wbg_stuff_free(ptr >>> 0, 1)); + +export class Stuff { + + __destroy_into_raw() { + const ptr = this.__wbg_ptr; + this.__wbg_ptr = 0; + StuffFinalization.unregister(this); + return ptr; + } + + free() { + const ptr = this.__destroy_into_raw(); + wasm.__wbg_stuff_free(ptr, 0); + } + constructor() { + const ret = wasm.stuff_new(); + this.__wbg_ptr = ret >>> 0; + StuffFinalization.register(this, this.__wbg_ptr, this); + return this; + } + /** + * @param {any} value + * @returns {string} + */ + refThing(value) { + let deferred1_0; + let deferred1_1; + try { + if (this.__wbg_ptr == 0) throw new Error('Attempt to use a moved value'); + const retptr = wasm.__wbindgen_add_to_stack_pointer(-16); + _assertNum(this.__wbg_ptr); + wasm.stuff_refThing(retptr, this.__wbg_ptr, value); + var r0 = getDataViewMemory0().getInt32(retptr + 4 * 0, true); + var r1 = getDataViewMemory0().getInt32(retptr + 4 * 1, true); + deferred1_0 = r0; + deferred1_1 = r1; + return getStringFromWasm0(r0, r1); + } finally { + wasm.__wbindgen_add_to_stack_pointer(16); + wasm.__wbindgen_export_3(deferred1_0, deferred1_1, 1); + } + } +} + +export function __wbindgen_string_get(arg0, arg1) { + const obj = arg1; + const ret = typeof(obj) === 'string' ? obj : undefined; + var ptr1 = isLikeNone(ret) ? 0 : passStringToWasm0(ret, wasm.__wbindgen_export_0, wasm.__wbindgen_export_1); + var len1 = WASM_VECTOR_LEN; + getDataViewMemory0().setInt32(arg0 + 4 * 1, len1, true); + getDataViewMemory0().setInt32(arg0 + 4 * 0, ptr1, true); +}; + +export function __wbg_new_abda76e883ba8a5f() { return logError(function () { + const ret = new Error(); + return ret; +}, arguments) }; + +export function __wbg_stack_658279fe44541cf6() { return logError(function (arg0, arg1) { + const ret = arg1.stack; + const ptr1 = passStringToWasm0(ret, wasm.__wbindgen_export_0, wasm.__wbindgen_export_1); + const len1 = WASM_VECTOR_LEN; + getDataViewMemory0().setInt32(arg0 + 4 * 1, len1, true); + getDataViewMemory0().setInt32(arg0 + 4 * 0, ptr1, true); +}, arguments) }; + +export function __wbg_error_f851667af71bcfc6() { return logError(function (arg0, arg1) { + let deferred0_0; + let deferred0_1; + try { + deferred0_0 = arg0; + deferred0_1 = arg1; + console.error(getStringFromWasm0(arg0, arg1)); + } finally { + wasm.__wbindgen_export_3(deferred0_0, deferred0_1, 1); + } +}, arguments) }; + +export function __wbg_log_c9486ca5d8e2cbe8() { return logError(function (arg0, arg1) { + let deferred0_0; + let deferred0_1; + try { + deferred0_0 = arg0; + deferred0_1 = arg1; + console.log(getStringFromWasm0(arg0, arg1)); + } finally { + wasm.__wbindgen_export_3(deferred0_0, deferred0_1, 1); + } +}, arguments) }; + +export function __wbg_log_aba5996d9bde071f() { return logError(function (arg0, arg1, arg2, arg3, arg4, arg5, arg6, arg7) { + let deferred0_0; + let deferred0_1; + try { + deferred0_0 = arg0; + deferred0_1 = arg1; + console.log(getStringFromWasm0(arg0, arg1), getStringFromWasm0(arg2, arg3), getStringFromWasm0(arg4, arg5), getStringFromWasm0(arg6, arg7)); + } finally { + wasm.__wbindgen_export_3(deferred0_0, deferred0_1, 1); + } +}, arguments) }; + +export function __wbg_mark_40e050a77cc39fea() { return logError(function (arg0, arg1) { + performance.mark(getStringFromWasm0(arg0, arg1)); +}, arguments) }; + +export function __wbg_measure_aa7a73f17813f708() { return handleError(function (arg0, arg1, arg2, arg3) { + let deferred0_0; + let deferred0_1; + let deferred1_0; + let deferred1_1; + try { + deferred0_0 = arg0; + deferred0_1 = arg1; + deferred1_0 = arg2; + deferred1_1 = arg3; + performance.measure(getStringFromWasm0(arg0, arg1), getStringFromWasm0(arg2, arg3)); + } finally { + wasm.__wbindgen_export_3(deferred0_0, deferred0_1, 1); + wasm.__wbindgen_export_3(deferred1_0, deferred1_1, 1); + } +}, arguments) }; + +export function __wbindgen_throw(arg0, arg1) { + throw new Error(getStringFromWasm0(arg0, arg1)); +}; + +export function __wbindgen_init_externref_table() { + const table = wasm.__wbindgen_export_2; + const offset = table.grow(4); + table.set(0, undefined); + table.set(offset + 0, undefined); + table.set(offset + 1, null); + table.set(offset + 2, true); + table.set(offset + 3, false); + ; +}; + diff --git a/test/configCases/wasm/reference-types/pkg/wasm_lib_bg.wasm b/test/configCases/wasm/reference-types/pkg/wasm_lib_bg.wasm new file mode 100644 index 000000000..7a08e86a1 Binary files /dev/null and b/test/configCases/wasm/reference-types/pkg/wasm_lib_bg.wasm differ diff --git a/test/configCases/wasm/reference-types/test.filter.js b/test/configCases/wasm/reference-types/test.filter.js new file mode 100644 index 000000000..f63a24cdc --- /dev/null +++ b/test/configCases/wasm/reference-types/test.filter.js @@ -0,0 +1,7 @@ +var supportsWebAssembly = require("../../../helpers/supportsWebAssembly"); + +module.exports = function (config) { + const [major] = process.versions.node.split(".").map(Number); + + return major >= 18 && supportsWebAssembly(); +}; diff --git a/test/configCases/wasm/reference-types/webpack.config.js b/test/configCases/wasm/reference-types/webpack.config.js new file mode 100644 index 000000000..2a5755987 --- /dev/null +++ b/test/configCases/wasm/reference-types/webpack.config.js @@ -0,0 +1,11 @@ +/** @typedef {import("../../../../").Compiler} Compiler */ + +/** @type {import("../../../../").Configuration} */ +module.exports = { + output: { + webassemblyModuleFilename: "[id].[hash].wasm" + }, + experiments: { + asyncWebAssembly: true + } +}; diff --git a/test/helpers/FakeDocument.js b/test/helpers/FakeDocument.js index 0bcab25f8..fdd526d65 100644 --- a/test/helpers/FakeDocument.js +++ b/test/helpers/FakeDocument.js @@ -227,10 +227,7 @@ class FakeSheet { "utf-8" ); }); - walkCssTokens(css, { - isSelector() { - return selector === undefined; - }, + walkCssTokens(css, 0, { leftCurlyBracket(source, start, end) { if (selector === undefined) { selector = source.slice(last, start).trim(); diff --git a/test/walkCssTokens.unittest.js b/test/walkCssTokens.unittest.js index b56f4a322..79523ba11 100644 --- a/test/walkCssTokens.unittest.js +++ b/test/walkCssTokens.unittest.js @@ -6,7 +6,7 @@ describe("walkCssTokens", () => { const test = (name, content, fn) => { it(`should parse ${name}`, () => { const results = []; - walkCssTokens(content, { + walkCssTokens(content, 0, { comment: (input, s, e) => { results.push(["comment", input.slice(s, e)]); return e; diff --git a/yarn.lock b/yarn.lock index e2032d079..1e14c7630 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1321,125 +1321,125 @@ "@typescript-eslint/types" "8.8.1" eslint-visitor-keys "^3.4.3" -"@webassemblyjs/ast@1.12.1", "@webassemblyjs/ast@^1.12.1": - version "1.12.1" - resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.12.1.tgz#bb16a0e8b1914f979f45864c23819cc3e3f0d4bb" - integrity sha512-EKfMUOPRRUTy5UII4qJDGPpqfwjOmZ5jeGFwid9mnoqIFK+e0vqoi1qH56JpmZSzEL53jKnNzScdmftJyG5xWg== +"@webassemblyjs/ast@1.14.1", "@webassemblyjs/ast@^1.14.1": + version "1.14.1" + resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.14.1.tgz#a9f6a07f2b03c95c8d38c4536a1fdfb521ff55b6" + integrity sha512-nuBEDgQfm1ccRp/8bCQrx1frohyufl4JlbMMZ4P1wpeOfDhF6FQkxZJ1b/e+PLwr6X1Nhw6OLme5usuBWYBvuQ== dependencies: - "@webassemblyjs/helper-numbers" "1.11.6" - "@webassemblyjs/helper-wasm-bytecode" "1.11.6" + "@webassemblyjs/helper-numbers" "1.13.2" + "@webassemblyjs/helper-wasm-bytecode" "1.13.2" -"@webassemblyjs/floating-point-hex-parser@1.11.6": - version "1.11.6" - resolved "https://registry.yarnpkg.com/@webassemblyjs/floating-point-hex-parser/-/floating-point-hex-parser-1.11.6.tgz#dacbcb95aff135c8260f77fa3b4c5fea600a6431" - integrity sha512-ejAj9hfRJ2XMsNHk/v6Fu2dGS+i4UaXBXGemOfQ/JfQ6mdQg/WXtwleQRLLS4OvfDhv8rYnVwH27YJLMyYsxhw== +"@webassemblyjs/floating-point-hex-parser@1.13.2": + version "1.13.2" + resolved "https://registry.yarnpkg.com/@webassemblyjs/floating-point-hex-parser/-/floating-point-hex-parser-1.13.2.tgz#fcca1eeddb1cc4e7b6eed4fc7956d6813b21b9fb" + integrity sha512-6oXyTOzbKxGH4steLbLNOu71Oj+C8Lg34n6CqRvqfS2O71BxY6ByfMDRhBytzknj9yGUPVJ1qIKhRlAwO1AovA== -"@webassemblyjs/helper-api-error@1.11.6": - version "1.11.6" - resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-api-error/-/helper-api-error-1.11.6.tgz#6132f68c4acd59dcd141c44b18cbebbd9f2fa768" - integrity sha512-o0YkoP4pVu4rN8aTJgAyj9hC2Sv5UlkzCHhxqWj8butaLvnpdc2jOwh4ewE6CX0txSfLn/UYaV/pheS2Txg//Q== +"@webassemblyjs/helper-api-error@1.13.2": + version "1.13.2" + resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-api-error/-/helper-api-error-1.13.2.tgz#e0a16152248bc38daee76dd7e21f15c5ef3ab1e7" + integrity sha512-U56GMYxy4ZQCbDZd6JuvvNV/WFildOjsaWD3Tzzvmw/mas3cXzRJPMjP83JqEsgSbyrmaGjBfDtV7KDXV9UzFQ== -"@webassemblyjs/helper-buffer@1.12.1": - version "1.12.1" - resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-buffer/-/helper-buffer-1.12.1.tgz#6df20d272ea5439bf20ab3492b7fb70e9bfcb3f6" - integrity sha512-nzJwQw99DNDKr9BVCOZcLuJJUlqkJh+kVzVl6Fmq/tI5ZtEyWT1KZMyOXltXLZJmDtvLCDgwsyrkohEtopTXCw== +"@webassemblyjs/helper-buffer@1.14.1": + version "1.14.1" + resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-buffer/-/helper-buffer-1.14.1.tgz#822a9bc603166531f7d5df84e67b5bf99b72b96b" + integrity sha512-jyH7wtcHiKssDtFPRB+iQdxlDf96m0E39yb0k5uJVhFGleZFoNw1c4aeIcVUPPbXUVJ94wwnMOAqUHyzoEPVMA== -"@webassemblyjs/helper-numbers@1.11.6": - version "1.11.6" - resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-numbers/-/helper-numbers-1.11.6.tgz#cbce5e7e0c1bd32cf4905ae444ef64cea919f1b5" - integrity sha512-vUIhZ8LZoIWHBohiEObxVm6hwP034jwmc9kuq5GdHZH0wiLVLIPcMCdpJzG4C11cHoQ25TFIQj9kaVADVX7N3g== +"@webassemblyjs/helper-numbers@1.13.2": + version "1.13.2" + resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-numbers/-/helper-numbers-1.13.2.tgz#dbd932548e7119f4b8a7877fd5a8d20e63490b2d" + integrity sha512-FE8aCmS5Q6eQYcV3gI35O4J789wlQA+7JrqTTpJqn5emA4U2hvwJmvFRC0HODS+3Ye6WioDklgd6scJ3+PLnEA== dependencies: - "@webassemblyjs/floating-point-hex-parser" "1.11.6" - "@webassemblyjs/helper-api-error" "1.11.6" + "@webassemblyjs/floating-point-hex-parser" "1.13.2" + "@webassemblyjs/helper-api-error" "1.13.2" "@xtuc/long" "4.2.2" -"@webassemblyjs/helper-wasm-bytecode@1.11.6": - version "1.11.6" - resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-wasm-bytecode/-/helper-wasm-bytecode-1.11.6.tgz#bb2ebdb3b83aa26d9baad4c46d4315283acd51e9" - integrity sha512-sFFHKwcmBprO9e7Icf0+gddyWYDViL8bpPjJJl0WHxCdETktXdmtWLGVzoHbqUcY4Be1LkNfwTmXOJUFZYSJdA== +"@webassemblyjs/helper-wasm-bytecode@1.13.2": + version "1.13.2" + resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-wasm-bytecode/-/helper-wasm-bytecode-1.13.2.tgz#e556108758f448aae84c850e593ce18a0eb31e0b" + integrity sha512-3QbLKy93F0EAIXLh0ogEVR6rOubA9AoZ+WRYhNbFyuB70j3dRdwH9g+qXhLAO0kiYGlg3TxDV+I4rQTr/YNXkA== -"@webassemblyjs/helper-wasm-section@1.12.1": - version "1.12.1" - resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-wasm-section/-/helper-wasm-section-1.12.1.tgz#3da623233ae1a60409b509a52ade9bc22a37f7bf" - integrity sha512-Jif4vfB6FJlUlSbgEMHUyk1j234GTNG9dBJ4XJdOySoj518Xj0oGsNi59cUQF4RRMS9ouBUxDDdyBVfPTypa5g== +"@webassemblyjs/helper-wasm-section@1.14.1": + version "1.14.1" + resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-wasm-section/-/helper-wasm-section-1.14.1.tgz#9629dda9c4430eab54b591053d6dc6f3ba050348" + integrity sha512-ds5mXEqTJ6oxRoqjhWDU83OgzAYjwsCV8Lo/N+oRsNDmx/ZDpqalmrtgOMkHwxsG0iI//3BwWAErYRHtgn0dZw== dependencies: - "@webassemblyjs/ast" "1.12.1" - "@webassemblyjs/helper-buffer" "1.12.1" - "@webassemblyjs/helper-wasm-bytecode" "1.11.6" - "@webassemblyjs/wasm-gen" "1.12.1" + "@webassemblyjs/ast" "1.14.1" + "@webassemblyjs/helper-buffer" "1.14.1" + "@webassemblyjs/helper-wasm-bytecode" "1.13.2" + "@webassemblyjs/wasm-gen" "1.14.1" -"@webassemblyjs/ieee754@1.11.6": - version "1.11.6" - resolved "https://registry.yarnpkg.com/@webassemblyjs/ieee754/-/ieee754-1.11.6.tgz#bb665c91d0b14fffceb0e38298c329af043c6e3a" - integrity sha512-LM4p2csPNvbij6U1f19v6WR56QZ8JcHg3QIJTlSwzFcmx6WSORicYj6I63f9yU1kEUtrpG+kjkiIAkevHpDXrg== +"@webassemblyjs/ieee754@1.13.2": + version "1.13.2" + resolved "https://registry.yarnpkg.com/@webassemblyjs/ieee754/-/ieee754-1.13.2.tgz#1c5eaace1d606ada2c7fd7045ea9356c59ee0dba" + integrity sha512-4LtOzh58S/5lX4ITKxnAK2USuNEvpdVV9AlgGQb8rJDHaLeHciwG4zlGr0j/SNWlr7x3vO1lDEsuePvtcDNCkw== dependencies: "@xtuc/ieee754" "^1.2.0" -"@webassemblyjs/leb128@1.11.6": - version "1.11.6" - resolved "https://registry.yarnpkg.com/@webassemblyjs/leb128/-/leb128-1.11.6.tgz#70e60e5e82f9ac81118bc25381a0b283893240d7" - integrity sha512-m7a0FhE67DQXgouf1tbN5XQcdWoNgaAuoULHIfGFIEVKA6tu/edls6XnIlkmS6FrXAquJRPni3ZZKjw6FSPjPQ== +"@webassemblyjs/leb128@1.13.2": + version "1.13.2" + resolved "https://registry.yarnpkg.com/@webassemblyjs/leb128/-/leb128-1.13.2.tgz#57c5c3deb0105d02ce25fa3fd74f4ebc9fd0bbb0" + integrity sha512-Lde1oNoIdzVzdkNEAWZ1dZ5orIbff80YPdHx20mrHwHrVNNTjNr8E3xz9BdpcGqRQbAEa+fkrCb+fRFTl/6sQw== dependencies: "@xtuc/long" "4.2.2" -"@webassemblyjs/utf8@1.11.6": - version "1.11.6" - resolved "https://registry.yarnpkg.com/@webassemblyjs/utf8/-/utf8-1.11.6.tgz#90f8bc34c561595fe156603be7253cdbcd0fab5a" - integrity sha512-vtXf2wTQ3+up9Zsg8sa2yWiQpzSsMyXj0qViVP6xKGCUT8p8YJ6HqI7l5eCnWx1T/FYdsv07HQs2wTFbbof/RA== +"@webassemblyjs/utf8@1.13.2": + version "1.13.2" + resolved "https://registry.yarnpkg.com/@webassemblyjs/utf8/-/utf8-1.13.2.tgz#917a20e93f71ad5602966c2d685ae0c6c21f60f1" + integrity sha512-3NQWGjKTASY1xV5m7Hr0iPeXD9+RDobLll3T9d2AO+g3my8xy5peVyjSag4I50mR1bBSN/Ct12lo+R9tJk0NZQ== -"@webassemblyjs/wasm-edit@^1.12.1": - version "1.12.1" - resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-edit/-/wasm-edit-1.12.1.tgz#9f9f3ff52a14c980939be0ef9d5df9ebc678ae3b" - integrity sha512-1DuwbVvADvS5mGnXbE+c9NfA8QRcZ6iKquqjjmR10k6o+zzsRVesil54DKexiowcFCPdr/Q0qaMgB01+SQ1u6g== +"@webassemblyjs/wasm-edit@^1.14.1": + version "1.14.1" + resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-edit/-/wasm-edit-1.14.1.tgz#ac6689f502219b59198ddec42dcd496b1004d597" + integrity sha512-RNJUIQH/J8iA/1NzlE4N7KtyZNHi3w7at7hDjvRNm5rcUXa00z1vRz3glZoULfJ5mpvYhLybmVcwcjGrC1pRrQ== dependencies: - "@webassemblyjs/ast" "1.12.1" - "@webassemblyjs/helper-buffer" "1.12.1" - "@webassemblyjs/helper-wasm-bytecode" "1.11.6" - "@webassemblyjs/helper-wasm-section" "1.12.1" - "@webassemblyjs/wasm-gen" "1.12.1" - "@webassemblyjs/wasm-opt" "1.12.1" - "@webassemblyjs/wasm-parser" "1.12.1" - "@webassemblyjs/wast-printer" "1.12.1" + "@webassemblyjs/ast" "1.14.1" + "@webassemblyjs/helper-buffer" "1.14.1" + "@webassemblyjs/helper-wasm-bytecode" "1.13.2" + "@webassemblyjs/helper-wasm-section" "1.14.1" + "@webassemblyjs/wasm-gen" "1.14.1" + "@webassemblyjs/wasm-opt" "1.14.1" + "@webassemblyjs/wasm-parser" "1.14.1" + "@webassemblyjs/wast-printer" "1.14.1" -"@webassemblyjs/wasm-gen@1.12.1": - version "1.12.1" - resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-gen/-/wasm-gen-1.12.1.tgz#a6520601da1b5700448273666a71ad0a45d78547" - integrity sha512-TDq4Ojh9fcohAw6OIMXqiIcTq5KUXTGRkVxbSo1hQnSy6lAM5GSdfwWeSxpAo0YzgsgF182E/U0mDNhuA0tW7w== +"@webassemblyjs/wasm-gen@1.14.1": + version "1.14.1" + resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-gen/-/wasm-gen-1.14.1.tgz#991e7f0c090cb0bb62bbac882076e3d219da9570" + integrity sha512-AmomSIjP8ZbfGQhumkNvgC33AY7qtMCXnN6bL2u2Js4gVCg8fp735aEiMSBbDR7UQIj90n4wKAFUSEd0QN2Ukg== dependencies: - "@webassemblyjs/ast" "1.12.1" - "@webassemblyjs/helper-wasm-bytecode" "1.11.6" - "@webassemblyjs/ieee754" "1.11.6" - "@webassemblyjs/leb128" "1.11.6" - "@webassemblyjs/utf8" "1.11.6" + "@webassemblyjs/ast" "1.14.1" + "@webassemblyjs/helper-wasm-bytecode" "1.13.2" + "@webassemblyjs/ieee754" "1.13.2" + "@webassemblyjs/leb128" "1.13.2" + "@webassemblyjs/utf8" "1.13.2" -"@webassemblyjs/wasm-opt@1.12.1": - version "1.12.1" - resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-opt/-/wasm-opt-1.12.1.tgz#9e6e81475dfcfb62dab574ac2dda38226c232bc5" - integrity sha512-Jg99j/2gG2iaz3hijw857AVYekZe2SAskcqlWIZXjji5WStnOpVoat3gQfT/Q5tb2djnCjBtMocY/Su1GfxPBg== +"@webassemblyjs/wasm-opt@1.14.1": + version "1.14.1" + resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-opt/-/wasm-opt-1.14.1.tgz#e6f71ed7ccae46781c206017d3c14c50efa8106b" + integrity sha512-PTcKLUNvBqnY2U6E5bdOQcSM+oVP/PmrDY9NzowJjislEjwP/C4an2303MCVS2Mg9d3AJpIGdUFIQQWbPds0Sw== dependencies: - "@webassemblyjs/ast" "1.12.1" - "@webassemblyjs/helper-buffer" "1.12.1" - "@webassemblyjs/wasm-gen" "1.12.1" - "@webassemblyjs/wasm-parser" "1.12.1" + "@webassemblyjs/ast" "1.14.1" + "@webassemblyjs/helper-buffer" "1.14.1" + "@webassemblyjs/wasm-gen" "1.14.1" + "@webassemblyjs/wasm-parser" "1.14.1" -"@webassemblyjs/wasm-parser@1.12.1", "@webassemblyjs/wasm-parser@^1.12.1": - version "1.12.1" - resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-parser/-/wasm-parser-1.12.1.tgz#c47acb90e6f083391e3fa61d113650eea1e95937" - integrity sha512-xikIi7c2FHXysxXe3COrVUPSheuBtpcfhbpFj4gmu7KRLYOzANztwUU0IbsqvMqzuNK2+glRGWCEqZo1WCLyAQ== +"@webassemblyjs/wasm-parser@1.14.1", "@webassemblyjs/wasm-parser@^1.14.1": + version "1.14.1" + resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-parser/-/wasm-parser-1.14.1.tgz#b3e13f1893605ca78b52c68e54cf6a865f90b9fb" + integrity sha512-JLBl+KZ0R5qB7mCnud/yyX08jWFw5MsoalJ1pQ4EdFlgj9VdXKGuENGsiCIjegI1W7p91rUlcB/LB5yRJKNTcQ== dependencies: - "@webassemblyjs/ast" "1.12.1" - "@webassemblyjs/helper-api-error" "1.11.6" - "@webassemblyjs/helper-wasm-bytecode" "1.11.6" - "@webassemblyjs/ieee754" "1.11.6" - "@webassemblyjs/leb128" "1.11.6" - "@webassemblyjs/utf8" "1.11.6" + "@webassemblyjs/ast" "1.14.1" + "@webassemblyjs/helper-api-error" "1.13.2" + "@webassemblyjs/helper-wasm-bytecode" "1.13.2" + "@webassemblyjs/ieee754" "1.13.2" + "@webassemblyjs/leb128" "1.13.2" + "@webassemblyjs/utf8" "1.13.2" -"@webassemblyjs/wast-printer@1.12.1": - version "1.12.1" - resolved "https://registry.yarnpkg.com/@webassemblyjs/wast-printer/-/wast-printer-1.12.1.tgz#bcecf661d7d1abdaf989d8341a4833e33e2b31ac" - integrity sha512-+X4WAlOisVWQMikjbcvY2e0rwPsKQ9F688lksZhBcPycBBuii3O7m8FACbDMWDojpAqvjIncrG8J0XHKyQfVeA== +"@webassemblyjs/wast-printer@1.14.1": + version "1.14.1" + resolved "https://registry.yarnpkg.com/@webassemblyjs/wast-printer/-/wast-printer-1.14.1.tgz#3bb3e9638a8ae5fdaf9610e7a06b4d9f9aa6fe07" + integrity sha512-kPSSXE6De1XOR820C90RIo2ogvZG+c3KiHzqUoO/F34Y2shGzesfqv7o57xrxovZJH/MetF5UjroJ/R/3isoiw== dependencies: - "@webassemblyjs/ast" "1.12.1" + "@webassemblyjs/ast" "1.14.1" "@xtuc/long" "4.2.2" "@webpack-cli/configtest@^2.1.1":