Gary Parker

Enabling Geolocation settings

As part of your automated tests, you may have a scenario where you need to emulate the Geolocation of the user. In Playwright we can do this very simply, by enabling Geolocation permissions and defining the desired Geolocation.

import { test, expect, context } from '@playwright/test';
 
test.use({
  geolocation: { longitude: -18, latitude: 65 },
  permissions: ['geolocation'],
});
 
test('my test with Geolocation', async ({ page }) => {
  //navigate to bing maps
  await page.goto("https://www.bing.com/maps")
  
  //wait for page to load (static wait for demo purposes)
  await page.waitForTimeout(2000)
 
  //click the locate me icon
  await page.getByRole('button', { name: 'Locate me' }).click();
  
  //assert that my location is based on the pre-defined Geolocation
  await expect(page.getByText('IceLand')).toBeVisible();
});

If we run the test in headed mode, we will be able to see that the Geolocation permissions were accepted, and the location was set to somewhere in Iceland.

test

This is great, as it allows us to bypass Geolocation alert pop-ups and set the location without interacting with the UI at all.

Dynamically changing Geolocation

Another use-case you may have, is to change the Geolocation of the session as part of your test. For example, we have set the initial location to Iceland and performed an assertion, we've then changed the location to the United Kingdom and made a further assertion.

import { test, expect } from '@playwright/test';
 
test.use({
  geolocation: { longitude: -18, latitude: 65 },
  permissions: ['geolocation'],
});
 
test('my test with Geolocation', async ({ page, context }) => {
  // navigate and check the Geolocation
  await page.goto("https://www.bing.com/maps")
  await page.waitForTimeout(2000)
  await page.getByRole('button', { name: 'Locate me' }).click();
  await expect(page.getByText('IceLand')).toBeVisible();
  
  // change the Geolocation within the test
  await context.setGeolocation({ longitude: -0.15, latitude: 51 });
  await page.reload()
  await page.getByRole('button', { name: 'Locate me' }).click();
  await expect(page.getByText('United Kingdom')).toBeVisible();  
});

Global configuration

In the first few examples we used test.use, which applied to all tests in the spec file.

If we need to set the Geolocation globally for all tests, this can be easily configured in the playwright.config.ts

import { defineConfig } from '@playwright/test';
 
export default defineConfig({
  use: {
    // Context geolocation
    geolocation: { longitude: 12.492507, latitude: 41.889938 },
    permissions: ['geolocation'],
  },
});