fix(index): update to allow requesting failed async css files

src/index.js

@@ -334,22 +334,6 @@ class MiniCssExtractPlugin {
                 Template.indent([
                   `var href = ${linkHrefPath};`,
                   `var fullhref = ${mainTemplate.requireFn}.p + href;`,
-                  'var existingLinkTags = document.getElementsByTagName("link");',
-                  'for(var i = 0; i < existingLinkTags.length; i++) {',
-                  Template.indent([
-                    '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++) {',
-                  Template.indent([
-                    '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";',
@@ -359,6 +343,7 @@ class MiniCssExtractPlugin {
                     'var request = event && event.target && event.target.src || fullhref;',
                     'var err = new Error("Loading CSS chunk " + chunkId + " failed.\\n(" + request + ")");',
                     'err.request = request;',
+                    'delete installedCssChunks[chunkId]',
                     'reject(err);',
                   ]),
                   '};',

test/manual/index.html

@@ -34,6 +34,11 @@
     <p>But turn orange, when <button class="lazy-button2">pressing this button</button>. Additional clicks have no effect.</p>
     <p>Refresh and press buttons in reverse order: This should turn green instead.</p>
   </div>
+  <div class="test lazy-failure-css">
+    <p>Lazy CSS: Turn off the network and <button class="lazy-failure-button">press this button</button>.</p>
+    <p>An error should have appeared.</p>
+    <p>Now if you turn the network back on and click it again, it should turn aqua.</p>
+  </div>
   <div class="test preloaded-css1">
     <p>Preloaded CSS: Must be green.</p>
     <p><button class="preloaded-button1">Pressing this button</button> displays an alert and should turn red.</p>

test/manual/src/index.js

@@ -5,10 +5,12 @@ const handleError = (err) => {
   console.error(err);
 }
 
-const makeButton = (className, fn) => {
+const makeButton = (className, fn, shouldDisable = true) => {
   const button = document.querySelector(className);
   button.addEventListener("click", () => {
-    button.disabled = true;
+    if(shouldDisable) {
+      button.disabled = true;
+    }
     fn().then(() => {
       button.disabled = false;
     }).catch(handleError);
@@ -20,3 +22,5 @@ makeButton(".lazy-button2", () => import('./lazy2.css'));
 
 makeButton(".preloaded-button1", () => import(/* webpackChunkName: "preloaded1" */ './preloaded1'));
 makeButton(".preloaded-button2", () => import(/* webpackChunkName: "preloaded2" */ './preloaded2'));
+
+makeButton(".lazy-failure-button", () => import('./lazy-failure.js'), false);

test/manual/src/lazy-failure.css

@@ -0,0 +1,3 @@
+.lazy-failure-css {
+  background: aqua;
+}

test/manual/src/lazy-failure.js

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