test: fix integration tests except disappearing message one

ts/components/conversation/header/ConversationHeader.tsx

@@ -4,11 +4,11 @@ import { useDispatch, useSelector } from 'react-redux';
 import {
   isMessageDetailView,
   isMessageSelectionMode,
+  useSelectedConversationKey,
 } from '../../../state/selectors/conversations';
 
 import { closeMessageDetailsView, openRightPanel } from '../../../state/ducks/conversations';
 
-import { useSelectedConversationKey } from '../../../state/selectors/conversations';
 import { Flex } from '../../basic/Flex';
 import { ConversationHeaderMenu } from '../../menu/ConversationHeaderMenu';
 import { AvatarHeader, BackButton, CallButton, TripleDotsMenu } from './ConversationHeaderItems';

ts/components/conversation/message/message-item/ExpirableReadableMessage.tsx

@@ -96,6 +96,7 @@ export const ExpirableReadableMessage = (props: ExpirableReadableMessageProps) =
     isCentered,
     marginInlineStart = '6px',
     marginInlineEnd = '6px',
+    dataTestId,
   } = props;
 
   const {
@@ -133,6 +134,7 @@ export const ExpirableReadableMessage = (props: ExpirableReadableMessageProps) =
       isUnread={!!isUnread}
       isIncoming={isIncoming}
       key={`readable-message-${messageId}`}
+      dataTestId={dataTestId}
     >
       {expirationLength && expirationTimestamp && (
         <ExpireTimer

ts/components/conversation/message/message-item/GroupUpdateMessage.tsx

@@ -76,7 +76,11 @@ export const GroupUpdateMessage = (props: PropsForGroupUpdate) => {
   const { change, messageId } = props;
 
   return (
-    <ExpirableReadableMessage messageId={messageId} key={`readable-message-${messageId}`}>
+    <ExpirableReadableMessage
+      messageId={messageId}
+      key={`readable-message-${messageId}`}
+      dataTestId="group-update-message"
+    >
       <NotificationBubble notificationText={ChangeItem(change)} iconType="users" />
     </ExpirableReadableMessage>
   );

ts/components/conversation/message/message-item/MessageRequestResponse.tsx

@@ -27,6 +27,7 @@ export const MessageRequestResponse = (props: PropsForMessageRequestResponse) =>
       messageId={messageId}
       receivedAt={receivedAt}
       isUnread={isUnread}
+      dataTestId="message-request-response-message"
       key={`readable-message-${messageId}`}
     >
       <Flex

ts/mains/main_node.ts

@@ -19,7 +19,7 @@ import os from 'os';
 import fs from 'fs';
 import crypto from 'crypto';
 
-import _ from 'lodash';
+import _, { isEmpty } from 'lodash';
 import pify from 'pify';
 import Logger from 'bunyan';
 
@@ -84,12 +84,11 @@ import { installPermissionsHandler } from '../node/permissions'; // checked - on
 
 let appStartInitialSpellcheckSetting = true;
 
-const enableTestIntegrationDevTools = true;
-const isTestIntegration =
-  enableTestIntegrationDevTools &&
-  Boolean(
-    process.env.NODE_APP_INSTANCE && process.env.NODE_APP_INSTANCE.includes('test-integration')
-  );
+const isTestIntegration = Boolean(
+  process.env.NODE_APP_INSTANCE && process.env.NODE_APP_INSTANCE.includes('test-integration')
+);
+const openDevToolsTestIntegration = isTestIntegration && !isEmpty(process.env.TEST_OPEN_DEV_TOOLS);
+
 async function getSpellCheckSetting() {
   const json = sqlNode.getItemById('spell-check');
   // Default to `true` if setting doesn't exist yet
@@ -209,7 +208,7 @@ function captureClicks(window: BrowserWindow) {
 function getDefaultWindowSize() {
   return {
     defaultWidth: 880,
-    defaultHeight: 820,
+    defaultHeight: openDevToolsTestIntegration ? 1000 : 820, // the dev tools open at the bottom hide some stuff which should be visible
     minWidth: 880,
     minHeight: 600,
   };
@@ -410,7 +409,7 @@ async function createWindow() {
   const urlToLoad = prepareURL([getAppRootPath(), 'background.html']);
 
   await mainWindow.loadURL(urlToLoad);
-  if (isTestIntegration) {
+  if (openDevToolsTestIntegration) {
     setTimeout(() => {
       if (mainWindow && mainWindow.webContents) {
         mainWindow.webContents.openDevTools({

ts/test/automation/disappearing_messages.spec.ts

@@ -8,6 +8,7 @@ import {
   clickOnTestIdWithText,
   waitForMatchingText,
   waitForTestIdWithText,
+  waitForTimerNotificationWithText,
 } from './utilities/utils';
 
 // tslint:disable: no-console
@@ -32,9 +33,8 @@ sessionTestTwoWindows('Disappearing messages', async ([windowA, windowB]) => {
   // Click chevron to close menu
   await clickOnTestIdWithText(windowA, 'back-button-conversation-options');
   // Check config message
-  await waitForTestIdWithText(
+  await waitForTimerNotificationWithText(
     windowA,
-    'control-message',
     'You set the disappearing message timer to 5 seconds'
   );
   await sleepFor(2000);
@@ -68,7 +68,7 @@ sessionTestTwoWindows('Disappearing messages', async ([windowA, windowB]) => {
   // Click chevron to close menu
   await clickOnTestIdWithText(windowA, 'back-button-conversation-options');
   // Check config message
-  await waitForTestIdWithText(windowA, 'control-message', 'You disabled disappearing messages.');
+  await waitForTimerNotificationWithText(windowA, 'You disabled disappearing messages.');
   // Verify message is deleted in windowB for receiver user
   // Check config message in windowB
   await waitForMatchingText(

ts/test/automation/group_testing.spec.ts

@@ -6,7 +6,7 @@ import {
   clickOnMatchingText,
   clickOnTestIdWithText,
   typeIntoInput,
-  waitForControlMessageWithText,
+  waitForGroupUpdateMessageWithText,
   waitForMatchingText,
   waitForTestIdWithText,
 } from './utilities/utils';
@@ -28,7 +28,6 @@ sessionTestThreeWindows('Create group', async ([windowA, windowB, windowC]) => {
   await createGroup('Tiny Bubble Gang', userA, windowA, userB, windowB, userC, windowC);
   // Check config messages in all windows
   await sleepFor(1000);
-  // await waitForTestIdWithText(windowA, 'control-message');
 });
 
 sessionTestFourWindows('Add contact to group', async ([windowA, windowB, windowC, windowD]) => {
@@ -61,9 +60,9 @@ sessionTestFourWindows('Add contact to group', async ([windowA, windowB, windowC
   await sleepFor(1000);
   await clickOnMatchingText(windowA, userD.userName);
   await clickOnMatchingText(windowA, 'OK');
-  await waitForControlMessageWithText(windowA, `"${userD.userName}" joined the group.`);
-  await waitForControlMessageWithText(windowB, `${userD.sessionid} joined the group.`);
-  await waitForControlMessageWithText(windowC, `${userD.sessionid} joined the group.`);
+  await waitForGroupUpdateMessageWithText(windowA, `"${userD.userName}" joined the group.`);
+  await waitForGroupUpdateMessageWithText(windowB, `${userD.sessionid} joined the group.`);
+  await waitForGroupUpdateMessageWithText(windowC, `${userD.sessionid} joined the group.`);
   await clickOnTestIdWithText(
     windowD,
     'module-conversation__user__profile-name',

ts/test/automation/linked_device_group.spec.ts

@@ -8,7 +8,7 @@ import { leaveGroup } from './utilities/leave_group';
 import { linkedDevice } from './utilities/linked_device';
 import {
   clickOnTestIdWithText,
-  waitForControlMessageWithText,
+  waitForGroupUpdateMessageWithText,
   waitForTestIdWithText,
 } from './utilities/utils';
 
@@ -59,10 +59,10 @@ sessionTestThreeWindows('Check leaving group syncs', async ([windowA, windowC, w
   // Check for user A
   await sleepFor(1000);
   await clickOnTestIdWithText(windowA, 'module-conversation__user__profile-name', group.userName);
-  await waitForControlMessageWithText(windowA, `"${userC.userName}" has left the group.`);
+  await waitForGroupUpdateMessageWithText(windowA, `"${userC.userName}" has left the group.`);
   // Check for linked device (userA)
   await clickOnTestIdWithText(windowB, 'module-conversation__user__profile-name', group.userName);
-  await waitForControlMessageWithText(windowB, `"${userC.userName}" has left the group.`);
+  await waitForGroupUpdateMessageWithText(windowB, `"${userC.userName}" has left the group.`);
   // Check for user B
-  await waitForControlMessageWithText(windowC, `"${userC.userName}" has left the group.`);
+  await waitForGroupUpdateMessageWithText(windowC, `"${userC.userName}" has left the group.`);
 });

ts/test/automation/linked_device_requests.spec.ts

@@ -6,6 +6,7 @@ import { sendNewMessage } from './utilities/send_message';
 import {
   clickOnTestIdWithText,
   waitForMatchingText,
+  waitForMessageRequestWithText,
   waitForTestIdWithText,
   waitForTextMessage,
 } from './utilities/utils';
@@ -22,9 +23,8 @@ sessionTestTwoWindows('Accept request syncs', async ([windowA, windowB]) => {
   await clickOnTestIdWithText(windowC, 'message-request-banner');
   await clickOnTestIdWithText(windowB, 'module-conversation__user__profile-name', userA.userName);
   await clickOnTestIdWithText(windowB, 'accept-message-request');
-  await waitForTestIdWithText(
+  await waitForMessageRequestWithText(
     windowB,
-    'control-message',
     `You have accepted ${userA.userName}'s message request`
   );
   await waitForMatchingText(windowB, 'No pending message requests');

ts/test/automation/linked_device_user.spec.ts

@@ -116,7 +116,7 @@ test('Check deleted message syncs', async () => {
   await clickOnTestIdWithText(windowB, 'module-conversation__user__profile-name', userB.userName);
   await waitForTextMessage(windowB, deletedMessage);
   await waitForTextMessage(windowC, deletedMessage);
-  await clickOnTestIdWithText(windowA, 'control-message', deletedMessage, true);
+  await clickOnTestIdWithText(windowA, 'readable-message', deletedMessage, true);
   await clickOnMatchingText(windowA, 'Delete just for me');
   await clickOnMatchingText(windowA, 'Delete');
   await waitForTestIdWithText(windowA, 'session-toast', 'Deleted');
@@ -140,7 +140,7 @@ test('Check unsent message syncs', async () => {
   await clickOnTestIdWithText(windowB, 'module-conversation__user__profile-name', userB.userName);
   await waitForTextMessage(windowB, unsentMessage);
   await waitForTextMessage(windowC, unsentMessage);
-  await clickOnTestIdWithText(windowA, 'control-message', unsentMessage, true);
+  await clickOnTestIdWithText(windowA, 'readable-message', unsentMessage, true);
   await clickOnMatchingText(windowA, 'Delete for everyone');
   await clickOnElement(windowA, 'data-testid', 'session-confirm-ok-button');
   await waitForTestIdWithText(windowA, 'session-toast', 'Deleted');

ts/test/automation/message_checks.spec.ts

@@ -128,7 +128,7 @@ sessionTestTwoWindows('Unsend text message', async ([windowA, windowB]) => {
 
   await sendMessage(windowA, unsendMessage);
   await waitForTextMessage(windowB, unsendMessage);
-  await clickOnTestIdWithText(windowA, 'control-message', unsendMessage, true);
+  await clickOnTestIdWithText(windowA, 'readable-message', unsendMessage, true);
   await clickOnMatchingText(windowA, 'Delete for everyone');
   await clickOnElement(windowA, 'data-testid', 'session-confirm-ok-button');
   await waitForTestIdWithText(windowA, 'session-toast', 'Deleted');
@@ -142,7 +142,7 @@ sessionTestTwoWindows('Delete message', async ([windowA, windowB]) => {
   await createContact(windowA, windowB, userA, userB);
   await sendMessage(windowA, deletedMessage);
   await waitForTextMessage(windowB, deletedMessage);
-  await clickOnTestIdWithText(windowA, 'control-message', deletedMessage, true);
+  await clickOnTestIdWithText(windowA, 'readable-message', deletedMessage, true);
   await clickOnMatchingText(windowA, 'Delete just for me');
   await clickOnMatchingText(windowA, 'Delete');
   await waitForTestIdWithText(windowA, 'session-toast', 'Deleted');

ts/test/automation/message_requests.spec.ts

@@ -1,15 +1,15 @@
 import { test } from '@playwright/test';
 import { beforeAllClean } from './setup/beforeEach';
 import { newUser } from './setup/new_user';
+import { sessionTestTwoWindows } from './setup/sessionTest';
 import { sendMessage } from './utilities/message';
 import { sendNewMessage } from './utilities/send_message';
 import {
   clickOnMatchingText,
   clickOnTestIdWithText,
   waitForMatchingText,
-  waitForTestIdWithText,
+  waitForMessageRequestWithText,
 } from './utilities/utils';
-import { sessionTestTwoWindows } from './setup/sessionTest';
 
 test.beforeEach(beforeAllClean);
 
@@ -28,9 +28,8 @@ test.describe('Message requests', () => {
     // Check that using the accept button has intended use
     await clickOnTestIdWithText(windowB, 'accept-message-request');
     // Check config message of message request acceptance
-    await waitForTestIdWithText(
+    await waitForMessageRequestWithText(
       windowB,
-      'control-message',
       `You have accepted ${userA.userName}'s message request`
     );
     await waitForMatchingText(windowB, 'No pending message requests');
@@ -48,9 +47,8 @@ test.describe('Message requests', () => {
     // Check that using the accept button has intended use
     await sendMessage(windowB, testReply);
     // Check config message of message request acceptance
-    await waitForTestIdWithText(
+    await waitForMessageRequestWithText(
       windowB,
-      'control-message',
       `You have accepted ${userA.userName}'s message request`
     );
     await waitForMatchingText(windowB, 'No pending message requests');

ts/test/automation/setup/create_group.ts

@@ -5,7 +5,7 @@ import {
   clickOnMatchingText,
   clickOnTestIdWithText,
   typeIntoInput,
-  waitForControlMessageWithText,
+  waitForReadableMessageWithText,
   waitForTestIdWithText,
 } from '../utilities/utils';
 import { Group, User } from '../types/testing';
@@ -97,21 +97,17 @@ export const createGroup = async (
 
   // Verify that each messages was received by the other two accounts
   await Promise.all([
-    (async () => {
-      // windowA should see the message from B and the message from C
-      await waitForControlMessageWithText(windowA, msgBToGroup);
-      await waitForControlMessageWithText(windowA, msgCToGroup);
-    })(),
-    (async () => {
-      // windowB should see the message from A and the message from C
-      await waitForControlMessageWithText(windowB, msgAToGroup);
-      await waitForControlMessageWithText(windowB, msgCToGroup);
-    })(),
-    (async () => {
-      // windowC must see the message from A and the message from B
-      await waitForControlMessageWithText(windowC, msgAToGroup);
-      await waitForControlMessageWithText(windowC, msgBToGroup);
-    })(),
+    // windowA should see the message from B and the message from C
+    () => waitForReadableMessageWithText(windowA, msgBToGroup),
+    () => waitForReadableMessageWithText(windowA, msgCToGroup),
+
+    // windowB should see the message from A and the message from C
+    () => waitForReadableMessageWithText(windowB, msgAToGroup),
+    () => waitForReadableMessageWithText(windowB, msgCToGroup),
+
+    // windowC must see the message from A and the message from B
+    () => waitForReadableMessageWithText(windowC, msgAToGroup),
+    () => waitForReadableMessageWithText(windowC, msgBToGroup),
   ]);
 
   // Focus screen

ts/test/automation/utilities/leave_group.ts

@@ -1,5 +1,10 @@
 import { _electron, Page } from '@playwright/test';
-import { clickOnMatchingText, clickOnTestIdWithText, waitForTestIdWithText } from './utils';
+import {
+  clickOnMatchingText,
+  clickOnTestIdWithText,
+  waitForGroupUpdateMessageWithText,
+  // waitForGroupUpdateMessageWithText,
+} from './utils';
 
 export const leaveGroup = async (window: Page) => {
   // go to three dots menu
@@ -8,6 +13,6 @@ export const leaveGroup = async (window: Page) => {
   await clickOnMatchingText(window, 'Leave Group');
   // Confirm leave group
   await clickOnTestIdWithText(window, 'session-confirm-ok-button', 'OK');
-  // check config message
-  await waitForTestIdWithText(window, 'control-message', 'You have left the group.');
+  // check group update message
+  await waitForGroupUpdateMessageWithText(window, 'You have left the group'); // TODO this needs to be updated as groups left are deleted right away now
 };

ts/test/automation/utilities/message.ts

@@ -8,9 +8,9 @@ export const sendMessage = async (window: Page, message: string) => {
   // click up arrow (send)
   await clickOnTestIdWithText(window, 'send-message-button');
   // wait for confirmation tick to send reply message
-  const selc = `css=[data-testid=control-message]:has-text("${message}"):has([data-testid=msg-status-outgoing][data-testtype=sent])`;
+  const selc = `css=[data-testid=readable-message]:has-text("${message}"):has([data-testid=msg-status-outgoing][data-testtype=sent])`;
   console.error('waiting for sent tick of message: ', message);
 
-  const tickMessageSent = await window.waitForSelector(selc, { timeout: 30000 });
+  const tickMessageSent = await window.waitForSelector(selc, { timeout: 60000 });
   console.error('found the tick of message sent: ', message, Boolean(tickMessageSent));
 };

ts/test/automation/utilities/reply_message.ts

@@ -4,7 +4,7 @@ import { clickOnMatchingText, clickOnTestIdWithText, waitForTextMessage } from '
 
 export const replyTo = async (window: Page, textMessage: string, replyText: string) => {
   await waitForTextMessage(window, textMessage);
-  await clickOnTestIdWithText(window, 'control-message', textMessage, true);
+  await clickOnTestIdWithText(window, 'readable-message', textMessage, true);
   await clickOnMatchingText(window, 'Reply to message');
   await sendMessage(window, replyText);
   console.warn();

ts/test/automation/utilities/utils.ts

@@ -37,7 +37,7 @@ export async function waitForElement(
 }
 
 export async function waitForTextMessage(window: Page, text: string, maxWait?: number) {
-  let builtSelector = `css=[data-testid=control-message]:has-text("${text}")`;
+  let builtSelector = `css=[data-testid=readable-message]:has-text("${text}")`;
   if (text) {
     // " =>  \\\"
     /* prettier-ignore */
@@ -53,8 +53,20 @@ export async function waitForTextMessage(window: Page, text: string, maxWait?: n
   return el;
 }
 
-export async function waitForControlMessageWithText(window: Page, text: string) {
-  return waitForTestIdWithText(window, 'control-message', text);
+export async function waitForReadableMessageWithText(window: Page, text: string) {
+  return waitForTestIdWithText(window, 'readable-message', text);
+}
+
+export async function waitForGroupUpdateMessageWithText(window: Page, text: string) {
+  return waitForTestIdWithText(window, 'group-update-message', text);
+}
+
+export async function waitForMessageRequestWithText(window: Page, text: string) {
+  return waitForTestIdWithText(window, 'message-request-response-message', text);
+}
+
+export async function waitForTimerNotificationWithText(window: Page, text: string) {
+  return waitForTestIdWithText(window, 'disappear-control-message', text);
 }
 
 export async function waitForMatchingText(window: Page, text: string, maxWait?: number) {