Chrome DevTools
Controlla e ispeziona un browser Chrome attivo dal tuo agente di coding. Registra trace delle performance, analizza le richieste di rete...
Controlla e ispeziona un browser Chrome attivo direttamente dal tuo agente di coding. Chrome DevTools MCP mette a disposizione 29 strumenti per automazione del browser, profiling delle performance, analisi di rete e debugging, offrendo a Claude le funzionalità complete di DevTools tramite Puppeteer e il Chrome DevTools Protocol.
Automatizza le interazioni con il browser grazie a strumenti per selezionare elementi, digitare testo, compilare form, caricare file, navigare tra pagine e gestire dialog. Emula dispositivi mobili e viewport personalizzati per testare design responsive. Registra trace delle performance e snapshot della memoria per individuare i colli di bottiglia, esegui audit con Lighthouse e ottieni insight concreti sulle performance, inclusi i dati di campo CrUX.
Ispeziona le richieste di rete, leggi i messaggi della console con stack trace con source map, acquisisci screenshot, scatta snapshot del DOM ed esegui JavaScript nel contesto della pagina. È disponibile anche una modalità ridotta per attività di base più leggere.
Come si usa: chiedi a Claude di interagire con la tua applicazione in esecuzione su Chrome. Esempi di prompt: "Apri la mia app su localhost:3000 e seleziona il pulsante di accesso", "Registra una trace delle performance mentre scorro la pagina e dimmi cosa è lento", "Scatta uno screenshot della homepage su un viewport mobile", "Controlla la console per rilevare errori dopo l'invio del form", "Esegui un audit Lighthouse su questa pagina e riassumi i risultati", "Elenca tutte le richieste di rete effettuate al caricamento della dashboard".