reproduce webpack-contrib#444

Author: Rulexec

.gitignore

@@ -0,0 +1 @@
+node_modules

README.md

@@ -0,0 +1,23 @@
+Demo of https://github.com/webpack-contrib/mini-css-extract-plugin/pull/531
+
+* `npm ci`
+* `npm run start`
+* Go to `http://localhost:8080/`
+* Edit `src/style.css`
+* Exception should happen:
+
+```
+Uncaught TypeError: Cannot read property 'some' of null
+    at getReloadUrl (hotModuleReplacement.js:129)
+    at eval (hotModuleReplacement.js:145)
+    at NodeList.forEach (<anonymous>)
+    at reloadStyle (hotModuleReplacement.js:140)
+    at update (hotModuleReplacement.js:194)
+    at functionCall (hotModuleReplacement.js:24)
+```
+
+Why?
+
+* `document.currentScript` is absent due to preload
+* Last script is not our script, because page has `<script>` without `src` in the end of page
+* `getCurrentScriptUrl` returns `null`

package-lock.json

@@ -0,0 +1,20 @@
+{
+  "name": "mini-css-extract-plugin-demo",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "start": "webpack-dev-server",
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "css-loader": "^3.5.3",
+    "html-webpack-plugin": "^4.3.0",
+    "mini-css-extract-plugin": "^0.9.0",
+    "webpack": "^4.43.0",
+    "webpack-cli": "^3.3.11",
+    "webpack-dev-server": "^3.11.0"
+  }
+}

package.json

@@ -0,0 +1,12 @@
+let div = document.createElement('div');
+document.body.appendChild(div);
+
+// My page have <script> without `src` in the bottom
+let script = document.createElement('script');
+document.body.appendChild(script);
+
+import(/* webpackChunkName: 'with-preload' */ './with-preload.js');
+
+if (module.hot) {
+	module.hot.accept('./with-preload.js');
+}

src/main.js

@@ -0,0 +1,8 @@
+div {
+	display: inline-block;
+	width: 200px;
+	height: 200px;
+	background: red;
+	/* Uncomment next line for HMR: */
+	/* background: green; */
+}

src/style.css

@@ -0,0 +1,3 @@
+import './style.css';
+
+console.log('with css');

src/with-css.js

@@ -0,0 +1,8 @@
+// Wait for `webpackPreload` finish
+// to break `document.currentScript`
+// Maybe it's not strictly required
+setTimeout(() => {
+	import(
+		/* webpackChunkName: 'with-css', webpackPreload: true */ './with-css.js'
+	);
+}, 100);

src/with-preload.js

@@ -0,0 +1,35 @@
+const _path = require('path');
+const { HotModuleReplacementPlugin } = require('webpack');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const MiniCssExtractPlugin = require('mini-css-extract-plugin');
+
+module.exports = {
+	plugins: [new MiniCssExtractPlugin()],
+	entry: _path.join(__dirname, 'src/main.js'),
+	module: {
+		rules: [
+			{
+				test: /\.css$/i,
+				use: [
+					{
+						loader: MiniCssExtractPlugin.loader,
+						options: {
+							hmr: true,
+						},
+					},
+					'css-loader',
+				],
+			},
+		],
+	},
+	plugins: [
+		new MiniCssExtractPlugin(),
+		new HotModuleReplacementPlugin(),
+		new HtmlWebpackPlugin({
+			title: 'mini-css-extract-plugin demo',
+		}),
+	],
+	devServer: {
+		hotOnly: true,
+	},
+};