Hướng Dẫn Thực Thi Kiểm Tra với Playwright qua CLI

Trong bài viết này, chúng ta sẽ cùng tìm hiểu cách thực hiện các câu lệnh để chạy các bài kiểm tra tự động bằng Playwright thông qua giao diện dòng lệnh (CLI). Đây là một phần quan trọng giúp bạn tối ưu hóa quy trình kiểm thử tự động của mình.

Bước 1: Tạo Project Playwright

Để thực hành, bạn cần tạo một project Playwright như đã hướng dẫn trong Bài 3. Bạn có thể tham khảo tại đây: Bài 3: First Test Case với Playwright.

Sau khi hoàn thành các bước trong Bài 3, bạn sẽ thấy file playwright.config.ts với nội dung như sau:

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

/**
 * Đọc các biến môi trường từ file.
 * https://github.com/motdotla/dotenv
 */
// require('dotenv').config();

/**
 * Xem thêm tại https://playwright.dev/docs/test-configuration.
 */
export default defineConfig({
  testDir: './tests',
  /* Chạy song song các test trong các file */
  fullyParallel: true,
  /* Gây lỗi nếu quên xóa test.only trong mã nguồn khi chạy CI. */
  forbidOnly: !!process.env.CI,
  /* Thử lại chỉ trên CI */
  retries: process.env.CI ? 2 : 0,
  /* Tùy chọn không chạy song song trên CI. */
  workers: process.env.CI ? 1 : undefined,
  /* Báo cáo sử dụng. Xem https://playwright.dev/docs/test-reporters */
  reporter: 'html',
  /* Cài đặt chung cho tất cả các project dưới đây. */
  use: {
    /* URL cơ sở để sử dụng trong các hành động như `await page.goto('/')`. */
    // baseURL: 'http://127.0.0.1:3000',
    /* Thu thập trace khi thử lại các test thất bại. */
    trace: 'on-first-retry',
  },

  /* Cấu hình cho các trình duyệt chính */
  projects: [
    {
      name: 'chromium',
      use: { ...devices['Desktop Chrome'] },
    },
    {
      name: 'firefox',
      use: { ...devices['Desktop Firefox'] },
    },
    {
      name: 'webkit',
      use: { ...devices['Desktop Safari'] },
    },
  ],
});

Bước 2: Chạy Tất Cả Các Test Case

Để chạy tất cả các test case trong project với ba trình duyệt (Chromium, Firefox, WebKit), bạn hãy gõ câu lệnh sau trong terminal:

npx playwright test

Sau khi thực hiện, bạn có thể hiển thị báo cáo bằng lệnh:

npx playwright show-report

Bạn sẽ thấy có 2 test case, nhưng do đang cấu hình chạy với 3 trình duyệt khác nhau, kết quả sẽ hiển thị 6 test case (mỗi test case được chạy lại 3 lần với 3 trình duyệt).

Bước 3: Chạy Test với Giao Diện Đồ Họa

Nếu bạn muốn xem các thao tác trong trình duyệt khi chạy test, bạn có thể chạy lệnh sau:

npx playwright test --headed

Bước 4: Chạy Test với Một File

Để chạy test từ một file cụ thể (ví dụ: example.spec.ts) với trình duyệt Firefox, bạn sử dụng lệnh sau:

npx playwright test example.spec.ts --project=firefox

Nếu bạn muốn chạy file này trên tất cả các trình duyệt, bạn chỉ cần chạy:

npx playwright test example.spec.ts

Bước 5: Cấu Hình Retry Nếu Thất Bại

Để cấu hình thử lại khi test thất bại, bạn có thể sử dụng lệnh:

npx playwright test --retries=1 --project=chromium

Cấu Hình NPM Script trong package.json

Cấu hình này thường được sử dụng để chạy trên pipeline Jenkins. Bạn có thể cấu hình trong file package.json như sau:

"scripts": {
    "test:chromium": "npx playwright test --project=chromium",
    "test:retry": "npx playwright test --retries=1 --project=chromium",
    "test:firefox": "npx playwright test --project=firefox"
},

Chạy Test Thông Qua NPM Script

• Để chạy test với cấu hình test:chromium, bạn gõ:

npm run test:chromium

• Để chạy test với cấu hình test:retry, bạn gõ:

npm run test:retry

• Để chạy test với cấu hình test:firefox, bạn gõ:

npm run test:firefox

Hy vọng bài viết này sẽ giúp bạn thực hiện thành công việc kiểm tra tự động bằng Playwright qua CLI. Nếu bạn có bất kỳ câu hỏi nào, hãy để lại comment bên dưới để mình cùng thảo luận nhé!
source: viblo