What conditions does Playwright wait for before performing actions?

The Answer

Before any action (click, fill, etc.), Playwright checks 5 actionability conditions: Attached (in DOM), Visible (not hidden), Stable (not animating), Receives Events (not covered by overlay), and Enabled (not disabled).

Deep Dive Explanation

The 'Receives Events' check is what catches situations where a modal overlay or cookie banner is covering a button. Playwright will wait for the overlay to disappear before clicking, eliminating the 'element intercepted' errors common in Selenium.

example.spec.ts

// Playwright checks these AUTOMATICALLY before every action:
// 1. Attached - element is in the DOM
// 2. Visible - element has non-empty bounding box, no display:none/visibility:hidden
// 3. Stable - element's position hasn't changed across 2 consecutive animation frames
// 4. Receives events - nothing is overlapping/intercepting the click point
// 5. Enabled - no 'disabled' attribute for inputs/buttons

// You can check actionability manually:
await page.locator('#submit').waitFor({ state: 'visible' });

// Or check each condition:
const isVisible = await page.locator('#btn').isVisible();
const isEnabled = await page.locator('#btn').isEnabled();
const isEditable = await page.locator('#input').isEditable();