Add e2e coverage for invalid browser url & changing password

app/components/UI/Navbar/index.js

@@ -20,6 +20,7 @@ import { importAccountFromPrivateKey } from '../../../util/address';
 import Device from '../../../util/device';
 import { isGatewayUrl } from '../../../lib/ens-ipfs/resolver';
 import { getHost } from '../../../util/browser';
+import { BACK_ARROW_BUTTON_ID } from '../../../constants/test-ids';
 
 const { HOMEPAGE_URL } = AppConstants;
 
@@ -179,7 +180,7 @@ export function getNavigationOptionsTitle(title, navigation, isFullScreenModal,
 			) : null,
 		headerLeft: () =>
 			isFullScreenModal ? null : (
-				<TouchableOpacity onPress={navigationPop} style={styles.backButton} testID={'title-back-arrow-button'}>
+				<TouchableOpacity onPress={navigationPop} style={styles.backButton} testID={BACK_ARROW_BUTTON_ID}>
 					<IonicIcon
 						name={Device.isAndroid() ? 'md-arrow-back' : 'ios-arrow-back'}
 						size={Device.isAndroid() ? 24 : 28}

app/components/Views/ChoosePassword/index.js

@@ -46,6 +46,8 @@ import AnalyticsV2 from '../../../util/analyticsV2';
 import { ThemeContext, mockTheme } from '../../../util/theme';
 import AnimatedFox from 'react-native-animated-fox';
 
+import { IOS_I_UNDERSTAND_BUTTON_ID, ANDROID_I_UNDERSTAND_BUTTON_ID } from '../../../constants/test-ids';
+
 const createStyles = (colors) =>
 	StyleSheet.create({
 		mainWrapper: {
@@ -691,9 +693,13 @@ class ChoosePassword extends PureComponent {
 										style={styles.checkbox}
 										tintColors={{ true: colors.primary.default, false: colors.border.default }}
 										boxType="square"
-										testID={'password-understand-box'}
+										testID={IOS_I_UNDERSTAND_BUTTON_ID}
 									/>
-									<Text style={styles.label} onPress={this.setSelection} testID={'i-understand-text'}>
+									<Text
+										style={styles.label}
+										onPress={this.setSelection}
+										testID={ANDROID_I_UNDERSTAND_BUTTON_ID}
+									>
 										{strings('choose_password.i_understand')}{' '}
 										<Text onPress={this.learnMore} style={styles.learnMore}>
 											{strings('choose_password.learn_more')}

app/components/Views/ManualBackupStep1/index.js

@@ -31,6 +31,9 @@ import {
 	CONFIRM_PASSWORD,
 	WRONG_PASSWORD_ERROR,
 } from '../../../constants/onboarding';
+
+import { CONFIRM_CHANGE_PASSWORD_INPUT_BOX_ID } from '../../../constants/test-ids';
+
 import AnalyticsV2 from '../../../util/analyticsV2';
 import { ThemeContext, mockTheme } from '../../../util/theme';
 
@@ -399,7 +402,7 @@ class ManualBackupStep1 extends PureComponent {
 								onChangeText={this.onPasswordChange}
 								secureTextEntry
 								onSubmitEditing={this.tryUnlock}
-								testID={'private-credential-password-text-input'}
+								testID={CONFIRM_CHANGE_PASSWORD_INPUT_BOX_ID}
 								keyboardAppearance={themeAppearance}
 							/>
 							{warningIncorrectPassword && (

app/components/Views/ResetPassword/index.js

@@ -39,6 +39,12 @@ import NotificationManager from '../../../core/NotificationManager';
 import { syncPrefs } from '../../../util/sync';
 import { ThemeContext, mockTheme } from '../../../util/theme';
 import AnimatedFox from 'react-native-animated-fox';
+import {
+	CREATE_PASSWORD_INPUT_BOX_ID,
+	CONFIRM_PASSWORD_INPUT_BOX_ID,
+	IOS_I_UNDERSTAND_BUTTON_ID,
+	ANDROID_I_UNDERSTAND_BUTTON_ID,
+} from '../../../constants/test-ids';
 
 const createStyles = (colors) =>
 	StyleSheet.create({
@@ -713,7 +719,7 @@ class ResetPassword extends PureComponent {
 										secureTextEntry={secureTextEntry}
 										placeholder=""
 										placeholderTextColor={colors.text.muted}
-										testID="input-password"
+										testID={CREATE_PASSWORD_INPUT_BOX_ID}
 										onSubmitEditing={this.jumpToConfirmPassword}
 										returnKeyType="next"
 										autoCapitalize="none"
@@ -739,7 +745,8 @@ class ResetPassword extends PureComponent {
 										secureTextEntry={secureTextEntry}
 										placeholder={''}
 										placeholderTextColor={colors.text.muted}
-										testID={'input-password-confirm'}
+										testID={CONFIRM_PASSWORD_INPUT_BOX_ID}
+										zasdfasfasf
 										onSubmitEditing={this.onPressCreate}
 										returnKeyType={'done'}
 										autoCapitalize="none"
@@ -762,9 +769,13 @@ class ResetPassword extends PureComponent {
 										style={styles.checkbox}
 										tintColors={{ true: colors.primary.default, false: colors.border.default }}
 										boxType="square"
-										testID={'password-understand-box'}
+										testID={IOS_I_UNDERSTAND_BUTTON_ID}
 									/>
-									<Text style={styles.label} onPress={this.setSelection} testID={'i-understand-text'}>
+									<Text
+										style={styles.label}
+										onPress={this.setSelection}
+										testID={ANDROID_I_UNDERSTAND_BUTTON_ID}
+									>
 										{strings('reset_password.i_understand')}{' '}
 										<Text onPress={this.learnMore} style={styles.learnMore}>
 											{strings('reset_password.learn_more')}

app/components/Views/Settings/SecuritySettings/index.js

@@ -49,6 +49,11 @@ import HintModal from '../../../UI/HintModal';
 import AnalyticsV2, { trackErrorAsAnalytics } from '../../../../util/analyticsV2';
 import SeedPhraseVideo from '../../../UI/SeedPhraseVideo';
 import { useAppThemeFromContext, mockTheme, ThemeContext } from '../../../../util/theme';
+import {
+	CHANGE_PASSWORD_TITLE_ID,
+	CHANGE_PASSWORD_BUTTON_ID,
+	REVEAL_SECRET_RECOVERY_PHRASE_BUTTON_ID,
+} from '../../../../constants/test-ids';
 
 const isIos = Device.isIos();
 const LEARN_MORE_URL =
@@ -666,7 +671,7 @@ class Settings extends PureComponent {
 						type="normal"
 						onPress={this.goToRevealPrivateCredential}
 						containerStyle={styles.confirm}
-						testID={'reveal-seed-button'}
+						testID={REVEAL_SECRET_RECOVERY_PHRASE_BUTTON_ID}
 					>
 						{strings('reveal_credential.seed_phrase_title')}
 					</StyledButton>
@@ -678,10 +683,15 @@ class Settings extends PureComponent {
 	renderPasswordSection = () => {
 		const { styles } = this.getStyles();
 		return (
-			<View style={styles.setting} testID={'change-password-section'}>
+			<View style={styles.setting} testID={CHANGE_PASSWORD_TITLE_ID}>
 				<Text style={styles.title}>{strings('password_reset.password_title')}</Text>
 				<Text style={styles.desc}>{strings('password_reset.password_desc')}</Text>
-				<StyledButton type="normal" onPress={this.resetPassword} containerStyle={styles.confirm}>
+				<StyledButton
+					type="normal"
+					onPress={this.resetPassword}
+					containerStyle={styles.confirm}
+					testID={CHANGE_PASSWORD_BUTTON_ID}
+				>
 					{strings('password_reset.change_password')}
 				</StyledButton>
 			</View>

app/constants/test-ids.js

@@ -20,3 +20,18 @@ export const NETWORK_SCROLL_ID = 'other-networks-scroll';
 export const NETWORK_EDUCATION_MODAL_CONTAINER_ID = 'network-education-modal';
 export const NETWORK_EDUCATION_MODAL_CLOSE_BUTTON_ID = 'network-education-modal-close-button';
 export const NETWORK_EDUCATION_MODAL_NETWORK_NAME_ID = 'network-education-modal-network-name';
+
+export const CREATE_PASSWORD_INPUT_BOX_ID = 'input-password-field';
+export const CONFIRM_PASSWORD_INPUT_BOX_ID = 'input-password-field-confirm';
+
+export const CHANGE_PASSWORD_TITLE_ID = 'change-password-section';
+export const CHANGE_PASSWORD_BUTTON_ID = 'change-password-button-id';
+export const CONFIRM_CHANGE_PASSWORD_INPUT_BOX_ID = 'private-credential-password-text-input';
+
+export const REVEAL_SECRET_RECOVERY_PHRASE_BUTTON_ID = 'reveal-seed-button';
+
+export const SUBMIT_BUTTON_ID = 'submit-button';
+export const BACK_ARROW_BUTTON_ID = 'title-back-arrow-button';
+
+export const IOS_I_UNDERSTAND_BUTTON_ID = 'password-understand-box';
+export const ANDROID_I_UNDERSTAND_BUTTON_ID = 'i-understand-text';

e2e/pages/Drawer/Browser.js

@@ -1,4 +1,5 @@
 import TestHelpers from '../../helpers';
+import { strings } from '../../../locales/i18n';
 
 export const BROWSER_SCREEN_ID = 'browser-screen';
 
@@ -11,7 +12,8 @@ const HOME_BUTTON_ID = 'home-button';
 const GO_BACK_BUTTON_ID = 'go-back-button';
 const OPTIONS_BUTTON_ID = 'options-button';
 const URL_INPUT_BOX_ID = 'url-input';
-
+const RETURN_HOME_TEXT = strings('webview_error.return_home');
+const BACK_TO_SAFETY_TEXT = strings('phishing.back_to_safety');
 export class Browser {
 	static async tapBrowser() {
 		await TestHelpers.tapByText('Browser');
@@ -42,9 +44,11 @@ export class Browser {
 	}
 
 	static async tapBackToSafetyButton() {
-		await TestHelpers.tapByText('Back to safety');
+		await TestHelpers.tapByText(BACK_TO_SAFETY_TEXT);
+	}
+	static async tapReturnHomeButton() {
+		await TestHelpers.tapByText(RETURN_HOME_TEXT);
 	}
-
 	static async tapBrowserBackButton() {
 		// This action is android specific
 		await TestHelpers.tap(GO_BACK_BUTTON_ID);

e2e/pages/Drawer/Settings/SecurityAndPrivacy/ChangePasswordView.js

@@ -0,0 +1,53 @@
+import TestHelpers from '../../../../helpers';
+import {
+	CONFIRM_CHANGE_PASSWORD_INPUT_BOX_ID,
+	CONFIRM_PASSWORD_INPUT_BOX_ID,
+	CREATE_PASSWORD_INPUT_BOX_ID,
+	SUBMIT_BUTTON_ID,
+	IOS_I_UNDERSTAND_BUTTON_ID,
+	ANDROID_I_UNDERSTAND_BUTTON_ID,
+} from '../../../../../app/constants/test-ids';
+
+import { strings } from '../../../../../locales/i18n';
+
+const CHANGE_PASSWORD_TEXT = strings('manual_backup_step_1.confirm_password');
+
+export default class ChangePasswordView {
+	static async typeInConfirmPasswordInputBox(PASSWORD) {
+		await TestHelpers.typeTextAndHideKeyboard(CONFIRM_CHANGE_PASSWORD_INPUT_BOX_ID, PASSWORD);
+	}
+
+	static async tapConfirmButton() {
+		await TestHelpers.tapByText('CONFIRM');
+	}
+
+	static async enterPassword(PASSWORD) {
+		await TestHelpers.typeTextAndHideKeyboard(CREATE_PASSWORD_INPUT_BOX_ID, PASSWORD);
+	}
+
+	static async reEnterPassword(PASSWORD) {
+		await TestHelpers.typeTextAndHideKeyboard(CONFIRM_PASSWORD_INPUT_BOX_ID, PASSWORD);
+	}
+
+	static async tapIUnderstandCheckBox() {
+		if (device.getPlatform() === 'ios') {
+			await TestHelpers.tap(IOS_I_UNDERSTAND_BUTTON_ID);
+		} else {
+			// Tap by the I understand text
+			await TestHelpers.delay(1000);
+			await TestHelpers.tap(ANDROID_I_UNDERSTAND_BUTTON_ID);
+		}
+	}
+
+	static async tapResetPasswordButton() {
+		await TestHelpers.waitAndTap(SUBMIT_BUTTON_ID);
+	}
+
+	static async isVisible() {
+		await TestHelpers.checkIfElementWithTextIsVisible(CHANGE_PASSWORD_TEXT);
+	}
+
+	static async isNotVisible() {
+		await TestHelpers.checkIfElementWithTextIsNotVisible(CHANGE_PASSWORD_TEXT);
+	}
+}

e2e/pages/Drawer/Settings/SecurityAndPrivacy/SecurityAndPrivacyView.js

@@ -1,22 +1,44 @@
 import TestHelpers from '../../../../helpers';
+import {
+	REVEAL_SECRET_RECOVERY_PHRASE_BUTTON_ID,
+	CHANGE_PASSWORD_BUTTON_ID,
+	CHANGE_PASSWORD_TITLE_ID,
+	BACK_ARROW_BUTTON_ID,
+} from '../../../../../app/constants/test-ids';
 
-const REVEAL_SECRET_RECOVERY_PHRASE_BUTTON_ID = 'reveal-seed-button';
 const SECURITY_SETTINGS_SCROLL_ID = 'security-settings-scrollview';
-const CHANGE_PASSWORD_SECTION_ID = 'change-password-section';
 //const PRIVACY_MODE_SECTION_ID = 'privacy-mode-section';
 const METAMETRICS_SWITCH_ID = 'metametrics-switch';
 export default class SecurityAndPrivacy {
 	static async tapRevealSecretRecoveryPhrase() {
 		await TestHelpers.tap(REVEAL_SECRET_RECOVERY_PHRASE_BUTTON_ID);
 	}
 
+	static async tapChangePasswordButton() {
+		await TestHelpers.tap(CHANGE_PASSWORD_BUTTON_ID);
+	}
+
+	static async tapBackButton() {
+		await TestHelpers.tap(BACK_ARROW_BUTTON_ID);
+	}
+
+	static async scrollToChangePasswordView() {
+		// Scroll to the bottom
+		if (device.getPlatform() === 'android') {
+			await TestHelpers.swipe(SECURITY_SETTINGS_SCROLL_ID, 'up', 'slow');
+			await TestHelpers.delay(1000);
+		} else {
+			await TestHelpers.swipe(CHANGE_PASSWORD_TITLE_ID, 'up', 'slow', 0.2);
+		}
+	}
+
 	static async scrollToBottomOfView() {
 		// Scroll to the bottom
 		if (device.getPlatform() === 'android') {
 			await TestHelpers.swipe(SECURITY_SETTINGS_SCROLL_ID, 'up', 'fast');
 			await TestHelpers.delay(1000);
 		} else {
-			await TestHelpers.swipe(CHANGE_PASSWORD_SECTION_ID, 'up', 'fast', 0.8);
+			await TestHelpers.swipe(CHANGE_PASSWORD_TITLE_ID, 'up', 'fast', 0.8);
 		}
 		//await TestHelpers.swipe(PRIVACY_MODE_SECTION_ID, 'up', 'fast');
 	}
@@ -36,4 +58,8 @@ export default class SecurityAndPrivacy {
 	static async isMetaMetricsToggleOff() {
 		await TestHelpers.checkIfToggleIsOff(METAMETRICS_SWITCH_ID);
 	}
+
+	static async isChangePasswordSectionVisible() {
+		await TestHelpers.checkIfVisible(CHANGE_PASSWORD_TITLE_ID);
+	}
 }

e2e/specs/browser-tests.spec.js

@@ -21,6 +21,7 @@ const ENS_TLD = 'https://inbox.mailchain.xyz';
 const UNISWAP = 'https://uniswap.exchange';
 const PASSWORD = '12345678';
 const PHISHING_SITE = 'http://www.empowr.com/FanFeed/Home.aspx';
+const INVALID_URL = 'https://quackquakc.easq';
 
 describe('Browser Tests', () => {
 	beforeEach(() => {
@@ -116,7 +117,7 @@ describe('Browser Tests', () => {
 			// Check that the dapp title is correct
 			await TestHelpers.checkIfElementWithTextIsVisible('app.uniswap.org', 0);
 		}
-		await TestHelpers.delay(3000);
+		await TestHelpers.delay(5000);
 		await ConnectModal.tapCancelButton();
 
 		// Android has weird behavior where the URL modal stays open, so this closes it
@@ -161,7 +162,7 @@ describe('Browser Tests', () => {
 			await TestHelpers.delay(1500);
 		}
 		// Wait for connect prompt to display
-		await TestHelpers.delay(3000);
+		await TestHelpers.delay(5000);
 		await ConnectModal.tapConnectButton();
 		await Browser.isVisible();
 	});
@@ -183,6 +184,20 @@ describe('Browser Tests', () => {
 		await Browser.isVisible();
 	});
 
+	it('should test invalid URL', async () => {
+		await Browser.tapBottomSearchBar();
+		// Clear text & Navigate to URL
+		await Browser.navigateToURL(INVALID_URL);
+		await Browser.waitForBrowserPageToLoad();
+
+		await Browser.tapReturnHomeButton();
+		// Check that we are on the browser screen
+		if (!device.getPlatform() === 'android') {
+			await TestHelpers.delay(1500);
+		}
+		await Browser.isVisible();
+	});
+
 	it('should test phishing sites', async () => {
 		await Browser.tapBottomSearchBar();
 		// Clear text & Navigate to URL