Merge branch 'main' into feat/android-16kb-requirement

Author: adnxy

.github/scripts/collect-qa-stats.mjs

@@ -22,7 +22,8 @@
  *
  * MetaMetrics (top-level `metametrics` namespace): static scan of
  * `tests/helpers/analytics/expectations/*.ts` plus `LEGACY_INLINE_METAMETRICS_PATHS`
- * for specs not yet using declarative expectations.
+ * for specs not yet using declarative expectations. Event names are picked from
+ * `name:` fields, `eventNames: [...]`, `onboardingEvents.*`, and event-ish `const` arrays.
  *
  * Example output:
  *   {
@@ -348,7 +349,63 @@ function parseConstStringLiterals(source) {
 }
 
 /**
- * Event names from declarative `*.analytics.ts` modules (onboarding refs, `name:` entries, event arrays).
+ * Content between "[" and matching "]" at the same nesting depth (naive bracket count).
+ *
+ * @param {string} source
+ * @param {number} openBracketIdx index of '[' opening the array
+ * @returns {string|null}
+ */
+function sliceBalancedSquareBracketInner(source, openBracketIdx) {
+  if (source[openBracketIdx] !== '[') return null;
+  let depth = 0;
+  for (let i = openBracketIdx; i < source.length; i += 1) {
+    const c = source[i];
+    if (c === '[') depth += 1;
+    else if (c === ']') {
+      depth -= 1;
+      if (depth === 0) return source.slice(openBracketIdx + 1, i);
+    }
+  }
+  return null;
+}
+
+/**
+ * Segment from CSV inside `eventNames:` or event-ish `const` arrays. Spread/rest is skipped —
+ * duplicated by a sibling `const *Names*` list when present (e.g. `...transactionEventNames`).
+ *
+ * @param {string} token
+ * @param {Record<string, string>} onboardingMap
+ * @param {Record<string, string>} strConsts
+ * @returns {string|null}
+ */
+function resolveDeclarativeExpectationListToken(token, onboardingMap, strConsts) {
+  const t = token.replace(/^\s+|\s+$/g, '');
+  if (!t) return null;
+  const lit = t.match(/^['"]([^'"]+)['"]$/);
+  if (lit) return lit[1];
+  const onb = t.match(/^onboardingEvents\.(\w+)$/);
+  if (onb && onboardingMap[onb[1]]) return onboardingMap[onb[1]];
+  if (/^\.\.\.\s*\w+$/.test(t)) return null;
+  if (strConsts[t]) return strConsts[t];
+  return null;
+}
+
+/**
+ * @param {string} inner
+ * @param {Record<string, string>} onboardingMap
+ * @param {Record<string, string>} strConsts
+ * @param {Set<string>} out
+ */
+function collectExpectationCsvArrayInner(inner, onboardingMap, strConsts, out) {
+  for (const part of inner.split(',')) {
+    const v = resolveDeclarativeExpectationListToken(part, onboardingMap, strConsts);
+    if (v) out.add(v);
+  }
+}
+
+/**
+ * Event names from declarative `*.analytics.ts`: `eventNames:` arrays, onboarding refs,
+ * `name:` entries, string/const lookups, and event-ish `const [...]` declarations.
  *
  * @param {string} source
  * @param {Record<string, string>} onboardingMap
@@ -368,11 +425,18 @@ function collectFromDeclarativeExpectationsSource(source, onboardingMap, out) {
     const v = onboardingMap[m[1]];
     if (v) out.add(v);
   }
-  for (const m of source.matchAll(/\bname:\s*(\w+)\s*,/g)) {
+  // Allow `name: IDENT,` (more properties follow) or `name: IDENT }` (single-field expectation object).
+  for (const m of source.matchAll(/\bname:\s*(\w+)\s*[},]/g)) {
     const v = strConsts[m[1]];
     if (v) out.add(v);
   }
 
+  for (const em of source.matchAll(/\beventNames:\s*\[/g)) {
+    const openIdx = em.index + em[0].length - 1;
+    const inner = sliceBalancedSquareBracketInner(source, openIdx);
+    if (inner) collectExpectationCsvArrayInner(inner, onboardingMap, strConsts, out);
+  }
+
   const reArrays = /\bconst\s+(\w+)\s*=\s*\[([\s\S]*?)\];/g;
   let am;
   while ((am = reArrays.exec(source)) !== null) {
@@ -382,21 +446,7 @@ function collectFromDeclarativeExpectationsSource(source, onboardingMap, out) {
       /(?:event|Event|Expected|expectation|analytics|Names)/.test(varName) ||
       /\bonboardingEvents\b|\bexpectedEvents\b/.test(inner);
     if (!looksLikeEventList) continue;
-    for (const part of inner.split(',')) {
-      const t = part.replace(/^\s+|\s+$/g, '');
-      if (!t) continue;
-      const lit = t.match(/^['"]([^'"]+)['"]$/);
-      if (lit) {
-        out.add(lit[1]);
-        continue;
-      }
-      const onb = t.match(/^onboardingEvents\.(\w+)$/);
-      if (onb && onboardingMap[onb[1]]) {
-        out.add(onboardingMap[onb[1]]);
-        continue;
-      }
-      if (strConsts[t]) out.add(strConsts[t]);
-    }
+    collectExpectationCsvArrayInner(inner, onboardingMap, strConsts, out);
   }
 }
 

app/components/Views/ConnectQRHardware/ConnectQRHardware.testIds.ts

@@ -1,3 +1,5 @@
 export const ConnectQRHardwareSelectorsIDs = {
+  CONTAINER: 'connect-qr-hardware-container',
+  HEADER: 'connect-qr-hardware-header',
   CONTINUE_BUTTON: 'qr-continue-button',
 };

app/components/Views/ConnectQRHardware/index.test.tsx

@@ -2,6 +2,7 @@ import React from 'react';
 import renderWithProvider from '../../../util/test/renderWithProvider';
 import Engine from '../../../core/Engine';
 import ConnectQRHardware from './index';
+import { StyleSheet } from 'react-native';
 import { fireEvent, act, waitFor } from '@testing-library/react-native';
 import { ConnectQRHardwareSelectorsIDs } from './ConnectQRHardware.testIds';
 import { backgroundState } from '../../../util/test/initial-root-state';
@@ -37,6 +38,30 @@ jest.mock('../../../components/hooks/useAnalytics/useAnalytics', () => ({
   }),
 }));
 
+jest.mock('react-native-safe-area-context', () => {
+  const ReactActual = jest.requireActual('react');
+  const { View: MockView } = jest.requireActual('react-native');
+  const inset = { top: 44, right: 0, bottom: 0, left: 0 };
+  const frame = { x: 0, y: 0, width: 390, height: 844 };
+
+  return {
+    ...jest.requireActual('react-native-safe-area-context'),
+    SafeAreaInsetsContext: ReactActual.createContext(inset),
+    SafeAreaFrameContext: ReactActual.createContext(frame),
+    SafeAreaView: ({ children, ...props }: { children: React.ReactNode }) =>
+      ReactActual.createElement(MockView, props, children),
+    SafeAreaProvider: ({ children, ...props }: { children: React.ReactNode }) =>
+      ReactActual.createElement(MockView, props, children),
+    SafeAreaConsumer: ({
+      children,
+    }: {
+      children: (safeAreaInsets: typeof inset) => React.ReactNode;
+    }) => children(inset),
+    useSafeAreaInsets: () => inset,
+    useSafeAreaFrame: () => frame,
+  };
+});
+
 jest.mock(
   '../../../core/HardwareWallet/contexts/HardwareWalletContext',
   () => ({
@@ -272,6 +297,70 @@ describe('ConnectQRHardware', () => {
     );
   });
 
+  it('does not add header top margin when SafeAreaView handles top inset', async () => {
+    mockKeyringController.getAccounts.mockResolvedValue([]);
+
+    const { getByTestId } = renderWithProvider(
+      <ConnectQRHardware navigation={mockedNavigate} />,
+      { state: mockInitialState },
+    );
+
+    await waitFor(() => {
+      expect(mockKeyringController.getAccounts).toHaveBeenCalledTimes(1);
+    });
+
+    const header = getByTestId(ConnectQRHardwareSelectorsIDs.HEADER);
+
+    expect(header).toBeOnTheScreen();
+    expect(StyleSheet.flatten(header.props.style).marginTop).toBeUndefined();
+  });
+
+  it('excludes bottom edge from parent SafeAreaView because instruction owns bottom spacing', async () => {
+    mockKeyringController.getAccounts.mockResolvedValue([]);
+
+    const { getByTestId } = renderWithProvider(
+      <ConnectQRHardware navigation={mockedNavigate} />,
+      { state: mockInitialState },
+    );
+
+    await waitFor(() => {
+      expect(mockKeyringController.getAccounts).toHaveBeenCalledTimes(1);
+    });
+
+    const safeAreaContainer = getByTestId(
+      ConnectQRHardwareSelectorsIDs.CONTAINER,
+    );
+
+    expect(safeAreaContainer.props.edges).toStrictEqual([
+      'top',
+      'left',
+      'right',
+    ]);
+  });
+
+  it('excludes bottom edge from parent SafeAreaView when account selector owns bottom spacing', async () => {
+    mockKeyringController.getAccounts.mockResolvedValue([]);
+
+    const { getByTestId } = renderWithProvider(
+      <ConnectQRHardware navigation={mockedNavigate} />,
+      { state: mockInitialState },
+    );
+
+    const button = getByTestId(ConnectQRHardwareSelectorsIDs.CONTINUE_BUTTON);
+
+    await act(async () => {
+      fireEvent.press(button);
+    });
+
+    await waitFor(() => {
+      expect(mockQrKeyring.getFirstPage).toHaveBeenCalledTimes(1);
+    });
+
+    expect(
+      getByTestId(ConnectQRHardwareSelectorsIDs.CONTAINER).props.edges,
+    ).toStrictEqual(['top', 'left', 'right']);
+  });
+
   it('renders first page correctly when user clicks `continue` button', async () => {
     mockKeyringController.getAccounts.mockResolvedValue([]);
 

app/components/Views/ConnectQRHardware/index.tsx

@@ -6,10 +6,7 @@ import React, {
   useState,
 } from 'react';
 import { StyleSheet, Text, TouchableOpacity, View } from 'react-native';
-import {
-  type EdgeInsets,
-  useSafeAreaInsets,
-} from 'react-native-safe-area-context';
+import { SafeAreaView, type Edge } from 'react-native-safe-area-context';
 import Engine from '../../../core/Engine';
 import AnimatedQRScannerModal from '../../UI/QRHardware/AnimatedQRScanner';
 import AccountSelector from '../../UI/HardwareWallet/AccountSelector';
@@ -35,6 +32,7 @@ import { QrScanRequestType } from '@metamask/eth-qr-keyring';
 import { withQrKeyring } from '../../../core/QrKeyring/QrKeyring';
 import { getChecksumAddress } from '@metamask/utils';
 import { getConnectedDevicesCount } from '../../../core/HardwareWallets/analytics';
+import { ConnectQRHardwareSelectorsIDs } from './ConnectQRHardware.testIds';
 import { useHardwareWallet } from '../../../core/HardwareWallet/contexts/HardwareWalletContext';
 import { HardwareWalletType } from '@metamask/hw-wallet-sdk';
 import { useQrScanErrorForwarding } from '../../../core/HardwareWallet/hooks/useQrScanErrorForwarding';
@@ -48,15 +46,16 @@ interface IConnectQRHardwareProps {
   route?: any;
 }
 
-const createStyles = (colors: ThemeColors, insets: EdgeInsets) =>
+const SAFE_AREA_EDGES: Edge[] = ['top', 'left', 'right'];
+
+const createStyles = (colors: ThemeColors) =>
   StyleSheet.create({
     container: {
       flex: 1,
       flexDirection: 'column',
       alignItems: 'center',
     },
     header: {
-      marginTop: insets.top,
       flexDirection: 'row',
       width: '100%',
       paddingHorizontal: 32,
@@ -94,8 +93,7 @@ const ConnectQRHardware = ({ navigation, route }: IConnectQRHardwareProps) => {
   const { colors } = useTheme();
   const { trackEvent, createEventBuilder } = useAnalytics();
   const { setTargetWalletType, setQrScanRetryHandler } = useHardwareWallet();
-  const insets = useSafeAreaInsets();
-  const styles = createStyles(colors, insets);
+  const styles = createStyles(colors);
   const hideMarketingContent = route?.params?.hideMarketingContent ?? false;
 
   const [isScanning, setIsScanning] = useState(false);
@@ -112,6 +110,7 @@ const ConnectQRHardware = ({ navigation, route }: IConnectQRHardwareProps) => {
   }, []);
 
   const [existingAccounts, setExistingAccounts] = useState<string[]>([]);
+  const safeAreaEdges = SAFE_AREA_EDGES;
 
   useEffect(() => {
     setTargetWalletType(HardwareWalletType.Qr);
@@ -313,8 +312,15 @@ const ConnectQRHardware = ({ navigation, route }: IConnectQRHardwareProps) => {
 
   return (
     <Fragment>
-      <View style={styles.container}>
-        <View style={styles.header}>
+      <SafeAreaView
+        style={styles.container}
+        edges={safeAreaEdges}
+        testID={ConnectQRHardwareSelectorsIDs.CONTAINER}
+      >
+        <View
+          style={styles.header}
+          testID={ConnectQRHardwareSelectorsIDs.HEADER}
+        >
           <Icon
             name="qrcode"
             size={42}
@@ -347,7 +353,7 @@ const ConnectQRHardware = ({ navigation, route }: IConnectQRHardwareProps) => {
             title={strings('connect_qr_hardware.select_accounts')}
           />
         )}
-      </View>
+      </SafeAreaView>
       <AnimatedQRScannerModal
         visible={isScanning}
         purpose={QrScanRequestType.PAIR}