Novedades de las Herramientas para desarrolladores: noviembre de 2026

Matthias Rohmer

Publicado el 20 de octubre de 2026

Chrome 155 y Chrome 156 se lanzaron en la versión estable en octubre, lo que trajo un nuevo conjunto de funciones de depuración y creación a tu navegador en noviembre: inspección de diseño de CSS en DevTools para agentes, un editor interactivo de position-area para el posicionamiento de anclas de CSS en Elementos, y diagnóstico de manifiesto de instalación web y procedencia de anuncios en Aplicación. También puedes detectar variables de contexto inactivas en Memoria, inspeccionar las advertencias de precarga de sugerencias tempranas y las anulaciones persistentes en Red, y navegar por los cronogramas con mayor fluidez en Rendimiento.

Herramientas para desarrolladores para agentes

El servidor de MCP de las Herramientas para desarrolladores de Chrome agrega inspección de estilo CSS, compatibilidad con archivos de configuración y análisis de seguimiento fragmentado para los agentes de programación:

• Inspección de diseño de CSS: Inspecciona los diseños calculados y coincidentes con la herramienta get_css_styles, que admite la paginación (pageSize y pageIdx) y aplica formato a las reglas coincidentes, las reglas heredadas, los pseudoelementos, @keyframes y las reglas @ (@position-try, @property y @function).
• Controles de ruta de acceso y archivo de configuración: Administra las marcas del servidor con un archivo de configuración dedicado, configura raíces de sistemas de archivos personalizadas y usa --allow-unrestricted-paths de forma predeterminada en la CLI.
• Análisis del búfer de seguimiento fragmentado: Analiza grabaciones de rendimiento de gran tamaño con un analizador de búfer de seguimiento fragmentado y un búfer de seguimiento predeterminado de 1.2 GB. Las Herramientas para desarrolladores también limitan el alcance de las instancias del motor de seguimiento por análisis para evitar fugas de memoria.
• Manejo de diálogos y persistencia de la consola: Controla automáticamente los diálogos de JavaScript que se activan durante las acciones de las herramientas de entrada de texto y conserva el historial de mensajes de la consola en las navegaciones por el mismo documento.
• Actualización del menú: Haz clic en Obtener las Herramientas para desarrolladores de Chrome para agentes en el menú principal de las Herramientas para desarrolladores para abrir las instrucciones de configuración.

Obtén más información en el repositorio de chrome-devtools-mcp.

Elementos: Editor visual de position-area, selección de anclaje implícita y actualizaciones de creación de CSS

El panel Elementos presenta herramientas visuales para el posicionamiento de anclaje de CSS y expande la inspección de CSS:

• Editor visual de position-area: Haz clic en la muestra intercalada junto a una declaración de position-area en la pestaña Estilos para seleccionar visualmente las regiones de la cuadrícula de anclaje, configurar los ejes de forma simultánea o individual, activar o desactivar la palabra clave self y acortar las palabras clave sin eje.
• Selección implícita de anclas en las etiquetas de información de ventanas emergentes: Haz clic con el botón derecho en una etiqueta de información de ventana emergente en el árbol del DOM cuando un elemento tenga varias anclas implícitas para inspeccionar y saltar a cualquier elemento de anclaje asociado.
• Superposición de cuadros de posicionamiento de anclas: Inspecciona los cuadros de margen, padding, borde y contenido del bloque contenedor modificado por inserción (IMCB) directamente en la superposición del viewport cuando depures elementos posicionados con anclas.
• wrap-reverse en el editor de Flexbox: Activa o desactiva flex-wrap: wrap-reverse directamente desde el editor visual de Flexbox en la pestaña Estilos.
• Estilos CSS inactivos para @starting-style y reglas heredadas: Inspecciona las reglas @starting-style y las secciones Inherited from inactivas con estados de expansión y contracción manuales conservados en las actualizaciones.
• Propiedades personalizadas con varios guiones y autocompletado de clases: Inspecciona y edita las propiedades personalizadas de CSS que comienzan con tres o más guiones (como ---theme-color) y filtra las clases ya aplicadas de las sugerencias de autocompletado de Add New Class.

Problemas de Chromium: 553335561, 438724570, 413061413, 397184392, 539424116, 533783988

Aplicación: Diagnóstico del manifiesto de instalación web, procedencia de los anuncios y actualizaciones de la tabla de almacenamiento

Los paneles Application y Issues agregan diagnósticos para los manifiestos de instalación web, la procedencia de las secuencias de comandos de anuncios y la inspección del almacenamiento:

• Diagnóstico del manifiesto de instalación web: Inspecciona los errores del manifiesto de instalación web (navigator.install y <install>) en el panel Problemas, que abarca fallas de recuperación, errores de sintaxis, valores start_url no válidos, nombres o IDs faltantes y manifiestos faltantes, con vínculos directos al archivo de manifiesto afectado.
• Documentación sobre la columna y la métrica de procedencia de los anuncios: Consulta la nueva columna Procedencia del anuncio en la sección Anuncios del panel Aplicación para ver si una secuencia de comandos de anuncios coincidió con una cadena de secuencias de comandos principales o una regla de lista de filtros, junto con información sobre herramientas de documentación y vínculos para obtener más información sobre las métricas de anuncios.
• Ergonomía de las tablas de IndexedDB y Cookies: Expande los objetos anidados en la cuadrícula de datos de IndexedDB con alturas de fila dinámicas que conservan la posición de desplazamiento y borra las filas seleccionadas en la tabla de Cookies con el teclado o el menú contextual.

Problemas de Chromium: 333795265, 553428200, 514957134, 555304817, 555304814, 562142155

Red: Advertencias de precarga de sugerencias anticipadas y anulaciones persistentes

El panel Red define mejor los diagnósticos de sugerencias tempranas, las anulaciones locales y los flujos de trabajo de encabezados personalizados:

• Advertencia de precarga de sugerencias iniciales cuando la caché está inhabilitada: Consulta una advertencia en la sección de encabezados de Sugerencias iniciales cuando las respuestas 103 Early Hints incluyan vínculos de precarga mientras la opción Inhabilitar caché esté activa, en la que se explica por qué Chrome ignora esas precargas.
• Anulaciones locales persistentes y columnas de encabezado personalizadas: Publica anulaciones del cuerpo de la respuesta local en las navegaciones de páginas, conserva las configuraciones de columnas de encabezado de solicitud y encabezado de respuesta personalizadas y el orden de clasificación en las recargas, y copia las cargas útiles de solicitudes sin procesar truncadas desde el menú contextual.

Problemas de Chromium: 548701038, 559925510, 563542902, 556269542, 377410082

Memory: Detección de campos de contexto inactivos en instantáneas del montón

El panel Memoria ahora detecta variables de cierre sin usar que permanecen retenidas en los contextos de ejecución de V8. DevTools analiza los metadatos del permiso de V8 incorporados en las instantáneas del montón para correlacionar los cierres con los objetos Context compartidos. Luego, destaca los campos de contexto inactivos que se mantienen activos por cierres hermanos de larga duración cuando ningún cierre activo accede a ellos, ordenados por impacto en la memoria.

Problemas de Chromium: 497855658

Rendimiento: Navegación más fluida por el cronograma y estado del árbol de llamadas conservado

El panel Rendimiento ofrece una navegación más responsiva por el gráfico tipo llama y conserva el contexto de análisis en todos los paneles:

• Navegación más fluida por la línea de tiempo: El zoom, el desplazamiento lateral y el arrastre del minimapa de la línea de tiempo ya no se retrasan.
• Se conservó el estado de Árbol de llamadas y De abajo hacia arriba: Cambia entre los paneles de Herramientas para desarrolladores sin perder los nodos expandidos, la selección ni la posición de desplazamiento en las pestañas Árbol de llamadas y De abajo hacia arriba.

Errores de Chromium: 553831653, 561396590

Otros destacados

Chrome 155 y Chrome 156 también incluyen las siguientes mejoras en los paneles de Herramientas para desarrolladores:

• Sensores: Anula navigator.cpuPerformance directamente desde el nuevo control Nivel de rendimiento de la CPU en el panel Sensores o deja que refleje los ajustes predeterminados de limitación de CPU activos. (Problemas de Chromium: 449760252, 526856234, 526857820)
• Modo de dispositivo: Conserva tus preferencias de escala y ajuste automático del zoom por dispositivo emulado y mantén la anulación de Save-Data cuando actives o desactives la barra de herramientas del dispositivo. (Errores de Chromium: 561306841, 555160483)
• Selector de color: Consulta las sugerencias de color de contraste de APCA para texto claro sobre fondos oscuros y convierte los colores fuera de la gama en oklab() y oklch() sin valores NaN. (errores de Chromium: 560325669, 558821258)
• Accesibilidad: Identifica los botones de activación de filtros de expresiones regulares activos con un punto indicador sin color, escucha los nombres de las propiedades de fuente que anuncian los lectores de pantalla en Resumen de CSS y navega con anillos de enfoque del teclado mejorados y visibilidad de contraste alto en los paneles. (Problemas de Chromium: 556764882, 555848535, 555599825 y 553804654)

Problemas de Chromium: 449760252, 526856234, 526857820, 561306841, 555160483, 560325669, 558821258, 556764882, 555848535, 555599825, 553804654