diff --git a/tests/e2e/usertest/helpers.ts b/tests/e2e/usertest/helpers.ts index 31e61b6..3c7b848 100644 --- a/tests/e2e/usertest/helpers.ts +++ b/tests/e2e/usertest/helpers.ts @@ -143,49 +143,31 @@ export async function connectWallet(page: Page): Promise { const navbarTitle = page.locator('.navbar-title').first(); await navbarTitle.waitFor({ state: 'visible', timeout: 60_000 }); - // Trigger resize event for mobile detection + // Trigger resize event for mobile detection; connectButton.isVisible below waits for layout await page.evaluate(() => { window.dispatchEvent(new Event('resize')); }); - // eslint-disable-next-line no-restricted-syntax -- waitForTimeout: no event source exists for Vue's useMobile composable to recalculate after a resize event in E2E tests. See AGENTS.md #Engineering Principles. - await page.waitForTimeout(500); - // Give time for wallet connectors to initialize - // eslint-disable-next-line no-restricted-syntax -- waitForTimeout: no event source exists for wallet connector initialization; connectors load asynchronously with no observable DOM event. See AGENTS.md #Engineering Principles. - await page.waitForTimeout(2_000); - // Try desktop Connect button first const connectButton = page.locator('.connect-button--disconnected').first(); if (await connectButton.isVisible({ timeout: 5_000 })) { console.log('[HELPER] Found desktop Connect button'); await connectButton.click(); - // eslint-disable-next-line no-restricted-syntax -- waitForTimeout: no event source exists for the wallet connector slideout panel animation to settle. See AGENTS.md #Engineering Principles. - await page.waitForTimeout(1_000); - - // Click the first wallet connector + // Wait for the connector panel to open — .connectors-element appearing is the observable event const injectedConnector = page.locator('.connectors-element').first(); - if (await injectedConnector.isVisible({ timeout: 5_000 })) { - console.log('[HELPER] Clicking wallet connector...'); - await injectedConnector.click(); - // eslint-disable-next-line no-restricted-syntax -- waitForTimeout: no event source exists for the injected wallet provider to complete connection handshake. See AGENTS.md #Engineering Principles. - await page.waitForTimeout(2_000); - } + await injectedConnector.waitFor({ state: 'visible', timeout: 10_000 }); + console.log('[HELPER] Clicking wallet connector...'); + await injectedConnector.click(); } else { // Try mobile fallback const mobileLoginIcon = page.locator('.navbar-end svg').first(); if (await mobileLoginIcon.isVisible({ timeout: 2_000 })) { console.log('[HELPER] Using mobile login icon'); await mobileLoginIcon.click(); - // eslint-disable-next-line no-restricted-syntax -- waitForTimeout: no event source exists for the wallet connector slideout panel animation to settle. See AGENTS.md #Engineering Principles. - await page.waitForTimeout(1_000); - const injectedConnector = page.locator('.connectors-element').first(); - if (await injectedConnector.isVisible({ timeout: 5_000 })) { - await injectedConnector.click(); - // eslint-disable-next-line no-restricted-syntax -- waitForTimeout: no event source exists for the injected wallet provider to complete connection handshake. See AGENTS.md #Engineering Principles. - await page.waitForTimeout(2_000); - } + await injectedConnector.waitFor({ state: 'visible', timeout: 10_000 }); + await injectedConnector.click(); } } @@ -520,10 +502,6 @@ export async function attemptStake( const baseUrl = page.url().split('#')[0]; await page.goto(`${baseUrl}stake`); - // Wait longer for page to load and stats to initialize - // eslint-disable-next-line no-restricted-syntax -- waitForTimeout: no event source exists for Ponder indexing lag and UI re-renders after on-chain transactions in E2E tests. See AGENTS.md #Engineering Principles. - await page.waitForTimeout(3_000); - try { // Wait for stake form to fully load const tokenAmountSlider = page.getByRole('slider', { name: 'Token Amount' }); @@ -549,15 +527,11 @@ export async function attemptStake( const stakeAmountInput = page.getByLabel('Staking Amount'); await stakeAmountInput.waitFor({ state: 'visible', timeout: 10_000 }); await stakeAmountInput.fill(amount); - // eslint-disable-next-line no-restricted-syntax -- waitForTimeout: no event source exists for debounced input handlers to settle after programmatic fill. See AGENTS.md #Engineering Principles. - await page.waitForTimeout(500); // Select tax rate const taxSelect = page.getByRole('combobox', { name: 'Tax' }); await taxSelect.selectOption({ value: taxRateIndex }); - // eslint-disable-next-line no-restricted-syntax -- waitForTimeout: no event source exists for debounced form state to update after select option change. See AGENTS.md #Engineering Principles. - await page.waitForTimeout(500); - + // Take screenshot before attempting to click const screenshotDir = join('test-results', 'usertest', personaName.toLowerCase().replace(/\s+/g, '-')); mkdirSync(screenshotDir, { recursive: true }); @@ -621,8 +595,6 @@ export async function attemptStake( // May complete instantly } - // eslint-disable-next-line no-restricted-syntax -- waitForTimeout: no event source exists for Ponder indexing lag and UI re-renders after on-chain transactions in E2E tests. See AGENTS.md #Engineering Principles. - await page.waitForTimeout(3_000); recordAction(`Stake ${amount} KRK at ${taxRateIndex}% tax`, true, undefined, report); console.log(`[${personaName}] Stake successful`); } catch (error: any) {