QA Profile Form practice
A focused form for practising every input type Playwright tests cover: text fields, radio groups, dropdowns, dates, checkboxes, tabs, file upload, and downloads. Build out your locator strategy before you reveal the solution.
What students should practise on this page
Try each task without peeking at the Solution tab. Each item maps to a Playwright API you'll see on real interview sheets and admin UIs.
- Fill the First name and Last name text inputs using
getByLabel(...).fill(...); assert the values came back viaexpect(input).toHaveValue('...'). - Pick the Gender radio group: select Male with
getByRole('radio', { name: 'Male' }).check()and assert no other gender radio is checked. - Select 5 from the Years of experience dropdown using
selectOption('5'); verify withexpect(select).toHaveValue('5'). - Fill the Date field with a fixed ISO string (e.g.
'2026-05-04') and assert the value sticks. - Check multiple Automation tools at once (UFT + Selenium Webdriver) and confirm exactly which are checked using
getByRole('checkbox', { name }).check(). - Tick at least three continents; assert the count of checked checkboxes equals 3.
- Switch to the Wait Commands tab in the Selenium-commands strip; assert
#selenium-tab-panelnow contains Wait commands. - Use
setInputFileson the Upload Image input to attach a fixture file; assert the visible file name updated. - Validate the Download file link's
hrefviatoHaveAttribute; bonus — listen onpage.waitForEvent('download')when it's clicked. - Click Save profile; assert the JSON output panel contains every field with the values you typed.
// text fields
await page.getByLabel('First name').fill('Aarav');
await page.getByLabel('Last name').fill('Sharma');
// radio groups
await page.getByRole('radio', { name: 'Male' }).check();
await page.getByRole('radio', { name: 'Automation Tester' }).check();
// dropdown + date
await page.getByLabel('Years of experience').selectOption('5');
await page.getByLabel('Date').fill('2026-05-04');
// many checkboxes
for (const tool of ['UFT', 'Selenium Webdriver']) {
await page.getByRole('checkbox', { name: tool }).check();
}
// tab switch
await page.getByRole('tab', { name: 'Wait Commands' }).click();
await expect(page.locator('#selenium-tab-panel')).toContainText('Wait commands');
// upload + download link
await page.getByLabel('Upload Image').setInputFiles('tests/fixtures/avatar.png');
const download = page.getByRole('link', { name: /Download file/i });
await expect(download).toHaveAttribute('href', /conf\.yaml/);