test: Refactor WalletView file (#10225)

<!--
Please submit this PR as a draft initially.
Do not mark it as "Ready for review" until the template has been
completely filled out, and PR status checks have passed at least once.
-->

## **Description**

Refactor the WalletView screen to follow the page object model as well
as the current guidelines establish by the QA mobile team. As well to
unify all the testIDs into one single object.

## **Summary**
*
app/component-library/components/Pickers/PickerAccount/PickerAccount.tsx:
Remove previous `generateTestId ` with current testID
`WalletViewSelectorsIDs.ACCOUNT_NAME_LABEL_TEXT`

*
app/component-library/components/Pickers/PickerNetwork/PickerNetwork.tsx:
Remove previous `generateTestId ` with current testID
`WalletViewSelectorsIDs.NAVBAR_NETWORK_TEXT `

* app/component-library/components/Toast/Toast.tsx: Remove previous
`generateTestId ` with current testID `ToastSelectorsIDs.CONTAINER`

* app/components/UI/AccountOverview/index.js: Remove `currentCurrency `,
`newAssetTransaction `, `toggleReceiveModal ` props causing lint issues.
Remove previous `generateTestId ` with current testID
`WalletViewSelectorsIDs.ACCOUNT_ICON`, `WalletViewSelectorsIDs.
ACCOUNT_NAME_LABEL_INPUT `, `WalletViewSelectorsIDs.
ACCOUNT_NAME_LABEL_TEXT `

* app/components/UI/AddressCopy/AddressCopy.tsx: Remove previous
`generateTestId ` with current testID
`WalletViewSelectorsIDs.ACCOUNT_COPY_BUTTON`, `WalletViewSelectorsIDs.
ACCOUNT_ADDRESS `

* app/components/UI/CollectibleContracts/index.js: Remove previous
`generateTestId ` with current testID `WalletViewSelectorsIDs.
IMPORT_NFT_BUTTON `, `WalletViewSelectorsIDs. NFT_TAB_CONTAINER `

* app/components/UI/Navbar/index.js: Remove previous `generateTestId `
with current testID `AddContactViewSelectorsIDs.EDIT_BUTTON `,
`WalletViewSelectorsIDs.NAVBAR_NETWORK_BUTTON `

* app/components/UI/Tokens/index.test.tsx: Update `getByTestId ` with
current testID `AddContactViewSelectorsIDs. IMPORT_TOKEN_BUTTON `,
`WalletViewSelectorsIDs. TOKENS_CONTAINER `

* app/components/UI/Tokens/index.tsx: Remove previous `generateTestId `
with current testID `AddContactViewSelectorsIDs. IMPORT_TOKEN_BUTTON `,
`WalletViewSelectorsIDs. TOKENS_CONTAINER `

* app/components/UI/WalletAccount/WalletAccount.test.tsx: Update
`getByTestId ` with current testID
`WalletViewSelectorsIDs.ACCOUNT_ADDRESS `, `WalletViewSelectorsIDs.
ACCOUNT_COPY_BUTTON `, `WalletViewSelectorsIDs. ACCOUNT_ICON `

* app/components/UI/WalletAccount/WalletAccount.tsx: Remove previous
`generateTestId ` with current testID
`WalletViewSelectorsIDs.ACCOUNT_ADDRESS `, `WalletViewSelectorsIDs.
ACCOUNT_COPY_BUTTON `, `WalletViewSelectorsIDs. ACCOUNT_ICON `

* app/components/Views/AccountActions/AccountActions.constants.ts: File
removed

* app/components/Views/AccountActions/AccountActions.test.tsx: Update
`getByTestId ` with current testIDs from
`AccountActionsModalSelectorsIDs` object.

* app/components/Views/AccountActions/AccountActions.tsx: Remove
previous `generateTestId ` with current testIDs from
`AccountActionsModalSelectorsIDs ` object.

* app/components/Views/TransactionsView/index.js: Remove
`generateTestId`

* app/components/Views/Wallet/index.test.tsx: Update `getByTestId ` with
current testID `CommonSelectorsIDs.FOX_ICON `,
`WalletViewSelectorsIDs.WALLET_SCAN_BUTTON`

* app/components/Views/Wallet/index.tsx: Remove `generateTestId`

* e2e/pages/Send/TransactionConfirmView.js: Remove `await` inside
`Gestures.waitAndTap()`

* e2e/pages/WalletView.js: File Relocated

* e2e/pages/wallet/WalletView.js: File refactor to POM 

* e2e/selectors/Common.selectors.js: Add `ANDROID_PROGRESS_BAR` testId

* e2e/selectors/Modals/AccountActionsModal.selectors.js: File created
with already existing testIDs

* e2e/selectors/TransactionConfirmView.selectors.js: Remove `eslint`
exception line

* e2e/selectors/wallet/WalletView.selectors.js: Added testIDs located in
other files.

* e2e/specs/accounts/create-wallet-account.spec.js: Update
`pages/wallet/WalletView` file path.

* e2e/specs/accounts/import-wallet-account.spec.js: Update
`pages/wallet/WalletView` file path. Update `WalletView.isVisible()` to
`Assertions.checkIfVisible(WalletView.container)`.

* e2e/specs/assets/import-tokens.spec.js: Update
`pages/wallet/WalletView` file path. Update `WalletView.isVisible()` to
`Assertions.checkIfVisible(WalletView.container)`. Implement
`WalletView.tokenInWallet()`.

* e2e/specs/assets/nft-detection-modal.spec.js: Update
`pages/wallet/WalletView` file path. Update `WalletView.isVisible()` to
`Assertions.checkIfVisible(WalletView.container)`.

* e2e/specs/assets/token-detection-import-all.spec.js: Due to some
inconsistencies when importing the wallet not showing the import token
button, I decided to implement the fixture steps.

* e2e/specs/confirmations/advanced-gas-fees.spec.js: Update
`pages/wallet/WalletView` file path. Update `WalletView.isVisible()` to
`Assertions.checkIfVisible(WalletView.container)`. Remove await inside
`await Assertions.checkIfVisible()`

* e2e/specs/confirmations/approve-custom-erc20.spec.js: Update
`Assertions. checkIfHasText()` to `Assertions.
checkIfElementToHaveText()`.

* e2e/specs/confirmations/increase-allowance-erc20.spec.js: Update
`WalletView.checkIfHasText()` to `Assertions.
checkIfElementToHaveText()`.

* e2e/specs/networks/add-custom-rpc.spec.js: 

* e2e/specs/networks/connect-test-network.spec.js: Update
`WalletView.isVisible()` to
`Assertions.checkIfVisible(WalletView.container)`. Update `Assertions.
checkIfHasText()` to `Assertions. checkIfElementToHaveText()`.

* e2e/specs/onboarding/onboarding-wizard-opt-in.spec.js: Update
`pages/wallet/WalletView` file path. Update `WalletView.isVisible()` to
`Assertions.checkIfVisible(WalletView.container)`.

* e2e/specs/permission-systems/permission-system-delete-wallet.spec.js:
Update `pages/wallet/WalletView` file path. Update
`WalletView.isVisible()` to
`Assertions.checkIfVisible(WalletView.container)`.

* e2e/specs/quarantine/add-edit-custom-eth-mainnet.failing.js: Implement
`Assertions.checkIfVisible(WalletView.container)`.

* e2e/specs/quarantine/contract-nickname.failing.js: Update
`pages/wallet/WalletView` file path. Update `WalletView.isVisible()` to
`Assertions.checkIfVisible(WalletView.container)`. Implement
`Assertions.checkIfVisible(WalletView.container)`.

* e2e/specs/quarantine/deeplinks.failing.js:

* e2e/specs/quarantine/import-nft.failing.js: Implement
`Assertions.checkIfVisible()`.

*
e2e/specs/quarantine/permission-system-removing-imported-account.failing.js:
Update `pages/wallet/WalletView` file path. Update
`WalletView.isVisible()` to
`Assertions.checkIfVisible(WalletView.container)`.

* e2e/specs/settings/fiat-on-testnets.spec.js: Update
`pages/wallet/WalletView` file path. Create `WalletView.totalBalance`.
Update `Assertions. checkIfHasText()` to `Assertions.
checkIfElementToHaveText()`.

* e2e/specs/swaps/swap-token-chart.spec.js: Update
`pages/wallet/WalletView` file path. Update `WalletView.isVisible()` to
`Assertions.checkIfVisible(WalletView.container)`.

* e2e/specs/swaps/token-details.spec.js: Update
`pages/wallet/WalletView` file path.

* e2e/specs/wallet/portfolio-connect-account.spec.js: Update
`pages/wallet/WalletView` file path. Update `Assertions.
checkIfHasText()` to `Assertions. checkIfElementToHaveText()`.

* e2e/specs/wallet/request-token-flow.spec.js: Update
`pages/wallet/WalletView` file path. Update `WalletView.isVisible()` to
`Assertions.checkIfVisible(WalletView.container)`.

* e2e/specs/wallet/send-ERC-token.spec.js: Update
`pages/wallet/WalletView` file path. Update `WalletView.isVisible()` to
`Assertions.checkIfVisible(WalletView.container)`.

* e2e/specs/wallet/start-exploring.spec.js: Remove deprecated steps

* e2e/utils/Assertions.js: Remove `checkIfHasText ` method. 

* e2e/viewHelper.js: Implement `Assertions.checkIfVisible()` for
`WalletView` and `NetworkEducationModal `. Add `await
Assertions.checkIfVisible(ToastModal.container)` steps

* wdio/screen-objects/AddContact.js: Update testIDs to current
implementation.

* wdio/screen-objects/CommonScreen.js: Update testIDs to current
implementation.

* wdio/screen-objects/Modals/WalletAccountModal.js: Update testIDs to
current implementation.

* wdio/screen-objects/WalletMainScreen.js: Update testIDs to current
implementation, fix naming issues.

* wdio/screen-objects/testIDs/Common.testIds.js: File removed

* wdio/screen-objects/testIDs/Screens/WalletView.testIds.js: Walletview
testIDs moved to unify file


<!--
Write a short description of the changes included in this pull request,
also include relevant motivation and context. Have in mind the following
questions:
1. What is the reason for the change?
2. What is the improvement/solution?
-->

## **Related issues**

Fixes: [#1848](MetaMask/mobile-planning#1848)

## **Manual testing steps**

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

## **Screenshots/Recordings**

<!-- If applicable, add screenshots and/or recordings to visualize the
before and after of your change. -->
Smoke test:
https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/558e5890-c45c-4d8f-bba4-f8c0456cb4d1
Regression test:
https://app.bitrise.io/app/be69d4368ee7e86d/pipelines/01e5fdff-34cf-4956-b54f-1588c4066139

### **Before**

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

### **After**

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

## **Pre-merge author checklist**

- [ ] I’ve followed [MetaMask Contributor
Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask Mobile
Coding
Standards](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/CODING_GUIDELINES.md).
- [ ] I've completed the PR template to the best of my ability
- [ ] 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.

## **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/component-library/components/Pickers/PickerAccount/PickerAccount.tsx

@@ -2,7 +2,7 @@
 
 // Third party dependencies.
 import React, { forwardRef } from 'react';
-import { Platform, TouchableOpacity, View } from 'react-native';
+import { TouchableOpacity, View } from 'react-native';
 
 // External dependencies.
 import Avatar, { AvatarSize, AvatarVariant } from '../../Avatars/Avatar';
@@ -15,8 +15,7 @@ import { strings } from '../../../../../locales/i18n';
 import PickerBase from '../PickerBase';
 import { PickerAccountProps } from './PickerAccount.types';
 import styleSheet from './PickerAccount.styles';
-import generateTestId from '../../../../../wdio/utils/generateTestId';
-import { WALLET_ACCOUNT_NAME_LABEL_TEXT } from '../../../../../wdio/screen-objects/testIDs/Screens/WalletView.testIds';
+import { WalletViewSelectorsIDs } from '../../../../../e2e/selectors/wallet/WalletView.selectors';
 
 const PickerAccount: React.ForwardRefRenderFunction<
   TouchableOpacity,
@@ -52,7 +51,7 @@ const PickerAccount: React.ForwardRefRenderFunction<
       <View style={styles.accountNameLabel}>
         <Text
           variant={TextVariant.HeadingSMRegular}
-          {...generateTestId(Platform, WALLET_ACCOUNT_NAME_LABEL_TEXT)}
+          testID={WalletViewSelectorsIDs.ACCOUNT_NAME_LABEL_TEXT}
         >
           {accountName}
         </Text>

app/component-library/components/Pickers/PickerNetwork/PickerNetwork.tsx

@@ -2,7 +2,7 @@
 
 // Third party dependencies.
 import React from 'react';
-import { Platform, TouchableOpacity } from 'react-native';
+import { TouchableOpacity } from 'react-native';
 
 // External dependencies.
 import Avatar, { AvatarSize, AvatarVariant } from '../../Avatars/Avatar';
@@ -13,8 +13,7 @@ import { useStyles } from '../../../hooks';
 // Internal dependencies.
 import { PickerNetworkProps } from './PickerNetwork.types';
 import stylesheet from './PickerNetwork.styles';
-import generateTestId from '../../../../../wdio/utils/generateTestId';
-import { NAVBAR_NETWORK_TEXT } from '../../../../../wdio/screen-objects/testIDs/Screens/WalletView.testIds';
+import { WalletViewSelectorsIDs } from '../../../../../e2e/selectors/wallet/WalletView.selectors';
 import { PICKERNETWORK_ARROW_TESTID } from './PickerNetwork.constants';
 
 const PickerNetwork = ({
@@ -38,7 +37,7 @@ const PickerNetwork = ({
         style={styles.label}
         numberOfLines={1}
         variant={TextVariant.BodyMD}
-        {...generateTestId(Platform, NAVBAR_NETWORK_TEXT)}
+        testID={WalletViewSelectorsIDs.NAVBAR_NETWORK_TEXT}
       >
         {label}
       </Text>

app/component-library/components/Toast/Toast.tsx

@@ -10,7 +10,6 @@ import React, {
 import {
   Dimensions,
   LayoutChangeEvent,
-  Platform,
   StyleProp,
   View,
   ViewStyle,
@@ -39,8 +38,7 @@ import {
   ToastVariants,
 } from './Toast.types';
 import styles from './Toast.styles';
-import generateTestId from '../../../../wdio/utils/generateTestId';
-import { TOAST_ID } from '../../../../wdio/screen-objects/testIDs/Common.testIds';
+import { ToastSelectorsIDs } from '../../../../e2e/selectors/Modals/ToastModal.selectors';
 import { ButtonProps } from '../Buttons/Button/Button.types';
 
 const visibilityDuration = 2750;
@@ -210,7 +208,7 @@ const Toast = forwardRef((_, ref: React.ForwardedRef<ToastRef>) => {
         {renderAvatar()}
         <View
           style={styles.labelsContainer}
-          {...generateTestId(Platform, TOAST_ID)}
+          testID={ToastSelectorsIDs.CONTAINER}
         >
           {renderLabel(labelOptions)}
           {renderButtonLink(linkButtonOptions)}

app/components/UI/AccountOverview/index.js

@@ -2,7 +2,6 @@ import PropTypes from 'prop-types';
 import React, { PureComponent } from 'react';
 import {
   InteractionManager,
-  Platform,
   ScrollView,
   StyleSheet,
   TextInput,
@@ -11,12 +10,7 @@ import {
 } from 'react-native';
 import { connect } from 'react-redux';
 import { strings } from '../../../../locales/i18n';
-import {
-  WALLET_ACCOUNT_ICON,
-  WALLET_ACCOUNT_NAME_LABEL_INPUT,
-  WALLET_ACCOUNT_NAME_LABEL_TEXT,
-} from '../../../../wdio/screen-objects/testIDs/Screens/WalletView.testIds';
-import generateTestId from '../../../../wdio/utils/generateTestId';
+import { WalletViewSelectorsIDs } from '../../../../e2e/selectors/wallet/WalletView.selectors';
 import { showAlert } from '../../../actions/alert';
 import { toggleReceiveModal } from '../../../actions/modals';
 import { newAssetTransaction } from '../../../actions/transaction';
@@ -168,10 +162,6 @@ class AccountOverview extends PureComponent {
      */
     account: PropTypes.object,
     /**
-    /* Selected currency
-    */
-    currentCurrency: PropTypes.string,
-    /**
     /* Triggers global alert
     */
     showAlert: PropTypes.func,
@@ -187,19 +177,11 @@ class AccountOverview extends PureComponent {
      * Prompts protect wallet modal
      */
     protectWalletModalVisible: PropTypes.func,
-    /**
-     * Start transaction with asset
-     */
-    newAssetTransaction: PropTypes.func,
     /**
     /* navigation object required to access the props
     /* passed by the parent component
     */
     navigation: PropTypes.object,
-    /**
-     * Action that toggles the receive modal
-     */
-    toggleReceiveModal: PropTypes.func,
     /**
      * The chain ID for the current selected network
      */
@@ -373,7 +355,7 @@ class AccountOverview extends PureComponent {
               style={styles.identiconBorder}
               disabled={onboardingWizard}
               onPress={this.openAccountSelector}
-              {...generateTestId(Platform, WALLET_ACCOUNT_ICON)}
+              testID={WalletViewSelectorsIDs.ACCOUNT_ICON}
             >
               <Identicon
                 address={address}
@@ -400,7 +382,7 @@ class AccountOverview extends PureComponent {
                   onChangeText={this.onAccountLabelChange}
                   onSubmitEditing={this.setAccountLabel}
                   onBlur={this.setAccountLabel}
-                  {...generateTestId(Platform, WALLET_ACCOUNT_NAME_LABEL_INPUT)}
+                  testID={WalletViewSelectorsIDs.ACCOUNT_NAME_LABEL_INPUT}
                   value={accountLabel}
                   selectTextOnFocus
                   ref={this.input}
@@ -425,10 +407,7 @@ class AccountOverview extends PureComponent {
                         },
                       ]}
                       numberOfLines={1}
-                      {...generateTestId(
-                        Platform,
-                        WALLET_ACCOUNT_NAME_LABEL_TEXT,
-                      )}
+                      testID={WalletViewSelectorsIDs.ACCOUNT_NAME_LABEL_TEXT}
                     >
                       {isDefaultAccountName(name) && ens ? ens : name}
                     </Text>

app/components/UI/AddressCopy/AddressCopy.tsx

@@ -18,10 +18,10 @@ import ClipboardManager from '../../../core/ClipboardManager';
 import { showAlert } from '../../../actions/alert';
 import { protectWalletModalVisible } from '../../../actions/user';
 import { strings } from '../../../../locales/i18n';
-import { Platform, View } from 'react-native';
+import { View } from 'react-native';
 import { MetaMetricsEvents } from '../../../core/Analytics';
 import { useStyles } from '../../../component-library/hooks';
-import generateTestId from '../../../../wdio/utils/generateTestId';
+import { WalletViewSelectorsIDs } from '../../../../e2e/selectors/wallet/WalletView.selectors';
 
 // Internal dependencies
 import styleSheet from './AddressCopy.styles';
@@ -75,12 +75,12 @@ const AddressCopy = ({ formatAddressType = 'full' }: AddressCopyProps) => {
       <TouchableOpacity
         style={styles.copyButton}
         onPress={copyAccountToClipboard}
-        {...generateTestId(Platform, 'wallet-account-copy-button')}
+        testID={WalletViewSelectorsIDs.ACCOUNT_COPY_BUTTON}
       >
         <Text
           color={TextColor.Primary}
           variant={TextVariant.BodySM}
-          {...generateTestId(Platform, 'wallet-account-address')}
+          testID={WalletViewSelectorsIDs.ACCOUNT_ADDRESS}
         >
           {selectedInternalAccount
             ? formatAddress(selectedInternalAccount.address, formatAddressType)

app/components/UI/CollectibleContracts/index.js

@@ -5,7 +5,6 @@ import {
   StyleSheet,
   View,
   Image,
-  Platform,
   FlatList,
   RefreshControl,
   ActivityIndicator,
@@ -30,7 +29,6 @@ import { compareTokenIds } from '../../../util/tokens';
 import CollectibleDetectionModal from '../CollectibleDetectionModal';
 import { useTheme } from '../../../util/theme';
 import { MAINNET } from '../../../constants/network';
-import generateTestId from '../../../../wdio/utils/generateTestId';
 import {
   selectChainId,
   selectProviderType,
@@ -41,10 +39,7 @@ import {
   selectUseNftDetection,
 } from '../../../selectors/preferencesController';
 import { selectSelectedInternalAccountChecksummedAddress } from '../../../selectors/accountsController';
-import {
-  IMPORT_NFT_BUTTON_ID,
-  NFT_TAB_CONTAINER_ID,
-} from '../../../../wdio/screen-objects/testIDs/Screens/WalletView.testIds';
+import { WalletViewSelectorsIDs } from '../../../../e2e/selectors/wallet/WalletView.selectors';
 import { useMetrics } from '../../../components/hooks/useMetrics';
 import { RefreshTestId, SpinnerTestId } from './constants';
 
@@ -239,7 +234,7 @@ const CollectibleContracts = ({
         <TouchableOpacity
           onPress={goToAddCollectible}
           disabled={!isAddNFTEnabled}
-          {...generateTestId(Platform, IMPORT_NFT_BUTTON_ID)}
+          testID={WalletViewSelectorsIDs.IMPORT_NFT_BUTTON}
         >
           <Text style={styles.addText}>
             {strings('wallet.add_collectibles')}
@@ -376,7 +371,7 @@ const CollectibleContracts = ({
   return (
     <View
       style={styles.wrapper}
-      {...generateTestId(Platform, NFT_TAB_CONTAINER_ID)}
+      testID={WalletViewSelectorsIDs.NFT_TAB_CONTAINER}
     >
       {renderList()}
     </View>

app/components/UI/Navbar/index.js

@@ -27,12 +27,10 @@ import Device from '../../../util/device';
 import PickerNetwork from '../../../component-library/components/Pickers/PickerNetwork';
 import BrowserUrlBar from '../BrowserUrlBar';
 import generateTestId from '../../../../wdio/utils/generateTestId';
-import { NAVBAR_NETWORK_BUTTON } from '../../../../wdio/screen-objects/testIDs/Screens/WalletView.testIds';
 import { NAV_ANDROID_BACK_BUTTON } from '../../../../wdio/screen-objects/testIDs/Screens/NetworksScreen.testids';
 import { ASSET_BACK_BUTTON } from '../../../../wdio/screen-objects/testIDs/Screens/TokenOverviewScreen.testIds';
 import { REQUEST_SEARCH_RESULTS_BACK_BUTTON } from '../../../../wdio/screen-objects/testIDs/Screens/RequestToken.testIds';
 import { BACK_BUTTON_SIMPLE_WEBVIEW } from '../../../../wdio/screen-objects/testIDs/Components/SimpleWebView.testIds';
-import { EDIT_BUTTON } from '../../../../wdio/screen-objects/testIDs/Common.testIds';
 import Routes from '../../../constants/navigation/Routes';
 
 import ButtonIcon, {
@@ -53,6 +51,7 @@ import { NetworksViewSelectorsIDs } from '../../../../e2e/selectors/Settings/Net
 import { SendLinkViewSelectorsIDs } from '../../../../e2e/selectors/SendLinkView.selectors';
 import { SendViewSelectorsIDs } from '../../../../e2e/selectors/SendView.selectors';
 import { getBlockaidTransactionMetricsParams } from '../../../util/blockaid';
+import { AddContactViewSelectorsIDs } from '../../../../e2e/selectors/Settings/Contacts/AddContactView.selectors';
 
 const trackEvent = (event, params = {}) => {
   MetaMetrics.getInstance().trackEvent(event, params);
@@ -290,7 +289,7 @@ export function getEditableOptions(title, navigation, route, themeColors) {
         <TouchableOpacity
           onPress={rightAction}
           style={styles.backButton}
-          {...generateTestId(Platform, EDIT_BUTTON)}
+          testID={AddContactViewSelectorsIDs.EDIT_BUTTON}
         >
           <Text style={innerStyles.headerButtonText}>
             {editMode
@@ -984,7 +983,7 @@ export function getWalletNavbarOptions(
           label={networkName}
           imageSource={networkImageSource}
           onPress={onPressTitle}
-          {...generateTestId(Platform, NAVBAR_NETWORK_BUTTON)}
+          testID={WalletViewSelectorsIDs.NAVBAR_NETWORK_BUTTON}
         />
       </View>
     ),

app/components/UI/Tokens/index.test.tsx

@@ -6,11 +6,7 @@ import { BN } from 'ethereumjs-util';
 import renderWithProvider from '../../../util/test/renderWithProvider';
 import { createStackNavigator } from '@react-navigation/stack';
 import Engine from '../../../core/Engine';
-import {
-  getAssetTestId,
-  IMPORT_TOKEN_BUTTON_ID,
-  MAIN_WALLET_VIEW_VIA_TOKENS_ID,
-} from '../../../../wdio/screen-objects/testIDs/Screens/WalletView.testIds';
+import { getAssetTestId } from '../../../../wdio/screen-objects/testIDs/Screens/WalletView.testIds';
 import { backgroundState } from '../../../util/test/initial-root-state';
 import { strings } from '../../../../locales/i18n';
 import AppConstants from '../../../../app/core/AppConstants';
@@ -173,14 +169,14 @@ describe('Tokens', () => {
 
   it('navigates to AddAsset screen when Add Tokens button is pressed', () => {
     const { getByTestId } = renderComponent(initialState);
-    fireEvent.press(getByTestId(IMPORT_TOKEN_BUTTON_ID));
+    fireEvent.press(getByTestId(WalletViewSelectorsIDs.IMPORT_TOKEN_BUTTON));
     expect(mockPush).toHaveBeenCalledWith('AddAsset', { assetType: 'token' });
   });
 
   it('shows remove menu when remove button is pressed', () => {
     const { getByTestId, queryAllByTestId } = renderComponent(initialState);
     fireEvent.press(queryAllByTestId(getAssetTestId('BAT'))[0], 'longPress');
-    expect(getByTestId(MAIN_WALLET_VIEW_VIA_TOKENS_ID)).toBeDefined();
+    expect(getByTestId(WalletViewSelectorsIDs.TOKENS_CONTAINER)).toBeDefined();
   });
 
   it('fiat balance must be defined', () => {

app/components/UI/Tokens/index.tsx

@@ -3,7 +3,6 @@ import React, { useRef, useState, LegacyRef } from 'react';
 import {
   TouchableOpacity,
   View,
-  Platform,
   FlatList,
   RefreshControl,
   Pressable,
@@ -34,11 +33,6 @@ import {
   isMainnetByChainId,
   isTestNet,
 } from '../../../util/networks';
-import generateTestId from '../../../../wdio/utils/generateTestId';
-import {
-  IMPORT_TOKEN_BUTTON_ID,
-  MAIN_WALLET_VIEW_VIA_TOKENS_ID,
-} from '../../../../wdio/screen-objects/testIDs/Screens/WalletView.testIds';
 import {
   selectChainId,
   selectNetworkClientId,
@@ -289,7 +283,7 @@ const Tokens: React.FC<TokensI> = ({ tokens }) => {
         style={styles.add}
         onPress={goToAddToken}
         disabled={!isAddTokenEnabled}
-        {...generateTestId(Platform, IMPORT_TOKEN_BUTTON_ID)}
+        testID={WalletViewSelectorsIDs.IMPORT_TOKEN_BUTTON}
       >
         <Text style={styles.centered}>
           <Text style={styles.emptyText}>
@@ -717,7 +711,7 @@ const Tokens: React.FC<TokensI> = ({ tokens }) => {
   return (
     <View
       style={styles.wrapper}
-      {...generateTestId(Platform, MAIN_WALLET_VIEW_VIA_TOKENS_ID)}
+      testID={WalletViewSelectorsIDs.TOKENS_CONTAINER}
     >
       {tokens?.length ? renderList() : renderEmpty()}
       <ActionSheet

app/components/UI/WalletAccount/WalletAccount.test.tsx

@@ -14,6 +14,7 @@ import {
   internalAccount2,
   expectedUuid2,
 } from '../../../util/test/accountsControllerTestUtils';
+import { WalletViewSelectorsIDs } from '../../../../e2e/selectors/wallet/WalletView.selectors';
 
 // Internal dependencies
 import WalletAccount from './WalletAccount';
@@ -111,15 +112,15 @@ describe('WalletAccount', () => {
     const { getByTestId } = renderWithProvider(<WalletAccount />, {
       state: mockInitialState,
     });
-    expect(getByTestId('wallet-account-address')).toBeDefined();
+    expect(getByTestId(WalletViewSelectorsIDs.ACCOUNT_ADDRESS)).toBeDefined();
   });
 
   it('copies the account address to the clipboard when the copy button is pressed', async () => {
     const { getByTestId } = renderWithProvider(<WalletAccount />, {
       state: mockInitialState,
     });
 
-    fireEvent.press(getByTestId('wallet-account-copy-button'));
+    fireEvent.press(getByTestId(WalletViewSelectorsIDs.ACCOUNT_COPY_BUTTON));
     expect(ClipboardManager.setString).toHaveBeenCalledTimes(1);
   });
 
@@ -128,7 +129,7 @@ describe('WalletAccount', () => {
       state: mockInitialState,
     });
 
-    fireEvent.press(getByTestId('account-picker'));
+    fireEvent.press(getByTestId(WalletViewSelectorsIDs.ACCOUNT_ICON));
     expect(mockNavigate).toHaveBeenCalledWith(
       ...createAccountSelectorNavDetails({}),
     );