Gebruik het paneel Sensoren om sensorinvoer van elk apparaat te emuleren.
Overzicht
In het paneel Sensoren kunt u het volgende doen:
- Geolocatie overschrijven .
- Simuleer oriëntatie .
- Forceer aanraking .
- Emuleer de status van de inactieve detector .
Open het paneel Sensoren
Afhankelijk van uw besturingssysteem drukt u op de volgende knop om het Commandomenu te openen:
- Op MacOS: Command + Shift + P
- Op Windows, Linux of ChromeOS gebruikt u Control + Shift + P
Typ
sensors, selecteer Sensoren tonen en druk op Enter . Het paneel Sensors wordt onderaan uw DevTools-venster geopend.
Geolocatie overschrijven
Veel websites maken gebruik van de gebruikerslocatie om hun gebruikers een relevantere ervaring te bieden. Een weerwebsite kan bijvoorbeeld de lokale voorspelling voor het gebied van een gebruiker weergeven, zodra de gebruiker de website toestemming heeft gegeven om toegang te krijgen tot zijn locatie.
Als u een gebruikersinterface bouwt die verandert afhankelijk van waar de gebruiker zich bevindt, wilt u er waarschijnlijk voor zorgen dat de site zich op verschillende plaatsen in de wereld correct gedraagt.
Om uw geolocatie te overschrijven, opent u het paneel Sensoren en selecteert u in de geolocatielijst een van de volgende opties:
- Een van de vooraf ingestelde steden, zoals Tokio .
- Aangepaste locatie om aangepaste lengte- en breedtegraadcoördinaten in te voeren.
- Selecteer Locatie niet beschikbaar om te zien hoe uw site zich gedraagt wanneer de locatie van de gebruiker niet beschikbaar is.
Simuleer de oriëntatie van het apparaat
Om verschillende apparaatoriëntaties te simuleren, opent u het paneel Sensors en selecteert u in de lijst Oriëntatie een van de volgende opties:
- Een van de vooraf ingestelde oriëntaties, zoals Portret ondersteboven .
- Aangepaste oriëntatie om uw eigen exacte oriëntatie aan te geven.
Nadat u Aangepaste oriëntatie hebt geselecteerd, zijn de alfa- , bèta- en gammavelden ingeschakeld. Zie Alfa , Bèta en Gamma om te begrijpen hoe deze assen werken.
U kunt ook een aangepaste oriëntatie instellen door het Oriëntatiemodel te slepen. Houd Shift ingedrukt voordat u sleept om langs de alfa- as te roteren.
Forceer aanraking
Als u aanraakgebeurtenissen op uw website wilt testen, kunt u aanraking forceren in plaats van klikken, zelfs als u test op een apparaat zonder aanraakscherm.
Aanraakgebeurtenissen activeren met uw aanwijzer:
- Open het paneel Sensoren .
- Selecteer in de vervolgkeuzelijst Aanraken Aanraking forceren .
- Klik op DevTools opnieuw laden in de prompt bovenaan.
Emuleer de status van de inactieve detector
Met de Idle Detection API kunt u inactieve gebruikers detecteren en reageren op wijzigingen in de inactieve status. Met DevTools kunt u wijzigingen in de inactieve status emuleren voor zowel de gebruikersstatus als de schermstatus, in plaats van te wachten tot de daadwerkelijke inactieve status verandert.
Inactieve toestanden emuleren:
Open het paneel Sensoren . Voor deze tutorial kunt u deze proberen op deze demopagina .
Schakel het selectievakje naast Ephemeral in en geef in de prompt de demopagina toestemming voor inactieve detectie. Laad vervolgens de pagina opnieuw.
Selecteer onder de vervolgkeuzelijst Inactieve detectorstatus emuleren een van de volgende opties:
- Geen inactieve emulatie
- Gebruiker actief, scherm ontgrendeld
- Gebruiker actief, scherm vergrendeld
- Gebruiker inactief, scherm ontgrendeld
- Gebruiker inactief, scherm vergrendeld
In dit voorbeeld emuleert DevTools een inactieve, schermvergrendelde status van de gebruiker en in dit geval begint de demopagina met het aftellen van 10 seconden om het canvas leeg te maken.