I am resolving an issue with a PWA not working offline properly and thought it would be a good idea to add a test to ensure that the PWA works offline. I use Playwright.
test('works offline', async ({ page }) => {
// Go to the webpage
await page.goto('http://localhost:3000/')
// Go offline
await page.context().setOffline(true)
// Keep a list of all failed requests
const failed: string[] = []
page.context().on('requestfailed', (r) => {
if (r.url().startsWith('http://localhost')) {
failed.push(r.url() + ' ' + r.failure()!.errorText)
}
})
// Reload the page
await page.reload()
// Ensure that the app still kinda works
// expect(...)
// Ensure that there are no failed requests
expect(failed).toHaveLength(0)
})
When the app fails to load some asset files while offline, it will result in a test failure that looks like this: