Novedades de Herramientas para desarrolladores: Chrome 127

Sofia Emelianova
Sofia Emelianova
GitHub

Para ayudarte a depurar la función de posicionamiento de los anclajes con mayor facilidad, la pestaña Estilos ahora vincula las anclas explícitas y las implícitas a sus nodos.

El antes y el después de la vinculación explícita e implícita de los anclajes

Además, el valor del atributo popovertarget ahora se vincula a su elemento popover en el DOM.

El antes y el después de vincular popovertarget a su elemento emergente.

Mejoras en el panel de fuentes

Esta versión incluye varias mejoras en el panel Sources.

Función mejorada "Nunca pausar aquí"

"Nunca te detengas aquí" te permite evitar que Debugger se detenga en la misma línea una y otra vez. Esto facilita el trabajo con puntos de interrupción irrelevantes que se activan repetidamente. Esta versión mejora esta capacidad y ahora funciona para lo siguiente:

  • Excepciones o promesas de rechazos de funciones integradas.
  • "Cancelando" Puntos de interrupción por incumplimiento de DOM, recuperación/XHR y CSP
  • En el desmontaje de Wasm.

Observa el flujo de trabajo en acción:

Problema de Chromium: 40924349.

Nuevos objetos de escucha de eventos de ajuste de desplazamiento

La opción Fuentes > Interrupciones del objeto de escucha de eventos > La lista Control obtiene dos objetos de escucha relacionados con scroll-snap: scrollsnapchange y scrollsnapchanging. Estos eventos se activan cuando el usuario se desplaza por el contenedor de desplazamiento de modo que este se ajuste a un nuevo elemento.

El antes y el después de agregar objetos de escucha de eventos relacionados con el ajuste de desplazamiento.

Problema de Chromium: 40286359.

Mejoras en el panel de red

Esta versión incluye varias mejoras en el panel Network.

Actualización de los ajustes predeterminados de limitación de la red

El panel Network obtiene los ajustes predeterminados de regulación actualizados: el nuevo Fast 4G, Fast 3G renombrado como Slow 4G y Slow 3G renombrado como 3G. Esto se alinea mejor con los ajustes predeterminados de Lighthouse.

El antes y después de la actualización de los ajustes predeterminados de limitación de la red.

Problema de Chromium: 342406608.

Información del service worker en campos personalizados del formato HAR

Cuando exportas el registro de red a un formato HAR, ahora puedes ver la información relacionada con los service workers, incluidos los tiempos, como campos personalizados (precedidos por guiones bajos). Por ejemplo, es posible que encuentres los siguientes campos nuevos en el registro:

...
"response": {
  ...
  "_fetchedViaServiceWorker": true,
  "_responseCacheStorageCacheName": "V1",
  "_serviceWorkerResponseSource": "cache-storage"
}
...
"timings": {
  ...
  "_workerStart": -1,
  "_workerReady": -1,
  "_workerFetchStart": -1,
  "_workerRespondWithSettled": -1
}
...

Problema de Chromium: 342406608.

Enviar y recibir eventos de WebSocket en el panel Rendimiento

Al igual que otros eventos de WebSocket, el panel Rendimiento ahora captura los eventos Enviar mensaje de WebSocket y Recibir mensaje de WebSocket y los muestra en el seguimiento del rendimiento. Por ejemplo:

La opción "Recibir mensaje de WebSocket" capturado en el seguimiento de rendimiento.

Problema de Chromium: 40286129.

Otros aspectos destacados

Estas son algunas correcciones y mejoras importantes en esta versión:

  • Accesibilidad: Los lectores de pantalla ahora anuncian el contenido de los mensajes en la consola cuando se desplaza por el registro con las teclas de flecha hacia arriba y hacia abajo (344484979).
  • Fuentes:
    • Página: La opción Guardar como del menú ahora guarda los archivos del módulo de Wasm como objetos binarios de Wasm válidos en lugar de texto Base64 (40784130).
    • Pila de llamadas: Se quitó el sufijo (async) de las descripciones de marcos de llamadas asíncronas. Se cambió el resaltado de cursiva a negrita (343750870).
  • Memoria: Se quitó el InternalNodes innecesario de tamaño cero del Resumen de la instantánea del montón (340200025).
  • Red: Se corrigió un error que impedía la vista previa del contenido de respuesta de transmisión para solicitudes que recién se iniciaban, pero que aún no obtenían un evento responseReceived (338340752).
  • Rendimiento:
    • Estadísticas del selector: Se agregó información explicativa sobre la herramienta para la columna %-of-Slow-Path-Non-Matches (324282954).
    • Modo de configuración de segmentos: Se movió el botón Finalizar configuración de segmentos a la parte inferior derecha (345256274).
  • Consola: Se corrigió un error que mostraba varios mensajes idénticos de la consola cuando se navegaba con la memoria caché atrás/adelante (40894153).
  • Configuración: Se agregaron íconos de ayuda junto a todas las pestañas.

Descarga los canales de vista previa

Considera usar Chrome Canary, Dev o Beta como navegadores de desarrollo predeterminados. Estos canales de vista previa te brindan acceso a las funciones más recientes de Herramientas para desarrolladores, prueban API de plataformas web de vanguardia y detectan problemas en tu sitio antes que los usuarios.

Comunicarse con el equipo de Herramientas para desarrolladores de Chrome

Usa las siguientes opciones para hablar sobre las nuevas funciones y los cambios en la publicación, o cualquier otra cosa relacionada con Herramientas para desarrolladores.

  • Para enviarnos sugerencias o comentarios, accede a crbug.com.
  • Informa un problema en Herramientas para desarrolladores con Más opciones   Más > Ayuda > Informa problemas de Herramientas para desarrolladores en Herramientas para desarrolladores.
  • Twittea a @ChromeDevTools.
  • Deja comentarios en nuestros videos de YouTube de Herramientas para desarrolladores o en videos de YouTube de las Sugerencias de las Herramientas para desarrolladores.

Novedades de Herramientas para desarrolladores

Una lista de todo lo que se ha abordado en la serie Novedades de Herramientas para desarrolladores.