From ec5f3307acb5a7a149e13264236db9bcd9869ccd Mon Sep 17 00:00:00 2001 From: Audric Ackermann Date: Tue, 25 Oct 2022 17:01:37 +1100 Subject: [PATCH] test: fix integration tests --- .../dialog/SessionPasswordDialog.tsx | 40 ++++++------ .../settings/section/CategoryPrivacy.tsx | 2 + .../automation/disappearing_messages.spec.ts | 5 +- ts/test/automation/password.spec.ts | 63 ++++++++++--------- ts/test/automation/utils.ts | 11 ++-- 5 files changed, 70 insertions(+), 51 deletions(-) diff --git a/ts/components/dialog/SessionPasswordDialog.tsx b/ts/components/dialog/SessionPasswordDialog.tsx index 840a90c02..e085431fe 100644 --- a/ts/components/dialog/SessionPasswordDialog.tsx +++ b/ts/components/dialog/SessionPasswordDialog.tsx @@ -42,12 +42,18 @@ export class SessionPasswordDialog extends React.Component { } public componentDidMount() { + document.addEventListener('keyup', this.onEnterPressed); + setTimeout(() => { // tslint:disable-next-line: no-unused-expression this.passportInput && this.passportInput.focus(); }, 1); } + public componentWillUnmount() { + document.removeEventListener('keyup', this.onEnterPressed); + } + public render() { const { passwordAction } = this.props; let placeholders: Array = []; @@ -93,7 +99,8 @@ export class SessionPasswordDialog extends React.Component { this.passportInput = input; }} placeholder={placeholders[0]} - onKeyUp={this.onPasswordInput} + onChange={this.onPasswordInput} + onPaste={this.onPasswordInput} data-testid="password-input" /> {passwordAction !== 'enter' && passwordAction !== 'remove' && ( @@ -101,7 +108,8 @@ export class SessionPasswordDialog extends React.Component { type="password" id="password-modal-input-confirm" placeholder={placeholders[1]} - onKeyUp={this.onPasswordConfirmInput} + onChange={this.onPasswordConfirmInput} + onPaste={this.onPasswordConfirmInput} data-testid="password-input-confirm" /> )} @@ -110,7 +118,8 @@ export class SessionPasswordDialog extends React.Component { type="password" id="password-modal-input-reconfirm" placeholder={placeholders[2]} - onKeyUp={this.onPasswordRetypeInput} + onPaste={this.onPasswordRetypeInput} + onChange={this.onPasswordRetypeInput} data-testid="password-input-reconfirm" /> )} @@ -258,6 +267,13 @@ export class SessionPasswordDialog extends React.Component { this.closeDialog(); } + private async onEnterPressed(event: any) { + if (event.key === 'Enter') { + event.stopPropagation(); + return this.setPassword(); + } + } + private async handleActionEnter(enteredPassword: string) { // be sure the password is valid if (!this.validatePassword(enteredPassword)) { @@ -321,30 +337,18 @@ export class SessionPasswordDialog extends React.Component { window.inboxStore?.dispatch(sessionPassword(null)); } - private async onPasswordInput(event: any) { - if (event.key === 'Enter') { - return this.setPassword(); - } + private onPasswordInput(event: any) { const currentPasswordEntered = event.target.value; - this.setState({ currentPasswordEntered }); } - private async onPasswordConfirmInput(event: any) { - if (event.key === 'Enter') { - return this.setPassword(); - } + private onPasswordConfirmInput(event: any) { const currentPasswordConfirmEntered = event.target.value; - this.setState({ currentPasswordConfirmEntered }); } - private async onPasswordRetypeInput(event: any) { - if (event.key === 'Enter') { - return this.setPassword(); - } + private onPasswordRetypeInput(event: any) { const currentPasswordRetypeEntered = event.target.value; - this.setState({ currentPasswordRetypeEntered }); } } diff --git a/ts/components/settings/section/CategoryPrivacy.tsx b/ts/components/settings/section/CategoryPrivacy.tsx index f60cb2754..0e8d14b5a 100644 --- a/ts/components/settings/section/CategoryPrivacy.tsx +++ b/ts/components/settings/section/CategoryPrivacy.tsx @@ -97,6 +97,7 @@ export const SettingsCategoryPrivacy = (props: { displayPasswordModal('change', props.onPasswordUpdated); }} buttonText={window.i18n('changePassword')} + dataTestId="change-password-settings-button" /> )} {props.hasPassword && ( @@ -108,6 +109,7 @@ export const SettingsCategoryPrivacy = (props: { }} buttonColor={SessionButtonColor.Danger} buttonText={window.i18n('removePassword')} + dataTestId="remove-password-settings-button" /> )} diff --git a/ts/test/automation/disappearing_messages.spec.ts b/ts/test/automation/disappearing_messages.spec.ts index 5a2b554ec..38fa84cdb 100644 --- a/ts/test/automation/disappearing_messages.spec.ts +++ b/ts/test/automation/disappearing_messages.spec.ts @@ -10,6 +10,7 @@ import { waitForReadableMessageWithText, waitForTestIdWithText, } from './utils'; +import { sleepFor } from '../../session/utils/Promise'; let windows: Array = []; test.beforeEach(beforeAllClean); @@ -50,7 +51,9 @@ test('Disappearing Messages', async () => { 'readable-message', 'You set the disappearing message timer to 5 seconds' ); + await sleepFor(2000); // Check top right hand corner indicator + await waitForTestIdWithText(windowA, 'disappearing-messages-indicator', '5 seconds'); // Send message // Wait for tick of confirmation @@ -87,7 +90,7 @@ test('Disappearing Messages', async () => { `${userA.userName} set the disappearing message timer to 5 seconds` ); // Wait 5 seconds - await waitForMatchingText(windowB, `${userA.userName} disabled disappearing messages`); + await waitForMatchingText(windowB, `${userA.userName} has turned off disappearing messages.`); // verify message is deleted in windowB const errorDesc2 = 'Should not be found'; try { diff --git a/ts/test/automation/password.spec.ts b/ts/test/automation/password.spec.ts index 15475b58c..17c9cf177 100644 --- a/ts/test/automation/password.spec.ts +++ b/ts/test/automation/password.spec.ts @@ -1,4 +1,5 @@ import { _electron, Page, test } from '@playwright/test'; +import { sleepFor } from '../../session/utils/Promise'; import { beforeAllClean, forceCloseAllWindows } from './setup/beforeEach'; import { newUser } from './setup/new_user'; import { openAppAndWait } from './setup/open'; @@ -36,42 +37,40 @@ test.describe('Password checks', () => { await clickOnTestIdWithText(window, 'set-password-button'); // Enter password await typeIntoInput(window, 'password-input', testPassword); - await window.keyboard.press('Delete'); // Confirm password await typeIntoInput(window, 'password-input-confirm', testPassword); - await window.keyboard.press('Delete'); - // Click OK - await clickOnMatchingText(window, 'OK'); - // await window.keyboard.press('Enter'); + // Click Done + await clickOnMatchingText(window, 'Done'); // Check toast notification await waitForTestIdWithText( window, 'session-toast', - 'Your password has been set. Please keep it safe' + 'Your password has been set. Please keep it safe.' ); + // Click on settings tab + await sleepFor(300); + await clickOnTestIdWithText(window, 'settings-section'); // Type password into input field await typeIntoInput(window, 'password-input', testPassword); - // Click OK - await clickOnMatchingText(window, 'OK'); + + // Click Done + await clickOnMatchingText(window, 'Done'); + await clickOnTestIdWithText(window, 'settings-section'); + // Change password - await clickOnMatchingText(window, 'Change Password'); + await clickOnTestIdWithText(window, 'change-password-settings-button', 'Change Password'); + + console.warn('clicked Change Password'); // Enter old password await typeIntoInput(window, 'password-input', testPassword); - await window.keyboard.press('Delete'); // Enter new password await typeIntoInput(window, 'password-input-confirm', newTestPassword); - await window.keyboard.press('Delete'); - // await window.fill('#password-modal-input-confirm', newTestPassword); await window.keyboard.press('Tab'); // Confirm new password await typeIntoInput(window, 'password-input-reconfirm', newTestPassword); - await window.keyboard.press('Delete'); - // await window.fill('#password-modal-input-reconfirm', newTestPassword); // Press enter on keyboard await window.keyboard.press('Enter'); - // Select OK - await clickOnMatchingText(window, 'OK'); // Check toast notification for 'changed password' await waitForTestIdWithText( window, @@ -92,36 +91,44 @@ test.describe('Password checks', () => { await clickOnMatchingText(window, 'Set Password'); // Enter password await typeIntoInput(window, 'password-input', testPassword); - await window.keyboard.press('Delete'); // Confirm password await typeIntoInput(window, 'password-input-confirm', testPassword); - await window.keyboard.press('Delete'); - // Click OK + // Click Done await window.keyboard.press('Enter'); + // // Click on settings tab + await sleepFor(100); + await clickOnTestIdWithText(window, 'settings-section'); + // Type password into input field + await sleepFor(100); await typeIntoInput(window, 'password-input', testPassword); - await window.keyboard.press('Delete'); - // Click OK - await clickOnMatchingText(window, 'OK'); - // Navigate away from settings tab + // Click Done + await clickOnMatchingText(window, 'Done'); + await sleepFor(100); + await window.mouse.click(0, 0); await clickOnTestIdWithText(window, 'message-section'); + await sleepFor(100); + // // Click on settings tab + await sleepFor(1000); await clickOnTestIdWithText(window, 'settings-section'); // // Try with incorrect password - await typeIntoInput(window, 'password-input', '0000'); - await window.keyboard.press('Delete'); + await typeIntoInput(window, 'password-input', '000000'); // Confirm - await clickOnMatchingText(window, 'OK'); + await clickOnMatchingText(window, 'Done'); // // invalid password banner showing? await waitForMatchingText(window, 'Invalid password'); // // Empty password // // Navigate away from settings tab + await window.mouse.click(0, 0); + await sleepFor(100); await clickOnTestIdWithText(window, 'message-section'); + await sleepFor(100); // // Click on settings tab await clickOnTestIdWithText(window, 'settings-section'); // // No password entered - await clickOnMatchingText(window, 'OK'); + await clickOnMatchingText(window, 'Done'); // // Banner should ask for password to be entered - await waitForMatchingText(window, 'Please enter your password'); + await waitForMatchingText(window, 'Enter password'); }); }); diff --git a/ts/test/automation/utils.ts b/ts/test/automation/utils.ts index 2ca330ba0..8f3fe24c5 100644 --- a/ts/test/automation/utils.ts +++ b/ts/test/automation/utils.ts @@ -28,15 +28,17 @@ export async function waitForMatchingText(window: Page, text: string) { } export async function clickOnMatchingText(window: Page, text: string, rightButton = false) { + console.info(`clickOnMatchingText: "${text}"`); return window.click(`"${text}"`, rightButton ? { button: 'right' } : undefined); } export async function clickOnTestIdWithText(window: Page, dataTestId: string, text?: string) { - if (text) { - return window.click(`css=[data-testid=${dataTestId}]:has-text("${text}")`); - } + console.info(`clickOnTestIdWithText with testId:${dataTestId} and text:${text ? text : 'none'}`); + + const builtSelector = !text + ? `css=[data-testid=${dataTestId}]` + : `css=[data-testid=${dataTestId}]:has-text("${text}")`; - const builtSelector = `css=[data-testid=${dataTestId}]`; await window.waitForSelector(builtSelector); return window.click(builtSelector); } @@ -46,6 +48,7 @@ export function getMessageTextContentNow() { } export async function typeIntoInput(window: Page, dataTestId: string, text: string) { + console.info(`typeIntoInput testId: ${dataTestId} : "${text}"`); const builtSelector = `css=[data-testid=${dataTestId}]`; return window.fill(builtSelector, text); }