SkillProof tested Claude skills

Browser Testing with DevTools

Guida test in browser reali tramite Chrome DevTools MCP per individuare problemi nel DOM e nella console.

di addyosmani · addyosmani/agent-skills

Richiede configurazione ★ 8.0/10

Browser Testing with DevTools — Guida test in browser reali tramite Chrome DevTools MCP per individuare problemi nel DOM e nella console.

Cosa fa

Esegue test in browser reali via Chrome DevTools MCP. Da usare quando si costruisce o si fa debugging di qualsiasi cosa giri in un browser. Da usare quando serve ispezionare il DOM, catturare errori di console, analizzare le richieste di rete, profilare le prestazioni o verificare l'output visivo con dati reali a runtime. Richiede il server MCP chrome-devtools configurato.

Rapporto di test

Installazione pulita a file singolo — git clone + cp verbatim ha funzionato senza correzioni e il frontmatter è valido in modo rigoroso — ma lo skill è inerte senza un server MCP chrome-devtools configurato a parte e un Chrome in esecuzione, una dipendenza esterna forte che la documentazione dichiara onestamente fin da subito. In un compito di debugging live in browser (riprodurre un ReferenceError, correggerlo, riverificare), sia il braccio con lo skill sia la baseline senza skill hanno trovato e corretto il bug con verifica live; il vantaggio dello skill è stato il rigore di processo — il suo workflow REPRODUCE→INSPECT→DIAGNOSE→FIX→VERIFY più le prove screenshot prima/dopo — più che una diagnosi migliore. Documentazione ben scritta e onesta, con indicazioni di sicurezza insolitamente solide (isolamento dei profili, contenuti browser non fidati).

Testato il: 2026-07-11 · Claude Code 2.x (agent harness)

Installazione

git clone https://github.com/addyosmani/agent-skills
cd agent-skills
mkdir -p ~/.claude/skills
cp -r skills/browser-testing-with-devtools ~/.claude/skills/browser-testing-with-devtools

Comandi e prompt di esempio

  • /browser-testing-with-devtoolsGuida test in browser reali tramite Chrome DevTools MCP per individuare problemi nel DOM e nella console.

Gli skill si attivano con richieste in linguaggio naturale, senza comandi da ricordare. Dopo l'installazione, prompt come questi lo attivano (in inglese):

  • Test this page in a real browser and check the console
  • Inspect network requests while debugging the login flow
  • Profile page performance and report console errors

Rapporto completo →