Skip to content

Commit

Permalink
fix(index): allow requesting failed async css files (#292)
Browse files Browse the repository at this point in the history
  • Loading branch information
cwalten authored and evilebottnawi committed Nov 21, 2018
1 parent eb218cc commit 2eb0af5
Show file tree
Hide file tree
Showing 5 changed files with 17 additions and 2 deletions.
2 changes: 2 additions & 0 deletions src/index.js
Expand Up @@ -359,6 +359,8 @@ 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]',
'linkTag.parentNode.removeChild(linkTag)',
'reject(err);',
]),
'};',
Expand Down
5 changes: 5 additions & 0 deletions test/manual/index.html
Expand Up @@ -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>
Expand Down
8 changes: 6 additions & 2 deletions test/manual/src/index.js
Expand Up @@ -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);
Expand All @@ -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);
3 changes: 3 additions & 0 deletions test/manual/src/lazy-failure.css
@@ -0,0 +1,3 @@
.lazy-failure-css {
background: aqua;
}
1 change: 1 addition & 0 deletions test/manual/src/lazy-failure.js
@@ -0,0 +1 @@
import './lazy-failure.css';

0 comments on commit 2eb0af5

Please sign in to comment.