How to Set Up Automated Website Testing on Your Hosting

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

// This runs every 10 minutes from 6 global locations
test('Homepage loads and key elements render', async ({ page }) => {
  await page.goto('https://yoursite.com');
  
  // Verify page loads successfully
  await expect(page).toHaveTitle(/Your Site Name/);
  
  // Verify key content renders (not just HTTP 200)
  await expect(page.locator('nav')).toBeVisible();
  await expect(page.locator('footer')).toBeVisible();
  await expect(page.locator('h1')).toBeVisible();
  
  // Verify critical API endpoints
  const response = await page.request.get('https://api.yoursite.com/health');
  expect(response.status()).toBe(200);
});

test('Login flow works', async ({ page }) => {
  await page.goto('https://yoursite.com/login');
  await page.fill('[name="email"]', 'test@yoursite.com');
  await page.fill('[name="password"]', process.env.TEST_PASSWORD!);
  await page.click('button[type="submit"]');
  
  // Verify successful login
  await expect(page.locator('[data-testid="dashboard"]')).toBeVisible();
});

name: Lighthouse CI
on: [push]

jobs:
  lighthouse:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: 20
      - run: npm ci && npm run build
      
      - name: Run Lighthouse CI
        uses: treosh/lighthouse-ci-action@v12
        with:
          urls: |
            http://localhost:3000/
            http://localhost:3000/blog
            http://localhost:3000/contact
          budgetPath: ./lighthouse-budget.json
          uploadArtifacts: true

[{
  "path": "/*",
  "timings": [
    { "metric": "first-contentful-paint", "budget": 1500 },
    { "metric": "interactive", "budget": 3000 },
    { "metric": "largest-contentful-paint", "budget": 2500 }
  ],
  "resourceSizes": [
    { "resourceType": "total", "budget": 500 },
    { "resourceType": "script", "budget": 150 },
    { "resourceType": "image", "budget": 200 }
  ]
}]

import http from 'k6/http';
import { check, sleep } from 'k6';

export const options = {
  stages: [
    { duration: '1m', target: 50 },   // Ramp to 50 users
    { duration: '3m', target: 50 },   // Stay at 50 for 3 min
    { duration: '1m', target: 200 },  // Spike to 200 users
    { duration: '2m', target: 200 },  // Stay at 200
    { duration: '1m', target: 0 },    // Ramp down
  ],
  thresholds: {
    http_req_duration: ['p(95)<500'],  // 95% under 500ms
    http_req_failed: ['rate<0.01'],    // <1% error rate
  },
};

export default function () {
  const res = http.get('https://staging.yoursite.com/');
  check(res, {
    'status is 200': (r) => r.status === 200,
    'response time < 500ms': (r) => r.timings.duration < 500,
  });
  sleep(Math.random() * 3 + 1); // Random 1-4s think time
}

name: Test & Deploy

on:
  push:
    branches: [main]
  pull_request:
    branches: [main]

jobs:
  # Stage 1: Fast checks (< 2 min)
  lint-and-unit:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with: { node-version: 20, cache: 'npm' }
      - run: npm ci
      - run: npm run lint
      - run: npm run test -- --coverage
      - run: npm audit --audit-level=moderate

  # Stage 2: Build + Integration (< 5 min)
  build-and-integration:
    needs: lint-and-unit
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with: { node-version: 20, cache: 'npm' }
      - run: npm ci
      - run: npm run build
      - uses: actions/upload-artifact@v4
        with: { name: build, path: dist/ }

  # Stage 3: E2E + Visual (< 10 min)
  e2e-tests:
    needs: build-and-integration
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with: { node-version: 20, cache: 'npm' }
      - run: npm ci
      - run: npx playwright install --with-deps
      - run: npm run build
      - run: npx playwright test

  # Stage 4: Deploy (only on main, after all tests)
  deploy:
    if: github.ref == 'refs/heads/main'
    needs: [e2e-tests]
    runs-on: ubuntu-latest
    steps:
      - uses: actions/download-artifact@v4
        with: { name: build, path: dist/ }
      - name: Deploy to production
        run: rsync -avzr dist/ deploy@server:/var/www/site/