Files
websitedev/proto/TESTING.md
T
Do Siki b0df8dd182 feat: enhance README and TODO documentation, implement mobile menu functionality in Header component
- Updated README.md with project details, quick start instructions, and tech stack.
- Expanded TODO.md to reflect current project status and backlog items, including Linear ticket synchronization.
- Added mobile menu toggle functionality in Header component with corresponding tests for user interactions.
- Configured Next.js for Docker deployment and optimized build settings.
2025-09-05 17:28:52 +02:00

7.1 KiB

Testing Guide

This document outlines the comprehensive testing strategy and available test commands for the mozdIT website project.

✅ Successfully Implemented Test Suite

A tesztkörnyezetek sikeresen frissítve lettek! Most a valós Docker környezetben futó komponensekre és API-kra fókuszálnak, mock elemek helyett.

Test Types

1. Unit Tests

Unit tests focus on individual components and functions in isolation using mocks and stubs. Runs in jsdom environment.

Run unit tests:

npm run test:unit
# or simply
npm test

Watch mode:

npm run test:watch

Coverage report:

npm run test:coverage

What unit tests cover:

  • Component rendering and behavior
  • Business logic functions
  • Input validation logic
  • Utility functions
  • Isolated API route logic

2. Browser Integration Tests

Browser-based tests that run in jsdom environment with mocked API responses. Perfect for testing React components with API interactions.

Run browser integration tests:

npm run test:browser

What browser integration tests cover:

  • Component behavior with mocked API calls
  • Form validation in browser environment
  • localStorage/sessionStorage functionality
  • DOM manipulation and user interactions
  • Client-side routing behavior

3. Node.js Integration Tests

Integration tests that run in Node.js environment and make real HTTP calls to the Docker services.

Prerequisites:

  • Docker and Docker Compose installed
  • Docker development environment running

Start Docker environment:

npm run docker:dev

Run Node.js integration tests:

npm run test:integration

What Node.js integration tests cover:

  • Real HTTP calls to API endpoints
  • MongoDB connection and data verification
  • Service health checks (Grafana, Loki, Mongo Express)
  • Rate limiting and spam detection with real services
  • Database initialization and configuration

4. End-to-End (E2E) Tests

E2E tests verify complete user workflows in the Docker environment. Runs in Node.js environment.

Run E2E tests:

npm run test:e2e

What E2E tests cover:

  • Full page navigation flow
  • Complete form submission workflows
  • SEO and meta tags verification
  • Performance and caching headers
  • Cross-service integration

5. Docker Environment Tests

Combined integration and E2E tests for the complete Docker stack.

Run all Docker tests:

npm run test:docker

6. All Tests

Run all test suites in sequence.

Run all tests:

npm run test:all

This runs: Unit → Browser Integration → Docker Integration → E2E tests.

Test Environment Setup

For Unit Tests

Unit tests run in the standard Jest environment with jsdom and don't require external services.

For Integration/E2E Tests

  1. Start the Docker environment:

    docker-compose -f docker-compose.dev.yml up -d
    
  2. Wait for services to be ready (usually 30-60 seconds)

  3. Verify services are running:

    docker-compose -f docker-compose.dev.yml ps
    
  4. Run tests:

    npm run test:integration
    npm run test:e2e
    
  5. Clean up when done:

    docker-compose -f docker-compose.dev.yml down
    

Test Configuration

Environment Variables

  • INTEGRATION_TESTS=1 - Enables integration tests
  • E2E_TESTS=1 - Enables E2E tests
  • NODE_ENV=test - Standard test environment (default for Jest)

Docker Services URLs

When running integration/E2E tests, the following services are expected:

Writing Tests

Unit Test Example

import { render, screen } from '@testing-library/react'
import '@testing-library/jest-dom'
import MyComponent from './MyComponent'

describe('MyComponent', () => {
  it('should render correctly', () => {
    render(<MyComponent />)
    expect(screen.getByText('Expected Text')).toBeInTheDocument()
  })
})

Integration Test Example

describe('API Integration', () => {
  it('should connect to MongoDB', async () => {
    if (!process.env.INTEGRATION_TESTS) return

    const response = await fetch('http://localhost:3000/api/health')
    expect(response.status).toBe(200)
  })
})

E2E Test Example

describe('User Flow', () => {
  it('should complete contact form submission', async () => {
    if (!process.env.E2E_TESTS) return

    const response = await fetch('http://localhost:3000/api/contact', {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify(validContactData)
    })
    
    expect(response.status).toBe(200)
  })
})

Test Structure

proto/src/
├── __tests__/              # Integration and E2E tests
│   ├── integration.test.ts # Service integration tests
│   └── e2e-docker.test.ts  # End-to-end workflow tests
├── components/             # Component tests
│   ├── Header.test.tsx
│   └── Footer.test.tsx
├── app/api/               # API route tests
│   ├── health/route.test.ts
│   └── contact/route.test.ts
└── lib/                   # Library/utility tests
    ├── mongodb.test.ts
    └── logger.test.ts

CI/CD Integration

GitHub Actions Example

name: Tests
on: [push, pull_request]

jobs:
  unit-tests:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3
      - uses: actions/setup-node@v3
      - run: npm ci
      - run: npm run test:unit

  integration-tests:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3
      - run: docker-compose -f docker-compose.dev.yml up -d
      - run: sleep 60  # Wait for services
      - run: npm ci
      - run: npm run test:docker
      - run: docker-compose -f docker-compose.dev.yml down

Debugging Tests

View test output with verbose logging:

npm test -- --verbose

Run specific test file:

npm test -- Header.test.tsx

Debug integration tests:

# Check Docker services
docker-compose -f docker-compose.dev.yml ps
docker-compose -f docker-compose.dev.yml logs app

# Test individual endpoints
curl http://localhost:3000/api/health
curl http://localhost:8081  # Mongo Express

Common Issues

  1. Integration tests failing: Ensure Docker environment is running and all services are healthy
  2. Port conflicts: Check if ports 3000, 3001, 8081, 3100, 27017 are available
  3. MongoDB connection issues: Verify MongoDB container is running and initialized
  4. Rate limiting in tests: Tests may trigger rate limits; use different test data or wait between runs

Performance Considerations

  • Unit tests: ~5-10 seconds
  • Integration tests: ~30-60 seconds (includes service startup time)
  • E2E tests: ~60-120 seconds (includes full workflow testing)
  • Full test suite: ~2-3 minutes

For faster development cycles, run unit tests frequently and integration/E2E tests before commits or in CI/CD.