# TÀI LIỆU THAM KHẢO — Đọc Thêm Khi Muốn Hiểu Sâu > Các file cấp độ trong thư mục này (1 → 1.5 → 2 → 3) là **lộ trình tối thiểu** để bắt đầu làm việc. > File này dành cho ai muốn đi xa hơn: hiểu bản chất, tự xử lý tình huống khó, nâng trình. > **Không cần đọc hết** — coi đây là danh mục tra cứu, gặp vấn đề gì thì tìm mục tương ứng. --- ## 1. Playwright — Tài Liệu Chính Thức (quan trọng nhất) Trang chủ tài liệu: **https://playwright.dev/docs/intro** Tài liệu chính thức luôn là nguồn chính xác và cập nhật nhất. Các trang nên đọc theo thứ tự ưu tiên: | Ưu tiên | Chủ đề | Link | Liên quan cấp độ | | --- | --- | --- | --- | | ⭐⭐⭐ | Locators — cách tìm element | https://playwright.dev/docs/locators | Cấp độ 2 | | ⭐⭐⭐ | Assertions — các loại expect | https://playwright.dev/docs/test-assertions | Cấp độ 2 | | ⭐⭐⭐ | Actions — click, fill, press... | https://playwright.dev/docs/input | Cấp độ 2 | | ⭐⭐⭐ | Best Practices — quy tắc viết test tốt | https://playwright.dev/docs/best-practices | Cấp độ 2–3 | | ⭐⭐ | Trace Viewer — debug khi fail | https://playwright.dev/docs/trace-viewer | Cấp độ 1–2 | | ⭐⭐ | UI Mode | https://playwright.dev/docs/test-ui-mode | Cấp độ 1–2 | | ⭐⭐ | Auto-waiting — vì sao ít khi cần wait thủ công | https://playwright.dev/docs/actionability | Cấp độ 2–3 | | ⭐⭐ | Fixtures — cơ chế đằng sau base-test.ts | https://playwright.dev/docs/test-fixtures | Cấp độ 3 | | ⭐⭐ | Authentication — cơ chế đằng sau auth.setup.ts | https://playwright.dev/docs/auth | Cấp độ 3 | | ⭐ | Cấu hình test (playwright.config.ts) | https://playwright.dev/docs/test-configuration | Cấp độ 3 | | ⭐ | Parallelism — workers, chạy song song | https://playwright.dev/docs/test-parallel | Cấp độ 3 | | ⭐ | Retries — tự chạy lại test flaky | https://playwright.dev/docs/test-retries | Cấp độ 3 | | ⭐ | API đầy đủ của Page | https://playwright.dev/docs/api/class-page | Tra cứu | | ⭐ | API đầy đủ của Locator | https://playwright.dev/docs/api/class-locator | Tra cứu | > **Mẹo đọc tài liệu tiếng Anh:** mở trang bằng Chrome → chuột phải → "Dịch sang tiếng Việt". > Bản dịch đủ hiểu ý; riêng phần code thì giữ nguyên không bị dịch. --- ## 2. Video — Học Bằng Mắt ### Kênh chính thức của Playwright - **Playwright trên YouTube**: https://www.youtube.com/@Playwrightdev Video ngắn theo từng tính năng, có series "Playwright Tutorial" cho người mới. ### Khoá học miễn phí được đánh giá cao | Khoá | Link | Ghi chú | | --- | --- | --- | | Playwright Tutorial Full Course (LambdaTest) | https://www.youtube.com/watch?v=wawbt1cATsk | ~6 tiếng, từ số 0 | | Playwright — freeCodeCamp | https://www.youtube.com/c/freecodecamp (tìm "Playwright") | freeCodeCamp nổi tiếng dạy dễ hiểu | | Test Automation University — Playwright course | https://testautomationu.applitools.com/playwright-intro/ | Miễn phí, có chứng chỉ, chia bài ngắn | > **Test Automation University** (testautomationu.applitools.com) đáng bookmark riêng: > toàn bộ khoá miễn phí, có cả lộ trình JavaScript/TypeScript cơ bản cho tester. --- ## 3. TypeScript / JavaScript — Khi Muốn Hiểu Code Sâu Hơn Cấp độ 2 đã dạy 6 khái niệm tối thiểu. Nếu muốn vững hơn (đọc hiểu PW.ts, tự viết helper phức tạp): | Nguồn | Link | Ghi chú | | --- | --- | --- | | JavaScript.info | https://javascript.info/ | Giáo trình JS đầy đủ và dễ hiểu nhất, có bản dịch tiếng Việt một phần | | TypeScript Handbook | https://www.typescriptlang.org/docs/handbook/intro.html | Tài liệu chính thức TS | | Async/await giải thích | https://javascript.info/async-await | **Đọc trang này trước** — hiểu `await` là hiểu 80% code Playwright | | MDN Web Docs | https://developer.mozilla.org/vi/ | Từ điển tra cứu HTML/CSS/JS, có tiếng Việt | **Chỉ cần học các chủ đề này, bỏ qua phần còn lại:** biến & kiểu dữ liệu → hàm & arrow function → async/await → mảng & object → template string → import/export. --- ## 4. HTML / CSS Selector — Nền Tảng Của Việc Tìm Element Hiểu HTML/CSS selector giúp bạn tự xử lý khi trang không có `data-test`: | Nguồn | Link | Ghi chú | | --- | --- | --- | | MDN — CSS Selectors | https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_selectors | Tra cứu chuẩn | | CSS Diner (game) | https://flukeout.github.io/ | **Game luyện selector** — vui, 32 level, chơi 1 buổi là vững | | W3Schools CSS Selector Reference | https://www.w3schools.com/cssref/css_selectors.php | Bảng tra nhanh 1 trang | | Chrome DevTools docs | https://developer.chrome.com/docs/devtools/ | Hướng dẫn F12 chính thức từ Google | --- ## 5. Trang Web Để Luyện Tập Thêm Đã làm xong saucedemo? Các trang này được thiết kế riêng để luyện automation, độ khó tăng dần: | Trang | Link | Luyện gì | | --- | --- | --- | | SauceDemo | https://www.saucedemo.com | Login, giỏ hàng, checkout (đã học ở Cấp độ 2) | | The Internet (Heroku) | https://the-internet.herokuapp.com/ | ~40 bài tập nhỏ: alert, iframe, drag-drop, dynamic loading, upload... | | Practice Expand Testing | https://practice.expandtesting.com/ | Bản mở rộng của The Internet, thêm nhiều bài | | Automation Exercise | https://automationexercise.com/ | Flow e-commerce đầy đủ, có sẵn danh sách test case để làm theo | | UI Testing Playground | http://uitestingplayground.com/ | Các bẫy kinh điển: element ẩn, load chậm, id thay đổi... | | DemoQA | https://demoqa.com/ | Form, bảng, widget đủ loại | | OrangeHRM Demo | https://opensource-demo.orangehrmlive.com/ | App quản trị nhân sự thật — gần giống app nội bộ nhất | **Lộ trình luyện gợi ý:** The Internet (chọn 5–7 bài) → UI Testing Playground (học cách xử lý bẫy) → OrangeHRM (viết bộ test như project thật). --- ## 6. Kiến Thức Kiểm Thử — Không Riêng Gì Automation Automation chỉ là công cụ; tư duy thiết kế test case mới là gốc: | Nguồn | Link | Ghi chú | | --- | --- | --- | | ISTQB Foundation Syllabus | https://istqb.org/certifications/certified-tester-foundation-level-cftl/ | Giáo trình chuẩn quốc tế về kiểm thử, tải PDF miễn phí | | Ministry of Testing | https://www.ministryoftesting.com/ | Cộng đồng tester lớn nhất, nhiều bài viết/khoá học | | Test design: phân vùng tương đương & giá trị biên | Tìm "equivalence partitioning boundary value analysis" | 2 kỹ thuật thiết kế case quan trọng nhất — vì sao test login cần đủ 7 case chứ không phải 2 | --- ## 7. Cộng Đồng — Nơi Hỏi Khi Bí | Nơi | Link | Ghi chú | | --- | --- | --- | | Playwright Discord (chính thức) | https://aka.ms/playwright/discord | Đội ngũ Playwright trả lời trực tiếp | | Stack Overflow tag [playwright] | https://stackoverflow.com/questions/tagged/playwright | Tìm lỗi của bạn ở đây trước — 90% đã có người hỏi | | GitHub Issues của Playwright | https://github.com/microsoft/playwright/issues | Khi nghi ngờ là bug của chính Playwright | | Cộng đồng Testing Việt Nam (Facebook) | Tìm nhóm "Cộng đồng Tester Việt Nam" | Hỏi đáp bằng tiếng Việt | **Cách hỏi để được trả lời nhanh:** mô tả điều mong đợi + điều thực tế xảy ra + đoạn code + message lỗi đầy đủ. Đừng chỉ nói "test của em bị fail". --- ## 8. Tra Cứu Nhanh Trong Chính Project Này Trước khi tìm ngoài, nhớ rằng project đã có sẵn: | Cần gì | Xem ở đâu | | --- | --- | | Toàn bộ thao tác thường gặp kèm ví dụ chạy được | `tests/demo/demo-actions.spec.ts` | | Bài mẫu login hoàn chỉnh 7 case | `tests/saucedemo/login.spec.ts` | | Spec mẫu theo chuẩn project (fixture, PW, test.step) | `tests/uc_example/1.1.x/1.1.1.spec.ts` | | Tham số chạy lệnh, cấu hình, quy ước đặt tên | `README.md` (thư mục template) | | PW helper có những hàm gì | `src/utils/PW.ts` — mở đọc trực tiếp, mỗi hàm có comment | | Các mốc thời gian chờ | `src/constant/timeout.ts` | --- ## Gợi Ý Lộ Trình Sau Khi Xong 3 Cấp Độ ``` Tuần 1–2 Làm chắc lại Cấp độ 1–3 với project thật + chơi CSS Diner cho vững selector Tuần 3–4 Đọc kỹ: Locators, Assertions, Best Practices (mục 1) + luyện 5–7 bài trên The Internet Tháng 2 Học async/await bài bản (javascript.info) + đọc Auto-waiting và Fixtures để hiểu vì sao project cấu trúc như vậy + luyện UI Testing Playground Tháng 3+ Khoá Playwright trên Test Automation University (lấy chứng chỉ) + tự thiết kế bộ test cho OrangeHRM như một project thật ``` --- *Link có thể thay đổi theo thời gian — nếu link chết, tìm theo tên tài liệu trên Google. Cập nhật file này khi tìm được nguồn hay hơn.*