From a sentence to a scheduled Playwright test

1. Sign in as the 2FA shopper: username and password, then the 6-digit authenticator code.
2. Open the Waterproof Notebook and add one to the cart.
3. Check out: fill in a shipping address and pay with the test card 4242 4242 4242 4242, any future expiry date and CVC 123.
4. Check the order confirmation says the order was placed and the total is $21.00 (the $16.00 notebook plus $5.00 shipping).

checkout-with-2fa-sign-in.spec.ts

1import { test, expect, otp } from '../fixtures';
2
3test('Checkout with 2FA sign-in', async ({ page }) => {
4  await test.step('Sign in as the 2FA shopper', async () => {
5    await page.getByRole('link', { name: 'Sign in' }).click();
6    await page.getByRole('textbox', { name: 'Username' }).fill(process.env.TARGET_EMAIL!);
7    await page.getByRole('textbox', { name: 'Password' }).fill(process.env.TARGET_PASSWORD!);
8    await page.getByRole('button', { name: 'Sign in' }).click();
9
10    await page.getByRole('textbox', { name: 'Authentication code' }).fill(otp());
11    await page.getByRole('button', { name: 'Verify' }).click();
12
13    await expect(page.getByRole('button', { name: 'Sign out' })).toBeVisible();
14  });
15
16  await test.step('Open the Waterproof Notebook and add one to the cart', async () => {
17    await page.getByRole('link', { name: 'Waterproof Notebook' }).click();
18    await page.getByTestId('add-to-cart').click();
19    await expect(page.getByRole('link', { name: 'Check out' })).toBeVisible();
20  });
21
22  await test.step('Check out and pay with test card', async () => {
23    await page.getByRole('link', { name: 'Check out' }).click();
24
25    await page.getByRole('textbox', { name: 'Street address' }).fill('123 Main St');
26    await page.getByRole('textbox', { name: 'City' }).fill('Anytown');
27    await page.getByRole('textbox', { name: 'Postcode' }).fill('12345');
28
29    const paymentFrame = page.locator('iframe[title="Secure card payment input frame"]').contentFrame();
30    await paymentFrame.getByRole('textbox', { name: 'Card number' }).fill('4242 4242 4242 4242');
31    await paymentFrame.getByRole('textbox', { name: 'Expiration (MM / YY)' }).fill('12/28');
32    await paymentFrame.getByRole('textbox', { name: 'CVC' }).fill('123');
33
34    await page.getByTestId('place-order').click();
35  });
36
37  await test.step('Verify order confirmation and total', async () => {
38    await expect(page.getByText('Thanks! Your order has been placed.')).toBeVisible();
39    await expect(page.getByTestId('order-total')).toHaveText('$21.00');
40  });
41});

1. PassedSign in as the 2FA shopper310 ms
2. PassedOpen the Waterproof Notebook and add one to the cart130 ms
3. PassedCheck out and pay with test card185 ms
4. PassedVerify order confirmation and total65 ms

0AI calls on this passing run

Proposed fixThe page changed, not the app’s behaviour.

     await page.getByRole('link', { name: 'Waterproof Notebook' }).click();
-Removed:     await page.getByTestId('add-to-cart').click();
+Added:     await page.getByTestId('add-to-bag').click();