From 639ac563ac959521dada270dfe4065b4226fe783 Mon Sep 17 00:00:00 2001 From: evilebottnawi Date: Wed, 25 Dec 2019 21:30:17 +0300 Subject: [PATCH 1/5] test: contenthash --- test/__snapshots__/loader.test.js.snap | 30 +++++ test/fixtures/contenthash/basic-css.js | 5 + test/fixtures/contenthash/basic-postcss.js | 5 + test/fixtures/contenthash/basic-sass.js | 5 + test/fixtures/contenthash/basic.css | 3 + test/fixtures/contenthash/basic.postcss.css | 7 ++ test/fixtures/contenthash/basic.scss | 9 ++ test/loader.test.js | 129 ++++++++++++++++++++ 8 files changed, 193 insertions(+) create mode 100644 test/fixtures/contenthash/basic-css.js create mode 100644 test/fixtures/contenthash/basic-postcss.js create mode 100644 test/fixtures/contenthash/basic-sass.js create mode 100644 test/fixtures/contenthash/basic.css create mode 100644 test/fixtures/contenthash/basic.postcss.css create mode 100644 test/fixtures/contenthash/basic.scss diff --git a/test/__snapshots__/loader.test.js.snap b/test/__snapshots__/loader.test.js.snap index ef5ed1b2..5ec0987b 100644 --- a/test/__snapshots__/loader.test.js.snap +++ b/test/__snapshots__/loader.test.js.snap @@ -1,5 +1,35 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP +exports[`loader should have same "contenthash" with "css-loader" and source maps: errors 1`] = `Array []`; + +exports[`loader should have same "contenthash" with "css-loader" and source maps: module 1`] = ` +Array [ + "main.54b9712c1981e48c12c4.bundle.js", +] +`; + +exports[`loader should have same "contenthash" with "css-loader" and source maps: warnings 1`] = `Array []`; + +exports[`loader should have same "contenthash" with "postcss-loader" and source maps: errors 1`] = `Array []`; + +exports[`loader should have same "contenthash" with "postcss-loader" and source maps: module 1`] = ` +Array [ + "main.d77dd6564bc6e6297cd4.bundle.js", +] +`; + +exports[`loader should have same "contenthash" with "postcss-loader" and source maps: warnings 1`] = `Array []`; + +exports[`loader should have same "contenthash" with "sass-loader" and source maps: errors 1`] = `Array []`; + +exports[`loader should have same "contenthash" with "sass-loader" and source maps: module 1`] = ` +Array [ + "main.151589c7e12ebfd445e7.bundle.js", +] +`; + +exports[`loader should have same "contenthash" with "sass-loader" and source maps: warnings 1`] = `Array []`; + exports[`loader should reuse \`ast\` from "postcss-loader": errors 1`] = `Array []`; exports[`loader should reuse \`ast\` from "postcss-loader": module 1`] = ` diff --git a/test/fixtures/contenthash/basic-css.js b/test/fixtures/contenthash/basic-css.js new file mode 100644 index 00000000..72afb950 --- /dev/null +++ b/test/fixtures/contenthash/basic-css.js @@ -0,0 +1,5 @@ +import css from './basic.css'; + +__export__ = css; + +export default css; diff --git a/test/fixtures/contenthash/basic-postcss.js b/test/fixtures/contenthash/basic-postcss.js new file mode 100644 index 00000000..ff2b03ea --- /dev/null +++ b/test/fixtures/contenthash/basic-postcss.js @@ -0,0 +1,5 @@ +import css from './basic.postcss.css'; + +__export__ = css; + +export default css; diff --git a/test/fixtures/contenthash/basic-sass.js b/test/fixtures/contenthash/basic-sass.js new file mode 100644 index 00000000..68ce09f0 --- /dev/null +++ b/test/fixtures/contenthash/basic-sass.js @@ -0,0 +1,5 @@ +import css from './basic.scss'; + +__export__ = css; + +export default css; diff --git a/test/fixtures/contenthash/basic.css b/test/fixtures/contenthash/basic.css new file mode 100644 index 00000000..fdece7b4 --- /dev/null +++ b/test/fixtures/contenthash/basic.css @@ -0,0 +1,3 @@ +a { + color: red; +} diff --git a/test/fixtures/contenthash/basic.postcss.css b/test/fixtures/contenthash/basic.postcss.css new file mode 100644 index 00000000..3223fac4 --- /dev/null +++ b/test/fixtures/contenthash/basic.postcss.css @@ -0,0 +1,7 @@ +a { + color: rgb(0 0 100% / 90%); + + &:hover { + color: rebeccapurple; + } +} diff --git a/test/fixtures/contenthash/basic.scss b/test/fixtures/contenthash/basic.scss new file mode 100644 index 00000000..ae47c032 --- /dev/null +++ b/test/fixtures/contenthash/basic.scss @@ -0,0 +1,9 @@ +$var: red; + +a { + color: $var; + + &:hover { + color: $var; + } +} diff --git a/test/loader.test.js b/test/loader.test.js index 68741413..2da97263 100644 --- a/test/loader.test.js +++ b/test/loader.test.js @@ -308,4 +308,133 @@ describe('loader', () => { expect(getWarnings(stats)).toMatchSnapshot('warnings'); expect(getErrors(stats)).toMatchSnapshot('errors'); }); + + it('should have same "contenthash" with "css-loader" and source maps', async () => { + const compiler = getCompiler( + './contenthash/basic-css.js', + {}, + { + output: { + path: path.resolve(__dirname, '../outputs'), + filename: '[name].[contenthash].bundle.js', + chunkFilename: '[name].[contenthash].chunk.js', + publicPath: '/webpack/public/path/', + }, + module: { + rules: [ + { + test: /\.css$/i, + rules: [ + { + loader: path.resolve(__dirname, '../src'), + options: { sourceMap: true }, + }, + ], + }, + ], + }, + } + ); + const stats = await compile(compiler); + + expect(Object.keys(stats.compilation.assets)).toMatchSnapshot('module'); + expect(getWarnings(stats)).toMatchSnapshot('warnings'); + expect(getErrors(stats)).toMatchSnapshot('errors'); + }); + + it('should have same "contenthash" with "postcss-loader" and source maps', async () => { + const compiler = getCompiler( + './contenthash/basic-postcss.js', + {}, + { + output: { + path: path.resolve(__dirname, '../outputs'), + filename: '[name].[contenthash].bundle.js', + chunkFilename: '[name].[contenthash].chunk.js', + publicPath: '/webpack/public/path/', + }, + module: { + rules: [ + { + test: /\.css$/i, + rules: [ + { + loader: path.resolve(__dirname, '../src'), + options: { + sourceMap: true, + importLoaders: 1, + }, + }, + { + loader: 'postcss-loader', + options: { + plugins: () => [postcssPresetEnv({ stage: 0 })], + sourceMap: true, + }, + }, + ], + }, + ], + }, + } + ); + const stats = await compile(compiler); + + expect(Object.keys(stats.compilation.assets)).toMatchSnapshot('module'); + expect(getWarnings(stats)).toMatchSnapshot('warnings'); + expect(getErrors(stats)).toMatchSnapshot('errors'); + }); + + it('should have same "contenthash" with "sass-loader" and source maps', async () => { + const compiler = getCompiler( + './contenthash/basic-sass.js', + {}, + { + output: { + path: path.resolve(__dirname, '../outputs'), + filename: '[name].[contenthash].bundle.js', + chunkFilename: '[name].[contenthash].chunk.js', + publicPath: '/webpack/public/path/', + }, + module: { + rules: [ + { + test: /\.s[ca]ss$/i, + rules: [ + { + loader: path.resolve(__dirname, '../src'), + options: { + sourceMap: true, + importLoaders: 1, + }, + }, + { + loader: 'postcss-loader', + options: { + plugins: () => [postcssPresetEnv({ stage: 0 })], + sourceMap: true, + }, + }, + { + loader: 'sass-loader', + options: { + // eslint-disable-next-line global-require + implementation: require('sass'), + sourceMap: true, + }, + }, + ], + }, + ], + }, + } + ); + const stats = await compile(compiler); + + console.log(stats.compilation.assets); + + expect(Object.keys(stats.compilation.assets)).toMatchSnapshot('module'); + expect(getWarnings(stats)).toMatchSnapshot('warnings'); + expect(getErrors(stats)).toMatchSnapshot('errors'); + }); }); From b5e011bfabb10e173e76a6fef41e59a16e97c91b Mon Sep 17 00:00:00 2001 From: evilebottnawi Date: Thu, 26 Dec 2019 17:40:09 +0300 Subject: [PATCH 2/5] test: check --- src/index.js | 9 +- src/utils.js | 15 +- test/__snapshots__/loader.test.js.snap | 715 +------------------------ test/loader.test.js | 135 ++++- 4 files changed, 171 insertions(+), 703 deletions(-) diff --git a/src/index.js b/src/index.js index b4d7c311..8729e4b3 100644 --- a/src/index.js +++ b/src/index.js @@ -3,6 +3,7 @@ Author Tobias Koppers @sokra */ import validateOptions from 'schema-utils'; +import RequestShortener from 'webpack/lib/RequestShortener'; import postcss from 'postcss'; import postcssPkg from 'postcss/package.json'; @@ -76,7 +77,13 @@ export default function loader(content, map, meta) { map: options.sourceMap ? { // Some loaders (example `"postcss-loader": "1.x.x"`) always generates source map, we should remove it - prev: sourceMap && map ? normalizeSourceMap(map) : null, + prev: + sourceMap && map + ? normalizeSourceMap( + map, + new RequestShortener(this.rootContext) + ) + : null, inline: false, annotation: false, } diff --git a/src/utils.js b/src/utils.js index c5b00d10..b9b8df59 100644 --- a/src/utils.js +++ b/src/utils.js @@ -156,30 +156,35 @@ function getModulesPlugins(options, loaderContext) { ]; } -function normalizeSourceMap(map) { +function normalizeSourceMap(map, requestShortener) { let newMap = map; // Some loader emit source map as string - // Strip any JSON XSSI avoidance prefix from the string (as documented in the source maps specification), and then parse the string as JSON. if (typeof newMap === 'string') { newMap = JSON.parse(newMap); } + console.log(newMap); + // Source maps should use forward slash because it is URLs (https://github.com/mozilla/source-map/issues/91) // We should normalize path because previous loaders like `sass-loader` using backslash when generate source map if (newMap.file) { - newMap.file = normalizePath(newMap.file); + newMap.file = requestShortener.shorten(newMap.file); } if (newMap.sourceRoot) { - newMap.sourceRoot = normalizePath(newMap.sourceRoot); + newMap.sourceRoot = requestShortener.shorten(newMap.sourceRoot); } if (newMap.sources) { - newMap.sources = newMap.sources.map((source) => normalizePath(source)); + newMap.sources = newMap.sources.map((source) => + requestShortener.shorten(source) + ); } + console.log(newMap); + return newMap; } diff --git a/test/__snapshots__/loader.test.js.snap b/test/__snapshots__/loader.test.js.snap index 5ec0987b..160d7a38 100644 --- a/test/__snapshots__/loader.test.js.snap +++ b/test/__snapshots__/loader.test.js.snap @@ -1,730 +1,61 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`loader should have same "contenthash" with "css-loader" and source maps: errors 1`] = `Array []`; +exports[`loader should have same "contenthash" with "css-loader" and with source maps: errors 1`] = `Array []`; -exports[`loader should have same "contenthash" with "css-loader" and source maps: module 1`] = ` +exports[`loader should have same "contenthash" with "css-loader" and with source maps: module 1`] = ` Array [ "main.54b9712c1981e48c12c4.bundle.js", ] `; -exports[`loader should have same "contenthash" with "css-loader" and source maps: warnings 1`] = `Array []`; +exports[`loader should have same "contenthash" with "css-loader" and with source maps: warnings 1`] = `Array []`; -exports[`loader should have same "contenthash" with "postcss-loader" and source maps: errors 1`] = `Array []`; +exports[`loader should have same "contenthash" with "css-loader" and without source maps: errors 1`] = `Array []`; -exports[`loader should have same "contenthash" with "postcss-loader" and source maps: module 1`] = ` +exports[`loader should have same "contenthash" with "css-loader" and without source maps: module 1`] = ` Array [ - "main.d77dd6564bc6e6297cd4.bundle.js", -] -`; - -exports[`loader should have same "contenthash" with "postcss-loader" and source maps: warnings 1`] = `Array []`; - -exports[`loader should have same "contenthash" with "sass-loader" and source maps: errors 1`] = `Array []`; - -exports[`loader should have same "contenthash" with "sass-loader" and source maps: module 1`] = ` -Array [ - "main.151589c7e12ebfd445e7.bundle.js", -] -`; - -exports[`loader should have same "contenthash" with "sass-loader" and source maps: warnings 1`] = `Array []`; - -exports[`loader should reuse \`ast\` from "postcss-loader": errors 1`] = `Array []`; - -exports[`loader should reuse \`ast\` from "postcss-loader": module 1`] = ` -"// Imports -var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../src/runtime/api.js\\"); -var ___CSS_LOADER_GET_URL_IMPORT___ = require(\\"../../../src/runtime/getUrl.js\\"); -var ___CSS_LOADER_URL_IMPORT_0___ = require(\\"./img1x.png\\"); -var ___CSS_LOADER_URL_IMPORT_1___ = require(\\"./img2x.png\\"); -exports = ___CSS_LOADER_API_IMPORT___(false); -var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___); -var ___CSS_LOADER_URL_REPLACEMENT_1___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_1___); -// Module -exports.push([module.id, \\":root {\\\\n --fontSize: 1rem;\\\\n --mainColor: rgba(18,52,86,0.47059);\\\\n --secondaryColor: rgba(102, 51, 153, 0.9);\\\\n}\\\\n\\\\nhtml {\\\\n overflow-x: hidden;\\\\n overflow-y: auto;\\\\n overflow: hidden auto;\\\\n}\\\\n\\\\n@media (max-width: 50rem) {\\\\n body {\\\\n color: rgba(18,52,86,0.47059);\\\\n color: var(--mainColor);\\\\n font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif;\\\\n font-size: 1rem;\\\\n font-size: var(--fontSize);\\\\n line-height: calc(1rem * 1.5);\\\\n line-height: calc(var(--fontSize) * 1.5);\\\\n word-wrap: break-word;\\\\n padding-left: calc(1rem / 2 + 1px);\\\\n padding-right: calc(1rem / 2 + 1px);\\\\n padding-left: calc(var(--fontSize) / 2 + 1px);\\\\n padding-right: calc(var(--fontSize) / 2 + 1px);\\\\n }\\\\n}\\\\n\\\\nh1,h2,h3,h4,h5,h6 {\\\\n margin-top: 0;\\\\n margin-bottom: 0;\\\\n}\\\\n\\\\nmain.hero, .hero.main {\\\\n background-image: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\\\n@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {\\\\n\\\\nmain.hero, .hero.main {\\\\n background-image: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_1___ + \\");\\\\n}\\\\n}\\\\n\\\\nmain.hero, .hero.main {\\\\n background-image: -webkit-image-set(url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\") 1x, url(\\" + ___CSS_LOADER_URL_REPLACEMENT_1___ + \\") 2x);\\\\n background-image: image-set(url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\") 1x, url(\\" + ___CSS_LOADER_URL_REPLACEMENT_1___ + \\") 2x);\\\\n}\\\\n\\\\na {\\\\n color: rgba(0, 0, 255, 0.9)\\\\n}\\\\n\\\\na:hover {\\\\n color: #639;\\\\n }\\\\n\\", \\"\\"]); -// Exports -module.exports = exports; -" -`; - -exports[`loader should reuse \`ast\` from "postcss-loader": result 1`] = ` -Array [ - Array [ - "./postcss-present-env/source.css", - ":root { - --fontSize: 1rem; - --mainColor: rgba(18,52,86,0.47059); - --secondaryColor: rgba(102, 51, 153, 0.9); -} - -html { - overflow-x: hidden; - overflow-y: auto; - overflow: hidden auto; -} - -@media (max-width: 50rem) { - body { - color: rgba(18,52,86,0.47059); - color: var(--mainColor); - font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif; - font-size: 1rem; - font-size: var(--fontSize); - line-height: calc(1rem * 1.5); - line-height: calc(var(--fontSize) * 1.5); - word-wrap: break-word; - padding-left: calc(1rem / 2 + 1px); - padding-right: calc(1rem / 2 + 1px); - padding-left: calc(var(--fontSize) / 2 + 1px); - padding-right: calc(var(--fontSize) / 2 + 1px); - } -} - -h1,h2,h3,h4,h5,h6 { - margin-top: 0; - margin-bottom: 0; -} - -main.hero, .hero.main { - background-image: url(/webpack/public/path/img1x.png); -} - -@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { - -main.hero, .hero.main { - background-image: url(/webpack/public/path/img2x.png); -} -} - -main.hero, .hero.main { - background-image: -webkit-image-set(url(/webpack/public/path/img1x.png) 1x, url(/webpack/public/path/img2x.png) 2x); - background-image: image-set(url(/webpack/public/path/img1x.png) 1x, url(/webpack/public/path/img2x.png) 2x); -} - -a { - color: rgba(0, 0, 255, 0.9) -} - -a:hover { - color: #639; - } -", - "", - ], -] -`; - -exports[`loader should reuse \`ast\` from "postcss-loader": warnings 1`] = `Array []`; - -exports[`loader should throw error on invalid css syntax: errors 1`] = ` -Array [ - "ModuleBuildError: Module build failed (from \`replaced original path\`): -CssSyntaxError - -(2:3) Unknown word - - 1 | .some { -> 2 | invalid css; - | ^ - 3 | } - 4 | -", -] -`; - -exports[`loader should throw error on invalid css syntax: warnings 1`] = `Array []`; - -exports[`loader should throws error when no loader(s) for assets: errors 1`] = ` -Array [ - "ModuleParseError: Module parse failed: Unexpected character '�' (1:0) -You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders -(Source code omitted for this binary file)", -] -`; - -exports[`loader should throws error when no loader(s) for assets: warnings 1`] = `Array []`; - -exports[`loader should work with "asset" module type: errors 1`] = `Array []`; - -exports[`loader should work with "asset" module type: module 1`] = ` -"// Imports -var ___CSS_LOADER_API_IMPORT___ = require(\\"../../src/runtime/api.js\\"); -var ___CSS_LOADER_AT_RULE_IMPORT_0___ = require(\\"-!../../src/index.js!./imported.css\\"); -var ___CSS_LOADER_GET_URL_IMPORT___ = require(\\"../../src/runtime/getUrl.js\\"); -var ___CSS_LOADER_URL_IMPORT_0___ = require(\\"./url/img.png\\"); -exports = ___CSS_LOADER_API_IMPORT___(false); -exports.i(___CSS_LOADER_AT_RULE_IMPORT_0___); -var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___); -// Module -exports.push([module.id, \\"@charset \\\\\\"UTF-8\\\\\\";\\\\n\\\\n/* Comment */\\\\n\\\\n.class {\\\\n color: red;\\\\n background: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\\\n.class-duplicate-url {\\\\n background: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\\\n:root {\\\\n --foo: 1px;\\\\n --bar: 2px;\\\\n}\\\\n\\\\n.class { a: b c d; }\\\\n\\\\n.two {}\\\\n\\\\n.u-m\\\\\\\\+ { a: b c d; }\\\\n\\\\n.class { content: \\\\\\"\\\\\\\\F10C\\\\\\" }\\\\n\\\\n@media only screen and (max-width: 600px) {\\\\n body {\\\\n background-color: lightblue;\\\\n }\\\\n}\\\\n\\\\n.class {\\\\n content: \\\\\\"\\\\\\\\2193\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2193\\\\\\\\2193\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2193 \\\\\\\\2193\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2193\\\\\\\\2193\\\\\\\\2193\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2193 \\\\\\\\2193 \\\\\\\\2193\\\\\\";\\\\n}\\\\n\\\\n.-top {}\\\\n.\\\\\\\\-top {}\\\\n\\\\n#\\\\\\\\#test {}\\\\n\\\\n.grid {\\\\n display: flex;\\\\n flex-wrap: wrap;\\\\n}\\\\n.grid.\\\\\\\\-top {\\\\n align-items: flex-start;\\\\n}\\\\n.grid.-top {\\\\n align-items: flex-start;\\\\n}\\\\n.grid.\\\\\\\\-middle {\\\\n align-items: center;\\\\n}\\\\n.grid.\\\\\\\\-bottom {\\\\n align-items: flex-end;\\\\n}\\\\n\\\\n.u-m\\\\\\\\00002b {}\\\\n\\\\n.u-m00002b {}\\\\n\\\\n#u-m\\\\\\\\+ {}\\\\n\\\\nbody {\\\\n font-family: '微软雅黑'; /* some chinese font name */\\\\n}\\\\n\\\\n.myStyle {\\\\n content: '\\\\\\\\e901';\\\\n}\\\\n\\\\n.myStyle {\\\\n content: '\\\\\\\\E901';\\\\n}\\\\n\\\\n.♫ {}\\\\n\\\\n.\\\\\\\\3A \\\\\\\\\`\\\\\\\\( {} /* matches elements with class=\\\\\\":\`(\\\\\\" */\\\\n.\\\\\\\\31 a2b3c {} /* matches elements with class=\\\\\\"1a2b3c\\\\\\" */\\\\n#\\\\\\\\#fake-id {} /* matches the element with id=\\\\\\"#fake-id\\\\\\" */\\\\n#-a-b-c- {} /* matches the element with id=\\\\\\"-a-b-c-\\\\\\" */\\\\n#© {} /* matches the element with id=\\\\\\"©\\\\\\" */\\\\n\\\\n:root {\\\\n --title-align: center;\\\\n --sr-only: {\\\\n position: absolute;\\\\n width: 1px;\\\\n height: 1px;\\\\n padding: 0;\\\\n overflow: hidden;\\\\n clip: rect(0,0,0,0);\\\\n white-space: nowrap;\\\\n clip-path: inset(50%);\\\\n border: 0;\\\\n };\\\\n}\\\\n\\\\n.test {\\\\n content: \\\\\\"\\\\\\\\2014\\\\\\\\A0\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2014 \\\\\\\\A0\\\\\\";\\\\n content: \\\\\\"\\\\\\\\A0 \\\\\\\\2014\\\\\\";\\\\n content: \\\\\\"\\\\\\\\A0\\\\\\\\2014\\\\\\";\\\\n margin-top: 1px\\\\\\\\9;\\\\n background-color: #000\\\\\\\\9;\\\\n}\\\\n\\\\n.light.on .bulb:before{\\\\n content: '💡';\\\\n}\\\\n\\\\n.base64 {\\\\n background: url(data:img/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAhxJREFUSA3tk71rU1EYxnMTEoJUkowWwdJ2akEHBfGjCiIF6ZylVUKSm2TqZLGI+A/oIu2UXm8C4lAyF4SWji0tdFLo1Eo7VN0SaBEhH7e/Nz0nPTfGOjiaCyfPc5734zlfCQT6X/8E/vUErL81KBaL9y3LSnued5PcITjUOwR3gsFg2bbtjYt6/NGgXC4P1et1l2aPLmpAbD0SidjpdPqgV15PA9d17zQajU8UxHQRK/4G35Q5pveAK8LlI1ZjPMnlcltnyvnvbwaO41xvtVqy7YHztMACq5xnlb9EY3dRdvcGo1kj5wR+t1AofDG0gM+A875E8DNjRCexsrV8Pj9ZqVQitVrtqejxePxjMpmss5hVTB4buXvMb2DyU2tBTRS+BjvNlVYUpPl7iuVO3Gq1uoQx1FtSOW1gPgp5ZWrdBtNmUDgv5asgxQ8F1af5vhY0YjyjuWC3wTszKJz7GBOkcFlQfW2ONq4FjWi+Hj6DRCKxQOK2TlY4x92EuYd5dvMAbYIzfikau3pu5tJ8KxaLLfo0cyKci7tK4TZjUMcoXAmHwzle0Q/RaC5P1GFMyVx9R9Fo9HYqlTrSgqDvFelAqVQa5hmuMR/WGtjAaBdjwBoDQ0ZsnwVMZjKZ9n0Zem8DSeDPdrnZbL6F2l3NOvUYNZk4oVDoRTabPe4EDNJzB0ZcjAYxeoZ2i3FNxQ7BHYw/cB/fldaH//UETgHHO8S44KbfXgAAAABJRU5ErkJggg==);\\\\n}\\\\n\\\\na[href=''] {\\\\n color: red;\\\\n}\\\\n\\\\na[href='' i] {\\\\n color: red;\\\\n}\\\\n\\\\na[href=\\\\\\"\\\\\\"] {\\\\n color: blue;\\\\n}\\\\n\\\\na[href=\\\\\\"\\\\\\" i] {\\\\n color: blue;\\\\n}\\\\n\\", \\"\\"]); -// Exports -module.exports = exports; -" -`; - -exports[`loader should work with "asset" module type: result 1`] = ` -Array [ - Array [ - "../../src/index.js!./imported.css", - ".foo { - color: red; -} -", - "", - ], - Array [ - "./basic.css", - "@charset \\"UTF-8\\"; - -/* Comment */ - -.class { - color: red; - background: url(/webpack/public/path/img.png); -} - -.class-duplicate-url { - background: url(/webpack/public/path/img.png); -} - -:root { - --foo: 1px; - --bar: 2px; -} - -.class { a: b c d; } - -.two {} - -.u-m\\\\+ { a: b c d; } - -.class { content: \\"\\\\F10C\\" } - -@media only screen and (max-width: 600px) { - body { - background-color: lightblue; - } -} - -.class { - content: \\"\\\\2193\\"; - content: \\"\\\\2193\\\\2193\\"; - content: \\"\\\\2193 \\\\2193\\"; - content: \\"\\\\2193\\\\2193\\\\2193\\"; - content: \\"\\\\2193 \\\\2193 \\\\2193\\"; -} - -.-top {} -.\\\\-top {} - -#\\\\#test {} - -.grid { - display: flex; - flex-wrap: wrap; -} -.grid.\\\\-top { - align-items: flex-start; -} -.grid.-top { - align-items: flex-start; -} -.grid.\\\\-middle { - align-items: center; -} -.grid.\\\\-bottom { - align-items: flex-end; -} - -.u-m\\\\00002b {} - -.u-m00002b {} - -#u-m\\\\+ {} - -body { - font-family: '微软雅黑'; /* some chinese font name */ -} - -.myStyle { - content: '\\\\e901'; -} - -.myStyle { - content: '\\\\E901'; -} - -.♫ {} - -.\\\\3A \\\\\`\\\\( {} /* matches elements with class=\\":\`(\\" */ -.\\\\31 a2b3c {} /* matches elements with class=\\"1a2b3c\\" */ -#\\\\#fake-id {} /* matches the element with id=\\"#fake-id\\" */ -#-a-b-c- {} /* matches the element with id=\\"-a-b-c-\\" */ -#© {} /* matches the element with id=\\"©\\" */ - -:root { - --title-align: center; - --sr-only: { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - overflow: hidden; - clip: rect(0,0,0,0); - white-space: nowrap; - clip-path: inset(50%); - border: 0; - }; -} - -.test { - content: \\"\\\\2014\\\\A0\\"; - content: \\"\\\\2014 \\\\A0\\"; - content: \\"\\\\A0 \\\\2014\\"; - content: \\"\\\\A0\\\\2014\\"; - margin-top: 1px\\\\9; - background-color: #000\\\\9; -} - -.light.on .bulb:before{ - content: '💡'; -} - -.base64 { - background: url(data:img/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAhxJREFUSA3tk71rU1EYxnMTEoJUkowWwdJ2akEHBfGjCiIF6ZylVUKSm2TqZLGI+A/oIu2UXm8C4lAyF4SWji0tdFLo1Eo7VN0SaBEhH7e/Nz0nPTfGOjiaCyfPc5734zlfCQT6X/8E/vUErL81KBaL9y3LSnued5PcITjUOwR3gsFg2bbtjYt6/NGgXC4P1et1l2aPLmpAbD0SidjpdPqgV15PA9d17zQajU8UxHQRK/4G35Q5pveAK8LlI1ZjPMnlcltnyvnvbwaO41xvtVqy7YHztMACq5xnlb9EY3dRdvcGo1kj5wR+t1AofDG0gM+A875E8DNjRCexsrV8Pj9ZqVQitVrtqejxePxjMpmss5hVTB4buXvMb2DyU2tBTRS+BjvNlVYUpPl7iuVO3Gq1uoQx1FtSOW1gPgp5ZWrdBtNmUDgv5asgxQ8F1af5vhY0YjyjuWC3wTszKJz7GBOkcFlQfW2ONq4FjWi+Hj6DRCKxQOK2TlY4x92EuYd5dvMAbYIzfikau3pu5tJ8KxaLLfo0cyKci7tK4TZjUMcoXAmHwzle0Q/RaC5P1GFMyVx9R9Fo9HYqlTrSgqDvFelAqVQa5hmuMR/WGtjAaBdjwBoDQ0ZsnwVMZjKZ9n0Zem8DSeDPdrnZbL6F2l3NOvUYNZk4oVDoRTabPe4EDNJzB0ZcjAYxeoZ2i3FNxQ7BHYw/cB/fldaH//UETgHHO8S44KbfXgAAAABJRU5ErkJggg==); -} - -a[href=''] { - color: red; -} - -a[href='' i] { - color: red; -} - -a[href=\\"\\"] { - color: blue; -} - -a[href=\\"\\" i] { - color: blue; -} -", - "", - ], + "main.b38d5f87c88c55a4258e.bundle.js", ] `; -exports[`loader should work with "asset" module type: warnings 1`] = `Array []`; +exports[`loader should have same "contenthash" with "css-loader" and without source maps: warnings 1`] = `Array []`; -exports[`loader should work with "sass-loader": errors 1`] = `Array []`; +exports[`loader should have same "contenthash" with "postcss-loader" and with source maps: errors 1`] = `Array []`; -exports[`loader should work with "sass-loader": module 1`] = ` -"// Imports -var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../src/runtime/api.js\\"); -exports = ___CSS_LOADER_API_IMPORT___(false); -// Module -exports.push([module.id, \\"body {\\\\n font: 100% Helvetica, sans-serif;\\\\n color: #333;\\\\n}\\", \\"\\"]); -// Exports -module.exports = exports; -" -`; - -exports[`loader should work with "sass-loader": result 1`] = ` +exports[`loader should have same "contenthash" with "postcss-loader" and with source maps: module 1`] = ` Array [ - Array [ - "./scss/source.scss", - "body { - font: 100% Helvetica, sans-serif; - color: #333; -}", - "", - ], + "main.d77dd6564bc6e6297cd4.bundle.js", ] `; -exports[`loader should work with "sass-loader": warnings 1`] = `Array []`; - -exports[`loader should work with ModuleConcatenationPlugin (file-loader): errors 1`] = `Array []`; - -exports[`loader should work with ModuleConcatenationPlugin (file-loader): warnings 1`] = `Array []`; +exports[`loader should have same "contenthash" with "postcss-loader" and with source maps: warnings 1`] = `Array []`; -exports[`loader should work with ModuleConcatenationPlugin (url-loader): errors 1`] = `Array []`; +exports[`loader should have same "contenthash" with "postcss-loader" and without source maps: errors 1`] = `Array []`; -exports[`loader should work with ModuleConcatenationPlugin (url-loader): warnings 1`] = `Array []`; - -exports[`loader should work with ModuleConcatenationPlugin: errors 1`] = `Array []`; - -exports[`loader should work with ModuleConcatenationPlugin: warnings 1`] = `Array []`; - -exports[`loader should work with empty css: errors 1`] = `Array []`; - -exports[`loader should work with empty css: module 1`] = ` -"// Imports -var ___CSS_LOADER_API_IMPORT___ = require(\\"../../src/runtime/api.js\\"); -exports = ___CSS_LOADER_API_IMPORT___(false); -// Module -exports.push([module.id, \\"\\", \\"\\"]); -// Exports -module.exports = exports; -" -`; - -exports[`loader should work with empty css: result 1`] = ` +exports[`loader should have same "contenthash" with "postcss-loader" and without source maps: module 1`] = ` Array [ - Array [ - "./empty.css", - "", - "", - ], + "main.f8e62206a43c13393798.bundle.js", ] `; -exports[`loader should work with empty css: warnings 1`] = `Array []`; - -exports[`loader should work with empty options: errors 1`] = `Array []`; +exports[`loader should have same "contenthash" with "postcss-loader" and without source maps: warnings 1`] = `Array []`; -exports[`loader should work with empty options: module 1`] = ` -"// Imports -var ___CSS_LOADER_API_IMPORT___ = require(\\"../../src/runtime/api.js\\"); -var ___CSS_LOADER_AT_RULE_IMPORT_0___ = require(\\"-!../../src/index.js??[ident]!./imported.css\\"); -var ___CSS_LOADER_GET_URL_IMPORT___ = require(\\"../../src/runtime/getUrl.js\\"); -var ___CSS_LOADER_URL_IMPORT_0___ = require(\\"./url/img.png\\"); -exports = ___CSS_LOADER_API_IMPORT___(false); -exports.i(___CSS_LOADER_AT_RULE_IMPORT_0___); -var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___); -// Module -exports.push([module.id, \\"@charset \\\\\\"UTF-8\\\\\\";\\\\n\\\\n/* Comment */\\\\n\\\\n.class {\\\\n color: red;\\\\n background: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\\\n.class-duplicate-url {\\\\n background: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\\\n:root {\\\\n --foo: 1px;\\\\n --bar: 2px;\\\\n}\\\\n\\\\n.class { a: b c d; }\\\\n\\\\n.two {}\\\\n\\\\n.u-m\\\\\\\\+ { a: b c d; }\\\\n\\\\n.class { content: \\\\\\"\\\\\\\\F10C\\\\\\" }\\\\n\\\\n@media only screen and (max-width: 600px) {\\\\n body {\\\\n background-color: lightblue;\\\\n }\\\\n}\\\\n\\\\n.class {\\\\n content: \\\\\\"\\\\\\\\2193\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2193\\\\\\\\2193\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2193 \\\\\\\\2193\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2193\\\\\\\\2193\\\\\\\\2193\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2193 \\\\\\\\2193 \\\\\\\\2193\\\\\\";\\\\n}\\\\n\\\\n.-top {}\\\\n.\\\\\\\\-top {}\\\\n\\\\n#\\\\\\\\#test {}\\\\n\\\\n.grid {\\\\n display: flex;\\\\n flex-wrap: wrap;\\\\n}\\\\n.grid.\\\\\\\\-top {\\\\n align-items: flex-start;\\\\n}\\\\n.grid.-top {\\\\n align-items: flex-start;\\\\n}\\\\n.grid.\\\\\\\\-middle {\\\\n align-items: center;\\\\n}\\\\n.grid.\\\\\\\\-bottom {\\\\n align-items: flex-end;\\\\n}\\\\n\\\\n.u-m\\\\\\\\00002b {}\\\\n\\\\n.u-m00002b {}\\\\n\\\\n#u-m\\\\\\\\+ {}\\\\n\\\\nbody {\\\\n font-family: '微软雅黑'; /* some chinese font name */\\\\n}\\\\n\\\\n.myStyle {\\\\n content: '\\\\\\\\e901';\\\\n}\\\\n\\\\n.myStyle {\\\\n content: '\\\\\\\\E901';\\\\n}\\\\n\\\\n.♫ {}\\\\n\\\\n.\\\\\\\\3A \\\\\\\\\`\\\\\\\\( {} /* matches elements with class=\\\\\\":\`(\\\\\\" */\\\\n.\\\\\\\\31 a2b3c {} /* matches elements with class=\\\\\\"1a2b3c\\\\\\" */\\\\n#\\\\\\\\#fake-id {} /* matches the element with id=\\\\\\"#fake-id\\\\\\" */\\\\n#-a-b-c- {} /* matches the element with id=\\\\\\"-a-b-c-\\\\\\" */\\\\n#© {} /* matches the element with id=\\\\\\"©\\\\\\" */\\\\n\\\\n:root {\\\\n --title-align: center;\\\\n --sr-only: {\\\\n position: absolute;\\\\n width: 1px;\\\\n height: 1px;\\\\n padding: 0;\\\\n overflow: hidden;\\\\n clip: rect(0,0,0,0);\\\\n white-space: nowrap;\\\\n clip-path: inset(50%);\\\\n border: 0;\\\\n };\\\\n}\\\\n\\\\n.test {\\\\n content: \\\\\\"\\\\\\\\2014\\\\\\\\A0\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2014 \\\\\\\\A0\\\\\\";\\\\n content: \\\\\\"\\\\\\\\A0 \\\\\\\\2014\\\\\\";\\\\n content: \\\\\\"\\\\\\\\A0\\\\\\\\2014\\\\\\";\\\\n margin-top: 1px\\\\\\\\9;\\\\n background-color: #000\\\\\\\\9;\\\\n}\\\\n\\\\n.light.on .bulb:before{\\\\n content: '💡';\\\\n}\\\\n\\\\n.base64 {\\\\n background: url(data:img/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAhxJREFUSA3tk71rU1EYxnMTEoJUkowWwdJ2akEHBfGjCiIF6ZylVUKSm2TqZLGI+A/oIu2UXm8C4lAyF4SWji0tdFLo1Eo7VN0SaBEhH7e/Nz0nPTfGOjiaCyfPc5734zlfCQT6X/8E/vUErL81KBaL9y3LSnued5PcITjUOwR3gsFg2bbtjYt6/NGgXC4P1et1l2aPLmpAbD0SidjpdPqgV15PA9d17zQajU8UxHQRK/4G35Q5pveAK8LlI1ZjPMnlcltnyvnvbwaO41xvtVqy7YHztMACq5xnlb9EY3dRdvcGo1kj5wR+t1AofDG0gM+A875E8DNjRCexsrV8Pj9ZqVQitVrtqejxePxjMpmss5hVTB4buXvMb2DyU2tBTRS+BjvNlVYUpPl7iuVO3Gq1uoQx1FtSOW1gPgp5ZWrdBtNmUDgv5asgxQ8F1af5vhY0YjyjuWC3wTszKJz7GBOkcFlQfW2ONq4FjWi+Hj6DRCKxQOK2TlY4x92EuYd5dvMAbYIzfikau3pu5tJ8KxaLLfo0cyKci7tK4TZjUMcoXAmHwzle0Q/RaC5P1GFMyVx9R9Fo9HYqlTrSgqDvFelAqVQa5hmuMR/WGtjAaBdjwBoDQ0ZsnwVMZjKZ9n0Zem8DSeDPdrnZbL6F2l3NOvUYNZk4oVDoRTabPe4EDNJzB0ZcjAYxeoZ2i3FNxQ7BHYw/cB/fldaH//UETgHHO8S44KbfXgAAAABJRU5ErkJggg==);\\\\n}\\\\n\\\\na[href=''] {\\\\n color: red;\\\\n}\\\\n\\\\na[href='' i] {\\\\n color: red;\\\\n}\\\\n\\\\na[href=\\\\\\"\\\\\\"] {\\\\n color: blue;\\\\n}\\\\n\\\\na[href=\\\\\\"\\\\\\" i] {\\\\n color: blue;\\\\n}\\\\n\\", \\"\\"]); -// Exports -module.exports = exports; -" -`; +exports[`loader should have same "contenthash" with "sass-loader" and with source maps: errors 1`] = `Array []`; -exports[`loader should work with empty options: result 1`] = ` +exports[`loader should have same "contenthash" with "sass-loader" and with source maps: module 1`] = ` Array [ - Array [ - "../../src/index.js?[ident]!./imported.css", - ".foo { - color: red; -} -", - "", - ], - Array [ - "./basic.css", - "@charset \\"UTF-8\\"; - -/* Comment */ - -.class { - color: red; - background: url(/webpack/public/path/img.png); -} - -.class-duplicate-url { - background: url(/webpack/public/path/img.png); -} - -:root { - --foo: 1px; - --bar: 2px; -} - -.class { a: b c d; } - -.two {} - -.u-m\\\\+ { a: b c d; } - -.class { content: \\"\\\\F10C\\" } - -@media only screen and (max-width: 600px) { - body { - background-color: lightblue; - } -} - -.class { - content: \\"\\\\2193\\"; - content: \\"\\\\2193\\\\2193\\"; - content: \\"\\\\2193 \\\\2193\\"; - content: \\"\\\\2193\\\\2193\\\\2193\\"; - content: \\"\\\\2193 \\\\2193 \\\\2193\\"; -} - -.-top {} -.\\\\-top {} - -#\\\\#test {} - -.grid { - display: flex; - flex-wrap: wrap; -} -.grid.\\\\-top { - align-items: flex-start; -} -.grid.-top { - align-items: flex-start; -} -.grid.\\\\-middle { - align-items: center; -} -.grid.\\\\-bottom { - align-items: flex-end; -} - -.u-m\\\\00002b {} - -.u-m00002b {} - -#u-m\\\\+ {} - -body { - font-family: '微软雅黑'; /* some chinese font name */ -} - -.myStyle { - content: '\\\\e901'; -} - -.myStyle { - content: '\\\\E901'; -} - -.♫ {} - -.\\\\3A \\\\\`\\\\( {} /* matches elements with class=\\":\`(\\" */ -.\\\\31 a2b3c {} /* matches elements with class=\\"1a2b3c\\" */ -#\\\\#fake-id {} /* matches the element with id=\\"#fake-id\\" */ -#-a-b-c- {} /* matches the element with id=\\"-a-b-c-\\" */ -#© {} /* matches the element with id=\\"©\\" */ - -:root { - --title-align: center; - --sr-only: { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - overflow: hidden; - clip: rect(0,0,0,0); - white-space: nowrap; - clip-path: inset(50%); - border: 0; - }; -} - -.test { - content: \\"\\\\2014\\\\A0\\"; - content: \\"\\\\2014 \\\\A0\\"; - content: \\"\\\\A0 \\\\2014\\"; - content: \\"\\\\A0\\\\2014\\"; - margin-top: 1px\\\\9; - background-color: #000\\\\9; -} - -.light.on .bulb:before{ - content: '💡'; -} - -.base64 { - background: url(data:img/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAhxJREFUSA3tk71rU1EYxnMTEoJUkowWwdJ2akEHBfGjCiIF6ZylVUKSm2TqZLGI+A/oIu2UXm8C4lAyF4SWji0tdFLo1Eo7VN0SaBEhH7e/Nz0nPTfGOjiaCyfPc5734zlfCQT6X/8E/vUErL81KBaL9y3LSnued5PcITjUOwR3gsFg2bbtjYt6/NGgXC4P1et1l2aPLmpAbD0SidjpdPqgV15PA9d17zQajU8UxHQRK/4G35Q5pveAK8LlI1ZjPMnlcltnyvnvbwaO41xvtVqy7YHztMACq5xnlb9EY3dRdvcGo1kj5wR+t1AofDG0gM+A875E8DNjRCexsrV8Pj9ZqVQitVrtqejxePxjMpmss5hVTB4buXvMb2DyU2tBTRS+BjvNlVYUpPl7iuVO3Gq1uoQx1FtSOW1gPgp5ZWrdBtNmUDgv5asgxQ8F1af5vhY0YjyjuWC3wTszKJz7GBOkcFlQfW2ONq4FjWi+Hj6DRCKxQOK2TlY4x92EuYd5dvMAbYIzfikau3pu5tJ8KxaLLfo0cyKci7tK4TZjUMcoXAmHwzle0Q/RaC5P1GFMyVx9R9Fo9HYqlTrSgqDvFelAqVQa5hmuMR/WGtjAaBdjwBoDQ0ZsnwVMZjKZ9n0Zem8DSeDPdrnZbL6F2l3NOvUYNZk4oVDoRTabPe4EDNJzB0ZcjAYxeoZ2i3FNxQ7BHYw/cB/fldaH//UETgHHO8S44KbfXgAAAABJRU5ErkJggg==); -} - -a[href=''] { - color: red; -} - -a[href='' i] { - color: red; -} - -a[href=\\"\\"] { - color: blue; -} - -a[href=\\"\\" i] { - color: blue; -} -", - "", - ], + "main.151589c7e12ebfd445e7.bundle.js", ] `; -exports[`loader should work with empty options: warnings 1`] = `Array []`; - -exports[`loader should work: errors 1`] = `Array []`; +exports[`loader should have same "contenthash" with "sass-loader" and with source maps: warnings 1`] = `Array []`; -exports[`loader should work: module 1`] = ` -"// Imports -var ___CSS_LOADER_API_IMPORT___ = require(\\"../../src/runtime/api.js\\"); -var ___CSS_LOADER_AT_RULE_IMPORT_0___ = require(\\"-!../../src/index.js??[ident]!./imported.css\\"); -var ___CSS_LOADER_GET_URL_IMPORT___ = require(\\"../../src/runtime/getUrl.js\\"); -var ___CSS_LOADER_URL_IMPORT_0___ = require(\\"./url/img.png\\"); -exports = ___CSS_LOADER_API_IMPORT___(false); -exports.i(___CSS_LOADER_AT_RULE_IMPORT_0___); -var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___); -// Module -exports.push([module.id, \\"@charset \\\\\\"UTF-8\\\\\\";\\\\n\\\\n/* Comment */\\\\n\\\\n.class {\\\\n color: red;\\\\n background: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\\\n.class-duplicate-url {\\\\n background: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\\\n:root {\\\\n --foo: 1px;\\\\n --bar: 2px;\\\\n}\\\\n\\\\n.class { a: b c d; }\\\\n\\\\n.two {}\\\\n\\\\n.u-m\\\\\\\\+ { a: b c d; }\\\\n\\\\n.class { content: \\\\\\"\\\\\\\\F10C\\\\\\" }\\\\n\\\\n@media only screen and (max-width: 600px) {\\\\n body {\\\\n background-color: lightblue;\\\\n }\\\\n}\\\\n\\\\n.class {\\\\n content: \\\\\\"\\\\\\\\2193\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2193\\\\\\\\2193\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2193 \\\\\\\\2193\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2193\\\\\\\\2193\\\\\\\\2193\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2193 \\\\\\\\2193 \\\\\\\\2193\\\\\\";\\\\n}\\\\n\\\\n.-top {}\\\\n.\\\\\\\\-top {}\\\\n\\\\n#\\\\\\\\#test {}\\\\n\\\\n.grid {\\\\n display: flex;\\\\n flex-wrap: wrap;\\\\n}\\\\n.grid.\\\\\\\\-top {\\\\n align-items: flex-start;\\\\n}\\\\n.grid.-top {\\\\n align-items: flex-start;\\\\n}\\\\n.grid.\\\\\\\\-middle {\\\\n align-items: center;\\\\n}\\\\n.grid.\\\\\\\\-bottom {\\\\n align-items: flex-end;\\\\n}\\\\n\\\\n.u-m\\\\\\\\00002b {}\\\\n\\\\n.u-m00002b {}\\\\n\\\\n#u-m\\\\\\\\+ {}\\\\n\\\\nbody {\\\\n font-family: '微软雅黑'; /* some chinese font name */\\\\n}\\\\n\\\\n.myStyle {\\\\n content: '\\\\\\\\e901';\\\\n}\\\\n\\\\n.myStyle {\\\\n content: '\\\\\\\\E901';\\\\n}\\\\n\\\\n.♫ {}\\\\n\\\\n.\\\\\\\\3A \\\\\\\\\`\\\\\\\\( {} /* matches elements with class=\\\\\\":\`(\\\\\\" */\\\\n.\\\\\\\\31 a2b3c {} /* matches elements with class=\\\\\\"1a2b3c\\\\\\" */\\\\n#\\\\\\\\#fake-id {} /* matches the element with id=\\\\\\"#fake-id\\\\\\" */\\\\n#-a-b-c- {} /* matches the element with id=\\\\\\"-a-b-c-\\\\\\" */\\\\n#© {} /* matches the element with id=\\\\\\"©\\\\\\" */\\\\n\\\\n:root {\\\\n --title-align: center;\\\\n --sr-only: {\\\\n position: absolute;\\\\n width: 1px;\\\\n height: 1px;\\\\n padding: 0;\\\\n overflow: hidden;\\\\n clip: rect(0,0,0,0);\\\\n white-space: nowrap;\\\\n clip-path: inset(50%);\\\\n border: 0;\\\\n };\\\\n}\\\\n\\\\n.test {\\\\n content: \\\\\\"\\\\\\\\2014\\\\\\\\A0\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2014 \\\\\\\\A0\\\\\\";\\\\n content: \\\\\\"\\\\\\\\A0 \\\\\\\\2014\\\\\\";\\\\n content: \\\\\\"\\\\\\\\A0\\\\\\\\2014\\\\\\";\\\\n margin-top: 1px\\\\\\\\9;\\\\n background-color: #000\\\\\\\\9;\\\\n}\\\\n\\\\n.light.on .bulb:before{\\\\n content: '💡';\\\\n}\\\\n\\\\n.base64 {\\\\n background: url(data:img/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAhxJREFUSA3tk71rU1EYxnMTEoJUkowWwdJ2akEHBfGjCiIF6ZylVUKSm2TqZLGI+A/oIu2UXm8C4lAyF4SWji0tdFLo1Eo7VN0SaBEhH7e/Nz0nPTfGOjiaCyfPc5734zlfCQT6X/8E/vUErL81KBaL9y3LSnued5PcITjUOwR3gsFg2bbtjYt6/NGgXC4P1et1l2aPLmpAbD0SidjpdPqgV15PA9d17zQajU8UxHQRK/4G35Q5pveAK8LlI1ZjPMnlcltnyvnvbwaO41xvtVqy7YHztMACq5xnlb9EY3dRdvcGo1kj5wR+t1AofDG0gM+A875E8DNjRCexsrV8Pj9ZqVQitVrtqejxePxjMpmss5hVTB4buXvMb2DyU2tBTRS+BjvNlVYUpPl7iuVO3Gq1uoQx1FtSOW1gPgp5ZWrdBtNmUDgv5asgxQ8F1af5vhY0YjyjuWC3wTszKJz7GBOkcFlQfW2ONq4FjWi+Hj6DRCKxQOK2TlY4x92EuYd5dvMAbYIzfikau3pu5tJ8KxaLLfo0cyKci7tK4TZjUMcoXAmHwzle0Q/RaC5P1GFMyVx9R9Fo9HYqlTrSgqDvFelAqVQa5hmuMR/WGtjAaBdjwBoDQ0ZsnwVMZjKZ9n0Zem8DSeDPdrnZbL6F2l3NOvUYNZk4oVDoRTabPe4EDNJzB0ZcjAYxeoZ2i3FNxQ7BHYw/cB/fldaH//UETgHHO8S44KbfXgAAAABJRU5ErkJggg==);\\\\n}\\\\n\\\\na[href=''] {\\\\n color: red;\\\\n}\\\\n\\\\na[href='' i] {\\\\n color: red;\\\\n}\\\\n\\\\na[href=\\\\\\"\\\\\\"] {\\\\n color: blue;\\\\n}\\\\n\\\\na[href=\\\\\\"\\\\\\" i] {\\\\n color: blue;\\\\n}\\\\n\\", \\"\\"]); -// Exports -module.exports = exports; -" -`; +exports[`loader should have same "contenthash" with "sass-loader" and without source maps: errors 1`] = `Array []`; -exports[`loader should work: result 1`] = ` +exports[`loader should have same "contenthash" with "sass-loader" and without source maps: module 1`] = ` Array [ - Array [ - "../../src/index.js?[ident]!./imported.css", - ".foo { - color: red; -} -", - "", - ], - Array [ - "./basic.css", - "@charset \\"UTF-8\\"; - -/* Comment */ - -.class { - color: red; - background: url(/webpack/public/path/img.png); -} - -.class-duplicate-url { - background: url(/webpack/public/path/img.png); -} - -:root { - --foo: 1px; - --bar: 2px; -} - -.class { a: b c d; } - -.two {} - -.u-m\\\\+ { a: b c d; } - -.class { content: \\"\\\\F10C\\" } - -@media only screen and (max-width: 600px) { - body { - background-color: lightblue; - } -} - -.class { - content: \\"\\\\2193\\"; - content: \\"\\\\2193\\\\2193\\"; - content: \\"\\\\2193 \\\\2193\\"; - content: \\"\\\\2193\\\\2193\\\\2193\\"; - content: \\"\\\\2193 \\\\2193 \\\\2193\\"; -} - -.-top {} -.\\\\-top {} - -#\\\\#test {} - -.grid { - display: flex; - flex-wrap: wrap; -} -.grid.\\\\-top { - align-items: flex-start; -} -.grid.-top { - align-items: flex-start; -} -.grid.\\\\-middle { - align-items: center; -} -.grid.\\\\-bottom { - align-items: flex-end; -} - -.u-m\\\\00002b {} - -.u-m00002b {} - -#u-m\\\\+ {} - -body { - font-family: '微软雅黑'; /* some chinese font name */ -} - -.myStyle { - content: '\\\\e901'; -} - -.myStyle { - content: '\\\\E901'; -} - -.♫ {} - -.\\\\3A \\\\\`\\\\( {} /* matches elements with class=\\":\`(\\" */ -.\\\\31 a2b3c {} /* matches elements with class=\\"1a2b3c\\" */ -#\\\\#fake-id {} /* matches the element with id=\\"#fake-id\\" */ -#-a-b-c- {} /* matches the element with id=\\"-a-b-c-\\" */ -#© {} /* matches the element with id=\\"©\\" */ - -:root { - --title-align: center; - --sr-only: { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - overflow: hidden; - clip: rect(0,0,0,0); - white-space: nowrap; - clip-path: inset(50%); - border: 0; - }; -} - -.test { - content: \\"\\\\2014\\\\A0\\"; - content: \\"\\\\2014 \\\\A0\\"; - content: \\"\\\\A0 \\\\2014\\"; - content: \\"\\\\A0\\\\2014\\"; - margin-top: 1px\\\\9; - background-color: #000\\\\9; -} - -.light.on .bulb:before{ - content: '💡'; -} - -.base64 { - background: url(data:img/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAhxJREFUSA3tk71rU1EYxnMTEoJUkowWwdJ2akEHBfGjCiIF6ZylVUKSm2TqZLGI+A/oIu2UXm8C4lAyF4SWji0tdFLo1Eo7VN0SaBEhH7e/Nz0nPTfGOjiaCyfPc5734zlfCQT6X/8E/vUErL81KBaL9y3LSnued5PcITjUOwR3gsFg2bbtjYt6/NGgXC4P1et1l2aPLmpAbD0SidjpdPqgV15PA9d17zQajU8UxHQRK/4G35Q5pveAK8LlI1ZjPMnlcltnyvnvbwaO41xvtVqy7YHztMACq5xnlb9EY3dRdvcGo1kj5wR+t1AofDG0gM+A875E8DNjRCexsrV8Pj9ZqVQitVrtqejxePxjMpmss5hVTB4buXvMb2DyU2tBTRS+BjvNlVYUpPl7iuVO3Gq1uoQx1FtSOW1gPgp5ZWrdBtNmUDgv5asgxQ8F1af5vhY0YjyjuWC3wTszKJz7GBOkcFlQfW2ONq4FjWi+Hj6DRCKxQOK2TlY4x92EuYd5dvMAbYIzfikau3pu5tJ8KxaLLfo0cyKci7tK4TZjUMcoXAmHwzle0Q/RaC5P1GFMyVx9R9Fo9HYqlTrSgqDvFelAqVQa5hmuMR/WGtjAaBdjwBoDQ0ZsnwVMZjKZ9n0Zem8DSeDPdrnZbL6F2l3NOvUYNZk4oVDoRTabPe4EDNJzB0ZcjAYxeoZ2i3FNxQ7BHYw/cB/fldaH//UETgHHO8S44KbfXgAAAABJRU5ErkJggg==); -} - -a[href=''] { - color: red; -} - -a[href='' i] { - color: red; -} - -a[href=\\"\\"] { - color: blue; -} - -a[href=\\"\\" i] { - color: blue; -} -", - "", - ], + "main.9ae036ace8bbbebbd185.bundle.js", ] `; -exports[`loader should work: warnings 1`] = `Array []`; +exports[`loader should have same "contenthash" with "sass-loader" and without source maps: warnings 1`] = `Array []`; diff --git a/test/loader.test.js b/test/loader.test.js index 2da97263..5ce9522b 100644 --- a/test/loader.test.js +++ b/test/loader.test.js @@ -309,7 +309,40 @@ describe('loader', () => { expect(getErrors(stats)).toMatchSnapshot('errors'); }); - it('should have same "contenthash" with "css-loader" and source maps', async () => { + it.only('should have same "contenthash" with "css-loader" and without source maps', async () => { + const compiler = getCompiler( + './contenthash/basic-css.js', + {}, + { + output: { + path: path.resolve(__dirname, '../outputs'), + filename: '[name].[contenthash].bundle.js', + chunkFilename: '[name].[contenthash].chunk.js', + publicPath: '/webpack/public/path/', + }, + module: { + rules: [ + { + test: /\.css$/i, + rules: [ + { + loader: path.resolve(__dirname, '../src'), + options: { sourceMap: false }, + }, + ], + }, + ], + }, + } + ); + const stats = await compile(compiler); + + expect(Object.keys(stats.compilation.assets)).toMatchSnapshot('module'); + expect(getWarnings(stats)).toMatchSnapshot('warnings'); + expect(getErrors(stats)).toMatchSnapshot('errors'); + }); + + it.only('should have same "contenthash" with "css-loader" and with source maps', async () => { const compiler = getCompiler( './contenthash/basic-css.js', {}, @@ -342,7 +375,50 @@ describe('loader', () => { expect(getErrors(stats)).toMatchSnapshot('errors'); }); - it('should have same "contenthash" with "postcss-loader" and source maps', async () => { + it.only('should have same "contenthash" with "postcss-loader" and without source maps', async () => { + const compiler = getCompiler( + './contenthash/basic-postcss.js', + {}, + { + output: { + path: path.resolve(__dirname, '../outputs'), + filename: '[name].[contenthash].bundle.js', + chunkFilename: '[name].[contenthash].chunk.js', + publicPath: '/webpack/public/path/', + }, + module: { + rules: [ + { + test: /\.css$/i, + rules: [ + { + loader: path.resolve(__dirname, '../src'), + options: { + sourceMap: false, + importLoaders: 1, + }, + }, + { + loader: 'postcss-loader', + options: { + plugins: () => [postcssPresetEnv({ stage: 0 })], + sourceMap: false, + }, + }, + ], + }, + ], + }, + } + ); + const stats = await compile(compiler); + + expect(Object.keys(stats.compilation.assets)).toMatchSnapshot('module'); + expect(getWarnings(stats)).toMatchSnapshot('warnings'); + expect(getErrors(stats)).toMatchSnapshot('errors'); + }); + + it.only('should have same "contenthash" with "postcss-loader" and with source maps', async () => { const compiler = getCompiler( './contenthash/basic-postcss.js', {}, @@ -385,7 +461,58 @@ describe('loader', () => { expect(getErrors(stats)).toMatchSnapshot('errors'); }); - it('should have same "contenthash" with "sass-loader" and source maps', async () => { + it.only('should have same "contenthash" with "sass-loader" and without source maps', async () => { + const compiler = getCompiler( + './contenthash/basic-sass.js', + {}, + { + output: { + path: path.resolve(__dirname, '../outputs'), + filename: '[name].[contenthash].bundle.js', + chunkFilename: '[name].[contenthash].chunk.js', + publicPath: '/webpack/public/path/', + }, + module: { + rules: [ + { + test: /\.s[ca]ss$/i, + rules: [ + { + loader: path.resolve(__dirname, '../src'), + options: { + sourceMap: false, + importLoaders: 1, + }, + }, + { + loader: 'postcss-loader', + options: { + plugins: () => [postcssPresetEnv({ stage: 0 })], + sourceMap: false, + }, + }, + { + loader: 'sass-loader', + options: { + // eslint-disable-next-line global-require + implementation: require('sass'), + sourceMap: false, + }, + }, + ], + }, + ], + }, + } + ); + const stats = await compile(compiler); + + expect(Object.keys(stats.compilation.assets)).toMatchSnapshot('module'); + expect(getWarnings(stats)).toMatchSnapshot('warnings'); + expect(getErrors(stats)).toMatchSnapshot('errors'); + }); + + it.only('should have same "contenthash" with "sass-loader" and with source maps', async () => { const compiler = getCompiler( './contenthash/basic-sass.js', {}, @@ -431,8 +558,6 @@ describe('loader', () => { ); const stats = await compile(compiler); - console.log(stats.compilation.assets); - expect(Object.keys(stats.compilation.assets)).toMatchSnapshot('module'); expect(getWarnings(stats)).toMatchSnapshot('warnings'); expect(getErrors(stats)).toMatchSnapshot('errors'); From 6dbb90191f7e5c0b2948035fa885f1d03f9e1c4e Mon Sep 17 00:00:00 2001 From: evilebottnawi Date: Thu, 26 Dec 2019 19:13:45 +0300 Subject: [PATCH 3/5] test: check --- src/index.js | 11 +- src/utils.js | 23 +-- test/__snapshots__/loader.test.js.snap | 269 ++++++++++++++++++++----- test/loader.test.js | 13 +- 4 files changed, 235 insertions(+), 81 deletions(-) diff --git a/src/index.js b/src/index.js index 8729e4b3..2e9a56dd 100644 --- a/src/index.js +++ b/src/index.js @@ -3,7 +3,6 @@ Author Tobias Koppers @sokra */ import validateOptions from 'schema-utils'; -import RequestShortener from 'webpack/lib/RequestShortener'; import postcss from 'postcss'; import postcssPkg from 'postcss/package.json'; @@ -12,7 +11,6 @@ import { getOptions, isUrlRequest } from 'loader-utils'; import schema from './options.json'; import { importParser, icssParser, urlParser } from './plugins'; import { - normalizeSourceMap, getModulesPlugins, getFilter, getImportCode, @@ -76,14 +74,7 @@ export default function loader(content, map, meta) { to: this.currentRequest.split('!').pop(), map: options.sourceMap ? { - // Some loaders (example `"postcss-loader": "1.x.x"`) always generates source map, we should remove it - prev: - sourceMap && map - ? normalizeSourceMap( - map, - new RequestShortener(this.rootContext) - ) - : null, + prev: sourceMap && map ? map : null, inline: false, annotation: false, } diff --git a/src/utils.js b/src/utils.js index b9b8df59..aae5ff13 100644 --- a/src/utils.js +++ b/src/utils.js @@ -16,6 +16,7 @@ import localByDefault from 'postcss-modules-local-by-default'; import extractImports from 'postcss-modules-extract-imports'; import modulesScope from 'postcss-modules-scope'; import camelCase from 'camelcase'; +import RequestShortener from 'webpack/lib/RequestShortener'; const whitespace = '[\\x20\\t\\r\\n\\f]'; const unescapeRegExp = new RegExp( @@ -156,15 +157,9 @@ function getModulesPlugins(options, loaderContext) { ]; } -function normalizeSourceMap(map, requestShortener) { - let newMap = map; - - // Some loader emit source map as string - if (typeof newMap === 'string') { - newMap = JSON.parse(newMap); - } - - console.log(newMap); +function normalizeSourceMap(map, rootContext) { + const newMap = map.toJSON(); + const requestShortener = new RequestShortener(rootContext); // Source maps should use forward slash because it is URLs (https://github.com/mozilla/source-map/issues/91) // We should normalize path because previous loaders like `sass-loader` using backslash when generate source map @@ -183,9 +178,7 @@ function normalizeSourceMap(map, requestShortener) { ); } - console.log(newMap); - - return newMap; + return JSON.stringify(newMap); } function getImportPrefix(loaderContext, importLoaders) { @@ -377,7 +370,10 @@ function getModuleCode( } const { css, map } = result; - const sourceMapValue = sourceMap && map ? `,${map}` : ''; + const sourceMapValue = + sourceMap && map + ? `,${normalizeSourceMap(map, loaderContext.rootContext)}` + : ''; let cssCode = JSON.stringify(css); @@ -506,7 +502,6 @@ export { normalizeUrl, getFilter, getModulesPlugins, - normalizeSourceMap, getImportCode, getModuleCode, getExportCode, diff --git a/test/__snapshots__/loader.test.js.snap b/test/__snapshots__/loader.test.js.snap index 160d7a38..938f0871 100644 --- a/test/__snapshots__/loader.test.js.snap +++ b/test/__snapshots__/loader.test.js.snap @@ -1,61 +1,228 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`loader should have same "contenthash" with "css-loader" and with source maps: errors 1`] = `Array []`; - -exports[`loader should have same "contenthash" with "css-loader" and with source maps: module 1`] = ` -Array [ - "main.54b9712c1981e48c12c4.bundle.js", -] -`; - -exports[`loader should have same "contenthash" with "css-loader" and with source maps: warnings 1`] = `Array []`; - -exports[`loader should have same "contenthash" with "css-loader" and without source maps: errors 1`] = `Array []`; - -exports[`loader should have same "contenthash" with "css-loader" and without source maps: module 1`] = ` -Array [ - "main.b38d5f87c88c55a4258e.bundle.js", -] -`; - -exports[`loader should have same "contenthash" with "css-loader" and without source maps: warnings 1`] = `Array []`; - -exports[`loader should have same "contenthash" with "postcss-loader" and with source maps: errors 1`] = `Array []`; - -exports[`loader should have same "contenthash" with "postcss-loader" and with source maps: module 1`] = ` -Array [ - "main.d77dd6564bc6e6297cd4.bundle.js", -] -`; - -exports[`loader should have same "contenthash" with "postcss-loader" and with source maps: warnings 1`] = `Array []`; - -exports[`loader should have same "contenthash" with "postcss-loader" and without source maps: errors 1`] = `Array []`; - -exports[`loader should have same "contenthash" with "postcss-loader" and without source maps: module 1`] = ` -Array [ - "main.f8e62206a43c13393798.bundle.js", -] -`; - -exports[`loader should have same "contenthash" with "postcss-loader" and without source maps: warnings 1`] = `Array []`; - exports[`loader should have same "contenthash" with "sass-loader" and with source maps: errors 1`] = `Array []`; exports[`loader should have same "contenthash" with "sass-loader" and with source maps: module 1`] = ` -Array [ - "main.151589c7e12ebfd445e7.bundle.js", -] -`; +Object { + "main.a12ab765493c74c80be2.bundle.js": "/******/ (function(modules) { // webpackBootstrap +/******/ // The module cache +/******/ var installedModules = {}; +/******/ +/******/ // The require function +/******/ function __webpack_require__(moduleId) { +/******/ +/******/ // Check if module is in cache +/******/ if(installedModules[moduleId]) { +/******/ return installedModules[moduleId].exports; +/******/ } +/******/ // Create a new module (and put it into the cache) +/******/ var module = installedModules[moduleId] = { +/******/ i: moduleId, +/******/ l: false, +/******/ exports: {} +/******/ }; +/******/ +/******/ // Execute the module function +/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); +/******/ +/******/ // Flag the module as loaded +/******/ module.l = true; +/******/ +/******/ // Return the exports of the module +/******/ return module.exports; +/******/ } +/******/ +/******/ +/******/ // expose the modules object (__webpack_modules__) +/******/ __webpack_require__.m = modules; +/******/ +/******/ // expose the module cache +/******/ __webpack_require__.c = installedModules; +/******/ +/******/ // define getter function for harmony exports +/******/ __webpack_require__.d = function(exports, name, getter) { +/******/ if(!__webpack_require__.o(exports, name)) { +/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter }); +/******/ } +/******/ }; +/******/ +/******/ // define __esModule on exports +/******/ __webpack_require__.r = function(exports) { +/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) { +/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' }); +/******/ } +/******/ Object.defineProperty(exports, '__esModule', { value: true }); +/******/ }; +/******/ +/******/ // create a fake namespace object +/******/ // mode & 1: value is a module id, require it +/******/ // mode & 2: merge all properties of value into the ns +/******/ // mode & 4: return value when already ns object +/******/ // mode & 8|1: behave like require +/******/ __webpack_require__.t = function(value, mode) { +/******/ if(mode & 1) value = __webpack_require__(value); +/******/ if(mode & 8) return value; +/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value; +/******/ var ns = Object.create(null); +/******/ __webpack_require__.r(ns); +/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value }); +/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key)); +/******/ return ns; +/******/ }; +/******/ +/******/ // getDefaultExport function for compatibility with non-harmony modules +/******/ __webpack_require__.n = function(module) { +/******/ var getter = module && module.__esModule ? +/******/ function getDefault() { return module['default']; } : +/******/ function getModuleExports() { return module; }; +/******/ __webpack_require__.d(getter, 'a', getter); +/******/ return getter; +/******/ }; +/******/ +/******/ // Object.prototype.hasOwnProperty.call +/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); }; +/******/ +/******/ // __webpack_public_path__ +/******/ __webpack_require__.p = \\"/webpack/public/path/\\"; +/******/ +/******/ +/******/ // Load entry module and return exports +/******/ return __webpack_require__(__webpack_require__.s = \\"./contenthash/basic-sass.js\\"); +/******/ }) +/************************************************************************/ +/******/ ({ + +/***/ \\"../../src/runtime/api.js\\": +/*!**********************************************************************!*\\\\ + !*** /home/evilebottnawi/IdeaProjects/css-loader/src/runtime/api.js ***! + \\\\**********************************************************************/ +/*! no static exports found */ +/***/ (function(module, exports) { + +/* + MIT License http://www.opensource.org/licenses/mit-license.php + Author Tobias Koppers @sokra +*/ +// css base code, injected by the css-loader +// eslint-disable-next-line func-names +module.exports = function(useSourceMap) { + const list = []; + + // return the list of modules as css string + list.toString = function toString() { + return this.map((item) => { + const content = cssWithMappingToString(item, useSourceMap); + + if (item[2]) { + return \`@media \${item[2]} {\${content}}\`; + } + + return content; + }).join(''); + }; + + // import a list of modules into the list + // eslint-disable-next-line func-names + list.i = function(modules, mediaQuery) { + if (typeof modules === 'string') { + // eslint-disable-next-line no-param-reassign + modules = [[null, modules, '']]; + } + + for (let i = 0; i < modules.length; i++) { + const item = [].concat(modules[i]); + + if (mediaQuery) { + if (!item[2]) { + item[2] = mediaQuery; + } else { + item[2] = \`\${mediaQuery} and \${item[2]}\`; + } + } + + list.push(item); + } + }; + + return list; +}; + +function cssWithMappingToString(item, useSourceMap) { + const content = item[1] || ''; + // eslint-disable-next-line prefer-destructuring + const cssMapping = item[3]; + + if (!cssMapping) { + return content; + } + + if (useSourceMap && typeof btoa === 'function') { + const sourceMapping = toComment(cssMapping); + const sourceURLs = cssMapping.sources.map( + (source) => \`/*# sourceURL=\${cssMapping.sourceRoot}\${source} */\` + ); + + return [content] + .concat(sourceURLs) + .concat([sourceMapping]) + .join('\\\\n'); + } + + return [content].join('\\\\n'); +} + +// Adapted from convert-source-map (MIT) +function toComment(sourceMap) { + // eslint-disable-next-line no-undef + const base64 = btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap)))); + const data = \`sourceMappingURL=data:application/json;charset=utf-8;base64,\${base64}\`; + + return \`/*# \${data} */\`; +} + + +/***/ }), + +/***/ \\"./contenthash/basic-sass.js\\": +/*!***********************************!*\\\\ + !*** ./contenthash/basic-sass.js ***! + \\\\***********************************/ +/*! exports provided: default */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { + +\\"use strict\\"; +__webpack_require__.r(__webpack_exports__); +/* harmony import */ var _basic_scss__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./basic.scss */ \\"./contenthash/basic.scss\\"); +/* harmony import */ var _basic_scss__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_basic_scss__WEBPACK_IMPORTED_MODULE_0__); + + +__export__ = _basic_scss__WEBPACK_IMPORTED_MODULE_0___default.a; + +/* harmony default export */ __webpack_exports__[\\"default\\"] = (_basic_scss__WEBPACK_IMPORTED_MODULE_0___default.a); + + +/***/ }), + +/***/ \\"./contenthash/basic.scss\\": +/*!********************************!*\\\\ + !*** ./contenthash/basic.scss ***! + \\\\********************************/ +/*! no static exports found */ +/***/ (function(module, exports, __webpack_require__) { -exports[`loader should have same "contenthash" with "sass-loader" and with source maps: warnings 1`] = `Array []`; +// Imports +var ___CSS_LOADER_API_IMPORT___ = __webpack_require__(/*! ../../../src/runtime/api.js */ \\"../../src/runtime/api.js\\"); +exports = ___CSS_LOADER_API_IMPORT___(true); +// Module +exports.push([module.i, \\"a {\\\\n color: red;\\\\n}\\\\na:hover {\\\\n color: red;\\\\n}\\", \\"\\",{\\"version\\":3,\\"sources\\":[\\"./contenthash/basic.scss\\",\\"basic.scss\\"],\\"names\\":[],\\"mappings\\":\\"AAEA;EACE,UAHI;ACEN;ADGE;EACE,UANE;ACKN\\",\\"file\\":\\"basic.scss\\",\\"sourcesContent\\":[\\"$var: red;\\\\n\\\\na {\\\\n color: $var;\\\\n\\\\n &:hover {\\\\n color: $var;\\\\n }\\\\n}\\\\n\\",\\"a {\\\\n color: red;\\\\n}\\\\na:hover {\\\\n color: red;\\\\n}\\"]}]); +// Exports +module.exports = exports; -exports[`loader should have same "contenthash" with "sass-loader" and without source maps: errors 1`] = `Array []`; -exports[`loader should have same "contenthash" with "sass-loader" and without source maps: module 1`] = ` -Array [ - "main.9ae036ace8bbbebbd185.bundle.js", -] +/***/ }) + +/******/ });", +} `; -exports[`loader should have same "contenthash" with "sass-loader" and without source maps: warnings 1`] = `Array []`; +exports[`loader should have same "contenthash" with "sass-loader" and with source maps: warnings 1`] = `Array []`; diff --git a/test/loader.test.js b/test/loader.test.js index 5ce9522b..0a327be2 100644 --- a/test/loader.test.js +++ b/test/loader.test.js @@ -11,6 +11,7 @@ import { getExecutedCode, getModuleSource, getWarnings, + readsAssets, } from './helpers/index'; describe('loader', () => { @@ -309,7 +310,7 @@ describe('loader', () => { expect(getErrors(stats)).toMatchSnapshot('errors'); }); - it.only('should have same "contenthash" with "css-loader" and without source maps', async () => { + it('should have same "contenthash" with "css-loader" and without source maps', async () => { const compiler = getCompiler( './contenthash/basic-css.js', {}, @@ -342,7 +343,7 @@ describe('loader', () => { expect(getErrors(stats)).toMatchSnapshot('errors'); }); - it.only('should have same "contenthash" with "css-loader" and with source maps', async () => { + it('should have same "contenthash" with "css-loader" and with source maps', async () => { const compiler = getCompiler( './contenthash/basic-css.js', {}, @@ -375,7 +376,7 @@ describe('loader', () => { expect(getErrors(stats)).toMatchSnapshot('errors'); }); - it.only('should have same "contenthash" with "postcss-loader" and without source maps', async () => { + it('should have same "contenthash" with "postcss-loader" and without source maps', async () => { const compiler = getCompiler( './contenthash/basic-postcss.js', {}, @@ -418,7 +419,7 @@ describe('loader', () => { expect(getErrors(stats)).toMatchSnapshot('errors'); }); - it.only('should have same "contenthash" with "postcss-loader" and with source maps', async () => { + it('should have same "contenthash" with "postcss-loader" and with source maps', async () => { const compiler = getCompiler( './contenthash/basic-postcss.js', {}, @@ -461,7 +462,7 @@ describe('loader', () => { expect(getErrors(stats)).toMatchSnapshot('errors'); }); - it.only('should have same "contenthash" with "sass-loader" and without source maps', async () => { + it('should have same "contenthash" with "sass-loader" and without source maps', async () => { const compiler = getCompiler( './contenthash/basic-sass.js', {}, @@ -558,7 +559,7 @@ describe('loader', () => { ); const stats = await compile(compiler); - expect(Object.keys(stats.compilation.assets)).toMatchSnapshot('module'); + expect(readsAssets(compiler, stats)).toMatchSnapshot('module'); expect(getWarnings(stats)).toMatchSnapshot('warnings'); expect(getErrors(stats)).toMatchSnapshot('errors'); }); From 4c838e981863e465c9cf49a277ac998bc8f3cb9c Mon Sep 17 00:00:00 2001 From: evilebottnawi Date: Thu, 26 Dec 2019 19:52:22 +0300 Subject: [PATCH 4/5] test: check --- test/__snapshots__/loader.test.js.snap | 269 +++++-------------------- test/loader.test.js | 13 +- 2 files changed, 57 insertions(+), 225 deletions(-) diff --git a/test/__snapshots__/loader.test.js.snap b/test/__snapshots__/loader.test.js.snap index 938f0871..7e9c76ed 100644 --- a/test/__snapshots__/loader.test.js.snap +++ b/test/__snapshots__/loader.test.js.snap @@ -1,228 +1,61 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`loader should have same "contenthash" with "sass-loader" and with source maps: errors 1`] = `Array []`; +exports[`loader should have same "contenthash" with "css-loader" and with source maps: errors 1`] = `Array []`; -exports[`loader should have same "contenthash" with "sass-loader" and with source maps: module 1`] = ` -Object { - "main.a12ab765493c74c80be2.bundle.js": "/******/ (function(modules) { // webpackBootstrap -/******/ // The module cache -/******/ var installedModules = {}; -/******/ -/******/ // The require function -/******/ function __webpack_require__(moduleId) { -/******/ -/******/ // Check if module is in cache -/******/ if(installedModules[moduleId]) { -/******/ return installedModules[moduleId].exports; -/******/ } -/******/ // Create a new module (and put it into the cache) -/******/ var module = installedModules[moduleId] = { -/******/ i: moduleId, -/******/ l: false, -/******/ exports: {} -/******/ }; -/******/ -/******/ // Execute the module function -/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); -/******/ -/******/ // Flag the module as loaded -/******/ module.l = true; -/******/ -/******/ // Return the exports of the module -/******/ return module.exports; -/******/ } -/******/ -/******/ -/******/ // expose the modules object (__webpack_modules__) -/******/ __webpack_require__.m = modules; -/******/ -/******/ // expose the module cache -/******/ __webpack_require__.c = installedModules; -/******/ -/******/ // define getter function for harmony exports -/******/ __webpack_require__.d = function(exports, name, getter) { -/******/ if(!__webpack_require__.o(exports, name)) { -/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter }); -/******/ } -/******/ }; -/******/ -/******/ // define __esModule on exports -/******/ __webpack_require__.r = function(exports) { -/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) { -/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' }); -/******/ } -/******/ Object.defineProperty(exports, '__esModule', { value: true }); -/******/ }; -/******/ -/******/ // create a fake namespace object -/******/ // mode & 1: value is a module id, require it -/******/ // mode & 2: merge all properties of value into the ns -/******/ // mode & 4: return value when already ns object -/******/ // mode & 8|1: behave like require -/******/ __webpack_require__.t = function(value, mode) { -/******/ if(mode & 1) value = __webpack_require__(value); -/******/ if(mode & 8) return value; -/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value; -/******/ var ns = Object.create(null); -/******/ __webpack_require__.r(ns); -/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value }); -/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key)); -/******/ return ns; -/******/ }; -/******/ -/******/ // getDefaultExport function for compatibility with non-harmony modules -/******/ __webpack_require__.n = function(module) { -/******/ var getter = module && module.__esModule ? -/******/ function getDefault() { return module['default']; } : -/******/ function getModuleExports() { return module; }; -/******/ __webpack_require__.d(getter, 'a', getter); -/******/ return getter; -/******/ }; -/******/ -/******/ // Object.prototype.hasOwnProperty.call -/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); }; -/******/ -/******/ // __webpack_public_path__ -/******/ __webpack_require__.p = \\"/webpack/public/path/\\"; -/******/ -/******/ -/******/ // Load entry module and return exports -/******/ return __webpack_require__(__webpack_require__.s = \\"./contenthash/basic-sass.js\\"); -/******/ }) -/************************************************************************/ -/******/ ({ - -/***/ \\"../../src/runtime/api.js\\": -/*!**********************************************************************!*\\\\ - !*** /home/evilebottnawi/IdeaProjects/css-loader/src/runtime/api.js ***! - \\\\**********************************************************************/ -/*! no static exports found */ -/***/ (function(module, exports) { - -/* - MIT License http://www.opensource.org/licenses/mit-license.php - Author Tobias Koppers @sokra -*/ -// css base code, injected by the css-loader -// eslint-disable-next-line func-names -module.exports = function(useSourceMap) { - const list = []; - - // return the list of modules as css string - list.toString = function toString() { - return this.map((item) => { - const content = cssWithMappingToString(item, useSourceMap); - - if (item[2]) { - return \`@media \${item[2]} {\${content}}\`; - } - - return content; - }).join(''); - }; - - // import a list of modules into the list - // eslint-disable-next-line func-names - list.i = function(modules, mediaQuery) { - if (typeof modules === 'string') { - // eslint-disable-next-line no-param-reassign - modules = [[null, modules, '']]; - } - - for (let i = 0; i < modules.length; i++) { - const item = [].concat(modules[i]); - - if (mediaQuery) { - if (!item[2]) { - item[2] = mediaQuery; - } else { - item[2] = \`\${mediaQuery} and \${item[2]}\`; - } - } - - list.push(item); - } - }; - - return list; -}; - -function cssWithMappingToString(item, useSourceMap) { - const content = item[1] || ''; - // eslint-disable-next-line prefer-destructuring - const cssMapping = item[3]; - - if (!cssMapping) { - return content; - } - - if (useSourceMap && typeof btoa === 'function') { - const sourceMapping = toComment(cssMapping); - const sourceURLs = cssMapping.sources.map( - (source) => \`/*# sourceURL=\${cssMapping.sourceRoot}\${source} */\` - ); - - return [content] - .concat(sourceURLs) - .concat([sourceMapping]) - .join('\\\\n'); - } - - return [content].join('\\\\n'); -} - -// Adapted from convert-source-map (MIT) -function toComment(sourceMap) { - // eslint-disable-next-line no-undef - const base64 = btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap)))); - const data = \`sourceMappingURL=data:application/json;charset=utf-8;base64,\${base64}\`; - - return \`/*# \${data} */\`; -} - - -/***/ }), - -/***/ \\"./contenthash/basic-sass.js\\": -/*!***********************************!*\\\\ - !*** ./contenthash/basic-sass.js ***! - \\\\***********************************/ -/*! exports provided: default */ -/***/ (function(module, __webpack_exports__, __webpack_require__) { - -\\"use strict\\"; -__webpack_require__.r(__webpack_exports__); -/* harmony import */ var _basic_scss__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./basic.scss */ \\"./contenthash/basic.scss\\"); -/* harmony import */ var _basic_scss__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_basic_scss__WEBPACK_IMPORTED_MODULE_0__); - - -__export__ = _basic_scss__WEBPACK_IMPORTED_MODULE_0___default.a; - -/* harmony default export */ __webpack_exports__[\\"default\\"] = (_basic_scss__WEBPACK_IMPORTED_MODULE_0___default.a); - - -/***/ }), - -/***/ \\"./contenthash/basic.scss\\": -/*!********************************!*\\\\ - !*** ./contenthash/basic.scss ***! - \\\\********************************/ -/*! no static exports found */ -/***/ (function(module, exports, __webpack_require__) { +exports[`loader should have same "contenthash" with "css-loader" and with source maps: module 1`] = ` +Array [ + "main.54b9712c1981e48c12c4.bundle.js", +] +`; + +exports[`loader should have same "contenthash" with "css-loader" and with source maps: warnings 1`] = `Array []`; + +exports[`loader should have same "contenthash" with "css-loader" and without source maps: errors 1`] = `Array []`; + +exports[`loader should have same "contenthash" with "css-loader" and without source maps: module 1`] = ` +Array [ + "main.b38d5f87c88c55a4258e.bundle.js", +] +`; + +exports[`loader should have same "contenthash" with "css-loader" and without source maps: warnings 1`] = `Array []`; + +exports[`loader should have same "contenthash" with "postcss-loader" and with source maps: errors 1`] = `Array []`; + +exports[`loader should have same "contenthash" with "postcss-loader" and with source maps: module 1`] = ` +Array [ + "main.d77dd6564bc6e6297cd4.bundle.js", +] +`; + +exports[`loader should have same "contenthash" with "postcss-loader" and with source maps: warnings 1`] = `Array []`; -// Imports -var ___CSS_LOADER_API_IMPORT___ = __webpack_require__(/*! ../../../src/runtime/api.js */ \\"../../src/runtime/api.js\\"); -exports = ___CSS_LOADER_API_IMPORT___(true); -// Module -exports.push([module.i, \\"a {\\\\n color: red;\\\\n}\\\\na:hover {\\\\n color: red;\\\\n}\\", \\"\\",{\\"version\\":3,\\"sources\\":[\\"./contenthash/basic.scss\\",\\"basic.scss\\"],\\"names\\":[],\\"mappings\\":\\"AAEA;EACE,UAHI;ACEN;ADGE;EACE,UANE;ACKN\\",\\"file\\":\\"basic.scss\\",\\"sourcesContent\\":[\\"$var: red;\\\\n\\\\na {\\\\n color: $var;\\\\n\\\\n &:hover {\\\\n color: $var;\\\\n }\\\\n}\\\\n\\",\\"a {\\\\n color: red;\\\\n}\\\\na:hover {\\\\n color: red;\\\\n}\\"]}]); -// Exports -module.exports = exports; +exports[`loader should have same "contenthash" with "postcss-loader" and without source maps: errors 1`] = `Array []`; +exports[`loader should have same "contenthash" with "postcss-loader" and without source maps: module 1`] = ` +Array [ + "main.f8e62206a43c13393798.bundle.js", +] +`; -/***/ }) +exports[`loader should have same "contenthash" with "postcss-loader" and without source maps: warnings 1`] = `Array []`; + +exports[`loader should have same "contenthash" with "sass-loader" and with source maps: errors 1`] = `Array []`; -/******/ });", -} +exports[`loader should have same "contenthash" with "sass-loader" and with source maps: module 1`] = ` +Array [ + "main.a12ab765493c74c80be2.bundle.js", +] `; exports[`loader should have same "contenthash" with "sass-loader" and with source maps: warnings 1`] = `Array []`; + +exports[`loader should have same "contenthash" with "sass-loader" and without source maps: errors 1`] = `Array []`; + +exports[`loader should have same "contenthash" with "sass-loader" and without source maps: module 1`] = ` +Array [ + "main.9ae036ace8bbbebbd185.bundle.js", +] +`; + +exports[`loader should have same "contenthash" with "sass-loader" and without source maps: warnings 1`] = `Array []`; diff --git a/test/loader.test.js b/test/loader.test.js index 0a327be2..5ce9522b 100644 --- a/test/loader.test.js +++ b/test/loader.test.js @@ -11,7 +11,6 @@ import { getExecutedCode, getModuleSource, getWarnings, - readsAssets, } from './helpers/index'; describe('loader', () => { @@ -310,7 +309,7 @@ describe('loader', () => { expect(getErrors(stats)).toMatchSnapshot('errors'); }); - it('should have same "contenthash" with "css-loader" and without source maps', async () => { + it.only('should have same "contenthash" with "css-loader" and without source maps', async () => { const compiler = getCompiler( './contenthash/basic-css.js', {}, @@ -343,7 +342,7 @@ describe('loader', () => { expect(getErrors(stats)).toMatchSnapshot('errors'); }); - it('should have same "contenthash" with "css-loader" and with source maps', async () => { + it.only('should have same "contenthash" with "css-loader" and with source maps', async () => { const compiler = getCompiler( './contenthash/basic-css.js', {}, @@ -376,7 +375,7 @@ describe('loader', () => { expect(getErrors(stats)).toMatchSnapshot('errors'); }); - it('should have same "contenthash" with "postcss-loader" and without source maps', async () => { + it.only('should have same "contenthash" with "postcss-loader" and without source maps', async () => { const compiler = getCompiler( './contenthash/basic-postcss.js', {}, @@ -419,7 +418,7 @@ describe('loader', () => { expect(getErrors(stats)).toMatchSnapshot('errors'); }); - it('should have same "contenthash" with "postcss-loader" and with source maps', async () => { + it.only('should have same "contenthash" with "postcss-loader" and with source maps', async () => { const compiler = getCompiler( './contenthash/basic-postcss.js', {}, @@ -462,7 +461,7 @@ describe('loader', () => { expect(getErrors(stats)).toMatchSnapshot('errors'); }); - it('should have same "contenthash" with "sass-loader" and without source maps', async () => { + it.only('should have same "contenthash" with "sass-loader" and without source maps', async () => { const compiler = getCompiler( './contenthash/basic-sass.js', {}, @@ -559,7 +558,7 @@ describe('loader', () => { ); const stats = await compile(compiler); - expect(readsAssets(compiler, stats)).toMatchSnapshot('module'); + expect(Object.keys(stats.compilation.assets)).toMatchSnapshot('module'); expect(getWarnings(stats)).toMatchSnapshot('warnings'); expect(getErrors(stats)).toMatchSnapshot('errors'); }); From 178821a18ca8edc9f4762e7e7d976617b66dca8a Mon Sep 17 00:00:00 2001 From: evilebottnawi Date: Fri, 27 Dec 2019 12:16:33 +0300 Subject: [PATCH 5/5] test: check --- test/__snapshots__/loader.test.js.snap | 709 ++++++++++++++++++++++++- test/loader.test.js | 66 ++- 2 files changed, 740 insertions(+), 35 deletions(-) diff --git a/test/__snapshots__/loader.test.js.snap b/test/__snapshots__/loader.test.js.snap index 7e9c76ed..826e60ad 100644 --- a/test/__snapshots__/loader.test.js.snap +++ b/test/__snapshots__/loader.test.js.snap @@ -2,60 +2,723 @@ exports[`loader should have same "contenthash" with "css-loader" and with source maps: errors 1`] = `Array []`; -exports[`loader should have same "contenthash" with "css-loader" and with source maps: module 1`] = ` +exports[`loader should have same "contenthash" with "css-loader" and with source maps: warnings 1`] = `Array []`; + +exports[`loader should have same "contenthash" with "css-loader" and without source maps: errors 1`] = `Array []`; + +exports[`loader should have same "contenthash" with "css-loader" and without source maps: warnings 1`] = `Array []`; + +exports[`loader should have same "contenthash" with "postcss-loader" and with source maps: errors 1`] = `Array []`; + +exports[`loader should have same "contenthash" with "postcss-loader" and with source maps: warnings 1`] = `Array []`; + +exports[`loader should have same "contenthash" with "postcss-loader" and without source maps: errors 1`] = `Array []`; + +exports[`loader should have same "contenthash" with "postcss-loader" and without source maps: warnings 1`] = `Array []`; + +exports[`loader should have same "contenthash" with "sass-loader" and with source maps: errors 1`] = `Array []`; + +exports[`loader should have same "contenthash" with "sass-loader" and with source maps: warnings 1`] = `Array []`; + +exports[`loader should have same "contenthash" with "sass-loader" and without source maps: errors 1`] = `Array []`; + +exports[`loader should have same "contenthash" with "sass-loader" and without source maps: warnings 1`] = `Array []`; + +exports[`loader should reuse \`ast\` from "postcss-loader": errors 1`] = `Array []`; + +exports[`loader should reuse \`ast\` from "postcss-loader": module 1`] = ` +"// Imports +var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../src/runtime/api.js\\"); +var ___CSS_LOADER_GET_URL_IMPORT___ = require(\\"../../../src/runtime/getUrl.js\\"); +var ___CSS_LOADER_URL_IMPORT_0___ = require(\\"./img1x.png\\"); +var ___CSS_LOADER_URL_IMPORT_1___ = require(\\"./img2x.png\\"); +exports = ___CSS_LOADER_API_IMPORT___(false); +var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___); +var ___CSS_LOADER_URL_REPLACEMENT_1___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_1___); +// Module +exports.push([module.id, \\":root {\\\\n --fontSize: 1rem;\\\\n --mainColor: rgba(18,52,86,0.47059);\\\\n --secondaryColor: rgba(102, 51, 153, 0.9);\\\\n}\\\\n\\\\nhtml {\\\\n overflow-x: hidden;\\\\n overflow-y: auto;\\\\n overflow: hidden auto;\\\\n}\\\\n\\\\n@media (max-width: 50rem) {\\\\n body {\\\\n color: rgba(18,52,86,0.47059);\\\\n color: var(--mainColor);\\\\n font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif;\\\\n font-size: 1rem;\\\\n font-size: var(--fontSize);\\\\n line-height: calc(1rem * 1.5);\\\\n line-height: calc(var(--fontSize) * 1.5);\\\\n word-wrap: break-word;\\\\n padding-left: calc(1rem / 2 + 1px);\\\\n padding-right: calc(1rem / 2 + 1px);\\\\n padding-left: calc(var(--fontSize) / 2 + 1px);\\\\n padding-right: calc(var(--fontSize) / 2 + 1px);\\\\n }\\\\n}\\\\n\\\\nh1,h2,h3,h4,h5,h6 {\\\\n margin-top: 0;\\\\n margin-bottom: 0;\\\\n}\\\\n\\\\nmain.hero, .hero.main {\\\\n background-image: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\\\n@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {\\\\n\\\\nmain.hero, .hero.main {\\\\n background-image: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_1___ + \\");\\\\n}\\\\n}\\\\n\\\\nmain.hero, .hero.main {\\\\n background-image: -webkit-image-set(url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\") 1x, url(\\" + ___CSS_LOADER_URL_REPLACEMENT_1___ + \\") 2x);\\\\n background-image: image-set(url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\") 1x, url(\\" + ___CSS_LOADER_URL_REPLACEMENT_1___ + \\") 2x);\\\\n}\\\\n\\\\na {\\\\n color: rgba(0, 0, 255, 0.9)\\\\n}\\\\n\\\\na:hover {\\\\n color: #639;\\\\n }\\\\n\\", \\"\\"]); +// Exports +module.exports = exports; +" +`; + +exports[`loader should reuse \`ast\` from "postcss-loader": result 1`] = ` Array [ - "main.54b9712c1981e48c12c4.bundle.js", + Array [ + "./postcss-present-env/source.css", + ":root { + --fontSize: 1rem; + --mainColor: rgba(18,52,86,0.47059); + --secondaryColor: rgba(102, 51, 153, 0.9); +} + +html { + overflow-x: hidden; + overflow-y: auto; + overflow: hidden auto; +} + +@media (max-width: 50rem) { + body { + color: rgba(18,52,86,0.47059); + color: var(--mainColor); + font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif; + font-size: 1rem; + font-size: var(--fontSize); + line-height: calc(1rem * 1.5); + line-height: calc(var(--fontSize) * 1.5); + word-wrap: break-word; + padding-left: calc(1rem / 2 + 1px); + padding-right: calc(1rem / 2 + 1px); + padding-left: calc(var(--fontSize) / 2 + 1px); + padding-right: calc(var(--fontSize) / 2 + 1px); + } +} + +h1,h2,h3,h4,h5,h6 { + margin-top: 0; + margin-bottom: 0; +} + +main.hero, .hero.main { + background-image: url(/webpack/public/path/img1x.png); +} + +@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { + +main.hero, .hero.main { + background-image: url(/webpack/public/path/img2x.png); +} +} + +main.hero, .hero.main { + background-image: -webkit-image-set(url(/webpack/public/path/img1x.png) 1x, url(/webpack/public/path/img2x.png) 2x); + background-image: image-set(url(/webpack/public/path/img1x.png) 1x, url(/webpack/public/path/img2x.png) 2x); +} + +a { + color: rgba(0, 0, 255, 0.9) +} + +a:hover { + color: #639; + } +", + "", + ], ] `; -exports[`loader should have same "contenthash" with "css-loader" and with source maps: warnings 1`] = `Array []`; +exports[`loader should reuse \`ast\` from "postcss-loader": warnings 1`] = `Array []`; -exports[`loader should have same "contenthash" with "css-loader" and without source maps: errors 1`] = `Array []`; +exports[`loader should throw error on invalid css syntax: errors 1`] = ` +Array [ + "ModuleBuildError: Module build failed (from \`replaced original path\`): +CssSyntaxError + +(2:3) Unknown word + + 1 | .some { +> 2 | invalid css; + | ^ + 3 | } + 4 | +", +] +`; + +exports[`loader should throw error on invalid css syntax: warnings 1`] = `Array []`; -exports[`loader should have same "contenthash" with "css-loader" and without source maps: module 1`] = ` +exports[`loader should throws error when no loader(s) for assets: errors 1`] = ` Array [ - "main.b38d5f87c88c55a4258e.bundle.js", + "ModuleParseError: Module parse failed: Unexpected character '�' (1:0) +You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders +(Source code omitted for this binary file)", ] `; -exports[`loader should have same "contenthash" with "css-loader" and without source maps: warnings 1`] = `Array []`; +exports[`loader should throws error when no loader(s) for assets: warnings 1`] = `Array []`; -exports[`loader should have same "contenthash" with "postcss-loader" and with source maps: errors 1`] = `Array []`; +exports[`loader should work with "asset" module type: errors 1`] = `Array []`; + +exports[`loader should work with "asset" module type: module 1`] = ` +"// Imports +var ___CSS_LOADER_API_IMPORT___ = require(\\"../../src/runtime/api.js\\"); +var ___CSS_LOADER_AT_RULE_IMPORT_0___ = require(\\"-!../../src/index.js!./imported.css\\"); +var ___CSS_LOADER_GET_URL_IMPORT___ = require(\\"../../src/runtime/getUrl.js\\"); +var ___CSS_LOADER_URL_IMPORT_0___ = require(\\"./url/img.png\\"); +exports = ___CSS_LOADER_API_IMPORT___(false); +exports.i(___CSS_LOADER_AT_RULE_IMPORT_0___); +var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___); +// Module +exports.push([module.id, \\"@charset \\\\\\"UTF-8\\\\\\";\\\\n\\\\n/* Comment */\\\\n\\\\n.class {\\\\n color: red;\\\\n background: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\\\n.class-duplicate-url {\\\\n background: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\\\n:root {\\\\n --foo: 1px;\\\\n --bar: 2px;\\\\n}\\\\n\\\\n.class { a: b c d; }\\\\n\\\\n.two {}\\\\n\\\\n.u-m\\\\\\\\+ { a: b c d; }\\\\n\\\\n.class { content: \\\\\\"\\\\\\\\F10C\\\\\\" }\\\\n\\\\n@media only screen and (max-width: 600px) {\\\\n body {\\\\n background-color: lightblue;\\\\n }\\\\n}\\\\n\\\\n.class {\\\\n content: \\\\\\"\\\\\\\\2193\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2193\\\\\\\\2193\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2193 \\\\\\\\2193\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2193\\\\\\\\2193\\\\\\\\2193\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2193 \\\\\\\\2193 \\\\\\\\2193\\\\\\";\\\\n}\\\\n\\\\n.-top {}\\\\n.\\\\\\\\-top {}\\\\n\\\\n#\\\\\\\\#test {}\\\\n\\\\n.grid {\\\\n display: flex;\\\\n flex-wrap: wrap;\\\\n}\\\\n.grid.\\\\\\\\-top {\\\\n align-items: flex-start;\\\\n}\\\\n.grid.-top {\\\\n align-items: flex-start;\\\\n}\\\\n.grid.\\\\\\\\-middle {\\\\n align-items: center;\\\\n}\\\\n.grid.\\\\\\\\-bottom {\\\\n align-items: flex-end;\\\\n}\\\\n\\\\n.u-m\\\\\\\\00002b {}\\\\n\\\\n.u-m00002b {}\\\\n\\\\n#u-m\\\\\\\\+ {}\\\\n\\\\nbody {\\\\n font-family: '微软雅黑'; /* some chinese font name */\\\\n}\\\\n\\\\n.myStyle {\\\\n content: '\\\\\\\\e901';\\\\n}\\\\n\\\\n.myStyle {\\\\n content: '\\\\\\\\E901';\\\\n}\\\\n\\\\n.♫ {}\\\\n\\\\n.\\\\\\\\3A \\\\\\\\\`\\\\\\\\( {} /* matches elements with class=\\\\\\":\`(\\\\\\" */\\\\n.\\\\\\\\31 a2b3c {} /* matches elements with class=\\\\\\"1a2b3c\\\\\\" */\\\\n#\\\\\\\\#fake-id {} /* matches the element with id=\\\\\\"#fake-id\\\\\\" */\\\\n#-a-b-c- {} /* matches the element with id=\\\\\\"-a-b-c-\\\\\\" */\\\\n#© {} /* matches the element with id=\\\\\\"©\\\\\\" */\\\\n\\\\n:root {\\\\n --title-align: center;\\\\n --sr-only: {\\\\n position: absolute;\\\\n width: 1px;\\\\n height: 1px;\\\\n padding: 0;\\\\n overflow: hidden;\\\\n clip: rect(0,0,0,0);\\\\n white-space: nowrap;\\\\n clip-path: inset(50%);\\\\n border: 0;\\\\n };\\\\n}\\\\n\\\\n.test {\\\\n content: \\\\\\"\\\\\\\\2014\\\\\\\\A0\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2014 \\\\\\\\A0\\\\\\";\\\\n content: \\\\\\"\\\\\\\\A0 \\\\\\\\2014\\\\\\";\\\\n content: \\\\\\"\\\\\\\\A0\\\\\\\\2014\\\\\\";\\\\n margin-top: 1px\\\\\\\\9;\\\\n background-color: #000\\\\\\\\9;\\\\n}\\\\n\\\\n.light.on .bulb:before{\\\\n content: '💡';\\\\n}\\\\n\\\\n.base64 {\\\\n background: url(data:img/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAhxJREFUSA3tk71rU1EYxnMTEoJUkowWwdJ2akEHBfGjCiIF6ZylVUKSm2TqZLGI+A/oIu2UXm8C4lAyF4SWji0tdFLo1Eo7VN0SaBEhH7e/Nz0nPTfGOjiaCyfPc5734zlfCQT6X/8E/vUErL81KBaL9y3LSnued5PcITjUOwR3gsFg2bbtjYt6/NGgXC4P1et1l2aPLmpAbD0SidjpdPqgV15PA9d17zQajU8UxHQRK/4G35Q5pveAK8LlI1ZjPMnlcltnyvnvbwaO41xvtVqy7YHztMACq5xnlb9EY3dRdvcGo1kj5wR+t1AofDG0gM+A875E8DNjRCexsrV8Pj9ZqVQitVrtqejxePxjMpmss5hVTB4buXvMb2DyU2tBTRS+BjvNlVYUpPl7iuVO3Gq1uoQx1FtSOW1gPgp5ZWrdBtNmUDgv5asgxQ8F1af5vhY0YjyjuWC3wTszKJz7GBOkcFlQfW2ONq4FjWi+Hj6DRCKxQOK2TlY4x92EuYd5dvMAbYIzfikau3pu5tJ8KxaLLfo0cyKci7tK4TZjUMcoXAmHwzle0Q/RaC5P1GFMyVx9R9Fo9HYqlTrSgqDvFelAqVQa5hmuMR/WGtjAaBdjwBoDQ0ZsnwVMZjKZ9n0Zem8DSeDPdrnZbL6F2l3NOvUYNZk4oVDoRTabPe4EDNJzB0ZcjAYxeoZ2i3FNxQ7BHYw/cB/fldaH//UETgHHO8S44KbfXgAAAABJRU5ErkJggg==);\\\\n}\\\\n\\\\na[href=''] {\\\\n color: red;\\\\n}\\\\n\\\\na[href='' i] {\\\\n color: red;\\\\n}\\\\n\\\\na[href=\\\\\\"\\\\\\"] {\\\\n color: blue;\\\\n}\\\\n\\\\na[href=\\\\\\"\\\\\\" i] {\\\\n color: blue;\\\\n}\\\\n\\", \\"\\"]); +// Exports +module.exports = exports; +" +`; -exports[`loader should have same "contenthash" with "postcss-loader" and with source maps: module 1`] = ` +exports[`loader should work with "asset" module type: result 1`] = ` Array [ - "main.d77dd6564bc6e6297cd4.bundle.js", + Array [ + "../../src/index.js!./imported.css", + ".foo { + color: red; +} +", + "", + ], + Array [ + "./basic.css", + "@charset \\"UTF-8\\"; + +/* Comment */ + +.class { + color: red; + background: url(/webpack/public/path/img.png); +} + +.class-duplicate-url { + background: url(/webpack/public/path/img.png); +} + +:root { + --foo: 1px; + --bar: 2px; +} + +.class { a: b c d; } + +.two {} + +.u-m\\\\+ { a: b c d; } + +.class { content: \\"\\\\F10C\\" } + +@media only screen and (max-width: 600px) { + body { + background-color: lightblue; + } +} + +.class { + content: \\"\\\\2193\\"; + content: \\"\\\\2193\\\\2193\\"; + content: \\"\\\\2193 \\\\2193\\"; + content: \\"\\\\2193\\\\2193\\\\2193\\"; + content: \\"\\\\2193 \\\\2193 \\\\2193\\"; +} + +.-top {} +.\\\\-top {} + +#\\\\#test {} + +.grid { + display: flex; + flex-wrap: wrap; +} +.grid.\\\\-top { + align-items: flex-start; +} +.grid.-top { + align-items: flex-start; +} +.grid.\\\\-middle { + align-items: center; +} +.grid.\\\\-bottom { + align-items: flex-end; +} + +.u-m\\\\00002b {} + +.u-m00002b {} + +#u-m\\\\+ {} + +body { + font-family: '微软雅黑'; /* some chinese font name */ +} + +.myStyle { + content: '\\\\e901'; +} + +.myStyle { + content: '\\\\E901'; +} + +.♫ {} + +.\\\\3A \\\\\`\\\\( {} /* matches elements with class=\\":\`(\\" */ +.\\\\31 a2b3c {} /* matches elements with class=\\"1a2b3c\\" */ +#\\\\#fake-id {} /* matches the element with id=\\"#fake-id\\" */ +#-a-b-c- {} /* matches the element with id=\\"-a-b-c-\\" */ +#© {} /* matches the element with id=\\"©\\" */ + +:root { + --title-align: center; + --sr-only: { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + overflow: hidden; + clip: rect(0,0,0,0); + white-space: nowrap; + clip-path: inset(50%); + border: 0; + }; +} + +.test { + content: \\"\\\\2014\\\\A0\\"; + content: \\"\\\\2014 \\\\A0\\"; + content: \\"\\\\A0 \\\\2014\\"; + content: \\"\\\\A0\\\\2014\\"; + margin-top: 1px\\\\9; + background-color: #000\\\\9; +} + +.light.on .bulb:before{ + content: '💡'; +} + +.base64 { + background: url(data:img/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAhxJREFUSA3tk71rU1EYxnMTEoJUkowWwdJ2akEHBfGjCiIF6ZylVUKSm2TqZLGI+A/oIu2UXm8C4lAyF4SWji0tdFLo1Eo7VN0SaBEhH7e/Nz0nPTfGOjiaCyfPc5734zlfCQT6X/8E/vUErL81KBaL9y3LSnued5PcITjUOwR3gsFg2bbtjYt6/NGgXC4P1et1l2aPLmpAbD0SidjpdPqgV15PA9d17zQajU8UxHQRK/4G35Q5pveAK8LlI1ZjPMnlcltnyvnvbwaO41xvtVqy7YHztMACq5xnlb9EY3dRdvcGo1kj5wR+t1AofDG0gM+A875E8DNjRCexsrV8Pj9ZqVQitVrtqejxePxjMpmss5hVTB4buXvMb2DyU2tBTRS+BjvNlVYUpPl7iuVO3Gq1uoQx1FtSOW1gPgp5ZWrdBtNmUDgv5asgxQ8F1af5vhY0YjyjuWC3wTszKJz7GBOkcFlQfW2ONq4FjWi+Hj6DRCKxQOK2TlY4x92EuYd5dvMAbYIzfikau3pu5tJ8KxaLLfo0cyKci7tK4TZjUMcoXAmHwzle0Q/RaC5P1GFMyVx9R9Fo9HYqlTrSgqDvFelAqVQa5hmuMR/WGtjAaBdjwBoDQ0ZsnwVMZjKZ9n0Zem8DSeDPdrnZbL6F2l3NOvUYNZk4oVDoRTabPe4EDNJzB0ZcjAYxeoZ2i3FNxQ7BHYw/cB/fldaH//UETgHHO8S44KbfXgAAAABJRU5ErkJggg==); +} + +a[href=''] { + color: red; +} + +a[href='' i] { + color: red; +} + +a[href=\\"\\"] { + color: blue; +} + +a[href=\\"\\" i] { + color: blue; +} +", + "", + ], ] `; -exports[`loader should have same "contenthash" with "postcss-loader" and with source maps: warnings 1`] = `Array []`; +exports[`loader should work with "asset" module type: warnings 1`] = `Array []`; -exports[`loader should have same "contenthash" with "postcss-loader" and without source maps: errors 1`] = `Array []`; +exports[`loader should work with "sass-loader": errors 1`] = `Array []`; -exports[`loader should have same "contenthash" with "postcss-loader" and without source maps: module 1`] = ` +exports[`loader should work with "sass-loader": module 1`] = ` +"// Imports +var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../src/runtime/api.js\\"); +exports = ___CSS_LOADER_API_IMPORT___(false); +// Module +exports.push([module.id, \\"body {\\\\n font: 100% Helvetica, sans-serif;\\\\n color: #333;\\\\n}\\", \\"\\"]); +// Exports +module.exports = exports; +" +`; + +exports[`loader should work with "sass-loader": result 1`] = ` Array [ - "main.f8e62206a43c13393798.bundle.js", + Array [ + "./scss/source.scss", + "body { + font: 100% Helvetica, sans-serif; + color: #333; +}", + "", + ], ] `; -exports[`loader should have same "contenthash" with "postcss-loader" and without source maps: warnings 1`] = `Array []`; +exports[`loader should work with "sass-loader": warnings 1`] = `Array []`; -exports[`loader should have same "contenthash" with "sass-loader" and with source maps: errors 1`] = `Array []`; +exports[`loader should work with ModuleConcatenationPlugin (file-loader): errors 1`] = `Array []`; + +exports[`loader should work with ModuleConcatenationPlugin (file-loader): warnings 1`] = `Array []`; + +exports[`loader should work with ModuleConcatenationPlugin (url-loader): errors 1`] = `Array []`; + +exports[`loader should work with ModuleConcatenationPlugin (url-loader): warnings 1`] = `Array []`; + +exports[`loader should work with ModuleConcatenationPlugin: errors 1`] = `Array []`; -exports[`loader should have same "contenthash" with "sass-loader" and with source maps: module 1`] = ` +exports[`loader should work with ModuleConcatenationPlugin: warnings 1`] = `Array []`; + +exports[`loader should work with empty css: errors 1`] = `Array []`; + +exports[`loader should work with empty css: module 1`] = ` +"// Imports +var ___CSS_LOADER_API_IMPORT___ = require(\\"../../src/runtime/api.js\\"); +exports = ___CSS_LOADER_API_IMPORT___(false); +// Module +exports.push([module.id, \\"\\", \\"\\"]); +// Exports +module.exports = exports; +" +`; + +exports[`loader should work with empty css: result 1`] = ` Array [ - "main.a12ab765493c74c80be2.bundle.js", + Array [ + "./empty.css", + "", + "", + ], ] `; -exports[`loader should have same "contenthash" with "sass-loader" and with source maps: warnings 1`] = `Array []`; +exports[`loader should work with empty css: warnings 1`] = `Array []`; -exports[`loader should have same "contenthash" with "sass-loader" and without source maps: errors 1`] = `Array []`; +exports[`loader should work with empty options: errors 1`] = `Array []`; + +exports[`loader should work with empty options: module 1`] = ` +"// Imports +var ___CSS_LOADER_API_IMPORT___ = require(\\"../../src/runtime/api.js\\"); +var ___CSS_LOADER_AT_RULE_IMPORT_0___ = require(\\"-!../../src/index.js??[ident]!./imported.css\\"); +var ___CSS_LOADER_GET_URL_IMPORT___ = require(\\"../../src/runtime/getUrl.js\\"); +var ___CSS_LOADER_URL_IMPORT_0___ = require(\\"./url/img.png\\"); +exports = ___CSS_LOADER_API_IMPORT___(false); +exports.i(___CSS_LOADER_AT_RULE_IMPORT_0___); +var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___); +// Module +exports.push([module.id, \\"@charset \\\\\\"UTF-8\\\\\\";\\\\n\\\\n/* Comment */\\\\n\\\\n.class {\\\\n color: red;\\\\n background: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\\\n.class-duplicate-url {\\\\n background: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\\\n:root {\\\\n --foo: 1px;\\\\n --bar: 2px;\\\\n}\\\\n\\\\n.class { a: b c d; }\\\\n\\\\n.two {}\\\\n\\\\n.u-m\\\\\\\\+ { a: b c d; }\\\\n\\\\n.class { content: \\\\\\"\\\\\\\\F10C\\\\\\" }\\\\n\\\\n@media only screen and (max-width: 600px) {\\\\n body {\\\\n background-color: lightblue;\\\\n }\\\\n}\\\\n\\\\n.class {\\\\n content: \\\\\\"\\\\\\\\2193\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2193\\\\\\\\2193\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2193 \\\\\\\\2193\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2193\\\\\\\\2193\\\\\\\\2193\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2193 \\\\\\\\2193 \\\\\\\\2193\\\\\\";\\\\n}\\\\n\\\\n.-top {}\\\\n.\\\\\\\\-top {}\\\\n\\\\n#\\\\\\\\#test {}\\\\n\\\\n.grid {\\\\n display: flex;\\\\n flex-wrap: wrap;\\\\n}\\\\n.grid.\\\\\\\\-top {\\\\n align-items: flex-start;\\\\n}\\\\n.grid.-top {\\\\n align-items: flex-start;\\\\n}\\\\n.grid.\\\\\\\\-middle {\\\\n align-items: center;\\\\n}\\\\n.grid.\\\\\\\\-bottom {\\\\n align-items: flex-end;\\\\n}\\\\n\\\\n.u-m\\\\\\\\00002b {}\\\\n\\\\n.u-m00002b {}\\\\n\\\\n#u-m\\\\\\\\+ {}\\\\n\\\\nbody {\\\\n font-family: '微软雅黑'; /* some chinese font name */\\\\n}\\\\n\\\\n.myStyle {\\\\n content: '\\\\\\\\e901';\\\\n}\\\\n\\\\n.myStyle {\\\\n content: '\\\\\\\\E901';\\\\n}\\\\n\\\\n.♫ {}\\\\n\\\\n.\\\\\\\\3A \\\\\\\\\`\\\\\\\\( {} /* matches elements with class=\\\\\\":\`(\\\\\\" */\\\\n.\\\\\\\\31 a2b3c {} /* matches elements with class=\\\\\\"1a2b3c\\\\\\" */\\\\n#\\\\\\\\#fake-id {} /* matches the element with id=\\\\\\"#fake-id\\\\\\" */\\\\n#-a-b-c- {} /* matches the element with id=\\\\\\"-a-b-c-\\\\\\" */\\\\n#© {} /* matches the element with id=\\\\\\"©\\\\\\" */\\\\n\\\\n:root {\\\\n --title-align: center;\\\\n --sr-only: {\\\\n position: absolute;\\\\n width: 1px;\\\\n height: 1px;\\\\n padding: 0;\\\\n overflow: hidden;\\\\n clip: rect(0,0,0,0);\\\\n white-space: nowrap;\\\\n clip-path: inset(50%);\\\\n border: 0;\\\\n };\\\\n}\\\\n\\\\n.test {\\\\n content: \\\\\\"\\\\\\\\2014\\\\\\\\A0\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2014 \\\\\\\\A0\\\\\\";\\\\n content: \\\\\\"\\\\\\\\A0 \\\\\\\\2014\\\\\\";\\\\n content: \\\\\\"\\\\\\\\A0\\\\\\\\2014\\\\\\";\\\\n margin-top: 1px\\\\\\\\9;\\\\n background-color: #000\\\\\\\\9;\\\\n}\\\\n\\\\n.light.on .bulb:before{\\\\n content: '💡';\\\\n}\\\\n\\\\n.base64 {\\\\n background: url(data:img/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAhxJREFUSA3tk71rU1EYxnMTEoJUkowWwdJ2akEHBfGjCiIF6ZylVUKSm2TqZLGI+A/oIu2UXm8C4lAyF4SWji0tdFLo1Eo7VN0SaBEhH7e/Nz0nPTfGOjiaCyfPc5734zlfCQT6X/8E/vUErL81KBaL9y3LSnued5PcITjUOwR3gsFg2bbtjYt6/NGgXC4P1et1l2aPLmpAbD0SidjpdPqgV15PA9d17zQajU8UxHQRK/4G35Q5pveAK8LlI1ZjPMnlcltnyvnvbwaO41xvtVqy7YHztMACq5xnlb9EY3dRdvcGo1kj5wR+t1AofDG0gM+A875E8DNjRCexsrV8Pj9ZqVQitVrtqejxePxjMpmss5hVTB4buXvMb2DyU2tBTRS+BjvNlVYUpPl7iuVO3Gq1uoQx1FtSOW1gPgp5ZWrdBtNmUDgv5asgxQ8F1af5vhY0YjyjuWC3wTszKJz7GBOkcFlQfW2ONq4FjWi+Hj6DRCKxQOK2TlY4x92EuYd5dvMAbYIzfikau3pu5tJ8KxaLLfo0cyKci7tK4TZjUMcoXAmHwzle0Q/RaC5P1GFMyVx9R9Fo9HYqlTrSgqDvFelAqVQa5hmuMR/WGtjAaBdjwBoDQ0ZsnwVMZjKZ9n0Zem8DSeDPdrnZbL6F2l3NOvUYNZk4oVDoRTabPe4EDNJzB0ZcjAYxeoZ2i3FNxQ7BHYw/cB/fldaH//UETgHHO8S44KbfXgAAAABJRU5ErkJggg==);\\\\n}\\\\n\\\\na[href=''] {\\\\n color: red;\\\\n}\\\\n\\\\na[href='' i] {\\\\n color: red;\\\\n}\\\\n\\\\na[href=\\\\\\"\\\\\\"] {\\\\n color: blue;\\\\n}\\\\n\\\\na[href=\\\\\\"\\\\\\" i] {\\\\n color: blue;\\\\n}\\\\n\\", \\"\\"]); +// Exports +module.exports = exports; +" +`; + +exports[`loader should work with empty options: result 1`] = ` +Array [ + Array [ + "../../src/index.js?[ident]!./imported.css", + ".foo { + color: red; +} +", + "", + ], + Array [ + "./basic.css", + "@charset \\"UTF-8\\"; + +/* Comment */ + +.class { + color: red; + background: url(/webpack/public/path/img.png); +} + +.class-duplicate-url { + background: url(/webpack/public/path/img.png); +} + +:root { + --foo: 1px; + --bar: 2px; +} + +.class { a: b c d; } + +.two {} + +.u-m\\\\+ { a: b c d; } + +.class { content: \\"\\\\F10C\\" } + +@media only screen and (max-width: 600px) { + body { + background-color: lightblue; + } +} + +.class { + content: \\"\\\\2193\\"; + content: \\"\\\\2193\\\\2193\\"; + content: \\"\\\\2193 \\\\2193\\"; + content: \\"\\\\2193\\\\2193\\\\2193\\"; + content: \\"\\\\2193 \\\\2193 \\\\2193\\"; +} + +.-top {} +.\\\\-top {} + +#\\\\#test {} + +.grid { + display: flex; + flex-wrap: wrap; +} +.grid.\\\\-top { + align-items: flex-start; +} +.grid.-top { + align-items: flex-start; +} +.grid.\\\\-middle { + align-items: center; +} +.grid.\\\\-bottom { + align-items: flex-end; +} + +.u-m\\\\00002b {} + +.u-m00002b {} + +#u-m\\\\+ {} + +body { + font-family: '微软雅黑'; /* some chinese font name */ +} + +.myStyle { + content: '\\\\e901'; +} + +.myStyle { + content: '\\\\E901'; +} + +.♫ {} + +.\\\\3A \\\\\`\\\\( {} /* matches elements with class=\\":\`(\\" */ +.\\\\31 a2b3c {} /* matches elements with class=\\"1a2b3c\\" */ +#\\\\#fake-id {} /* matches the element with id=\\"#fake-id\\" */ +#-a-b-c- {} /* matches the element with id=\\"-a-b-c-\\" */ +#© {} /* matches the element with id=\\"©\\" */ + +:root { + --title-align: center; + --sr-only: { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + overflow: hidden; + clip: rect(0,0,0,0); + white-space: nowrap; + clip-path: inset(50%); + border: 0; + }; +} + +.test { + content: \\"\\\\2014\\\\A0\\"; + content: \\"\\\\2014 \\\\A0\\"; + content: \\"\\\\A0 \\\\2014\\"; + content: \\"\\\\A0\\\\2014\\"; + margin-top: 1px\\\\9; + background-color: #000\\\\9; +} + +.light.on .bulb:before{ + content: '💡'; +} + +.base64 { + background: url(data:img/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAhxJREFUSA3tk71rU1EYxnMTEoJUkowWwdJ2akEHBfGjCiIF6ZylVUKSm2TqZLGI+A/oIu2UXm8C4lAyF4SWji0tdFLo1Eo7VN0SaBEhH7e/Nz0nPTfGOjiaCyfPc5734zlfCQT6X/8E/vUErL81KBaL9y3LSnued5PcITjUOwR3gsFg2bbtjYt6/NGgXC4P1et1l2aPLmpAbD0SidjpdPqgV15PA9d17zQajU8UxHQRK/4G35Q5pveAK8LlI1ZjPMnlcltnyvnvbwaO41xvtVqy7YHztMACq5xnlb9EY3dRdvcGo1kj5wR+t1AofDG0gM+A875E8DNjRCexsrV8Pj9ZqVQitVrtqejxePxjMpmss5hVTB4buXvMb2DyU2tBTRS+BjvNlVYUpPl7iuVO3Gq1uoQx1FtSOW1gPgp5ZWrdBtNmUDgv5asgxQ8F1af5vhY0YjyjuWC3wTszKJz7GBOkcFlQfW2ONq4FjWi+Hj6DRCKxQOK2TlY4x92EuYd5dvMAbYIzfikau3pu5tJ8KxaLLfo0cyKci7tK4TZjUMcoXAmHwzle0Q/RaC5P1GFMyVx9R9Fo9HYqlTrSgqDvFelAqVQa5hmuMR/WGtjAaBdjwBoDQ0ZsnwVMZjKZ9n0Zem8DSeDPdrnZbL6F2l3NOvUYNZk4oVDoRTabPe4EDNJzB0ZcjAYxeoZ2i3FNxQ7BHYw/cB/fldaH//UETgHHO8S44KbfXgAAAABJRU5ErkJggg==); +} -exports[`loader should have same "contenthash" with "sass-loader" and without source maps: module 1`] = ` +a[href=''] { + color: red; +} + +a[href='' i] { + color: red; +} + +a[href=\\"\\"] { + color: blue; +} + +a[href=\\"\\" i] { + color: blue; +} +", + "", + ], +] +`; + +exports[`loader should work with empty options: warnings 1`] = `Array []`; + +exports[`loader should work: errors 1`] = `Array []`; + +exports[`loader should work: module 1`] = ` +"// Imports +var ___CSS_LOADER_API_IMPORT___ = require(\\"../../src/runtime/api.js\\"); +var ___CSS_LOADER_AT_RULE_IMPORT_0___ = require(\\"-!../../src/index.js??[ident]!./imported.css\\"); +var ___CSS_LOADER_GET_URL_IMPORT___ = require(\\"../../src/runtime/getUrl.js\\"); +var ___CSS_LOADER_URL_IMPORT_0___ = require(\\"./url/img.png\\"); +exports = ___CSS_LOADER_API_IMPORT___(false); +exports.i(___CSS_LOADER_AT_RULE_IMPORT_0___); +var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___); +// Module +exports.push([module.id, \\"@charset \\\\\\"UTF-8\\\\\\";\\\\n\\\\n/* Comment */\\\\n\\\\n.class {\\\\n color: red;\\\\n background: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\\\n.class-duplicate-url {\\\\n background: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\\\n:root {\\\\n --foo: 1px;\\\\n --bar: 2px;\\\\n}\\\\n\\\\n.class { a: b c d; }\\\\n\\\\n.two {}\\\\n\\\\n.u-m\\\\\\\\+ { a: b c d; }\\\\n\\\\n.class { content: \\\\\\"\\\\\\\\F10C\\\\\\" }\\\\n\\\\n@media only screen and (max-width: 600px) {\\\\n body {\\\\n background-color: lightblue;\\\\n }\\\\n}\\\\n\\\\n.class {\\\\n content: \\\\\\"\\\\\\\\2193\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2193\\\\\\\\2193\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2193 \\\\\\\\2193\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2193\\\\\\\\2193\\\\\\\\2193\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2193 \\\\\\\\2193 \\\\\\\\2193\\\\\\";\\\\n}\\\\n\\\\n.-top {}\\\\n.\\\\\\\\-top {}\\\\n\\\\n#\\\\\\\\#test {}\\\\n\\\\n.grid {\\\\n display: flex;\\\\n flex-wrap: wrap;\\\\n}\\\\n.grid.\\\\\\\\-top {\\\\n align-items: flex-start;\\\\n}\\\\n.grid.-top {\\\\n align-items: flex-start;\\\\n}\\\\n.grid.\\\\\\\\-middle {\\\\n align-items: center;\\\\n}\\\\n.grid.\\\\\\\\-bottom {\\\\n align-items: flex-end;\\\\n}\\\\n\\\\n.u-m\\\\\\\\00002b {}\\\\n\\\\n.u-m00002b {}\\\\n\\\\n#u-m\\\\\\\\+ {}\\\\n\\\\nbody {\\\\n font-family: '微软雅黑'; /* some chinese font name */\\\\n}\\\\n\\\\n.myStyle {\\\\n content: '\\\\\\\\e901';\\\\n}\\\\n\\\\n.myStyle {\\\\n content: '\\\\\\\\E901';\\\\n}\\\\n\\\\n.♫ {}\\\\n\\\\n.\\\\\\\\3A \\\\\\\\\`\\\\\\\\( {} /* matches elements with class=\\\\\\":\`(\\\\\\" */\\\\n.\\\\\\\\31 a2b3c {} /* matches elements with class=\\\\\\"1a2b3c\\\\\\" */\\\\n#\\\\\\\\#fake-id {} /* matches the element with id=\\\\\\"#fake-id\\\\\\" */\\\\n#-a-b-c- {} /* matches the element with id=\\\\\\"-a-b-c-\\\\\\" */\\\\n#© {} /* matches the element with id=\\\\\\"©\\\\\\" */\\\\n\\\\n:root {\\\\n --title-align: center;\\\\n --sr-only: {\\\\n position: absolute;\\\\n width: 1px;\\\\n height: 1px;\\\\n padding: 0;\\\\n overflow: hidden;\\\\n clip: rect(0,0,0,0);\\\\n white-space: nowrap;\\\\n clip-path: inset(50%);\\\\n border: 0;\\\\n };\\\\n}\\\\n\\\\n.test {\\\\n content: \\\\\\"\\\\\\\\2014\\\\\\\\A0\\\\\\";\\\\n content: \\\\\\"\\\\\\\\2014 \\\\\\\\A0\\\\\\";\\\\n content: \\\\\\"\\\\\\\\A0 \\\\\\\\2014\\\\\\";\\\\n content: \\\\\\"\\\\\\\\A0\\\\\\\\2014\\\\\\";\\\\n margin-top: 1px\\\\\\\\9;\\\\n background-color: #000\\\\\\\\9;\\\\n}\\\\n\\\\n.light.on .bulb:before{\\\\n content: '💡';\\\\n}\\\\n\\\\n.base64 {\\\\n background: url(data:img/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAhxJREFUSA3tk71rU1EYxnMTEoJUkowWwdJ2akEHBfGjCiIF6ZylVUKSm2TqZLGI+A/oIu2UXm8C4lAyF4SWji0tdFLo1Eo7VN0SaBEhH7e/Nz0nPTfGOjiaCyfPc5734zlfCQT6X/8E/vUErL81KBaL9y3LSnued5PcITjUOwR3gsFg2bbtjYt6/NGgXC4P1et1l2aPLmpAbD0SidjpdPqgV15PA9d17zQajU8UxHQRK/4G35Q5pveAK8LlI1ZjPMnlcltnyvnvbwaO41xvtVqy7YHztMACq5xnlb9EY3dRdvcGo1kj5wR+t1AofDG0gM+A875E8DNjRCexsrV8Pj9ZqVQitVrtqejxePxjMpmss5hVTB4buXvMb2DyU2tBTRS+BjvNlVYUpPl7iuVO3Gq1uoQx1FtSOW1gPgp5ZWrdBtNmUDgv5asgxQ8F1af5vhY0YjyjuWC3wTszKJz7GBOkcFlQfW2ONq4FjWi+Hj6DRCKxQOK2TlY4x92EuYd5dvMAbYIzfikau3pu5tJ8KxaLLfo0cyKci7tK4TZjUMcoXAmHwzle0Q/RaC5P1GFMyVx9R9Fo9HYqlTrSgqDvFelAqVQa5hmuMR/WGtjAaBdjwBoDQ0ZsnwVMZjKZ9n0Zem8DSeDPdrnZbL6F2l3NOvUYNZk4oVDoRTabPe4EDNJzB0ZcjAYxeoZ2i3FNxQ7BHYw/cB/fldaH//UETgHHO8S44KbfXgAAAABJRU5ErkJggg==);\\\\n}\\\\n\\\\na[href=''] {\\\\n color: red;\\\\n}\\\\n\\\\na[href='' i] {\\\\n color: red;\\\\n}\\\\n\\\\na[href=\\\\\\"\\\\\\"] {\\\\n color: blue;\\\\n}\\\\n\\\\na[href=\\\\\\"\\\\\\" i] {\\\\n color: blue;\\\\n}\\\\n\\", \\"\\"]); +// Exports +module.exports = exports; +" +`; + +exports[`loader should work: result 1`] = ` Array [ - "main.9ae036ace8bbbebbd185.bundle.js", + Array [ + "../../src/index.js?[ident]!./imported.css", + ".foo { + color: red; +} +", + "", + ], + Array [ + "./basic.css", + "@charset \\"UTF-8\\"; + +/* Comment */ + +.class { + color: red; + background: url(/webpack/public/path/img.png); +} + +.class-duplicate-url { + background: url(/webpack/public/path/img.png); +} + +:root { + --foo: 1px; + --bar: 2px; +} + +.class { a: b c d; } + +.two {} + +.u-m\\\\+ { a: b c d; } + +.class { content: \\"\\\\F10C\\" } + +@media only screen and (max-width: 600px) { + body { + background-color: lightblue; + } +} + +.class { + content: \\"\\\\2193\\"; + content: \\"\\\\2193\\\\2193\\"; + content: \\"\\\\2193 \\\\2193\\"; + content: \\"\\\\2193\\\\2193\\\\2193\\"; + content: \\"\\\\2193 \\\\2193 \\\\2193\\"; +} + +.-top {} +.\\\\-top {} + +#\\\\#test {} + +.grid { + display: flex; + flex-wrap: wrap; +} +.grid.\\\\-top { + align-items: flex-start; +} +.grid.-top { + align-items: flex-start; +} +.grid.\\\\-middle { + align-items: center; +} +.grid.\\\\-bottom { + align-items: flex-end; +} + +.u-m\\\\00002b {} + +.u-m00002b {} + +#u-m\\\\+ {} + +body { + font-family: '微软雅黑'; /* some chinese font name */ +} + +.myStyle { + content: '\\\\e901'; +} + +.myStyle { + content: '\\\\E901'; +} + +.♫ {} + +.\\\\3A \\\\\`\\\\( {} /* matches elements with class=\\":\`(\\" */ +.\\\\31 a2b3c {} /* matches elements with class=\\"1a2b3c\\" */ +#\\\\#fake-id {} /* matches the element with id=\\"#fake-id\\" */ +#-a-b-c- {} /* matches the element with id=\\"-a-b-c-\\" */ +#© {} /* matches the element with id=\\"©\\" */ + +:root { + --title-align: center; + --sr-only: { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + overflow: hidden; + clip: rect(0,0,0,0); + white-space: nowrap; + clip-path: inset(50%); + border: 0; + }; +} + +.test { + content: \\"\\\\2014\\\\A0\\"; + content: \\"\\\\2014 \\\\A0\\"; + content: \\"\\\\A0 \\\\2014\\"; + content: \\"\\\\A0\\\\2014\\"; + margin-top: 1px\\\\9; + background-color: #000\\\\9; +} + +.light.on .bulb:before{ + content: '💡'; +} + +.base64 { + background: url(data:img/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAhxJREFUSA3tk71rU1EYxnMTEoJUkowWwdJ2akEHBfGjCiIF6ZylVUKSm2TqZLGI+A/oIu2UXm8C4lAyF4SWji0tdFLo1Eo7VN0SaBEhH7e/Nz0nPTfGOjiaCyfPc5734zlfCQT6X/8E/vUErL81KBaL9y3LSnued5PcITjUOwR3gsFg2bbtjYt6/NGgXC4P1et1l2aPLmpAbD0SidjpdPqgV15PA9d17zQajU8UxHQRK/4G35Q5pveAK8LlI1ZjPMnlcltnyvnvbwaO41xvtVqy7YHztMACq5xnlb9EY3dRdvcGo1kj5wR+t1AofDG0gM+A875E8DNjRCexsrV8Pj9ZqVQitVrtqejxePxjMpmss5hVTB4buXvMb2DyU2tBTRS+BjvNlVYUpPl7iuVO3Gq1uoQx1FtSOW1gPgp5ZWrdBtNmUDgv5asgxQ8F1af5vhY0YjyjuWC3wTszKJz7GBOkcFlQfW2ONq4FjWi+Hj6DRCKxQOK2TlY4x92EuYd5dvMAbYIzfikau3pu5tJ8KxaLLfo0cyKci7tK4TZjUMcoXAmHwzle0Q/RaC5P1GFMyVx9R9Fo9HYqlTrSgqDvFelAqVQa5hmuMR/WGtjAaBdjwBoDQ0ZsnwVMZjKZ9n0Zem8DSeDPdrnZbL6F2l3NOvUYNZk4oVDoRTabPe4EDNJzB0ZcjAYxeoZ2i3FNxQ7BHYw/cB/fldaH//UETgHHO8S44KbfXgAAAABJRU5ErkJggg==); +} + +a[href=''] { + color: red; +} + +a[href='' i] { + color: red; +} + +a[href=\\"\\"] { + color: blue; +} + +a[href=\\"\\" i] { + color: blue; +} +", + "", + ], ] `; -exports[`loader should have same "contenthash" with "sass-loader" and without source maps: warnings 1`] = `Array []`; +exports[`loader should work: warnings 1`] = `Array []`; diff --git a/test/loader.test.js b/test/loader.test.js index 5ce9522b..fa704189 100644 --- a/test/loader.test.js +++ b/test/loader.test.js @@ -309,7 +309,7 @@ describe('loader', () => { expect(getErrors(stats)).toMatchSnapshot('errors'); }); - it.only('should have same "contenthash" with "css-loader" and without source maps', async () => { + it('should have same "contenthash" with "css-loader" and without source maps', async () => { const compiler = getCompiler( './contenthash/basic-css.js', {}, @@ -336,13 +336,20 @@ describe('loader', () => { } ); const stats = await compile(compiler); + const isWebpack5 = version[0] === '5'; - expect(Object.keys(stats.compilation.assets)).toMatchSnapshot('module'); + expect( + stats.compilation.assets[ + isWebpack5 + ? 'main.fd612b1d69f7c1e6ba5f.bundle.js' + : 'main.b38d5f87c88c55a4258e.bundle.js' + ] + ).toBeDefined(); expect(getWarnings(stats)).toMatchSnapshot('warnings'); expect(getErrors(stats)).toMatchSnapshot('errors'); }); - it.only('should have same "contenthash" with "css-loader" and with source maps', async () => { + it('should have same "contenthash" with "css-loader" and with source maps', async () => { const compiler = getCompiler( './contenthash/basic-css.js', {}, @@ -369,13 +376,20 @@ describe('loader', () => { } ); const stats = await compile(compiler); + const isWebpack5 = version[0] === '5'; - expect(Object.keys(stats.compilation.assets)).toMatchSnapshot('module'); + expect( + stats.compilation.assets[ + isWebpack5 + ? 'main.4e80ca040390d63ea450.bundle.js' + : 'main.54b9712c1981e48c12c4.bundle.js' + ] + ).toBeDefined(); expect(getWarnings(stats)).toMatchSnapshot('warnings'); expect(getErrors(stats)).toMatchSnapshot('errors'); }); - it.only('should have same "contenthash" with "postcss-loader" and without source maps', async () => { + it('should have same "contenthash" with "postcss-loader" and without source maps', async () => { const compiler = getCompiler( './contenthash/basic-postcss.js', {}, @@ -412,13 +426,20 @@ describe('loader', () => { } ); const stats = await compile(compiler); + const isWebpack5 = version[0] === '5'; - expect(Object.keys(stats.compilation.assets)).toMatchSnapshot('module'); + expect( + stats.compilation.assets[ + isWebpack5 + ? 'main.47a6533d9b651ffbecad.bundle.js' + : 'main.f8e62206a43c13393798.bundle.js' + ] + ).toBeDefined(); expect(getWarnings(stats)).toMatchSnapshot('warnings'); expect(getErrors(stats)).toMatchSnapshot('errors'); }); - it.only('should have same "contenthash" with "postcss-loader" and with source maps', async () => { + it('should have same "contenthash" with "postcss-loader" and with source maps', async () => { const compiler = getCompiler( './contenthash/basic-postcss.js', {}, @@ -455,13 +476,20 @@ describe('loader', () => { } ); const stats = await compile(compiler); + const isWebpack5 = version[0] === '5'; - expect(Object.keys(stats.compilation.assets)).toMatchSnapshot('module'); + expect( + stats.compilation.assets[ + isWebpack5 + ? 'main.0a16c4c25cba08ab696a.bundle.js' + : 'main.d77dd6564bc6e6297cd4.bundle.js' + ] + ).toBeDefined(); expect(getWarnings(stats)).toMatchSnapshot('warnings'); expect(getErrors(stats)).toMatchSnapshot('errors'); }); - it.only('should have same "contenthash" with "sass-loader" and without source maps', async () => { + it('should have same "contenthash" with "sass-loader" and without source maps', async () => { const compiler = getCompiler( './contenthash/basic-sass.js', {}, @@ -506,13 +534,20 @@ describe('loader', () => { } ); const stats = await compile(compiler); + const isWebpack5 = version[0] === '5'; - expect(Object.keys(stats.compilation.assets)).toMatchSnapshot('module'); + expect( + stats.compilation.assets[ + isWebpack5 + ? 'main.f3d743a96cdd6e368436.bundle.js' + : 'main.9ae036ace8bbbebbd185.bundle.js' + ] + ).toBeDefined(); expect(getWarnings(stats)).toMatchSnapshot('warnings'); expect(getErrors(stats)).toMatchSnapshot('errors'); }); - it.only('should have same "contenthash" with "sass-loader" and with source maps', async () => { + it('should have same "contenthash" with "sass-loader" and with source maps', async () => { const compiler = getCompiler( './contenthash/basic-sass.js', {}, @@ -557,8 +592,15 @@ describe('loader', () => { } ); const stats = await compile(compiler); + const isWebpack5 = version[0] === '5'; - expect(Object.keys(stats.compilation.assets)).toMatchSnapshot('module'); + expect( + stats.compilation.assets[ + isWebpack5 + ? 'main.021e49d811fb525fefec.bundle.js' + : 'main.a12ab765493c74c80be2.bundle.js' + ] + ).toBeDefined(); expect(getWarnings(stats)).toMatchSnapshot('warnings'); expect(getErrors(stats)).toMatchSnapshot('errors'); });