Skip to main content

​
Testing Overview

HAI Build Code Generator uses a comprehensive testing strategy that includes unit tests, integration tests, and end-to-end tests to ensure code quality and reliability.

​
Running Tests

​
All Tests

Run all tests (unit and integration): 
npm run test
This command will:
  1. Compile the extension
  2. Compile test files
  3. Run unit tests
  4. Run integration tests

​
Unit Tests Only

Run only unit tests: 
npm run test:unit

​
Integration Tests Only

Run only integration tests: 
npm run test:integration

​
Code Coverage

Generate test coverage reports: 
npm run test:coverage
Coverage reports will be generated in the coverage/ directory.

​
End-to-End (E2E) Testing

HAI includes comprehensive E2E tests using Playwright that simulate real user interactions with the extension in VS Code.

​
Running E2E Tests

Build and run all E2E tests:
npm run test:e2e
This will:
  • Install Playwright browsers
  • Build the extension as a .vsix package
  • Run all E2E tests

​
E2E Test Structure

E2E tests are located in src/test/e2e/ and follow this structure: 
src/test/e2e/
├── auth.test.ts          # Authentication tests
├── chat.test.ts          # Chat interface tests
├── diff.test.ts          # Diff viewer tests
├── editor.test.ts        # Editor integration tests
├── fixtures/             # Test workspace fixtures
│   ├── workspace/        # Single-root workspace
│   └── workspace_2/      # Multi-root workspace
└── utils/                # Test utilities

​
Writing E2E Tests

1

Use the e2e fixture

For single-root workspace tests:
import { test } from './fixtures/e2e'

test('should perform action', async ({ page, vscode }) => {
  // Test code
})
2

Use e2eMultiRoot for multi-root workspaces

For multi-root workspace tests:
import { test } from './fixtures/e2eMultiRoot'

test('should work with multi-root', async ({ page, vscode }) => {
  // Test code
})
3

Follow existing patterns

Reference these files for examples:
  • auth.test.ts - Authentication flows
  • chat.test.ts - Chat interactions
  • diff.test.ts - Diff operations
  • editor.test.ts - Editor commands
4

Consult the E2E README

See src/test/e2e/README.md for detailed documentation on:
  • Available fixtures
  • Helper utilities
  • Best practices
  • Debugging tips

​
E2E Test Environment

The E2E test environment includes:
  • Automated VS Code setup with HAI extension loaded
  • Mock API server for backend testing
  • Temporary workspaces with test fixtures
  • Video recording for failed tests
  • Screenshot capture on failures

​
Webview Tests

Test the React-based webview UI: 
npm run test:webview

​
Writing Tests

​
Unit Tests

Unit tests should:
  • Test individual functions and components in isolation
  • Use mocks for external dependencies
  • Be fast and deterministic
  • Follow the Arrange-Act-Assert pattern
Example: 
import { expect } from 'chai'
import { myFunction } from '../myFunction'

describe('myFunction', () => {
  it('should return expected value', () => {
    // Arrange
    const input = 'test'
    
    // Act
    const result = myFunction(input)
    
    // Assert
    expect(result).to.equal('expected')
  })
})

​
Integration Tests

Integration tests should:
  • Test component interactions
  • Use the VS Code test environment
  • Verify file operations and API calls
  • Test against real (or mocked) VS Code APIs

​
E2E Tests Best Practices

Use Playwright’s auto-waiting instead of fixed timeouts:
// Good
await page.getByRole('button', { name: 'Submit' }).click()

// Avoid
await page.waitForTimeout(1000)
await page.click('button')
Prefer accessible selectors over CSS:
// Good
await page.getByRole('button', { name: 'Submit' })
await page.getByLabel('Email')

// Avoid
await page.locator('.submit-btn')
await page.locator('#email-input')
Each test should be able to run in isolation:
test.beforeEach(async ({ page }) => {
  // Set up clean state for each test
})
Test names should clearly describe what is being tested:
// Good
test('should display error message when API key is invalid')

// Avoid
test('test API key')

​
Test Requirements

Before submitting a PR:
  1. Add tests for new features
  2. Update existing tests if your changes affect them
  3. Ensure all tests pass: npm run test
  4. Include both unit tests and integration tests where appropriate
  5. For UI changes, consider adding E2E tests

​
Continuous Integration

All tests run automatically in CI when you:
  • Push commits to your branch
  • Create or update a pull request
  • Merge to the main branch
CI checks include:
  • Type checking (npm run check-types)
  • Linting (npm run lint)
  • Code formatting (npm run format)
  • Unit tests
  • Integration tests
  • E2E tests (on main branch)

​
Debugging Tests

​
Debug Unit/Integration Tests

  1. Set breakpoints in your test files
  2. Open the Run and Debug panel in VS Code
  3. Select the appropriate debug configuration
  4. Press F5 to start debugging

​
Debug E2E Tests

Use Playwright’s debug mode: 
npm run test:e2e -- --debug
This opens the Playwright Inspector where you can:
  • Step through test execution
  • Inspect the DOM
  • View network requests
  • Generate new test code
  • Record user interactions

​
Mock API Server

For E2E tests, a mock API server is available to simulate backend responses without making real API calls. To run the standalone test server: 
npm run test:sca-server

​
Next Steps

Contributing Guidelines

Review the full contributing guidelines

Code of Conduct

Read our code of conduct

Build docs developers (and LLMs) love

Get started for freeTalk to us