From 990d3398391f212587ef6f072b77fc9328651df2 Mon Sep 17 00:00:00 2001
From: GleidsonDaniel <gleidson10daniel@hotmail.com>
Date: Tue, 4 Jun 2024 17:00:51 -0400
Subject: [PATCH] test: add e2e

---
 .../index.tsx                                 | 12 ++--
 app/containers/ChangePasswordRequired.tsx     |  6 +-
 app/views/RoomsListView/index.tsx             |  3 +
 e2e/helpers/data_setup.ts                     |  5 +-
 .../08-change-password-required.spec.ts       | 63 +++++++++++++++++++
 5 files changed, 80 insertions(+), 9 deletions(-)
 create mode 100644 e2e/tests/onboarding/08-change-password-required.spec.ts

diff --git a/app/containers/ActionSheet/ActionSheetContentWithInputAndSubmit/index.tsx b/app/containers/ActionSheet/ActionSheetContentWithInputAndSubmit/index.tsx
index b6c374d972..6db969c6ad 100644
--- a/app/containers/ActionSheet/ActionSheetContentWithInputAndSubmit/index.tsx
+++ b/app/containers/ActionSheet/ActionSheetContentWithInputAndSubmit/index.tsx
@@ -42,7 +42,8 @@ const FooterButtons = ({
 	confirmTitle = '',
 	disabled = false,
 	cancelBackgroundColor = '',
-	confirmBackgroundColor = ''
+	confirmBackgroundColor = '',
+	testID = ''
 }): React.ReactElement => {
 	const { colors } = useTheme();
 	return (
@@ -55,12 +56,14 @@ const FooterButtons = ({
 				color={colors.backdropColor}
 				title={cancelTitle}
 				onPress={cancelAction}
+				testID={`${testID}-cancel`}
 			/>
 			<Button
 				style={{ flex: 1, backgroundColor: confirmBackgroundColor || colors.buttonBackgroundDangerDefault }}
 				title={confirmTitle}
 				onPress={confirmAction}
 				disabled={disabled}
+				testID={`${testID}-confirm`}
 			/>
 		</View>
 	);
@@ -96,7 +99,7 @@ const ActionSheetContentWithInputAndSubmit = ({
 	customText?: React.ReactElement;
 	confirmBackgroundColor?: string;
 	showInput?: boolean;
-	inputs?: { placeholder: string, secureTextEntry?: boolean }[];
+	inputs?: { placeholder: string; secureTextEntry?: boolean }[];
 	isDisabled?: (inputValues: string[]) => boolean;
 }): React.ReactElement => {
 	const { colors } = useTheme();
@@ -130,7 +133,7 @@ const ActionSheetContentWithInputAndSubmit = ({
 						}
 					}}
 					inputRef={inputRefs.current[index] as any}
-					testID={`${testID}-${index}`}
+					testID={`${testID}-input-${index}`}
 					secureTextEntry={inputConfig.secureTextEntry}
 					bottomSheet={isIOS}
 				/>
@@ -148,7 +151,7 @@ const ActionSheetContentWithInputAndSubmit = ({
 					}, 100);
 					if (inputValues[0]) onSubmit(inputValues[0]);
 				}}
-				testID={testID}
+				testID={`${testID}-input`}
 				secureTextEntry={secureTextEntry}
 				bottomSheet={isIOS}
 			/>
@@ -176,6 +179,7 @@ const ActionSheetContentWithInputAndSubmit = ({
 				cancelTitle={i18n.t('Cancel')}
 				confirmTitle={confirmTitle || i18n.t('Save')}
 				disabled={disabled}
+				testID={testID}
 			/>
 		</View>
 	);
diff --git a/app/containers/ChangePasswordRequired.tsx b/app/containers/ChangePasswordRequired.tsx
index 6a58458e3b..e459d36046 100644
--- a/app/containers/ChangePasswordRequired.tsx
+++ b/app/containers/ChangePasswordRequired.tsx
@@ -48,7 +48,7 @@ export const ChangePasswordRequired = () => {
 					testID='change-password-required-sheet'
 					inputs={inputs}
 					onSubmit={input => changePassword(input[0])}
-					isDisabled={input => loading || input[0] === '' || input[0] !== input[1]}
+					isDisabled={input => loading || input[0] === '' || requiresPasswordConfirmation ? input[0] !== input[1] : false}
 				/>
 			)
 		});
@@ -61,8 +61,8 @@ export const ChangePasswordRequired = () => {
 			</View>
 			<Text style={[styles.title, { color: colors.fontTitlesLabels }]}>{I18n.t('You_need_to_change_your_password')}</Text>
 			<Text style={[styles.description, { color: colors.fontDefault }]}>{I18n.t('To_continue_using_RocketChat')}</Text>
-			<Button title={I18n.t('Change_password')} type='primary' onPress={showActionSheetPassword} />
-			<Button title={I18n.t('Logout')} type='secondary' backgroundColor={colors.surfaceTint} onPress={() => dispatch(logout())} />
+			<Button testID='change-password-required-button' title={I18n.t('Change_password')} type='primary' onPress={showActionSheetPassword} />
+			<Button testID='change-password-required-logout' title={I18n.t('Logout')} type='secondary' backgroundColor={colors.surfaceTint} onPress={() => dispatch(logout())} />
 		</View>
 	);
 };
diff --git a/app/views/RoomsListView/index.tsx b/app/views/RoomsListView/index.tsx
index d88b4116dd..343fa50c8b 100644
--- a/app/views/RoomsListView/index.tsx
+++ b/app/views/RoomsListView/index.tsx
@@ -380,6 +380,9 @@ class RoomsListView extends React.Component<IRoomsListViewProps, IRoomsListViewS
 			this.handleHasPermission();
 			this.setHeader();
 		}
+		if (prevProps.user.requirePasswordChange !== this.props.user.requirePasswordChange) {
+			this.setHeader();
+		}
 	}
 
 	componentWillUnmount() {
diff --git a/e2e/helpers/data_setup.ts b/e2e/helpers/data_setup.ts
index de9489ebc8..d963877b43 100644
--- a/e2e/helpers/data_setup.ts
+++ b/e2e/helpers/data_setup.ts
@@ -36,7 +36,7 @@ export interface ITestUser {
 	email: string;
 }
 
-export const createRandomUser = async (): Promise<ITestUser> => {
+export const createRandomUser = async (customProps?: Object): Promise<ITestUser> => {
 	try {
 		await login(data.adminUser, data.adminPassword);
 		const user = data.randomUser();
@@ -45,7 +45,8 @@ export const createRandomUser = async (): Promise<ITestUser> => {
 			username: user.username,
 			name: user.name,
 			password: user.password,
-			email: user.email
+			email: user.email,
+			...(customProps || {})
 		});
 		return user;
 	} catch (error) {
diff --git a/e2e/tests/onboarding/08-change-password-required.spec.ts b/e2e/tests/onboarding/08-change-password-required.spec.ts
new file mode 100644
index 0000000000..e4ebfd5365
--- /dev/null
+++ b/e2e/tests/onboarding/08-change-password-required.spec.ts
@@ -0,0 +1,63 @@
+import { by, device, element, waitFor } from 'detox';
+
+import { login, logout, navigateToLogin } from '../../helpers/app';
+import { createRandomUser } from '../../helpers/data_setup';
+
+describe('Change password required', () => {
+	let user = { username: '', password: '' };
+
+	beforeAll(async () => {
+		user = await createRandomUser({ requirePasswordChange: true });
+		await device.launchApp({ permissions: { notifications: 'YES' }, delete: true });
+		await navigateToLogin();
+		await login(user.username, user.password);
+	});
+
+	describe('Usage', () => {
+		it('should have required password info displayed', async () => {
+			await waitFor(element(by.id(`change-password-required-button`)))
+				.toExist()
+				.withTimeout(5000);
+		});
+
+		it('should logout correctly', async () => {
+			await waitFor(element(by.id(`change-password-required-logout`)))
+				.toExist()
+				.withTimeout(5000);
+			await element(by.id('change-password-required-logout')).tap();
+			await waitFor(element(by.id('new-server-view')))
+				.toExist()
+				.withTimeout(10000);
+		});
+
+		it('should change password correctly', async () => {
+			await navigateToLogin();
+			await login(user.username, user.password);
+			await waitFor(element(by.id(`change-password-required-button`)))
+				.toExist()
+				.withTimeout(5000);
+			await element(by.id('change-password-required-button')).tap();
+			await waitFor(element(by.id(`action-sheet-content-with-input-and-submit`)))
+				.toExist()
+				.withTimeout(5000);
+			await element(by.id('change-password-required-sheet-input-0')).replaceText('123456');
+			await element(by.id('change-password-required-sheet-input-1')).replaceText('123456');
+			await element(by.id('change-password-required-sheet-confirm')).tap();
+			await waitFor(element(by.id(`change-password-required-button`)))
+				.not.toExist()
+				.withTimeout(5000);
+			await waitFor(element(by.id('rooms-list-view-item-general')))
+				.toExist()
+				.withTimeout(10000);
+			await logout();
+		});
+
+		it('should login correctly after password change', async () => {
+			await navigateToLogin();
+			await login(user.username, '123456');
+			await waitFor(element(by.id('rooms-list-view-item-general')))
+				.toExist()
+				.withTimeout(10000);
+		});
+	});
+});