From 9231a8634cf6513f96bba752d17e47cb1296ab03 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=BF=A0=20/=20green?= <green@sapphi.red>
Date: Mon, 19 Dec 2022 16:52:04 +0900
Subject: [PATCH] fix: don't invalidate when code is invalid (#67)

---
 packages/plugin-react/src/fast-refresh.ts |  1 +
 playground/react/__tests__/react.spec.ts  | 30 ++++++++++++++++++++---
 2 files changed, 27 insertions(+), 4 deletions(-)

diff --git a/packages/plugin-react/src/fast-refresh.ts b/packages/plugin-react/src/fast-refresh.ts
index 2dc7694f..9503d5ce 100644
--- a/packages/plugin-react/src/fast-refresh.ts
+++ b/packages/plugin-react/src/fast-refresh.ts
@@ -92,6 +92,7 @@ function isReactRefreshBoundary(mod) {
 }
 
 import.meta.hot.accept(mod => {
+  if (!mod) return;
   if (isReactRefreshBoundary(mod)) {
     ${timeout}
   } else {
diff --git a/playground/react/__tests__/react.spec.ts b/playground/react/__tests__/react.spec.ts
index 58057b78..d9b4d01e 100644
--- a/playground/react/__tests__/react.spec.ts
+++ b/playground/react/__tests__/react.spec.ts
@@ -19,10 +19,34 @@ test('should update', async () => {
 })
 
 test('should hmr', async () => {
-  editFile('App.jsx', (code) => code.replace('Vite + React', 'Updated'))
-  await untilUpdated(() => page.textContent('h1'), 'Hello Updated')
+  editFile('App.jsx', (code) =>
+    code.replace('Vite + React', 'Vite + React Updated'),
+  )
+  await untilUpdated(() => page.textContent('h1'), 'Hello Vite + React Updated')
   // preserve state
   expect(await page.textContent('#state-button')).toMatch('count is: 1')
+
+  editFile('App.jsx', (code) =>
+    code.replace('Vite + React Updated', 'Vite + React'),
+  )
+  await untilUpdated(() => page.textContent('h1'), 'Hello Vite + React')
+})
+
+test.runIf(isServe)('should not invalidate when code is invalid', async () => {
+  editFile('App.jsx', (code) =>
+    code.replace('<div className="App">', '<div className="App"}>'),
+  )
+
+  await untilUpdated(
+    () => page.textContent('vite-error-overlay .message-body'),
+    'Unexpected token',
+  )
+  // if import.meta.invalidate happened, the old page won't be shown because the page is reloaded
+  expect(await page.textContent('h1')).toMatch('Hello Vite + React')
+
+  editFile('App.jsx', (code) =>
+    code.replace('<div className="App"}>', '<div className="App">'),
+  )
 })
 
 test.runIf(isServe)(
@@ -59,7 +83,6 @@ if (!isBuild) {
         '[vite] hot updated: /hmr/parent.jsx',
         'Parent rendered',
       ],
-      true,
     )
     await untilUpdated(() => page.textContent('#parent'), 'Updated')
   })
@@ -86,7 +109,6 @@ if (!isBuild) {
         '[vite] hot updated: /context/ContextButton.jsx',
         'Parent rendered',
       ],
-      true,
     )
     await untilUpdated(
       () => page.textContent('#context-provider'),