test: batch 1 remove strings testid app code (#8011)

## **Description**
Replace all string definitions used for testIDs. These files should no
longer selector strings in the TestID prop:

- app/component-library/components/Icons/Icon/Icon.test.tsx
- app/components/UI/AccountOverview/index.js
- app/components/UI/AccountRightButton/index.tsx
- app/components/UI/AddCustomCollectible/index.tsx
- app/components/UI/AddressInputs/index.js
- app/components/UI/ApproveTransactionReview/index.js
- app/components/UI/AssetList/index.js



## **Related issues**

Fixes: 7865

## **Manual testing steps**

1. Go to this page...
2.
3.

## **Screenshots/Recordings**

- Regression test run:
https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/17d88968-f5ee-4f2c-956f-b0d731e43226
- Smoke test run:
https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/3ad78d3e-e3f9-4b10-9cf4-493755dd3ae8

### **Before**

<!-- [screenshots/recordings] -->

### **After**

<!-- [screenshots/recordings] -->

## **Pre-merge author checklist**

- [ ] I’ve followed [MetaMask Coding
Standards](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/CODING_GUIDELINES.md).
- [ ] I've clearly explained what problem this PR is solving and how it
is solved.
- [ ] I've linked related issues
- [ ] I've included manual testing steps
- [ ] I've included screenshots/recordings if applicable
- [ ] I’ve included tests if applicable
- [ ] I’ve documented my code using [JSDoc](https://jsdoc.app/) format
if applicable
- [ ] I’ve applied the right labels on the PR (see [labeling
guidelines](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/LABELING_GUIDELINES.md)).
Not required for external contributors.
- [ ] I’ve properly set the pull request status:
  - [ ] In case it's not yet "ready for review", I've set it to "draft".
- [ ] In case it's "ready for review", I've changed it from "draft" to
"non-draft".

## **Pre-merge reviewer checklist**

- [ ] I've manually tested the PR (e.g. pull and build branch, run the
app, test code being changed).
- [ ] I confirm that this PR addresses all acceptance criteria described
in the ticket it closes and includes the necessary testing evidence such
as recordings and or screenshots.

app/components/UI/AccountOverview/index.js

@@ -47,7 +47,7 @@ import {
   selectSelectedAddress,
 } from '../../../selectors/preferencesController';
 import { createAccountSelectorNavDetails } from '../../Views/AccountSelector';
-import { regex } from '../../../../app/util/regex';
+import { regex } from '../../../util/regex';
 import Text, {
   TextVariant,
 } from '../../../component-library/components/Texts/Text';
@@ -363,7 +363,6 @@ class AccountOverview extends PureComponent {
           keyboardShouldPersistTaps={'never'}
           style={styles.scrollView}
           contentContainerStyle={styles.wrapper}
-          testID={'account-overview'}
         >
           <View style={styles.info} ref={this.mainView}>
             <TouchableOpacity

app/components/UI/AccountRightButton/index.tsx

@@ -36,6 +36,7 @@ import { selectProviderConfig } from '../../../selectors/networkController';
 import Routes from '../../../constants/navigation/Routes';
 import { MetaMetricsEvents } from '../../../core/Analytics';
 import Analytics from '../../../core/Analytics/Analytics';
+import { AccountOverviewSelectorsIDs } from '../../../../e2e/selectors/AccountOverview.selectors';
 
 const styles = StyleSheet.create({
   leftButton: {
@@ -161,7 +162,7 @@ const AccountRightButton = ({
     <TouchableOpacity
       style={styles.leftButton}
       onPress={handleButtonPress}
-      testID={'navbar-account-button'}
+      testID={AccountOverviewSelectorsIDs.ACCOUNT_BUTTON}
     >
       <TextInput style={styles.placeholderInput} ref={placeholderInputRef} />
       {selectedAddress ? (

app/components/UI/AddCustomCollectible/index.tsx

@@ -219,8 +219,6 @@ const AddCustomCollectible = ({
       {...generateTestId(Platform, CUSTOM_TOKEN_CONTAINER_ID)}
     >
       <ActionView
-        cancelTestID={'add-custom-asset-cancel-button'}
-        confirmTestID={'add-custom-asset-confirm-button'}
         cancelText={strings('add_asset.collectibles.cancel_add_collectible')}
         confirmText={strings('add_asset.collectibles.add_collectible')}
         onCancelPress={cancelAddCollectible}

app/components/UI/AddressInputs/index.js

@@ -1,11 +1,5 @@
 import React from 'react';
-import {
-  StyleSheet,
-  View,
-  TextInput,
-  TouchableOpacity,
-  Platform,
-} from 'react-native';
+import { StyleSheet, View, TextInput, TouchableOpacity } from 'react-native';
 import { fontStyles, baseStyles } from '../../../styles/common';
 import AntIcon from 'react-native-vector-icons/AntDesign';
 import FontAwesome from 'react-native-vector-icons/FontAwesome';
@@ -20,8 +14,6 @@ import {
 import { strings } from '../../../../locales/i18n';
 import { hasZeroWidthPoints } from '../../../util/confusables';
 import { useTheme } from '../../../util/theme';
-import generateTestId from '../../../../wdio/utils/generateTestId';
-import { SEND_ADDRESS_INPUT_FIELD } from '../../../../wdio/screen-objects/testIDs/Screens/SendScreen.testIds';
 import AddToAddressBookWrapper from '../AddToAddressBookWrapper/AddToAddressBookWrapper';
 import { SendViewSelectorsIDs } from '../../../../e2e/selectors/SendView.selectors';
 import Text, {
@@ -363,7 +355,7 @@ export const AddressTo = (props) => {
               onBlur={onInputBlur}
               onSubmitEditing={onSubmit}
               value={toSelectedAddress}
-              {...generateTestId(Platform, SEND_ADDRESS_INPUT_FIELD)}
+              testID={SendViewSelectorsIDs.ADDRESS_INPUT}
               keyboardAppearance={themeAppearance}
             />
           </View>
@@ -468,7 +460,7 @@ export const AddressTo = (props) => {
                   onBlur={onInputBlur}
                   onSubmitEditing={onSubmit}
                   value={toAddressName}
-                  testID={'txn-to-address-input'}
+                  testID={SendViewSelectorsIDs.ADDRESS_INPUT}
                   keyboardAppearance={themeAppearance}
                 />
               ) : (

app/components/UI/ApproveTransactionReview/index.js

@@ -9,7 +9,7 @@ import {
 import Eth from 'ethjs-query';
 import ActionView from '../../UI/ActionView';
 import PropTypes from 'prop-types';
-import { getApproveNavbar } from '../../UI/Navbar';
+import { getApproveNavbar } from '../Navbar';
 import { connect } from 'react-redux';
 import { getHost } from '../../../util/browser';
 import {
@@ -98,7 +98,7 @@ import { getRampNetworks } from '../../../reducers/fiatOrders';
 import SkeletonText from '../Ramp/common/components/SkeletonText';
 import InfoModal from '../../../components/UI/Swaps/components/InfoModal';
 import TransactionBlockaidBanner from '../TransactionBlockaidBanner/TransactionBlockaidBanner';
-import { regex } from '../../../../app/util/regex';
+import { regex } from '../../../util/regex';
 
 const { ORIGIN_DEEPLINK, ORIGIN_QR_CODE } = AppConstants.DEEPLINKS;
 const POLLING_INTERVAL_ESTIMATED_L1_FEE = 30000;
@@ -784,7 +784,7 @@ class ApproveTransactionReview extends PureComponent {
 
     return (
       <>
-        <View style={styles.section} testID={'approve-modal-test-id'}>
+        <View style={styles.section}>
           {from && (
             <ApproveTransactionHeader
               dontWatchAsset
@@ -821,11 +821,7 @@ class ApproveTransactionReview extends PureComponent {
                         onContactUsClicked={this.onContactUsClicked}
                       />
                     )}
-                    <Text
-                      variant={TextVariant.HeadingMD}
-                      style={styles.title}
-                      testID={'allow-access'}
-                    >
+                    <Text variant={TextVariant.HeadingMD} style={styles.title}>
                       {strings(
                         `spend_limit_edition.${
                           originIsDeeplink
@@ -1185,7 +1181,7 @@ class ApproveTransactionReview extends PureComponent {
     } = this.props;
     const styles = this.getStyles();
     return (
-      <View style={styles.actionViewQRObject} testID={'qr-details'}>
+      <View style={styles.actionViewQRObject}>
         <TransactionHeader
           currentPageInformation={{
             origin,

app/components/UI/AssetList/index.js

@@ -1,13 +1,12 @@
 import React, { PureComponent } from 'react';
-import { View, StyleSheet, Platform } from 'react-native';
+import { View, StyleSheet } from 'react-native';
 import PropTypes from 'prop-types';
 import { strings } from '../../../../locales/i18n';
 import StyledButton from '../StyledButton'; // eslint-disable-line  import/no-unresolved
 import AssetIcon from '../AssetIcon';
 import { fontStyles } from '../../../styles/common';
 import Text from '../../Base/Text';
-import generateTestId from '../../../../wdio/utils/generateTestId';
-import { TOKEN_RESULTS_LIST_ID } from '../../../../wdio/screen-objects/testIDs/Screens/AssetSearch.testIds';
+import { ImportTokenViewSelectorsIDs } from '../../../../e2e/selectors/ImportTokenView.selectors';
 
 const styles = StyleSheet.create({
   rowWrapper: {
@@ -81,7 +80,7 @@ export default class AssetList extends PureComponent {
               containerStyle={styles.item}
               onPress={() => handleSelectAsset(searchResults[i])} // eslint-disable-line
               key={i}
-              {...generateTestId(Platform, TOKEN_RESULTS_LIST_ID)}
+              testID={ImportTokenViewSelectorsIDs.CONTAINER}
             >
               <View style={styles.assetListElement}>
                 <AssetIcon address={address} logo={iconUrl} />

app/components/Views/AddAsset/__snapshots__/AddAsset.test.tsx.snap

@@ -315,7 +315,7 @@ exports[`AddAsset component renders correctly 1`] = `
                   null,
                 ]
               }
-              testID="add-custom-asset-cancel-button"
+              testID=""
             >
               <Text
                 style={
@@ -378,7 +378,7 @@ exports[`AddAsset component renders correctly 1`] = `
                   },
                 ]
               }
-              testID="add-custom-asset-confirm-button"
+              testID=""
             >
               <Text
                 style={

e2e/pages/Drawer/Browser.js

@@ -8,7 +8,6 @@ import {
   SEARCH_BUTTON,
   NAVBAR_TITLE_NETWORK,
   ANDROID_BROWSER_WEBVIEW_ID,
-  ACCOUNT_BUTTON,
 } from '../../../wdio/screen-objects/testIDs/BrowserScreen/BrowserScreen.testIds';
 import { URL_INPUT_BOX_ID } from '../../../wdio/screen-objects/testIDs/BrowserScreen/AddressBar.testIds';
 import {
@@ -26,6 +25,7 @@ import {
   BrowserViewSelectorsText,
 } from '../../selectors/BrowserView.selectors';
 import { CommonSelectorsText } from '../../selectors/Common.selectors';
+import { AccountOverviewSelectorsIDs } from '../../selectors/AccountOverview.selectors';
 
 const TEST_DAPP = 'https://metamask.github.io/test-dapp/';
 
@@ -60,7 +60,7 @@ export default class Browser {
     if (device.getPlatform() === 'android') {
       await TestHelpers.delay(3000); // to wait until toast notifcation disappears
       await TestHelpers.tapByDescendentTestID(
-        ACCOUNT_BUTTON,
+        AccountOverviewSelectorsIDs.ACCOUNT_BUTTON,
         BrowserViewSelectorsIDs.AVATAR_IMAGE,
       );
     } else {

e2e/pages/ImportTokensView.js

@@ -2,10 +2,12 @@ import TestHelpers from '../helpers';
 import { CUSTOM_TOKEN_CONTAINER_ID } from '../../wdio/screen-objects/testIDs/Screens/AddCustomToken.testIds';
 import {
   ASSET_BACK_BUTTON,
-  TOKEN_RESULTS_LIST_ID,
   TOKEN_INPUT_BOX_ID,
 } from '../../wdio/screen-objects/testIDs/Screens/AssetSearch.testIds';
-import { ImportTokenViewSelectorsText } from '../selectors/ImportTokenView.selectors';
+import {
+  ImportTokenViewSelectorsIDs,
+  ImportTokenViewSelectorsText,
+} from '../selectors/ImportTokenView.selectors';
 
 export default class ImportTokensView {
   static async tapImportButton() {
@@ -24,9 +26,11 @@ export default class ImportTokensView {
   }
   static async tapOnToken() {
     if (device.getPlatform() === 'android') {
-      await TestHelpers.tapItemAtIndexByLabel(TOKEN_RESULTS_LIST_ID);
+      await TestHelpers.tapItemAtIndexByLabel(
+        ImportTokenViewSelectorsIDs.CONTAINER,
+      );
     } else {
-      await TestHelpers.tapItemAtIndex(TOKEN_RESULTS_LIST_ID);
+      await TestHelpers.tapItemAtIndex(ImportTokenViewSelectorsIDs.CONTAINER);
     }
   }
 

e2e/selectors/AccountOverview.selectors.js

@@ -0,0 +1,4 @@
+// eslint-disable-next-line import/prefer-default-export
+export const AccountOverviewSelectorsIDs = {
+  ACCOUNT_BUTTON: 'navbar-account-button',
+};

e2e/selectors/ImportTokenView.selectors.js

@@ -1,6 +1,9 @@
 import messages from '../../locales/languages/en.json';
 
-// eslint-disable-next-line import/prefer-default-export
+export const ImportTokenViewSelectorsIDs = {
+  CONTAINER: 'searched-token-result',
+};
+
 export const ImportTokenViewSelectorsText = {
   IMPORT_BUTTON: messages.add_asset.tokens.add_token,
   CANCEL_BUTTON: messages.add_asset.tokens.cancel_add_token,

e2e/selectors/SendView.selectors.js

@@ -6,4 +6,5 @@ export const SendViewSelectorsIDs = {
   ADDRESS_REMOVE_BUTTON: 'clear-address-button',
   ADDRESS_BOOK_ACCOUNT: 'address-book-account',
   ADDRESS_BOOK_NEXT_BUTTON: 'address-book-next-button',
+  ADDRESS_INPUT: 'txn-to-address-input',
 };

wdio/screen-objects/testIDs/Screens/AssetSearch.testIds.js

@@ -1,5 +1,2 @@
 export const TOKEN_INPUT_BOX_ID = 'input-search-asset';
 export const ASSET_BACK_BUTTON = 'asset-back-button';
-export const TOKEN_RESULTS_LIST_ID = 'searched-token-result';
-export const ADD_SEARCHED_TOKEN = 'add-searched-token-screen';
-