Automation Project

Dự án automation testing sử dụng Playwright, TypeScript, Nx monorepo với đầy đủ các công cụ CI/CD.

🚀 Tech Stack

• Playwright - Framework testing end-to-end
• TypeScript - Ngôn ngữ lập trình
• Nx Monorepo - Workspace management
• ESLint - Code linting
• Prettier - Code formatting
• Husky - Git hooks
• GitHub Actions - CI/CD pipeline

📁 Cấu trúc dự án

automation-project/
├── apps/
│   └── e2e-tests/           # Playwright E2E tests
│       ├── e2e/            # Test files
│       ├── playwright.config.ts
│       └── ...
├── .github/
│   └── workflows/
│       └── ci.yml          # CI/CD pipeline
├── .husky/                 # Git hooks
├── .eslintrc.json         # ESLint configuration
├── .lintstagedrc.json     # Lint-staged configuration
├── .prettierrc            # Prettier configuration
└── package.json

🛠️ Cài đặt

Prerequisites

• Node.js (v18 trở lên)
• npm

Installation

1. Clone repository:

git clone <repository-url>
cd automation-project

2. Cài đặt dependencies:

npm install

3. Cài đặt Playwright browsers:

npx playwright install

🧪 Chạy Tests

Chạy tất cả E2E tests

npm run test:e2e

Chạy tests với UI mode

npm run test:e2e:ui

Chạy tests với headed mode (hiển thị browser)

npm run test:e2e:headed

Chạy tests cho project cụ thể

npx nx e2e @automation-project/e2e-tests

🔧 Development

Linting

# Chạy lint cho toàn bộ project
npm run lint

# Tự động fix linting issues
npm run lint:fix

# Lint cho project cụ thể
npx nx lint @automation-project/e2e-tests

Formatting

# Format code
npm run format

# Kiểm tra formatting
npm run format:check

Nx Commands

# Xem thông tin project
npx nx show project @automation-project/e2e-tests

# Chạy affected tests (chỉ test những file thay đổi)
npx nx affected --target=e2e

# Xem dependency graph
npx nx graph

🔄 Git Workflow

Project sử dụng Husky để chạy pre-commit hooks:

1. Pre-commit: Tự động chạy lint-staged

   • Lint và format code
   • Kiểm tra TypeScript types

2. Push: CI/CD pipeline tự động chạy trên GitHub Actions

📊 CI/CD Pipeline

GitHub Actions workflow sẽ:

1. Cài đặt dependencies
2. Cài đặt Playwright browsers
3. Chạy linting
4. Kiểm tra code formatting
5. Chạy E2E tests
6. Upload test reports

📝 Viết Tests

Cấu trúc test file:

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

test.describe('Feature Name', () => {
  test('should do something', async ({ page }) => {
    await page.goto('https://example.com');
    await expect(page).toHaveTitle(/Expected Title/);
  });
});

Best Practices:

• Sử dụng Page Object Model
• Tạo test data factories
• Sử dụng fixtures cho setup/teardown
• Tổ chức tests theo features

🔧 Configuration

Playwright Configuration

File: apps/e2e-tests/playwright.config.ts

ESLint Configuration

• Root: .eslintrc.json
• E2E specific: apps/e2e-tests/.eslintrc.json

Prettier Configuration

File: .prettierrc

📚 Tài liệu tham khảo

• Playwright Documentation
• Nx Documentation
• TypeScript Documentation

🤝 Contributing

1. Fork repository
2. Tạo feature branch
3. Commit changes
4. Push branch
5. Tạo Pull Request

📞 Support

Nếu có vấn đề gì, vui lòng tạo issue trên repository.