Update dependency typescript to v6 (#32927)

* Update dependency typescript to v6

* Switch to unplugin-vts

Workaround for https://github.com/qmhc/unplugin-dts/issues/467

And tweak tsconfigs

* tweak tsconfig

* Make tsc happy

---------

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>

apps/web/playwright/e2e/audio-player/audio-player.spec.ts

@@ -8,7 +8,7 @@ Please see LICENSE files in the repository root for full details.
 */
 
 import type { Locator, Page } from "@playwright/test";
-import { test, expect } from "../../element-web-test";
+import { test, expect, type ExtendedToMatchScreenshotOptions } from "../../element-web-test";
 import { SettingLevel } from "../../../src/settings/SettingLevel";
 import { Layout } from "../../../src/settings/enums/Layout";
 import { type ElementAppPage } from "../../pages/ElementAppPage";
@@ -94,7 +94,7 @@ test.describe("Audio player", { tag: ["@no-firefox", "@no-webkit"] }, () => {
         // Assert that rendering of the player settled and the play button is visible before taking a snapshot
         await checkPlayerVisibility(ircTile);
 
-        const screenshotOptions = {
+        const screenshotOptions: ExtendedToMatchScreenshotOptions = {
             css: `
                 /* The timestamp is of inconsistent width depending on the time the test runs at */
                 .mx_MessageTimestamp {
@@ -120,7 +120,7 @@ test.describe("Audio player", { tag: ["@no-firefox", "@no-webkit"] }, () => {
         };
 
         // Take a snapshot of mx_EventTile_last on IRC layout
-        screenshotOptions.clip = await page.locator(".mx_EventTile_last").boundingBox();
+        screenshotOptions.clip = (await page.locator(".mx_EventTile_last").boundingBox()) ?? undefined;
         await scrollToBottomOfTimeline(page);
         await expect(page).toMatchScreenshot(`${detail.replaceAll(" ", "-")}-irc-layout.png`, screenshotOptions);
 
@@ -129,7 +129,7 @@ test.describe("Audio player", { tag: ["@no-firefox", "@no-webkit"] }, () => {
         const groupTile = page.locator(".mx_EventTile_last[data-layout='group']");
         await groupTile.locator(".mx_MessageTimestamp").click();
         await checkPlayerVisibility(groupTile);
-        screenshotOptions.clip = await page.locator(".mx_EventTile_last").boundingBox();
+        screenshotOptions.clip = (await page.locator(".mx_EventTile_last").boundingBox()) ?? undefined;
         await scrollToBottomOfTimeline(page);
         await expect(page).toMatchScreenshot(`${detail.replaceAll(" ", "-")}-group-layout.png`, screenshotOptions);
 
@@ -138,7 +138,7 @@ test.describe("Audio player", { tag: ["@no-firefox", "@no-webkit"] }, () => {
         const bubbleTile = page.locator(".mx_EventTile_last[data-layout='bubble']");
         await bubbleTile.locator(".mx_MessageTimestamp").click();
         await checkPlayerVisibility(bubbleTile);
-        screenshotOptions.clip = await page.locator(".mx_EventTile_last").boundingBox();
+        screenshotOptions.clip = (await page.locator(".mx_EventTile_last").boundingBox()) ?? undefined;
         await scrollToBottomOfTimeline(page);
         await expect(page).toMatchScreenshot(`${detail.replaceAll(" ", "-")}-bubble-layout.png`, screenshotOptions);
     };

apps/web/playwright/e2e/crypto/crypto.spec.ts

@@ -44,7 +44,7 @@ const bobJoin = async (page: Page, bob: Bot) => {
         const bobRooms = cli.getRooms();
         if (!bobRooms.length) {
             await new Promise<void>((resolve) => {
-                const onMembership = (_event) => {
+                const onMembership = () => {
                     cli.off(window.matrixcs.RoomMemberEvent.Membership, onMembership);
                     resolve();
                 };

apps/web/playwright/e2e/crypto/decryption-failure-messages.spec.ts

@@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Com
 Please see LICENSE files in the repository root for full details.
 */
 
-import type { EmittedEvents, Preset } from "matrix-js-sdk/src/matrix";
+import type { Preset, RoomMemberEvent, RoomStateEvent } from "matrix-js-sdk/src/matrix";
 import { expect, test } from "../../element-web-test";
 import {
     createRoom,
@@ -122,7 +122,7 @@ test.describe("Cryptography", function () {
                 const roomId = await bob.evaluate(
                     async (client, { alice }) => {
                         const encryptionStatePromise = new Promise<void>((resolve) => {
-                            client.on("RoomState.events" as EmittedEvents, (event, _state, _lastStateEvent) => {
+                            client.on("RoomState.events" as RoomStateEvent.Events, (event, _state, _lastStateEvent) => {
                                 if (event.getType() === "m.room.encryption") {
                                     resolve();
                                 }
@@ -253,11 +253,14 @@ test.describe("Cryptography", function () {
 
                         // invite Alice
                         const inviteAlicePromise = new Promise<void>((resolve) => {
-                            client.on("RoomMember.membership" as EmittedEvents, (_event, member, _oldMembership?) => {
-                                if (member.userId === alice.userId && member.membership === "invite") {
-                                    resolve();
-                                }
-                            });
+                            client.on(
+                                "RoomMember.membership" as RoomMemberEvent.Membership,
+                                (_event, member, _oldMembership?) => {
+                                    if (member.userId === alice.userId && member.membership === "invite") {
+                                        resolve();
+                                    }
+                                },
+                            );
                         });
                         await client.invite(roomId, alice.userId);
                         // wait for the invite to come back so that we encrypt to Alice
@@ -271,11 +274,14 @@ test.describe("Cryptography", function () {
 
                         // kick Alice
                         const kickAlicePromise = new Promise<void>((resolve) => {
-                            client.on("RoomMember.membership" as EmittedEvents, (_event, member, _oldMembership?) => {
-                                if (member.userId === alice.userId && member.membership === "leave") {
-                                    resolve();
-                                }
-                            });
+                            client.on(
+                                "RoomMember.membership" as RoomMemberEvent.Membership,
+                                (_event, member, _oldMembership?) => {
+                                    if (member.userId === alice.userId && member.membership === "leave") {
+                                        resolve();
+                                    }
+                                },
+                            );
                         });
                         await client.kick(roomId, alice.userId);
                         await kickAlicePromise;

apps/web/playwright/e2e/crypto/dehydration.spec.ts

@@ -166,13 +166,9 @@ async function getDehydratedDeviceIds(client: Client): Promise<string[]> {
     return await client.evaluate(async (client) => {
         const userId = client.getUserId();
         const devices = await client.getCrypto().getUserDeviceInfo([userId]);
-        return Array.from(
-            devices
-                .get(userId)
-                .values()
-                .filter((d) => d.dehydrated)
-                .map((d) => d.deviceId),
-        );
+        return Array.from(devices.get(userId).values())
+            .filter((d) => d.dehydrated)
+            .map((d) => d.deviceId);
     });
 }
 

apps/web/playwright/e2e/crypto/utils.ts

@@ -579,8 +579,8 @@ export async function deleteCachedSecrets(page: Page) {
     await page.evaluate(async () => {
         const removeCachedSecrets = new Promise((resolve) => {
             const request = window.indexedDB.open("matrix-js-sdk::matrix-sdk-crypto");
-            request.onsuccess = (event: Event & { target: { result: IDBDatabase } }) => {
-                const db = event.target.result;
+            request.onsuccess = function (this: IDBRequest) {
+                const db = this.result as IDBDatabase;
                 const request = db.transaction("core", "readwrite").objectStore("core").delete("private_identity");
                 request.onsuccess = () => {
                     db.close();

apps/web/playwright/e2e/read-receipts/read-receipts.spec.ts

@@ -7,7 +7,7 @@ Please see LICENSE files in the repository root for full details.
 */
 
 import type { JSHandle } from "@playwright/test";
-import type { MatrixEvent, ISendEventResponse, ReceiptType } from "matrix-js-sdk/src/matrix";
+import type { MatrixEvent, ISendEventResponse, ReceiptType, RelationType } from "matrix-js-sdk/src/matrix";
 import { expect } from "../../element-web-test";
 import { type ElementAppPage } from "../../pages/ElementAppPage";
 import { type Bot } from "../../pages/bot";
@@ -47,7 +47,7 @@ test.describe("Read receipts", { tag: "@mergequeue" }, () => {
                     getId: () => eventResponse.event_id,
                     threadRootId,
                     getTs: () => 1,
-                    isRelation: (relType) => {
+                    isRelation: (relType: RelationType) => {
                         return !relType || relType === "m.thread";
                     },
                 } as any as MatrixEvent;

apps/web/playwright/e2e/timeline/timeline.spec.ts

@@ -7,7 +7,7 @@ Please see LICENSE files in the repository root for full details.
 */
 
 import type { Locator, Page } from "@playwright/test";
-import type { ISendEventResponse, EventType, MsgType } from "matrix-js-sdk/src/matrix";
+import type { ISendEventResponse, EventType, MsgType, IContent } from "matrix-js-sdk/src/matrix";
 import { test, expect } from "../../element-web-test";
 import { SettingLevel } from "../../../src/settings/SettingLevel";
 import { Layout } from "../../../src/settings/enums/Layout";
@@ -50,11 +50,9 @@ const expectAvatar = async (cli: Client, e: Locator, avatarUrl: string): Promise
 };
 
 const sendEvent = async (client: Client, roomId: string, html = false): Promise<ISendEventResponse> => {
-    const content = {
+    const content: IContent = {
         msgtype: "m.text" as MsgType,
         body: "Message",
-        format: undefined,
-        formatted_body: undefined,
     };
     if (html) {
         content.format = "org.matrix.custom.html";

apps/web/playwright/e2e/utils.ts

@@ -42,7 +42,7 @@ export async function waitForRoom(
             return new Promise<Room>((resolve) => {
                 const room = matrixClient.getRoom(roomId);
 
-                if (window[predicateId](room)) {
+                if ((<any>window)[predicateId](room)) {
                     resolve(room);
                     return;
                 }
@@ -50,7 +50,7 @@ export async function waitForRoom(
                 function onEvent(ev: MatrixEvent) {
                     if (ev.getRoomId() !== roomId) return;
 
-                    if (window[predicateId](room)) {
+                    if ((<any>window)[predicateId](room)) {
                         matrixClient.removeListener("event" as ClientEvent, onEvent);
                         resolve(room);
                     }