Tôi sẽ dùng xuyên suốt bối cảnh quen thuộc của series: hệ thống đặt phòng họp nội bộ với màn hình đăng nhập. Nếu bạn còn mơ hồ về khái niệm nền, hãy đọc qua Automation testing là gì trước, rồi quay lại đây thực hành cùng tôi.

Playwright là gì & vì sao hot

Playwright là gì? Đó là framework mã nguồn mở của Microsoft để tự động hóa kiểm thử web trên nhiều trình duyệt (Chromium, Firefox, WebKit) bằng một API duy nhất. Nó điều khiển trình duyệt thật, mô phỏng người dùng click, gõ phím, điều hướng — rồi kiểm tra kết quả. Với tester, đây là công cụ để biến kịch bản test thủ công thành script chạy lại được vô số lần.

Vì sao Playwright hot đến vậy trong 2–3 năm gần đây? Vài lý do rất thực tế:

  • Auto-wait tích hợp: Playwright tự chờ phần tử sẵn sàng trước khi thao tác, giảm hẳn lỗi "flaky" (test lúc pass lúc fail) vốn ám ảnh người dùng Selenium.
  • Đa trình duyệt, đa ngôn ngữ: một bộ test chạy được trên Chromium, Firefox, WebKit; hỗ trợ TypeScript/JavaScript, Python, Java, .NET.
  • Codegen mạnh: ghi thao tác thành code, cực hợp cho người mới.
  • Trace viewer & report đẹp: khi test fail, bạn xem lại từng bước như tua video.

Playwright thường được đặt cạnh Selenium và Cypress khi chọn công cụ. Tôi đã so sánh kỹ trong bài Selenium vs Playwright vs Cypress; ở đây chỉ cần nhớ Playwright cân bằng tốt giữa tốc độ, độ ổn định và độ dễ học.

Cài đặt Playwright (Node + npm init playwright)

Điều kiện tiên quyết: máy đã cài Node.js (bản LTS, từ 18 trở lên) — Playwright dùng npm để cài. Kiểm tra bằng node -v. Có Node rồi thì việc dựng dự án playwright automation chỉ mất một câu lệnh.

Mở terminal tại thư mục dự án và chạy:

bash npm init playwright@latest

Lệnh này sẽ hỏi vài lựa chọn — với người mới, cứ chọn mặc định:

Câu hỏi khi cài Nên chọn (người mới) Ý nghĩa
TypeScript hay JavaScript? TypeScript Gợi ý code tốt hơn, ít lỗi gõ sai
Tên thư mục test tests (mặc định) Nơi chứa file .spec.ts
Thêm GitHub Actions workflow? Yes (nếu dùng CI) Sinh sẵn cấu hình chạy test tự động
Cài trình duyệt Playwright? Yes Tải Chromium/Firefox/WebKit

Sau khi xong, thư mục dự án sẽ có playwright.config.ts (cấu hình), thư mục tests với một file mẫu, và các trình duyệt đã tải sẵn. Nếu về sau cần cài lại trình duyệt, chạy npx playwright install. Vậy là môi trường học playwright của bạn đã sẵn sàng — không cần dựng gì thêm.

Viết test đầu tiên (codegen)

Đây là phần khiến Playwright thân thiện đặc biệt với người mới: codegen — công cụ ghi lại thao tác và tự sinh code test. Thay vì gõ tay từng dòng, bạn thao tác trên trình duyệt như người dùng thật, Playwright viết code giúp bạn.

Chạy codegen trỏ tới trang đăng nhập của hệ thống đặt phòng họp:

bash npx playwright codegen https://booking.example.com/login

Một cửa sổ trình duyệt và một cửa sổ Inspector sẽ mở lên. Bạn cứ nhập email, mật khẩu, bấm "Đăng nhập" — mỗi thao tác được ghi thành code ngay trong Inspector. Copy đoạn code đó vào một file tests/login.spec.ts, tinh chỉnh lại một chút là có test hoàn chỉnh:

```typescript import { test, expect } from '@playwright/test';

test('đăng nhập thành công vào hệ thống đặt phòng', async ({ page }) => { await page.goto('https://booking.example.com/login'); await page.getByLabel('Email').fill('tester@company.com'); await page.getByLabel('Mật khẩu').fill('Passw0rd!'); await page.getByRole('button', { name: 'Đăng nhập' }).click(); await expect(page.getByText('Danh sách phòng họp')).toBeVisible(); }); ```

Codegen không chỉ tiết kiệm thời gian — nó còn dạy bạn cách Playwright chọn phần tử. Bạn sẽ thấy nó ưu tiên getByRole, getByLabel thay vì bám vào class CSS dễ vỡ. Đó là thói quen tốt cần học ngay từ đầu.

Locator & assertion cơ bản

Hai khái niệm lõi bạn phải nắm khi làm playwright tiếng việt hay bất kỳ ngôn ngữ nào: locator (cách chỉ ra phần tử) và assertion (cách kiểm tra kết quả). Playwright khuyến khích các locator "hướng người dùng" — chọn phần tử theo cách con người nhìn thấy, thay vì selector kỹ thuật dễ đổi.

Các locator nên ưu tiên, theo thứ tự:

Locator Ví dụ Khi dùng
getByRole page.getByRole('button', { name: 'Đăng nhập' }) Nút, link, ô nhập — ổn định nhất
getByLabel page.getByLabel('Email') Ô form có nhãn
getByText page.getByText('Danh sách phòng họp') Kiểm tra nội dung hiển thị
getByTestId page.getByTestId('room-card') Khi dev gắn data-testid
CSS/XPath page.locator('.btn-primary') Hạn chế — dễ vỡ khi đổi giao diện

Về assertion, Playwright dùng expect với các web-first assertion tự động chờ điều kiện đúng trong thời gian cho phép:

typescript await expect(page.getByText('Đăng nhập thất bại')).toBeVisible(); await expect(page).toHaveURL(/.*dashboard/); await expect(page.getByRole('row')).toHaveCount(5);

Đây cũng là lúc auto-wait phát huy: khi bạn viết expect(...).toBeVisible(), Playwright tự chờ phần tử xuất hiện thay vì fail ngay lập tức. Bạn gần như không phải viết sleep thủ công — điểm khác biệt lớn giúp test bớt flaky. Việc chọn locator ổn định cũng liên quan chặt tới ngôn ngữ cho automation bạn dùng, vì cú pháp mỗi ngôn ngữ hơi khác nhưng triết lý locator thì giống nhau.

Chạy test & xem report

Viết xong thì chạy. Playwright chạy test song song mặc định và có report trực quan — phần thưởng cho công sức viết script. Các lệnh cơ bản bạn dùng hằng ngày:

Lệnh Tác dụng
npx playwright test Chạy toàn bộ test (headless, song song)
npx playwright test login.spec.ts Chạy đúng một file
npx playwright test --headed Chạy có hiển thị trình duyệt để quan sát
npx playwright test --ui Mở UI Mode: chạy, xem, debug trực quan
npx playwright show-report Mở HTML report sau khi chạy

Sau khi test chạy xong, npx playwright show-report mở một báo cáo HTML: bao nhiêu test pass/fail, mỗi bước mất bao lâu. Khi có test fail, bạn mở trace để tua lại từng thao tác kèm ảnh chụp DOM tại thời điểm lỗi — cực kỳ tiện để tìm nguyên nhân mà không phải chạy lại thủ công. Với người mới, tôi khuyên dùng --ui (UI Mode) trong lúc học: nó cho bạn thấy từng bước test đang làm gì, giống như debug có hình.

Playwright + AI (test agents) — điểm khác biệt 2026

Đây là điểm khiến việc học Playwright năm 2026 khác hẳn vài năm trước. Playwright giờ đi kèm hệ sinh thái AI: bạn có thể mô tả kịch bản bằng ngôn ngữ tự nhiên, để một "test agent" đề xuất hoặc sinh script Playwright, rồi tự mình rà lại. Microsoft cũng phát hành Playwright MCP — server giúp các mô hình AI điều khiển trình duyệt qua chính API Playwright, mở đường cho kiểm thử do agent dẫn dắt.

Nhưng đây là chỗ tôi phải nói thẳng theo góc nhìn ISTQB: AI hỗ trợ chứ không thay tester. Kịch bản do AI sinh vẫn cần human-in-the-loop — bạn phải xác minh locator có đúng không, assertion có kiểm thật đúng thứ cần kiểm không, và cảnh giác với "ảo giác" (AI bịa ra selector không tồn tại). Kỹ năng đọc-hiểu test, thiết kế ca kiểm thử tốt vẫn là thứ AI chưa thay được — và đó chính là giá trị của người tester.

Ghi chú thuật ngữ: ISTQB không định nghĩa riêng "Playwright" — đây là công cụ cụ thể, không phải khái niệm trong syllabus. Tuy nhiên test automation (tự động hóa kiểm thử) là nội dung được ISTQB ghi nhận, và nguyên tắc bất biến vẫn đúng: automation kiểm tra lại điều đã biết một cách nhanh và ổn định, còn thiết kế test và tư duy kiểm thử vẫn do con người.

Nếu bạn muốn học Playwright bài bản — từ cài đặt, page object, tới tích hợp CI và AI test agent — trên dự án thật, hãy tham khảo khóa Automation Playwright của IT LEARN.