fix: add watch in fallback file load (#14938)

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
     },
 

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')
+})

playground/hmr-root/foo.js

@@ -0,0 +1 @@
+export const foo = 'foo'

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>

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'),
+})