Jahed Ahmed

Cursed Magic in Web Development

4 months ago, I encountered a bug during a routine software upgrade for FrontierNav. My tests stopped working. Of course, that’s great, the whole point of tests is to catch these issues. This one wasn’t that though.

I use Subresource Integrity (SRI) on FrontierNav to ensure the HTML downloads the correct script files. For some reason, after this upgrade, my tests kept failing. I’d open the test page up in my browser, and it worked fine.

Was it a caching issue? It’s always a caching issue. I cleared everything. Deleted all my caches. Cache-busted my outputs. Same problem. It’s not a caching issue.

Was it Webpack? Maybe the SRI generator was somehow wrong? It happened before. No, hashing the output manually gives the same hash.

Was it Babel? It happened before. Maybe the transforms are a problem. No, I wrote tests to isolate Babel output, and those were fine.

Was it Chromium? It happened before. Nope.

Was it Firebase? That’s the only thing I changed. And it does sometimes have dependency conflicts. No, it works fine. It’s just the SRI hash that’s wrong.

Is it... Cypress? It only fails if I’m running tests. And I was always reluctant to use Cypress because it runs stuff within Iframes and messes with the environment. Surely not. I didn’t change Cypress at all.

After some digging around and manually dumping whatever Cypress is testing against...

A diff of two minified JavaScript files. On the left is the original, on the left what Cypress generates. There's is a small change from 'window.top' to 'window.self'.
What the fuck.

It’s Cypress.

So, I can’t fully test my builds with SRI enabled any more. Cypress changes the code under test to work in its environment rather than a browser. That’s great.

Thanks for reading.