fix: remove waitForTimeout — use waitFor on observable DOM state

Replace fixed sleeps with proper observable waits:
- wagmi settle: waitFor on '.connect-button--disconnected, .connect-button--connected'
  which auto-retries until wagmi renders a terminal state
- panel animation: connector.waitFor already handles this

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
johba 2026-03-25 12:03:07 +00:00
parent 77f75f6ef2
commit 408feb67bf

View file

@ -301,26 +301,20 @@ test.describe('Conversion Funnel: Landing → Swap → Stake', () => {
const navbarTitle = page.locator('.navbar-title').first(); const navbarTitle = page.locator('.navbar-title').first();
await navbarTitle.waitFor({ state: 'visible', timeout: 30_000 }); await navbarTitle.waitFor({ state: 'visible', timeout: 30_000 });
await page.evaluate(() => window.dispatchEvent(new Event('resize'))); await page.evaluate(() => window.dispatchEvent(new Event('resize')));
// eslint-disable-next-line no-restricted-syntax -- waitForTimeout: wagmi needs time to settle into disconnected/connected state after provider injection; no observable DOM event signals readiness. See AGENTS.md #Engineering Principles.
await page.waitForTimeout(2_000);
// Check if wallet already connected (wagmi may auto-reconnect from storage) // Wait for wagmi to settle — either connected (auto-reconnect) or disconnected
const alreadyConnected = page.locator('.connect-button--connected').first(); const anyConnectBtn = page.locator('.connect-button--disconnected, .connect-button--connected').first();
if (await alreadyConnected.isVisible({ timeout: 1_000 }).catch(() => false)) { await anyConnectBtn.waitFor({ state: 'visible', timeout: 15_000 });
if (await page.locator('.connect-button--connected').first().isVisible()) {
console.log('[DEEPLINK] Wallet already connected (auto-reconnect)'); console.log('[DEEPLINK] Wallet already connected (auto-reconnect)');
} else { } else {
// Wait for wagmi to settle into disconnected state and render the connect button
const connectBtn = page.locator('.connect-button--disconnected').first();
await connectBtn.waitFor({ state: 'visible', timeout: 15_000 });
console.log('[DEEPLINK] Found desktop Connect button, clicking...'); console.log('[DEEPLINK] Found desktop Connect button, clicking...');
await connectBtn.click(); await page.locator('.connect-button--disconnected').first().click();
// eslint-disable-next-line no-restricted-syntax -- waitForTimeout: connector panel animation has no completion event. See AGENTS.md #Engineering Principles.
await page.waitForTimeout(1_000);
const connector = page.locator('.connectors-element').first(); const connector = page.locator('.connectors-element').first();
await connector.waitFor({ state: 'visible', timeout: 10_000 }); await connector.waitFor({ state: 'visible', timeout: 10_000 });
console.log('[DEEPLINK] Clicking wallet connector...'); console.log('[DEEPLINK] Clicking wallet connector...');
await connector.click(); await connector.click();
// Wait for wallet to connect
await page.getByText(/0x[a-fA-F0-9]{4}/i).first().waitFor({ state: 'visible', timeout: 15_000 }); await page.getByText(/0x[a-fA-F0-9]{4}/i).first().waitFor({ state: 'visible', timeout: 15_000 });
console.log('[DEEPLINK] Wallet connected'); console.log('[DEEPLINK] Wallet connected');
} }