Skip to main content

End-to-End Testing

Citadel uses Playwright for comprehensive end-to-end (E2E) testing across the entire platform.

Note: Each individual application and package (e.g., iam, go-commons) runs its own suite of unit and integration tests. This document specifically covers the developer E2E script used to spin up the entire suite of services and run browser-based flows.

These tests verify the integration between the Shell App, Identity Provider (Keycloak), and various backend services.

Location & Structure​

All E2E tests are located in scripts/tests:

  • scripts/tests/smoke.spec.ts: Infrastructure health checks (probes every service).
  • scripts/tests/ui/: UI-driven flows (Playwright specs).
    • shell-login.spec.ts: Authentication and shell navigation.
    • onboarding-direct.spec.ts: Simple user signup.
    • high-touch-onboarding.spec.ts: Complex onboarding with KYC and payments.
    • onboarding-workflow.spec.ts: Async workflow polling.
    • invitation-flow.spec.ts: Tenant invitation and acceptance.

Prerequisites​

Before running the tests, ensure the Citadel platform is running:

# In the root directory
# Ensure you are in the Dev Container or have the environment set up
pnpm install
pnpm run setup:keycloak
pnpm exec playwright install --with-deps

Running Tests​

All interdependent starting, database resetting, and configuration of all apps for E2E testing is handled automatically by the single entry point script.

1. Run the Entire Suite​

To run the full suite (Smoke Tests + UI Tests) headlessly:

# Must be executed within the devcontainer
./scripts/e2e.sh

2. Run with Playwright UI​

To debug tests, inspect the DOM, or watch them execute step-by-step, run in UI mode:

./scripts/e2e.sh --ui

3. Direct Playwright Commands (Advanced)​

If you already have the services running (e.g., you used ./scripts/start-all.sh to spin up the local development environment without clearing databases), you can target specific tests without the setup/teardown overhead:

# Simple Smoke Test
npx playwright test scripts/tests/smoke.spec.ts

# Run a Specific UI Test
npx playwright test scripts/tests/ui/shell-login.spec.ts

Key Test Patterns​

Handling Authentication​

Most tests require an authenticated state. We use a shared helper performLogin (found in shell-login.spec.ts) that interacts with the Keycloak login page using default development credentials.

Testing Async Workflows​

For services like the Workflow Service, we test "polling steps" where the UI waits for a backend process (via Temporal) to complete before transitioning to the next state.

Example from onboarding-workflow.spec.ts:

await expect(page.getByText('We are setting up your account...')).toBeVisible();
await expect(page.getByRole('heading', { name: 'Completed' })).toBeVisible({ timeout: 10000 });

Mailpit Integration​

For flows involving Email OTP (like High-Touch Onboarding), we use the Mailpit API to programmatically fetch the OTP code from the virtual mailbox.

const otp = await fetchOtpFromMailpit(request, email);
await page.getByLabel('Verification Code').fill(otp);

Environment Variables​

The tests rely on certain environment variables, typically pre-configured in the Dev Container:

VariableDescription
E2E_DEFAULT_TENANT_IDThe ID of the default tenant used for registration flows.
MAILPIT_API_URLURL for the Mailpit API (default: http://mailpit:8025).
PLAYWRIGHT_BASE_URLThe URL of the Shell App (default: http://localhost:5000).