Sensores: Emular los sensores del dispositivo

Kayce Basques
Kayce Basques
Sofia Emelianova
Sofia Emelianova

Usa el panel Sensores para emular la entrada de sensores de cualquier dispositivo.

Descripción general

El panel Sensores te permite hacer lo siguiente:

Abre el panel Sensores

  1. Según tu sistema operativo, presiona lo siguiente para abrir el menú de comandos:

    • En macOS, Comando + Mayúsculas + P
    • En Windows, Linux o ChromeOS, presiona Ctrl + Mayúsculas + P.

    Usa el menú de comandos para abrir el panel de Sensores.

  2. Escribe sensors, selecciona Show Sensors y presiona Intro. El panel Sensores se abre en la parte inferior de la ventana de Herramientas para desarrolladores.

Anula la ubicación geográfica

Muchos sitios web aprovechan la ubicación del usuario para brindar una experiencia más relevante a sus usuarios. Por ejemplo, un sitio web del clima podría mostrar el pronóstico local del área de un usuario una vez que este le haya otorgado permiso al sitio web para acceder a su ubicación.

Si estás creando una IU que cambia según la ubicación del usuario, probablemente quieras asegurarte de que el sitio se comporte correctamente en diferentes lugares del mundo.

Para anular tu ubicación geográfica, abre el panel Sensores y, en la lista Ubicación geográfica, selecciona una de las siguientes opciones:

  • Una de las ciudades predeterminadas, como Tokio.
  • Ubicación personalizada para ingresar coordenadas de longitud y latitud personalizadas
  • Selecciona Ubicación no disponible para ver cómo se comporta tu sitio cuando la ubicación del usuario no está disponible.

Seleccionar "Tokio" en la lista "Geolocalización".

Cómo simular la orientación del dispositivo

Para simular diferentes orientaciones del dispositivo, abre el panel Sensores y, en la lista Orientación, selecciona una de las siguientes opciones:

  • Una de las orientaciones predeterminadas, como Vertical invertida.
  • Orientación personalizada para proporcionar tu propia orientación exacta

Selecciona "Vertical boca abajo" en la lista "Orientación".

Después de seleccionar Orientación personalizada, se habilitan los campos alfa, beta y gamma. Consulta Alfa, Beta y Gamma para comprender cómo funcionan estos ejes.

También puedes establecer una orientación personalizada arrastrando el Modelo de orientación. Mantén presionada la tecla Mayús antes de arrastrar para rotar a lo largo del eje alfa.

El modelo de orientación.

Toque forzado

Para probar los eventos táctiles en tu sitio web, puedes forzar el toque en lugar de hacer clic, incluso si realizas la prueba en un dispositivo sin pantalla táctil.

Para activar eventos táctiles con el puntero, haz lo siguiente:

  1. Abre el panel Sensores.
  2. En la lista desplegable Tocar, selecciona Toque fuerte. Genera una respuesta táctil sin hacer clic.
  3. Haz clic en Reload DevTools en el mensaje de la parte superior.

Emula el estado del detector de inactividad

La API de Idle Detection te permite detectar usuarios inactivos y reaccionar ante los cambios de estado de inactividad. Con Herramientas para desarrolladores, puedes emular los cambios de estado de inactividad tanto para el estado del usuario como para el estado de la pantalla en lugar de esperar a que cambie el estado de inactividad real.

Para emular estados de inactividad, haz lo siguiente:

  1. Abre el panel Sensores.

  2. Habilita la casilla de verificación junto a Ephemeral y, en el mensaje, otorga a la página de demostración el permiso de detección de inactividad. Luego, vuelve a cargar la página.

    Cómo otorgar el permiso de detección de inactividad en una página de demostración

  3. En el menú desplegable Emulate Idle detector State, selecciona una de las siguientes opciones:

    • Sin emulación de inactividad
    • El usuario está activo y la pantalla está desbloqueada
    • El usuario está activo y la pantalla está bloqueada
    • El usuario está inactivo y la pantalla está desbloqueada
    • El usuario está inactivo y la pantalla está bloqueada

Seleccionar un estado inactivo y bloqueado en una página de demostración

Cómo emular la simultaneidad del hardware

Para emular el rendimiento de tu sitio web en dispositivos con diferentes cantidades de núcleos de procesador, puedes anular el valor que informa la propiedad navigator.hardwareConcurrency. Algunas aplicaciones usan esta propiedad para controlar el grado de paralelismo de su aplicación, por ejemplo, para controlar el tamaño del grupo de Emscripten pthread.

Para emular la simultaneidad del hardware, haz lo siguiente:

  1. Abre el panel Sensores.
  2. Cerca de la parte inferior del panel, busca y activa Hardware concurrency.
  3. En el cuadro de entrada de números, ingresa la cantidad de núcleos que deseas emular.

Se activó "Hardware concurrency" con la cantidad de núcleos establecida en 10.

Para volver al valor predeterminado, haz clic en el botón Restablecer.

Cómo emular la presión de la CPU

La presión de CPU o de procesamiento es un conjunto de estados informados que te dan una idea de la cantidad de carga de trabajo que está experimentando el procesamiento del sistema y si está cerca del límite o no. Esta información te permite adaptar tu aplicación en tiempo real, por ejemplo, una videoconferencia o un videojuego, para aprovechar toda la potencia de procesamiento disponible y mantener la capacidad de respuesta del sistema adaptando las cargas de trabajo en tiempo real.

El panel Sensores te permite emular los estados que puede informar la API de Compute Pressure.

Para emular la presión de la CPU en tu sitio web, haz lo siguiente:

  1. Abre el panel Sensores.
  2. Cerca de la parte inferior del panel, busca la sección Presión de la CPU y selecciona uno de los estados de presión legibles: Sin anulación, Nominal, Aceptable, Grave o Crítico.
  3. En el mensaje de la parte superior de Herramientas para desarrolladores, haz clic en Reload DevTools.

Emula la presión de CPU "Grave".