diff --git a/test/__snapshots__/modules-option.test.js.snap b/test/__snapshots__/modules-option.test.js.snap new file mode 100644 index 00000000..a2cce878 --- /dev/null +++ b/test/__snapshots__/modules-option.test.js.snap @@ -0,0 +1,1581 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`modules option case class-names (option is false): errors 1`] = `Array []`; + +exports[`modules option case class-names (option is false): locals 1`] = `undefined`; + +exports[`modules option case class-names (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + ".class-1, .class-10 .bar-1 { + color: green; +} +", + "", + ], +] +`; + +exports[`modules option case class-names (option is false): warnings 1`] = `Array []`; + +exports[`modules option case class-names (option is true): errors 1`] = `Array []`; + +exports[`modules option case class-names (option is true): locals 1`] = ` +Object { + "bar-1": "_bar-1", + "class-1": "_class-1", + "class-10": "_class-10", +} +`; + +exports[`modules option case class-names (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + "._class-1, ._class-10 ._bar-1 { + color: green; +} +", + "", + ], +] +`; + +exports[`modules option case class-names (option is true): warnings 1`] = `Array []`; + +exports[`modules option case comment-in-local (option is false): errors 1`] = `Array []`; + +exports[`modules option case comment-in-local (option is false): locals 1`] = ` +Object { + "c1": "_c1", + "c3": "_c3", +} +`; + +exports[`modules option case comment-in-local (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + "._c1/*.c2*/._c3 { background: red; } +", + "", + ], +] +`; + +exports[`modules option case comment-in-local (option is false): warnings 1`] = `Array []`; + +exports[`modules option case comment-in-local (option is true): errors 1`] = `Array []`; + +exports[`modules option case comment-in-local (option is true): locals 1`] = ` +Object { + "c1": "_c1", + "c3": "_c3", +} +`; + +exports[`modules option case comment-in-local (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + "._c1/*.c2*/._c3 { background: red; } +", + "", + ], +] +`; + +exports[`modules option case comment-in-local (option is true): warnings 1`] = `Array []`; + +exports[`modules option case comments (option is false): errors 1`] = `Array []`; + +exports[`modules option case comments (option is false): locals 1`] = `undefined`; + +exports[`modules option case comments (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + "/* + * a ' above + */ + +.bg { + background-image: url(/webpack/public/path/img.png); +} + +/* + * a ' below + */ +", + "", + ], +] +`; + +exports[`modules option case comments (option is false): warnings 1`] = `Array []`; + +exports[`modules option case comments (option is true): errors 1`] = `Array []`; + +exports[`modules option case comments (option is true): locals 1`] = ` +Object { + "bg": "_bg", +} +`; + +exports[`modules option case comments (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + "/* + * a ' above + */ + +._bg { + background-image: url(/webpack/public/path/img.png); +} + +/* + * a ' below + */ +", + "", + ], +] +`; + +exports[`modules option case comments (option is true): warnings 1`] = `Array []`; + +exports[`modules option case composes (option is false): errors 1`] = `Array []`; + +exports[`modules option case composes (option is false): locals 1`] = ` +Object { + "c1": "_c1", + "c2": "_c2 _c1", +} +`; + +exports[`modules option case composes (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + "._c1 { a: 1; } +._c2 { b: 1; } +", + "", + ], +] +`; + +exports[`modules option case composes (option is false): warnings 1`] = `Array []`; + +exports[`modules option case composes (option is true): errors 1`] = `Array []`; + +exports[`modules option case composes (option is true): locals 1`] = ` +Object { + "c1": "_c1", + "c2": "_c2 _c1", +} +`; + +exports[`modules option case composes (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + "._c1 { a: 1; } +._c2 { b: 1; } +", + "", + ], +] +`; + +exports[`modules option case composes (option is true): warnings 1`] = `Array []`; + +exports[`modules option case composes-1 (option is false): errors 1`] = `Array []`; + +exports[`modules option case composes-1 (option is false): locals 1`] = ` +Object { + "c1": "_c1 _c2", + "c3": "_c3 _c1 _c2", + "c5": "_c5 _c2 _c4", +} +`; + +exports[`modules option case composes-1 (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 2, + "._c2 { + color: red; +} + +._c4 { + color: blue; +} + +.test{ + c: d +} +", + "", + ], + Array [ + 1, + "._c1 { b: 1; } +._c3 { b: 3; } +._c5 { b: 5; } +", + "", + ], +] +`; + +exports[`modules option case composes-1 (option is false): warnings 1`] = `Array []`; + +exports[`modules option case composes-1 (option is true): errors 1`] = `Array []`; + +exports[`modules option case composes-1 (option is true): locals 1`] = ` +Object { + "c1": "_c1 _c2", + "c3": "_c3 _c1 _c2", + "c5": "_c5 _c2 _c4", +} +`; + +exports[`modules option case composes-1 (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 2, + "._c2 { + color: red; +} + +._c4 { + color: blue; +} + +._test{ + c: d +} +", + "", + ], + Array [ + 1, + "._c1 { b: 1; } +._c3 { b: 3; } +._c5 { b: 5; } +", + "", + ], +] +`; + +exports[`modules option case composes-1 (option is true): warnings 1`] = `Array []`; + +exports[`modules option case composes-2 (option is false): errors 1`] = `Array []`; + +exports[`modules option case composes-2 (option is false): locals 1`] = ` +Object { + "c1": "_c1 _c-2", + "c3": "_c3 _c1 _c-2", + "c5": "_c5 _c-2 _c4", +} +`; + +exports[`modules option case composes-2 (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 2, + "._c-2 { + color: red; +} + +._c4 { + color: blue; +} + +.test{ + c: d +} +", + "", + ], + Array [ + 1, + "._c1 { b: 1; } +._c3 { b: 3; } +._c5 { b: 5; } +", + "", + ], +] +`; + +exports[`modules option case composes-2 (option is false): warnings 1`] = `Array []`; + +exports[`modules option case composes-2 (option is true): errors 1`] = `Array []`; + +exports[`modules option case composes-2 (option is true): locals 1`] = ` +Object { + "c1": "_c1 _c-2", + "c3": "_c3 _c1 _c-2", + "c5": "_c5 _c-2 _c4", +} +`; + +exports[`modules option case composes-2 (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 2, + "._c-2 { + color: red; +} + +._c4 { + color: blue; +} + +._test{ + c: d +} +", + "", + ], + Array [ + 1, + "._c1 { b: 1; } +._c3 { b: 3; } +._c5 { b: 5; } +", + "", + ], +] +`; + +exports[`modules option case composes-2 (option is true): warnings 1`] = `Array []`; + +exports[`modules option case composes-multiple (option is false): errors 1`] = `Array []`; + +exports[`modules option case composes-multiple (option is false): locals 1`] = ` +Object { + "abc": "_abc _def1 _def2", +} +`; + +exports[`modules option case composes-multiple (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 2, + "._def1 { + color: red; +} +", + "", + ], + Array [ + 3, + "._def2 { + color: blue; +} +", + "", + ], + Array [ + 1, + "._abc { +} +", + "", + ], +] +`; + +exports[`modules option case composes-multiple (option is false): warnings 1`] = `Array []`; + +exports[`modules option case composes-multiple (option is true): errors 1`] = `Array []`; + +exports[`modules option case composes-multiple (option is true): locals 1`] = ` +Object { + "abc": "_abc _def1 _def2", +} +`; + +exports[`modules option case composes-multiple (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 2, + "._def1 { + color: red; +} +", + "", + ], + Array [ + 3, + "._def2 { + color: blue; +} +", + "", + ], + Array [ + 1, + "._abc { +} +", + "", + ], +] +`; + +exports[`modules option case composes-multiple (option is true): warnings 1`] = `Array []`; + +exports[`modules option case composes-with-importing (option is false): errors 1`] = `Array []`; + +exports[`modules option case composes-with-importing (option is false): locals 1`] = ` +Object { + "abc": "_abc _def", +} +`; + +exports[`modules option case composes-with-importing (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 2, + "._def { + color: red; +} +", + "", + ], + Array [ + 1, + "._abc { +} +", + "", + ], +] +`; + +exports[`modules option case composes-with-importing (option is false): warnings 1`] = `Array []`; + +exports[`modules option case composes-with-importing (option is true): errors 1`] = `Array []`; + +exports[`modules option case composes-with-importing (option is true): locals 1`] = ` +Object { + "abc": "_abc _def", +} +`; + +exports[`modules option case composes-with-importing (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 2, + "._def { + color: red; +} +", + "", + ], + Array [ + 1, + "._abc { +} +", + "", + ], +] +`; + +exports[`modules option case composes-with-importing (option is true): warnings 1`] = `Array []`; + +exports[`modules option case keyframes-and-animation (option is false): errors 1`] = `Array []`; + +exports[`modules option case keyframes-and-animation (option is false): locals 1`] = `undefined`; + +exports[`modules option case keyframes-and-animation (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + ".a { + color: green; +} + +@keyframes bounce { + 0% { + transform: translateY(-100%); + opacity: 0; + } + 5% { + transform: translateY(-100%); + opacity: 0; + } +} + +@-webkit-keyframes bounce2 { + 0% { + transform: translateY(-100%); + opacity: 0; + } + 5% { + transform: translateY(-100%); + opacity: 0; + } +} + +.bounce { + animation-name: bounce; + animation: bounce2 1s ease; +} + +.bounce2 { + color: green; + animation: bounce 1s ease; + animation-name: bounce2; +} + +.bounce3 { + animation: bounce 1s ease, bounce2 +} + +.bounce4 { + animation: bounce 1s ease, bounce2; +} + +.b { + color: green; +} +", + "", + ], +] +`; + +exports[`modules option case keyframes-and-animation (option is false): warnings 1`] = `Array []`; + +exports[`modules option case keyframes-and-animation (option is true): errors 1`] = `Array []`; + +exports[`modules option case keyframes-and-animation (option is true): locals 1`] = ` +Object { + "a": "_a", + "b": "_b", + "bounce": "_bounce", + "bounce2": "_bounce2", + "bounce3": "_bounce3", + "bounce4": "_bounce4", +} +`; + +exports[`modules option case keyframes-and-animation (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + "._a { + color: green; +} + +@keyframes _bounce { + 0% { + transform: translateY(-100%); + opacity: 0; + } + 5% { + transform: translateY(-100%); + opacity: 0; + } +} + +@-webkit-keyframes _bounce2 { + 0% { + transform: translateY(-100%); + opacity: 0; + } + 5% { + transform: translateY(-100%); + opacity: 0; + } +} + +._bounce { + animation-name: _bounce; + animation: _bounce2 1s ease; +} + +._bounce2 { + color: green; + animation: _bounce 1s ease; + animation-name: _bounce2; +} + +._bounce3 { + animation: _bounce 1s ease, _bounce2 +} + +._bounce4 { + animation: _bounce 1s ease, _bounce2; +} + +._b { + color: green; +} +", + "", + ], +] +`; + +exports[`modules option case keyframes-and-animation (option is true): warnings 1`] = `Array []`; + +exports[`modules option case leak-scope (option is false): errors 1`] = `Array []`; + +exports[`modules option case leak-scope (option is false): locals 1`] = `undefined`; + +exports[`modules option case leak-scope (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + ".a { + color: green; + animation: a; +} + +@keyframes b { + 0% { left: 10px; } + 100% { left: 20px; } +} + +.b { + animation: b; +} + +@keyframes c { + 0% { left: 10px; } + 100% { left: 20px; } +} + +.c { + animation: c1; + animation: c2, c3, c4; +} + +@keyframes d { + 0% { left: 10px; } + 100% { left: 20px; } +} + +.d1 { + animation: d1; + animation: d2, d3, d4; +} + +.d2 { + animation: d2; +} +", + "", + ], +] +`; + +exports[`modules option case leak-scope (option is false): warnings 1`] = `Array []`; + +exports[`modules option case leak-scope (option is true): errors 1`] = `Array []`; + +exports[`modules option case leak-scope (option is true): locals 1`] = ` +Object { + "a": "_a", + "b": "_b", + "c": "_c", + "c1": "_c1", + "c2": "_c2", + "c3": "_c3", + "c4": "_c4", + "d2": "_d2", +} +`; + +exports[`modules option case leak-scope (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + "._a { + color: green; + animation: _a; +} + +@keyframes _b { + 0% { left: 10px; } + 100% { left: 20px; } +} + +._b { + animation: _b; +} + +@keyframes c { + 0% { left: 10px; } + 100% { left: 20px; } +} + +._c { + animation: _c1; + animation: _c2, _c3, _c4; +} + +@keyframes d { + 0% { left: 10px; } + 100% { left: 20px; } +} + +.d1 { + animation: d1; + animation: d2, d3, d4; +} + +.d2 { + animation: _d2; +} +", + "", + ], +] +`; + +exports[`modules option case leak-scope (option is true): warnings 1`] = `Array []`; + +exports[`modules option case local (option is false): errors 1`] = `Array []`; + +exports[`modules option case local (option is false): locals 1`] = ` +Object { + "def": "_def", + "ghi": "_ghi", + "jkl": "_jkl", +} +`; + +exports[`modules option case local (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + ".abc ._def { + color: red; +} + +._ghi ._jkl { + color: blue; +} +", + "", + ], +] +`; + +exports[`modules option case local (option is false): warnings 1`] = `Array []`; + +exports[`modules option case local (option is true): errors 1`] = `Array []`; + +exports[`modules option case local (option is true): locals 1`] = ` +Object { + "abc": "_abc", + "def": "_def", + "ghi": "_ghi", + "jkl": "_jkl", +} +`; + +exports[`modules option case local (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + "._abc ._def { + color: red; +} + +._ghi ._jkl { + color: blue; +} +", + "", + ], +] +`; + +exports[`modules option case local (option is true): warnings 1`] = `Array []`; + +exports[`modules option case local-2 (option is false): errors 1`] = `Array []`; + +exports[`modules option case local-2 (option is false): locals 1`] = ` +Object { + "className": "_className", + "someId": "_someId", + "subClass": "_subClass", +} +`; + +exports[`modules option case local-2 (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + "._className { background: red; } +#_someId { background: green; } +._className ._subClass { color: green; } +#_someId ._subClass { color: blue; } +", + "", + ], +] +`; + +exports[`modules option case local-2 (option is false): warnings 1`] = `Array []`; + +exports[`modules option case local-2 (option is true): errors 1`] = `Array []`; + +exports[`modules option case local-2 (option is true): locals 1`] = ` +Object { + "className": "_className", + "someId": "_someId", + "subClass": "_subClass", +} +`; + +exports[`modules option case local-2 (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + "._className { background: red; } +#_someId { background: green; } +._className ._subClass { color: green; } +#_someId ._subClass { color: blue; } +", + "", + ], +] +`; + +exports[`modules option case local-2 (option is true): warnings 1`] = `Array []`; + +exports[`modules option case local-and-composes (option is false): errors 1`] = `Array []`; + +exports[`modules option case local-and-composes (option is false): locals 1`] = ` +Object { + "abc": "_abc", + "def": "_def _abc", +} +`; + +exports[`modules option case local-and-composes (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + "._abc { + color: red; +} +._def { + background: green; +} +", + "", + ], +] +`; + +exports[`modules option case local-and-composes (option is false): warnings 1`] = `Array []`; + +exports[`modules option case local-and-composes (option is true): errors 1`] = `Array []`; + +exports[`modules option case local-and-composes (option is true): locals 1`] = ` +Object { + "abc": "_abc", + "def": "_def _abc", +} +`; + +exports[`modules option case local-and-composes (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + "._abc { + color: red; +} +._def { + background: green; +} +", + "", + ], +] +`; + +exports[`modules option case local-and-composes (option is true): warnings 1`] = `Array []`; + +exports[`modules option case local-with-string (option is false): errors 1`] = `Array []`; + +exports[`modules option case local-with-string (option is false): locals 1`] = ` +Object { + "c1": "_c1", + "c3": "_c3", + "c4": "_c4", +} +`; + +exports[`modules option case local-with-string (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + "._c1[data-attr=\\".c2)]'\\"]:not(._c3):not(._c4) { + background: red; +} +", + "", + ], +] +`; + +exports[`modules option case local-with-string (option is false): warnings 1`] = `Array []`; + +exports[`modules option case local-with-string (option is true): errors 1`] = `Array []`; + +exports[`modules option case local-with-string (option is true): locals 1`] = ` +Object { + "c1": "_c1", + "c3": "_c3", + "c4": "_c4", +} +`; + +exports[`modules option case local-with-string (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + "._c1[data-attr=\\".c2)]'\\"]:not(._c3):not(._c4) { + background: red; +} +", + "", + ], +] +`; + +exports[`modules option case local-with-string (option is true): warnings 1`] = `Array []`; + +exports[`modules option case mode-switching (option is false): errors 1`] = `Array []`; + +exports[`modules option case mode-switching (option is false): locals 1`] = ` +Object { + "c2": "_c2", + "c3": "_c3", + "c5": "_c5", + "c7": "_c7", +} +`; + +exports[`modules option case mode-switching (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + ".c1 ._c2 ._c3 .c4 ._c5, .c6 ._c7 { background: red; } +.c8 { background: red; } +", + "", + ], +] +`; + +exports[`modules option case mode-switching (option is false): warnings 1`] = `Array []`; + +exports[`modules option case mode-switching (option is true): errors 1`] = `Array []`; + +exports[`modules option case mode-switching (option is true): locals 1`] = ` +Object { + "c1": "_c1", + "c2": "_c2", + "c3": "_c3", + "c5": "_c5", + "c6": "_c6", + "c7": "_c7", + "c8": "_c8", +} +`; + +exports[`modules option case mode-switching (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + "._c1 ._c2 ._c3 .c4 ._c5, ._c6 ._c7 { background: red; } +._c8 { background: red; } +", + "", + ], +] +`; + +exports[`modules option case mode-switching (option is true): warnings 1`] = `Array []`; + +exports[`modules option case simple (option is false): errors 1`] = `Array []`; + +exports[`modules option case simple (option is false): locals 1`] = `undefined`; + +exports[`modules option case simple (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + ".a .b, .c .d, #id { + color: green; + font-size: 1.5pt; +} +a[href=\\"#b.c\\"].x.y { + color: green; + font-size: 1.5pt; +} +@keyframes z { + 2.5% {color: green;} +} +", + "", + ], +] +`; + +exports[`modules option case simple (option is false): warnings 1`] = `Array []`; + +exports[`modules option case simple (option is true): errors 1`] = `Array []`; + +exports[`modules option case simple (option is true): locals 1`] = ` +Object { + "a": "_a", + "b": "_b", + "c": "_c", + "d": "_d", + "id": "_id", + "x": "_x", + "y": "_y", + "z": "_z", +} +`; + +exports[`modules option case simple (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + "._a ._b, ._c ._d, #_id { + color: green; + font-size: 1.5pt; +} +a[href=\\"#b.c\\"]._x._y { + color: green; + font-size: 1.5pt; +} +@keyframes _z { + 2.5% {color: green;} +} +", + "", + ], +] +`; + +exports[`modules option case simple (option is true): warnings 1`] = `Array []`; + +exports[`modules option case urls (option is false): errors 1`] = `Array []`; + +exports[`modules option case urls (option is false): locals 1`] = `undefined`; + +exports[`modules option case urls (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + ".a { + background: url(/webpack/public/path/img.png); + background: url(/webpack/public/path/img.png); + background: url(\\"/webpack/public/path/img img.png\\"); + background: url(\\"/webpack/public/path/img img.png\\"); + background: url(/webpack/public/path/img.png); + background: url(/webpack/public/path/img.png#?iefix); + background: url(\\"#hash\\"); + background: url(\\"#\\"); + background: url(data:image/png;base64,AAA); + background: url(http://example.com/image.jpg); + background: url(//example.com/image.png); + background: green url(data:image/png;base64,AAA) url(http://example.com/image.jpg) url(//example.com/image.png) url(/webpack/public/path/img.png) xyz; +} +", + "", + ], +] +`; + +exports[`modules option case urls (option is false): warnings 1`] = `Array []`; + +exports[`modules option case urls (option is true): errors 1`] = `Array []`; + +exports[`modules option case urls (option is true): locals 1`] = ` +Object { + "a": "_a", +} +`; + +exports[`modules option case urls (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + "._a { + background: url(/webpack/public/path/img.png); + background: url(/webpack/public/path/img.png); + background: url(\\"/webpack/public/path/img img.png\\"); + background: url(\\"/webpack/public/path/img img.png\\"); + background: url(/webpack/public/path/img.png); + background: url(/webpack/public/path/img.png#?iefix); + background: url(\\"#hash\\"); + background: url(\\"#\\"); + background: url(data:image/png;base64,AAA); + background: url(http://example.com/image.jpg); + background: url(//example.com/image.png); + background: green url(data:image/png;base64,AAA) url(http://example.com/image.jpg) url(//example.com/image.png) url(/webpack/public/path/img.png) xyz; +} +", + "", + ], +] +`; + +exports[`modules option case urls (option is true): warnings 1`] = `Array []`; + +exports[`modules option case values (option is false): errors 1`] = `Array []`; + +exports[`modules option case values (option is false): locals 1`] = ` +Object { + "aaa": "red", + "bbb": "green", + "ccc": "red", +} +`; + +exports[`modules option case values (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + ".a { + background: red; + background: green; + background: red; +} +", + "", + ], +] +`; + +exports[`modules option case values (option is false): warnings 1`] = `Array []`; + +exports[`modules option case values (option is true): errors 1`] = `Array []`; + +exports[`modules option case values (option is true): locals 1`] = ` +Object { + "a": "_a", + "aaa": "red", + "bbb": "green", + "ccc": "red", +} +`; + +exports[`modules option case values (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + "._a { + background: red; + background: green; + background: red; +} +", + "", + ], +] +`; + +exports[`modules option case values (option is true): warnings 1`] = `Array []`; + +exports[`modules option case values-1 (option is false): errors 1`] = `Array []`; + +exports[`modules option case values-1 (option is false): locals 1`] = ` +Object { + "def": "red", + "ghi": "1px solid black", +} +`; + +exports[`modules option case values-1 (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + " +", + "", + ], +] +`; + +exports[`modules option case values-1 (option is false): warnings 1`] = `Array []`; + +exports[`modules option case values-1 (option is true): errors 1`] = `Array []`; + +exports[`modules option case values-1 (option is true): locals 1`] = ` +Object { + "def": "red", + "ghi": "1px solid black", +} +`; + +exports[`modules option case values-1 (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + " +", + "", + ], +] +`; + +exports[`modules option case values-1 (option is true): warnings 1`] = `Array []`; + +exports[`modules option case values-2 (option is false): errors 1`] = `Array []`; + +exports[`modules option case values-2 (option is false): locals 1`] = ` +Object { + "def": "red", +} +`; + +exports[`modules option case values-2 (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + ".ghi { color: red; } +", + "", + ], +] +`; + +exports[`modules option case values-2 (option is false): warnings 1`] = `Array []`; + +exports[`modules option case values-2 (option is true): errors 1`] = `Array []`; + +exports[`modules option case values-2 (option is true): locals 1`] = ` +Object { + "def": "red", + "ghi": "_ghi", +} +`; + +exports[`modules option case values-2 (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 1, + "._ghi { color: red; } +", + "", + ], +] +`; + +exports[`modules option case values-2 (option is true): warnings 1`] = `Array []`; + +exports[`modules option case values-3 (option is false): errors 1`] = `Array []`; + +exports[`modules option case values-3 (option is false): locals 1`] = ` +Object { + "def": "red", +} +`; + +exports[`modules option case values-3 (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 2, + " +", + "", + ], + Array [ + 1, + ".ghi { color: red; } +", + "", + ], +] +`; + +exports[`modules option case values-3 (option is false): warnings 1`] = `Array []`; + +exports[`modules option case values-3 (option is true): errors 1`] = `Array []`; + +exports[`modules option case values-3 (option is true): locals 1`] = ` +Object { + "def": "red", + "ghi": "_ghi", +} +`; + +exports[`modules option case values-3 (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 2, + " +", + "", + ], + Array [ + 1, + "._ghi { color: red; } +", + "", + ], +] +`; + +exports[`modules option case values-3 (option is true): warnings 1`] = `Array []`; + +exports[`modules option case values-4 (option is false): errors 1`] = `Array []`; + +exports[`modules option case values-4 (option is false): locals 1`] = ` +Object { + "aaa": "red", + "bbb": "green", +} +`; + +exports[`modules option case values-4 (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 2, + " +", + "", + ], + Array [ + 3, + " +", + "", + ], + Array [ + 1, + ".ghi { background: red, green, def; } +", + "", + ], +] +`; + +exports[`modules option case values-4 (option is false): warnings 1`] = `Array []`; + +exports[`modules option case values-4 (option is true): errors 1`] = `Array []`; + +exports[`modules option case values-4 (option is true): locals 1`] = ` +Object { + "aaa": "red", + "bbb": "green", + "ghi": "_ghi", +} +`; + +exports[`modules option case values-4 (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 2, + " +", + "", + ], + Array [ + 3, + " +", + "", + ], + Array [ + 1, + "._ghi { background: red, green, def; } +", + "", + ], +] +`; + +exports[`modules option case values-4 (option is true): warnings 1`] = `Array []`; + +exports[`modules option case values-5 (option is false): errors 1`] = `Array []`; + +exports[`modules option case values-5 (option is false): locals 1`] = ` +Object { + "color": "red", + "shadow": "0 0 red,0 0 red", +} +`; + +exports[`modules option case values-5 (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 2, + " +", + "", + ], + Array [ + 1, + ".ghi { box-shadow: 0 0 red,0 0 red; } +", + "", + ], +] +`; + +exports[`modules option case values-5 (option is false): warnings 1`] = `Array []`; + +exports[`modules option case values-5 (option is true): errors 1`] = `Array []`; + +exports[`modules option case values-5 (option is true): locals 1`] = ` +Object { + "color": "red", + "ghi": "_ghi", + "shadow": "0 0 red,0 0 red", +} +`; + +exports[`modules option case values-5 (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 2, + " +", + "", + ], + Array [ + 1, + "._ghi { box-shadow: 0 0 red,0 0 red; } +", + "", + ], +] +`; + +exports[`modules option case values-5 (option is true): warnings 1`] = `Array []`; + +exports[`modules option case values-6 (option is false): errors 1`] = `Array []`; + +exports[`modules option case values-6 (option is false): locals 1`] = ` +Object { + "color": "red", + "shadow": "0 0 red ,0 0 red", +} +`; + +exports[`modules option case values-6 (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 2, + " +", + "", + ], + Array [ + 1, + ".ghi { box-shadow: 0 0 red ,0 0 red; } +", + "", + ], +] +`; + +exports[`modules option case values-6 (option is false): warnings 1`] = `Array []`; + +exports[`modules option case values-6 (option is true): errors 1`] = `Array []`; + +exports[`modules option case values-6 (option is true): locals 1`] = ` +Object { + "color": "red", + "ghi": "_ghi", + "shadow": "0 0 red ,0 0 red", +} +`; + +exports[`modules option case values-6 (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 2, + " +", + "", + ], + Array [ + 1, + "._ghi { box-shadow: 0 0 red ,0 0 red; } +", + "", + ], +] +`; + +exports[`modules option case values-6 (option is true): warnings 1`] = `Array []`; + +exports[`modules option case values-7 (option is false): errors 1`] = `Array []`; + +exports[`modules option case values-7 (option is false): locals 1`] = ` +Object { + "color": "red", + "shadow": "0 0 red, 0 0 red", +} +`; + +exports[`modules option case values-7 (option is false): module (evaluated) 1`] = ` +Array [ + Array [ + 2, + " +", + "", + ], + Array [ + 1, + ".ghi { box-shadow: 0 0 red, 0 0 red; } +", + "", + ], +] +`; + +exports[`modules option case values-7 (option is false): warnings 1`] = `Array []`; + +exports[`modules option case values-7 (option is true): errors 1`] = `Array []`; + +exports[`modules option case values-7 (option is true): locals 1`] = ` +Object { + "color": "red", + "ghi": "_ghi", + "shadow": "0 0 red, 0 0 red", +} +`; + +exports[`modules option case values-7 (option is true): module (evaluated) 1`] = ` +Array [ + Array [ + 2, + " +", + "", + ], + Array [ + 1, + "._ghi { box-shadow: 0 0 red, 0 0 red; } +", + "", + ], +] +`; + +exports[`modules option case values-7 (option is true): warnings 1`] = `Array []`; diff --git a/test/moduleTestCases/class-names/source.css b/test/fixtures/modules/tests-cases/class-names/source.css similarity index 100% rename from test/moduleTestCases/class-names/source.css rename to test/fixtures/modules/tests-cases/class-names/source.css diff --git a/test/fixtures/modules/tests-cases/comment-in-local/source.css b/test/fixtures/modules/tests-cases/comment-in-local/source.css new file mode 100644 index 00000000..c0f87560 --- /dev/null +++ b/test/fixtures/modules/tests-cases/comment-in-local/source.css @@ -0,0 +1 @@ +:local(.c1/*.c2*/.c3) { background: red; } diff --git a/test/fixtures/modules/tests-cases/comments/img.png b/test/fixtures/modules/tests-cases/comments/img.png new file mode 100644 index 00000000..b74b839e Binary files /dev/null and b/test/fixtures/modules/tests-cases/comments/img.png differ diff --git a/test/moduleTestCases/comments/source.css b/test/fixtures/modules/tests-cases/comments/source.css similarity index 53% rename from test/moduleTestCases/comments/source.css rename to test/fixtures/modules/tests-cases/comments/source.css index 7a0b94f5..085fa70c 100644 --- a/test/moduleTestCases/comments/source.css +++ b/test/fixtures/modules/tests-cases/comments/source.css @@ -3,9 +3,9 @@ */ .bg { - background-image: url(bg.jpg); + background-image: url(./img.png); } /* * a ' below - */ \ No newline at end of file + */ diff --git a/test/fixtures/modules/tests-cases/composes-1/file.css b/test/fixtures/modules/tests-cases/composes-1/file.css new file mode 100644 index 00000000..46865129 --- /dev/null +++ b/test/fixtures/modules/tests-cases/composes-1/file.css @@ -0,0 +1,11 @@ +:local(.c2) { + color: red; +} + +:local(.c4) { + color: blue; +} + +.test{ + c: d +} diff --git a/test/fixtures/modules/tests-cases/composes-1/source.css b/test/fixtures/modules/tests-cases/composes-1/source.css new file mode 100644 index 00000000..1b2e16dd --- /dev/null +++ b/test/fixtures/modules/tests-cases/composes-1/source.css @@ -0,0 +1,3 @@ +:local(.c1) { composes: c2 from "./file.css"; b: 1; } +:local(.c3) { composes: c1; b: 3; } +:local(.c5) { composes: c2 c4 from "./file.css"; b: 5; } diff --git a/test/fixtures/modules/tests-cases/composes-2/file.css b/test/fixtures/modules/tests-cases/composes-2/file.css new file mode 100644 index 00000000..73635f2e --- /dev/null +++ b/test/fixtures/modules/tests-cases/composes-2/file.css @@ -0,0 +1,11 @@ +:local(.c-2) { + color: red; +} + +:local(.c4) { + color: blue; +} + +.test{ + c: d +} diff --git a/test/fixtures/modules/tests-cases/composes-2/source.css b/test/fixtures/modules/tests-cases/composes-2/source.css new file mode 100644 index 00000000..213d023d --- /dev/null +++ b/test/fixtures/modules/tests-cases/composes-2/source.css @@ -0,0 +1,3 @@ +:local(.c1) { composes: c-2 from "./file.css"; b: 1; } +:local(.c3) { composes: c1; b: 3; } +:local(.c5) { composes: c-2 c4 from "./file.css"; b: 5; } diff --git a/test/fixtures/modules/tests-cases/composes-multiple/file1.css b/test/fixtures/modules/tests-cases/composes-multiple/file1.css new file mode 100644 index 00000000..881655a8 --- /dev/null +++ b/test/fixtures/modules/tests-cases/composes-multiple/file1.css @@ -0,0 +1,3 @@ +:local(.def1) { + color: red; +} diff --git a/test/fixtures/modules/tests-cases/composes-multiple/file2.css b/test/fixtures/modules/tests-cases/composes-multiple/file2.css new file mode 100644 index 00000000..6dcbdaf7 --- /dev/null +++ b/test/fixtures/modules/tests-cases/composes-multiple/file2.css @@ -0,0 +1,3 @@ +:local(.def2) { + color: blue; +} diff --git a/test/fixtures/modules/tests-cases/composes-multiple/source.css b/test/fixtures/modules/tests-cases/composes-multiple/source.css new file mode 100644 index 00000000..955e078e --- /dev/null +++ b/test/fixtures/modules/tests-cases/composes-multiple/source.css @@ -0,0 +1,4 @@ +:local(.abc) { + composes: def1 from "./file1.css"; + composes: def2 from "./file2.css"; +} diff --git a/test/fixtures/modules/tests-cases/composes-with-importing/file.css b/test/fixtures/modules/tests-cases/composes-with-importing/file.css new file mode 100644 index 00000000..0101f9c3 --- /dev/null +++ b/test/fixtures/modules/tests-cases/composes-with-importing/file.css @@ -0,0 +1,3 @@ +:local(.def) { + color: red; +} diff --git a/test/fixtures/modules/tests-cases/composes-with-importing/source.css b/test/fixtures/modules/tests-cases/composes-with-importing/source.css new file mode 100644 index 00000000..72156c3a --- /dev/null +++ b/test/fixtures/modules/tests-cases/composes-with-importing/source.css @@ -0,0 +1,3 @@ +:local(.abc) { + composes: def from "./file.css"; +} diff --git a/test/fixtures/modules/tests-cases/composes/source.css b/test/fixtures/modules/tests-cases/composes/source.css new file mode 100644 index 00000000..64a8f521 --- /dev/null +++ b/test/fixtures/modules/tests-cases/composes/source.css @@ -0,0 +1,2 @@ +:local(.c1) { a: 1; } +:local(.c2) { composes: c1; b: 1; } diff --git a/test/moduleTestCases/keyframes-and-animation/source.css b/test/fixtures/modules/tests-cases/keyframes-and-animation/source.css similarity index 100% rename from test/moduleTestCases/keyframes-and-animation/source.css rename to test/fixtures/modules/tests-cases/keyframes-and-animation/source.css diff --git a/test/moduleTestCases/leak-scope/source.css b/test/fixtures/modules/tests-cases/leak-scope/source.css similarity index 100% rename from test/moduleTestCases/leak-scope/source.css rename to test/fixtures/modules/tests-cases/leak-scope/source.css diff --git a/test/fixtures/modules/tests-cases/local-2/source.css b/test/fixtures/modules/tests-cases/local-2/source.css new file mode 100644 index 00000000..c3217975 --- /dev/null +++ b/test/fixtures/modules/tests-cases/local-2/source.css @@ -0,0 +1,4 @@ +:local(.className) { background: red; } +:local(#someId) { background: green; } +:local(.className .subClass) { color: green; } +:local(#someId .subClass) { color: blue; } diff --git a/test/fixtures/modules/tests-cases/local-and-composes/source.css b/test/fixtures/modules/tests-cases/local-and-composes/source.css new file mode 100644 index 00000000..50366086 --- /dev/null +++ b/test/fixtures/modules/tests-cases/local-and-composes/source.css @@ -0,0 +1,7 @@ +:local(.abc) { + color: red; +} +:local(.def) { + composes: abc; + background: green; +} diff --git a/test/fixtures/modules/tests-cases/local-with-string/source.css b/test/fixtures/modules/tests-cases/local-with-string/source.css new file mode 100644 index 00000000..ded020d5 --- /dev/null +++ b/test/fixtures/modules/tests-cases/local-with-string/source.css @@ -0,0 +1,3 @@ +:local(.c1[data-attr=".c2)]'"]:not(.c3):not(.c4)) { + background: red; +} diff --git a/test/fixtures/modules/tests-cases/local/source.css b/test/fixtures/modules/tests-cases/local/source.css new file mode 100644 index 00000000..ca4a0ac5 --- /dev/null +++ b/test/fixtures/modules/tests-cases/local/source.css @@ -0,0 +1,7 @@ +.abc :local(.def) { + color: red; +} + +:local .ghi .jkl { + color: blue; +} diff --git a/test/fixtures/modules/tests-cases/mode-switching/source.css b/test/fixtures/modules/tests-cases/mode-switching/source.css new file mode 100644 index 00000000..71acd66b --- /dev/null +++ b/test/fixtures/modules/tests-cases/mode-switching/source.css @@ -0,0 +1,2 @@ +.c1 :local .c2 .c3 :global .c4 :local .c5, .c6 :local .c7 { background: red; } +.c8 { background: red; } diff --git a/test/moduleTestCases/simple/source.css b/test/fixtures/modules/tests-cases/simple/source.css similarity index 100% rename from test/moduleTestCases/simple/source.css rename to test/fixtures/modules/tests-cases/simple/source.css diff --git a/test/fixtures/modules/tests-cases/urls/img img.png b/test/fixtures/modules/tests-cases/urls/img img.png new file mode 100644 index 00000000..b74b839e Binary files /dev/null and b/test/fixtures/modules/tests-cases/urls/img img.png differ diff --git a/test/fixtures/modules/tests-cases/urls/img.png b/test/fixtures/modules/tests-cases/urls/img.png new file mode 100644 index 00000000..b74b839e Binary files /dev/null and b/test/fixtures/modules/tests-cases/urls/img.png differ diff --git a/test/fixtures/modules/tests-cases/urls/source.css b/test/fixtures/modules/tests-cases/urls/source.css new file mode 100644 index 00000000..38b902fa --- /dev/null +++ b/test/fixtures/modules/tests-cases/urls/source.css @@ -0,0 +1,14 @@ +.a { + background: url(./img.png); + background: url("./img.png"); + background: url("./img img.png"); + background: url('./img img.png'); + background: url('./img.png'); + background: url("./img.png#?iefix"); + background: url("#hash"); + background: url("#"); + background: url(data:image/png;base64,AAA); + background: url(http://example.com/image.jpg); + background: url(//example.com/image.png); + background: green url(data:image/png;base64,AAA) url(http://example.com/image.jpg) url(//example.com/image.png) url(./img.png) xyz; +} diff --git a/test/fixtures/modules/tests-cases/values-1/source.css b/test/fixtures/modules/tests-cases/values-1/source.css new file mode 100644 index 00000000..0c3438f4 --- /dev/null +++ b/test/fixtures/modules/tests-cases/values-1/source.css @@ -0,0 +1,2 @@ +@value def: red; +@value ghi: 1px solid black; diff --git a/test/fixtures/modules/tests-cases/values-2/source.css b/test/fixtures/modules/tests-cases/values-2/source.css new file mode 100644 index 00000000..a5156cb8 --- /dev/null +++ b/test/fixtures/modules/tests-cases/values-2/source.css @@ -0,0 +1,2 @@ +@value def: red; +.ghi { color: def; } diff --git a/test/fixtures/modules/tests-cases/values-3/file.css b/test/fixtures/modules/tests-cases/values-3/file.css new file mode 100644 index 00000000..2b75b778 --- /dev/null +++ b/test/fixtures/modules/tests-cases/values-3/file.css @@ -0,0 +1 @@ +@value def: red; diff --git a/test/fixtures/modules/tests-cases/values-3/source.css b/test/fixtures/modules/tests-cases/values-3/source.css new file mode 100644 index 00000000..47a327b2 --- /dev/null +++ b/test/fixtures/modules/tests-cases/values-3/source.css @@ -0,0 +1,2 @@ +@value def from './file.css'; +.ghi { color: def; } diff --git a/test/fixtures/modules/tests-cases/values-4/file1.css b/test/fixtures/modules/tests-cases/values-4/file1.css new file mode 100644 index 00000000..2b75b778 --- /dev/null +++ b/test/fixtures/modules/tests-cases/values-4/file1.css @@ -0,0 +1 @@ +@value def: red; diff --git a/test/fixtures/modules/tests-cases/values-4/file2.css b/test/fixtures/modules/tests-cases/values-4/file2.css new file mode 100644 index 00000000..f20b297c --- /dev/null +++ b/test/fixtures/modules/tests-cases/values-4/file2.css @@ -0,0 +1 @@ +@value def: green; diff --git a/test/fixtures/modules/tests-cases/values-4/source.css b/test/fixtures/modules/tests-cases/values-4/source.css new file mode 100644 index 00000000..6c990472 --- /dev/null +++ b/test/fixtures/modules/tests-cases/values-4/source.css @@ -0,0 +1,3 @@ +@value def as aaa from './file1.css'; +@value def as bbb from './file2.css'; +.ghi { background: aaa, bbb, def; } diff --git a/test/fixtures/modules/tests-cases/values-5/file1.css b/test/fixtures/modules/tests-cases/values-5/file1.css new file mode 100644 index 00000000..611d2556 --- /dev/null +++ b/test/fixtures/modules/tests-cases/values-5/file1.css @@ -0,0 +1 @@ +@value color: red; diff --git a/test/fixtures/modules/tests-cases/values-5/source.css b/test/fixtures/modules/tests-cases/values-5/source.css new file mode 100644 index 00000000..9b962d33 --- /dev/null +++ b/test/fixtures/modules/tests-cases/values-5/source.css @@ -0,0 +1,3 @@ +@value color from './file1.css'; +@value shadow: 0 0 color,0 0 color; +.ghi { box-shadow: shadow; } diff --git a/test/fixtures/modules/tests-cases/values-6/file1.css b/test/fixtures/modules/tests-cases/values-6/file1.css new file mode 100644 index 00000000..611d2556 --- /dev/null +++ b/test/fixtures/modules/tests-cases/values-6/file1.css @@ -0,0 +1 @@ +@value color: red; diff --git a/test/fixtures/modules/tests-cases/values-6/source.css b/test/fixtures/modules/tests-cases/values-6/source.css new file mode 100644 index 00000000..08fb42fd --- /dev/null +++ b/test/fixtures/modules/tests-cases/values-6/source.css @@ -0,0 +1,3 @@ +@value color from './file1.css'; +@value shadow: 0 0 color ,0 0 color; +.ghi { box-shadow: shadow; } diff --git a/test/fixtures/modules/tests-cases/values-7/file1.css b/test/fixtures/modules/tests-cases/values-7/file1.css new file mode 100644 index 00000000..611d2556 --- /dev/null +++ b/test/fixtures/modules/tests-cases/values-7/file1.css @@ -0,0 +1 @@ +@value color: red; diff --git a/test/fixtures/modules/tests-cases/values-7/source.css b/test/fixtures/modules/tests-cases/values-7/source.css new file mode 100644 index 00000000..99d9274b --- /dev/null +++ b/test/fixtures/modules/tests-cases/values-7/source.css @@ -0,0 +1,3 @@ +@value color from './file1.css'; +@value shadow: 0 0 color, 0 0 color; +.ghi { box-shadow: shadow; } diff --git a/test/moduleTestCases/values/source.css b/test/fixtures/modules/tests-cases/values/source.css similarity index 100% rename from test/moduleTestCases/values/source.css rename to test/fixtures/modules/tests-cases/values/source.css diff --git a/test/helpers.js b/test/helpers.js index a653a9d8..03dfe658 100644 --- a/test/helpers.js +++ b/test/helpers.js @@ -38,6 +38,17 @@ function evaluated(output, modules, moduleId = 1) { 'import/node_modules', 'url', 'url/node_modules', + 'modules/tests-cases/urls', + 'modules/tests-cases/comments', + 'modules/tests-cases/values-3', + 'modules/tests-cases/values-4', + 'modules/tests-cases/values-5', + 'modules/tests-cases/values-6', + 'modules/tests-cases/values-7', + 'modules/tests-cases/composes-1', + 'modules/tests-cases/composes-2', + 'modules/tests-cases/composes-multiple', + 'modules/tests-cases/composes-with-importing', ].map((importedPath) => path.resolve(__dirname, `./fixtures/${importedPath}`, module) ); diff --git a/test/local.test.js b/test/local.test.js deleted file mode 100644 index fe0ef585..00000000 --- a/test/local.test.js +++ /dev/null @@ -1,320 +0,0 @@ -const { test } = require('./helpers'); - -function testLocal(name, input, result, localsResult, query, modules) { - // eslint-disable-next-line no-param-reassign - result.locals = localsResult; - test(name, input, result, query, modules); -} - -describe('local', () => { - testLocal( - 'locals-format', - ':local(.test) { background: red; }', - [[1, '.test-2_pBx { background: red; }', '']], - { - test: 'test-2_pBx', - }, - '?localIdentName=[local]-[hash:base64:5]' - ); - testLocal( - 'locals', - ':local(.className) { background: red; }\n:local(#someId) { background: green; }\n' + - ':local(.className .subClass) { color: green; }\n:local(#someId .subClass) { color: blue; }', - [ - [ - 1, - '._23J0282swY7bwvI2X4fHiV { background: red; }\n#_3vpqN0v_IxlO3TzQjbpB33 { background: green; }\n' + - '._23J0282swY7bwvI2X4fHiV ._1s1VsToXFz17cPAltMg7jz { color: green; }\n#_3vpqN0v_IxlO3TzQjbpB33 ._1s1VsToXFz17cPAltMg7jz { color: blue; }', - '', - ], - ], - { - className: '_23J0282swY7bwvI2X4fHiV', - someId: '_3vpqN0v_IxlO3TzQjbpB33', - subClass: '_1s1VsToXFz17cPAltMg7jz', - } - ); - testLocal( - 'mode switching', - '.c1 :local .c2 .c3 :global .c4 :local .c5, .c6 :local .c7 { background: red; }\n.c8 { background: red; }', - [ - [ - 1, - '.c1 ._c2 ._c3 .c4 ._c5, .c6 ._c7 { background: red; }\n.c8 { background: red; }', - '', - ], - ], - { - c2: '_c2', - c3: '_c3', - c5: '_c5', - c7: '_c7', - }, - '?localIdentName=_[local]' - ); - testLocal( - 'comment in local', - ':local(.c1/*.c2*/.c3) { background: red; }', - [[1, '._c1/*.c2*/._c3 { background: red; }', '']], - { - c1: '_c1', - c3: '_c3', - }, - '?localIdentName=_[local]' - ); - testLocal( - 'comment in local', - ':local(.c1/*.c2*/.c3) { background: red; }', - [[1, '._c1/*.c2*/._c3 { background: red; }', '']], - { - c1: '_c1', - c3: '_c3', - }, - '?localIdentName=_[local]' - ); - testLocal( - 'strings in local', - ':local(.c1[data-attr=".c2)]\'"]:not(.c3):not(.c4)) { background: red; }', - [ - [ - 1, - '._c1[data-attr=".c2)]\'"]:not(._c3):not(._c4) { background: red; }', - '', - ], - ], - { - c1: '_c1', - c3: '_c3', - c4: '_c4', - }, - '?localIdentName=_[local]' - ); - - testLocal( - 'composes class simple', - ':local(.c1) { a: 1; }\n:local(.c2) { composes: c1; b: 1; }', - [[1, '._c1 { a: 1; }\n._c2 { b: 1; }', '']], - { - c1: '_c1', - c2: '_c2 _c1', - }, - '?localIdentName=_[local]' - ); - testLocal( - 'composes class from module', - [ - ':local(.c1) { composes: c2 from "./module"; b: 1; }', - ':local(.c3) { composes: c1; b: 3; }', - ':local(.c5) { composes: c2 c4 from "./module"; b: 5; }', - ].join('\n'), - [ - [2, '.test{c: d}', ''], - [ - 1, - ['._c1 { b: 1; }', '._c3 { b: 3; }', '._c5 { b: 5; }'].join('\n'), - '', - ], - ], - { - c1: '_c1 imported-c2', - c3: '_c3 _c1 imported-c2', - c5: '_c5 imported-c2 imported-c4', - }, - '?localIdentName=_[local]', - { - './module': (() => { - const r = [[2, '.test{c: d}', '']]; - r.locals = { - c2: 'imported-c2', - c4: 'imported-c4', - }; - return r; - })(), - } - ); - testLocal( - 'composes class with hyphen from module', - [ - ':local(.c1) { composes: c-2 from "./module"; b: 1; }', - ':local(.c3) { composes: c1; b: 3; }', - ':local(.c5) { composes: c-2 c4 from "./module"; b: 5; }', - ].join('\n'), - [ - [2, '.test{c: d}', ''], - [ - 1, - ['._c1 { b: 1; }', '._c3 { b: 3; }', '._c5 { b: 5; }'].join('\n'), - '', - ], - ], - { - c1: '_c1 imported-c-2', - c3: '_c3 _c1 imported-c-2', - c5: '_c5 imported-c-2 imported-c4', - }, - '?localIdentName=_[local]', - { - './module': (() => { - const r = [[2, '.test{c: d}', '']]; - r.locals = { - 'c-2': 'imported-c-2', - c4: 'imported-c4', - }; - return r; - })(), - } - ); - testLocal( - 'composes class from module with import', - [ - '@import url("module");', - ':local(.c1) { composes: c2 c3 from "./module"; composes: c4 from "./module"; b: 1; }', - ].join('\n'), - [[2, '.test{c: d}', ''], [1, '._c1 { b: 1; }', '']], - { - c1: '_c1 imported-c2 imported-c3 imported-c4', - }, - '?localIdentName=_[local]', - { - './module': (() => { - const r = [[2, '.test{c: d}', '']]; - r.locals = { - c2: 'imported-c2', - c3: 'imported-c3', - c4: 'imported-c4', - }; - return r; - })(), - } - ); - testLocal( - 'module mode', - ".className { background: url(./file.png); }\n#someId { background: url('module/file.jpg'); }\n" + - '.className .subClass { font-size: 5.5pt; }\n#someId .subClass { color: blue; }', - [ - [ - 1, - '._23J0282swY7bwvI2X4fHiV { background: url({./file.png}); }\n#_3vpqN0v_IxlO3TzQjbpB33 { background: url({module/file.jpg}); }\n' + - '._23J0282swY7bwvI2X4fHiV ._1s1VsToXFz17cPAltMg7jz { font-size: 5.5pt; }\n#_3vpqN0v_IxlO3TzQjbpB33 ._1s1VsToXFz17cPAltMg7jz { color: blue; }', - '', - ], - ], - { - className: '_23J0282swY7bwvI2X4fHiV', - someId: '_3vpqN0v_IxlO3TzQjbpB33', - subClass: '_1s1VsToXFz17cPAltMg7jz', - }, - '?modules' - ); - testLocal( - 'class name parsing', - '.-a0-34a___f { color: red; }', - [[1, '._3ZMCqVa1XidxdqbX65hZ5D { color: red; }', '']], - { - '-a0-34a___f': '_3ZMCqVa1XidxdqbX65hZ5D', - }, - '?modules' - ); - testLocal( - 'imported values in decl', - '.className { color: IMPORTED_NAME; }\n' + - ':import("./vars.css") { IMPORTED_NAME: primary-color; }', - [[1, '._className { color: red; }', '']], - { - className: '_className', - }, - '?modules&localIdentName=_[local]', - { - './vars.css': { - locals: { - 'primary-color': 'red', - }, - }, - } - ); - testLocal( - 'issue-109', - '.bar-1 { color: red; }', - [[1, '.file--bar-1--2JvfJ { color: red; }', '']], - { - 'bar-1': 'file--bar-1--2JvfJ', - }, - '?modules&importLoaders=1&localIdentName=[name]--[local]--[hash:base64:5]' - ); - testLocal( - 'path naming', - '.bar { color: red; }', - [[1, '.path-to--file--bar { color: red; }', '']], - { - bar: 'path-to--file--bar', - }, - { - query: '?modules&localIdentName=[path]-[name]--[local]', - resourcePath: '/root/path/to/file.css', - options: { - context: '/root/', - }, - } - ); - testLocal( - 'path naming with context', - '.bar { color: red; }', - [[1, '.to--file--bar { color: red; }', '']], - { - bar: 'to--file--bar', - }, - { - query: - '?modules&localIdentName=[path]-[name]--[local]&context=/root/path', - resourcePath: '/root/path/to/file.css', - options: { - context: '/root/', - }, - } - ); - testLocal( - 'hash prefix', - '.bar { color: red; }', - [[1, '.bar--58a3b08b9195a6af0de7431eaf3427c7 { color: red; }', '']], - { - bar: 'bar--58a3b08b9195a6af0de7431eaf3427c7', - }, - '?modules&localIdentName=[local]--[hash]&hashPrefix=x' - ); - testLocal( - 'prefixes leading digit with underscore', - ':local(.test) { background: red; }', - [[1, '._1test { background: red; }', '']], - { - test: '_1test', - }, - '?localIdentName=1[local]' - ); - testLocal( - 'prefixes leading hyphen + digit with underscore', - ':local(.test) { background: red; }', - [[1, '._-1test { background: red; }', '']], - { - test: '_-1test', - }, - '?localIdentName=-1[local]' - ); - testLocal( - 'prefixes two leading hyphens with underscore', - ':local(.test) { background: red; }', - [[1, '._--test { background: red; }', '']], - { - test: '_--test', - }, - '?localIdentName=--[local]' - ); - testLocal( - 'saves underscore prefix in exported class names', - ':export { _test: _test }', - [[1, '', '']], - { - _test: '_test', - }, - '?localIdentName=[local]' - ); -}); diff --git a/test/locals.test.js b/test/localsLoader.test.js similarity index 100% rename from test/locals.test.js rename to test/localsLoader.test.js diff --git a/test/module.test.js b/test/module.test.js deleted file mode 100644 index eb654b77..00000000 --- a/test/module.test.js +++ /dev/null @@ -1,22 +0,0 @@ -const path = require('path'); -const fs = require('fs'); - -const test = require('./helpers').testSingleItem; - -const testCasesPath = path.join(__dirname, 'moduleTestCases'); -const testCases = fs.readdirSync(testCasesPath); - -describe('module', () => { - testCases.forEach((name) => { - const source = fs.readFileSync( - path.join(testCasesPath, name, 'source.css'), - 'utf-8' - ); - const expected = fs.readFileSync( - path.join(testCasesPath, name, 'expected.css'), - 'utf-8' - ); - - test(name, source, expected, '?modules&sourceMap&localIdentName=_[local]_'); - }); -}); diff --git a/test/moduleTestCases/class-names/expected.css b/test/moduleTestCases/class-names/expected.css deleted file mode 100644 index 695a9dc3..00000000 --- a/test/moduleTestCases/class-names/expected.css +++ /dev/null @@ -1,3 +0,0 @@ -._class-1_, ._class-10_ ._bar-1_ { - color: green; -} diff --git a/test/moduleTestCases/comments/expected.css b/test/moduleTestCases/comments/expected.css deleted file mode 100644 index 4c9a35f3..00000000 --- a/test/moduleTestCases/comments/expected.css +++ /dev/null @@ -1,11 +0,0 @@ -/* - * a ' above - */ - -._bg_ { - background-image: url({bg.jpg}); -} - -/* - * a ' below - */ \ No newline at end of file diff --git a/test/moduleTestCases/keyframes-and-animation/expected.css b/test/moduleTestCases/keyframes-and-animation/expected.css deleted file mode 100644 index fa04fb27..00000000 --- a/test/moduleTestCases/keyframes-and-animation/expected.css +++ /dev/null @@ -1,48 +0,0 @@ -._a_ { - color: green; -} - -@keyframes _bounce_ { - 0% { - transform: translateY(-100%); - opacity: 0; - } - 5% { - transform: translateY(-100%); - opacity: 0; - } -} - -@-webkit-keyframes _bounce2_ { - 0% { - transform: translateY(-100%); - opacity: 0; - } - 5% { - transform: translateY(-100%); - opacity: 0; - } -} - -._bounce_ { - animation-name: _bounce_; - animation: _bounce2_ 1s ease; -} - -._bounce2_ { - color: green; - animation: _bounce_ 1s ease; - animation-name: _bounce2_; -} - -._bounce3_ { - animation: _bounce_ 1s ease, _bounce2_ -} - -._bounce4_ { - animation: _bounce_ 1s ease, _bounce2_; -} - -._b_ { - color: green; -} diff --git a/test/moduleTestCases/leak-scope/expected.css b/test/moduleTestCases/leak-scope/expected.css deleted file mode 100644 index 2d72df97..00000000 --- a/test/moduleTestCases/leak-scope/expected.css +++ /dev/null @@ -1,37 +0,0 @@ -._a_ { - color: green; - animation: _a_; -} - -@keyframes _b_ { - 0% { left: 10px; } - 100% { left: 20px; } -} - -._b_ { - animation: _b_; -} - -@keyframes c { - 0% { left: 10px; } - 100% { left: 20px; } -} - -._c_ { - animation: _c1_; - animation: _c2_, _c3_, _c4_; -} - -@keyframes d { - 0% { left: 10px; } - 100% { left: 20px; } -} - -.d1 { - animation: d1; - animation: d2, d3, d4; -} - -.d2 { - animation: _d2_; -} diff --git a/test/moduleTestCases/simple/expected.css b/test/moduleTestCases/simple/expected.css deleted file mode 100644 index 3f3a1c9d..00000000 --- a/test/moduleTestCases/simple/expected.css +++ /dev/null @@ -1,11 +0,0 @@ -._a_ ._b_, ._c_ ._d_, #_id_ { - color: green; - font-size: 1.5pt; -} -a[href="#b.c"]._x_._y_ { - color: green; - font-size: 1.5pt; -} -@keyframes _z_ { - 2.5% {color: green;} -} diff --git a/test/moduleTestCases/urls/expected.css b/test/moduleTestCases/urls/expected.css deleted file mode 100644 index 9578f0ba..00000000 --- a/test/moduleTestCases/urls/expected.css +++ /dev/null @@ -1,14 +0,0 @@ -._a_ { - background: url({./module}); - background: url({./module}); - background: url("{./module module}"); - background: url("{./module module}"); - background: url({./module}); - background: url({./module}#?iefix); - background: url("#hash"); - background: url("#"); - background: url(data:image/png;base64,AAA); - background: url(http://example.com/image.jpg); - background: url(//example.com/image.png); - background: green url(data:image/png;base64,AAA) url(http://example.com/image.jpg) url(//example.com/image.png) url({./module}) xyz; -} diff --git a/test/moduleTestCases/urls/source.css b/test/moduleTestCases/urls/source.css deleted file mode 100644 index 1c58afe7..00000000 --- a/test/moduleTestCases/urls/source.css +++ /dev/null @@ -1,14 +0,0 @@ -.a { - background: url(./module); - background: url("./module"); - background: url("./module module"); - background: url('./module module'); - background: url('./module'); - background: url("./module#?iefix"); - background: url("#hash"); - background: url("#"); - background: url(data:image/png;base64,AAA); - background: url(http://example.com/image.jpg); - background: url(//example.com/image.png); - background: green url(data:image/png;base64,AAA) url(http://example.com/image.jpg) url(//example.com/image.png) url(./module) xyz; -} diff --git a/test/moduleTestCases/values/expected.css b/test/moduleTestCases/values/expected.css deleted file mode 100644 index ad85f81a..00000000 --- a/test/moduleTestCases/values/expected.css +++ /dev/null @@ -1,5 +0,0 @@ -._a_ { - background: red; - background: green; - background: red; -} diff --git a/test/modules-option.test.js b/test/modules-option.test.js new file mode 100644 index 00000000..4a47f93b --- /dev/null +++ b/test/modules-option.test.js @@ -0,0 +1,33 @@ +const path = require('path'); +const fs = require('fs'); + +const { webpack, evaluated } = require('./helpers'); + +const testCasesPath = path.join(__dirname, 'fixtures/modules/tests-cases'); +const testCases = fs.readdirSync(testCasesPath); + +describe('modules option', () => { + [true, false].forEach((optionValue) => { + testCases.forEach((name) => { + it(`case ${name} (option is ${optionValue})`, async () => { + const config = { + loader: { + options: { modules: optionValue, localIdentName: '_[local]' }, + }, + }; + const testId = `./modules/tests-cases/${name}/source.css`; + const stats = await webpack(testId, config); + const { modules } = stats.toJson(); + const module = modules.find((m) => m.id === testId); + const evaluatedModule = evaluated(module.source, modules); + + // console.log(module) + + expect(evaluatedModule).toMatchSnapshot('module (evaluated)'); + expect(evaluatedModule.locals).toMatchSnapshot('locals'); + expect(stats.compilation.warnings).toMatchSnapshot('warnings'); + expect(stats.compilation.errors).toMatchSnapshot('errors'); + }); + }); + }); +}); diff --git a/test/values.test.js b/test/values.test.js deleted file mode 100644 index 187c94ce..00000000 --- a/test/values.test.js +++ /dev/null @@ -1,133 +0,0 @@ -const { testLocals, test } = require('./helpers'); - -function testLocal(name, input, result, localsResult, query, modules) { - // eslint-disable-next-line no-param-reassign - result.locals = localsResult; - test(name, input, result, query, modules); -} - -describe('values', () => { - testLocals( - 'should export values', - '@value def: red; @value ghi: 1px solid black', - { - def: 'red', - ghi: '1px solid black', - }, - '' - ); - testLocals( - 'should export values and locals', - '@value def: red; .ghi { color: def; }', - { - def: 'red', - ghi: '_ghi', - }, - '?modules&localIdentName=_[local]' - ); - testLocal( - 'should import values from other module', - "@value def from './file'; .ghi { color: def; }", - [[2, '', ''], [1, '.ghi { color: red; }', '']], - { - def: 'red', - }, - '', - { - './file': (() => { - const a = [[2, '', '']]; - a.locals = { - def: 'red', - }; - return a; - })(), - } - ); - testLocal( - 'should import values with renaming', - "@value def as aaa from './file1'; @value def as bbb from './file2'; .ghi { background: aaa, bbb, def; }", - [ - [2, '', ''], - [3, '', ''], - [1, '.ghi { background: red, green, def; }', ''], - ], - { - aaa: 'red', - bbb: 'green', - }, - '', - { - './file1': (() => { - const a = [[2, '', '']]; - a.locals = { - def: 'red', - }; - return a; - })(), - './file2': (() => { - const a = [[3, '', '']]; - a.locals = { - def: 'green', - }; - return a; - })(), - } - ); - testLocal( - 'should import values contain comma', - "@value color from './file1'; @value shadow: 0 0 color,0 0 color; .ghi { box-shadow: shadow; }", - [[2, '', ''], [1, '.ghi { box-shadow: 0 0 red,0 0 red; }', '']], - { - color: 'red', - shadow: '0 0 red,0 0 red', - }, - '', - { - './file1': (() => { - const a = [[2, '', '']]; - a.locals = { - color: 'red', - }; - return a; - })(), - } - ); - testLocal( - 'should import values contain comma and space before comma', - "@value color from './file1'; @value shadow: 0 0 color ,0 0 color; .ghi { box-shadow: shadow; }", - [[2, '', ''], [1, '.ghi { box-shadow: 0 0 red ,0 0 red; }', '']], - { - color: 'red', - shadow: '0 0 red ,0 0 red', - }, - '', - { - './file1': (() => { - const a = [[2, '', '']]; - a.locals = { - color: 'red', - }; - return a; - })(), - } - ); - testLocal( - 'should import values contain tralling comma and space after comma', - "@value color from './file1'; @value shadow: 0 0 color, 0 0 color; .ghi { box-shadow: shadow; }", - [[2, '', ''], [1, '.ghi { box-shadow: 0 0 red, 0 0 red; }', '']], - { - color: 'red', - shadow: '0 0 red, 0 0 red', - }, - '', - { - './file1': (() => { - const a = [[2, '', '']]; - a.locals = { - color: 'red', - }; - return a; - })(), - } - ); -});