[Demo] Migrate from `fetch-mock` to `msw` #10844

erwanMarmelab · 2025-07-21T09:19:55Z

Problem

fetch-mock brings us back some vulnerabilities.

Solution

Change it for MSW

To Do

demo
crm
simple

Additional Checks

The PR targets master for a bugfix or a documentation fix, or next for a feature

erwanMarmelab · 2025-07-21T10:24:50Z

examples/demo/src/fakeServer/graphql.ts

-    const data = generateData();
-    const restServer = JsonGraphqlServer({ data });
-    const handler = restServer.getHandler();
-    const handlerWithLogs = (url: string, opts: any) =>


We don't need to keep it. If we don't pass quiet: true to worker.start, it will automatically displays us the right logs 👍

djhi

Good work, except you probably didn't test the graphql demo which is broken

Madeorsk · 2025-07-29T16:24:11Z

examples/simple/package.json

+    },
+    "msw": {
+        "workerDirectory": [
+            "assets",


Why assets? mockServiceWorker.js is in public directory, not assets.

fzaninotto · 2025-07-31T06:31:22Z

needs rebase

fzaninotto

The e-commerce demo doesn't work (either with REST or GraphQL). I get this error in the SAP when running make run-demo:

error loading dynamically imported module: http://localhost:8000/src/dashboard/OrderChart.tsx

fzaninotto · 2025-07-31T11:40:03Z

examples/crm/src/providers/fakerest/fakeServer.ts

+});
+export const worker = setupWorker(http.all(/http:\/\/localhost:4000/, handler));
+
+export default () => worker;


Why do you need this export? I don't see it imported anywhere.

It's imported from the projet root index: https://github.com/marmelab/react-admin/pull/10844/files#diff-90bd1ee22f91d95ef929650cdc5d138faa08887243bdbc5167f2671ed876196dR5

fzaninotto · 2025-07-31T11:43:22Z

yarn.lock

@@ -7361,6 +7496,13 @@ __metadata:
  languageName: node
  linkType: hard

+"cli-width@npm:^4.1.0":


This one is duplicated (albeit in a different major version). Can we avoid it?

We shouldn't deduplicate different major versions

fzaninotto · 2025-07-31T11:43:41Z

yarn.lock

@@ -7734,6 +7876,13 @@ __metadata:
  languageName: node
  linkType: hard

+"cookie@npm:^0.7.2":


also duplicated

Same with an additional note: before 1.0.0, all versions can have breaking changes

fzaninotto · 2025-07-31T11:44:07Z

yarn.lock

@@ -9862,6 +10003,15 @@ __metadata:
  languageName: node
  linkType: hard

+"fakerest@npm:4.1.3, fakerest@npm:^4.1.3":


also duplicated

fzaninotto · 2025-07-31T11:44:52Z

yarn.lock

-  version: 4.3.2
-  resolution: "linkifyjs@npm:4.3.2"
-  checksum: 1a85e6b368304a4417567fe5e38651681e3e82465590836942d1b4f3c834cc35532898eb1e2479f6337d9144b297d418eb708b6be8ed0b3dc3954a3588e07971
+  version: 4.1.1


please revert this one, linkify < 4.3.2 has a security vulnerability

fzaninotto · 2025-07-31T11:45:33Z

yarn.lock

@@ -18802,6 +18992,18 @@ __metadata:
  languageName: node
  linkType: hard

+"tough-cookie@npm:^4.1.4":


duplicate package

fzaninotto · 2025-07-31T11:46:38Z

examples/simple/package.json

@@ -14,6 +14,7 @@
        "@mui/material": "^5.16.12",
        "@tanstack/react-query": "^5.83.0",
        "@tanstack/react-query-devtools": "^5.83.0",
+        "fakerest": "^4.1.3",
        "jsonexport": "^3.2.0",
        "lodash": "~4.17.5",
        "ra-data-fakerest": "^5.10.0",


no longer needed. Also, missing ra-data-simple-rest.

djhi · 2025-07-31T12:14:28Z

The e-commerce demo doesn't work (either with REST or GraphQL). I get this error in the SAP when running make run-demo:

I can't reproduce this. Can you try resetting your node_modules?

fzaninotto

The error was caused by Firefox being Firefox. Rebooting it fixed it.

pass the demo example to MSW

884d6a1

erwanMarmelab added the WIP Work In Progress label Jul 21, 2025

vercel bot deployed to Preview – react-admin-storybook July 21, 2025 09:24 View deployment

format package.json

24a7319

vercel bot deployed to Preview – react-admin-storybook July 21, 2025 09:30 View deployment

Update yarn.lock

5d67581

erwanMarmelab commented Jul 21, 2025

View reviewed changes

vercel bot deployed to Preview – react-admin-storybook July 21, 2025 10:26 View deployment

fix demo build

d5f6480

vercel bot deployed to Preview – react-admin-storybook July 21, 2025 11:53 View deployment

erwanMarmelab added 2 commits July 21, 2025 15:00

pass the simple example to MSW (with a fake server)

28c7b69

format package.son

e2e0258

vercel bot deployed to Preview – react-admin-storybook July 21, 2025 13:07 View deployment

pass the crm example to MSW (with a fake server)

b2af17a

vercel bot deployed to Preview – react-admin-storybook July 21, 2025 13:22 View deployment

erwanMarmelab added RFR Ready For Review and removed WIP Work In Progress labels Jul 21, 2025

djhi self-requested a review July 21, 2025 15:24

djhi requested changes Jul 21, 2025

View reviewed changes

WIP

6bd73ed

vercel bot deployed to Preview – react-admin-storybook July 21, 2025 15:56 View deployment

Fix demo

3aab6dc

vercel bot deployed to Preview – react-admin-storybook July 22, 2025 08:09 View deployment

Madeorsk requested changes Jul 30, 2025

View reviewed changes

djhi added 2 commits July 30, 2025 14:55

Fix simple example MSW config

59a4028

Disable MSW logs in all examples

a81377b

djhi requested a review from Madeorsk July 30, 2025 12:57

vercel bot deployed to Preview – react-admin-storybook July 30, 2025 12:59 View deployment

Merge branch 'master' into demo/msw

5e5e270

vercel bot deployed to Preview – react-admin-storybook July 31, 2025 07:54 View deployment

Increase cypress timeout

af0fb7a

vercel bot deployed to Preview – react-admin-storybook July 31, 2025 08:33 View deployment

Restore delay on data providers

9c66455

vercel bot deployed to Preview – react-admin-storybook July 31, 2025 09:03 View deployment

Remove unnecessary cypress config change

ee09c27

vercel bot deployed to Preview – react-admin-storybook July 31, 2025 09:07 View deployment

fzaninotto requested changes Jul 31, 2025

View reviewed changes

Fix duplicates & clean up simple example deps

b6363ee

djhi requested a review from fzaninotto July 31, 2025 12:15

vercel bot deployed to Preview – react-admin-storybook July 31, 2025 12:17 View deployment

Fix yarn.lock

8b80b12

vercel bot deployed to Preview – react-admin-storybook July 31, 2025 13:29 View deployment

fzaninotto approved these changes Jul 31, 2025

View reviewed changes

djhi merged commit 42d7465 into master Jul 31, 2025
33 of 35 checks passed

djhi deleted the demo/msw branch July 31, 2025 13:45

djhi added this to the 5.10.1 milestone Aug 1, 2025

djhi mentioned this pull request Aug 25, 2025

[chore] Revert MSW usage on simple example #10893

Merged

1 task

Uh oh!

[Demo] Migrate from fetch-mock to msw #10844

[Demo] Migrate from fetch-mock to msw #10844

Uh oh!

Conversation

erwanMarmelab commented Jul 21, 2025 • edited by djhi Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Problem

Solution

To Do

Additional Checks

Uh oh!

Choose a reason for hiding this comment

Uh oh!

djhi left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

fzaninotto commented Jul 31, 2025

Uh oh!

fzaninotto left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

djhi commented Jul 31, 2025

Uh oh!

fzaninotto left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

[Demo] Migrate from `fetch-mock` to `msw` #10844

[Demo] Migrate from `fetch-mock` to `msw` #10844

erwanMarmelab commented Jul 21, 2025 •

edited by djhi

Loading