Mock Server Returns HTML Instead of JSON in React Vite #2235
-
|
Occasionally, the mock server returns an HTML document instead of the expected JSON object. Initially, the server works as expected, but it randomly returns HTML at unexpected times, disrupting the normal flow of the application. Expected BehaviorThe mock server should consistently return a JSON object as specified. Actual BehaviorThe mock server intermittently returns the following HTML document: <!doctype html>
<html lang="en">
<head>
<script type="module">import { injectIntoGlobalHook } from "/@react-refresh";
injectIntoGlobalHook(window);
window.$RefreshReg$ = () => {};
window.$RefreshSig$ = () => (type) => type;</script>
<script type="module" src="/@vite/client"></script>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + React + TS</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx?t=1723146340705"></script>
</body>
</html>EnvironmentMock Server Version: "msw": "^2.3.1", |
Beta Was this translation helpful? Give feedback.
Replies: 3 comments 5 replies
-
|
Update: This only happens in the Chrome browser. Since I started using Firefox, the problem has disappeared. |
Beta Was this translation helpful? Give feedback.
-
|
im having the sabe issue! Both Arc and chrome |
Beta Was this translation helpful? Give feedback.
-
|
Arc is a Chromium-based browser so i think the is no different between the both. |
Beta Was this translation helpful? Give feedback.
-
|
Is this timing-sensitive? As in, have you notice this occur after your app has been idle for some time? |
Beta Was this translation helpful? Give feedback.
-
I think yes, but this also never happens in Firefox, no matter how long the tab hasn't been used and this has nothing to do with React Query or Axios because I tried using the built-in fetch API and also switched to useSWR, but the same problem occurred again |
Beta Was this translation helpful? Give feedback.
-
|
I suspect this is #2115, #367, #1744. In essence, Chromium has their own Service Worker inactivity policy, and once they terminate MSW's worker, it cannot properly restart unless you refresh the page (reevaluate JavaScript). There's one thing we can try on MSW's side but it depends on how Chrome reenables the worker (if it fires any events whatsoever for us to know). I suggest you follow the open issue I referenced for a solution. Thanks. |
Beta Was this translation helpful? Give feedback.
-
|
@kettanaito thanks very helpful |
Beta Was this translation helpful? Give feedback.
-
|
I'm having this problem with Chrome, Arc, and Firefox! 
I don’t know if this issue will be followed up again. Here is my code https://github.com/TinsFox/mws-example/tree/loader Hope it helps to solve this problem |
Beta Was this translation helpful? Give feedback.
I suspect this is #2115, #367, #1744. In essence, Chromium has their own Service Worker inactivity policy, and once they terminate MSW's worker, it cannot properly restart unless you refresh the page (reevaluate JavaScript).
There's one thing we can try on MSW's side but it depends on how Chrome reenables the worker (if it fires any events whatsoever for us to know). I suggest you follow the open issue I referenced for a solution. Thanks.