`\n\n.\n\nWhat actually worked was debouncing on DOM stability instead of DOM presence:\n\n``` js\nlet debounceTimer;\nconst observer = new MutationObserver(() => {\n clearTimeout(debounceTimer);\n debounceTimer = setTimeout(scanForCodeBlocks, 600);\n});\nobserver.observe(document.body, { childList: true, subtree: true });\n```\n\n600ms of \"nothing changed\" turned out to be a much more reliable signal than \"the tag now exists.\" Not elegant, but it works across all three sites' streaming speeds.\n\nChatGPT, Claude, and Gemini all ship frequent frontend updates, and none of them are obligated to keep a stable class name for you to hook into. I initially selected code blocks by class name (`.language-html`\n\n, `.hljs`\n\n, etc.) and had selectors silently break in production within two weeks of launch.\n\nWhat's held up better: matching on **structural patterns** instead of class names — a `

`\n\ncontaining a ``\n\nwhose text content starts with ``\n\ntag\" is wrong more often than you'd think.\n\nI ended up scoring candidate blocks instead of just taking the first match: presence of ``\n\nor ``\n\nscores highest, presence of ``\n\n/``\n\nscores next, and blocks under ~50 characters get discarded outright (usually just an inline example, not a real page). It's not perfect, but it cut false positives dramatically.\n\n`srcdoc`\n\nMy first preview implementation just dumped the extracted HTML into an `iframe`\n\nwith `srcdoc`\n\n. It worked until someone's AI-generated page included a `