[pull] main from MetaMask:main

.cursor/BUGBOT.md

@@ -17,7 +17,7 @@ Use the rules in the [unit testing guidelines](rules/unit-testing-guidelines.mdc
 ### 2. Initial Setup - E2E Tests
 
 - **ALWAYS** load and reference [e2e-testing-guidelines](rules/e2e-testing-guidelines.mdc)
-- Verify test file naming pattern: `e2e/specs/**/*.spec.{js,ts}`
+- Verify test file naming pattern: `tests/(smoke|regression)/**/*.spec.{js,ts}`
 - Check for proper imports and framework utilities from `tests/framework/index.ts`
 
 Use the rules in the [e2e-testing-guidelines](rules/e2e-testing-guidelines.mdc) to enforce the test quality and bug detection.

.cursor/rules/e2e-testing-guidelines.mdc

@@ -26,14 +26,15 @@ alwaysApply: true
 ## Test Organization - MANDATORY
 
 - Organize tests into folders based on features and scenarios
+- Use the a directory that suits the test type (regression|smoke) based on the tag used
 - Each feature team should own one or more folders of tests
 - Follow the same organization pattern as the extension team for consistency
 - Place tests in logical feature directories:
   ```
-  e2e/specs/<feature-name>/<e2e-test-name.spec.ts>
-  e2e/specs/tokens/import/import-erc1155.spec.ts
-  e2e/specs/settings/clear-activity.spec.ts
-  e2e/specs/ppom/ppom-blockaid-alert-erc20-approval.spec.ts
+  tests/smoke/<feature-name>/<e2e-test-name.spec.ts>
+  tests/smoke/tokens/import/import-erc1155.spec.ts
+  tests/regression/wallet/settings/clear-activity.spec.ts
+  tests/regression/ppom/ppom-blockaid-alert-erc20-approval.spec.ts
   ```
 
 ## Framework Architecture
@@ -109,6 +110,7 @@ new FixtureBuilder().build();
 ### Page Object Model (POM) Pattern
 - ALWAYS use the Page Object Model pattern for organizing test code
 - Move all element selectors to Page Objects or dedicated selector files
+- When adding one or more testID to a component or view, place it in a dedicated file next to where it is being used with the file extension `.testIds.ts`
 - Access UI elements through Page Object methods, not directly in test specs
 
 #### Page Object Structure Example:
@@ -149,6 +151,21 @@ class LoginPage {
 export default new LoginPage();
 ```
 
+### TestIDs location example:
+```typescript
+// DON'T:
+import { MyComponentSelectors } from '../../tests/selectors/Card/RecurringFeeModal.selectors';
+
+// DO:
+import { MyComponentSelectors } from './MyComponent.testIds';
+
+const MyComponent = () => {
+  return (
+    <MyComponent testID={MyComponentSelectors.CONTAINER} />
+  )
+};
+```
+
 ### Proper Waiting and Assertions
 - NEVER use `TestHelpers.delay()` - it creates flaky tests and slows down test execution
 - ALWAYS use proper waiting with Assertions from the framework:

.github/scripts/e2e-extract-test-results.mjs

@@ -48,7 +48,7 @@ async function parseXml(content) {
  * jest-junit outputs XML with structure:
  * <testsuites>
  *   <testsuite name="TestSuite" tests="N" failures="N" ...>
- *     <testcase name="test name" classname="e2e/specs/path/to/file.spec.ts" time="N">
+ *     <testcase name="test name" classname="tests/smoke/path/to/file.spec.ts" time="N">
  *       <failure>...</failure>  <!-- only if failed -->
  *     </testcase>
  *   </testsuite>

.github/scripts/e2e-split-tags-shards.mjs

@@ -11,10 +11,7 @@ import { extractTestResults } from './e2e-extract-test-results.mjs';
 
 const env = {
   TEST_SUITE_TAG: process.env.TEST_SUITE_TAG,
-  // Starting at the root drastically affects the performance of the script. 
-  // This will be reverted as soon as all specs are migrated to the new folder 
-  // structure.
-  BASE_DIR: process.env.BASE_DIR || './',
+  BASE_DIR: process.env.BASE_DIR || './tests/',
   METAMASK_BUILD_TYPE: process.env.METAMASK_BUILD_TYPE || 'main',
   PLATFORM: process.env.PLATFORM || 'ios',
   SPLIT_NUMBER: Number(process.env.SPLIT_NUMBER || '1'),

.github/workflows/run-performance-e2e-experimental.yml

@@ -9,6 +9,11 @@ on:
     branches:
       - main
 
+permissions:
+  contents: read
+  id-token: write
+  actions: write
+
 concurrency:
   group: performance-e2e-experimental-${{ github.ref }}-${{ github.event_name }}
   cancel-in-progress: false

android/app/build.gradle

@@ -187,7 +187,7 @@ android {
         applicationId "io.metamask"
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
-        versionName "7.65.0"
+        versionName "7.66.0"
         versionCode 3607
         testBuildType System.getProperty('testBuildType', 'debug')
         testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"

app/component-library/components-temp/ConditionalScrollView/ConditionalScrollView.tsx

@@ -1,20 +1,24 @@
-import React from 'react';
+import React, { forwardRef } from 'react';
 import { ScrollView } from 'react-native';
 import { ConditionalScrollViewProps } from './ConditionalScrollView.types';
 
 /**
  * ConditionalScrollView renders either a ScrollView or content directly based on isScrollEnabled prop.
  * This is useful for homepage redesign where we want to remove nested scroll views in favor of a global scroll container.
  */
-const ConditionalScrollView: React.FC<ConditionalScrollViewProps> = ({
-  children,
-  isScrollEnabled,
-  scrollViewProps,
-}) =>
+const ConditionalScrollView = forwardRef<
+  ScrollView,
+  ConditionalScrollViewProps
+>(({ children, isScrollEnabled, scrollViewProps }, ref) =>
   isScrollEnabled ? (
-    <ScrollView {...scrollViewProps}>{children}</ScrollView>
+    <ScrollView ref={ref} {...scrollViewProps}>
+      {children}
+    </ScrollView>
   ) : (
     <>{children}</>
-  );
+  ),
+);
+
+ConditionalScrollView.displayName = 'ConditionalScrollView';
 
 export default ConditionalScrollView;

app/component-library/components-temp/HeaderCenter/HeaderCenter.stories.tsx → app/component-library/components-temp/HeaderCompactStandard/HeaderCompactStandard.stories.tsx

@@ -8,11 +8,11 @@ import {
   IconName,
 } from '@metamask/design-system-react-native';
 
-import HeaderCenter from './HeaderCenter';
+import HeaderCompactStandard from './HeaderCompactStandard';
 
-const HeaderCenterMeta = {
-  title: 'Components Temp / HeaderCenter',
-  component: HeaderCenter,
+const HeaderCompactStandardMeta = {
+  title: 'Components Temp / HeaderCompactStandard',
+  component: HeaderCompactStandard,
   argTypes: {
     title: {
       control: 'text',
@@ -26,7 +26,7 @@ const HeaderCenterMeta = {
   },
 };
 
-export default HeaderCenterMeta;
+export default HeaderCompactStandardMeta;
 
 export const Default = {
   args: {
@@ -36,13 +36,16 @@ export const Default = {
 
 export const OnBack = {
   render: () => (
-    <HeaderCenter title="Settings" onBack={() => console.log('Back pressed')} />
+    <HeaderCompactStandard
+      title="Settings"
+      onBack={() => console.log('Back pressed')}
+    />
   ),
 };
 
 export const OnClose = {
   render: () => (
-    <HeaderCenter
+    <HeaderCompactStandard
       title="Modal Title"
       onClose={() => console.log('Close pressed')}
     />
@@ -51,7 +54,7 @@ export const OnClose = {
 
 export const BackAndClose = {
   render: () => (
-    <HeaderCenter
+    <HeaderCompactStandard
       title="Settings"
       onBack={() => console.log('Back pressed')}
       onClose={() => console.log('Close pressed')}
@@ -61,7 +64,7 @@ export const BackAndClose = {
 
 export const WithSubtitle = {
   render: () => (
-    <HeaderCenter
+    <HeaderCompactStandard
       title="Settings"
       subtitle="Account Settings"
       onBack={() => console.log('Back pressed')}
@@ -71,7 +74,7 @@ export const WithSubtitle = {
 
 export const MultipleEndButtons = {
   render: () => (
-    <HeaderCenter
+    <HeaderCompactStandard
       title="Search"
       onBack={() => console.log('Back pressed')}
       endButtonIconProps={[
@@ -87,11 +90,11 @@ export const MultipleEndButtons = {
 
 export const Children = {
   render: () => (
-    <HeaderCenter onClose={() => console.log('Close pressed')}>
+    <HeaderCompactStandard onClose={() => console.log('Close pressed')}>
       <Box twClassName="items-center">
         <Text variant={TextVariant.HeadingSm}>Custom Title</Text>
         <Text variant={TextVariant.BodySm}>Subtitle text</Text>
       </Box>
-    </HeaderCenter>
+    </HeaderCompactStandard>
   ),
 };