Beyond DOM state, many critical behaviours involve network calls, console errors, or file downloads. Playwright lets you assert on these aspects so tests can catch deeper issues than just visual changes.
Asserting on Network Requests and Responses
You can use page.waitForResponse, page.waitForRequest or route inspection to ensure that expected API calls are made and return the right status codes.
// network-console-download.spec.ts
import { test, expect } from '@playwright/test';
test('saves report and verifies API call', async ({ page }) => {
await page.goto('https://demo.myshop.com/reports');
const [response] = await Promise.all([
page.waitForResponse((res) =>
res.url().includes('/api/reports') && res.status() === 200
),
page.getByRole('button', { name: 'Generate report' }).click(),
]);
expect(response.ok()).toBeTruthy();
});
Asserting on Console Errors and Downloads
Playwright can listen for console events and file downloads, letting you fail tests when unexpected errors occur or verifying that a file has been saved.
// Listen for console errors
page.on('console', msg => {
if (msg.type() === 'error') {
throw new Error(`Console error: ${msg.text()}`);
}
});
// Assert on downloads
const [ download ] = await Promise.all([
page.waitForEvent('download'),
page.getByRole('button', { name: 'Download CSV' }).click(),
]);
expect(await download.suggestedFilename()).toContain('report');
These assertions capture issues that users might see as broken behaviour even if the UI still appears superficially correct.
Common Mistakes
Mistake 1 β Ignoring console errors in automated runs
This can hide serious problems.
β Wrong: Treating console output as noise during test execution.
β Correct: Monitor console for errors and fail tests when unexpected ones appear.
Mistake 2 β Assuming downloads work without verifying files
This leaves gaps in coverage.
β Wrong: Clicking download buttons without checking what was saved.
β Correct: Use Playwrightβs download events to validate filenames and contents when needed.