Probar tu app Laravel en el navegador con Claude Code

Hola, bienvenido. En la lección anterior conectamos Laravel Boost a claude-tasks y vimos que una de sus herramientas lee los errores de la consola del navegador, y en esta lección vamos a darle a Claude ese navegador. Vamos a ver las 2 formas que hay hoy de hacerlo, Claude in Chrome y Playwright MCP, qué necesita cada una y en qué sistemas funciona, cómo probar con ellas la aplicación que tenemos levantada con Sail y cómo hacerlo con usuarios y datos de desarrollo, sin exponer tus cuentas ni tus credenciales reales.

¿Para qué necesita Claude un navegador, si ya tenemos Pest, Larastan y un circuito de calidad completo? Porque todo eso comprueba el código, y hay fallos que solo aparecen cuando la aplicación está en marcha y alguien la usa: un error de JavaScript en la consola, un formulario que no se envía, un botón que queda tapado en una pantalla pequeña o una vista que se rompe con datos reales. Un test de Pest te dice que la ruta responde con un 200, pero no que la página se ve bien. En la lección de la skill de QA te hablé de /run y /verify, que arrancan la aplicación para comprobar un cambio, y te dije que probar en el navegador lo veríamos aquí. Con un navegador, Claude puede cerrar el ciclo: cambia el código, abre la página, mira lo que pasa y corrige lo que ve.

Antes de elegir, hay un dato que decide por ti si trabajas en Windows con WSL2, como propone el curso: según la documentación de Claude Code, la integración con Chrome no funciona en WSL. En macOS, en Linux o en Windows sin WSL tienes las 2 opciones, y en WSL2 la alternativa es Playwright MCP. Por eso vamos a ver las 2.

Las 2 opciones resuelven lo mismo, pero con un planteamiento muy distinto:

Fíjate en la segunda fila, porque es la que más pesa al decidir. Que Claude use tu navegador con tus sesiones es muy práctico para probar una aplicación en la que ya has entrado, y también es lo que obliga a tener más cuidado, como veremos al final de la lección.