diff --git a/app/components/Views/Settings/NetworksSettings/NetworkSettings/index.js b/app/components/Views/Settings/NetworksSettings/NetworkSettings/index.js index 17e68d679a7..67815bae912 100644 --- a/app/components/Views/Settings/NetworksSettings/NetworkSettings/index.js +++ b/app/components/Views/Settings/NetworksSettings/NetworkSettings/index.js @@ -2065,6 +2065,7 @@ export class NetworkSettings extends PureComponent { { + this.onBlockExplorerItemAdd(blockExplorerUrlForm); + }} keyboardAppearance={themeAppearance} /> {blockExplorerUrl && @@ -2247,6 +2250,7 @@ export class NetworkSettings extends PureComponent { { this.onBlockExplorerItemAdd(blockExplorerUrlForm); @@ -2324,6 +2328,7 @@ export class NetworkSettings extends PureComponent { this.openAddBlockExplorerForm(); this.closeBlockExplorerModal(); }} + testID={NetworksViewSelectorsIDs.ADD_BLOCK_EXPLORER} width={ButtonWidthTypes.Auto} labelTextVariant={TextVariant.DisplayMD} /> diff --git a/e2e/pages/Settings/NetworksView.js b/e2e/pages/Settings/NetworksView.js index 5ab1cdde96d..5747627980e 100644 --- a/e2e/pages/Settings/NetworksView.js +++ b/e2e/pages/Settings/NetworksView.js @@ -27,6 +27,16 @@ class NetworkView { return Matchers.getElementByID(NetworksViewSelectorsIDs.ICON_BUTTON_RPC); } + get addBlockExplorerDropDownButton() { + return Matchers.getElementByID( + NetworksViewSelectorsIDs.ICON_BUTTON_BLOCK_EXPLORER, + ); + } + + get addBlockExplorerButton() { + return Matchers.getElementByID(NetworksViewSelectorsIDs.ADD_BLOCK_EXPLORER); + } + get addRpcButton() { return Matchers.getElementByID(NetworksViewSelectorsIDs.ADD_RPC_BUTTON); } @@ -91,6 +101,12 @@ class NetworkView { ); } + get networkBlockExplorerInput() { + return Matchers.getElementByID( + NetworksViewSelectorsIDs.BLOCK_EXPLORER_INPUT, + ); + } + get rpcAddButton() { return Matchers.getElementByID( NetworksViewSelectorsIDs.ADD_CUSTOM_NETWORK_BUTTON, @@ -138,6 +154,14 @@ class NetworkView { await Gestures.waitAndTap(this.addRpcDropDownButton); } + async tapBlockExplorerDownButton() { + await Gestures.waitAndTap(this.addBlockExplorerDropDownButton); + } + + async tapBlockExplorerButton() { + await Gestures.waitAndTap(this.addBlockExplorerButton); + } + async tapAddRpcButton() { await Gestures.waitAndTap(this.addRpcButton); } @@ -192,6 +216,13 @@ class NetworkView { ); } + async typeInNetworkBlockExplorer(networkBlockExplorer) { + await Gestures.typeTextAndHideKeyboard( + this.networkBlockExplorerInput, + networkBlockExplorer, + ); + } + async clearRpcInputBox() { await Gestures.clearField(this.rpcURLInput); } diff --git a/e2e/resources/networks.e2e.js b/e2e/resources/networks.e2e.js index a348bded2e6..fd6fc94a4a7 100644 --- a/e2e/resources/networks.e2e.js +++ b/e2e/resources/networks.e2e.js @@ -1,4 +1,4 @@ -import { toHex } from '@metamask/controller-utils'; +import { BlockExplorerUrl, toHex } from '@metamask/controller-utils'; /* eslint-disable @typescript-eslint/no-require-imports, import/no-commonjs */ const InfuraKey = process.env.MM_INFURA_PROJECT_ID; @@ -109,6 +109,7 @@ const CustomNetworks = { rpcUrl: 'https://rpc.gnosischain.com', nickname: 'Gnosis', ticker: 'xDAI', + BlockExplorerUrl: 'https://gnosisscan.io', }, }, }; diff --git a/e2e/selectors/Settings/NetworksView.selectors.js b/e2e/selectors/Settings/NetworksView.selectors.js index 85926b42264..0f8b32eb68d 100644 --- a/e2e/selectors/Settings/NetworksView.selectors.js +++ b/e2e/selectors/Settings/NetworksView.selectors.js @@ -6,6 +6,7 @@ export const NetworksViewSelectorsIDs = { ADD_NETWORKS_BUTTON: 'add-network-button', NETWORK_NAME_INPUT: 'input-network-name', BLOCK_EXPLORER_INPUT: 'block-explorer', + ADD_BLOCK_EXPLORER: 'add-block-explorer-button', RPC_URL_INPUT: 'input-rpc-url', CHAIN_INPUT: 'input-chain-id', NETWORKS_SYMBOL_INPUT: 'input-network-symbol', @@ -20,6 +21,7 @@ export const NetworksViewSelectorsIDs = { SEARCH_NETWORK_INPUT_BOX_ID: 'network-search-input', CONTAINER: 'network-form-container', ICON_BUTTON_RPC: 'drop-down-rpc-menu', + ICON_BUTTON_BLOCK_EXPLORER: 'drop-down-block-explorer-menu', ADD_RPC_BUTTON: 'add-rpc-button', RPC_NAME_INPUT: 'input-rpc-name', }; diff --git a/e2e/specs/networks/add-custom-rpc.spec.js b/e2e/specs/networks/add-custom-rpc.spec.js index a93af0334fd..7a6d7d4e4f7 100644 --- a/e2e/specs/networks/add-custom-rpc.spec.js +++ b/e2e/specs/networks/add-custom-rpc.spec.js @@ -17,8 +17,6 @@ import { getFixturesServerPort } from '../../fixtures/utils'; import FixtureServer from '../../fixtures/fixture-server'; import Assertions from '../../utils/Assertions'; import { CustomNetworks } from '../../resources/networks.e2e'; -import Gestures from '../../utils/Gestures'; -import Matchers from '../../utils/Matchers'; const fixtureServer = new FixtureServer(); @@ -75,6 +73,12 @@ describe(Regression('Custom RPC Tests'), () => { await NetworkView.tapChainIDLabel(); // Focus outside of text input field + await NetworkView.tapBlockExplorerDownButton(); + await NetworkView.tapBlockExplorerButton(); + await NetworkView.typeInNetworkBlockExplorer( + `${CustomNetworks.Gnosis.providerConfig.BlockExplorerUrl}\n`, + ); + if (device.getPlatform() === 'ios') { await NetworkView.tapChainIDLabel(); // Focus outside of text input field await NetworkView.tapChainIDLabel(); // Focus outside of text input field