Syntax highlighting broken in Chromium-based browsers

[amoeba]

In Chrome and Arc (both Chromium), our syntax highlighting looks to be broken:

When I watch closely, I initially see the correct highlighted code which indicates something in the JS bundle is overriding the build-time highlighting. This doesn't happen in Firefox or Safari so my guess is both that (1) something changed and (2) there's a race condition involved.

The mkdocs-material docs themselves have the same issue so it's not something we've done but we will need to work around it.

[amoeba]

This is actually caused by my 1Password extension. I created a new profile in Chrome and the issue goes away. Then, in my main profile, I disable extensions until 1Password was the only one remaining and disabling it fixed the issue.

[amoeba]

I'll try to confirm on another machine. A workaround is to disable pygments_lang_class but I'm not sure how safe that is. It appears to work fine.

[amoeba]

I looked at the JS bundle 1Password injects and it has very clear code that modifies elements with language-* classes and injects Prism (JS syntax highlighter). I put up a copy at https://gist.github.com/amoeba/3b06ca8fe7784dbaf3239918c2dfd5a8 so we can see when it changes.

[amoeba]

I put up PR with a workaround so we can get this working again soon: #236.

[lidavidm]

This is crazy. Presumably it was unintentional or meant to be scoped to something 1Password-specific and not the entire page?

[amoeba]

I emailed 1P support, we'll see what they say.