Roll Your Own Browser Dev Tool

Amber Wilson shows how to create your own bookmarklets — pieces of JavaScript you can trigger from a bookmark on any page. One example she demonstrates injects an accessibility auditing script from a remote URL, which is clever because you only have to update that script file rather than the bookmarklet itself. Another runs code stored directly inside the link. The payoff is a one-click tool that works across sites without any install process.

That “any site” caveat is worth noting, though: sites with a strict Content Security Policy (CSP) that blocks inline scripts will simply not run bookmarklets. That is great for security but a hard stop for this workflow. Browser extensions are the fallback, and browser vendors are increasingly converging on a standard format, which makes things easier. Still, extensions are significantly more complex to build.

What’s missing, Wilson suggests, is a simple extension that lets you create and run arbitrary bookmarklet-style snippets on demand. A quick search turns up a few existing attempts, but nothing particularly polished. Meanwhile, Chrome DevTools includes its own built-in mechanism for this exact need: snippets in the Sources panel, which let you save and execute reusable code within the dev environment rather than from a browser bookmark.