test: contenthash

Author: alexander-akait

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`] = `

test/fixtures/contenthash/basic-css.js

@@ -0,0 +1,5 @@
+import css from './basic.css';
+
+__export__ = css;
+
+export default css;

test/fixtures/contenthash/basic-postcss.js

@@ -0,0 +1,5 @@
+import css from './basic.postcss.css';
+
+__export__ = css;
+
+export default css;

test/fixtures/contenthash/basic-sass.js

@@ -0,0 +1,5 @@
+import css from './basic.scss';
+
+__export__ = css;
+
+export default css;

test/fixtures/contenthash/basic.css

@@ -0,0 +1,3 @@
+a {
+  color: red;
+}

test/fixtures/contenthash/basic.postcss.css

@@ -0,0 +1,7 @@
+a {
+  color: rgb(0 0 100% / 90%);
+
+  &:hover {
+    color: rebeccapurple;
+  }
+}

test/fixtures/contenthash/basic.scss

@@ -0,0 +1,9 @@
+$var: red;
+
+a {
+  color: $var;
+
+  &:hover {
+    color: $var;
+  }
+}

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');
+  });
 });