Chore/e2e test unregistered user (#1826)

* Add new user to multiple users e2e test - user joining without owner being online * Fix closing debug modal in e2e tests * Show Quiet logs in e2e tests * Rename twoClients to multipleClients e2e test * Clean up multiple clients e2e tests
TryQuiet · Oct 5, 2023 · c23826e · c23826e
1 parent 0c985ef
commit c23826e
Show file tree

Hide file tree

Showing 19 changed files with 530 additions and 497 deletions.
diff --git a/.github/workflows/e2e-linux.yml b/.github/workflows/e2e-linux.yml
@@ -53,12 +53,12 @@ jobs:
           max_attempts: 3
           command: cd packages/e2e-tests && npm run test oneClient.test.ts
 
-      - name: Run two clients test
+      - name: Run multiple clients test
         uses: nick-fields/retry@v2
         with:
           timeout_minutes: 25
           max_attempts: 3
-          command: cd packages/e2e-tests && npm run test twoClients.test.ts
+          command: cd packages/e2e-tests && npm run test multipleClients.test.ts
 
       - name: Run invitation link test - Includes 2 separate application clients
         uses: nick-fields/retry@v2

diff --git a/.github/workflows/e2e-mac.yml b/.github/workflows/e2e-mac.yml
@@ -61,11 +61,11 @@ jobs:
           max_attempts: 3
           command: cd packages/e2e-tests && npm run test oneClient.test.ts
 
-      - name: Run two clients test
+      - name: Run multiple clients test
         uses: nick-fields/retry@v2
         with:
           timeout_minutes: 25
           max_attempts: 3
-          command: cd packages/e2e-tests && npm run test twoClients.test.ts
+          command: cd packages/e2e-tests && npm run test multipleClients.test.ts
 
 
diff --git a/.github/workflows/e2e-win.yml b/.github/workflows/e2e-win.yml
@@ -68,11 +68,11 @@ jobs:
         shell: powershell
 
       - name: Kill Quiet
-        run: Stop-Process -Name "Quiet" -Force
+        run: Get-Process -Name "Quiet" -ErrorAction SilentlyContinue | Stop-Process -Force
         shell: powershell
 
       - name: Kill tor
-        run: Stop-Process -Name "tor" -Force
+        run: Get-Process -Name "tor" -ErrorAction SilentlyContinue | Stop-Process -Force
         shell: powershell
 
       - name: Delay
@@ -87,13 +87,13 @@ jobs:
           shell: bash
           command: cd packages/e2e-tests && npm run test oneClient.test.ts
 
-      - name: Run two clients test
+      - name: Run multiple clients test
         uses: nick-fields/retry@v2
         with:
           timeout_minutes: 30
           max_attempts: 3
           shell: bash
-          command: cd packages/e2e-tests && npm run test twoClients.test.ts
+          command: cd packages/e2e-tests && npm run test multipleClients.test.ts
 
       - name: Run invitation link test - Includes 2 separate application clients
         uses: nick-fields/retry@v2

diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -8,6 +8,8 @@
 
 * Running Chromatic tests for forked PRs
 
+* Added e2e test for user joining community when owner is offline. Improved e2e tests
+
 * Bump github actions/* to versions using node16
 
 * Project can now be bootstraped on Windows (powershell)

diff --git a/packages/backend/src/nest/connections-manager/connections-manager.service.ts b/packages/backend/src/nest/connections-manager/connections-manager.service.ts
@@ -361,7 +361,6 @@ export class ConnectionsManagerService extends EventEmitter implements OnModuleI
       targetPort: this.ports.libp2pHiddenService,
       peers,
     }
-    this.logger('libp2p params', params)
 
     await this.libp2pService.createInstance(params)
     // KACPER

diff --git a/packages/backend/src/nest/socket/socket.service.ts b/packages/backend/src/nest/socket/socket.service.ts
@@ -172,9 +172,6 @@ export class SocketService extends EventEmitter implements OnModuleInit {
           ownerCertificate: payload.certificate,
           rootCa: payload.permsData.certificate,
         }
-
-        console.log('Metadata from state-manager', communityMetadataPayload)
-
         this.emit(SocketActionTypes.SEND_COMMUNITY_METADATA, communityMetadataPayload)
       })
 

diff --git a/packages/desktop/src/renderer/components/widgets/channels/BasicMessage.test.tsx b/packages/desktop/src/renderer/components/widgets/channels/BasicMessage.test.tsx
@@ -36,6 +36,7 @@ describe('BasicMessage', () => {
           >
             <div
               class="MuiListItemText-root BasicMessageComponentmessageCard css-tlelie-MuiListItemText-root"
+              data-testid="userMessagesWrapper-gringo-0"
             >
               <div
                 class="MuiGrid-root MuiGrid-container MuiGrid-wrap-xs-nowrap css-aii0rt-MuiGrid-root"
@@ -124,6 +125,7 @@ describe('BasicMessage', () => {
           >
             <div
               class="MuiListItemText-root BasicMessageComponentmessageCard css-tlelie-MuiListItemText-root"
+              data-testid="userMessagesWrapper-gringo-0"
             >
               <div
                 class="MuiGrid-root MuiGrid-container MuiGrid-wrap-xs-nowrap css-aii0rt-MuiGrid-root"
@@ -222,6 +224,7 @@ describe('BasicMessage', () => {
           >
             <div
               class="MuiListItemText-root BasicMessageComponentmessageCard css-tlelie-MuiListItemText-root"
+              data-testid="userMessagesWrapper-gringo-0"
             >
               <div
                 class="MuiGrid-root MuiGrid-container MuiGrid-wrap-xs-nowrap css-aii0rt-MuiGrid-root"
@@ -324,6 +327,7 @@ describe('BasicMessage', () => {
           >
             <div
               class="MuiListItemText-root BasicMessageComponentmessageCard css-tlelie-MuiListItemText-root"
+              data-testid="userMessagesWrapper-gringo-0"
             >
               <div
                 class="MuiGrid-root MuiGrid-container MuiGrid-wrap-xs-nowrap css-aii0rt-MuiGrid-root"

diff --git a/packages/desktop/src/renderer/components/widgets/channels/BasicMessage.tsx b/packages/desktop/src/renderer/components/widgets/channels/BasicMessage.tsx
@@ -193,6 +193,7 @@ export const BasicMessageComponent: React.FC<BasicMessageProps & FileActionsProp
       <ListItemText
         disableTypography
         className={classes.messageCard}
+        data-testid={`userMessagesWrapper-${messageDisplayData.nickname}-${messageDisplayData.id}`}
         primary={
           <Grid container direction='row' justifyContent='flex-start' alignItems='flex-start' wrap={'nowrap'}>
             <Grid item className={classNames({ [classes.avatar]: true })}>
@@ -219,7 +220,7 @@ export const BasicMessageComponent: React.FC<BasicMessageProps & FileActionsProp
                     </Typography>
                   </Grid>
                   {userLabel && !infoMessage && (
-                    <Grid>
+                    <Grid data-testid={`userLabel-${messageDisplayData.nickname}-${messageDisplayData.id}`}>
                       <UserLabel
                         username={messageDisplayData.nickname}
                         type={userLabel}

diff --git a/packages/desktop/src/renderer/components/widgets/channels/ChannelMessages.test.tsx b/packages/desktop/src/renderer/components/widgets/channels/ChannelMessages.test.tsx
@@ -87,6 +87,7 @@ describe('ChannelMessages', () => {
                 >
                   <div
                     class="MuiListItemText-root BasicMessageComponentmessageCard css-tlelie-MuiListItemText-root"
+                    data-testid="userMessagesWrapper-string-string"
                   >
                     <div
                       class="MuiGrid-root MuiGrid-container MuiGrid-wrap-xs-nowrap css-aii0rt-MuiGrid-root"

diff --git a/packages/e2e-tests/package.json b/packages/e2e-tests/package.json
@@ -10,7 +10,8 @@
     "lint-ci": "eslint --ext .js,.ts ./src/",
     "prettier:write": "prettier --write .",
     "prettier:check": "prettier --check .",
-    "test": "jest --runInBand --detectOpenHandles --forceExit",
+    "test": "cross-env TEST_MODE=true jest --runInBand --detectOpenHandles --forceExit",
+    "test:prod": "jest --runInBand --detectOpenHandles --forceExit",
     "test:watch": "jest --watchAll"
   },
   "devDependencies": {

diff --git a/packages/e2e-tests/src/selectors.ts b/packages/e2e-tests/src/selectors.ts
@@ -4,6 +4,7 @@ import { BuildSetup, type BuildSetupInit } from './utils'
 export class App {
   thenableWebDriver?: ThenableWebDriver
   buildSetup: BuildSetup
+  isOpened: boolean
   constructor(buildSetupConfig?: BuildSetupInit) {
     this.buildSetup = new BuildSetup({ ...buildSetupConfig })
   }
@@ -16,13 +17,19 @@ export class App {
   }
 
   async open() {
+    console.log('Opening the app', this.buildSetup.dataDir)
     this.buildSetup.resetDriver()
     await this.buildSetup.createChromeDriver()
+    this.isOpened = true
     this.thenableWebDriver = this.buildSetup.getDriver()
     await this.driver.getSession()
+    const debugModal = new DebugModeModal(this.driver)
+    await debugModal.close()
   }
 
   async close(options?: { forceSaveState?: boolean }) {
+    if (!this.isOpened) return
+    console.log('Closing the app', this.buildSetup.dataDir)
     if (options?.forceSaveState) {
       await this.saveState() // Selenium creates community and closes app so fast that redux state may not be saved properly
       await this.waitForSavedState()
@@ -33,6 +40,8 @@ export class App {
       this.buildSetup.killNine()
       await new Promise<void>(resolve => setTimeout(() => resolve(), 2000))
     }
+    this.isOpened = false
+    console.log('App closed', this.buildSetup.dataDir)
   }
 
   get saveStateButton() {
@@ -59,12 +68,6 @@ export class StartingLoadingPanel {
   get element() {
     return this.driver.wait(until.elementLocated(By.xpath('//div[@data-testid="startingPanelComponent"]')))
   }
-  // get element() {
-  //   return this.driver.wait(until.elementLocated(By.xpath(`//span[text()="${this.text}"]`)))
-  // }
-  // get title() {
-  //   return this.driver.findElement(By.xpath(`//span[text()="${this.text}"]`))
-  // }
 }
 
 export class WarningModal {
@@ -227,6 +230,19 @@ export class Channel {
     return await messagesGroup.findElement(By.xpath('//p[@data-testid="/messagesGroupContent-/"]'))
   }
 
+  async waitForUserMessage(username: string, messageContent: string) {
+    console.log(`Waiting for user "${username}" message "${messageContent}"`)
+    return this.driver.wait(async () => {
+      const messages = await this.getUserMessages(username)
+      const hasMessage = messages.find(async msg => {
+        const messageText = await msg.getText()
+        console.log(`got message "${messageText}"`)
+        return messageText.includes(messageContent)
+      })
+      return hasMessage
+    })
+  }
+
   get getAllMessages() {
     return this.driver.wait(until.elementsLocated(By.xpath('//*[contains(@data-testid, "userMessages-")]')))
   }
@@ -256,6 +272,26 @@ export class Channel {
     )
   }
 
+  async waitForLabel(username: string, label: string) {
+    console.log(`Waiting for user's "${username}" label "${label}" label`)
+    await this.driver.wait(async () => {
+      const labels = await this.driver.findElements(By.xpath(`//*[contains(@data-testid, "userLabel-${username}")]`))
+      const properLabels = labels.filter(async labelElement => {
+        const labelText = await labelElement.getText()
+        return labelText === label
+      })
+      return properLabels.length > 0
+    })
+  }
+
+  async waitForLabelsNotPresent(username: string) {
+    console.log(`Waiting for user's "${username}" label to not be present`)
+    await this.driver.wait(async () => {
+      const labels = await this.driver.findElements(By.xpath(`//*[contains(@data-testid, "userLabel-${username}")]`))
+      return labels.length === 0
+    })
+  }
+
   async getMessage(text: string) {
     return await this.driver.wait(until.elementLocated(By.xpath(`//span[contains(text(),"${text}")]`)))
   }
@@ -375,18 +411,27 @@ export class DebugModeModal {
   }
 
   get element() {
-    return this.driver.wait(until.elementLocated(By.xpath("//h3[text()='App is running in debug mode']")))
+    return this.driver.wait(until.elementLocated(By.xpath("//h3[text()='App is running in debug mode']")), 5000)
   }
 
   get button() {
-    return this.driver.wait(until.elementLocated(By.xpath("//button[text()='Understand']")))
+    return this.driver.wait(until.elementLocated(By.xpath("//button[text()='Understand']")), 5000)
   }
 
   async close() {
-    console.log('Closing debug modal')
-    await this.element.isDisplayed()
-    const button = await this.button
-    console.log('Debug modal title is displayed')
+    if (!process.env.TEST_MODE) return
+    let button
+    try {
+      console.log('Closing debug modal')
+      await this.element.isDisplayed()
+      console.log('Debug modal title is displayed')
+      button = await this.button
+      console.log('Debug modal button is displayed')
+    } catch (e) {
+      console.log('Debug modal might have been covered by "join community" modal', e.message)
+      return
+    }
+
     await button.isDisplayed()
     console.log('Button is displayed')
     await button.click()

diff --git a/packages/e2e-tests/src/tests/invitationLink.test.ts b/packages/e2e-tests/src/tests/invitationLink.test.ts
@@ -44,14 +44,6 @@ describe('New user joins using invitation link while having app opened', () => {
       await ownerApp.open()
     })
 
-    if (process.env.TEST_MODE) {
-      it('Owner closes debug modal', async () => {
-        console.log('Invitation Link', 2)
-        const debugModal = new DebugModeModal(ownerApp.driver)
-        await debugModal.close()
-      })
-    }
-
     it('JoinCommunityModal - owner switches to create community', async () => {
       console.log('Invitation Link', 4)
       const joinModal = new JoinCommunityModal(ownerApp.driver)
@@ -121,13 +113,6 @@ describe('New user joins using invitation link while having app opened', () => {
       console.log('Guest opens app')
       await guestApp.open()
     })
-    if (process.env.TEST_MODE) {
-      it('Close debug modal', async () => {
-        console.log('Invitation Link', 12)
-        const debugModal = new DebugModeModal(guestApp.driver)
-        await debugModal.close()
-      })
-    }
 
     it.skip('Guest clicks invitation link with invalid invitation code', async () => {
       // Fix when modals ordering is fixed (joining modal hiddes warning modal)
-Original file line number
+Diff line change
@@ Expand Up / @@ -87,6 +87,7 @@ describe('ChannelMessages', () => { @@
                     >
                       <div
                         class="MuiListItemText-root BasicMessageComponentmessageCard css-tlelie-MuiListItemText-root"
+                        data-testid="userMessagesWrapper-string-string"
                       >
                         <div
                           class="MuiGrid-root MuiGrid-container MuiGrid-wrap-xs-nowrap css-aii0rt-MuiGrid-root"
@@ Expand Down @@