{"slug": "testare-e-debuggare-estensioni-chrome-con-un-coding-agent-devtools-for-agents-in", "title": "Testare e debuggare estensioni Chrome con un coding agent: DevTools for agents in pratica", "summary": "Chrome DevTools for agents now supports installing and controlling Chrome extensions during automated tests, bridging a gap for coding agents that previously could only navigate pages. The feature, built on the Chrome DevTools Protocol, must be explicitly enabled via the MCP configuration flag '--category extensions'. This capability also benefits the WebExtensions community and cross-browser testing through the Web Platform Test suite.", "body_md": "Caricare un’estensione da disco, aprirne il popup e automatizzare verifiche UI: un workflow più completo per chi sviluppa estensioni e usa agenti.\n\nSviluppare un’estensione Chrome oggi significa spesso alternare tre modalità: codice “a mano”, generazione assistita da un coding agent e una fase di verifica nel browser che resta comunque imprescindibile. Il problema è che molti agenti riescono ad aprire pagine e cliccare elementi, ma si fermano quando entrano in gioco le estensioni: installazione, gestione del popup, interazioni con la UI dell’estensione, verifica rapida dei cambiamenti.\n\nChrome DevTools for agents colma proprio quel vuoto: aggiunge al set di strumenti dell’agente la possibilità di **installare** e **pilotare** un’estensione durante i test, oltre a renderne più pratico il debugging.\n\nCi sono alcuni scenari tipici in cui il supporto “estensioni-aware” fa la differenza:\n\nIn pratica: se il tuo agente sa “guidare” il browser ma non sa “gestire” le estensioni, la qualità del test rimane limitata.\n\nUn dettaglio importante: per ragioni di sicurezza e controllo (in particolare per l’uso dei token e del contesto in cui operano gli agenti), le funzionalità specifiche per estensioni **non sono abilitate di default**.\n\nDopo aver installato Chrome DevTools for agents, serve quindi un passaggio esplicito nella configurazione MCP:\n\n```\n--category extensions\n```\n\nUna volta fatto, l’agente può accedere agli strumenti necessari per caricare e controllare un’estensione.\n\nCon gli strumenti attivi, il flusso diventa molto lineare:\n\n**Caricamento da disco**\n\n**Apertura dell’extension action (popup)**\n\n**Snapshot e ispezione dei contenuti**\n\n**Interazione (click, ecc.)**\n\nQuesto approccio è particolarmente efficace per popup “piccoli ma critici” (to-do list, switch, menu, quick actions) dove un test manuale ripetuto diventa rapidamente noioso e soggetto a errori.\n\nLa parte interessante, per chi fa frontend tooling, è che tutto questo non è una “magia” isolata: Chrome DevTools for agents è costruito sopra il **Chrome DevTools Protocol (CDP)**, lo stesso protocollo su cui si appoggiano:\n\nDi recente sono state esposte nel CDP nuove capacità legate alle estensioni. Questo ha già avuto un impatto su Puppeteer (installazione estensioni nei test automatizzati) e, di riflesso, permette ora di portare funzionalità equivalenti anche in DevTools for agents.\n\nIl vantaggio pratico è che l’ecosistema tende ad evolvere “in blocco”: una capability nuova (per esempio, in futuro, azioni come **pin/unpin** dell’estensione) può essere aggiunta e riutilizzata trasversalmente tra strumenti.\n\nC’è anche un risvolto più “standardizzazione”: migliorare le capacità di test e automazione delle extension APIs aiuta il lavoro nella community **WebExtensions** e nei gruppi che puntano a rendere le estensioni più compatibili tra browser.\n\nQui entra in gioco il **Web Platform Test (WPT)**: una suite di test condivisa tra browser per verificare comportamenti coerenti. Le nuove capacità di automazione consentono di aggiungere test più solidi anche per le API delle estensioni, alzando l’asticella della prevedibilità cross-browser.\n\nSe sviluppi estensioni e usi un coding agent, il salto di qualità arriva quando l’agente non si limita a “navigare pagine”, ma sa anche:\n\nIl punto chiave è abilitare consapevolmente la categoria *extensions* nella configurazione MCP: pochi minuti di setup, ma un impatto diretto sul ciclo build → test → fix, soprattutto quando il progetto cresce e la manualità diventa un collo di bottiglia.\n\nArticolo originale: [https://frontendfacile.it/blog/testare-e-debuggare-estensioni-chrome-con-un-coding-agent-devtools-for-agents-in](https://frontendfacile.it/blog/testare-e-debuggare-estensioni-chrome-con-un-coding-agent-devtools-for-agents-in)", "url": "https://wpnews.pro/news/testare-e-debuggare-estensioni-chrome-con-un-coding-agent-devtools-for-agents-in", "canonical_source": "https://dev.to/frontendfacile/testare-e-debuggare-estensioni-chrome-con-un-coding-agent-devtools-for-agents-in-pratica-57ep", "published_at": "2026-08-28 18:21:10+00:00", "updated_at": "2026-08-28 18:50:11.201582+00:00", "lang": "en", "topics": ["developer-tools", "ai-agents", "ai-tools"], "entities": ["Chrome DevTools for agents", "Chrome DevTools Protocol", "Puppeteer", "WebExtensions", "Web Platform Test"], "alternates": {"html": "https://wpnews.pro/news/testare-e-debuggare-estensioni-chrome-con-un-coding-agent-devtools-for-agents-in", "markdown": "https://wpnews.pro/news/testare-e-debuggare-estensioni-chrome-con-un-coding-agent-devtools-for-agents-in.md", "text": "https://wpnews.pro/news/testare-e-debuggare-estensioni-chrome-con-un-coding-agent-devtools-for-agents-in.txt", "jsonld": "https://wpnews.pro/news/testare-e-debuggare-estensioni-chrome-con-un-coding-agent-devtools-for-agents-in.jsonld"}}