Update mws dependency

Signed-off-by: Michael Weimann <[email protected]>

Author: weeman1337

packages/element-web-guest-module/jest.config.js

@@ -21,5 +21,10 @@ module.exports = {
   roots: ['<rootDir>/src'],
   preset: 'ts-jest',
   testEnvironment: 'jsdom',
+  // Fix imports not found
+  // https://mswjs.io/docs/migrations/1.x-to-2.x#cannot-find-module-mswnode-jsdom
+  testEnvironmentOptions: {
+    customExportConditions: [''],
+  },
   setupFilesAfterEnv: ['<rootDir>/src/setupTests.ts'],
 };

packages/element-web-guest-module/package.json

@@ -28,7 +28,7 @@
     "@types/react": "^17",
     "cross-fetch": "^4.0.0",
     "esbuild": "^0.20.2",
-    "msw": "^1.3.2",
+    "msw": "^2.4.11",
     "react": "17.0.2",
     "react-dom": "17.0.2",
     "typescript": "~5.0.4"

packages/element-web-guest-module/src/components/RegisterDialog.test.tsx

@@ -18,7 +18,7 @@ import { ModuleApi } from '@matrix-org/react-sdk-module-api/lib/ModuleApi';
 import { AccountAuthInfo } from '@matrix-org/react-sdk-module-api/lib/types/AccountAuthInfo';
 import { render, screen, waitFor } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
-import { rest } from 'msw';
+import { HttpResponse, http } from 'msw';
 import { setupServer } from 'msw/node';
 import React from 'react';
 import { generatePassword } from '../utils';
@@ -75,20 +75,24 @@ describe('<RegisterDialog />', () => {
     await userEvent.type(nameInput, 'My Name');
 
     let resolvePromise: (value: AccountAuthInfo) => void | undefined;
+
     server.use(
-      rest.post(
+      http.post(
         'http://synapse.local/_synapse/client/register_guest',
-        async (req, res, ctx) => {
-          const body = await req.json();
+        async ({ request }) => {
+          const body = (await request.json()) as { displayname: string };
+
           if (body.displayname !== 'My Name') {
-            return res(ctx.status(400));
+            return new HttpResponse(null, {
+              status: 400,
+            });
           }
 
           const response = await new Promise<AccountAuthInfo>((resolve) => {
             resolvePromise = resolve;
           });
 
-          return res(ctx.json(response));
+          return HttpResponse.json(response);
         },
       ),
     );
@@ -190,9 +194,9 @@ describe('<RegisterDialog />', () => {
     await userEvent.type(nameInput, 'My Name');
 
     server.use(
-      rest.post(
+      http.post(
         'http://synapse.local/_synapse/client/register_guest',
-        async (_, res, ctx) => res(ctx.status(400)),
+        async () => new Response(undefined, { status: 400 }),
       ),
     );
 

packages/element-web-guest-module/src/setupTests.ts

@@ -14,6 +14,8 @@
  * limitations under the License.
  */
 
+import { TextDecoder, TextEncoder } from 'util';
+
 // jest-dom adds custom jest matchers for asserting on DOM nodes.
 // allows you to do things like:
 // expect(element).toHaveTextContent(/react/i)
@@ -23,3 +25,6 @@ import '@testing-library/jest-dom';
 // Jest don't support the native node-fetch in the jsdom environment yet
 // https://github.com/jsdom/jsdom/issues/1724
 import 'cross-fetch/polyfill';
+
+// Publish TextEncoder and TextDecoder in the global scope
+Object.assign(global, { TextDecoder, TextEncoder });