#!/usr/bin/env node import { chromium } from '@playwright/test'; import { Wallet } from 'ethers'; const ACCOUNT_PRIVATE_KEY = '0xac0974bec39a17e36ba4a6b4d238ff944bacb478cbed5efcae784d7bf4f2ff80'; const ACCOUNT_ADDRESS = new Wallet(ACCOUNT_PRIVATE_KEY).address.toLowerCase(); const STACK_RPC_URL = 'http://127.0.0.1:8545'; const STACK_WEBAPP_URL = 'http://localhost:8081'; const chainId = 31337; const chainIdHex = `0x${chainId.toString(16)}`; async function takeScreenshot() { const browser = await chromium.launch({ headless: true }); const context = await browser.newContext(); // Set auth flag await context.addInitScript(() => { window.localStorage.setItem('authentificated', 'true'); }); // Inject wallet provider await context.addInitScript( ({ account, chainIdHex: cidHex, chainId: cid, rpcEndpoint }) => { const listeners = new Map(); let rpcRequestId = 0; let connected = false; const emit = (event, payload) => { const handlers = listeners.get(event); if (!handlers) return; for (const handler of Array.from(handlers)) { try { handler(payload); } catch (error) { console.error(`[wallet-provider] listener for ${event} failed`, error); } } }; const sendRpc = async (method, params) => { rpcRequestId += 1; const response = await fetch(rpcEndpoint, { method: 'POST', headers: { 'content-type': 'application/json' }, body: JSON.stringify({ jsonrpc: '2.0', id: rpcRequestId, method, params }), }); if (!response.ok) { throw new Error(`RPC call to ${method} failed with status ${response.status}`); } const payload = await response.json(); if (payload?.error) { throw new Error(payload.error?.message ?? 'RPC error'); } return payload.result; }; const provider = { isMetaMask: true, isPlaywrightWallet: true, isConnected: () => connected, selectedAddress: account, chainId: cidHex, networkVersion: String(cid), request: async ({ method, params = [] }) => { const args = Array.isArray(params) ? params.slice() : []; switch (method) { case 'eth_requestAccounts': connected = true; provider.selectedAddress = account; provider.chainId = cidHex; provider.networkVersion = String(cid); emit('connect', { chainId: cidHex }); emit('chainChanged', cidHex); emit('accountsChanged', [account]); return [account]; case 'eth_accounts': return [account]; case 'eth_chainId': return cidHex; case 'net_version': return String(cid); case 'wallet_switchEthereumChain': return null; case 'wallet_addEthereumChain': return null; case 'eth_sendTransaction': { const [tx = {}] = args; const enrichedTx = { ...tx, from: account }; return sendRpc(method, [enrichedTx]); } default: return sendRpc(method, args); } }, on: (event, listener) => { const handlers = listeners.get(event) ?? new Set(); handlers.add(listener); listeners.set(event, handlers); if (event === 'connect' && connected) { listener({ chainId: cidHex }); } return provider; }, removeListener: (event, listener) => { const handlers = listeners.get(event); if (handlers) { handlers.delete(listener); } return provider; }, enable: () => provider.request({ method: 'eth_requestAccounts' }), }; Object.defineProperty(window, 'ethereum', { configurable: true, enumerable: true, value: provider, writable: false, }); provider.providers = [provider]; window.dispatchEvent(new Event('ethereum#initialized')); }, { account: ACCOUNT_ADDRESS, chainIdHex, chainId, rpcEndpoint: STACK_RPC_URL, } ); const page = await context.newPage(); console.log('Navigating to app...'); await page.goto(`${STACK_WEBAPP_URL}/app/`, { waitUntil: 'domcontentloaded' }); // Wait for wallet to initialize await page.waitForTimeout(3000); // Check if wallet is visible (connected) try { const walletDisplay = page.getByText(/0xf39F/i).first(); await walletDisplay.waitFor({ timeout: 10000 }); console.log('Wallet connected!'); } catch (e) { console.log('Wallet connection not detected, continuing anyway...'); } console.log('Navigating to stake page...'); await page.goto(`${STACK_WEBAPP_URL}/app/#/stake`, { waitUntil: 'networkidle' }); // Wait for positions to load await page.waitForTimeout(5000); console.log('Taking screenshot...'); await page.screenshot({ path: 'test-results/stake-page-after-test.png', fullPage: true }); console.log('Screenshot saved to test-results/stake-page-after-test.png'); await browser.close(); } takeScreenshot().catch(console.error);