test: address perps integration harness feedback

Author: racitores

app/components/UI/Perps/integration/orderLifecycle.integration.test.ts

@@ -9,6 +9,8 @@
  * Reference: tests/integration/AGENTS.md · .agents/skills/integration-test/
  */
 
+import { type Position } from '@metamask/perps-controller';
+
 import { buildPerpsIntegrationHarness } from '../../../../../tests/integration/harnesses/perps';
 
 describe('Perps order lifecycle — integration', () => {
@@ -107,8 +109,7 @@ describe('Perps order lifecycle — integration', () => {
 
   describe('closing a position', () => {
     /** Long BTC position seeded into the subscription cache. */
-    const openLongBTC = {
-      coin: 'BTC',
+    const openLongBTC: Position = {
       symbol: 'BTC',
       size: '0.1', // positive = long
       entryPrice: '50000',
@@ -120,6 +121,8 @@ describe('Perps order lifecycle — integration', () => {
       maxLeverage: 50,
       returnOnEquity: '0',
       cumulativeFunding: { allTime: '0', sinceOpen: '0', sinceChange: '0' },
+      takeProfitCount: 0,
+      stopLossCount: 0,
     };
 
     it('closes a long position fully when size is omitted (cache-lookup path)', async () => {
@@ -129,9 +132,7 @@ describe('Perps order lifecycle — integration', () => {
       setupTradingReady();
       // Realistic flow: provider reads the position from the WS subscription
       // cache rather than receiving it inline from the UI.
-      mocks.subscription.getCachedPositions.mockReturnValue([
-        openLongBTC as never,
-      ]);
+      mocks.subscription.getCachedPositions.mockReturnValue([openLongBTC]);
 
       // Act — full close, no `size`, no `position` param
       const result = await provider.closePosition({

app/components/UI/Perps/integration/orderLifecycleFlow.integration.test.ts

@@ -19,7 +19,7 @@
  *            tests/integration/STRATEGY.md (Shape A vs Shape B discussion)
  */
 
-import { renderHook, act } from '@testing-library/react-native';
+import { act } from '@testing-library/react-native';
 import { type OrderResult, type Position } from '@metamask/perps-controller';
 
 import { buildPerpsFlowHarness } from '../../../../../tests/integration/harnesses/perps-flow';
@@ -29,9 +29,9 @@ describe('Perps order lifecycle — FLOW integration', () => {
   describe('opening a position via the hook chain', () => {
     it('places a long market order through the real usePerpsTrading hook', async () => {
       // Arrange
-      const { harness } = buildPerpsFlowHarness();
-      harness.setupTradingReady();
-      const { result } = renderHook(() => usePerpsTrading());
+      const perps = buildPerpsFlowHarness();
+      perps.harness.setupTradingReady();
+      const { result } = perps.renderHookWithFlow(() => usePerpsTrading());
 
       // Act
       let placeOrderResult: Awaited<
@@ -51,8 +51,8 @@ describe('Perps order lifecycle — FLOW integration', () => {
       // chain was called. Both ends of the chain verified in one test.
       expect(placeOrderResult).not.toBeNull();
       expect(placeOrderResult).toMatchObject({ success: true, orderId: '123' });
-      expect(harness.mocks.exchangeClient.order).toHaveBeenCalledTimes(1);
-      expect(harness.mocks.exchangeClient.order).toHaveBeenCalledWith(
+      expect(perps.harness.mocks.exchangeClient.order).toHaveBeenCalledTimes(1);
+      expect(perps.harness.mocks.exchangeClient.order).toHaveBeenCalledWith(
         expect.objectContaining({
           orders: [
             expect.objectContaining({
@@ -85,8 +85,8 @@ describe('Perps order lifecycle — FLOW integration', () => {
   describe('reversing a position via the hook chain', () => {
     it('places the flip market order end-to-end', async () => {
       // Arrange
-      const { harness } = buildPerpsFlowHarness();
-      harness.setupTradingReady();
+      const perps = buildPerpsFlowHarness();
+      perps.harness.setupTradingReady();
       const openLongBTC: Position = {
         symbol: 'BTC',
         size: '0.1', // positive = long; flipPosition will compute 2x = 0.2
@@ -102,7 +102,7 @@ describe('Perps order lifecycle — FLOW integration', () => {
         takeProfitCount: 0,
         stopLossCount: 0,
       };
-      const { result } = renderHook(() => usePerpsTrading());
+      const { result } = perps.renderHookWithFlow(() => usePerpsTrading());
 
       // Act — through the real hook → real TradingService → real provider chain
       let flipResult: OrderResult | null = null;
@@ -120,8 +120,8 @@ describe('Perps order lifecycle — FLOW integration', () => {
         throw new Error('Expected flipPosition to return a result');
       }
       expect(flipResult).toMatchObject({ success: true });
-      expect(harness.mocks.exchangeClient.order).toHaveBeenCalledTimes(1);
-      expect(harness.mocks.exchangeClient.order).toHaveBeenCalledWith(
+      expect(perps.harness.mocks.exchangeClient.order).toHaveBeenCalledTimes(1);
+      expect(perps.harness.mocks.exchangeClient.order).toHaveBeenCalledWith(
         expect.objectContaining({
           orders: [
             expect.objectContaining({

tests/integration/harnesses/perps-component.tsx

@@ -83,75 +83,6 @@ jest.mock('../../../app/util/haptics', () => {
     }),
   };
 });
-jest.mock(
-  '../../../app/components/Views/confirmations/hooks/pay/useTransactionPayData',
-  () => ({
-    useTransactionPayTotals: () => null,
-    useIsTransactionPayQuoteLoading: () => false,
-  }),
-);
-jest.mock(
-  '../../../app/components/Views/confirmations/hooks/pay/useTransactionPayMetrics',
-  () => ({
-    useTransactionPayMetrics: jest.fn(),
-  }),
-);
-jest.mock(
-  '../../../app/components/Views/confirmations/hooks/pay/useTransactionPayToken',
-  () => ({
-    useTransactionPayToken: () => ({ payToken: null }),
-  }),
-);
-jest.mock(
-  '../../../app/components/Views/confirmations/hooks/tokens/useAddToken',
-  () => ({
-    useAddToken: jest.fn(),
-  }),
-);
-jest.mock(
-  '../../../app/components/Views/confirmations/hooks/transactions/useTransactionConfirm',
-  () => ({
-    useTransactionConfirm: () => ({
-      onConfirm: jest.fn().mockResolvedValue(undefined),
-    }),
-  }),
-);
-jest.mock(
-  '../../../app/components/Views/confirmations/hooks/transactions/useTransactionCustomAmount',
-  () => ({
-    useTransactionCustomAmount: () => ({ setCustomAmount: jest.fn() }),
-  }),
-);
-jest.mock(
-  '../../../app/components/Views/confirmations/hooks/transactions/useTransactionMetadataRequest',
-  () => ({
-    useTransactionMetadataRequest: () => undefined,
-  }),
-);
-jest.mock(
-  '../../../app/components/Views/confirmations/hooks/transactions/useUpdateTokenAmount',
-  () => ({
-    useUpdateTokenAmount: () => jest.fn(),
-  }),
-);
-jest.mock(
-  '../../../app/components/Views/confirmations/hooks/useConfirmActions',
-  () => ({
-    useConfirmActions: () => ({ onReject: jest.fn() }),
-  }),
-);
-jest.mock(
-  '../../../app/components/Views/confirmations/hooks/alerts/useInsufficientPayTokenBalanceAlert',
-  () => ({
-    useInsufficientPayTokenBalanceAlert: () => [],
-  }),
-);
-jest.mock(
-  '../../../app/components/Views/confirmations/hooks/alerts/useNoPayTokenQuotesAlert',
-  () => ({
-    useNoPayTokenQuotesAlert: () => [],
-  }),
-);
 jest.mock('../../../app/util/trace', () => ({
   TraceName: {
     PerpsOrderView: 'PerpsOrderView',
@@ -170,6 +101,8 @@ import React from 'react';
 import { View } from 'react-native';
 import { SafeAreaProvider } from 'react-native-safe-area-context';
 import { createStackNavigator } from '@react-navigation/stack';
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import { ConnectionStatus } from '@metamask/hw-wallet-sdk';
 
 import { buildPerpsFlowHarness, type PerpsFlowHarness } from './perps-flow';
 import type { PerpsHarnessOptions } from './perps';
@@ -193,6 +126,9 @@ import type {
 import { AccessRestrictedProvider } from '../../../app/components/UI/Compliance';
 import Routes from '../../../app/constants/navigation/Routes';
 import { initialStatePerps } from '../../component-view/presets/perpsStatePreset';
+import HardwareWalletContext, {
+  type HardwareWalletContextValue,
+} from '../../../app/core/HardwareWallet/contexts/HardwareWalletContext';
 
 type ToastOptionsForHarness = ToastOptions;
 
@@ -230,6 +166,30 @@ export interface PerpsComponentHarness extends PerpsFlowHarness {
 
 const noopUnsubscribe = (): void => undefined;
 
+function createTestQueryClient() {
+  return new QueryClient({
+    defaultOptions: {
+      queries: { retry: false },
+      mutations: { retry: false },
+    },
+  });
+}
+
+function QueryClientBoundary({ children }: { children: React.ReactNode }) {
+  const [queryClient] = React.useState(createTestQueryClient);
+
+  React.useEffect(
+    () => () => {
+      queryClient.clear();
+    },
+    [queryClient],
+  );
+
+  return (
+    <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
+  );
+}
+
 const testConnectionValue: PerpsConnectionContextValue = {
   isConnected: true,
   isConnecting: false,
@@ -241,6 +201,31 @@ const testConnectionValue: PerpsConnectionContextValue = {
   reconnectWithNewContext: async (): Promise<void> => undefined,
 };
 
+const testHardwareWalletValue: HardwareWalletContextValue = {
+  walletType: null,
+  deviceId: null,
+  connectionState: { status: ConnectionStatus.Disconnected },
+  deviceSelection: {
+    devices: [],
+    selectedDevice: null,
+    isScanning: false,
+    scanError: null,
+  },
+  ensureDeviceReady: async (): Promise<boolean> => true,
+  setTargetWalletType: (): void => undefined,
+  setPendingOperationAddress: (): void => undefined,
+  showHardwareWalletError: (): void => undefined,
+  showAwaitingConfirmation: (): void => undefined,
+  hideAwaitingConfirmation: (): void => undefined,
+  qr: {
+    pendingScanRequest: undefined,
+    isSigningQRObject: false,
+    setRequestCompleted: (): void => undefined,
+    isRequestCompleted: false,
+    cancelQRScanRequestIfPresent: async (): Promise<void> => undefined,
+  },
+};
+
 function channelWithInitialValue<T>(initialValue: T) {
   return {
     subscribe: (params: { callback: (data: T) => void }): (() => void) => {
@@ -349,15 +334,19 @@ export function buildPerpsComponentHarness(
           insets: { top: 0, left: 0, right: 0, bottom: 0 },
         }}
       >
-        <ToastContext.Provider value={{ toastRef }}>
-          <AccessRestrictedProvider>
-            <PerpsConnectionContext.Provider value={testConnectionValue}>
-              <PerpsStreamProvider testStreamManager={streamManager}>
-                {component}
-              </PerpsStreamProvider>
-            </PerpsConnectionContext.Provider>
-          </AccessRestrictedProvider>
-        </ToastContext.Provider>
+        <QueryClientBoundary>
+          <HardwareWalletContext.Provider value={testHardwareWalletValue}>
+            <ToastContext.Provider value={{ toastRef }}>
+              <AccessRestrictedProvider>
+                <PerpsConnectionContext.Provider value={testConnectionValue}>
+                  <PerpsStreamProvider testStreamManager={streamManager}>
+                    {component}
+                  </PerpsStreamProvider>
+                </PerpsConnectionContext.Provider>
+              </AccessRestrictedProvider>
+            </ToastContext.Provider>
+          </HardwareWalletContext.Provider>
+        </QueryClientBoundary>
       </SafeAreaProvider>
     );