Using Playwright to specify end-to-end behavior

In this section, you will write your first Playwright test and learn about the various function calls within it, and you’ll learn about differentiating between Playwright end-to-end tests and Vitest unit tests.

Writing the test and watching it fail

The test we are going to write is entitled lists all birthdays and it will perform the following steps:

1. Browse to the /birthdays location.
2. Look for the text Hercules and Athena, which it will take as evidence that the test has passed.

Once the test is in place, we’ll stop to think about how this Hercules and Athena data should get into our system.

Create a new file named tests/birthdays.test.js and add the following content:

import { expect, test } from '@playwright/test';
test('lists all birthdays', async ({ page }) => {
  await page.goto('/birthdays');
  await expect(
    ...