Firefox crashing with some tabs

[karmour]

Hey Frank, just noticed this today in testing the screen size ticket #148, though it doesn't appear to be directly related to it, as it's happening regardless of the screen size. Currently, if I use Firefox to look at the app, it gets a "loading" screen and then a blank white screen if I try to navigate to the Comparison, Leadership, or Representation tabs. I can't even refresh to get it back -- I have to close out and come back into the home tab to get anything. This is new behaviour though - I was testing in Firefox before without issue. Can you investigate?

[hangler]

@karmour Unfortunately, I'm having trouble reproducing this in Firefox on either Mac or Windows... do you still get this? (I haven't updated the app since you reported it, so I assume so?) Let's maybe do a screen share tomorrow.

[karmour]

Sure I can show you tomorrow - just tried again and it's still failing for me (Windows).

[karmour]

Hi Frank, your suspicions were correct -- Firefox only crashes on those three tabs if I'm on VPN; no issues when off VPN. I tried toggling on/off twice just to make sure. Does that help with solutioning?

[hangler]

Yes, thanks! At root this would seem to be an issue with the VPN, actually, but since I doubt we're going to be fixing that any time soon, I have tried a first stab at a workaround, which is simply to change the link to the resource. It's now deployed — let me know how it goes!

[karmour]

Still crashing - darn! I closed the browser and did a hard refresh first, but no luck.

[rwindelz]

Are they any indications of errors or failed http requests in the FF developer tools?

[karmour]

Why hello, Robin. :-) Yes it relates to the tooltips used in the tool and some kind of interference caused by VPN, though only in Firefox. Frank is looking into a potential solution -- if you have any ideas, please feel free to share!

[hangler]

@robinwn There's something about the combination of Bootstrap JS + Firefox + CDN + VPN + CORS that's going awry. Here's a shot I took of @karmour's console (hope you do not mind me sharing it, nothing personally identifiable):

I tried switching which CDN we're pulling the scripts from; doesn't seem like it worked. Next thing to try is bundling the Bootstrap JS directly with the deployment artifact, which is less ideal because we can't take advantage of the CDN, but has the advantage of being almost guaranteed to work...

[hangler]

Ooh, one thing might be that integrity check, as mentioned here. I wonder if the VPN is rewriting the JS somehow and so it's failing the integrity verification. It would be weird (but perhaps not surprising) if only Firefox cared about it...

[hangler]

OK, I went the easy route and now the app loads a local copy of Bootstrap's JS. @karmour, it should be ready for testing.

[karmour]

Confirmed to be working in FF as desired now!

[rwindelz]

Mozilla's notes: https://developer.mozilla.org/en-US/docs/Web/Security/Subresource_Integrity

@hangler - is there some way the integrity attribute has gotten out of sync with the module being loaded?

[hangler]

Yes, that might be the case — but it works everywhere off the VPN, so if that is indeed the problem, it would appear to be a VPN-related issue... or at least that's my thinking.

[hangler]

@karmour Closing this, please re-open if necessary!