Collega il tuo agente AI direttamente all'istanza del browser attiva con la funzionalità di connessione automatica. In questo modo, l'agente può ignorare le limitazioni della sandbox ereditando le schede, le estensioni del browser e lo stato dell'applicazione live correnti.
L'ereditarietà del contesto del flusso di lavoro consente all'agente di passare dalla scrittura del codice al debug dello stato del browser live senza perdere i dati della sessione. Questa funzionalità è utile quando hai già raggiunto uno stato specifico dell'applicazione (ad esempio un flusso di pagamento complesso o un errore riprodotto manualmente) e vuoi che l'agente si occupi dell'indagine tecnica senza dover eseguire di nuovo questi passaggi manualmente.
Prima di attivare la connessione automatica, tieni presente quanto segue:
- Sicurezza e privacy: quando la connessione automatica è attiva, l'agente ha accesso a tutti i dati del profilo del browser, incluse le schede aperte, l'archiviazione della sessione, l'archiviazione locale, i cookie e altri dati esposti tramite le API JavaScript.
- Garanzia della privacy dei dati: il server Chrome DevTools per agenti è un processo locale e non invia a Google i dati del browser, i token di sessione o i dati di telemetria.
- Affidabilità e prompt: utilizza questa modalità solo con gli agenti di cui ti fidi e fai attenzione alle informazioni che includi nei prompt.
Prerequisiti
Prima di utilizzare la funzionalità di connessione automatica, assicurati di avere quanto segue:
- Chrome 144 o versioni successive: la connessione automatica richiede protocolli di debug moderni presenti nelle versioni attuali di Chrome.
- Canale Chrome corretto: per impostazione predefinita, l'agente si connette alla versione stabile di Chrome. Per utilizzare Canary o Beta, specifica il canale nella tua configurazione.
- Debug remoto abilitato: abilita manualmente il bridge tra il tuo browser e l'agente.
- Configurazione corretta: devi aggiornare la configurazione MCP per includere
il flag
--autoConnect. Per maggiori dettagli, consulta la sezione Configurazione.
Configurare la connessione automatica
Per configurare la funzionalità di connessione automatica nel server MCP:
- Nel browser Chrome in esecuzione, vai a
chrome://inspect/#remote-debugginge attiva il debug remoto. Aggiorna la configurazione MCP per includere il flag
--autoConnect:{ "mcpServers": { "chrome-devtools": { "command": "npx", "args": ["chrome-devtools-mcp@latest", "--autoConnect"] } } }Chiedi all'agente di interagire con l'app Chrome aperta. Quando Chrome chiede l'autorizzazione per consentire la sessione, fai clic su Consenti.
L'agente ora utilizza il server MCP per interagire con l'applicazione Chrome in esecuzione. Per ulteriori informazioni sulle opzioni di configurazione, consulta la guida alla configurazione.
Casi d'uso per la connessione automatica
La connessione automatica ti consente di utilizzare strumenti o stati che non possono essere utilizzati nelle sessioni Chrome in sandbox. Ad esempio, anziché chiedere all'agente di accedere, operazione che spesso non riesce, puoi andare alla pagina e accedere tu. Poi, chiedi all'agente di prendere il controllo.
Le sezioni seguenti includono alcuni esempi di casi d'uso per la funzionalità di connessione automatica.
Eseguire il debug delle dashboard autenticate
Gli strumenti interni e le dashboard private spesso si trovano dietro livelli complessi di Single Sign-On (SSO) o rete privata virtuale (VPN). Un browser in sandbox di solito richiede un accesso che l'agente non può ignorare. Con la connessione automatica, l'agente eredita la sessione attiva.
Esempio di prompt:
I have my company's staging dashboard open in the next tab. Can you look at the
User Analytics chart, find the SVG element for the Friday data point, and tell
me why the tooltip isn't appearing on hover?
Esempio di esecuzione dell'agente: l'agente identifica il processo Chrome esistente, trova la scheda attiva e ispeziona l'albero di accessibilità per individuare gli elementi. Potrebbe anche utilizzare le API JavaScript per valutare conflitti specifici.
Correggere live la scheda corrente
Evita di riprodurre manualmente gli errori. Anziché tradurre i passaggi di riproduzione in un nuovo prompt per un agente in sandbox, puoi chiedere all'agente di correggere il bug nella pagina attiva in cui l'hai già riscontrato.
Esempio di prompt:
Look at the current page. The Submit button overlaps with the footer on this
screen size. Generate a fix for the layout and verify it by injecting the CSS
directly into this tab.
Esempio di esecuzione dell'agente: poiché è connesso alla finestra attiva, l'agente analizza il layout e applica immediatamente la correzione. Il pulsante si sposta sullo schermo, il che conferma che la correzione funziona prima di aggiornare il codice sorgente.