Bài 32 — Project thực chiến: xây dựng test suite hoàn chỉnh cho website thương mại điện tử

ecommerce-tests/
├── pages/                   # Page Objects
│   ├── LoginPage.js
│   ├── ProductsPage.js
│   ├── CartPage.js
│   └── CheckoutPage.js
├── tests/                   # Test theo luồng
│   ├── auth.setup.js        # đăng nhập một lần (Bài 26)
│   ├── login.spec.js
│   ├── products.spec.js
│   ├── cart.spec.js
│   └── checkout.spec.js
├── data/                    # dữ liệu test (Bài 24)
│   └── users.js
├── .env                     # bí mật (không commit)
├── .gitignore
├── playwright.config.js
└── package.json

// pages/LoginPage.js
class LoginPage {
  constructor(page) {
    this.page = page;
    this.usernameInput = page.getByPlaceholder('Username');
    this.passwordInput = page.getByPlaceholder('Password');
    this.loginButton = page.getByRole('button', { name: 'Login' });
    this.errorMessage = page.locator('[data-test="error"]');
  }

  async goto() {
    await this.page.goto('/');
  }

  async dangNhap(username, password) {
    await this.usernameInput.fill(username);
    await this.passwordInput.fill(password);
    await this.loginButton.click();
  }
}

module.exports = { LoginPage };

const { test, expect } = require('@playwright/test');
const { LoginPage } = require('../pages/LoginPage');

test.describe('Đăng nhập', () => {
  let loginPage;

  test.beforeEach(async ({ page }) => {
    loginPage = new LoginPage(page);
    await loginPage.goto();
  });

  test('đăng nhập hợp lệ thì vào trang sản phẩm', async ({ page }) => {
    await loginPage.dangNhap('standard_user', 'secret_sauce');
    await expect(page).toHaveURL(/inventory/);
  });

  const truongHopLoi = [
    { user: 'locked_out_user', pass: 'secret_sauce', loi: 'locked out' },
    { user: 'standard_user',   pass: 'sai',          loi: 'do not match' },
  ];

  for (const tc of truongHopLoi) {
    test(`đăng nhập "${tc.user}" với lỗi thì hiện thông báo`, async () => {
      await loginPage.dangNhap(tc.user, tc.pass);
      await expect(loginPage.errorMessage).toContainText(tc.loi);
    });
  }
});

test('hoàn tất đơn hàng với một sản phẩm', async ({ page }) => {
  const products = new ProductsPage(page);
  const cart = new CartPage(page);
  const checkout = new CheckoutPage(page);

  // Arrange + Act
  await products.goto();
  await products.themVaoGio('Sauce Labs Backpack');
  await cart.goto();
  await cart.thanhToan();
  await checkout.dienThongTin('Nguyen', 'Chung', '700000');
  await checkout.hoanTat();

  // Assert
  await expect(page.getByText('Thank you for your order')).toBeVisible();
});