Adding a Playwright test for data input

Go ahead and add this test to tests/birthdays.test.js. It includes all the steps required for adding a new birthday to the system:

test('saves a new birthday', async ({ page }) => {
  await page.goto('/birthdays');
  await page.getByLabel('Name').fill('Persephone');
  await page
    .getByLabel('Date of birth')
    .fill('1985-01-01');
  await page.getByRole('button').click();
  await expect(
    page.getByText('Persephone')
  ).toBeVisible();
});

After navigating to the /birthdays endpoint, it uses the getByLabel locator function to find an input field that has a Name label. This is standard HTML functionality using the label and input elements, which we’ll see in the next section.

We use the fill function to enter a value into...