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:
parent
b1f40374cd
commit
8cd64e808f
5 changed files with 272 additions and 2 deletions
|
|
@ -145,8 +145,56 @@ test.describe('Acquire & Stake', () => {
|
|||
|
||||
expect(balance).toBeGreaterThan(0n);
|
||||
console.log('[TEST] ✅ Swap successful! KRK balance > 0');
|
||||
console.log('[TEST] ✅ E2E test complete: Swap verified through UI');
|
||||
console.log('[TEST] Note: Staking is verified separately via verify-swap.sh script');
|
||||
|
||||
// Now test staking via UI
|
||||
console.log('[TEST] Navigating to stake page...');
|
||||
await page.goto(`${STACK_WEBAPP_URL}/app/#/stake`);
|
||||
await page.waitForTimeout(2_000);
|
||||
|
||||
// Wait for the stake form to be initialized
|
||||
console.log('[TEST] Waiting for stake form to load...');
|
||||
await page.waitForSelector('text=Token Amount', { timeout: 15_000 });
|
||||
|
||||
// Use the test helper to fill the stake form
|
||||
console.log('[TEST] Filling stake form via test helper...');
|
||||
await page.evaluate(async () => {
|
||||
if (!window.__testHelpers) {
|
||||
throw new Error('Test helpers not available');
|
||||
}
|
||||
await window.__testHelpers.fillStakeForm({
|
||||
amount: 100, // Stake 100 KRK
|
||||
taxRate: 5.0, // 5% tax rate
|
||||
});
|
||||
});
|
||||
|
||||
console.log('[TEST] Clicking stake button...');
|
||||
const stakeButton = page.getByRole('button', { name: /Stake|Snatch and Stake/i });
|
||||
await expect(stakeButton).toBeVisible({ timeout: 5_000 });
|
||||
await stakeButton.click();
|
||||
|
||||
// Wait for transaction to process
|
||||
console.log('[TEST] Waiting for stake transaction...');
|
||||
try {
|
||||
await page.getByRole('button', { name: /Sign Transaction|Waiting/i }).waitFor({ state: 'visible', timeout: 5_000 });
|
||||
console.log('[TEST] Transaction initiated, waiting for completion...');
|
||||
await page.getByRole('button', { name: /Stake|Snatch and Stake/i }).waitFor({ state: 'visible', timeout: 60_000 });
|
||||
console.log('[TEST] Stake transaction completed!');
|
||||
} catch (e) {
|
||||
console.log('[TEST] Transaction may have completed instantly');
|
||||
}
|
||||
await page.waitForTimeout(3_000);
|
||||
|
||||
// Verify staking position via GraphQL
|
||||
console.log('[TEST] Verifying staking position via GraphQL...');
|
||||
const positions = await fetchPositions(request, ACCOUNT_ADDRESS);
|
||||
console.log(`[TEST] Found ${positions.length} position(s)`);
|
||||
|
||||
expect(positions.length).toBeGreaterThan(0);
|
||||
const activePositions = positions.filter(p => p.status === 'OPEN');
|
||||
expect(activePositions.length).toBeGreaterThan(0);
|
||||
|
||||
console.log(`[TEST] ✅ Staking successful! Created ${activePositions.length} active position(s)`);
|
||||
console.log('[TEST] ✅ E2E test complete: Full journey verified (Mint → Swap → Stake)');
|
||||
} finally {
|
||||
await context.close();
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue