End to end tests for threads

test/end-to-end-tests/.gitignore

@@ -4,3 +4,4 @@ element/env
 performance-entries.json
 lib
 logs
+homeserver.log

test/end-to-end-tests/src/rest/room.ts

@@ -19,25 +19,30 @@ import uuidv4 = require('uuid/v4');
 
 import { RestSession } from "./session";
 import { Logger } from "../logger";
+import { RestThread } from "./thread";
 
-/* no pun intented */
+/* no pun intended */
 export class RestRoom {
     constructor(readonly session: RestSession, readonly roomId: string, readonly log: Logger) {}
 
-    async talk(message: string): Promise<void> {
+    async talk(message: string): Promise<string> {
         this.log.step(`says "${message}" in ${this.roomId}`);
         const txId = uuidv4();
-        await this.session.put(`/rooms/${this.roomId}/send/m.room.message/${txId}`, {
+        const { event_id: eventId } = await this.session.put(`/rooms/${this.roomId}/send/m.room.message/${txId}`, {
             "msgtype": "m.text",
             "body": message,
         });
         this.log.done();
-        return txId;
+        return eventId;
     }
 
     async leave(): Promise<void> {
         this.log.step(`leaves ${this.roomId}`);
         await this.session.post(`/rooms/${this.roomId}/leave`);
         this.log.done();
     }
+
+    thread(threadId: string): RestThread {
+        return new RestThread(this.session, this.roomId, threadId, this.log);
+    }
 }

test/end-to-end-tests/src/rest/thread.ts

@@ -0,0 +1,45 @@
+/*
+Copyright 2022 The Matrix.org Foundation C.I.C.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+        http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+import uuidv4 = require('uuid/v4');
+
+import { RestSession } from "./session";
+import { Logger } from "../logger";
+
+/* no pun intended */
+export class RestThread {
+    constructor(
+        readonly session: RestSession,
+        readonly roomId: string,
+        readonly threadId: string,
+        readonly log: Logger,
+    ) {}
+
+    async talk(message: string): Promise<void> {
+        this.log.step(`says "${message}" in ${this.roomId}`);
+        const txId = uuidv4();
+        await this.session.put(`/rooms/${this.roomId}/send/m.room.message/${txId}`, {
+            "msgtype": "m.text",
+            "body": message,
+            "m.relates_to": {
+                "rel_type": "m.thread",
+                "event_id": this.threadId,
+            },
+        });
+        this.log.done();
+        return txId;
+    }
+}

test/end-to-end-tests/src/scenario.ts

@@ -30,6 +30,8 @@ import { stickerScenarios } from './scenarios/sticker';
 import { userViewScenarios } from "./scenarios/user-view";
 import { ssoCustomisationScenarios } from "./scenarios/sso-customisations";
 import { updateScenarios } from "./scenarios/update";
+import { threadsScenarios } from "./scenarios/threads";
+import { enableThreads } from "./usecases/threads";
 
 export async function scenario(createSession: (s: string) => Promise<ElementSession>,
     restCreator: RestSessionCreator): Promise<void> {
@@ -48,13 +50,20 @@ export async function scenario(createSession: (s: string) => Promise<ElementSess
     const alice = await createUser("alice");
     const bob = await createUser("bob");
 
+    // Enable threads for Alice & Bob before going any further as it requires refreshing the app
+    // which otherwise loses all performance ticks.
+    console.log("Enabling threads: ");
+    await enableThreads(alice);
+    await enableThreads(bob);
+
     await toastScenarios(alice, bob);
     await userViewScenarios(alice, bob);
     await roomDirectoryScenarios(alice, bob);
     await e2eEncryptionScenarios(alice, bob);
     console.log("create REST users:");
     const charlies = await createRestUsers(restCreator);
     await lazyLoadingScenarios(alice, bob, charlies);
+    await threadsScenarios(alice, bob);
     // do spaces scenarios last as the rest of the alice/bob tests may get confused by spaces
     await spacesScenarios(alice, bob);
 

test/end-to-end-tests/src/scenarios/threads.ts

@@ -0,0 +1,83 @@
+/*
+Copyright 2022 The Matrix.org Foundation C.I.C.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+        http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+import { ElementSession } from "../session";
+import {
+    assertTimelineThreadSummary,
+    clickTimelineThreadSummary,
+    editThreadMessage,
+    reactThreadMessage,
+    redactThreadMessage,
+    sendThreadMessage,
+    startThread,
+} from "../usecases/threads";
+import { sendMessage } from "../usecases/send-message";
+import {
+    assertThreadListHasUnreadIndicator,
+    clickLatestThreadInThreadListPanel,
+    closeRoomRightPanel,
+    openThreadListPanel,
+} from "../usecases/rightpanel";
+
+export async function threadsScenarios(alice: ElementSession, bob: ElementSession): Promise<void> {
+    console.log(" threads tests:");
+
+    // Alice sends message
+    await sendMessage(alice, "Hey bob, what do you think about X?");
+
+    // Bob responds via a thread
+    await startThread(bob, "I think its Y!");
+
+    // Alice sees thread summary and opens thread panel
+    await assertTimelineThreadSummary(alice, "bob", "I think its Y!");
+    await assertTimelineThreadSummary(bob, "bob", "I think its Y!");
+    await clickTimelineThreadSummary(alice);
+
+    // Bob closes right panel
+    await closeRoomRightPanel(bob);
+
+    // Alice responds in thread
+    await sendThreadMessage(alice, "Great!");
+    await assertTimelineThreadSummary(alice, "alice", "Great!");
+    await assertTimelineThreadSummary(bob, "alice", "Great!");
+
+    // Alice reacts to Bob's message instead
+    await reactThreadMessage(alice, "😁");
+    await assertTimelineThreadSummary(alice, "alice", "Great!");
+    await assertTimelineThreadSummary(bob, "alice", "Great!");
+    await redactThreadMessage(alice);
+    await assertTimelineThreadSummary(alice, "bob", "I think its Y!");
+    await assertTimelineThreadSummary(bob, "bob", "I think its Y!");
+
+    // Bob sees notification dot on the thread header icon
+    await assertThreadListHasUnreadIndicator(bob);
+
+    // Bob opens thread list and inspects it
+    await openThreadListPanel(bob);
+
+    // Bob opens thread in right panel via thread list
+    await clickLatestThreadInThreadListPanel(bob);
+
+    // Bob responds to thread
+    await sendThreadMessage(bob, "Testing threads s'more :)");
+    await assertTimelineThreadSummary(alice, "bob", "Testing threads s'more :)");
+    await assertTimelineThreadSummary(bob, "bob", "Testing threads s'more :)");
+
+    // Bob edits thread response
+    await editThreadMessage(bob, "Testing threads some more :)");
+    await assertTimelineThreadSummary(alice, "bob", "Testing threads some more :)");
+    await assertTimelineThreadSummary(bob, "bob", "Testing threads some more :)");
+}

test/end-to-end-tests/src/session.ts

@@ -131,8 +131,11 @@ export class ElementSession {
         await input.type(text);
     }
 
-    public query(selector: string, timeout: number = DEFAULT_TIMEOUT,
-        hidden = false): Promise<puppeteer.ElementHandle> {
+    public query(
+        selector: string,
+        timeout: number = DEFAULT_TIMEOUT,
+        hidden = false,
+    ): Promise<puppeteer.ElementHandle> {
         return this.page.waitForSelector(selector, { visible: true, timeout, hidden });
     }
 

test/end-to-end-tests/src/usecases/rightpanel.ts

@@ -16,6 +16,28 @@ limitations under the License.
 
 import { ElementSession } from "../session";
 
+export async function closeRoomRightPanel(session: ElementSession): Promise<void> {
+    const button = await session.query(".mx_BaseCard_close");
+    await button.click();
+}
+
+export async function openThreadListPanel(session: ElementSession): Promise<void> {
+    await session.query('.mx_RoomHeader .mx_AccessibleButton[aria-label="Threads"]');
+    const button = await session.queryWithoutWaiting('.mx_RoomHeader .mx_AccessibleButton[aria-label="Threads"]' +
+        ':not(.mx_RightPanel_headerButton_highlight)');
+    await button?.click();
+}
+
+export async function assertThreadListHasUnreadIndicator(session: ElementSession): Promise<void> {
+    await session.query('.mx_RoomHeader .mx_AccessibleButton[aria-label="Threads"] ' +
+        '.mx_RightPanel_headerButton_unreadIndicator');
+}
+
+export async function clickLatestThreadInThreadListPanel(session: ElementSession): Promise<void> {
+    const threads = await session.queryAll(".mx_ThreadPanel .mx_EventTile");
+    await threads[threads.length - 1].click();
+}
+
 export async function openRoomRightPanel(session: ElementSession): Promise<void> {
     // block until we have a roomSummaryButton
     const roomSummaryButton = await session.query('.mx_RoomHeader .mx_AccessibleButton[aria-label="Room Info"]');

test/end-to-end-tests/src/usecases/signup.ts

@@ -19,8 +19,12 @@ import { strict as assert } from 'assert';
 
 import { ElementSession } from "../session";
 
-export async function signup(session: ElementSession, username: string, password: string,
-    homeserver: string): Promise<void> {
+export async function signup(
+    session: ElementSession,
+    username: string,
+    password: string,
+    homeserver: string,
+): Promise<void> {
     session.log.step("signs up");
     await session.goto(session.url('/#/register'));
     // change the homeserver by clicking the advanced section