Novedades de Herramientas para desarrolladores (Chrome 81)

Kayce Basques
Kayce Basques

Compatibilidad con Moto G4 en Device Mode

Después de habilitar la barra de herramientas de dispositivo, puedes simular las dimensiones de un viewport de Moto G4. en la lista Dispositivo.

Cómo simular un viewport de Moto G4

Haz clic en Show Device Frame para mostrar el hardware del Moto G4 alrededor del viewport.

Cómo mostrar el hardware de Moto G4

Funciones relacionadas:

  • Abre el menú de comandos y ejecuta el comando Capture screenshot para tomar una captura de pantalla del viewport que incluye el hardware de Moto G4 (después de habilitar Show Device Frame)
  • Limitación de la red y la CPU para simular con mayor precisión la navegación web de un usuario de un dispositivo móvil condiciones.

Problema de Chromium #924693

Actualizaciones relacionadas con las cookies

Cookies bloqueadas en el panel de cookies

El panel Cookies del panel Application ahora colorea las cookies bloqueadas con un fondo amarillo.

Cookies bloqueadas en el panel Cookies del panel Aplicación

Consulta también Cómo depurar por qué se bloqueó una cookie para obtener información sobre cómo acceder a una IU similar desde la red panel.

Problema de Chromium #1030258

Prioridad de las cookies en el panel de cookies

Las tablas de cookies de los paneles Red y Aplicación ahora incluyen la columna Prioridad.

Problema de Chromium #1026879

Editar todos los valores de las cookies

Todas las celdas de las tablas Cookie pueden editarse ahora, excepto las celdas de la columna Size porque La columna representa el tamaño de red de la cookie en bytes. Consulta Campos para obtener una explicación sobre lo siguiente: cada columna.

Cómo editar un valor de cookie

Copiar como recuperación de Node.js para incluir datos de cookies

Haz clic con el botón derecho en una solicitud de red y selecciona Copiar > Copia como recuperación de Node.js para obtener un fetch. expresión que incluye datos de cookies.

Copiar como recuperación de Node.js

Problema de Chromium #1029826

Íconos del manifiesto de apps web más precisos

Antes, el panel Manifiesto del panel Application realizaba sus propias solicitudes para hacer lo siguiente: mostrar íconos del manifiesto de apps web. Las Herramientas para desarrolladores ahora muestran exactamente el mismo ícono de manifiesto que usa Chrome.

Íconos en el panel del manifiesto

Problema de Chromium #985402

Coloca el cursor sobre las propiedades content del CSS para ver los valores sin escape

Coloca el cursor sobre el valor de una propiedad content para ver la versión sin escape del valor.

Por ejemplo, en esta demo, cuando inspeccionas el seudoelemento p::after, ves un carácter de escape. cadena en el panel Estilos:

La cadena de escape

Cuando colocas el cursor sobre el valor content, verás el valor sin escape:

El valor sin escape

Consulta la consola para ver los errores del mapa de fuentes más detallados

En la consola, ahora se proporcionan más detalles sobre los motivos por los que no se pudo cargar o analizar un mapa de fuentes. Antes solo proporcionó un error sin explicar lo que salió mal.

Se produjo un error de carga del mapa de fuentes en Console

Parámetro de configuración para inhabilitar el desplazamiento después del final de un archivo

Abre Configuración y, luego, inhabilita Preferencias > Fuentes > Permitir el desplazamiento después de para inhabilitar el comportamiento predeterminado de la IU que te permite desplazarte mucho más allá del final de un archivo en el panel Fuentes.

Aquí tienes un GIF de la función.

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.