+
+
+
+
+"
+`;
+
+exports[`insert option should work when insert option is function: errors 1`] = `Array []`;
+
+exports[`insert option should work when insert option is function: warnings 1`] = `Array []`;
+
+exports[`insert option should work when insert option is string: DOM 1`] = `
+"
+ style-loader test
+
+
+
+
Body
+
+
+
+
+"
+`;
+
+exports[`insert option should work when insert option is string: errors 1`] = `Array []`;
+
+exports[`insert option should work when insert option is string: warnings 1`] = `Array []`;
+
+exports[`insert option should work without insert option: DOM 1`] = `
+"
+ style-loader test
+
+
+
+
Body
+
+
+
+
+"
+`;
+
+exports[`insert option should work without insert option: errors 1`] = `Array []`;
+
+exports[`insert option should work without insert option: warnings 1`] = `Array []`;
diff --git a/test/__snapshots__/validate-plugin-options.test.js.snap b/test/__snapshots__/validate-plugin-options.test.js.snap
index eb524205..40889270 100644
--- a/test/__snapshots__/validate-plugin-options.test.js.snap
+++ b/test/__snapshots__/validate-plugin-options.test.js.snap
@@ -22,3 +22,33 @@ exports[`validate options should throw an error on the "ignoreOrder" option with
"Invalid options object. Mini CSS Extract Plugin has been initialized using an options object that does not match the API schema.
- options.ignoreOrder should be a boolean."
`;
+
+exports[`validate options should throw an error on the "insert" option with "{}" value 1`] = `
+"Invalid options object. Mini CSS Extract Plugin has been initialized using an options object that does not match the API schema.
+ - options.insert should be one of these:
+ string | function
+ -> Inserts \`\` at the given position (https://github.com/webpack-contrib/mini-css-extract-plugin#insert).
+ Details:
+ * options.insert should be a string.
+ * options.insert should be an instance of function."
+`;
+
+exports[`validate options should throw an error on the "insert" option with "1" value 1`] = `
+"Invalid options object. Mini CSS Extract Plugin has been initialized using an options object that does not match the API schema.
+ - options.insert should be one of these:
+ string | function
+ -> Inserts \`\` at the given position (https://github.com/webpack-contrib/mini-css-extract-plugin#insert).
+ Details:
+ * options.insert should be a string.
+ * options.insert should be an instance of function."
+`;
+
+exports[`validate options should throw an error on the "insert" option with "true" value 1`] = `
+"Invalid options object. Mini CSS Extract Plugin has been initialized using an options object that does not match the API schema.
+ - options.insert should be one of these:
+ string | function
+ -> Inserts \`\` at the given position (https://github.com/webpack-contrib/mini-css-extract-plugin#insert).
+ Details:
+ * options.insert should be a string.
+ * options.insert should be an instance of function."
+`;
diff --git a/test/cases/insert-function/expected/webpack-4/1.css b/test/cases/insert-function/expected/webpack-4/1.css
new file mode 100644
index 00000000..cebc5c1c
--- /dev/null
+++ b/test/cases/insert-function/expected/webpack-4/1.css
@@ -0,0 +1,4 @@
+body {
+ background: red;
+}
+
diff --git a/test/cases/insert-function/expected/webpack-4/1.js b/test/cases/insert-function/expected/webpack-4/1.js
new file mode 100644
index 00000000..4292040c
--- /dev/null
+++ b/test/cases/insert-function/expected/webpack-4/1.js
@@ -0,0 +1,12 @@
+(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[1],[
+/* 0 */,
+/* 1 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+// extracted by mini-css-extract-plugin
+
+
+/***/ })
+]]);
\ No newline at end of file
diff --git a/test/cases/insert-function/expected/webpack-4/main.js b/test/cases/insert-function/expected/webpack-4/main.js
new file mode 100644
index 00000000..d208b22c
--- /dev/null
+++ b/test/cases/insert-function/expected/webpack-4/main.js
@@ -0,0 +1,264 @@
+/******/ (function(modules) { // webpackBootstrap
+/******/ // install a JSONP callback for chunk loading
+/******/ function webpackJsonpCallback(data) {
+/******/ var chunkIds = data[0];
+/******/ var moreModules = data[1];
+/******/
+/******/
+/******/ // add "moreModules" to the modules object,
+/******/ // then flag all "chunkIds" as loaded and fire callback
+/******/ var moduleId, chunkId, i = 0, resolves = [];
+/******/ for(;i < chunkIds.length; i++) {
+/******/ chunkId = chunkIds[i];
+/******/ if(Object.prototype.hasOwnProperty.call(installedChunks, chunkId) && installedChunks[chunkId]) {
+/******/ resolves.push(installedChunks[chunkId][0]);
+/******/ }
+/******/ installedChunks[chunkId] = 0;
+/******/ }
+/******/ for(moduleId in moreModules) {
+/******/ if(Object.prototype.hasOwnProperty.call(moreModules, moduleId)) {
+/******/ modules[moduleId] = moreModules[moduleId];
+/******/ }
+/******/ }
+/******/ if(parentJsonpFunction) parentJsonpFunction(data);
+/******/
+/******/ while(resolves.length) {
+/******/ resolves.shift()();
+/******/ }
+/******/
+/******/ };
+/******/
+/******/
+/******/ // The module cache
+/******/ var installedModules = {};
+/******/
+/******/ // object to store loaded CSS chunks
+/******/ var installedCssChunks = {
+/******/ 0: 0
+/******/ };
+/******/
+/******/ // object to store loaded and loading chunks
+/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
+/******/ // Promise = chunk loading, 0 = chunk loaded
+/******/ var installedChunks = {
+/******/ 0: 0
+/******/ };
+/******/
+/******/
+/******/
+/******/ // script path function
+/******/ function jsonpScriptSrc(chunkId) {
+/******/ return __webpack_require__.p + "" + ({}[chunkId]||chunkId) + ".js"
+/******/ }
+/******/
+/******/ // 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;
+/******/ }
+/******/
+/******/ // This file contains only the entry chunk.
+/******/ // The chunk loading function for additional chunks
+/******/ __webpack_require__.e = function requireEnsure(chunkId) {
+/******/ var promises = [];
+/******/
+/******/
+/******/ // mini-css-extract-plugin CSS loading
+/******/ var cssChunks = {"1":1};
+/******/ if(installedCssChunks[chunkId]) promises.push(installedCssChunks[chunkId]);
+/******/ else if(installedCssChunks[chunkId] !== 0 && cssChunks[chunkId]) {
+/******/ promises.push(installedCssChunks[chunkId] = new Promise(function(resolve, reject) {
+/******/ var href = "" + chunkId + ".css";
+/******/ var fullhref = __webpack_require__.p + href;
+/******/ var existingLinkTags = document.getElementsByTagName("link");
+/******/ for(var i = 0; i < existingLinkTags.length; i++) {
+/******/ var tag = existingLinkTags[i];
+/******/ var dataHref = tag.getAttribute("data-href") || tag.getAttribute("href");
+/******/ if(tag.rel === "stylesheet" && (dataHref === href || dataHref === fullhref)) return resolve();
+/******/ }
+/******/ var existingStyleTags = document.getElementsByTagName("style");
+/******/ for(var i = 0; i < existingStyleTags.length; i++) {
+/******/ var tag = existingStyleTags[i];
+/******/ var dataHref = tag.getAttribute("data-href");
+/******/ if(dataHref === href || dataHref === fullhref) return resolve();
+/******/ }
+/******/ var linkTag = document.createElement("link");
+/******/ linkTag.rel = "stylesheet";
+/******/ linkTag.type = "text/css";
+/******/ linkTag.onload = resolve;
+/******/ linkTag.onerror = function(event) {
+/******/ var request = event && event.target && event.target.src || fullhref;
+/******/ var err = new Error("Loading CSS chunk " + chunkId + " failed.\n(" + request + ")");
+/******/ err.code = "CSS_CHUNK_LOAD_FAILED";
+/******/ err.request = request;
+/******/ delete installedCssChunks[chunkId]
+/******/ linkTag.parentNode.removeChild(linkTag)
+/******/ reject(err);
+/******/ };
+/******/ linkTag.href = fullhref;
+/******/
+/******/ (function (linkTag) {
+/******/ const reference = document.querySelector('.hot-reload');
+/******/
+/******/ if (reference) {
+/******/ reference.parentNode.insertBefore(linkTag, reference);
+/******/ }
+/******/ })(linkTag)
+/******/ }).then(function() {
+/******/ installedCssChunks[chunkId] = 0;
+/******/ }));
+/******/ }
+/******/
+/******/ // JSONP chunk loading for javascript
+/******/
+/******/ var installedChunkData = installedChunks[chunkId];
+/******/ if(installedChunkData !== 0) { // 0 means "already installed".
+/******/
+/******/ // a Promise means "currently loading".
+/******/ if(installedChunkData) {
+/******/ promises.push(installedChunkData[2]);
+/******/ } else {
+/******/ // setup Promise in chunk cache
+/******/ var promise = new Promise(function(resolve, reject) {
+/******/ installedChunkData = installedChunks[chunkId] = [resolve, reject];
+/******/ });
+/******/ promises.push(installedChunkData[2] = promise);
+/******/
+/******/ // start chunk loading
+/******/ var script = document.createElement('script');
+/******/ var onScriptComplete;
+/******/
+/******/ script.charset = 'utf-8';
+/******/ script.timeout = 120;
+/******/ if (__webpack_require__.nc) {
+/******/ script.setAttribute("nonce", __webpack_require__.nc);
+/******/ }
+/******/ script.src = jsonpScriptSrc(chunkId);
+/******/
+/******/ // create error before stack unwound to get useful stacktrace later
+/******/ var error = new Error();
+/******/ onScriptComplete = function (event) {
+/******/ // avoid mem leaks in IE.
+/******/ script.onerror = script.onload = null;
+/******/ clearTimeout(timeout);
+/******/ var chunk = installedChunks[chunkId];
+/******/ if(chunk !== 0) {
+/******/ if(chunk) {
+/******/ var errorType = event && (event.type === 'load' ? 'missing' : event.type);
+/******/ var realSrc = event && event.target && event.target.src;
+/******/ error.message = 'Loading chunk ' + chunkId + ' failed.\n(' + errorType + ': ' + realSrc + ')';
+/******/ error.name = 'ChunkLoadError';
+/******/ error.type = errorType;
+/******/ error.request = realSrc;
+/******/ chunk[1](error);
+/******/ }
+/******/ installedChunks[chunkId] = undefined;
+/******/ }
+/******/ };
+/******/ var timeout = setTimeout(function(){
+/******/ onScriptComplete({ type: 'timeout', target: script });
+/******/ }, 120000);
+/******/ script.onerror = script.onload = onScriptComplete;
+/******/ document.head.appendChild(script);
+/******/ }
+/******/ }
+/******/ return Promise.all(promises);
+/******/ };
+/******/
+/******/ // 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 = "";
+/******/
+/******/ // on error function for async loading
+/******/ __webpack_require__.oe = function(err) { console.error(err); throw err; };
+/******/
+/******/ var jsonpArray = window["webpackJsonp"] = window["webpackJsonp"] || [];
+/******/ var oldJsonpFunction = jsonpArray.push.bind(jsonpArray);
+/******/ jsonpArray.push = webpackJsonpCallback;
+/******/ jsonpArray = jsonpArray.slice();
+/******/ for(var i = 0; i < jsonpArray.length; i++) webpackJsonpCallback(jsonpArray[i]);
+/******/ var parentJsonpFunction = oldJsonpFunction;
+/******/
+/******/
+/******/ // Load entry module and return exports
+/******/ return __webpack_require__(__webpack_require__.s = 0);
+/******/ })
+/************************************************************************/
+/******/ ([
+/* 0 */
+/***/ (function(module, exports, __webpack_require__) {
+
+/* eslint-env browser */
+
+// eslint-disable-next-line
+__webpack_require__.e(/* import() */ 1).then(__webpack_require__.bind(null, 1));
+
+
+/***/ })
+/******/ ]);
\ No newline at end of file
diff --git a/test/cases/insert-function/expected/webpack-5/1.css b/test/cases/insert-function/expected/webpack-5/1.css
new file mode 100644
index 00000000..cebc5c1c
--- /dev/null
+++ b/test/cases/insert-function/expected/webpack-5/1.css
@@ -0,0 +1,4 @@
+body {
+ background: red;
+}
+
diff --git a/test/cases/insert-function/expected/webpack-5/1.js b/test/cases/insert-function/expected/webpack-5/1.js
new file mode 100644
index 00000000..df8cbd2a
--- /dev/null
+++ b/test/cases/insert-function/expected/webpack-5/1.js
@@ -0,0 +1,12 @@
+(self["webpackChunk"] = self["webpackChunk"] || []).push([[1],[
+/* 0 */,
+/* 1 */
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+// extracted by mini-css-extract-plugin
+
+
+/***/ })
+]]);
\ No newline at end of file
diff --git a/test/cases/insert-function/expected/webpack-5/main.js b/test/cases/insert-function/expected/webpack-5/main.js
new file mode 100644
index 00000000..19eb5cc2
--- /dev/null
+++ b/test/cases/insert-function/expected/webpack-5/main.js
@@ -0,0 +1,328 @@
+/******/ (() => { // webpackBootstrap
+/******/ var __webpack_modules__ = ({});
+/************************************************************************/
+/******/ // 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;
+/******/ }
+/******/
+/******/ // expose the modules object (__webpack_modules__)
+/******/ __webpack_require__.m = __webpack_modules__;
+/******/
+/************************************************************************/
+/******/ /* webpack/runtime/ensure chunk */
+/******/ (() => {
+/******/ __webpack_require__.f = {};
+/******/ // This file contains only the entry chunk.
+/******/ // The chunk loading function for additional chunks
+/******/ __webpack_require__.e = (chunkId) => {
+/******/ return Promise.all(Object.keys(__webpack_require__.f).reduce((promises, key) => {
+/******/ __webpack_require__.f[key](chunkId, promises);
+/******/ return promises;
+/******/ }, []));
+/******/ };
+/******/ })();
+/******/
+/******/ /* webpack/runtime/get javascript chunk filename */
+/******/ (() => {
+/******/ // This function allow to reference async chunks
+/******/ __webpack_require__.u = (chunkId) => {
+/******/ // return url for filenames based on template
+/******/ return "" + chunkId + ".js";
+/******/ };
+/******/ })();
+/******/
+/******/ /* webpack/runtime/get mini-css chunk filename */
+/******/ (() => {
+/******/ // This function allow to reference all chunks
+/******/ __webpack_require__.miniCssF = (chunkId) => {
+/******/ // return url for filenames not based on template
+/******/ if (chunkId === 1) return "1.css";
+/******/ // return url for filenames based on template
+/******/ return "" + "main" + ".css";
+/******/ };
+/******/ })();
+/******/
+/******/ /* webpack/runtime/global */
+/******/ (() => {
+/******/ __webpack_require__.g = (function() {
+/******/ if (typeof globalThis === 'object') return globalThis;
+/******/ try {
+/******/ return this || new Function('return this')();
+/******/ } catch (e) {
+/******/ if (typeof window === 'object') return window;
+/******/ }
+/******/ })();
+/******/ })();
+/******/
+/******/ /* webpack/runtime/hasOwnProperty shorthand */
+/******/ (() => {
+/******/ __webpack_require__.o = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop)
+/******/ })();
+/******/
+/******/ /* webpack/runtime/load script */
+/******/ (() => {
+/******/ var inProgress = {};
+/******/ // data-webpack is not used as build has no uniqueName
+/******/ // loadScript function to load a script via script tag
+/******/ __webpack_require__.l = (url, done, key) => {
+/******/ if(inProgress[url]) { inProgress[url].push(done); return; }
+/******/ var script, needAttach;
+/******/ if(key !== undefined) {
+/******/ var scripts = document.getElementsByTagName("script");
+/******/ for(var i = 0; i < scripts.length; i++) {
+/******/ var s = scripts[i];
+/******/ if(s.getAttribute("src") == url) { script = s; break; }
+/******/ }
+/******/ }
+/******/ if(!script) {
+/******/ needAttach = true;
+/******/ script = document.createElement('script');
+/******/
+/******/ script.charset = 'utf-8';
+/******/ script.timeout = 120;
+/******/ if (__webpack_require__.nc) {
+/******/ script.setAttribute("nonce", __webpack_require__.nc);
+/******/ }
+/******/
+/******/ script.src = url;
+/******/ }
+/******/ inProgress[url] = [done];
+/******/ var onScriptComplete = (prev, event) => {
+/******/ // avoid mem leaks in IE.
+/******/ script.onerror = script.onload = null;
+/******/ clearTimeout(timeout);
+/******/ var doneFns = inProgress[url];
+/******/ delete inProgress[url];
+/******/ script.parentNode && script.parentNode.removeChild(script);
+/******/ doneFns && doneFns.forEach((fn) => fn(event));
+/******/ if(prev) return prev(event);
+/******/ }
+/******/ ;
+/******/ var timeout = setTimeout(onScriptComplete.bind(null, undefined, { type: 'timeout', target: script }), 120000);
+/******/ script.onerror = onScriptComplete.bind(null, script.onerror);
+/******/ script.onload = onScriptComplete.bind(null, script.onload);
+/******/ needAttach && document.head.appendChild(script);
+/******/ };
+/******/ })();
+/******/
+/******/ /* 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 });
+/******/ };
+/******/ })();
+/******/
+/******/ /* webpack/runtime/publicPath */
+/******/ (() => {
+/******/ var scriptUrl;
+/******/ if (__webpack_require__.g.importScripts) scriptUrl = __webpack_require__.g.location + "";
+/******/ var document = __webpack_require__.g.document;
+/******/ if (!scriptUrl && document) {
+/******/ if (document.currentScript)
+/******/ scriptUrl = document.currentScript.src
+/******/ if (!scriptUrl) {
+/******/ var scripts = document.getElementsByTagName("script");
+/******/ if(scripts.length) scriptUrl = scripts[scripts.length - 1].src
+/******/ }
+/******/ }
+/******/ // When supporting browsers where an automatic publicPath is not supported you must specify an output.publicPath manually via configuration
+/******/ // or pass an empty string ("") and set the __webpack_public_path__ variable from your code to use your own logic.
+/******/ if (!scriptUrl) throw new Error("Automatic publicPath is not supported in this browser");
+/******/ scriptUrl = scriptUrl.replace(/#.*$/, "").replace(/\?.*$/, "").replace(/\/[^\/]+$/, "/");
+/******/ __webpack_require__.p = scriptUrl;
+/******/ })();
+/******/
+/******/ /* webpack/runtime/css loading */
+/******/ (() => {
+/******/ var createStylesheet = (fullhref, resolve, reject) => {
+/******/ var linkTag = document.createElement("link");
+/******/ linkTag.rel = "stylesheet";
+/******/ linkTag.type = "text/css";
+/******/ linkTag.onload = resolve;
+/******/ linkTag.onerror = function(event) {
+/******/ var request = event && event.target && event.target.src || fullhref;
+/******/ var err = new Error("Loading CSS chunk " + chunkId + " failed.\n(" + request + ")");
+/******/ err.code = "CSS_CHUNK_LOAD_FAILED";
+/******/ err.request = request;
+/******/ linkTag.parentNode.removeChild(linkTag)
+/******/ reject(err);
+/******/ };
+/******/ linkTag.href = fullhref;
+/******/
+/******/ (function (linkTag) {
+/******/ const reference = document.querySelector('.hot-reload');
+/******/
+/******/ if (reference) {
+/******/ reference.parentNode.insertBefore(linkTag, reference);
+/******/ }
+/******/ })(linkTag)
+/******/ return linkTag;
+/******/ };
+/******/ var findStylesheet = (href, fullhref) => {
+/******/ var existingLinkTags = document.getElementsByTagName("link");
+/******/ for(var i = 0; i < existingLinkTags.length; i++) {
+/******/ var tag = existingLinkTags[i];
+/******/ var dataHref = tag.getAttribute("data-href") || tag.getAttribute("href");
+/******/ if(tag.rel === "stylesheet" && (dataHref === href || dataHref === fullhref)) return tag;
+/******/ }
+/******/ var existingStyleTags = document.getElementsByTagName("style");
+/******/ for(var i = 0; i < existingStyleTags.length; i++) {
+/******/ var tag = existingStyleTags[i];
+/******/ var dataHref = tag.getAttribute("data-href");
+/******/ if(dataHref === href || dataHref === fullhref) return tag;
+/******/ }
+/******/ };
+/******/ var loadStylesheet = (chunkId) => {
+/******/ return new Promise((resolve, reject) => {
+/******/ var href = __webpack_require__.miniCssF(chunkId);
+/******/ var fullhref = __webpack_require__.p + href;
+/******/ if(findStylesheet(href, fullhref)) return resolve();
+/******/ createStylesheet(fullhref, resolve, reject);
+/******/ });
+/******/ }
+/******/ // object to store loaded CSS chunks
+/******/ var installedCssChunks = {
+/******/ 0: 0
+/******/ };
+/******/
+/******/ __webpack_require__.f.miniCss = (chunkId, promises) => {
+/******/ var cssChunks = {"1":1};
+/******/ if(installedCssChunks[chunkId]) promises.push(installedCssChunks[chunkId]);
+/******/ else if(installedCssChunks[chunkId] !== 0 && cssChunks[chunkId]) {
+/******/ promises.push(installedCssChunks[chunkId] = loadStylesheet(chunkId).then(() => {
+/******/ installedCssChunks[chunkId] = 0;
+/******/ }, (e) => {
+/******/ delete installedCssChunks[chunkId];
+/******/ throw e;
+/******/ }));
+/******/ }
+/******/ };
+/******/
+/******/ // no hmr
+/******/ })();
+/******/
+/******/ /* webpack/runtime/jsonp chunk loading */
+/******/ (() => {
+/******/ // no baseURI
+/******/
+/******/ // object to store loaded and loading chunks
+/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
+/******/ // Promise = chunk loading, 0 = chunk loaded
+/******/ var installedChunks = {
+/******/ 0: 0
+/******/ };
+/******/
+/******/
+/******/ __webpack_require__.f.j = (chunkId, promises) => {
+/******/ // JSONP chunk loading for javascript
+/******/ var installedChunkData = __webpack_require__.o(installedChunks, chunkId) ? installedChunks[chunkId] : undefined;
+/******/ if(installedChunkData !== 0) { // 0 means "already installed".
+/******/
+/******/ // a Promise means "currently loading".
+/******/ if(installedChunkData) {
+/******/ promises.push(installedChunkData[2]);
+/******/ } else {
+/******/ if(true) { // all chunks have JS
+/******/ // setup Promise in chunk cache
+/******/ var promise = new Promise((resolve, reject) => {
+/******/ installedChunkData = installedChunks[chunkId] = [resolve, reject];
+/******/ });
+/******/ promises.push(installedChunkData[2] = promise);
+/******/
+/******/ // start chunk loading
+/******/ var url = __webpack_require__.p + __webpack_require__.u(chunkId);
+/******/ // create error before stack unwound to get useful stacktrace later
+/******/ var error = new Error();
+/******/ var loadingEnded = (event) => {
+/******/ if(__webpack_require__.o(installedChunks, chunkId)) {
+/******/ installedChunkData = installedChunks[chunkId];
+/******/ if(installedChunkData !== 0) installedChunks[chunkId] = undefined;
+/******/ if(installedChunkData) {
+/******/ var errorType = event && (event.type === 'load' ? 'missing' : event.type);
+/******/ var realSrc = event && event.target && event.target.src;
+/******/ error.message = 'Loading chunk ' + chunkId + ' failed.\n(' + errorType + ': ' + realSrc + ')';
+/******/ error.name = 'ChunkLoadError';
+/******/ error.type = errorType;
+/******/ error.request = realSrc;
+/******/ installedChunkData[1](error);
+/******/ }
+/******/ }
+/******/ };
+/******/ __webpack_require__.l(url, loadingEnded, "chunk-" + chunkId);
+/******/ } else installedChunks[chunkId] = 0;
+/******/ }
+/******/ }
+/******/ };
+/******/
+/******/ // no prefetching
+/******/
+/******/ // no preloaded
+/******/
+/******/ // no HMR
+/******/
+/******/ // no HMR manifest
+/******/
+/******/ // no deferred startup
+/******/
+/******/ // install a JSONP callback for chunk loading
+/******/ var webpackJsonpCallback = (data) => {
+/******/ var [chunkIds, moreModules, runtime] = data;
+/******/ // add "moreModules" to the modules object,
+/******/ // then flag all "chunkIds" as loaded and fire callback
+/******/ var moduleId, chunkId, i = 0, resolves = [];
+/******/ for(;i < chunkIds.length; i++) {
+/******/ chunkId = chunkIds[i];
+/******/ if(__webpack_require__.o(installedChunks, chunkId) && installedChunks[chunkId]) {
+/******/ resolves.push(installedChunks[chunkId][0]);
+/******/ }
+/******/ installedChunks[chunkId] = 0;
+/******/ }
+/******/ for(moduleId in moreModules) {
+/******/ if(__webpack_require__.o(moreModules, moduleId)) {
+/******/ __webpack_require__.m[moduleId] = moreModules[moduleId];
+/******/ }
+/******/ }
+/******/ if(runtime) runtime(__webpack_require__);
+/******/ parentChunkLoadingFunction(data);
+/******/ while(resolves.length) {
+/******/ resolves.shift()();
+/******/ }
+/******/
+/******/ }
+/******/
+/******/ var chunkLoadingGlobal = self["webpackChunk"] = self["webpackChunk"] || [];
+/******/ var parentChunkLoadingFunction = chunkLoadingGlobal.push.bind(chunkLoadingGlobal);
+/******/ chunkLoadingGlobal.push = webpackJsonpCallback;
+/******/ })();
+/******/
+/************************************************************************/
+/* eslint-env browser */
+
+// eslint-disable-next-line
+__webpack_require__.e(/* import() */ 1).then(__webpack_require__.bind(__webpack_require__, 1));
+
+/******/ })()
+;
\ No newline at end of file
diff --git a/test/cases/insert-function/src/index.js b/test/cases/insert-function/src/index.js
new file mode 100644
index 00000000..49171c3c
--- /dev/null
+++ b/test/cases/insert-function/src/index.js
@@ -0,0 +1,4 @@
+/* eslint-env browser */
+
+// eslint-disable-next-line
+import('./inject.css');
diff --git a/test/cases/insert-function/src/inject.css b/test/cases/insert-function/src/inject.css
new file mode 100644
index 00000000..67ce83e4
--- /dev/null
+++ b/test/cases/insert-function/src/inject.css
@@ -0,0 +1,3 @@
+body {
+ background: red;
+}
diff --git a/test/cases/insert-function/webpack.config.js b/test/cases/insert-function/webpack.config.js
new file mode 100644
index 00000000..49a85ef1
--- /dev/null
+++ b/test/cases/insert-function/webpack.config.js
@@ -0,0 +1,34 @@
+/* global document */
+
+const Self = require('../../../src/cjs');
+
+module.exports = {
+ module: {
+ rules: [
+ {
+ test: /\.css$/,
+ use: [
+ {
+ loader: Self.loader,
+ },
+ {
+ loader: 'css-loader',
+ },
+ ],
+ },
+ ],
+ },
+ plugins: [
+ new Self({
+ filename: '[name].css',
+ chunkFilename: '[id].css',
+ // eslint-disable-next-line
+ insert: function (linkTag) {
+ const reference = document.querySelector('.hot-reload');
+ if (reference) {
+ reference.parentNode.insertBefore(linkTag, reference);
+ }
+ },
+ }),
+ ],
+};
diff --git a/test/cases/insert-string/expected/webpack-4/1.css b/test/cases/insert-string/expected/webpack-4/1.css
new file mode 100644
index 00000000..cebc5c1c
--- /dev/null
+++ b/test/cases/insert-string/expected/webpack-4/1.css
@@ -0,0 +1,4 @@
+body {
+ background: red;
+}
+
diff --git a/test/cases/insert-string/expected/webpack-4/1.js b/test/cases/insert-string/expected/webpack-4/1.js
new file mode 100644
index 00000000..4292040c
--- /dev/null
+++ b/test/cases/insert-string/expected/webpack-4/1.js
@@ -0,0 +1,12 @@
+(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[1],[
+/* 0 */,
+/* 1 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+// extracted by mini-css-extract-plugin
+
+
+/***/ })
+]]);
\ No newline at end of file
diff --git a/test/cases/insert-string/expected/webpack-4/main.js b/test/cases/insert-string/expected/webpack-4/main.js
new file mode 100644
index 00000000..f4302e78
--- /dev/null
+++ b/test/cases/insert-string/expected/webpack-4/main.js
@@ -0,0 +1,259 @@
+/******/ (function(modules) { // webpackBootstrap
+/******/ // install a JSONP callback for chunk loading
+/******/ function webpackJsonpCallback(data) {
+/******/ var chunkIds = data[0];
+/******/ var moreModules = data[1];
+/******/
+/******/
+/******/ // add "moreModules" to the modules object,
+/******/ // then flag all "chunkIds" as loaded and fire callback
+/******/ var moduleId, chunkId, i = 0, resolves = [];
+/******/ for(;i < chunkIds.length; i++) {
+/******/ chunkId = chunkIds[i];
+/******/ if(Object.prototype.hasOwnProperty.call(installedChunks, chunkId) && installedChunks[chunkId]) {
+/******/ resolves.push(installedChunks[chunkId][0]);
+/******/ }
+/******/ installedChunks[chunkId] = 0;
+/******/ }
+/******/ for(moduleId in moreModules) {
+/******/ if(Object.prototype.hasOwnProperty.call(moreModules, moduleId)) {
+/******/ modules[moduleId] = moreModules[moduleId];
+/******/ }
+/******/ }
+/******/ if(parentJsonpFunction) parentJsonpFunction(data);
+/******/
+/******/ while(resolves.length) {
+/******/ resolves.shift()();
+/******/ }
+/******/
+/******/ };
+/******/
+/******/
+/******/ // The module cache
+/******/ var installedModules = {};
+/******/
+/******/ // object to store loaded CSS chunks
+/******/ var installedCssChunks = {
+/******/ 0: 0
+/******/ };
+/******/
+/******/ // object to store loaded and loading chunks
+/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
+/******/ // Promise = chunk loading, 0 = chunk loaded
+/******/ var installedChunks = {
+/******/ 0: 0
+/******/ };
+/******/
+/******/
+/******/
+/******/ // script path function
+/******/ function jsonpScriptSrc(chunkId) {
+/******/ return __webpack_require__.p + "" + ({}[chunkId]||chunkId) + ".js"
+/******/ }
+/******/
+/******/ // 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;
+/******/ }
+/******/
+/******/ // This file contains only the entry chunk.
+/******/ // The chunk loading function for additional chunks
+/******/ __webpack_require__.e = function requireEnsure(chunkId) {
+/******/ var promises = [];
+/******/
+/******/
+/******/ // mini-css-extract-plugin CSS loading
+/******/ var cssChunks = {"1":1};
+/******/ if(installedCssChunks[chunkId]) promises.push(installedCssChunks[chunkId]);
+/******/ else if(installedCssChunks[chunkId] !== 0 && cssChunks[chunkId]) {
+/******/ promises.push(installedCssChunks[chunkId] = new Promise(function(resolve, reject) {
+/******/ var href = "" + chunkId + ".css";
+/******/ var fullhref = __webpack_require__.p + href;
+/******/ var existingLinkTags = document.getElementsByTagName("link");
+/******/ for(var i = 0; i < existingLinkTags.length; i++) {
+/******/ var tag = existingLinkTags[i];
+/******/ var dataHref = tag.getAttribute("data-href") || tag.getAttribute("href");
+/******/ if(tag.rel === "stylesheet" && (dataHref === href || dataHref === fullhref)) return resolve();
+/******/ }
+/******/ var existingStyleTags = document.getElementsByTagName("style");
+/******/ for(var i = 0; i < existingStyleTags.length; i++) {
+/******/ var tag = existingStyleTags[i];
+/******/ var dataHref = tag.getAttribute("data-href");
+/******/ if(dataHref === href || dataHref === fullhref) return resolve();
+/******/ }
+/******/ var linkTag = document.createElement("link");
+/******/ linkTag.rel = "stylesheet";
+/******/ linkTag.type = "text/css";
+/******/ linkTag.onload = resolve;
+/******/ linkTag.onerror = function(event) {
+/******/ var request = event && event.target && event.target.src || fullhref;
+/******/ var err = new Error("Loading CSS chunk " + chunkId + " failed.\n(" + request + ")");
+/******/ err.code = "CSS_CHUNK_LOAD_FAILED";
+/******/ err.request = request;
+/******/ delete installedCssChunks[chunkId]
+/******/ linkTag.parentNode.removeChild(linkTag)
+/******/ reject(err);
+/******/ };
+/******/ linkTag.href = fullhref;
+/******/
+/******/ var target = document.querySelector("script[src='1.js']");
+/******/ target.parentNode.insertBefore(linkTag, target.nextSibling);
+/******/ }).then(function() {
+/******/ installedCssChunks[chunkId] = 0;
+/******/ }));
+/******/ }
+/******/
+/******/ // JSONP chunk loading for javascript
+/******/
+/******/ var installedChunkData = installedChunks[chunkId];
+/******/ if(installedChunkData !== 0) { // 0 means "already installed".
+/******/
+/******/ // a Promise means "currently loading".
+/******/ if(installedChunkData) {
+/******/ promises.push(installedChunkData[2]);
+/******/ } else {
+/******/ // setup Promise in chunk cache
+/******/ var promise = new Promise(function(resolve, reject) {
+/******/ installedChunkData = installedChunks[chunkId] = [resolve, reject];
+/******/ });
+/******/ promises.push(installedChunkData[2] = promise);
+/******/
+/******/ // start chunk loading
+/******/ var script = document.createElement('script');
+/******/ var onScriptComplete;
+/******/
+/******/ script.charset = 'utf-8';
+/******/ script.timeout = 120;
+/******/ if (__webpack_require__.nc) {
+/******/ script.setAttribute("nonce", __webpack_require__.nc);
+/******/ }
+/******/ script.src = jsonpScriptSrc(chunkId);
+/******/
+/******/ // create error before stack unwound to get useful stacktrace later
+/******/ var error = new Error();
+/******/ onScriptComplete = function (event) {
+/******/ // avoid mem leaks in IE.
+/******/ script.onerror = script.onload = null;
+/******/ clearTimeout(timeout);
+/******/ var chunk = installedChunks[chunkId];
+/******/ if(chunk !== 0) {
+/******/ if(chunk) {
+/******/ var errorType = event && (event.type === 'load' ? 'missing' : event.type);
+/******/ var realSrc = event && event.target && event.target.src;
+/******/ error.message = 'Loading chunk ' + chunkId + ' failed.\n(' + errorType + ': ' + realSrc + ')';
+/******/ error.name = 'ChunkLoadError';
+/******/ error.type = errorType;
+/******/ error.request = realSrc;
+/******/ chunk[1](error);
+/******/ }
+/******/ installedChunks[chunkId] = undefined;
+/******/ }
+/******/ };
+/******/ var timeout = setTimeout(function(){
+/******/ onScriptComplete({ type: 'timeout', target: script });
+/******/ }, 120000);
+/******/ script.onerror = script.onload = onScriptComplete;
+/******/ document.head.appendChild(script);
+/******/ }
+/******/ }
+/******/ return Promise.all(promises);
+/******/ };
+/******/
+/******/ // 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 = "";
+/******/
+/******/ // on error function for async loading
+/******/ __webpack_require__.oe = function(err) { console.error(err); throw err; };
+/******/
+/******/ var jsonpArray = window["webpackJsonp"] = window["webpackJsonp"] || [];
+/******/ var oldJsonpFunction = jsonpArray.push.bind(jsonpArray);
+/******/ jsonpArray.push = webpackJsonpCallback;
+/******/ jsonpArray = jsonpArray.slice();
+/******/ for(var i = 0; i < jsonpArray.length; i++) webpackJsonpCallback(jsonpArray[i]);
+/******/ var parentJsonpFunction = oldJsonpFunction;
+/******/
+/******/
+/******/ // Load entry module and return exports
+/******/ return __webpack_require__(__webpack_require__.s = 0);
+/******/ })
+/************************************************************************/
+/******/ ([
+/* 0 */
+/***/ (function(module, exports, __webpack_require__) {
+
+/* eslint-env browser */
+
+// eslint-disable-next-line
+__webpack_require__.e(/* import() */ 1).then(__webpack_require__.bind(null, 1));
+
+
+/***/ })
+/******/ ]);
\ No newline at end of file
diff --git a/test/cases/insert-string/expected/webpack-5/1.css b/test/cases/insert-string/expected/webpack-5/1.css
new file mode 100644
index 00000000..cebc5c1c
--- /dev/null
+++ b/test/cases/insert-string/expected/webpack-5/1.css
@@ -0,0 +1,4 @@
+body {
+ background: red;
+}
+
diff --git a/test/cases/insert-string/expected/webpack-5/1.js b/test/cases/insert-string/expected/webpack-5/1.js
new file mode 100644
index 00000000..df8cbd2a
--- /dev/null
+++ b/test/cases/insert-string/expected/webpack-5/1.js
@@ -0,0 +1,12 @@
+(self["webpackChunk"] = self["webpackChunk"] || []).push([[1],[
+/* 0 */,
+/* 1 */
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+// extracted by mini-css-extract-plugin
+
+
+/***/ })
+]]);
\ No newline at end of file
diff --git a/test/cases/insert-string/expected/webpack-5/main.js b/test/cases/insert-string/expected/webpack-5/main.js
new file mode 100644
index 00000000..22e824b6
--- /dev/null
+++ b/test/cases/insert-string/expected/webpack-5/main.js
@@ -0,0 +1,323 @@
+/******/ (() => { // webpackBootstrap
+/******/ var __webpack_modules__ = ({});
+/************************************************************************/
+/******/ // 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;
+/******/ }
+/******/
+/******/ // expose the modules object (__webpack_modules__)
+/******/ __webpack_require__.m = __webpack_modules__;
+/******/
+/************************************************************************/
+/******/ /* webpack/runtime/ensure chunk */
+/******/ (() => {
+/******/ __webpack_require__.f = {};
+/******/ // This file contains only the entry chunk.
+/******/ // The chunk loading function for additional chunks
+/******/ __webpack_require__.e = (chunkId) => {
+/******/ return Promise.all(Object.keys(__webpack_require__.f).reduce((promises, key) => {
+/******/ __webpack_require__.f[key](chunkId, promises);
+/******/ return promises;
+/******/ }, []));
+/******/ };
+/******/ })();
+/******/
+/******/ /* webpack/runtime/get javascript chunk filename */
+/******/ (() => {
+/******/ // This function allow to reference async chunks
+/******/ __webpack_require__.u = (chunkId) => {
+/******/ // return url for filenames based on template
+/******/ return "" + chunkId + ".js";
+/******/ };
+/******/ })();
+/******/
+/******/ /* webpack/runtime/get mini-css chunk filename */
+/******/ (() => {
+/******/ // This function allow to reference all chunks
+/******/ __webpack_require__.miniCssF = (chunkId) => {
+/******/ // return url for filenames not based on template
+/******/ if (chunkId === 1) return "1.css";
+/******/ // return url for filenames based on template
+/******/ return "" + "main" + ".css";
+/******/ };
+/******/ })();
+/******/
+/******/ /* webpack/runtime/global */
+/******/ (() => {
+/******/ __webpack_require__.g = (function() {
+/******/ if (typeof globalThis === 'object') return globalThis;
+/******/ try {
+/******/ return this || new Function('return this')();
+/******/ } catch (e) {
+/******/ if (typeof window === 'object') return window;
+/******/ }
+/******/ })();
+/******/ })();
+/******/
+/******/ /* webpack/runtime/hasOwnProperty shorthand */
+/******/ (() => {
+/******/ __webpack_require__.o = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop)
+/******/ })();
+/******/
+/******/ /* webpack/runtime/load script */
+/******/ (() => {
+/******/ var inProgress = {};
+/******/ // data-webpack is not used as build has no uniqueName
+/******/ // loadScript function to load a script via script tag
+/******/ __webpack_require__.l = (url, done, key) => {
+/******/ if(inProgress[url]) { inProgress[url].push(done); return; }
+/******/ var script, needAttach;
+/******/ if(key !== undefined) {
+/******/ var scripts = document.getElementsByTagName("script");
+/******/ for(var i = 0; i < scripts.length; i++) {
+/******/ var s = scripts[i];
+/******/ if(s.getAttribute("src") == url) { script = s; break; }
+/******/ }
+/******/ }
+/******/ if(!script) {
+/******/ needAttach = true;
+/******/ script = document.createElement('script');
+/******/
+/******/ script.charset = 'utf-8';
+/******/ script.timeout = 120;
+/******/ if (__webpack_require__.nc) {
+/******/ script.setAttribute("nonce", __webpack_require__.nc);
+/******/ }
+/******/
+/******/ script.src = url;
+/******/ }
+/******/ inProgress[url] = [done];
+/******/ var onScriptComplete = (prev, event) => {
+/******/ // avoid mem leaks in IE.
+/******/ script.onerror = script.onload = null;
+/******/ clearTimeout(timeout);
+/******/ var doneFns = inProgress[url];
+/******/ delete inProgress[url];
+/******/ script.parentNode && script.parentNode.removeChild(script);
+/******/ doneFns && doneFns.forEach((fn) => fn(event));
+/******/ if(prev) return prev(event);
+/******/ }
+/******/ ;
+/******/ var timeout = setTimeout(onScriptComplete.bind(null, undefined, { type: 'timeout', target: script }), 120000);
+/******/ script.onerror = onScriptComplete.bind(null, script.onerror);
+/******/ script.onload = onScriptComplete.bind(null, script.onload);
+/******/ needAttach && document.head.appendChild(script);
+/******/ };
+/******/ })();
+/******/
+/******/ /* 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 });
+/******/ };
+/******/ })();
+/******/
+/******/ /* webpack/runtime/publicPath */
+/******/ (() => {
+/******/ var scriptUrl;
+/******/ if (__webpack_require__.g.importScripts) scriptUrl = __webpack_require__.g.location + "";
+/******/ var document = __webpack_require__.g.document;
+/******/ if (!scriptUrl && document) {
+/******/ if (document.currentScript)
+/******/ scriptUrl = document.currentScript.src
+/******/ if (!scriptUrl) {
+/******/ var scripts = document.getElementsByTagName("script");
+/******/ if(scripts.length) scriptUrl = scripts[scripts.length - 1].src
+/******/ }
+/******/ }
+/******/ // When supporting browsers where an automatic publicPath is not supported you must specify an output.publicPath manually via configuration
+/******/ // or pass an empty string ("") and set the __webpack_public_path__ variable from your code to use your own logic.
+/******/ if (!scriptUrl) throw new Error("Automatic publicPath is not supported in this browser");
+/******/ scriptUrl = scriptUrl.replace(/#.*$/, "").replace(/\?.*$/, "").replace(/\/[^\/]+$/, "/");
+/******/ __webpack_require__.p = scriptUrl;
+/******/ })();
+/******/
+/******/ /* webpack/runtime/css loading */
+/******/ (() => {
+/******/ var createStylesheet = (fullhref, resolve, reject) => {
+/******/ var linkTag = document.createElement("link");
+/******/ linkTag.rel = "stylesheet";
+/******/ linkTag.type = "text/css";
+/******/ linkTag.onload = resolve;
+/******/ linkTag.onerror = function(event) {
+/******/ var request = event && event.target && event.target.src || fullhref;
+/******/ var err = new Error("Loading CSS chunk " + chunkId + " failed.\n(" + request + ")");
+/******/ err.code = "CSS_CHUNK_LOAD_FAILED";
+/******/ err.request = request;
+/******/ linkTag.parentNode.removeChild(linkTag)
+/******/ reject(err);
+/******/ };
+/******/ linkTag.href = fullhref;
+/******/
+/******/ var target = document.querySelector("script[src='1.js']");
+/******/ target.parentNode.insertBefore(linkTag, target.nextSibling);
+/******/ return linkTag;
+/******/ };
+/******/ var findStylesheet = (href, fullhref) => {
+/******/ var existingLinkTags = document.getElementsByTagName("link");
+/******/ for(var i = 0; i < existingLinkTags.length; i++) {
+/******/ var tag = existingLinkTags[i];
+/******/ var dataHref = tag.getAttribute("data-href") || tag.getAttribute("href");
+/******/ if(tag.rel === "stylesheet" && (dataHref === href || dataHref === fullhref)) return tag;
+/******/ }
+/******/ var existingStyleTags = document.getElementsByTagName("style");
+/******/ for(var i = 0; i < existingStyleTags.length; i++) {
+/******/ var tag = existingStyleTags[i];
+/******/ var dataHref = tag.getAttribute("data-href");
+/******/ if(dataHref === href || dataHref === fullhref) return tag;
+/******/ }
+/******/ };
+/******/ var loadStylesheet = (chunkId) => {
+/******/ return new Promise((resolve, reject) => {
+/******/ var href = __webpack_require__.miniCssF(chunkId);
+/******/ var fullhref = __webpack_require__.p + href;
+/******/ if(findStylesheet(href, fullhref)) return resolve();
+/******/ createStylesheet(fullhref, resolve, reject);
+/******/ });
+/******/ }
+/******/ // object to store loaded CSS chunks
+/******/ var installedCssChunks = {
+/******/ 0: 0
+/******/ };
+/******/
+/******/ __webpack_require__.f.miniCss = (chunkId, promises) => {
+/******/ var cssChunks = {"1":1};
+/******/ if(installedCssChunks[chunkId]) promises.push(installedCssChunks[chunkId]);
+/******/ else if(installedCssChunks[chunkId] !== 0 && cssChunks[chunkId]) {
+/******/ promises.push(installedCssChunks[chunkId] = loadStylesheet(chunkId).then(() => {
+/******/ installedCssChunks[chunkId] = 0;
+/******/ }, (e) => {
+/******/ delete installedCssChunks[chunkId];
+/******/ throw e;
+/******/ }));
+/******/ }
+/******/ };
+/******/
+/******/ // no hmr
+/******/ })();
+/******/
+/******/ /* webpack/runtime/jsonp chunk loading */
+/******/ (() => {
+/******/ // no baseURI
+/******/
+/******/ // object to store loaded and loading chunks
+/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
+/******/ // Promise = chunk loading, 0 = chunk loaded
+/******/ var installedChunks = {
+/******/ 0: 0
+/******/ };
+/******/
+/******/
+/******/ __webpack_require__.f.j = (chunkId, promises) => {
+/******/ // JSONP chunk loading for javascript
+/******/ var installedChunkData = __webpack_require__.o(installedChunks, chunkId) ? installedChunks[chunkId] : undefined;
+/******/ if(installedChunkData !== 0) { // 0 means "already installed".
+/******/
+/******/ // a Promise means "currently loading".
+/******/ if(installedChunkData) {
+/******/ promises.push(installedChunkData[2]);
+/******/ } else {
+/******/ if(true) { // all chunks have JS
+/******/ // setup Promise in chunk cache
+/******/ var promise = new Promise((resolve, reject) => {
+/******/ installedChunkData = installedChunks[chunkId] = [resolve, reject];
+/******/ });
+/******/ promises.push(installedChunkData[2] = promise);
+/******/
+/******/ // start chunk loading
+/******/ var url = __webpack_require__.p + __webpack_require__.u(chunkId);
+/******/ // create error before stack unwound to get useful stacktrace later
+/******/ var error = new Error();
+/******/ var loadingEnded = (event) => {
+/******/ if(__webpack_require__.o(installedChunks, chunkId)) {
+/******/ installedChunkData = installedChunks[chunkId];
+/******/ if(installedChunkData !== 0) installedChunks[chunkId] = undefined;
+/******/ if(installedChunkData) {
+/******/ var errorType = event && (event.type === 'load' ? 'missing' : event.type);
+/******/ var realSrc = event && event.target && event.target.src;
+/******/ error.message = 'Loading chunk ' + chunkId + ' failed.\n(' + errorType + ': ' + realSrc + ')';
+/******/ error.name = 'ChunkLoadError';
+/******/ error.type = errorType;
+/******/ error.request = realSrc;
+/******/ installedChunkData[1](error);
+/******/ }
+/******/ }
+/******/ };
+/******/ __webpack_require__.l(url, loadingEnded, "chunk-" + chunkId);
+/******/ } else installedChunks[chunkId] = 0;
+/******/ }
+/******/ }
+/******/ };
+/******/
+/******/ // no prefetching
+/******/
+/******/ // no preloaded
+/******/
+/******/ // no HMR
+/******/
+/******/ // no HMR manifest
+/******/
+/******/ // no deferred startup
+/******/
+/******/ // install a JSONP callback for chunk loading
+/******/ var webpackJsonpCallback = (data) => {
+/******/ var [chunkIds, moreModules, runtime] = data;
+/******/ // add "moreModules" to the modules object,
+/******/ // then flag all "chunkIds" as loaded and fire callback
+/******/ var moduleId, chunkId, i = 0, resolves = [];
+/******/ for(;i < chunkIds.length; i++) {
+/******/ chunkId = chunkIds[i];
+/******/ if(__webpack_require__.o(installedChunks, chunkId) && installedChunks[chunkId]) {
+/******/ resolves.push(installedChunks[chunkId][0]);
+/******/ }
+/******/ installedChunks[chunkId] = 0;
+/******/ }
+/******/ for(moduleId in moreModules) {
+/******/ if(__webpack_require__.o(moreModules, moduleId)) {
+/******/ __webpack_require__.m[moduleId] = moreModules[moduleId];
+/******/ }
+/******/ }
+/******/ if(runtime) runtime(__webpack_require__);
+/******/ parentChunkLoadingFunction(data);
+/******/ while(resolves.length) {
+/******/ resolves.shift()();
+/******/ }
+/******/
+/******/ }
+/******/
+/******/ var chunkLoadingGlobal = self["webpackChunk"] = self["webpackChunk"] || [];
+/******/ var parentChunkLoadingFunction = chunkLoadingGlobal.push.bind(chunkLoadingGlobal);
+/******/ chunkLoadingGlobal.push = webpackJsonpCallback;
+/******/ })();
+/******/
+/************************************************************************/
+/* eslint-env browser */
+
+// eslint-disable-next-line
+__webpack_require__.e(/* import() */ 1).then(__webpack_require__.bind(__webpack_require__, 1));
+
+/******/ })()
+;
\ No newline at end of file
diff --git a/test/cases/insert-string/src/index.js b/test/cases/insert-string/src/index.js
new file mode 100644
index 00000000..49171c3c
--- /dev/null
+++ b/test/cases/insert-string/src/index.js
@@ -0,0 +1,4 @@
+/* eslint-env browser */
+
+// eslint-disable-next-line
+import('./inject.css');
diff --git a/test/cases/insert-string/src/inject.css b/test/cases/insert-string/src/inject.css
new file mode 100644
index 00000000..67ce83e4
--- /dev/null
+++ b/test/cases/insert-string/src/inject.css
@@ -0,0 +1,3 @@
+body {
+ background: red;
+}
diff --git a/test/cases/insert-string/webpack.config.js b/test/cases/insert-string/webpack.config.js
new file mode 100644
index 00000000..85943cd1
--- /dev/null
+++ b/test/cases/insert-string/webpack.config.js
@@ -0,0 +1,28 @@
+/* global document */
+
+const Self = require('../../../src/cjs');
+
+module.exports = {
+ module: {
+ rules: [
+ {
+ test: /\.css$/,
+ use: [
+ {
+ loader: Self.loader,
+ },
+ {
+ loader: 'css-loader',
+ },
+ ],
+ },
+ ],
+ },
+ plugins: [
+ new Self({
+ filename: '[name].css',
+ chunkFilename: '[id].css',
+ insert: "script[src='1.js']",
+ }),
+ ],
+};
diff --git a/test/cases/insert-undefined/expected/webpack-4/1.css b/test/cases/insert-undefined/expected/webpack-4/1.css
new file mode 100644
index 00000000..cebc5c1c
--- /dev/null
+++ b/test/cases/insert-undefined/expected/webpack-4/1.css
@@ -0,0 +1,4 @@
+body {
+ background: red;
+}
+
diff --git a/test/cases/insert-undefined/expected/webpack-4/1.js b/test/cases/insert-undefined/expected/webpack-4/1.js
new file mode 100644
index 00000000..4292040c
--- /dev/null
+++ b/test/cases/insert-undefined/expected/webpack-4/1.js
@@ -0,0 +1,12 @@
+(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[1],[
+/* 0 */,
+/* 1 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+// extracted by mini-css-extract-plugin
+
+
+/***/ })
+]]);
\ No newline at end of file
diff --git a/test/cases/insert-undefined/expected/webpack-4/main.js b/test/cases/insert-undefined/expected/webpack-4/main.js
new file mode 100644
index 00000000..91e86288
--- /dev/null
+++ b/test/cases/insert-undefined/expected/webpack-4/main.js
@@ -0,0 +1,259 @@
+/******/ (function(modules) { // webpackBootstrap
+/******/ // install a JSONP callback for chunk loading
+/******/ function webpackJsonpCallback(data) {
+/******/ var chunkIds = data[0];
+/******/ var moreModules = data[1];
+/******/
+/******/
+/******/ // add "moreModules" to the modules object,
+/******/ // then flag all "chunkIds" as loaded and fire callback
+/******/ var moduleId, chunkId, i = 0, resolves = [];
+/******/ for(;i < chunkIds.length; i++) {
+/******/ chunkId = chunkIds[i];
+/******/ if(Object.prototype.hasOwnProperty.call(installedChunks, chunkId) && installedChunks[chunkId]) {
+/******/ resolves.push(installedChunks[chunkId][0]);
+/******/ }
+/******/ installedChunks[chunkId] = 0;
+/******/ }
+/******/ for(moduleId in moreModules) {
+/******/ if(Object.prototype.hasOwnProperty.call(moreModules, moduleId)) {
+/******/ modules[moduleId] = moreModules[moduleId];
+/******/ }
+/******/ }
+/******/ if(parentJsonpFunction) parentJsonpFunction(data);
+/******/
+/******/ while(resolves.length) {
+/******/ resolves.shift()();
+/******/ }
+/******/
+/******/ };
+/******/
+/******/
+/******/ // The module cache
+/******/ var installedModules = {};
+/******/
+/******/ // object to store loaded CSS chunks
+/******/ var installedCssChunks = {
+/******/ 0: 0
+/******/ };
+/******/
+/******/ // object to store loaded and loading chunks
+/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
+/******/ // Promise = chunk loading, 0 = chunk loaded
+/******/ var installedChunks = {
+/******/ 0: 0
+/******/ };
+/******/
+/******/
+/******/
+/******/ // script path function
+/******/ function jsonpScriptSrc(chunkId) {
+/******/ return __webpack_require__.p + "" + ({}[chunkId]||chunkId) + ".js"
+/******/ }
+/******/
+/******/ // 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;
+/******/ }
+/******/
+/******/ // This file contains only the entry chunk.
+/******/ // The chunk loading function for additional chunks
+/******/ __webpack_require__.e = function requireEnsure(chunkId) {
+/******/ var promises = [];
+/******/
+/******/
+/******/ // mini-css-extract-plugin CSS loading
+/******/ var cssChunks = {"1":1};
+/******/ if(installedCssChunks[chunkId]) promises.push(installedCssChunks[chunkId]);
+/******/ else if(installedCssChunks[chunkId] !== 0 && cssChunks[chunkId]) {
+/******/ promises.push(installedCssChunks[chunkId] = new Promise(function(resolve, reject) {
+/******/ var href = "" + chunkId + ".css";
+/******/ var fullhref = __webpack_require__.p + href;
+/******/ var existingLinkTags = document.getElementsByTagName("link");
+/******/ for(var i = 0; i < existingLinkTags.length; i++) {
+/******/ var tag = existingLinkTags[i];
+/******/ var dataHref = tag.getAttribute("data-href") || tag.getAttribute("href");
+/******/ if(tag.rel === "stylesheet" && (dataHref === href || dataHref === fullhref)) return resolve();
+/******/ }
+/******/ var existingStyleTags = document.getElementsByTagName("style");
+/******/ for(var i = 0; i < existingStyleTags.length; i++) {
+/******/ var tag = existingStyleTags[i];
+/******/ var dataHref = tag.getAttribute("data-href");
+/******/ if(dataHref === href || dataHref === fullhref) return resolve();
+/******/ }
+/******/ var linkTag = document.createElement("link");
+/******/ linkTag.rel = "stylesheet";
+/******/ linkTag.type = "text/css";
+/******/ linkTag.onload = resolve;
+/******/ linkTag.onerror = function(event) {
+/******/ var request = event && event.target && event.target.src || fullhref;
+/******/ var err = new Error("Loading CSS chunk " + chunkId + " failed.\n(" + request + ")");
+/******/ err.code = "CSS_CHUNK_LOAD_FAILED";
+/******/ err.request = request;
+/******/ delete installedCssChunks[chunkId]
+/******/ linkTag.parentNode.removeChild(linkTag)
+/******/ reject(err);
+/******/ };
+/******/ linkTag.href = fullhref;
+/******/
+/******/ var head = document.getElementsByTagName("head")[0];
+/******/ head.appendChild(linkTag);
+/******/ }).then(function() {
+/******/ installedCssChunks[chunkId] = 0;
+/******/ }));
+/******/ }
+/******/
+/******/ // JSONP chunk loading for javascript
+/******/
+/******/ var installedChunkData = installedChunks[chunkId];
+/******/ if(installedChunkData !== 0) { // 0 means "already installed".
+/******/
+/******/ // a Promise means "currently loading".
+/******/ if(installedChunkData) {
+/******/ promises.push(installedChunkData[2]);
+/******/ } else {
+/******/ // setup Promise in chunk cache
+/******/ var promise = new Promise(function(resolve, reject) {
+/******/ installedChunkData = installedChunks[chunkId] = [resolve, reject];
+/******/ });
+/******/ promises.push(installedChunkData[2] = promise);
+/******/
+/******/ // start chunk loading
+/******/ var script = document.createElement('script');
+/******/ var onScriptComplete;
+/******/
+/******/ script.charset = 'utf-8';
+/******/ script.timeout = 120;
+/******/ if (__webpack_require__.nc) {
+/******/ script.setAttribute("nonce", __webpack_require__.nc);
+/******/ }
+/******/ script.src = jsonpScriptSrc(chunkId);
+/******/
+/******/ // create error before stack unwound to get useful stacktrace later
+/******/ var error = new Error();
+/******/ onScriptComplete = function (event) {
+/******/ // avoid mem leaks in IE.
+/******/ script.onerror = script.onload = null;
+/******/ clearTimeout(timeout);
+/******/ var chunk = installedChunks[chunkId];
+/******/ if(chunk !== 0) {
+/******/ if(chunk) {
+/******/ var errorType = event && (event.type === 'load' ? 'missing' : event.type);
+/******/ var realSrc = event && event.target && event.target.src;
+/******/ error.message = 'Loading chunk ' + chunkId + ' failed.\n(' + errorType + ': ' + realSrc + ')';
+/******/ error.name = 'ChunkLoadError';
+/******/ error.type = errorType;
+/******/ error.request = realSrc;
+/******/ chunk[1](error);
+/******/ }
+/******/ installedChunks[chunkId] = undefined;
+/******/ }
+/******/ };
+/******/ var timeout = setTimeout(function(){
+/******/ onScriptComplete({ type: 'timeout', target: script });
+/******/ }, 120000);
+/******/ script.onerror = script.onload = onScriptComplete;
+/******/ document.head.appendChild(script);
+/******/ }
+/******/ }
+/******/ return Promise.all(promises);
+/******/ };
+/******/
+/******/ // 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 = "";
+/******/
+/******/ // on error function for async loading
+/******/ __webpack_require__.oe = function(err) { console.error(err); throw err; };
+/******/
+/******/ var jsonpArray = window["webpackJsonp"] = window["webpackJsonp"] || [];
+/******/ var oldJsonpFunction = jsonpArray.push.bind(jsonpArray);
+/******/ jsonpArray.push = webpackJsonpCallback;
+/******/ jsonpArray = jsonpArray.slice();
+/******/ for(var i = 0; i < jsonpArray.length; i++) webpackJsonpCallback(jsonpArray[i]);
+/******/ var parentJsonpFunction = oldJsonpFunction;
+/******/
+/******/
+/******/ // Load entry module and return exports
+/******/ return __webpack_require__(__webpack_require__.s = 0);
+/******/ })
+/************************************************************************/
+/******/ ([
+/* 0 */
+/***/ (function(module, exports, __webpack_require__) {
+
+/* eslint-env browser */
+
+// eslint-disable-next-line
+__webpack_require__.e(/* import() */ 1).then(__webpack_require__.bind(null, 1));
+
+
+/***/ })
+/******/ ]);
\ No newline at end of file
diff --git a/test/cases/insert-undefined/expected/webpack-5/1.css b/test/cases/insert-undefined/expected/webpack-5/1.css
new file mode 100644
index 00000000..cebc5c1c
--- /dev/null
+++ b/test/cases/insert-undefined/expected/webpack-5/1.css
@@ -0,0 +1,4 @@
+body {
+ background: red;
+}
+
diff --git a/test/cases/insert-undefined/expected/webpack-5/1.js b/test/cases/insert-undefined/expected/webpack-5/1.js
new file mode 100644
index 00000000..df8cbd2a
--- /dev/null
+++ b/test/cases/insert-undefined/expected/webpack-5/1.js
@@ -0,0 +1,12 @@
+(self["webpackChunk"] = self["webpackChunk"] || []).push([[1],[
+/* 0 */,
+/* 1 */
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+// extracted by mini-css-extract-plugin
+
+
+/***/ })
+]]);
\ No newline at end of file
diff --git a/test/cases/insert-undefined/expected/webpack-5/main.js b/test/cases/insert-undefined/expected/webpack-5/main.js
new file mode 100644
index 00000000..7dc86067
--- /dev/null
+++ b/test/cases/insert-undefined/expected/webpack-5/main.js
@@ -0,0 +1,323 @@
+/******/ (() => { // webpackBootstrap
+/******/ var __webpack_modules__ = ({});
+/************************************************************************/
+/******/ // 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;
+/******/ }
+/******/
+/******/ // expose the modules object (__webpack_modules__)
+/******/ __webpack_require__.m = __webpack_modules__;
+/******/
+/************************************************************************/
+/******/ /* webpack/runtime/ensure chunk */
+/******/ (() => {
+/******/ __webpack_require__.f = {};
+/******/ // This file contains only the entry chunk.
+/******/ // The chunk loading function for additional chunks
+/******/ __webpack_require__.e = (chunkId) => {
+/******/ return Promise.all(Object.keys(__webpack_require__.f).reduce((promises, key) => {
+/******/ __webpack_require__.f[key](chunkId, promises);
+/******/ return promises;
+/******/ }, []));
+/******/ };
+/******/ })();
+/******/
+/******/ /* webpack/runtime/get javascript chunk filename */
+/******/ (() => {
+/******/ // This function allow to reference async chunks
+/******/ __webpack_require__.u = (chunkId) => {
+/******/ // return url for filenames based on template
+/******/ return "" + chunkId + ".js";
+/******/ };
+/******/ })();
+/******/
+/******/ /* webpack/runtime/get mini-css chunk filename */
+/******/ (() => {
+/******/ // This function allow to reference all chunks
+/******/ __webpack_require__.miniCssF = (chunkId) => {
+/******/ // return url for filenames not based on template
+/******/ if (chunkId === 1) return "1.css";
+/******/ // return url for filenames based on template
+/******/ return "" + "main" + ".css";
+/******/ };
+/******/ })();
+/******/
+/******/ /* webpack/runtime/global */
+/******/ (() => {
+/******/ __webpack_require__.g = (function() {
+/******/ if (typeof globalThis === 'object') return globalThis;
+/******/ try {
+/******/ return this || new Function('return this')();
+/******/ } catch (e) {
+/******/ if (typeof window === 'object') return window;
+/******/ }
+/******/ })();
+/******/ })();
+/******/
+/******/ /* webpack/runtime/hasOwnProperty shorthand */
+/******/ (() => {
+/******/ __webpack_require__.o = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop)
+/******/ })();
+/******/
+/******/ /* webpack/runtime/load script */
+/******/ (() => {
+/******/ var inProgress = {};
+/******/ // data-webpack is not used as build has no uniqueName
+/******/ // loadScript function to load a script via script tag
+/******/ __webpack_require__.l = (url, done, key) => {
+/******/ if(inProgress[url]) { inProgress[url].push(done); return; }
+/******/ var script, needAttach;
+/******/ if(key !== undefined) {
+/******/ var scripts = document.getElementsByTagName("script");
+/******/ for(var i = 0; i < scripts.length; i++) {
+/******/ var s = scripts[i];
+/******/ if(s.getAttribute("src") == url) { script = s; break; }
+/******/ }
+/******/ }
+/******/ if(!script) {
+/******/ needAttach = true;
+/******/ script = document.createElement('script');
+/******/
+/******/ script.charset = 'utf-8';
+/******/ script.timeout = 120;
+/******/ if (__webpack_require__.nc) {
+/******/ script.setAttribute("nonce", __webpack_require__.nc);
+/******/ }
+/******/
+/******/ script.src = url;
+/******/ }
+/******/ inProgress[url] = [done];
+/******/ var onScriptComplete = (prev, event) => {
+/******/ // avoid mem leaks in IE.
+/******/ script.onerror = script.onload = null;
+/******/ clearTimeout(timeout);
+/******/ var doneFns = inProgress[url];
+/******/ delete inProgress[url];
+/******/ script.parentNode && script.parentNode.removeChild(script);
+/******/ doneFns && doneFns.forEach((fn) => fn(event));
+/******/ if(prev) return prev(event);
+/******/ }
+/******/ ;
+/******/ var timeout = setTimeout(onScriptComplete.bind(null, undefined, { type: 'timeout', target: script }), 120000);
+/******/ script.onerror = onScriptComplete.bind(null, script.onerror);
+/******/ script.onload = onScriptComplete.bind(null, script.onload);
+/******/ needAttach && document.head.appendChild(script);
+/******/ };
+/******/ })();
+/******/
+/******/ /* 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 });
+/******/ };
+/******/ })();
+/******/
+/******/ /* webpack/runtime/publicPath */
+/******/ (() => {
+/******/ var scriptUrl;
+/******/ if (__webpack_require__.g.importScripts) scriptUrl = __webpack_require__.g.location + "";
+/******/ var document = __webpack_require__.g.document;
+/******/ if (!scriptUrl && document) {
+/******/ if (document.currentScript)
+/******/ scriptUrl = document.currentScript.src
+/******/ if (!scriptUrl) {
+/******/ var scripts = document.getElementsByTagName("script");
+/******/ if(scripts.length) scriptUrl = scripts[scripts.length - 1].src
+/******/ }
+/******/ }
+/******/ // When supporting browsers where an automatic publicPath is not supported you must specify an output.publicPath manually via configuration
+/******/ // or pass an empty string ("") and set the __webpack_public_path__ variable from your code to use your own logic.
+/******/ if (!scriptUrl) throw new Error("Automatic publicPath is not supported in this browser");
+/******/ scriptUrl = scriptUrl.replace(/#.*$/, "").replace(/\?.*$/, "").replace(/\/[^\/]+$/, "/");
+/******/ __webpack_require__.p = scriptUrl;
+/******/ })();
+/******/
+/******/ /* webpack/runtime/css loading */
+/******/ (() => {
+/******/ var createStylesheet = (fullhref, resolve, reject) => {
+/******/ var linkTag = document.createElement("link");
+/******/ linkTag.rel = "stylesheet";
+/******/ linkTag.type = "text/css";
+/******/ linkTag.onload = resolve;
+/******/ linkTag.onerror = function(event) {
+/******/ var request = event && event.target && event.target.src || fullhref;
+/******/ var err = new Error("Loading CSS chunk " + chunkId + " failed.\n(" + request + ")");
+/******/ err.code = "CSS_CHUNK_LOAD_FAILED";
+/******/ err.request = request;
+/******/ linkTag.parentNode.removeChild(linkTag)
+/******/ reject(err);
+/******/ };
+/******/ linkTag.href = fullhref;
+/******/
+/******/ var head = document.getElementsByTagName("head")[0];
+/******/ head.appendChild(linkTag);
+/******/ return linkTag;
+/******/ };
+/******/ var findStylesheet = (href, fullhref) => {
+/******/ var existingLinkTags = document.getElementsByTagName("link");
+/******/ for(var i = 0; i < existingLinkTags.length; i++) {
+/******/ var tag = existingLinkTags[i];
+/******/ var dataHref = tag.getAttribute("data-href") || tag.getAttribute("href");
+/******/ if(tag.rel === "stylesheet" && (dataHref === href || dataHref === fullhref)) return tag;
+/******/ }
+/******/ var existingStyleTags = document.getElementsByTagName("style");
+/******/ for(var i = 0; i < existingStyleTags.length; i++) {
+/******/ var tag = existingStyleTags[i];
+/******/ var dataHref = tag.getAttribute("data-href");
+/******/ if(dataHref === href || dataHref === fullhref) return tag;
+/******/ }
+/******/ };
+/******/ var loadStylesheet = (chunkId) => {
+/******/ return new Promise((resolve, reject) => {
+/******/ var href = __webpack_require__.miniCssF(chunkId);
+/******/ var fullhref = __webpack_require__.p + href;
+/******/ if(findStylesheet(href, fullhref)) return resolve();
+/******/ createStylesheet(fullhref, resolve, reject);
+/******/ });
+/******/ }
+/******/ // object to store loaded CSS chunks
+/******/ var installedCssChunks = {
+/******/ 0: 0
+/******/ };
+/******/
+/******/ __webpack_require__.f.miniCss = (chunkId, promises) => {
+/******/ var cssChunks = {"1":1};
+/******/ if(installedCssChunks[chunkId]) promises.push(installedCssChunks[chunkId]);
+/******/ else if(installedCssChunks[chunkId] !== 0 && cssChunks[chunkId]) {
+/******/ promises.push(installedCssChunks[chunkId] = loadStylesheet(chunkId).then(() => {
+/******/ installedCssChunks[chunkId] = 0;
+/******/ }, (e) => {
+/******/ delete installedCssChunks[chunkId];
+/******/ throw e;
+/******/ }));
+/******/ }
+/******/ };
+/******/
+/******/ // no hmr
+/******/ })();
+/******/
+/******/ /* webpack/runtime/jsonp chunk loading */
+/******/ (() => {
+/******/ // no baseURI
+/******/
+/******/ // object to store loaded and loading chunks
+/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
+/******/ // Promise = chunk loading, 0 = chunk loaded
+/******/ var installedChunks = {
+/******/ 0: 0
+/******/ };
+/******/
+/******/
+/******/ __webpack_require__.f.j = (chunkId, promises) => {
+/******/ // JSONP chunk loading for javascript
+/******/ var installedChunkData = __webpack_require__.o(installedChunks, chunkId) ? installedChunks[chunkId] : undefined;
+/******/ if(installedChunkData !== 0) { // 0 means "already installed".
+/******/
+/******/ // a Promise means "currently loading".
+/******/ if(installedChunkData) {
+/******/ promises.push(installedChunkData[2]);
+/******/ } else {
+/******/ if(true) { // all chunks have JS
+/******/ // setup Promise in chunk cache
+/******/ var promise = new Promise((resolve, reject) => {
+/******/ installedChunkData = installedChunks[chunkId] = [resolve, reject];
+/******/ });
+/******/ promises.push(installedChunkData[2] = promise);
+/******/
+/******/ // start chunk loading
+/******/ var url = __webpack_require__.p + __webpack_require__.u(chunkId);
+/******/ // create error before stack unwound to get useful stacktrace later
+/******/ var error = new Error();
+/******/ var loadingEnded = (event) => {
+/******/ if(__webpack_require__.o(installedChunks, chunkId)) {
+/******/ installedChunkData = installedChunks[chunkId];
+/******/ if(installedChunkData !== 0) installedChunks[chunkId] = undefined;
+/******/ if(installedChunkData) {
+/******/ var errorType = event && (event.type === 'load' ? 'missing' : event.type);
+/******/ var realSrc = event && event.target && event.target.src;
+/******/ error.message = 'Loading chunk ' + chunkId + ' failed.\n(' + errorType + ': ' + realSrc + ')';
+/******/ error.name = 'ChunkLoadError';
+/******/ error.type = errorType;
+/******/ error.request = realSrc;
+/******/ installedChunkData[1](error);
+/******/ }
+/******/ }
+/******/ };
+/******/ __webpack_require__.l(url, loadingEnded, "chunk-" + chunkId);
+/******/ } else installedChunks[chunkId] = 0;
+/******/ }
+/******/ }
+/******/ };
+/******/
+/******/ // no prefetching
+/******/
+/******/ // no preloaded
+/******/
+/******/ // no HMR
+/******/
+/******/ // no HMR manifest
+/******/
+/******/ // no deferred startup
+/******/
+/******/ // install a JSONP callback for chunk loading
+/******/ var webpackJsonpCallback = (data) => {
+/******/ var [chunkIds, moreModules, runtime] = data;
+/******/ // add "moreModules" to the modules object,
+/******/ // then flag all "chunkIds" as loaded and fire callback
+/******/ var moduleId, chunkId, i = 0, resolves = [];
+/******/ for(;i < chunkIds.length; i++) {
+/******/ chunkId = chunkIds[i];
+/******/ if(__webpack_require__.o(installedChunks, chunkId) && installedChunks[chunkId]) {
+/******/ resolves.push(installedChunks[chunkId][0]);
+/******/ }
+/******/ installedChunks[chunkId] = 0;
+/******/ }
+/******/ for(moduleId in moreModules) {
+/******/ if(__webpack_require__.o(moreModules, moduleId)) {
+/******/ __webpack_require__.m[moduleId] = moreModules[moduleId];
+/******/ }
+/******/ }
+/******/ if(runtime) runtime(__webpack_require__);
+/******/ parentChunkLoadingFunction(data);
+/******/ while(resolves.length) {
+/******/ resolves.shift()();
+/******/ }
+/******/
+/******/ }
+/******/
+/******/ var chunkLoadingGlobal = self["webpackChunk"] = self["webpackChunk"] || [];
+/******/ var parentChunkLoadingFunction = chunkLoadingGlobal.push.bind(chunkLoadingGlobal);
+/******/ chunkLoadingGlobal.push = webpackJsonpCallback;
+/******/ })();
+/******/
+/************************************************************************/
+/* eslint-env browser */
+
+// eslint-disable-next-line
+__webpack_require__.e(/* import() */ 1).then(__webpack_require__.bind(__webpack_require__, 1));
+
+/******/ })()
+;
\ No newline at end of file
diff --git a/test/cases/insert-undefined/src/index.js b/test/cases/insert-undefined/src/index.js
new file mode 100644
index 00000000..49171c3c
--- /dev/null
+++ b/test/cases/insert-undefined/src/index.js
@@ -0,0 +1,4 @@
+/* eslint-env browser */
+
+// eslint-disable-next-line
+import('./inject.css');
diff --git a/test/cases/insert-undefined/src/inject.css b/test/cases/insert-undefined/src/inject.css
new file mode 100644
index 00000000..67ce83e4
--- /dev/null
+++ b/test/cases/insert-undefined/src/inject.css
@@ -0,0 +1,3 @@
+body {
+ background: red;
+}
diff --git a/test/cases/insert-undefined/webpack.config.js b/test/cases/insert-undefined/webpack.config.js
new file mode 100644
index 00000000..cff5a5fb
--- /dev/null
+++ b/test/cases/insert-undefined/webpack.config.js
@@ -0,0 +1,27 @@
+/* global document */
+
+const Self = require('../../../src/cjs.js');
+
+module.exports = {
+ module: {
+ rules: [
+ {
+ test: /\.css$/,
+ use: [
+ {
+ loader: Self.loader,
+ },
+ {
+ loader: 'css-loader',
+ },
+ ],
+ },
+ ],
+ },
+ plugins: [
+ new Self({
+ filename: '[name].css',
+ chunkFilename: '[id].css',
+ }),
+ ],
+};
diff --git a/test/fixtures/insert.js b/test/fixtures/insert.js
new file mode 100644
index 00000000..1b9d3ae6
--- /dev/null
+++ b/test/fixtures/insert.js
@@ -0,0 +1,2 @@
+/* eslint-disable-next-line no-unused-expressions */
+import(/* webpackChunkName: "simple" */ './simple.css');
diff --git a/test/helpers/getErrors.js b/test/helpers/getErrors.js
new file mode 100644
index 00000000..716fbbb4
--- /dev/null
+++ b/test/helpers/getErrors.js
@@ -0,0 +1,5 @@
+import normalizeErrors from './normalizeErrors';
+
+export default (stats) => {
+ return normalizeErrors(stats.compilation.errors);
+};
diff --git a/test/helpers/getWarnings.js b/test/helpers/getWarnings.js
new file mode 100644
index 00000000..c8a09d6d
--- /dev/null
+++ b/test/helpers/getWarnings.js
@@ -0,0 +1,5 @@
+import normalizeErrors from './normalizeErrors';
+
+export default (stats) => {
+ return normalizeErrors(stats.compilation.warnings);
+};
diff --git a/test/helpers/index.js b/test/helpers/index.js
index 1446ee47..bb004e01 100644
--- a/test/helpers/index.js
+++ b/test/helpers/index.js
@@ -1,5 +1,17 @@
import compile from './compile';
import getCompiler from './getCompiler';
import source from './source';
+import readAsset from './readAsset';
+import runInJsDom from './runInJsDom';
+import getErrors from './getErrors';
+import getWarnings from './getWarnings';
-export { source, compile, getCompiler };
+export {
+ source,
+ compile,
+ getCompiler,
+ readAsset,
+ runInJsDom,
+ getErrors,
+ getWarnings,
+};
diff --git a/test/helpers/normalizeErrors.js b/test/helpers/normalizeErrors.js
new file mode 100644
index 00000000..c6d0f160
--- /dev/null
+++ b/test/helpers/normalizeErrors.js
@@ -0,0 +1,19 @@
+function removeCWD(str) {
+ const isWin = process.platform === 'win32';
+ let cwd = process.cwd();
+
+ if (isWin) {
+ // eslint-disable-next-line no-param-reassign
+ str = str.replace(/\\/g, '/');
+ // eslint-disable-next-line no-param-reassign
+ cwd = cwd.replace(/\\/g, '/');
+ }
+
+ return str.replace(new RegExp(cwd, 'g'), '');
+}
+
+export default (errors) => {
+ return errors.map((error) =>
+ removeCWD(error.toString().split('\n').slice(0, 2).join('\n'))
+ );
+};
diff --git a/test/helpers/readAsset.js b/test/helpers/readAsset.js
new file mode 100644
index 00000000..8f4699f0
--- /dev/null
+++ b/test/helpers/readAsset.js
@@ -0,0 +1,23 @@
+import path from 'path';
+
+export default (asset, compiler, stats) => {
+ const usedFs = compiler.outputFileSystem;
+ const outputPath = stats.compilation.outputOptions.path;
+
+ let data = '';
+ let targetFile = asset;
+
+ const queryStringIdx = targetFile.indexOf('?');
+
+ if (queryStringIdx >= 0) {
+ targetFile = targetFile.substr(0, queryStringIdx);
+ }
+
+ try {
+ data = usedFs.readFileSync(path.join(outputPath, targetFile)).toString();
+ } catch (error) {
+ data = error.toString();
+ }
+
+ return data;
+};
diff --git a/test/helpers/runInJsDom.js b/test/helpers/runInJsDom.js
new file mode 100644
index 00000000..343a06cc
--- /dev/null
+++ b/test/helpers/runInJsDom.js
@@ -0,0 +1,44 @@
+import jsdom from 'jsdom';
+
+import { readAsset } from './index';
+
+function runInJsDom(assetName, compiler, stats, testFn) {
+ const bundle = readAsset(assetName, compiler, stats);
+ const virtualConsole = new jsdom.VirtualConsole();
+
+ virtualConsole.sendTo(console);
+
+ try {
+ const dom = new jsdom.JSDOM(
+ `
+
+
+ style-loader test
+
+
+
+