If you are developing a web application that relies on location data—such as a store locator, a weather forecast dashboard, or a delivery routing system—testing different geographical scenarios can be difficult. You cannot physically travel to Tokyo, London, and New York just to see if your map centers correctly. Instead of using complex VPNs or proxy servers, frontend developers can spoof their GPS coordinates directly within the browser using the Google Chrome DevTools “Sensors” tab.
Why Use the Sensors Tab?
The Sensors tab allows you to override the native Geolocation API that Chrome provides to websites. When a webpage executes navigator.geolocation.getCurrentPosition(), the browser usually requests the user’s actual physical location. By using the Sensors tab, you can intercept this request and force the browser to return custom latitude and longitude coordinates, allowing you to instantly teleport your testing environment to anywhere in the world.
Step 1: Open the Sensors Tab
The Sensors panel is part of the supplementary DevTools drawer.
- Open Google Chrome and navigate to your web application.
- Right-click anywhere on the page and select Inspect.
- Press the Escape key to open the bottom “Drawer” panel.
- Click the Three-Dot Menu on the left side of the Drawer panel.
- Select Sensors from the list. The Sensors panel will appear at the bottom of the screen.
Step 2: Override Your Location
You can choose from a list of preset cities or enter custom coordinates.
- In the Sensors panel, locate the Location dropdown menu.
- By default, it is set to “No override”. Click the dropdown and select a preset city, such as Tokyo or London.
- Chrome will instantly populate the Latitude and Longitude fields with the exact coordinates for that city.
- Refresh the webpage. If your application requests your location, Chrome will now report that you are sitting in the middle of Tokyo.
Step 3: Enter Custom Coordinates
If you need to test a highly specific address, such as a localized delivery zone, you can enter exact GPS data.
- Select Other… from the Location dropdown menu.
- Manually type your desired Latitude and Longitude into the input fields.
- Refresh the webpage to apply the new custom location.
Step 4: Test Geolocation Errors
A robust web application must handle situations where the user denies the location permission or the GPS signal fails. You can simulate this failure directly.
- In the Location dropdown menu, select Location unavailable.
- Refresh the page.
- When the web app requests the location, Chrome will instantly throw a
PositionError, allowing you to verify that your application’s error handling and fallback UI work correctly.
By utilizing the DevTools Sensors tab, developers can thoroughly test location-aware applications under a variety of geographical scenarios without ever leaving their desks.