Sensori: emulano i sensori del dispositivo

Kayce Basques

Sofia Emelianova

Utilizza la scheda Sensori per emulare l'ingresso dei sensori di qualsiasi dispositivo:

• Sostituisci geolocalizzazione.
• Simula orientamento.
• Forza tocco.
• Emula lo stato di inattività del rilevatore.

Apri la scheda Sensori

1. A seconda del sistema operativo, premi i tasti seguenti per aprire il menu dei comandi:

   • Su MacOS, premi Comando+Maiusc+P
   • Su Windows, Linux o ChromeOS, premi Ctrl+Maiusc+P

   

2. Digita sensors, seleziona Mostra sensori e premi Invio. Nella parte inferiore della finestra di DevTools si apre la scheda Sensori.

Sostituisci geolocalizzazione

Molti siti web sfruttano la posizione dell'utente per fornire un'esperienza più pertinente ai propri utenti. Ad esempio, un sito web che offre previsioni meteo potrebbe mostrare le previsioni locali per l'area di un utente, una volta che quest'ultimo ha concesso al sito web l'autorizzazione ad accedere alla sua posizione.

Se stai creando un'interfaccia utente che cambia a seconda di dove si trova l'utente, probabilmente vorrai assicurarti che il sito funzioni correttamente in luoghi diversi nel mondo.

Per eseguire l'override della geolocalizzazione, apri la scheda Sensori e seleziona una delle seguenti opzioni dall'elenco Geolocalizzazione:

• Una delle città preimpostate, come Tokyo.
• Posizione personalizzata per inserire coordinate di latitudine e longitudine personalizzate.
• Seleziona Posizione non disponibile per vedere come si comporta il tuo sito quando la posizione dell'utente non è disponibile.

Simula orientamento dispositivo

Per simulare diversi orientamenti del dispositivo, apri la scheda Sensori e, dall'elenco Orientamento, seleziona una delle seguenti opzioni:

• Uno degli orientamenti preimpostati, ad esempio Ritratto capovolto.
• Orientamento personalizzato per indicare esattamente il tuo orientamento.

Dopo aver selezionato Orientamento personalizzato, i campi alfa, beta e gamma vengono attivati. Consulta le sezioni Alpha, Beta e Gamma per capire come funzionano questi assi.

Puoi anche impostare un orientamento personalizzato trascinando il Modello di orientamento. Tieni premuto Maiusc prima di trascinare per ruotare lungo l'asse alfa.

Forza tocco

Per testare gli eventi di tocco sul tuo sito web, puoi forzare il tocco anziché il clic anche se stai eseguendo il test su un dispositivo senza touchscreen.

Per attivare gli eventi tocco con il puntatore:

1. Apri la scheda Sensori.
2. Nell'elenco a discesa Tocco, seleziona Forza tocco.
3. Fai clic su Ricarica DevTools nella richiesta in alto.

Emula lo stato di inattività del rilevatore

L'API Idle Detection ti consente di rilevare gli utenti non attivi e di reagire alle variazioni dello stato di inattività. Con DevTools, puoi emulare le modifiche dello stato di inattività sia per lo stato utente che per quello dello schermo, invece di attendere che lo stato di inattività effettivo cambi.

Per emulare gli stati di inattività:

1. Apri la scheda Sensori. Per questo tutorial, puoi provarla in questa pagina demo.

2. Seleziona la casella di controllo accanto a Temporaneo e, nel prompt, concedi alla pagina demo l'autorizzazione di rilevamento di inattività. Quindi, ricarica la pagina.

   

3. Sotto il menu a discesa Emula stato di inattività del rilevatore, seleziona una delle seguenti opzioni:

   • Nessuna emulazione inattiva
   • Utente attivo, schermo sbloccato
   • Utente attivo, schermo bloccato
   • Utente inattivo, schermo sbloccato
   • Utente inattivo, schermo bloccato

In questo esempio, DevTools emula uno stato Utente inattivo, schermo bloccato e, in questo caso, la pagina demo avvia il conto alla rovescia di 10 secondi per cancellare il canvas.