Skip to content

Giới Thiệu

Đây là buổi học cuối cùng — không có lý thuyết mới, 100% là practice và demonstration. Các bạn sẽ xây dựng một full QA pipeline production cho TaskFlow app (Node.js + Express + SQLite + Vitest) và hoàn thành 8 deliverables.

Mục tiêu: Chứng minh rằng các bạn có khả năng xây dựng, tự động hóa, và quản lý một QA/QC pipeline đầu đủ từ test suite đến CI/CD đến evidence tracking.


8 Deliverables + Checklists

D1: Test Suite 5 Layers (20 điểm)

5 test files, tất cả passing, cover toàn bộ stack.

Checklist:
☐ tests/safety.test.js (Frontend Safety)
  ☐ XSS prevention tests
  ☐ Input sanitization tests
  ☐ CSRF token validation
  ☐ All tests passing

☐ tests/routes.test.js (API Routes)
  ☐ GET/POST/PUT/DELETE endpoints
  ☐ Status code assertions (200, 400, 404, 500)
  ☐ Response payload validation
  ☐ All tests passing

☐ tests/business-logic.test.js (Business Logic)
  ☐ Task creation, update, delete
  ☐ Status transitions
  ☐ User permission checks
  ☐ All tests passing

☐ tests/i18n-sync.test.js (i18n Sync)
  ☐ Language file structure validation
  ☐ Key consistency across locales (vi, en)
  ☐ Missing translation detection
  ☐ All tests passing

☐ tests/security-scan.test.js (Security Scan)
  ☐ SQL injection prevention
  ☐ Rate limiting check
  ☐ Authentication bypass tests
  ☐ All tests passing

☐ npm run test → All 5 files pass
☐ Coverage report ≥ 80%

D2: CI/CD 8 Gates (.github/workflows/ci.yml)

Checklist:
☐ Gate 1: Lint (ESLint)
  ☐ .eslintrc.json configured
  ☐ Script: npm run lint
  ☐ Fails on error

☐ Gate 2: Type Check (optional but recommended)
  ☐ Script: npm run type-check (or JSDoc validation)

☐ Gate 3: Unit Tests (Vitest)
  ☐ Script: npm run test
  ☐ Fails if tests fail

☐ Gate 4: Integration Tests
  ☐ Script: npm run test:integration
  ☐ SQLite DB setup in workflow

☐ Gate 5: Security Scan (Snyk)
  ☐ Snyk API token in GitHub Secrets
  ☐ Script: snyk test
  ☐ Fails on vulnerabilities

☐ Gate 6: Build Check
  ☐ Script: npm run build (if applicable)

☐ Gate 7: Visual Regression (Playwright)
  ☐ Script: npm run test:visual
  ☐ Golden images committed

☐ Gate 8: Documentation Check
  ☐ Script: node scripts/check-docs.js
  ☐ Validates evidence log exists

☐ All 8 gates run on: push, pull_request
☐ Workflow file syntax valid
☐ All environment variables set in secrets

D3: Auto Issue Creation (scripts/auto-issue.js)

Checklist:
☐ scripts/auto-issue.js created
  ☐ Uses GitHub API (Octokit)
  ☐ Triggered by: if: failure() in CI workflow
  ☐ Creates issue with:
    ☐ Title: "[AUTO] CI Failed: {job-name} on {branch}"
    ☐ Body: Error details + commit SHA + timestamp
    ☐ Labels: ["bug", "ci-failure", "auto"]
    ☐ Assignee: PR author

☐ GitHub token stored in secrets.GITHUB_TOKEN
☐ Tested: Intentionally fail a test, verify issue creation
☐ Issue includes commit link + job log link

D4: AI Code Review (GitHub Action or script)

Checklist:
☐ Option A: GitHub Action
  ☐ action: aider-ai/pr-reviewer@v1 (or similar)
  ☐ Trigger: on: pull_request
  ☐ API key in secrets.OPENAI_API_KEY

☐ Option B: Custom Script (scripts/ai-review.js)
  ☐ Uses OpenAI API (gpt-4 or gpt-3.5-turbo)
  ☐ Analyzes PR diff
  ☐ Posts review comment on PR
  ☐ Checks for: security issues, performance, test coverage

☐ Tested: Create PR, verify AI comment posted
☐ Reviews include specific code suggestions

D5: Visual Regression (Playwright)

Checklist:
☐ tests/visual.spec.js created
  ☐ Navigates to critical pages:
    ☐ Dashboard
    ☐ Task list
    ☐ Settings
  ☐ Takes screenshots: screenshot({ path: 'golden/{page}.png' })
  ☐ Compare with golden images: expect(screenshot).toMatchSnapshot()

☐ golden/ directory with baseline images
  ☐ golden/dashboard.png
  ☐ golden/tasklist.png
  ☐ golden/settings.png

☐ CI runs visual tests
☐ Visual regression fails on diff > 1%
☐ Playwright config in playwright.config.ts

D6: Security Gate (Snyk + Security Scan)

Checklist:
☐ Snyk integration
  ☐ Snyk account created
  ☐ API token in GitHub Secrets
  ☐ CI runs: snyk test
  ☐ Fails on high/critical vulns

☐ Custom security scan script
  ☐ scripts/security-scan.js checks:
    ☐ No hardcoded secrets (grep for API_KEY, PASSWORD, etc.)
    ☐ Dependencies audit: npm audit --audit-level=moderate
    ☐ No dangerous packages in node_modules

☐ SBOM (Software Bill of Materials)
  ☐ Generates: docs/sbom.json
  ☐ Includes all dependencies + versions

D7: QA Knowledge Base

Checklist:
☐ docs/evidence-log.md
  ☐ Structure:
    ☐ # Evidence Log
    ☐ ## Manual Tests (dates, testers, results)
    ☐ ## Automated Tests (test names, pass/fail count)
    ☐ ## Security Scans (Snyk results, dates)
    ☐ ## Performance Metrics (load time, memory)
  ☐ Last updated: today
  ☐ Includes: 20+ evidence entries

☐ docs/qa-lessons.md
  ☐ Summary of all 20 lessons learned
  ☐ Key concepts (unit test, integration test, CI/CD, etc.)
  ☐ Tools used (Vitest, Playwright, Snyk, GitHub Actions)
  ☐ Best practices discovered

☐ CONTINUITY.md (root)
  ☐ How to maintain this pipeline
  ☐ How to add new tests
  ☐ How to extend CI/CD gates
  ☐ Troubleshooting guide

D8: Evidence Dashboard (docs/evidence-report.md)

Checklist:
☐ docs/evidence-report.md structure:
  ☐ # QA Evidence Report
  ☐ Generated: {timestamp}
  ☐ Git commit: {SHA}

  ☐ ## Test Results
    ☐ Test Layer | Status | Count | Coverage
    ☐ Safety | ✓ | 8/8 | 95%
    ☐ Routes | ✓ | 12/12 | 88%
    ☐ Business Logic | ✓ | 15/15 | 92%
    ☐ i18n | ✓ | 5/5 | 100%
    ☐ Security | ✓ | 10/10 | 85%

  ☐ ## CI/CD Gate Status
    ☐ Gate | Status | Runtime | Timestamp
    ☐ Lint | ✓ | 15s | 2026-04-24 14:30:21
    ☐ Tests | ✓ | 45s | 2026-04-24 14:30:37
    ☐ Security | ✓ | 30s | 2026-04-24 14:31:07
    ☐ Visual | ✓ | 60s | 2026-04-24 14:32:07
    ☐ (all 8 gates documented)

  ☐ ## Security Summary
    ☐ Vulnerabilities: 0
    ☐ Snyk report link
    ☐ Last scan: {timestamp}

  ☐ ## Performance Metrics
    ☐ Test execution time: {total}
    ☐ Coverage: {percentage}
    ☐ Deployment time: {duration}

  ☐ Chart/table with historical trend (optional)

Demo Script (The Big Moment)

Phần 1: Intentional Bug & Auto Fail

bash
# 1. Create branch
git checkout -b demo/intentional-bug

# 2. Introduce bug (e.g., missing validation)
# Edit src/routes/tasks.js: remove email validation

# 3. Push commit
git add .
git commit -m "Demo: remove email validation"
git push origin demo/intentional-bug

# Observe:
 GitHub Actions CI starts
 Lint passes
 Unit tests FAIL (validation test fails)
 auto-issue.js runs: Auto Issue created on GitHub
 Show GitHub Issues tab New issue "[AUTO] CI Failed: Tests"

Phần 2: Fix & Verify All Gates

bash
# 4. Fix the bug
# Re-add email validation in src/routes/tasks.js

# 5. Push fix
git add .
git commit -m "Fix: restore email validation"
git push origin demo/intentional-bug

# Observe:
 CI runs again: All 8 gates PASS
 Lint
 Tests
 Security Scan
 Visual Regression
 Documentation Check
 Show: GitHub Actions tab All checks passed

Phần 3: Create PR & AI Review

bash
# 6. Create Pull Request (via GitHub UI)
# Assign to yourself

# Observe:
 AI Code Review bot comments on PR
 Review mentions: "Good validation added, consider adding unit test for edge case"
 Show comment on PR

Phần 4: Merge & Show Dashboard

bash
# 7. Merge PR (via GitHub UI)
git checkout main
git pull origin main

# 8. Open docs/evidence-report.md in browser
# Show:
 All test results: 50/50 passing
 All CI/CD gates: 8/8 passing
 Security: 0 vulnerabilities
 Performance: Total runtime 185s
 Timestamps: All gates executed successfully

# 9. Open docs/qa-lessons.md
# Show:
 Summary of 20 lessons learned
 Tools mastered: Vitest, Playwright, Snyk, GitHub Actions, SQLite
 Key achievements: Full QA pipeline, automated security, visual testing

Scoring Rubric (100 điểm)

DeliverableĐiểmTiêu chí
D1: Test Suite 5 Layers204 pts mỗi layer; all passing; ≥80% coverage
D2: CI/CD 8 Gates152 pts mỗi gate; all execute; fail appropriately
D3: Auto Issue Creation10Script works; issues created on failure; include details
D4: AI Code Review10Comments on PRs; suggests improvements; relevant feedback
D5: Visual Regression10Playwright tests; golden images; catches layout changes
D6: Security Gate10Snyk integrated; no vulns; custom security scan runs
D7: Knowledge Base103 files; evidence log updated; QA lessons documented
D8: Evidence Dashboard10Report generated; all gates documented; timestamps included
Demo Presentation5Live demo; bug→fail→fix→pass flow; shows all components
100

Chúc Mừng - Graduation Message

🎉 Chúc mừng các bạn đã hoàn thành khóa học QA/QC!

Các bạn không chỉ học lý thuyết — các bạn đã xây dựng một production-grade QA pipeline hoàn chỉnh. Đây là portfolio project thực sự, một proof-of-concept mà các bạn có thể chỉ cho nhà tuyển dụng.

Bạn giờ có:

✓ Full test suite (unit, integration, security, visual) ✓ Automated CI/CD pipeline (8 gates) ✓ Security scanning & compliance ✓ AI-powered code review ✓ Evidence dashboard & continuity docs

Giá trị Portfolio:

  • GitHub repo với full commit history
  • Demonstrable QA mindset & technical depth
  • Experience with industry-standard tools
  • Ability to mentor others on QA best practices

Tiếp Theo:

💬 Join our Discord community để kết nối với 200+ QA engineers, share projects, và support lẫn nhau trong sự nghiệp.

🚀 Next steps: Customize this pipeline cho portfolio projects của bạn, contribute to open-source QA initiatives, hoặc áp dụng vào công việc hiện tại.

Thank you for completing this course. You're now a certified QA engineer. 🏆

Powered by CodyMaster × VitePress