Testing PWAs

Testing strategies

Test PWAs across: offline behavior, service worker updates, caching correctness, installation on real devices, and accessibility. Use Chrome DevTools, Lighthouse, and manual testing.

Unit test service worker

Test service worker with Jest or Vitest.

describe('Service Worker', () => {
  it('should cache on install', async () => {
    const cache = await caches.open('v1');
    await cache.add('/index.html');
    const cached = await cache.match('/index.html');
    expect(cached).toBeDefined();
  });

  it('should serve from cache on fetch', async () => {
    // Mock fetch event
    const response = await cache.match('/index.html');
    expect(response).toBeDefined();
  });
});

Output:

Service worker caching and fetch behavior verified through tests.

A common trap

Always test on real devices and real network conditions. Simulator throttling and localhost testing miss real-world issues.