16 challenges · 4 parts

From Manual Testing to Playwright

For: Manual testers and anyone new to automation

Start from the checks you already do by hand and automate them one step at a time: open pages, fill forms, cover failure paths, wait without sleeps, then put it together in a full journey.

1. PART 1

   Your first automated checks

   Open a page, click, fill, select and press keys.

   1. 01Navigate to a Pagepage.goto · await · how a test starts
   2. 02Click a Buttonlocators · getByRole · click
   3. 03Count Multiple Elementsreusing a locator · repeated actions · role-based locators
   4. 04Fill a Number Inputinput roles · fill · values as text
   5. 05Follow a Navigation Linklink role · accessible names · navigation
   6. 06Select from a DropdownselectOption · the combobox role · select by text or value
   7. 07Add a Todo Itemkeyboard actions · placeholder locators · separate awaited actions

2. PART 2

   Real forms and interactions

   Cover happy and failure paths the way a tester does.

   1. 08Fill a Login Formlabel locators · form filling · submitting
   2. 09Test Form Error Messagesnegative paths · label locators · form submission
   3. 10Interact with Checkboxesthe checkbox role · check and uncheck · state changes
   4. 11Reveal Hidden Content on Hoverhover · image alt text · hidden content
   5. 12Detect a Keyboard Pressfocus · key presses · keyboard events

3. PART 3

   Waiting and tables

   Wait for the page instead of sleeping, and act on the right row.

   1. 13Wait for Dynamic Contentauto-waiting · no fixed sleeps · delayed content
   2. 14Handle a JavaScript Alertdialog events · listener before action · alerts
   3. 15Filter Table Rowsfilter() · tables · scoped locators

4. PART 4

   A full journey

   Put the steps together into one end-to-end flow.

   1. 25Full User Journeymulti-step flows · state across pages · end-to-end journeys