The latest 1Password Chrome extension is incorrectly manipulating the DOM within <code> blocks on static pages. It looks it's using prism.js to try to add syntax highlighting to <code> blocks on the entire page. If you're using a static site generator to highlight code with a different library, it causes the display to break.
Example: mkdocs, a popular documentation tool
If you view the documentation for customizing Mkdocs material (https://squidfunk.github.io/mkdocs-material/customization/) with the extension enabled, you'll see that the YAML example at the top is not highlighted (it should be).
Under the hood, if you inspect its DOM, you can see that it's been rewritten with prismjs classes.
If you disable the extension, it is highlighted:
This is likely to impact a number of documentation sites in the tech community.
Hey everyone! I want to thank everyone who called our attention to this and explain what happened and what we’re doing about it.
What happened: Prism.js is a syntax-highlighting library we use for our Labs Snippets feature. While optimizing our build to reduce bundle size, we unintentionally bundled Prism.js into the extension in a way that caused it to run on pages where it shouldn’t, which interfered with code formatting on certain sites. We apologize for the inconvenience this caused.
What we’re doing about it: We’ve completed the fix and submitted it to the Chrome Web Store, along with Firefox, Edge, and our other supported extension storefronts. Rollout timing depends on each store’s review process, but we expect it to land over the next few days.
We want to emphasize that vault security was not impacted. At 1Password, protecting our customers’ privacy, passwords, and credentials is our highest priority.
We’ll be publishing a postmortem covering what went wrong, the timeline, and the concrete changes we’re making to how we build and release future browser extension updates.