Site logo
Tác giả
  • avatar Nguyễn Đức Xinh
    Name
    Nguyễn Đức Xinh
    Twitter
Ngày xuất bản
Ngày xuất bản

Các Command Phổ Biến Trong Playwright - Hướng Dẫn Chi Tiết

Giới Thiệu Về Playwright Commands

Playwright là một framework mạnh mẽ cho automation testing, cung cấp nhiều command hữu ích để thực hiện các tác vụ testing khác nhau. Trong bài viết này, chúng ta sẽ tìm hiểu các command phổ biến và quan trọng nhất mà bạn cần biết khi làm việc với Playwright.

Các Command Cơ Bản Và Thường Dùng Nhất

1. npx playwright test - Chạy Tests

Command này là quan trọng nhất và được sử dụng nhiều nhất trong quá trình phát triển.

# Chạy tất cả tests
npx playwright test

# Chạy test với browser cụ thể
npx playwright test --browser=chromium
npx playwright test --browser=firefox
npx playwright test --browser=webkit

# Chạy test với headed mode (có giao diện)
npx playwright test --headed

# Chạy test với debug mode
npx playwright test --debug

# Chạy test file cụ thể
npx playwright test my.spec.ts

# Chạy test với grep pattern
npx playwright test --grep "login"

Các options phổ biến:

  • --headed: Chạy test với giao diện browser
  • --debug: Chạy test với Playwright Inspector
  • --browser: Chỉ định browser (chromium, firefox, webkit)
  • --grep: Lọc test theo pattern
  • --workers: Số lượng worker chạy song song
  • --retries: Số lần retry khi test fail

2. npx playwright codegen - Sinh Code Tự Động

Command này giúp sinh code test tự động bằng cách ghi lại các hành động của bạn trên browser.

# Mở codegen với website
npx playwright codegen https://example.com

# Sinh code cho Python
npx playwright codegen --target=python https://example.com

# Sinh code cho Java
npx playwright codegen --target=java https://example.com

# Lưu code vào file
npx playwright codegen --output=test.spec.ts https://example.com

# Sử dụng device emulation
npx playwright codegen --device="iPhone 11" https://example.com

Các target languages hỗ trợ:

  • javascript
  • playwright-test (mặc định)
  • python
  • python-pytest
  • java
  • csharp

3. npx playwright install - Cài Đặt Browsers

# Cài đặt tất cả browsers
npx playwright install

# Cài đặt browser cụ thể
npx playwright install chromium
npx playwright install firefox
npx playwright install webkit

# Cài đặt với dependencies
npx playwright install --with-deps

# Kiểm tra list browsers
npx playwright install --list

4. npx playwright show-report - Xem Test Report

# Mở report mới nhất
npx playwright show-report

# Mở report cụ thể
npx playwright show-report playwright-report

# Chỉ định host và port
npx playwright show-report --host=0.0.0.0 --port=8080

Các Command Utilities Hữu Ích

5. npx playwright screenshot - Chụp Screenshot

# Chụp screenshot cơ bản
npx playwright screenshot https://example.com screenshot.png

# Chụp full page
npx playwright screenshot --full-page https://example.com full-page.png

# Chờ selector trước khi chụp
npx playwright screenshot --wait-for-selector=".content" https://example.com screenshot.png

# Chụp với browser cụ thể
npx playwright screenshot --browser=firefox https://example.com screenshot.png

6. npx playwright pdf - Xuất PDF

# Xuất PDF cơ bản
npx playwright pdf https://example.com document.pdf

# Xuất với định dạng giấy
npx playwright pdf --paper-format=A4 https://example.com document.pdf

# Chờ selector trước khi xuất
npx playwright pdf --wait-for-selector=".content" https://example.com document.pdf

7. npx playwright open - Mở Browser

# Mở browser mặc định
npx playwright open https://example.com

# Mở với browser cụ thể
npx playwright open --browser=webkit https://example.com

# Mở với device emulation
npx playwright open --device="iPhone 11" https://example.com

# Mở với custom viewport
npx playwright open --viewport-size=1280,720 https://example.com

8. npx playwright show-trace - Xem Trace

# Xem trace file
npx playwright show-trace trace.zip

# Xem trace với browser cụ thể
npx playwright show-trace --browser=chromium trace.zip

# Xem trace trên host/port cụ thể
npx playwright show-trace --host=localhost --port=9323 trace.zip

Các Options Và Flags Quan Trọng

Browser Options

--browser=chromium|firefox|webkit    # Chỉ định browser
--headed                             # Chạy với giao diện
--device="iPhone 11"                 # Emulate device
--viewport-size=1280,720            # Kích thước viewport

Test Execution Options

--workers=4                          # Số worker chạy song song
--retries=2                         # Số lần retry
--timeout=30000                     # Timeout cho test
--grep="pattern"                    # Lọc test theo pattern
--project=webkit                    # Chạy project cụ thể

Debug Options

--debug                             # Chạy với Playwright Inspector
--trace=on                          # Bật trace recording
--ui                               # Chạy với UI mode
--headed                           # Chạy với giao diện browser

Bảng So Sánh Các Command Chính

Command Mục đích Sử dụng thường xuyên Ghi chú
test Chạy tests ⭐⭐⭐⭐⭐ Command quan trọng nhất
codegen Sinh code tự động ⭐⭐⭐⭐ Rất hữu ích cho beginners
install Cài đặt browsers ⭐⭐⭐⭐ Cần thiết cho setup
show-report Xem test report ⭐⭐⭐⭐ Quan trọng cho analysis
screenshot Chụp ảnh màn hình ⭐⭐⭐ Hữu ích cho debugging
open Mở browser ⭐⭐⭐ Tốt cho manual testing
show-trace Xem trace ⭐⭐⭐ Quan trọng cho debugging
pdf Xuất PDF ⭐⭐ Ít sử dụng hơn

Workflow Thực Tế Với Playwright Commands

1. Setup Project Mới

# Cài đặt browsers
npx playwright install

# Cài đặt dependencies
npx playwright install --with-deps

2. Phát Triển Tests

# Sinh code tự động
npx playwright codegen https://your-app.com

# Chạy tests trong development
npx playwright test --headed --workers=1

# Debug test cụ thể
npx playwright test --debug login.spec.ts

3. Chạy Tests Trong CI/CD

# Chạy tất cả tests
npx playwright test

# Chạy với retry
npx playwright test --retries=2

# Chạy với specific browser
npx playwright test --browser=chromium

4. Phân Tích Kết Quả

# Xem report
npx playwright show-report

# Xem trace khi test fail
npx playwright show-trace test-results/trace.zip

Best Practices Khi Sử Dụng Playwright Commands

1. Sử Dụng Config File

Thay vì truyền options qua command line, hãy sử dụng playwright.config.ts:

import { defineConfig } from '@playwright/test';

export default defineConfig({
  testDir: './tests',
  timeout: 30000,
  retries: 2,
  use: {
    headless: true,
    viewport: { width: 1280, height: 720 },
    trace: 'on-first-retry',
  },
  projects: [
    {
      name: 'chromium',
      use: { ...devices['Desktop Chrome'] },
    },
    {
      name: 'firefox',
      use: { ...devices['Desktop Firefox'] },
    },
  ],
});

2. Sử Dụng Scripts Trong package.json

{
  "scripts": {
    "test": "npx playwright test",
    "test:headed": "npx playwright test --headed",
    "test:debug": "npx playwright test --debug",
    "test:report": "npx playwright show-report",
    "test:codegen": "npx playwright codegen"
  }
}

3. Environment-specific Commands

# Development
npx playwright test --headed --workers=1

# CI/CD
npx playwright test --reporter=github

# Production validation
npx playwright test --grep="@smoke"

Troubleshooting Common Issues

1. Browser Installation Issues

# Cài đặt lại browsers
npx playwright install --force

# Cài đặt với system dependencies
npx playwright install --with-deps

2. Performance Issues

# Giảm số workers
npx playwright test --workers=1

# Tăng timeout
npx playwright test --timeout=60000

3. Debugging Failed Tests

# Chạy với debug mode
npx playwright test --debug failing-test.spec.ts

# Xem trace
npx playwright show-trace test-results/trace.zip

# Chạy với headed mode
npx playwright test --headed failing-test.spec.ts

Kết Luận

Playwright cung cấp một bộ command mạnh mẽ và linh hoạt cho automation testing. Các command quan trọng nhất mà bạn cần nắm vững là:

  1. npx playwright test - Chạy tests (sử dụng hàng ngày)
  2. npx playwright codegen - Sinh code tự động (rất hữu ích cho beginners)
  3. npx playwright install - Cài đặt browsers (cần thiết cho setup)
  4. npx playwright show-report - Xem kết quả tests (quan trọng cho analysis)

Việc nắm vững các command này sẽ giúp bạn làm việc hiệu quả hơn với Playwright và xây dựng một test suite mạnh mẽ cho ứng dụng của mình. Hãy thực hành thường xuyên với các command này để trở thành một Playwright expert!

Tài Liệu Tham Khảo