@deeeed/metamask-harness 0.38.1 → 0.40.0

package/library/actions/extension/perps/read_funds_confirmation.mjs

@@ -1,12 +1,36 @@
 import { runAdapter, withExtensionPage } from '../platform/cdp.mjs';
 
-runAdapter(async (input) => withExtensionPage(input, async (page) => {
-  const mode = String(input.node?.mode ?? '').trim().toLowerCase();
-  if (mode !== 'deposit' && mode !== 'withdraw') {
-    throw new Error('metamask.perps.read_funds_confirmation mode must be deposit or withdraw.');
+function expectedList(value, name) {
+  if (value == null) return undefined;
+  if (!Array.isArray(value)) {
+    throw new Error(`metamask.perps.read_funds_confirmation ${name} must be an array.`);
   }
+  return value.map((entry) => String(entry).trim()).filter(Boolean);
+}
+
+function matchesExpectedObservation(observed, node, expectedControls, requiredText) {
+  return (
+    (typeof node.expected_submit_enabled !== 'boolean' || observed.submitEnabled === node.expected_submit_enabled) &&
+    (node.expected_submit_label == null || observed.submitLabel === String(node.expected_submit_label)) &&
+    (node.expected_amount == null || observed.amount === String(node.expected_amount)) &&
+    (node.expected_amount_symbol == null || observed.amountSymbol === String(node.expected_amount_symbol)) &&
+    (typeof node.expected_pay_token_amount_visible !== 'boolean' || observed.payTokenAmountVisible === node.expected_pay_token_amount_visible) &&
+    (node.expected_pay_token == null || observed.payToken === String(node.expected_pay_token)) &&
+    (node.expected_receive_token == null || observed.receiveToken === String(node.expected_receive_token)) &&
+    (node.expected_visible_network == null || observed.visibleNetwork === String(node.expected_visible_network)) &&
+    (!expectedControls || (
+      expectedControls.length === observed.percentageControls.length &&
+      expectedControls.every((control) => observed.percentageControls.includes(control))
+    )) &&
+    requiredText.every((text) => observed.bodyText.includes(text))
+  );
+}
+
+export async function readFundsConfirmation(page, node, mode, timeoutMs = 30_000) {
   const expectedTitle = mode === 'deposit' ? 'Deposit funds to Perps' : 'Withdraw';
-  const deadline = Date.now() + 30_000;
+  const expectedControls = expectedList(node.expected_percentage_controls, 'expected_percentage_controls');
+  const requiredText = expectedList(node.require_visible_text, 'require_visible_text') ?? [];
+  const deadline = Date.now() + timeoutMs;
   let observed;
   while (Date.now() <= deadline) {
     observed = await page.evaluate(`(() => {
@@ -14,17 +38,50 @@ runAdapter(async (input) => withExtensionPage(input, async (page) => {
         .replace(/\\s+/gu, ' ')
         .trim()
         .slice(0, 500);
+      const readSymbol = () => {
+        const element = document.querySelector('[data-testid="pay-with-symbol"]');
+        const textNode = [...(element?.childNodes || [])]
+          .find((child) => child.nodeType === 3 && String(child.textContent || '').trim());
+        return String(textNode?.textContent || element?.innerText || '').replace(/\\s+/gu, ' ').trim();
+      };
       const amount = document.querySelector('[data-testid="custom-amount-input"]');
       const submit = document.querySelector('[data-testid="confirm-footer-button"]');
+      const headerBack = document.querySelector('[data-testid="wallet-initiated-header-back-button"]');
+      const payWithPill = document.querySelector('[data-testid="pay-with-pill"]');
+      const visible = (element) => {
+        if (!element) return false;
+        const style = getComputedStyle(element);
+        const rect = element.getBoundingClientRect();
+        return style.display !== 'none' && style.visibility !== 'hidden' && rect.width > 0 && rect.height > 0;
+      };
+      const bodyText = String(document.body?.innerText || '').replace(/\\s+/gu, ' ').trim().slice(0, 10_000);
+      const iconNames = [...(payWithPill?.querySelectorAll('img[alt$=" logo"]') || [])]
+        .filter(visible)
+        .map((element) => String(element.getAttribute('alt') || '').replace(/ logo$/u, '').trim())
+        .filter(Boolean);
+      const fundsRow = read('pay-with-row');
+      const fundsToken = readSymbol();
       return {
         route: String(location.hash),
-        title: String(document.body?.innerText || '').trim().split(/\\n+/u)[0] || '',
+        title: String(headerBack?.parentElement?.innerText || '').replace(/\\s+/gu, ' ').trim() ||
+          String(document.body?.innerText || '').trim().split(/\\n+/u)[0] || '',
+        bodyText,
         amount: amount && 'value' in amount ? String(amount.value) : null,
+        amountSymbol: read('custom-amount-symbol'),
         availableBalance: read('perps-withdraw-balance-value'),
         transactionFee: read('transaction-fee-value'),
         estimatedTime: read('bridge-time-value'),
         receive: read('receive-value'),
-        payToken: String(document.body?.innerText || '').match(/Pay with\\s+([^\\n]+)/u)?.[1] || '',
+        payToken: /^Pay with(?:\\s|$)/u.test(fundsRow) ? fundsToken : '',
+        receiveToken: /^Receive(?:\\s|$)/u.test(fundsRow) ? fundsToken : '',
+        visibleNetwork: read('pay-with-network'),
+        selectedIconNames: iconNames,
+        payTokenAmountVisible: visible(document.querySelector('[data-testid="pay-token-amount"]')),
+        percentageControls: [...document.querySelectorAll('[data-testid^="percentage-button-"]')]
+          .filter(visible)
+          .map((element) => String(element.getAttribute('data-testid') || ''))
+          .slice(0, 10),
+        loadingVisible: [...document.querySelectorAll('[data-testid$="-skeleton"]')].some(visible),
         submitLabel: String(submit?.innerText || '').trim(),
         submitEnabled: Boolean(submit && !submit.disabled && submit.getAttribute('aria-disabled') !== 'true'),
         layout: {
@@ -45,25 +102,81 @@ runAdapter(async (input) => withExtensionPage(input, async (page) => {
         },
       };
     })()`);
-    if (observed.title === expectedTitle && observed.amount !== null) break;
+    const previewReady = node.require_preview_fields !== true || (
+      observed.transactionFee && observed.estimatedTime && observed.receive &&
+      (observed.payToken || observed.receiveToken) && !observed.loadingVisible
+    );
+    if (
+      observed.title === expectedTitle &&
+      observed.amount !== null &&
+      previewReady &&
+      matchesExpectedObservation(observed, node, expectedControls, requiredText)
+    ) break;
     await new Promise((resolve) => setTimeout(resolve, 100));
   }
   if (observed?.title !== expectedTitle || observed?.amount === null) {
     throw new Error(`Perps ${mode} confirmation did not finish loading.`);
   }
-  if (input.node?.require_no_horizontal_overflow === true && (
+  if (node.require_no_horizontal_overflow === true && (
     observed.layout.horizontalOverflow || observed.layout.clippedTestIds.length > 0
   )) {
     throw new Error(`Visible Perps funds layout overflows horizontally: ${JSON.stringify(observed.layout)}.`);
   }
-  if (typeof input.node?.expected_submit_enabled === 'boolean'
-    && observed.submitEnabled !== input.node.expected_submit_enabled) {
-    throw new Error(`Perps ${mode} submit state mismatch: expected ${input.node.expected_submit_enabled}, observed ${observed.submitEnabled}.`);
+  if (typeof node.expected_submit_enabled === 'boolean'
+    && observed.submitEnabled !== node.expected_submit_enabled) {
+    throw new Error(`Perps ${mode} submit state mismatch: expected ${node.expected_submit_enabled}, observed ${observed.submitEnabled}.`);
+  }
+  if (node.expected_amount != null && observed.amount !== String(node.expected_amount)) {
+    throw new Error(`Perps ${mode} amount mismatch: expected ${JSON.stringify(String(node.expected_amount))}, observed ${JSON.stringify(observed.amount)}.`);
+  }
+  if (node.expected_amount_symbol != null
+    && observed.amountSymbol !== String(node.expected_amount_symbol)) {
+    throw new Error(`Perps ${mode} amount symbol mismatch: expected ${JSON.stringify(String(node.expected_amount_symbol))}, observed ${JSON.stringify(observed.amountSymbol)}.`);
+  }
+  if (typeof node.expected_pay_token_amount_visible === 'boolean'
+    && observed.payTokenAmountVisible !== node.expected_pay_token_amount_visible) {
+    throw new Error(`Perps ${mode} token amount visibility mismatch: expected ${node.expected_pay_token_amount_visible}, observed ${observed.payTokenAmountVisible}.`);
+  }
+  if (node.expected_pay_token != null
+    && observed.payToken !== String(node.expected_pay_token)) {
+    throw new Error(`Perps ${mode} pay token mismatch: expected ${JSON.stringify(String(node.expected_pay_token))}, observed ${JSON.stringify(observed.payToken)}.`);
+  }
+  if (node.expected_receive_token != null
+    && observed.receiveToken !== String(node.expected_receive_token)) {
+    throw new Error(`Perps ${mode} receive token mismatch: expected ${JSON.stringify(String(node.expected_receive_token))}, observed ${JSON.stringify(observed.receiveToken)}.`);
+  }
+  if (node.expected_visible_network != null
+    && observed.visibleNetwork !== String(node.expected_visible_network)) {
+    throw new Error(`Perps ${mode} visible network mismatch: expected ${JSON.stringify(String(node.expected_visible_network))}, observed ${JSON.stringify(observed.visibleNetwork)}.`);
+  }
+  if (node.expected_submit_label != null
+    && observed.submitLabel !== String(node.expected_submit_label)) {
+    throw new Error(`Perps ${mode} submit label mismatch: expected ${JSON.stringify(String(node.expected_submit_label))}, observed ${JSON.stringify(observed.submitLabel)}.`);
+  }
+  if (expectedControls && (
+    expectedControls.length !== observed.percentageControls.length ||
+    expectedControls.some((control) => !observed.percentageControls.includes(control))
+  )) {
+    throw new Error(`Perps ${mode} percentage controls mismatch: expected ${JSON.stringify(expectedControls)}, observed ${JSON.stringify(observed.percentageControls)}.`);
+  }
+  const missingText = requiredText.filter((text) => !observed.bodyText.includes(text));
+  if (missingText.length > 0) {
+    throw new Error(`Perps ${mode} missing visible text: ${missingText.join(', ')}.`);
   }
   return {
-    action: input.action,
     mode,
     ...observed,
     proofPath: 'visible-dom-accessibility',
   };
+}
+
+runAdapter(async (input) => withExtensionPage(input, async (page) => {
+  const mode = String(input.node?.mode ?? '').trim().toLowerCase();
+  if (mode !== 'deposit' && mode !== 'withdraw') {
+    throw new Error('metamask.perps.read_funds_confirmation mode must be deposit or withdraw.');
+  }
+  return {
+    action: input.action,
+    ...await readFundsConfirmation(page, input.node, mode),
+  };
 }));

package/library/actions/extension/perps/read_snapshot.mjs

@@ -67,6 +67,35 @@ export function resolveSnapshotOptions(input, now = Date.now()) {
     throw new Error('metamask.perps.read_snapshot history range must not exceed 365 days.');
   }
 
+  const sampling = node.sampling && typeof node.sampling === 'object' && !Array.isArray(node.sampling)
+    ? node.sampling
+    : {};
+  const expect = node.expect && typeof node.expect === 'object' && !Array.isArray(node.expect)
+    ? node.expect
+    : {};
+  const sampleCount = boundedInteger(sampling.count, 1, 1, 10, 'sampling.count');
+  const minimumChangedMarketCount = boundedInteger(
+    expect.minimum_changed_market_count,
+    0,
+    0,
+    100,
+    'expect.minimum_changed_market_count',
+  );
+  const minimumHistoryCount = boundedInteger(
+    expect.minimum_history_count,
+    0,
+    0,
+    500,
+    'expect.minimum_history_count',
+  );
+  const requireActivityHistoryAgreement = expect.require_activity_history_agreement === true;
+  if (minimumChangedMarketCount > 0 && (!sections.includes('markets') || sampleCount < 2)) {
+    throw new Error('metamask.perps.read_snapshot market change expectations require markets and at least two samples.');
+  }
+  if ((minimumHistoryCount > 0 || requireActivityHistoryAgreement) && !sections.includes('history')) {
+    throw new Error('metamask.perps.read_snapshot history expectations require the history section.');
+  }
+
   return {
     include: sections,
     markets: requestedMarkets(node),
@@ -80,6 +109,15 @@ export function resolveSnapshotOptions(input, now = Date.now()) {
         : String(history.account_id),
       limit: boundedInteger(history.limit, 100, 1, 500, 'history.limit'),
     },
+    sampling: {
+      count: sampleCount,
+      intervalMs: boundedInteger(sampling.interval_ms, 1_000, 100, 30_000, 'sampling.interval_ms'),
+    },
+    expect: {
+      minimumChangedMarketCount,
+      minimumHistoryCount,
+      requireActivityHistoryAgreement,
+    },
   };
 }
 
@@ -174,6 +212,7 @@ export function snapshotRequestExpression(options) {
         stopLossPrice: field(item, ['stopLossPrice']),
       };
       return {
+        activityId: field(item, ['id', 'depositId', 'withdrawalId']),
         type: field(item, ['type', 'activityType']),
         status: field(item, ['status']),
         asset: field(item, ['asset', 'token', 'currency']),
@@ -339,6 +378,7 @@ function normalizeOrder(item) {
 
 function normalizeHistoryItem(item) {
   return {
+    activityId: field(item, ['activityId', 'id', 'depositId', 'withdrawalId']),
     type: field(item, ['type', 'activityType']),
     status: field(item, ['status']),
     asset: field(item, ['asset', 'token', 'currency']),
@@ -438,10 +478,84 @@ export function normalizeSnapshotResult(raw, options) {
   return sections;
 }
 
-export async function readSnapshot(input) {
+export function changedMarketFacts(first, last) {
+  const initial = new Map((first?.markets?.items ?? []).map((item) => [item.market, item]));
+  const fields = ['price', 'markPrice', 'oraclePrice', 'change24hPercent', 'fundingRate'];
+  return (last?.markets?.items ?? []).flatMap((item) => {
+    const before = initial.get(item.market);
+    const changedFields = before
+      ? fields.filter((fieldName) => before[fieldName] !== item[fieldName])
+      : [];
+    return changedFields.length > 0 ? [{ market: item.market, changedFields }] : [];
+  });
+}
+
+async function visibleActivityCards(page) {
+  return page.evaluate(`[
+    ...document.querySelectorAll('[data-testid^="transaction-card-"]')
+  ].slice(0, 200).map((element) => {
+    const style = getComputedStyle(element);
+    const rect = element.getBoundingClientRect();
+    return {
+      testId: String(element.getAttribute('data-testid') || '').slice(0, 500),
+      label: String(element.innerText || '').replace(/\\s+/gu, ' ').trim().slice(0, 500),
+      visible: style.display !== 'none' && style.visibility !== 'hidden' && rect.width > 0 && rect.height > 0,
+    };
+  })`);
+}
+
+export function activityHistoryAgreement(cards, historyItems) {
+  for (const item of historyItems) {
+    const activityId = String(item.activityId ?? '').trim();
+    if (!activityId) continue;
+    const type = String(item.type ?? '').trim().toLowerCase();
+    const prefix = type === 'withdraw' ? 'withdrawal' : type;
+    const expectedTestId = `transaction-card-${prefix}-${activityId}`;
+    const card = cards.find((entry) => entry.visible === true && entry.testId === expectedTestId);
+    if (card) {
+      return {
+        activityTestId: card.testId,
+        historyActivityId: activityId,
+        historyType: item.type,
+        historyStatus: item.status,
+      };
+    }
+  }
+  return null;
+}
+
+export async function readSnapshot(input, testOptions = {}) {
   const options = resolveSnapshotOptions(input);
   return withExtensionPage(input, async (page) => {
-    const raw = await page.evaluate(snapshotRequestExpression(options));
+    const pause = testOptions.pause ?? ((ms) => new Promise((resolve) => setTimeout(resolve, ms)));
+    const samples = [];
+    for (let index = 0; index < options.sampling.count; index += 1) {
+      const raw = await page.evaluate(snapshotRequestExpression(options));
+      samples.push(normalizeSnapshotResult(raw, options));
+      if (index + 1 < options.sampling.count) await pause(options.sampling.intervalMs);
+    }
+    const sections = samples.at(-1);
+    const changedMarkets = changedMarketFacts(samples[0], sections);
+    if (changedMarkets.length < options.expect.minimumChangedMarketCount) {
+      throw new Error(
+        `Expected at least ${options.expect.minimumChangedMarketCount} changing Perps markets, but observed ${changedMarkets.length}.`,
+      );
+    }
+    const historyCount = sections.history?.returnedCount ?? 0;
+    if (historyCount < options.expect.minimumHistoryCount) {
+      throw new Error(
+        `Expected at least ${options.expect.minimumHistoryCount} Perps history items, but observed ${historyCount}.`,
+      );
+    }
+    const visibleCards = options.expect.requireActivityHistoryAgreement
+      ? await visibleActivityCards(page)
+      : [];
+    const agreement = options.expect.requireActivityHistoryAgreement
+      ? activityHistoryAgreement(visibleCards, sections.history?.items ?? [])
+      : null;
+    if (options.expect.requireActivityHistoryAgreement && !agreement) {
+      throw new Error('Visible Perps activity did not agree with any normalized history identity.');
+    }
     return {
       action: input.action,
       source: 'extension-stateHooks-background',
@@ -454,7 +568,14 @@ export async function readSnapshot(input) {
             accountScoped: options.history.accountId !== undefined,
           }
         : null,
-      sections: normalizeSnapshotResult(raw, options),
+      sections,
+      sampling: {
+        count: options.sampling.count,
+        intervalMs: options.sampling.intervalMs,
+        changedMarketCount: changedMarkets.length,
+        changedMarkets,
+      },
+      activityHistoryAgreement: agreement,
       redacted: true,
       proofPath: 'background-perps-snapshot',
     };

package/library/actions/extension/perps/read_visible_state.mjs

@@ -4,15 +4,59 @@ import {
   resolveVisibleStateOptions,
 } from '../../shared/perps/visible-state.mjs';
 
-runAdapter(async (input) => withExtensionPage(input, async (page) => {
-  const options = resolveVisibleStateOptions(input.node);
+function pointInside(point, left, top, right, bottom) {
+  return point && point.x >= left && point.x <= right && point.y >= top && point.y <= bottom;
+}
+
+export function classifyActionableControlLayout(controls) {
+  const bounded = Array.isArray(controls) ? controls.slice(0, 200) : [];
+  return {
+    obscuredControlTestIds: bounded
+      .filter((control) => !control.hitPoint)
+      .map((control) => control.testId)
+      .filter(Boolean)
+      .slice(0, 100),
+    overlappingControlPairs: bounded.flatMap((left, index) =>
+      bounded.slice(index + 1).flatMap((right) => {
+        if (!left.hitPoint || !right.hitPoint) return [];
+        const overlapLeft = Math.max(left.rect.left, right.rect.left);
+        const overlapTop = Math.max(left.rect.top, right.rect.top);
+        const overlapRight = Math.min(left.rect.right, right.rect.right);
+        const overlapBottom = Math.min(left.rect.bottom, right.rect.bottom);
+        if (overlapRight - overlapLeft <= 1 || overlapBottom - overlapTop <= 1) return [];
+        return pointInside(left.hitPoint, overlapLeft, overlapTop, overlapRight, overlapBottom) ||
+          pointInside(right.hitPoint, overlapLeft, overlapTop, overlapRight, overlapBottom)
+          ? [[left.testId, right.testId]]
+          : [];
+      }))
+      .slice(0, 100),
+  };
+}
+
+export async function readVisiblePerpsState(page, node = {}) {
+  const options = resolveVisibleStateOptions(node);
   const raw = await page.evaluate(`(() => {
     const includeOffscreen = ${JSON.stringify(options.includeOffscreen)};
     const maximum = ${JSON.stringify(options.maxItems)};
-    const relevant = /^(?:perps-|explore-markets-|market-list-view|market-row-|filter-select-button|sort-dropdown-button|search-input|position-card-|order-card-|transaction-card-|bottom-nav-perps|direction-|order-type-|amount-|balance-percent-|leverage-|auto-close|submit-order-button|limit-price-|tp-|sl-)/u;
+    const relevant = /^(?:perps-|explore-markets-|market-list-view|market-row-|filter-select-button|sort-dropdown-button|search-input|position-card-|order-card-|transaction-card-|bottom-nav-|back-button|direction-|order-type-|amount-|balance-percent-|leverage-|auto-close|submit-order-button|limit-price-|tp-|sl-|custom-amount-|pay-with-|confirm-footer-button|wallet-initiated-header-back-button|transaction-fee-|bridge-(?:fee|time)-|receive-(?:row|value))/u;
     const items = [];
     const offscreenItems = [];
     const clippedTestIds = [];
+    const visibleControls = [];
+    const safeHitPoint = (element, rect) => {
+      const left = Math.max(0, rect.left);
+      const top = Math.max(0, rect.top);
+      const right = Math.min(innerWidth, rect.right);
+      const bottom = Math.min(innerHeight, rect.bottom);
+      if (right - left <= 1 || bottom - top <= 1) return null;
+      for (const [xRatio, yRatio] of [[0.5, 0.5], [0.25, 0.25], [0.75, 0.25], [0.25, 0.75], [0.75, 0.75]]) {
+        const x = left + (right - left) * xRatio;
+        const y = top + (bottom - top) * yRatio;
+        const hit = document.elementFromPoint(x, y);
+        if (hit && (hit === element || element.contains(hit))) return { x, y };
+      }
+      return null;
+    };
     let matched = 0;
     for (const element of document.querySelectorAll('[data-testid]')) {
       const testId = element.getAttribute('data-testid');
@@ -26,6 +70,13 @@ runAdapter(async (input) => withExtensionPage(input, async (page) => {
       if (rect.bottom > 0 && rect.top < innerHeight && (rect.left < -1 || rect.right > innerWidth + 1)) {
         clippedTestIds.push(testId);
       }
+      if (visible && element.matches('button,input,select,textarea,[role="button"],[role="tab"],[role="switch"],[role="slider"]')) {
+        visibleControls.push({
+          testId,
+          hitPoint: safeHitPoint(element, rect),
+          rect: { left: rect.left, top: rect.top, right: rect.right, bottom: rect.bottom },
+        });
+      }
       if (!visible && !includeOffscreen) continue;
       if (items.length + offscreenItems.length >= maximum) break;
       const label = String(element.getAttribute('aria-label') || element.innerText || element.getAttribute('value') || '')
@@ -87,12 +138,19 @@ runAdapter(async (input) => withExtensionPage(input, async (page) => {
         contentWidth: Math.max(document.documentElement?.scrollWidth || 0, document.body?.scrollWidth || 0),
         horizontalOverflow: Math.max(document.documentElement?.scrollWidth || 0, document.body?.scrollWidth || 0) > innerWidth + 1,
         clippedTestIds: [...new Set(clippedTestIds)].slice(0, 100),
+        actionableControls: visibleControls,
       },
     };
   })()`);
+  Object.assign(raw.layout, classifyActionableControlLayout(raw.layout.actionableControls));
+  delete raw.layout.actionableControls;
   return {
-    action: input.action,
     ...normalizeVisiblePerpsState(raw, options, 'extension'),
     proofPath: 'visible-dom-accessibility',
   };
-}));
+}
+
+runAdapter(async (input) => withExtensionPage(input, async (page) => ({
+  action: input.action,
+  ...await readVisiblePerpsState(page, input.node),
+})));

package/library/actions/extension/perps/search_markets.mjs

@@ -0,0 +1,32 @@
+import { dataTestId, runAdapter, withExtensionPage } from '../platform/cdp.mjs';
+
+runAdapter(async (input) => withExtensionPage(input, async (page) => {
+  const query = String(input.node?.query ?? '').trim();
+  const timeoutMs = Number(input.node?.timeout_ms ?? 30_000);
+  if (!query) throw new Error('metamask.perps.search_markets requires a non-empty query.');
+  await page.setInput(dataTestId('search-input'), query);
+  const deadline = Date.now() + timeoutMs;
+  let marketIds = [];
+  while (Date.now() <= deadline) {
+    marketIds = await page.evaluate(`(() => [...document.querySelectorAll('[data-testid^="market-row-"]')]
+      .filter((element) => {
+        const style = getComputedStyle(element);
+        const rect = element.getBoundingClientRect();
+        return style.display !== 'none' && style.visibility !== 'hidden' && rect.width > 0 && rect.height > 0;
+      })
+      .map((element) => String(element.getAttribute('data-testid') || ''))
+      .filter(Boolean)
+      .slice(0, 100))()`);
+    if (marketIds.length > 0) break;
+    await page.evaluate('new Promise((resolve) => setTimeout(resolve, 200))');
+  }
+  if (marketIds.length === 0) {
+    throw new Error(`Perps market search returned no visible rows for ${JSON.stringify(query)}.`);
+  }
+  return {
+    action: input.action,
+    query,
+    marketIds,
+    proofPath: 'trusted-keyboard-visible-ui',
+  };
+}));

package/library/actions/extension/perps/select_activity_filter.mjs

@@ -1,3 +1,5 @@
+import { pathToFileURL } from 'node:url';
+
 import { dataTestId, runAdapter, withExtensionPage } from '../platform/cdp.mjs';
 
 const FILTERS = new Map([
@@ -7,7 +9,17 @@ const FILTERS = new Map([
   ['deposits', 'deposit'],
 ]);
 
-runAdapter(async (input) => withExtensionPage(input, async (page) => {
+function activityRoute(hash) {
+  const separator = hash.indexOf('?');
+  const pathname = separator === -1 ? hash : hash.slice(0, separator);
+  const query = separator === -1 ? '' : hash.slice(separator + 1);
+  return {
+    pathname,
+    queryFilter: new URLSearchParams(query).get('filter'),
+  };
+}
+
+export async function selectActivityFilter(page, input, options = {}) {
   const filter = String(input.node?.filter ?? '').trim().toLowerCase();
   const option = FILTERS.get(filter);
   if (!option) {
@@ -15,30 +27,81 @@ runAdapter(async (input) => withExtensionPage(input, async (page) => {
   }
   await page.click(dataTestId('perps-activity-filter-button'));
   await page.click(dataTestId(`perps-activity-filter-option-${option}`));
-  await new Promise((resolve) => setTimeout(resolve, 300));
-  const observed = await page.evaluate(`(() => {
-    const button = document.querySelector('[data-testid="perps-activity-filter-button"]');
-    const entries = [...document.querySelectorAll('[data-testid^="transaction-card-"]')]
-      .slice(0, 200)
-      .map((element) => String(element.innerText || '').replace(/\\s+/gu, ' ').trim().slice(0, 500));
-    return {
-      route: String(location.hash),
-      selected: String(button?.innerText || '').trim(),
-      entries,
-      empty: String(document.body?.innerText || '').replace(/\\s+/gu, ' ').trim().slice(0, 2_000),
-    };
-  })()`);
-  if (observed.route !== '#/perps/activity') throw new Error('Perps activity filter left the activity route.');
-  if (observed.selected.toLowerCase() !== filter) {
-    throw new Error(`Expected Perps activity filter ${filter}, but observed ${observed.selected || 'none'}.`);
+  const timeoutMs = options.timeoutMs ?? 5_000;
+  const pollIntervalMs = options.pollIntervalMs ?? 100;
+  const deadline = Date.now() + timeoutMs;
+  let observed;
+  let route;
+  while (true) {
+    observed = await page.evaluate(`(() => {
+      const button = document.querySelector('[data-testid="perps-activity-filter-button"]');
+      const style = button ? getComputedStyle(button) : null;
+      const rect = button?.getBoundingClientRect();
+      const visible = (element) => {
+        if (!element) return false;
+        const elementStyle = getComputedStyle(element);
+        const elementRect = element.getBoundingClientRect();
+        return elementStyle.display !== 'none' && elementStyle.visibility !== 'hidden' && elementRect.width > 0 && elementRect.height > 0;
+      };
+      const cards = [...document.querySelectorAll('[data-testid^="transaction-card-"]')]
+        .slice(0, 200)
+        .flatMap((element) => {
+          const cardStyle = getComputedStyle(element);
+          const cardRect = element.getBoundingClientRect();
+          if (cardStyle.display === 'none' || cardStyle.visibility === 'hidden' || cardRect.width <= 0 || cardRect.height <= 0) return [];
+          return [{
+            testId: String(element.getAttribute('data-testid') || '').slice(0, 500),
+            label: String(element.innerText || '').replace(/\\s+/gu, ' ').trim().slice(0, 500),
+          }];
+        });
+      return {
+        hash: String(location.hash),
+        selected: String(button?.innerText || '').trim(),
+        selectedVisible: Boolean(button && style?.display !== 'none' && style?.visibility !== 'hidden' && rect.width > 0 && rect.height > 0),
+        cards,
+        entries: cards.map((card) => card.label),
+        loadedBoundary: visible(document.querySelector('[data-testid="perps-activity-page-skeleton"]'))
+          ? null
+          : visible(document.querySelector('[data-testid="perps-activity-page"]'))
+            ? cards.length > 0 ? 'visible-cards' : 'loaded-empty'
+            : null,
+        empty: String(document.body?.innerText || '').replace(/\\s+/gu, ' ').trim().slice(0, 2_000),
+      };
+    })()`);
+    route = activityRoute(observed.hash);
+    if (
+      route.pathname === '#/perps/activity' &&
+      route.queryFilter === option &&
+      observed.selectedVisible &&
+      observed.selected.toLowerCase() === filter &&
+      observed.loadedBoundary !== null
+    ) {
+      break;
+    }
+    if (Date.now() >= deadline) {
+      throw new Error(
+        `Perps activity filter ${filter} did not settle within ${timeoutMs}ms: ` +
+        `pathname=${JSON.stringify(route.pathname)}, filter=${JSON.stringify(route.queryFilter)}, ` +
+        `label=${JSON.stringify(observed.selected)}, visible=${observed.selectedVisible === true}.`,
+      );
+    }
+    await page.evaluate(`new Promise((resolve) => setTimeout(resolve, ${JSON.stringify(pollIntervalMs)}))`);
   }
   return {
     action: input.action,
     filter,
+    pathname: route.pathname,
+    queryFilter: route.queryFilter,
     selected: observed.selected,
     count: observed.entries.length,
+    cards: observed.cards,
+    loadedBoundary: observed.loadedBoundary,
     entries: observed.entries,
     empty: observed.entries.length === 0 ? observed.empty : undefined,
     proofPath: 'trusted-pointer-visible-ui',
   };
-}));
+}
+
+if (process.argv[1] && import.meta.url === pathToFileURL(process.argv[1]).href) {
+  runAdapter((input) => withExtensionPage(input, (page) => selectActivityFilter(page, input)));
+}