nikrozman/element-web
1
0
Fork 0
Code Issues Actions 3 Packages Projects Releases Wiki Activity

Merge branch 'develop' into midhun/new-memberlist

Browse Source
This commit is contained in:
R Midhun Suresh
2025-01-05 19:11:58 +05:30
committed by GitHub
parent c40b823f98 3fb10baedf
commit f52d7a8e20
48 changed files with 4573 additions and 350 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
playwright/e2e/crypto/event-shields.spec.ts
View File

@@ -53,6 +53,8 @@ test.describe("Cryptography", function () {
// Even though Alice has seen Bob's join event, Bob may not have done so yet. Wait for the sync to arrive.
await bob.awaitRoomMembership(testRoomId);
await app.client.network.setupRoute();
});
test("should show the correct shield on e2e events", async ({

3
playwright/e2e/lazy-loading/lazy-loading.spec.ts
View File

@@ -25,12 +25,13 @@ test.describe("Lazy Loading", () => {
});
});
test.beforeEach(async ({ page, homeserver, user, bot }) => {
test.beforeEach(async ({ page, homeserver, user, bot, app }) => {
for (let i = 1; i <= 10; i++) {
const displayName = `Charly #${i}`;
const bot = new Bot(page, homeserver, { displayName, startClient: false, autoAcceptInvites: false });
charlies.push(bot);
}
await app.client.network.setupRoute();
});
const name = "Lazy Loading Test";

24
playwright/e2e/pinned-messages/index.ts
View File

@@ -13,6 +13,8 @@ import { Client } from "../../pages/client";
import { ElementAppPage } from "../../pages/ElementAppPage";
import { Bot } from "../../pages/bot";
type RoomRef = { name: string; roomId: string };
/**
* Set up for pinned message tests.
*/
@@ -47,7 +49,7 @@ export class Helpers {
* @param room - the name of the room to send messages into
* @param messages - the list of messages to send, these can be strings or implementations of MessageSpec like `editOf`
*/
async receiveMessages(room: string | { name: string }, messages: string[]) {
async receiveMessages(room: RoomRef, messages: string[]) {
await this.sendMessageAsClient(this.bot, room, messages);
}
@@ -55,9 +57,8 @@ export class Helpers {
* Use the supplied client to send messages or perform actions as specified by
* the supplied {@link Message} items.
*/
private async sendMessageAsClient(cli: Client, roomName: string | { name: string }, messages: string[]) {
const room = await this.findRoomByName(typeof roomName === "string" ? roomName : roomName.name);
const roomId = await room.evaluate((room) => room.roomId);
private async sendMessageAsClient(cli: Client, room: RoomRef, messages: string[]) {
const roomId = room.roomId;
for (const message of messages) {
await cli.sendMessage(roomId, { body: message, msgtype: "m.text" });
@@ -73,22 +74,11 @@ export class Helpers {
}
}
/**
* Find a room by its name
* @param roomName
* @private
*/
private async findRoomByName(roomName: string) {
return this.app.client.evaluateHandle((cli, roomName) => {
return cli.getRooms().find((r) => r.name === roomName);
}, roomName);
}
/**
* Open the room with the supplied name.
*/
async goTo(room: string | { name: string }) {
await this.app.viewRoomByName(typeof room === "string" ? room : room.name);
async goTo(room: RoomRef) {
await this.app.viewRoomByName(room.name);
}
/**

2
playwright/e2e/read-receipts/high-level.spec.ts
View File

@@ -120,7 +120,7 @@ test.describe("Read receipts", { tag: "@mergequeue" }, () => {
await util.assertUnread(room2, 40);
// When I jump to a message in the middle and page up
await msg.jumpTo(room2.name, "x\ny\nz\nMsg0020");
await msg.jumpTo(room2, "x\ny\nz\nMsg0020");
await util.pageUp();
// Then the room is still unread

59
playwright/e2e/read-receipts/index.ts
View File

@@ -13,6 +13,8 @@ import { Bot } from "../../pages/bot";
import { Client } from "../../pages/client";
import { ElementAppPage } from "../../pages/ElementAppPage";
type RoomRef = { name: string; roomId: string };
/**
* Set up for a read receipt test:
* - Create a user with the supplied name
@@ -22,9 +24,9 @@ import { ElementAppPage } from "../../pages/ElementAppPage";
*/
export const test = base.extend<{
roomAlphaName?: string;
roomAlpha: { name: string; roomId: string };
roomAlpha: RoomRef;
roomBetaName?: string;
roomBeta: { name: string; roomId: string };
roomBeta: RoomRef;
msg: MessageBuilder;
util: Helpers;
}>({
@@ -248,12 +250,13 @@ export class MessageBuilder {
/**
* Find and display a message.
*
* @param roomName the name of the room to look inside
* @param roomRef the ref of the room to look inside
* @param message the content of the message to fine
* @param includeThreads look for messages inside threads, not just the main timeline
*/
async jumpTo(roomName: string, message: string, includeThreads = false) {
const room = await this.helpers.findRoomByName(roomName);
async jumpTo(roomRef: RoomRef, message: string, includeThreads = false) {
const room = await this.helpers.findRoomById(roomRef.roomId);
expect(room).toBeTruthy();
const foundMessage = await this.getMessage(room, message, includeThreads);
const roomId = await room.evaluate((room) => room.roomId);
const foundMessageId = await foundMessage.evaluate((ev) => ev.getId());
@@ -333,9 +336,10 @@ class Helpers {
* Use the supplied client to send messages or perform actions as specified by
* the supplied {@link Message} items.
*/
async sendMessageAsClient(cli: Client, roomName: string | { name: string }, messages: Message[]) {
const room = await this.findRoomByName(typeof roomName === "string" ? roomName : roomName.name);
const roomId = await room.evaluate((room) => room.roomId);
async sendMessageAsClient(cli: Client, roomRef: RoomRef, messages: Message[]) {
const roomId = roomRef.roomId;
const room = await this.findRoomById(roomId);
expect(room).toBeTruthy();
for (const message of messages) {
if (typeof message === "string") {
@@ -359,7 +363,7 @@ class Helpers {
/**
* Open the room with the supplied name.
*/
async goTo(room: string | { name: string }) {
async goTo(room: RoomRef) {
await this.app.viewRoomByName(typeof room === "string" ? room : room.name);
}
@@ -423,17 +427,16 @@ class Helpers {
});
}
getRoomListTile(room: string | { name: string }) {
const roomName = typeof room === "string" ? room : room.name;
return this.page.getByRole("treeitem", { name: new RegExp("^" + roomName) });
getRoomListTile(label: string) {
return this.page.getByRole("treeitem", { name: new RegExp("^" + label) });
}
/**
* Click the "Mark as Read" context menu item on the room with the supplied name
* in the room list.
*/
async markAsRead(room: string | { name: string }) {
await this.getRoomListTile(room).click({ button: "right" });
async markAsRead(room: RoomRef) {
await this.getRoomListTile(room.name).click({ button: "right" });
await this.page.getByText("Mark as read").click();
}
@@ -441,8 +444,8 @@ class Helpers {
* Assert that the room with the supplied name is "read" in the room list - i.g.
* has not dot or count of unread messages.
*/
async assertRead(room: string | { name: string }) {
const tile = this.getRoomListTile(room);
async assertRead(room: RoomRef) {
const tile = this.getRoomListTile(room.name);
await expect(tile.locator(".mx_NotificationBadge_dot")).not.toBeVisible();
await expect(tile.locator(".mx_NotificationBadge_count")).not.toBeVisible();
}
@@ -452,7 +455,7 @@ class Helpers {
* (In practice, this just waits a short while to allow any unread marker to
* appear, and then asserts that the room is read.)
*/
async assertStillRead(room: string | { name: string }) {
async assertStillRead(room: RoomRef) {
await this.page.waitForTimeout(200);
await this.assertRead(room);
}
@@ -462,8 +465,8 @@ class Helpers {
* @param room - the name of the room to check
* @param count - the numeric count to assert, or if "." specified then a bold/dot (no count) state is asserted
*/
async assertUnread(room: string | { name: string }, count: number | ".") {
const tile = this.getRoomListTile(room);
async assertUnread(room: RoomRef, count: number | ".") {
const tile = this.getRoomListTile(room.name);
if (count === ".") {
await expect(tile.locator(".mx_NotificationBadge_dot")).toBeVisible();
} else {
@@ -478,8 +481,8 @@ class Helpers {
* @param room - the name of the room to check
* @param lessThan - the number of unread messages that is too many
*/
async assertUnreadLessThan(room: string | { name: string }, lessThan: number) {
const tile = this.getRoomListTile(room);
async assertUnreadLessThan(room: RoomRef, lessThan: number) {
const tile = this.getRoomListTile(room.name);
// https://playwright.dev/docs/test-assertions#expectpoll
// .toBeLessThan doesn't have a retry mechanism, so we use .poll
await expect
@@ -496,8 +499,8 @@ class Helpers {
* @param room - the name of the room to check
* @param greaterThan - the number of unread messages that is too few
*/
async assertUnreadGreaterThan(room: string | { name: string }, greaterThan: number) {
const tile = this.getRoomListTile(room);
async assertUnreadGreaterThan(room: RoomRef, greaterThan: number) {
const tile = this.getRoomListTile(room.name);
// https://playwright.dev/docs/test-assertions#expectpoll
// .toBeGreaterThan doesn't have a retry mechanism, so we use .poll
await expect
@@ -531,10 +534,10 @@ class Helpers {
});
}
async findRoomByName(roomName: string): Promise<JSHandle<Room>> {
return this.app.client.evaluateHandle((cli, roomName) => {
return cli.getRooms().find((r) => r.name === roomName);
}, roomName);
async findRoomById(roomId: string): Promise<JSHandle<Room>> {
return this.app.client.evaluateHandle((cli, roomId) => {
return cli.getRooms().find((r) => r.roomId === roomId);
}, roomId);
}
private async getThreadListTile(rootMessage: string) {
@@ -578,7 +581,7 @@ class Helpers {
* @param room - the name of the room to send messages into
* @param messages - the list of messages to send, these can be strings or implementations of MessageSpec like `editOf`
*/
async receiveMessages(room: string | { name: string }, messages: Message[]) {
async receiveMessages(room: RoomRef, messages: Message[]) {
await this.sendMessageAsClient(this.bot, room, messages);
}

2
playwright/e2e/read-receipts/new-messages-in-threads.spec.ts
View File

@@ -101,7 +101,7 @@ test.describe("Read receipts", { tag: "@mergequeue" }, () => {
await util.goTo(room1);
// When I read an older message in the thread
await msg.jumpTo(room2.name, "InThread0000", true);
await msg.jumpTo(room2, "InThread0000", true);
// Then the thread is still marked as unread
await util.backToThreadsList();

2
playwright/e2e/read-receipts/new-messages-main-timeline.spec.ts
View File

@@ -59,7 +59,7 @@ test.describe("Read receipts", { tag: "@mergequeue" }, () => {
await util.assertUnread(room2, 30);
// When I jump to one of the older messages
await msg.jumpTo(room2.name, "Msg0001");
await msg.jumpTo(room2, "Msg0001");
// Then the room is still unread, but some messages were read
await util.assertUnreadLessThan(room2, 30);

2
playwright/e2e/read-receipts/new-messages-thread-roots.spec.ts
View File

@@ -49,7 +49,7 @@ test.describe("Read receipts", { tag: "@mergequeue" }, () => {
await util.assertUnread(room2, 61); // Sanity
// When I jump to an old message and read the thread
await msg.jumpTo(room2.name, "beforeThread0000");
await msg.jumpTo(room2, "beforeThread0000");
// When the thread is opened, the timeline is scrolled until the thread root reached the center
await util.openThread("ThreadRoot");

6
playwright/e2e/read-receipts/read-receipts.spec.ts
View File

@@ -196,7 +196,7 @@ test.describe("Read receipts", { tag: "@mergequeue" }, () => {
await sendThreadedReadReceipt(app, thread1a, main1);
// Then the room has only one unread - the one in the thread
await util.goTo(otherRoomName);
await util.goTo({ name: otherRoomName, roomId: otherRoomId });
await util.assertUnreadThread("Message 1");
});
@@ -214,7 +214,7 @@ test.describe("Read receipts", { tag: "@mergequeue" }, () => {
// Then the room has no unreads
await expect(page.getByLabel(`${otherRoomName}`)).toBeVisible();
await util.goTo(otherRoomName);
await util.goTo({ name: otherRoomName, roomId: otherRoomId });
await util.assertReadThread("Message 1");
});
@@ -239,7 +239,7 @@ test.describe("Read receipts", { tag: "@mergequeue" }, () => {
// receipt is for a later event. The room should therefore be
// read, and the thread unread.
await expect(page.getByLabel(`${otherRoomName}`)).toBeVisible();
await util.goTo(otherRoomName);
await util.goTo({ name: otherRoomName, roomId: otherRoomId });
await util.assertUnreadThread("Message 1");
});

119
playwright/e2e/sliding-sync/sliding-sync.spec.ts
View File

@@ -8,17 +8,57 @@ Please see LICENSE files in the repository root for full details.
import { Page, Request } from "@playwright/test";
import { test, expect } from "../../element-web-test";
import { test as base, expect } from "../../element-web-test";
import type { ElementAppPage } from "../../pages/ElementAppPage";
import type { Bot } from "../../pages/bot";
import { ProxyInstance, SlidingSyncProxy } from "../../plugins/sliding-sync-proxy";
const test = base.extend<{
slidingSyncProxy: ProxyInstance;
testRoom: { roomId: string; name: string };
joinedBot: Bot;
}>({
slidingSyncProxy: async ({ context, page, homeserver }, use) => {
const proxy = new SlidingSyncProxy(homeserver.config.dockerUrl, context);
const proxyInstance = await proxy.start();
const proxyAddress = `http://localhost:${proxyInstance.port}`;
await page.addInitScript((proxyAddress) => {
window.localStorage.setItem(
"mx_local_settings",
JSON.stringify({
feature_sliding_sync_proxy_url: proxyAddress,
}),
);
window.localStorage.setItem("mx_labs_feature_feature_sliding_sync", "true");
}, proxyAddress);
await use(proxyInstance);
await proxy.stop();
},
// Ensure slidingSyncProxy is set up before the user fixture as it relies on an init script
credentials: async ({ slidingSyncProxy, credentials }, use) => {
await use(credentials);
},
testRoom: async ({ user, app }, use) => {
const name = "Test Room";
const roomId = await app.client.createRoom({ name });
await use({ roomId, name });
},
joinedBot: async ({ app, bot, testRoom }, use) => {
const roomId = testRoom.roomId;
await bot.prepareClient();
const bobUserId = await bot.evaluate((client) => client.getUserId());
await app.client.evaluate(
async (client, { bobUserId, roomId }) => {
await client.invite(roomId, bobUserId);
},
{ bobUserId, roomId },
);
await bot.joinRoom(roomId);
await use(bot);
},
});
test.describe("Sliding Sync", () => {
let roomId: string;
test.beforeEach(async ({ slidingSyncProxy, page, user, app }) => {
roomId = await app.client.createRoom({ name: "Test Room" });
});
const checkOrder = async (wantOrder: string[], page: Page) => {
await expect(page.getByRole("group", { name: "Rooms" }).locator(".mx_RoomTile_title")).toHaveText(wantOrder);
};
@@ -32,22 +72,13 @@ test.describe("Sliding Sync", () => {
});
};
const createAndJoinBot = async (app: ElementAppPage, bot: Bot): Promise<Bot> => {
await bot.prepareClient();
const bobUserId = await bot.evaluate((client) => client.getUserId());
await app.client.evaluate(
async (client, { bobUserId, roomId }) => {
await client.invite(roomId, bobUserId);
},
{ bobUserId, roomId },
);
await bot.joinRoom(roomId);
return bot;
};
// Load the user fixture for all tests
test.beforeEach(({ user }) => {});
test.skip("should render the Rooms list in reverse chronological order by default and allowing sorting A-Z", async ({
test("should render the Rooms list in reverse chronological order by default and allowing sorting A-Z", async ({
page,
app,
testRoom,
}) => {
// create rooms and check room names are correct
for (const fruit of ["Apple", "Pineapple", "Orange"]) {
@@ -55,7 +86,7 @@ test.describe("Sliding Sync", () => {
await expect(page.getByRole("treeitem", { name: fruit })).toBeVisible();
}
// Check count, 3 fruits + 1 room created in beforeEach = 4
// Check count, 3 fruits + 1 testRoom = 4
await expect(page.locator(".mx_RoomSublist_tiles").getByRole("treeitem")).toHaveCount(4);
await checkOrder(["Orange", "Pineapple", "Apple", "Test Room"], page);
@@ -71,7 +102,7 @@ test.describe("Sliding Sync", () => {
await checkOrder(["Apple", "Orange", "Pineapple", "Test Room"], page);
});
test.skip("should move rooms around as new events arrive", async ({ page, app }) => {
test("should move rooms around as new events arrive", async ({ page, app, testRoom }) => {
// create rooms and check room names are correct
const roomIds: string[] = [];
for (const fruit of ["Apple", "Pineapple", "Orange"]) {
@@ -94,7 +125,7 @@ test.describe("Sliding Sync", () => {
await checkOrder(["Pineapple", "Orange", "Apple", "Test Room"], page);
});
test.skip("should not move the selected room: it should be sticky", async ({ page, app }) => {
test("should not move the selected room: it should be sticky", async ({ page, app, testRoom }) => {
// create rooms and check room names are correct
const roomIds: string[] = [];
for (const fruit of ["Apple", "Pineapple", "Orange"]) {
@@ -122,11 +153,9 @@ test.describe("Sliding Sync", () => {
await checkOrder(["Apple", "Orange", "Pineapple", "Test Room"], page);
});
test.skip("should show the right unread notifications", async ({ page, app, user, bot }) => {
const bob = await createAndJoinBot(app, bot);
test.skip("should show the right unread notifications", async ({ page, user, joinedBot: bob, testRoom }) => {
// send a message in the test room: unread notification count should increment
await bob.sendMessage(roomId, "Hello World");
await bob.sendMessage(testRoom.roomId, "Hello World");
const treeItemLocator1 = page.getByRole("treeitem", { name: "Test Room 1 unread message." });
await expect(treeItemLocator1.locator(".mx_NotificationBadge_count")).toHaveText("1");
@@ -136,7 +165,7 @@ test.describe("Sliding Sync", () => {
);
// send an @mention: highlight count (red) should be 2.
await bob.sendMessage(roomId, `Hello ${user.displayName}`);
await bob.sendMessage(testRoom.roomId, `Hello ${user.displayName}`);
const treeItemLocator2 = page.getByRole("treeitem", {
name: "Test Room 2 unread messages including mentions.",
});
@@ -150,9 +179,8 @@ test.describe("Sliding Sync", () => {
).not.toBeAttached();
});
test.skip("should not show unread indicators", async ({ page, app, bot }) => {
test("should not show unread indicators", async ({ page, app, joinedBot: bot, testRoom }) => {
// TODO: for now. Later we should.
await createAndJoinBot(app, bot);
// disable notifs in this room (TODO: CS API call?)
const locator = page.getByRole("treeitem", { name: "Test Room" });
@@ -165,7 +193,7 @@ test.describe("Sliding Sync", () => {
await checkOrder(["Dummy", "Test Room"], page);
await bot.sendMessage(roomId, "Do you read me?");
await bot.sendMessage(testRoom.roomId, "Do you read me?");
// wait for this message to arrive, tell by the room list resorting
await checkOrder(["Test Room", "Dummy"], page);
@@ -178,15 +206,18 @@ test.describe("Sliding Sync", () => {
test("should update user settings promptly", async ({ page, app }) => {
await app.settings.openUserSettings("Preferences");
const locator = page.locator(".mx_SettingsFlag").filter({ hasText: "Show timestamps in 12 hour format" });
expect(locator).toBeVisible();
expect(locator.locator(".mx_ToggleSwitch_on")).not.toBeAttached();
await expect(locator).toBeVisible();
await expect(locator.locator(".mx_ToggleSwitch_on")).not.toBeAttached();
await locator.locator(".mx_ToggleSwitch_ball").click();
expect(locator.locator(".mx_ToggleSwitch_on")).toBeAttached();
await expect(locator.locator(".mx_ToggleSwitch_on")).toBeAttached();
});
test.skip("should show and be able to accept/reject/rescind invites", async ({ page, app, bot }) => {
await createAndJoinBot(app, bot);
test("should show and be able to accept/reject/rescind invites", async ({
page,
app,
joinedBot: bot,
testRoom,
}) => {
const clientUserId = await app.client.evaluate((client) => client.getUserId());
// invite bot into 3 rooms:
@@ -262,10 +293,10 @@ test.describe("Sliding Sync", () => {
// Regression test for a bug in SS mode, but would be useful to have in non-SS mode too.
// This ensures we are setting RoomViewStore state correctly.
test.skip("should clear the reply to field when swapping rooms", async ({ page, app }) => {
test("should clear the reply to field when swapping rooms", async ({ page, app, testRoom }) => {
await app.client.createRoom({ name: "Other Room" });
await expect(page.getByRole("treeitem", { name: "Other Room" })).toBeVisible();
await app.client.sendMessage(roomId, "Hello world");
await app.client.sendMessage(testRoom.roomId, "Hello world");
// select the room
await page.getByRole("treeitem", { name: "Test Room" }).click();
@@ -294,11 +325,11 @@ test.describe("Sliding Sync", () => {
});
// Regression test for https://github.com/vector-im/element-web/issues/21462
test.skip("should not cancel replies when permalinks are clicked", async ({ page, app }) => {
test("should not cancel replies when permalinks are clicked", async ({ page, app, testRoom }) => {
// we require a first message as you cannot click the permalink text with the avatar in the way
await app.client.sendMessage(roomId, "First message");
await app.client.sendMessage(roomId, "Permalink me");
await app.client.sendMessage(roomId, "Reply to me");
await app.client.sendMessage(testRoom.roomId, "First message");
await app.client.sendMessage(testRoom.roomId, "Permalink me");
await app.client.sendMessage(testRoom.roomId, "Reply to me");
// select the room
await page.getByRole("treeitem", { name: "Test Room" }).click();
@@ -322,7 +353,7 @@ test.describe("Sliding Sync", () => {
await expect(page.locator(".mx_ReplyPreview")).toBeVisible();
});
test.skip("should send unsubscribe_rooms for every room switch", async ({ page, app }) => {
test("should send unsubscribe_rooms for every room switch", async ({ page, app }) => {
// create rooms and check room names are correct
const roomIds: string[] = [];
for (const fruit of ["Apple", "Pineapple", "Orange"]) {

21
playwright/e2e/spaces/threads-activity-centre/index.ts
View File

@@ -14,6 +14,8 @@ import { Bot } from "../../../pages/bot";
import { Client } from "../../../pages/client";
import { ElementAppPage } from "../../../pages/ElementAppPage";
type RoomRef = { name: string; roomId: string };
/**
* Set up for a read receipt test:
* - Create a user with the supplied name
@@ -181,9 +183,10 @@ export class Helpers {
* Use the supplied client to send messages or perform actions as specified by
* the supplied {@link Message} items.
*/
async sendMessageAsClient(cli: Client, roomName: string | { name: string }, messages: Message[]) {
const room = await this.findRoomByName(typeof roomName === "string" ? roomName : roomName.name);
const roomId = await room.evaluate((room) => room.roomId);
async sendMessageAsClient(cli: Client, roomRef: RoomRef, messages: Message[]) {
const roomId = roomRef.roomId;
const room = await this.findRoomById(roomId);
expect(room).toBeTruthy();
for (const message of messages) {
if (typeof message === "string") {
@@ -205,7 +208,7 @@ export class Helpers {
/**
* Open the room with the supplied name.
*/
async goTo(room: string | { name: string }) {
async goTo(room: RoomRef) {
await this.app.viewRoomByName(typeof room === "string" ? room : room.name);
}
@@ -220,10 +223,10 @@ export class Helpers {
await expect(this.page.locator(".mx_ThreadView_timelinePanelWrapper")).toBeVisible();
}
async findRoomByName(roomName: string): Promise<JSHandle<Room>> {
return this.app.client.evaluateHandle((cli, roomName) => {
return cli.getRooms().find((r) => r.name === roomName);
}, roomName);
async findRoomById(roomId: string): Promise<JSHandle<Room | undefined>> {
return this.app.client.evaluateHandle((cli, roomId) => {
return cli.getRooms().find((r) => r.roomId === roomId);
}, roomId);
}
/**
@@ -231,7 +234,7 @@ export class Helpers {
* @param room - the name of the room to send messages into
* @param messages - the list of messages to send, these can be strings or implementations of MessageSpec like `editOf`
*/
async receiveMessages(room: string | { name: string }, messages: Message[]) {
async receiveMessages(room: RoomRef, messages: Message[]) {
await this.sendMessageAsClient(this.bot, room, messages);
}

22
playwright/element-web-test.ts
View File

@@ -23,7 +23,6 @@ import { OAuthServer } from "./plugins/oauth_server";
import { Crypto } from "./pages/crypto";
import { Toasts } from "./pages/toasts";
import { Bot, CreateBotOpts } from "./pages/bot";
import { ProxyInstance, SlidingSyncProxy } from "./plugins/sliding-sync-proxy";
import { Webserver } from "./plugins/webserver";
// Enable experimental service worker support
@@ -121,7 +120,6 @@ export interface Fixtures {
uut?: Locator; // Unit Under Test, useful place to refer a prepared locator
botCreateOpts: CreateBotOpts;
bot: Bot;
slidingSyncProxy: ProxyInstance;
labsFlags: string[];
webserver: Webserver;
disablePresence: boolean;
@@ -258,6 +256,7 @@ export const test = base.extend<Fixtures>({
app: async ({ page }, use) => {
const app = new ElementAppPage(page);
await use(app);
await app.cleanup();
},
crypto: async ({ page, homeserver, request }, use) => {
await use(new Crypto(page, homeserver, request));
@@ -281,25 +280,6 @@ export const test = base.extend<Fixtures>({
await mailhog.stop();
},
slidingSyncProxy: async ({ page, user, homeserver }, use) => {
const proxy = new SlidingSyncProxy(homeserver.config.dockerUrl);
const proxyInstance = await proxy.start();
const proxyAddress = `http://localhost:${proxyInstance.port}`;
await page.addInitScript((proxyAddress) => {
window.localStorage.setItem(
"mx_local_settings",
JSON.stringify({
feature_sliding_sync_proxy_url: proxyAddress,
}),
);
window.localStorage.setItem("mx_labs_feature_feature_sliding_sync", "true");
}, proxyAddress);
await page.goto("/");
await page.waitForSelector(".mx_MatrixChat", { timeout: 30000 });
await use(proxyInstance);
await proxy.stop();
},
// eslint-disable-next-line no-empty-pattern
webserver: async ({}, use) => {
const webserver = new Webserver();

4
playwright/pages/ElementAppPage.ts
View File

@@ -37,6 +37,10 @@ export class ElementAppPage {
return this._timeline;
}
public async cleanup() {
await this._client?.cleanup();
}
/**
* Open the top left user menu, returning a Locator to the resulting context menu.
*/

26
playwright/pages/client.ts
View File

@@ -52,6 +52,10 @@ export class Client {
this.network = new Network(page, this);
}
public async cleanup() {
await this.network.destroyRoute();
}
public evaluate<R, Arg, O extends MatrixClient = MatrixClient>(
pageFunction: PageFunctionOn<O, Arg, R>,
arg: Arg,
@@ -175,18 +179,18 @@ export class Client {
public async createRoom(options: ICreateRoomOpts): Promise<string> {
const client = await this.prepareClient();
return await client.evaluate(async (cli, options) => {
const resp = await cli.createRoom(options);
const roomId = resp.room_id;
const roomPromise = new Promise<void>((resolve) => {
const onRoom = (room: Room) => {
if (room.roomId === roomId) {
cli.off(window.matrixcs.ClientEvent.Room, onRoom);
resolve();
}
};
cli.on(window.matrixcs.ClientEvent.Room, onRoom);
});
const { room_id: roomId } = await cli.createRoom(options);
if (!cli.getRoom(roomId)) {
await new Promise<void>((resolve) => {
const onRoom = (room: Room) => {
if (room.roomId === roomId) {
cli.off(window.matrixcs.ClientEvent.Room, onRoom);
resolve();
}
};
cli.on(window.matrixcs.ClientEvent.Room, onRoom);
});
await roomPromise;
}
return roomId;
}, options);

59
playwright/pages/network.ts
View File

@@ -6,19 +6,22 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
Please see LICENSE files in the repository root for full details.
*/
import type { Page, Request } from "@playwright/test";
import type { Page, Request, Route } from "@playwright/test";
import type { Client } from "./client";
/**
* Utility class to simulate offline mode by blocking all requests to the homeserver.
* Will not affect any requests before `setupRoute` is called,
* which happens implicitly using the goOffline/goOnline methods.
*/
export class Network {
private isOffline = false;
private readonly setupPromise: Promise<void>;
private setupPromise?: Promise<void>;
constructor(
private page: Page,
private client: Client,
) {
this.setupPromise = this.setupRoute();
}
) {}
/**
* Checks if the request is from the client associated with this network object.
@@ -30,25 +33,47 @@ export class Network {
return authHeader === `Bearer ${accessToken}`;
}
private async setupRoute() {
await this.page.route("**/_matrix/**", async (route) => {
if (this.isOffline && (await this.isRequestFromOurClient(route.request()))) {
route.abort();
} else {
route.continue();
}
});
private handler = async (route: Route) => {
if (this.isOffline && (await this.isRequestFromOurClient(route.request()))) {
await route.abort();
} else {
await route.continue();
}
};
/**
* Intercept all /_matrix/ networking requests for client ready to continue/abort them based on offline status
* which is set by the goOffline/goOnline methods
*/
public async setupRoute() {
if (!this.setupPromise) {
this.setupPromise = this.page.route("**/_matrix/**", this.handler);
}
await this.setupPromise;
}
// Intercept all /_matrix/ networking requests for client and fail them
/**
* Cease intercepting all /_matrix/ networking requests for client
*/
public async destroyRoute() {
if (!this.setupPromise) return;
await this.page.unroute("**/_matrix/**", this.handler);
this.setupPromise = undefined;
}
/**
* Reject all /_matrix/ networking requests for client
*/
async goOffline(): Promise<void> {
await this.setupPromise;
await this.setupRoute();
this.isOffline = true;
}
// Remove intercept on all /_matrix/ networking requests for this client
/**
* Continue all /_matrix/ networking requests for this client
*/
async goOnline(): Promise<void> {
await this.setupPromise;
await this.setupRoute();
this.isOffline = false;
}
}

18
playwright/plugins/sliding-sync-proxy/index.ts
View File

@@ -6,6 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
Please see LICENSE files in the repository root for full details.
*/
import type { BrowserContext, Route } from "@playwright/test";
import { getFreePort } from "../utils/port";
import { Docker } from "../docker";
import { PG_PASSWORD, PostgresDocker } from "../postgres";
@@ -24,7 +25,19 @@ export class SlidingSyncProxy {
private readonly postgresDocker = new PostgresDocker("sliding-sync");
private instance: ProxyInstance;
constructor(private synapseIp: string) {}
constructor(
private synapseIp: string,
private context: BrowserContext,
) {}
private syncHandler = async (route: Route) => {
if (!this.instance) return route.abort("blockedbyclient");
const baseUrl = `http://localhost:${this.instance.port}`;
await route.continue({
url: new URL(route.request().url().split("/").slice(3).join("/"), baseUrl).href,
});
};
async start(): Promise<ProxyInstance> {
console.log(new Date(), "Starting sliding sync proxy...");
@@ -50,10 +63,13 @@ export class SlidingSyncProxy {
console.log(new Date(), "started!");
this.instance = { containerId, postgresId, port };
await this.context.route("**/_matrix/client/unstable/org.matrix.msc3575/sync*", this.syncHandler);
return this.instance;
}
async stop(): Promise<void> {
await this.context.unroute("**/_matrix/client/unstable/org.matrix.msc3575/sync*", this.syncHandler);
await this.postgresDocker.stop();
await this.proxyDocker.stop();
console.log(new Date(), "Stopped sliding sync proxy.");