TESTHEON Practice Lab

Component Lab J · Cookies, storage, permissions and network

Browser Context Lab

Inspect fixture-local browser state, exercise secure-context permissions, simulate offline requests, and assert deterministic responsive contracts.

Start the fixtureRead the E2E guide

PRACTICE FIXTURE — intentionally built for automation practice

Cookies and consent preference

A readable fixture cookie demonstrates set/read/delete; the real sandbox cookie remains HttpOnly and is reported only as present or absent.

This inline practice control does not load analytics or third-party scripts.

Local and session storage

Both stores use fixed keys and expose every write, read, and clear operation.

localStorage

Local storage not read.

sessionStorage

Session storage not read.

Secure-context permissions

Fictional locations, notification permission, and clipboard read/write report granted, denied, unavailable, and error states.

Checking secure context.

No location requested.

No notification permission requested.

No clipboard action.

Offline and aborted requests

Navigator events and a real health request expose online, offline, and network-error outcomes for context.setOffline and route.abort.

Reading navigator state.

No health request made.

Responsive layout contract

Mobile is below 700 px, tablet is 700–1023 px, and desktop is 1024 px and wider.

NavigationWorkspaceInspector

Measuring viewport.

Passing examples

Start with observable behavior

These snippets match executable tests stored inexamples/playwright-ts/.

Permissions and geolocation
await context.grantPermissions(['geolocation'], { origin: new URL(page.url()).origin });
await context.setGeolocation({ latitude: 18.5204, longitude: 73.8567 });
await page.getByRole('button', { name: 'Read fictional location' }).click();
await expect(page.getByTestId('geolocation-result')).toContainText('Pune');
Offline context
await context.setOffline(true);
await page.getByRole('button', { name: 'Request health endpoint' }).click();
await expect(page.getByTestId('network-result')).toContainText('Network request failed');
await context.setOffline(false);
Storage state inspection
await page.getByLabel('Local storage value').fill('desktop-4803');
await page.getByRole('button', { name: 'Write local storage' }).click();
const state = await context.storageState();
expect(state.origins[0]?.localStorage).toContainEqual({ name: 'practice-local', value: 'desktop-4803' });