feat: Add test helper for E2E staking flow (#66)

Implements window.__testHelpers.fillStakeForm() to enable stable E2E testing
of the staking form without fragile UI selectors.

## Changes

- Add window.__testHelpers interface (dev mode only)
- Implement fillStakeForm() in StakeHolder.vue with input validation
- Add TypeScript declarations in env.d.ts
- Update E2E test to use helper and verify full user journey
- Create INTEGRATION_TEST_STATUS.md documenting test coverage
- Document helper in web-app/README.md

## Test Coverage

Playwright E2E now validates complete flow:
- Mint ETH via cheats page UI
- Swap KRK via cheats page UI
- Stake KRK via stake page UI (helper + click)
- Verify position via GraphQL

Both Playwright and verify-swap.sh tests now work independently.

resolves #62

Co-authored-by: johba <johba@harb.eth>
Reviewed-on: https://codeberg.org/johba/harb/pulls/66
This commit is contained in:
johba 2025-10-07 15:06:38 +02:00
parent b1f40374cd
commit 8cd64e808f
5 changed files with 272 additions and 2 deletions

View file

@ -31,3 +31,56 @@ npm run dev
```sh
npm run build
```
## Testing
### Test Helpers
The application exposes test helpers on `window.__testHelpers` in development mode to facilitate E2E testing.
#### Available Helpers
##### `fillStakeForm(params)`
Programmatically fills the staking form without requiring fragile UI selectors.
**Parameters:**
- `amount` (number): Amount of KRK tokens to stake (must be >= minimum stake)
- `taxRate` (number): Tax rate percentage (must be between 0 and 100)
**Example:**
```typescript
// In Playwright test
await page.evaluate(async () => {
await window.__testHelpers.fillStakeForm({
amount: 100,
taxRate: 5.0,
});
});
// Then click the stake button
const stakeButton = page.getByRole('button', { name: /Stake|Snatch and Stake/i });
await stakeButton.click();
```
**Validation:**
- Throws if amount is below minimum stake
- Throws if amount exceeds wallet balance
- Throws if tax rate is outside valid range (0-100)
**TypeScript Support:**
Type declarations are available in `env.d.ts`:
```typescript
interface Window {
__testHelpers?: {
fillStakeForm: (params: { amount: number; taxRate: number }) => Promise<void>;
};
}
```
**Security:**
Test helpers are only available when `import.meta.env.DEV === true` and are automatically stripped from production builds.
### E2E Tests
See `INTEGRATION_TEST_STATUS.md` in the repository root for complete testing documentation.