18. Simulating Real User Interactions & Gestures

The Core Actions API

// Text Inputs:
// fill() clears existing text and types the new text instantly
await page.getByLabel("Email").fill("qa@targetqa.com");
// press() fires keyboard keys (Enter, ArrowDown, Backspace)
await page.getByLabel("Search").press("Enter");
// Checkboxes and Radio buttons:
await page.getByLabel("Subscribe to newsletter").check();
await page.getByLabel("Dark theme").uncheck();
// Select Dropdowns:
await page.getByLabel("Country").selectOption("CA"); // by value
await page.getByLabel("Country").selectOption({ label: "Canada" }); // by visible label
// Mouse gestures:
await page.getByRole("button", { name: "Save" }).click({ button: "right" }); // right-click
await page.getByTestId("menu-item").hover(); // hover to reveal dropdown
await page.locator("#source-card").dragTo(page.locator("#target-column"));

---

fill() vs pressSequentially()

- fill(): Sets the input value directly (ideal for fast form completion). - pressSequentially(): Types character by character with configurable delays (ideal for testing real-time search autosuggest or masked credit card inputs).

await page.getByPlaceholder("Search products").pressSequentially("Laptop", { delay: 100 });

---

File Upload & Download

// Upload file
await page.getByLabel("Upload Profile Picture").setInputFiles("test-data/avatar.png");
// Download file
const downloadPromise = page.waitForEvent("download");
await page.getByRole("button", { name: "Export CSV" }).click();
const download = await downloadPromise;
await download.saveAs("/tmp/export.csv");