harb/INTEGRATION_TEST_STATUS.md

Integration Test Status

Overview

This document tracks the integration test coverage for the Harb/Kraiken stack, including both Playwright E2E tests and shell-based verification scripts.

Test Coverage Matrix

Test	Mint ETH	Swap	Stake	Method	Speed	Status
Playwright E2E	✅ UI	✅ UI	✅ UI (helper + click)	Browser automation	~4 min	✅ Implemented
verify-swap.sh	❌	✅ RPC	✅ RPC	Direct contract calls	~5 sec	✅ Working

Playwright E2E Tests

Location

tests/e2e/01-acquire-and-stake.spec.ts

Full User Journey

The E2E test validates the complete user flow from start to finish:

1. Mint ETH - Uses the cheats page UI to mint test ETH via Anvil
2. Swap KRK - Uses the cheats page UI to swap ETH for KRK tokens
3. Stake KRK - Uses the stake page UI with test helper to create a staking position

Test Helper Implementation

To avoid fragile UI selectors for complex form interactions, we use a test helper pattern:

Helper Location: web-app/src/components/StakeHolder.vue

// Exposed on window.__testHelpers (dev mode only)
window.__testHelpers = {
  fillStakeForm: async (params: { amount: number; taxRate: number }) => {
    // Validates amount against min/max constraints
    // Sets reactive form values
    // Waits for Vue reactivity
  }
}

TypeScript Declarations: web-app/env.d.ts

Usage in Tests:

await page.evaluate(async () => {
  await window.__testHelpers.fillStakeForm({
    amount: 100,
    taxRate: 5.0,
  });
});

const stakeButton = page.getByRole('button', { name: /Stake|Snatch and Stake/i });
await stakeButton.click();

Verification Strategy

• Swap Verification: Direct RPC call to check KRK token balance
• Stake Verification: GraphQL query to Ponder indexer for position data

Running E2E Tests

# From repository root
npm run test:e2e

The tests automatically:

• Start the full stack (Anvil, contracts, Ponder, web app, txnBot)
• Wait for all services to be ready
• Execute test scenarios
• Stop the stack on completion

verify-swap.sh Script

Location

tests/verify-swap.sh

Purpose

Fast contract-level verification that doesn't require browser automation.

Coverage

• ✅ Swap ETH for KRK via Uniswap router
• ✅ Create staking position via contract call
• ✅ Verify position created in contract storage

Running the Script

./tests/verify-swap.sh

Benefits of Dual Approach

Why Both Tests?

1. E2E Tests (Playwright)

   • Validates full UI flow
   • Catches frontend regressions
   • Tests user experience
   • Slower but comprehensive

2. Contract Tests (verify-swap.sh)

   • Fast feedback loop
   • Contract-level validation
   • Independent of UI changes
   • Useful for debugging

Test Helper Pattern

The window.__testHelpers pattern provides:

• Stability: Immune to CSS/selector changes
• Maintainability: Test intent is clear (fillStakeForm)
• Safety: Only available in dev mode
• Flexibility: Can validate inputs before setting form values

Future Enhancements

Potential additions to test coverage:

• Unstaking flow
• Position snatching scenarios
• Tax payment via UI
• Multiple position management
• Edge cases (insufficient balance, invalid tax rates)

Notes

• Test helpers should validate inputs to catch test bugs early
• Always verify test actions via independent data sources (RPC, GraphQL)
• Keep verify-swap.sh in sync with E2E test expectations
• Document any new helpers in this file