Novedades de Herramientas para desarrolladores (Chrome 94)

Usa las Herramientas para desarrolladores en el lenguaje que prefieras

Las Herramientas para desarrolladores de Chrome ahora admiten más de 80 idiomas, lo que te permite trabajar en tu idioma preferido.

Abre Configuración y selecciona tu idioma preferido en Preferencias > Menú desplegable Language y vuelve a cargar Herramientas para desarrolladores.

Preferencias" ancho="800" altura="494">

Problema de Chromium: 1163928

Nuevos dispositivos Nest Hub en la lista de dispositivos

Ahora puedes simular las dimensiones de Nest Hub y Nest Hub Max en el Modo de dispositivo.

Haz clic en Activar o desactivar la barra de herramientas del dispositivo   Activar o desactivar la barra de herramientas del dispositivo  , y selecciona Nest Hub o Nest Hub Max en la lista de dispositivos.

Dispositivo Nest Hub en el modo Dispositivo

Problema de Chromium: 1223525

Pruebas de origen en la vista Detalles del marco

Ahora puedes obtener información sobre las pruebas de origen de un sitio en la vista de detalles del marco, en el panel Application.

Las pruebas de origen te brindan acceso a una función experimental o nueva para compilar funcionalidades que los usuarios pueden probar por un tiempo limitado antes de que esté disponible para todos.

Abre una página con pruebas de origen (p.ej., página de demostración). En el panel Application, desplázate hacia abajo hasta la sección Frames y selecciona el marco superior.

Pruebas de origen en la vista Detalles del marco

Problema de Chromium: 607555

Nueva insignia de consultas de contenedores de CSS

Se agrega una nueva insignia de container junto a los elementos del contenedor (los elementos principales que coinciden con los criterios de at-rules @container). Haz clic en la insignia para activar o desactivar la visualización de una superposición del contenedor elegido y todos sus elementos subordinados de consultas en la página.

Insignia de consultas de contenedores de CSS

Problema de Chromium: 1146422

Nueva casilla de verificación para invertir los filtros de red

Usa la nueva casilla de verificación Invertir para invertir los filtros en el panel Red.

Por ejemplo, puedes escribir "status-code: 404" para filtrar las solicitudes de red con el estado 404. Habilita la casilla de verificación Invertir para anular el filtro (muestra todas las solicitudes de red que no tengan el estado 404).

Cómo invertir los filtros de red

Problema de Chromium: 1054464

La barra lateral de Console dejará de estar disponible próximamente

La barra lateral de la consola se quitará para mover la IU de filtro a la barra de herramientas. ¿Tienes alguna inquietud o comentario? Comunícate con nosotros a través de esta herramienta de seguimiento de errores.

Mensaje de baja en la barra lateral de la consola

Problema de Chromium: 1232937

Muestra encabezados Set-Cookie sin procesar en la pestaña Problemas y el panel Red

Herramientas para desarrolladores ahora muestra encabezados Set-Cookie sin procesar en la pestaña Problemas.

Anteriormente, las Herramientas para desarrolladores no mostraban cookies con formato incorrecto (encabezado Set-Cookie incorrecto) en el panel Red. Cuando se agrega el nuevo filtro response-header-set-cookie al panel Network, los usuarios pueden filtrar la respuesta del encabezado Set-Cookie sin procesar. Las Herramientas para desarrolladores vincularán los encabezados Set-Cookie sin procesar de la pestaña Issues al panel Network.

"Set-Cookie" sin procesar encabezados en la pestaña Problemas y en el panel Red

Problema de Chromium: 1179186

Descriptores de acceso nativos de display coherentes como propiedades propias en la consola

La consola ahora muestra los descriptores de acceso nativos como sus propias propiedades de manera coherente.

Por ejemplo, cuando se evaluó la expresión new Int8Array([1, 2, 3]) en Console, los descriptores de acceso nativos como length, byteOffset no se mostraban en la vista previa. Con esta actualización más reciente, los descriptores de acceso nativos se muestran en la vista previa y los valores se evalúan con anticipación cuando se expanden.

Descriptores de acceso nativos de display coherentes como propiedades propias en la consola

Problemas de Chromium: 1076820, 1199247

Seguimientos de pila de errores adecuados para secuencias de comandos intercaladas con #sourceURL

Herramientas para desarrolladores ahora resuelve secuencias de comandos intercaladas con #sourceURL de manera correcta y muestra los seguimientos de pila de errores adecuados para la depuración.

Anteriormente, Herramientas para desarrolladores mostraba una ubicación incorrecta para las secuencias de comandos intercaladas con #sourceURL, en relación con el documento que lo rodeaba y no con la etiqueta <script> de apertura.

Seguimientos de pila de errores adecuados para secuencias de comandos intercaladas con #sourceURL

Problemas de Chromium: 1183990, 578269

Cambia el formato de color en el panel Computed

Ahora puedes cambiar el formato de color de cualquier elemento en el panel Computed. Para ello, presiona Mayúsculas y haz clic en la vista previa del color.

Mayúsculas + Haz clic en la vista previa de color para cambiar el formato de color

Problema de Chromium: 1226371

Reemplaza los cuadros de información personalizados por los de HTML nativo

Herramientas para desarrolladores ahora adopta información sobre herramientas de HTML nativo en todos los componentes. Herramientas para desarrolladores ha implementado la información sobre la herramienta personalizada desde hace mucho tiempo debido a la falta de estilo de una información sobre la herramienta HTML nativa.

Lamentablemente, mantener la implementación de información sobre la herramienta personalizada es complicado y, por lo general, nos encontramos con errores complicados.

Después de reponder los beneficios de las implementaciones personalizadas, descubrimos que la información sobre la herramienta HTML nativa es suficiente para Herramientas para desarrolladores, y adoptarla evita una gran variedad de problemas para nuestros usuarios.

Información sobre Herramientas para desarrolladores

Problema de Chromium: 1223391

[Experimental] Ocultar problemas en la pestaña Problemas

Habilita el experimento para ocultar el menú de problemas para ocultarlos en la pestaña Problemas. De esta manera, puedes enfocarte en los asuntos importantes que te interesan.

En la pestaña Problemas, coloca el cursor sobre un problema, haz clic en el menú de problemas Más que se encuentra a la derecha y selecciona Ocultar problemas como estos para ocultarlos.

Ocultar menú contextual del problema experimental

Problema de Chromium: 1175722

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.