Test And Debug
Use DevTools for manual platform inspection and Playwright for repeatable regressions.
| Panel | Check |
|---|
| Manifest | Installability errors, icon rendering, screenshots, protocol handlers |
| Service workers | Registration, scope, update, skip waiting, push, sync, offline mode |
| Cache storage | Precached shell, runtime caches, stale entries |
| IndexedDB | Object stores, records, outbox state, migrations |
| Storage | Quota usage, clear storage, persistence behavior |
| Network | Offline reload, request fallback, cache headers |
Playwright Offline Smoke
import { test, expect } from '@playwright/test';
test('offline reload keeps the app usable', async ({ context, page }) => {
await page.goto('/');
await expect(page.getByRole('heading')).toBeVisible();
await context.setOffline(true);
await page.reload();
await expect(page.getByText(/offline|saved|pending/i)).toBeVisible();
});
Service Worker Testing Modes
| Mode | Use |
|---|
serviceWorkers: 'allow' | Test real PWA behavior |
serviceWorkers: 'block' | Test network routing/interception without service worker interference |
Manual Device Matrix
- Desktop Chrome or Edge install.
- Android Chrome install.
- iOS Safari Add to Home Screen if iOS matters.
- Offline reload after install.
- App update after a new deployment.
- Push permission and click route where supported.