E2Eテスト自動化入門

Transcript

1. ‘25/02開催 とことんDevOps勉強会 2025年02月26日(水) 20:00より E2Eテスト自動化入門 ～テスト作成からGitHub Actionsでの 自動実行までやってみよう～

2. None
3. None
4. None
5. None
6. None
7. None

8. npm init playwright@latest

9. npm init playwright@latest tests/example.spec.ts ※

10. import { test, expect } from '@playwright/test'; test('has title', async

    ({ page }) => { await page.goto('https://playwright.dev/'); // Expect a title "to contain" a substring. await expect(page).toHaveTitle(/Playwright/); }); test('get started link', async ({ page }) => { await page.goto('https://playwright.dev/'); // Click the get started link. await page.getByRole('link', { name: 'Get started' }).click(); // Expects page to have a heading with the name of Installation. await expect(page.getByRole('heading', { name: 'Installation' })).toBeVisible(); });

11. npx playwright test npx playwright test --project=chromium npx playwright test

    tests/example.spec.ts npx playwright test --ui
12. None
13. None

14. ※

15. None

16. ※

17. None
18. None

19. ※

20. None

21. Record new

22. None

23. import { test, expect } from '@playwright/test'; test('has title', async

    ({ page }) => { await page.goto('https://playwright.dev/'); // Expect a title "to contain" a substring. await expect(page).toHaveTitle(/Playwright/); }); test('get started link', async ({ page }) => { await page.goto('https://playwright.dev/'); // Click the get started link. await page.getByRole('link', { name: 'Get started' }).click(); // Expects page to have a heading with the name of Installation. await expect(page.getByRole('heading', { name: 'Installation' })).toBeVisible(); });

24. test('タイトル', async ({ page }) => { ... }); タイトル

    import { test, expect } from '@playwright/test'; test('has title', async ({ page }) => { // テストシナリオ1 }); test('get started link', async ({ page }) => { // テストシナリオ2 });

25. test('タイトル', async ({ page }) => { ... }); test('has

    title', async ({ page }) => { await page.goto('https://playwright.dev/'); // Expect a title "to contain" a substring. await expect(page).toHaveTitle(/Playwright/); });

26. page.goto() await page.goto('https://playwright.dev/');

27. .toHaveTitle() await expect(page).toHaveTitle(/Playwright/);

28. test('get started link', async ({ page }) => { await

    page.goto('https://playwright.dev/'); // Click the get started link. await page.getByRole('link', { name: 'Get started' }).click(); // Expects page to have a heading with the name of Installation. await expect(page.getByRole('heading', { name: 'Installation' })).toBeVisible(); });

29. page.getByRole() link Get started link <a> await page.getByRole('link', { name:

    'Get started' }).click();

30. Installation page.getByRole('heading', { name: 'Installation' }) <h1> <h6> Installation expect()

    .toBeVisible() await expect(page.getByRole('heading', { name: 'Installation' })).toBeVisible();

31. .getByRole() getByText() getByLabel() getByTestId() locator()

32. locator() #username username .btn btn button div > p div

    p await page.locator('#username').fill('my_username');