Element handling with Playwright

await page.getByTestId('full-name-input').fill('Ada Lovelace');
await page.getByTestId('submit-text-box').click();
await expect(page.getByTestId('output-name')).toHaveText('Name: Ada Lovelace');

await page.getByTestId('checkbox-select-all').check();
await expect(page.getByTestId('checkbox-documents')).toBeChecked();

await page.getByTestId('native-select').selectOption('Mumbai');
await expect(page.getByTestId('native-select-result')).toHaveText('Selected: Mumbai');

await page.getByTestId('autocomplete-input').fill('Ben');
await page.getByTestId('autocomplete-option-bengaluru').click();
await expect(page.getByTestId('autocomplete-result')).toHaveText('Picked: Bengaluru');

const row = page.getByTestId('table-row').filter({ hasText: 'Priya' });
await row.locator('[data-testid^="delete-row-"]').click();
await expect(page.getByTestId('table-row')).toHaveCount(2);

await page.getByTestId('double-click-me').dblclick();
await page.getByTestId('right-click-me').click({ button: 'right' });
await expect(page.getByTestId('right-click-result')).toBeVisible();

page.once('dialog', (d) => d.accept('Ada'));   // register BEFORE the click
await page.getByTestId('prompt-button').click();
await expect(page.getByTestId('prompt-result')).toHaveText('You entered Ada');

page.once('dialog', (d) => d.dismiss());
await page.getByTestId('confirm-button').click();
await expect(page.getByTestId('confirm-result')).toHaveText('You selected Cancel');

const frame = page.frameLocator('[data-testid="single-frame"]');
await frame.getByTestId('single-frame-button').click();
await expect(frame.getByTestId('single-frame-result')).toHaveText('Clicked inside iframe');

const inner = page.frameLocator('[data-testid="outer-frame"]')
  .frameLocator('[data-testid="innermost-frame"]');
await expect(inner.getByTestId('innermost-text')).toBeVisible();

const [tab] = await Promise.all([
  page.context().waitForEvent('page'),
  page.getByTestId('new-tab-button').click(),
]);
await expect(tab.getByTestId('new-tab-heading')).toBeVisible();

await page.getByTestId('draggable-box').dragTo(page.getByTestId('accept-zone'));
await expect(page.getByTestId('accept-zone')).toContainText('Accept (1)');

await page.getByTestId('file-input').setInputFiles('fixtures/sample.txt');
await expect(page.getByTestId('uploaded-file-info')).toContainText('sample.txt');

await page.getByTestId('tooltip-trigger').hover();
await expect(page.getByTestId('tooltip')).toBeVisible();

await page.getByTestId('loading-1-start').click();
// Auto-waits up to the expect timeout (5s by default).
await expect(page.getByTestId('loading-1-result')).toContainText('Hello World!');

// CSS locators pierce open shadow roots automatically.
await page.locator('shadow-counter #inc').click();
await expect(page.locator('shadow-counter #count')).toHaveText('Count: 1');

await page.getByTestId('key-input').press('Enter');
await expect(page.getByTestId('key-result')).toHaveText('You entered: Enter');