critical: IE11 crashes due to cycling loading of css file

Hi, after upgrading critical from 0.9.1 to 1.1.0 is our angular 4 app failing due to the loading of the css file.

After first fetch of css file it loads that css and fonts (which are in the css file) all the time again and again until IE11 stops to be responsive anymore.

this is a list of requests from http-server:

[... 13:36:07 ...] "GET /" "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko"
[... 13:36:07 ...] "GET /inline.75e8870fba00c34a8a9e.bundle.js" "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko"
[... 13:36:07 ...] "GET /polyfills.16485738055aa9bd40b0.bundle.js" "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko"
[... 13:36:07 ...] "GET /scripts.5d01c0346c9e1aeba3f9.bundle.js" "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko"
[... 13:36:07 ...] "GET /main.34326e006e60e0462b5c.bundle.js" "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko"
[... 13:36:08 ...] "GET /styles.533a3b0559146cf11ddf.bundle.css" "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko"
[... 13:36:08 ...] "GET /lineto-brown-regular.aa679f9d3dd07c2053bd.eot?" "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko"
[... 13:36:08 ...] "GET /lineto-brown-bold.599a0123420af98d9e31.eot?" "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko"
[... 13:36:09 ...] "GET /styles.533a3b0559146cf11ddf.bundle.css" "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko"
[... 13:36:09 ...] "GET /lineto-brown-regular.aa679f9d3dd07c2053bd.eot?" "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko"
[... 13:36:09 ...] "GET /lineto-brown-bold.599a0123420af98d9e31.eot?" "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko"
[... 13:36:09 ...] "GET /styles.533a3b0559146cf11ddf.bundle.css" "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko"
[... 13:36:09 ...] "GET /lineto-brown-regular.aa679f9d3dd07c2053bd.eot?" "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko"
[... 13:36:09 ...] "GET /styles.533a3b0559146cf11ddf.bundle.css" "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko"
[... 13:36:09 ...] "GET /lineto-brown-regular.aa679f9d3dd07c2053bd.eot?" "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko"
[... 13:36:09 ...] "GET /styles.533a3b0559146cf11ddf.bundle.css" "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko"
[... 13:36:09 ...] "GET /lineto-brown-regular.aa679f9d3dd07c2053bd.eot?" "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko"
[... 13:36:09 ...] "GET /styles.533a3b0559146cf11ddf.bundle.css" "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko"
[... 13:36:09 ...] "GET /lineto-brown-regular.aa679f9d3dd07c2053bd.eot?" "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko"
[... 13:36:09 ...] "GET /lineto-brown-bold.599a0123420af98d9e31.eot?" "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko"
[... 13:36:09 ...] "GET /styles.533a3b0559146cf11ddf.bundle.css" "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko"
[... 13:36:09 ...] "GET /lineto-brown-regular.aa679f9d3dd07c2053bd.eot?" "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko"
...

After some investigation, I found out that a polyfill for a plugin loadCSS (dependency of inline-critical) changed - it dropped the loadCSS method.

When I put back the old polyfill it works.

I truly don’t know if this is a good place to report this bug, if not give me a hint.

About this issue

Original URL
State: closed
Created 7 years ago
Reactions: 1
Comments: 22

Most upvoted comments

Regardless, I still think, @bezoerb should set the onload event to null per the upstream README.

XhmikosR on Dec 14, 2017

Just wanted to chime in again. Simply did a yarn remove critical -D, yarn add critical -D and it’s working without any additional configuration.

@rokerkony, thanks for reporting the bug and thanks to @XhmikosR and @bezoerb for sorting it out. Critical is an awesome tool for sure! 😃

0reo27 on Dec 15, 2017

Until a new patch release of critical is out, you can just do the following:

rm -rf ./node_modules/ ./package-lock.json
npm i

@bezoerb: please release a new patch version where you explicitly bump inline-critical to the latest version.

XhmikosR on Dec 15, 2017

I tested on IE 10 which had the problem and the fix fixed it for me. I will try IE 11 in a few minutes but my guess is it will work there too.

On Dec 15, 2017 12:20, “Konrad Černý” notifications@github.com wrote:

I just did but it is still failing. this.onload=null is now applied but still loads css again and again… are you testing on IE11 as well?

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/addyosmani/critical/issues/264#issuecomment-351968948, or mute the thread https://github.com/notifications/unsubscribe-auth/AAVVtbIajDdLIpJe8dZmHOwmNgDm0GGuks5tAkfqgaJpZM4RCE_R .

XhmikosR on Dec 15, 2017