Dev Tools · 1h ago
Building a Chrome Extension That Survives ChatGPT, Claude, and Gemini DOM Chaos
A developer shares lessons from building a Chrome extension that detects HTML code blocks in ChatGPT, Claude, and Gemini and deploys them to live URLs. Key challenges include handling streaming DOM updates with MutationObserver and debouncing, and matching structural patterns instead of fragile class names. The extension uses scoring to pick the correct code block among multiple candidates.
Meridian48 take
The article offers practical, hard-won advice for anyone building browser extensions on top of AI chat UIs, but the constant DOM changes highlight the fragility of relying on undocumented frontends.
Read the full reporting
5 Things I Learned Building a Chrome Extension That Watches ChatGPT, Claude & Gemini →
DEV Community
chrome-extensiondom-scraping