What is timeout in Playwright?

The Answer

Playwright has multiple timeout layers: (1) Action timeout — how long to wait for an element to be actionable. (2) Assertion timeout — how long to retry a Web-First assertion. (3) Navigation timeout — how long `goto()` waits. (4) Test timeout — the total time a test can run.

Deep Dive Explanation

The hierarchy matters: if your test timeout is 30s but an action takes 20s, you have only 10s left for remaining assertions. Always set timeouts based on actual observed performance, not arbitrary large values.

example.spec.ts

// playwright.config.ts - global settings
export default defineConfig({
  timeout: 30000,          // Test timeout: 30s
  expect: {
    timeout: 5000,         // Assertion timeout: 5s
  },
  use: {
    actionTimeout: 10000,  // Action timeout: 10s
    navigationTimeout: 30000, // Navigation timeout: 30s
  },
});

// Override per-action
await page.locator('#slow-element').click({ timeout: 15000 });

// Override per-assertion
await expect(page.locator('.result')).toBeVisible({ timeout: 20000 });

// Override test timeout
test('long test', async ({ page }) => {
  test.setTimeout(60000); // This test gets 60s
});