test: es modules

test/cases/es-named-export-output-module/expected/main.css

@@ -0,0 +1,12 @@
+.foo__style__a-class {
+  background: red;
+}
+
+.foo__style__b__class {
+  color: green;
+}
+
+.foo__style__cClass {
+  color: blue;
+}
+

test/cases/es-named-export-output-module/expected/main.js

@@ -0,0 +1,85 @@
+/******/ "use strict";
+/******/ var __webpack_modules__ = ([
+/* 0 */,
+/* 1 */
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "aClass": () => (/* binding */ aClass),
+/* harmony export */   "bClass": () => (/* binding */ bClass),
+/* harmony export */   "cClass": () => (/* binding */ cClass)
+/* harmony export */ });
+// extracted by mini-css-extract-plugin
+const aClass = "foo__style__a-class";
+const bClass = "foo__style__b__class";
+const cClass = "foo__style__cClass";
+
+/***/ })
+/******/ ]);
+/************************************************************************/
+/******/ // The module cache
+/******/ var __webpack_module_cache__ = {};
+/******/ 
+/******/ // The require function
+/******/ function __webpack_require__(moduleId) {
+/******/ 	// Check if module is in cache
+/******/ 	if(__webpack_module_cache__[moduleId]) {
+/******/ 		return __webpack_module_cache__[moduleId].exports;
+/******/ 	}
+/******/ 	// Create a new module (and put it into the cache)
+/******/ 	var module = __webpack_module_cache__[moduleId] = {
+/******/ 		// no module.id needed
+/******/ 		// no module.loaded needed
+/******/ 		exports: {}
+/******/ 	};
+/******/ 
+/******/ 	// Execute the module function
+/******/ 	__webpack_modules__[moduleId](module, module.exports, __webpack_require__);
+/******/ 
+/******/ 	// Return the exports of the module
+/******/ 	return module.exports;
+/******/ }
+/******/ 
+/************************************************************************/
+/******/ /* webpack/runtime/define property getters */
+/******/ (() => {
+/******/ 	// define getter functions for harmony exports
+/******/ 	__webpack_require__.d = (exports, definition) => {
+/******/ 		for(var key in definition) {
+/******/ 			if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
+/******/ 				Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
+/******/ 			}
+/******/ 		}
+/******/ 	};
+/******/ })();
+/******/ 
+/******/ /* webpack/runtime/hasOwnProperty shorthand */
+/******/ (() => {
+/******/ 	__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
+/******/ })();
+/******/ 
+/******/ /* webpack/runtime/make namespace object */
+/******/ (() => {
+/******/ 	// define __esModule on exports
+/******/ 	__webpack_require__.r = (exports) => {
+/******/ 		if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
+/******/ 			Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+/******/ 		}
+/******/ 		Object.defineProperty(exports, '__esModule', { value: true });
+/******/ 	};
+/******/ })();
+/******/ 
+/************************************************************************/
+var __webpack_exports__ = {};
+// This entry need to be wrapped in an IIFE because it need to be isolated against other modules in the chunk.
+(() => {
+__webpack_require__.r(__webpack_exports__);
+/* harmony import */ var _style_css__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(1);
+
+
+// eslint-disable-next-line no-console
+console.log({ css: _style_css__WEBPACK_IMPORTED_MODULE_0__.default, aClass: _style_css__WEBPACK_IMPORTED_MODULE_0__.aClass, bClass: _style_css__WEBPACK_IMPORTED_MODULE_0__.bClass, cClass: _style_css__WEBPACK_IMPORTED_MODULE_0__.cClass });
+
+})();
+

test/cases/es-named-export-output-module/index.js

@@ -0,0 +1,4 @@
+import css, { aClass, bClass, cClass } from './style.css';
+
+// eslint-disable-next-line no-console
+console.log({ css, aClass, bClass, cClass });

test/cases/es-named-export-output-module/style.css

@@ -0,0 +1,11 @@
+.a-class {
+  background: red;
+}
+
+.b__class {
+  color: green;
+}
+
+.cClass {
+  color: blue;
+}

test/cases/es-named-export-output-module/test.filter.js

@@ -0,0 +1,3 @@
+const webpack = require('webpack');
+
+module.exports = () => webpack.version[0] !== '4';

test/cases/es-named-export-output-module/webpack.config.js

@@ -0,0 +1,44 @@
+import Self from '../../../src';
+
+module.exports = {
+  entry: './index.js',
+  module: {
+    rules: [
+      {
+        test: /\.css$/,
+        use: [
+          {
+            loader: Self.loader,
+            options: {
+              esModule: true,
+              modules: {
+                namedExport: true,
+              },
+            },
+          },
+          {
+            loader: 'css-loader',
+            options: {
+              esModule: true,
+              modules: {
+                namedExport: true,
+                localIdentName: 'foo__[name]__[local]',
+              },
+            },
+          },
+        ],
+      },
+    ],
+  },
+  output: {
+    module: true,
+  },
+  experiments: {
+    outputModule: true,
+  },
+  plugins: [
+    new Self({
+      filename: '[name].css',
+    }),
+  ],
+};

test/cases/output-iife/expected/main.css

@@ -0,0 +1,4 @@
+body {
+  background: red;
+}
+

test/cases/output-iife/index.js

@@ -0,0 +1 @@
+import './style.css';

test/cases/output-iife/style.css

@@ -0,0 +1,3 @@
+body {
+  background: red;
+}

test/cases/output-iife/test.filter.js

@@ -0,0 +1,3 @@
+const webpack = require('webpack');
+
+module.exports = () => webpack.version[0] !== '4';

test/cases/output-iife/webpack.config.js

@@ -0,0 +1,21 @@
+import Self from '../../../src';
+
+module.exports = {
+  entry: './index.js',
+  module: {
+    rules: [
+      {
+        test: /\.css$/,
+        use: [Self.loader, 'css-loader'],
+      },
+    ],
+  },
+  output: {
+    iife: false,
+  },
+  plugins: [
+    new Self({
+      filename: '[name].css',
+    }),
+  ],
+};

test/cases/output-module/expected/main.css

@@ -0,0 +1,4 @@
+body {
+  background: red;
+}
+

test/cases/output-module/index.js

@@ -0,0 +1 @@
+import './style.css';

test/cases/output-module/style.css

@@ -0,0 +1,3 @@
+body {
+  background: red;
+}

test/cases/output-module/test.filter.js

@@ -0,0 +1,3 @@
+const webpack = require('webpack');
+
+module.exports = () => webpack.version[0] !== '4';

test/cases/output-module/webpack.config.js

@@ -0,0 +1,24 @@
+import Self from '../../../src';
+
+module.exports = {
+  entry: './index.js',
+  module: {
+    rules: [
+      {
+        test: /\.css$/,
+        use: [Self.loader, 'css-loader'],
+      },
+    ],
+  },
+  output: {
+    module: true,
+  },
+  experiments: {
+    outputModule: true,
+  },
+  plugins: [
+    new Self({
+      filename: '[name].css',
+    }),
+  ],
+};

test/cases/simple-css-modules-mode-local-output-module/expected/main.css

@@ -0,0 +1,12 @@
+.foo__style__a {
+  background: red;
+}
+
+.foo__style__b {
+  color: green;
+}
+
+.c {
+  color: blue;
+}
+

test/cases/simple-css-modules-mode-local-output-module/index.js

@@ -0,0 +1 @@
+import './style.css';

test/cases/simple-css-modules-mode-local-output-module/style.css

@@ -0,0 +1,11 @@
+.a {
+  background: red;
+}
+
+:local(.b) {
+  color: green;
+}
+
+:global(.c) {
+  color: blue;
+}

test/cases/simple-css-modules-mode-local-output-module/test.filter.js

@@ -0,0 +1,3 @@
+const webpack = require('webpack');
+
+module.exports = () => webpack.version[0] !== '4';

test/cases/simple-css-modules-mode-local-output-module/webpack.config.js

@@ -0,0 +1,35 @@
+import Self from '../../../src';
+
+module.exports = {
+  entry: './index.js',
+  module: {
+    rules: [
+      {
+        test: /\.css$/,
+        use: [
+          Self.loader,
+          {
+            loader: 'css-loader',
+            options: {
+              modules: {
+                mode: 'local',
+                localIdentName: 'foo__[name]__[local]',
+              },
+            },
+          },
+        ],
+      },
+    ],
+  },
+  output: {
+    module: true,
+  },
+  experiments: {
+    outputModule: true,
+  },
+  plugins: [
+    new Self({
+      filename: '[name].css',
+    }),
+  ],
+};