From b24b95119b0c3222024f44a6818c6e7820b3b0d2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=BF=A0=20/=20green?= <green@sapphi.red>
Date: Fri, 10 Nov 2023 19:00:22 +0900
Subject: [PATCH] fix: add watch in fallback file load (#14938)

---
 packages/vite/src/node/server/pluginContainer.ts |  3 +++
 playground/hmr-root/__tests__/hmr-root.spec.ts   | 10 ++++++++++
 playground/hmr-root/foo.js                       |  1 +
 playground/hmr-root/root/index.html              |  7 +++++++
 playground/hmr-root/vite.config.ts               |  9 +++++++++
 5 files changed, 30 insertions(+)
 create mode 100644 playground/hmr-root/__tests__/hmr-root.spec.ts
 create mode 100644 playground/hmr-root/foo.js
 create mode 100644 playground/hmr-root/root/index.html
 create mode 100644 playground/hmr-root/vite.config.ts

diff --git a/packages/vite/src/node/server/pluginContainer.ts b/packages/vite/src/node/server/pluginContainer.ts
index 1026eb4d4..4c6fd6c83 100644
--- a/packages/vite/src/node/server/pluginContainer.ts
+++ b/packages/vite/src/node/server/pluginContainer.ts
@@ -722,6 +722,9 @@ export async function createPluginContainer(
           return result
         }
       }
+
+      watchFiles.add(id)
+      if (watcher) ensureWatchedFile(watcher, id, root)
       return null
     },
 
diff --git a/playground/hmr-root/__tests__/hmr-root.spec.ts b/playground/hmr-root/__tests__/hmr-root.spec.ts
new file mode 100644
index 000000000..d38d761c9
--- /dev/null
+++ b/playground/hmr-root/__tests__/hmr-root.spec.ts
@@ -0,0 +1,10 @@
+import { expect, test } from 'vitest'
+
+import { editFile, isServe, page, untilUpdated } from '~utils'
+
+test.runIf(isServe)('should watch files outside root', async () => {
+  expect(await page.textContent('#foo')).toBe('foo')
+  editFile('foo.js', (code) => code.replace("'foo'", "'foobar'"))
+  await page.waitForEvent('load')
+  await untilUpdated(async () => await page.textContent('#foo'), 'foobar')
+})
diff --git a/playground/hmr-root/foo.js b/playground/hmr-root/foo.js
new file mode 100644
index 000000000..cb3564682
--- /dev/null
+++ b/playground/hmr-root/foo.js
@@ -0,0 +1 @@
+export const foo = 'foo'
diff --git a/playground/hmr-root/root/index.html b/playground/hmr-root/root/index.html
new file mode 100644
index 000000000..ddf351462
--- /dev/null
+++ b/playground/hmr-root/root/index.html
@@ -0,0 +1,7 @@
+<div id="foo"></div>
+
+<script type="module">
+  import { foo } from '../foo.js'
+
+  document.querySelector('#foo').textContent = foo
+</script>
diff --git a/playground/hmr-root/vite.config.ts b/playground/hmr-root/vite.config.ts
new file mode 100644
index 000000000..8afcd8e37
--- /dev/null
+++ b/playground/hmr-root/vite.config.ts
@@ -0,0 +1,9 @@
+import path from 'node:path'
+import url from 'node:url'
+import { defineConfig } from 'vite'
+
+const __dirname = path.dirname(url.fileURLToPath(import.meta.url))
+
+export default defineConfig({
+  root: path.join(__dirname, './root'),
+})