Novedades de las Herramientas para desarrolladores (Chrome 149)

Matthias Rohmer

Fecha de publicación: 2 de junio de 2026

Chrome 149 incluye actualizaciones importantes en la asistencia de IA, presenta herramientas experimentales de depuración de WebMCP en el panel de Application y amplía la compatibilidad con la finalización de código a CSS.

Herramientas para desarrolladores para agentes

El servidor de MCP y la CLI de las Herramientas para desarrolladores de Chrome para agentes ahora son oficialmente estables. Lee el anuncio completo aquí.

Las funciones clave y las herramientas nuevas que se agregaron hasta la versión 1.1.1 incluyen lo siguiente:

  • Herramientas personalizadas de terceros expuestas en la página: Ahora, las páginas pueden definir herramientas de depuración personalizadas a través de JavaScript, que las Herramientas para desarrolladores para agentes pueden detectar y llamar.
  • Depuración de WebMCP: Las Herramientas para desarrolladores para agentes ahora pueden enumerar y ejecutar herramientas de WebMCP.
  • Emulación de encabezados HTTP personalizados: Agrega compatibilidad con encabezados HTTP (como tokens de autenticación o agentes de usuario personalizados) a la herramienta de emulación.

Las herramientas de terceros y la depuración de WebMCP aún son experimentales y no están habilitadas de forma predeterminada. Consulta la referencia de la herramienta para obtener información sobre las herramientas de WebMCP y obtener más información sobre las herramientas de terceros en nuestra documentación.

Para obtener las actualizaciones más recientes sobre las Herramientas para desarrolladores para agentes y contribuir, visita el repositorio de GitHub. Comienza con nuestra documentación o ponte al día con la sesión de video integral de Google I/O Supercharge your AI coding workflow with Chrome DevTools for agents.

Asistencia de IA

El panel de asistencia de IA recibió una actualización importante de la interfaz de usuario y herramientas nuevas para mejorar la experiencia de conversación y proporcionar estadísticas más detalladas de la página:

  • Recorrido del agente: La asistencia de IA ahora renderiza widgets directamente dentro de la interfaz de chat en lugar de texto sin formato de Markdown. Estos widgets abarcan las Métricas web esenciales y las estadísticas relacionadas, los elementos LCP, el desglose de LCP, la actividad de subprocesos de abajo hacia arriba y mucho más. Un vínculo Mostrar dentro del widget te lleva a la fuente de esta información en las Herramientas para desarrolladores.
  • Copiar al agente de codificación: Las conversaciones ahora terminan con un botón exclusivo para copiar la conversación, ya sea resumida como una instrucción o la conversación textual, para que la pegues en el agente de codificación que elijas.
  • Capacidades actualizadas: La asistencia de IA ahora tiene acceso a Lighthouse y a las estadísticas relacionadas, lo que le permite analizar tu página de forma integral y brindar asesoramiento específico.
  • Respuestas mejoradas: Con Gemini 3 en segundo plano y preámbulos refinados, la asistencia de IA brinda respuestas más concisas y prácticas.
  • Navegación mejorada: Ahora puedes navegar por las instrucciones de chat anteriores con las teclas Flecha arriba y Flecha abajo, lo que hace que sea rápido e intuitivo refinar o volver a ejecutar consultas anteriores.
Asistencia de IA con la instrucción "¿Cómo puedo mejorar el rendimiento de esta página?" en el sitio de demostración de Astro.js DevTools Times, mostrando el recorrido del agente, los widgets y la opción Copiar al agente de codificación a Antigravity.

A favor de Copiar al agente de codificación, dejaremos de admitir la asistencia para correcciones de estilo automatizadas a través de la asistencia de IA, con Chrome 152. Comparte tu opinión sobre este plan en el error de comentarios dedicado feedback bug

WebMCP

En esta versión, se presentan herramientas experimentales de depuración de WebMCP en la barra lateral del panel Application. WebMCP (Protocolo de contexto de modelo web) permite que las páginas web registren herramientas para que las usen los agentes de LLM visitantes. Obtén más información sobre el estándar propuesto en nuestra documentación.

Las nuevas herramientas de depuración permiten a los desarrolladores hacer lo siguiente:

  • Inspeccionar las herramientas del cliente y sus esquemas
  • Ejecutar manualmente la ejecución de herramientas con parámetros personalizados
  • Realizar un seguimiento de los eventos de invocación de herramientas activos o pendientes y filtrarlos
  • Supervisar el estado de ejecución y revisar las cargas útiles de retorno

WebMCP es un estándar web propuesto en versión preliminar anticipada. Habilita las marcas #devtools-webmcp-support y #enable-webmcp-testing en chrome://flags para comenzar a experimentar.

Las nuevas herramientas de depuración de WebMCP en el panel Aplicación de Herramientas para desarrolladores.
Las nuevas herramientas de depuración de WebMCP inspeccionan el sitio de demostración L'Atelier, que muestra las invocaciones de herramientas anteriores, las herramientas disponibles y las opciones de filtro.

Problemas de Chromium: 494516094

Finalización de código para CSS

La pestaña Styles ahora incluye la finalización de código para CSS con Gemini, basada en la compatibilidad con los paneles Console y Sources. Habilita las sugerencias de código en Settings > AI innovations > Code suggestions.

Esto te ayuda a experimentar con combinaciones más complejas de propiedades CSS, como degradados o sombras de cuadro, sin recordar su sintaxis exacta. O para crear rápidamente diseños de cuadrícula y flexibles, según varias propiedades relacionadas.

La barra de herramientas en la parte inferior de la pestaña Styles muestra el estado a través de un ícono giratorio de carga. Las sugerencias se actualizan o borran a medida que escribes, lo que garantiza que el texto generado por la IA siga siendo relevante para tus ediciones manuales.

Directrices de contraste de color de APCA promocionadas a estable

La calculadora de contraste del Algoritmo de contraste perceptual avanzado (APCA) dejó oficialmente su fase experimental y ahora está disponible como un parámetro de configuración de preferencias estándar. APCA reemplaza las directrices de contraste heredadas AAA/AA con un modelo de contraste perceptual moderno optimizado para pantallas modernas y renderización de texto.

Ahora puedes habilitar o inhabilitar las directrices de APCA con la casilla de verificación que se encuentra en Settings > Preferences > Elements > Enable APCA contrast guidelines.

El botón de activación del algoritmo de APCA en la configuración de Herramientas para desarrolladores y el nuevo algoritmo vigente en la pestaña Estilos.
El botón de activación del algoritmo APCA en la configuración de las Herramientas para desarrolladores y el nuevo algoritmo vigente en la pestaña Styles.

Agente de usuario del modo de dispositivo dinámico

El modo de dispositivo responsivo usaba anteriormente una cadena de agente de usuario codificada (Android 6.0; Nexus 5). Esto provocó que los sitios web modernos degradaran la funcionalidad o activaran los modos de compatibilidad porque el SO informado se reconoció como de más de una década de antigüedad.

El agente de usuario codificado se reemplazó por una heurística dinámica que se actualiza automáticamente según el año calendario actual, lo que garantiza que las Herramientas para desarrolladores siempre informen un entorno moderno y plausible sin necesidad de mantenimiento manual.

Otros destacados

Una colección de mejoras más pequeñas y correcciones de errores en esta versión:

  • Console: Se agregó un botón de activación Collapse / Expand all a la barra de herramientas del panel Console para expandir o contraer rápidamente todos los grupos de consola activos y los seguimientos de pila a la vez. (427657550)
  • Aplicación: Los hipervínculos en los que se puede hacer clic reemplazaron el texto estático para los campos de depósitos de almacenamiento en la vista de metadatos de la aplicación. Si haces clic en un vínculo de depósito, se navega automáticamente a ese depósito específico y se destaca en el panel lateral Storage Buckets. (435311130)
  • Aplicación: Se volvió a habilitar la compatibilidad con la inspección de almacenamiento completa para los service workers después de resolver una regresión de fallas. (406991275, 466134219)
  • Aplicación: Se agregó compatibilidad para inspeccionar eventos de form_submission renderización previa en el panel Precarga. (346555939, 488078903)
  • Aplicación: Se implementó la administración de Credenciales de sesión vinculadas al dispositivo (DBSC) , lo que permite a los desarrolladores borrar o eliminar sesiones activas desde el menú contextual o presionando las teclas Delete o Backspace. (471017387)
  • Elements: Los aspectos destacados de los nodos DOM que representan problemas ocultos en el panel Issues ahora se actualizan de forma dinámica (aparecen o desaparecen) en respuesta a las acciones de filtro de problemas. (40272723)
  • Red: Los eventos enviados por el servidor (SSE) ahora están completamente serializados y se incluyen en las exportaciones de HAR, lo que permite guardar y volver a importar a las Herramientas para desarrolladores las capturas de transmisión de eventos en vivo en curso. (494294071)
  • Rendimiento: Se corrigió el seguimiento de las Métricas web esenciales en la vista Live Metrics para fijar el seguimiento estrictamente al contexto de ejecución del marco principal, lo que evita que la rotación dinámica de iframe restablezca las métricas. (494350655)
  • Rendimiento: Se actualizó web-vitals a la versión 5.2.0, lo que introduce correcciones nativas ascendentes para las pérdidas de memoria durante la supervisión de INP. (484342204)