fix(import-analysis): preserve importedUrls import order (#14465)

packages/vite/src/node/plugins/importAnalysis.ts

@@ -278,7 +278,6 @@ export function importAnalysisPlugin(config: ResolvedConfig): Plugin {
       let needQueryInjectHelper = false
       let s: MagicString | undefined
       const str = () => s || (s = new MagicString(source))
-      const importedUrls = new Set<string>()
       let isPartiallySelfAccepting = false
       const importedBindings = enablePartialAccept
         ? new Map<string, Set<string>>()
@@ -411,6 +410,7 @@ export function importAnalysisPlugin(config: ResolvedConfig): Plugin {
         return [url, resolved.id]
       }
 
+      const orderedImportedUrls = new Array<string | undefined>(imports.length)
       const orderedAcceptedUrls = new Array<Set<UrlPosition> | undefined>(
         imports.length,
       )
@@ -640,7 +640,7 @@ export function importAnalysisPlugin(config: ResolvedConfig): Plugin {
             const hmrUrl = unwrapId(stripBase(url, base))
             const isLocalImport = !isExternalUrl(hmrUrl) && !isDataUrl(hmrUrl)
             if (isLocalImport) {
-              importedUrls.add(hmrUrl)
+              orderedImportedUrls[index] = hmrUrl
             }
 
             if (enablePartialAccept && importedBindings) {
@@ -718,6 +718,9 @@ export function importAnalysisPlugin(config: ResolvedConfig): Plugin {
         }),
       )
 
+      const importedUrls = new Set(
+        orderedImportedUrls.filter(Boolean) as string[],
+      )
       const acceptedUrls = mergeAcceptedUrls(orderedAcceptedUrls)
       const acceptedExports = mergeAcceptedUrls(orderedAcceptedExports)
 

playground/module-graph/__tests__/module-graph.spec.ts

@@ -0,0 +1,12 @@
+import { expect, test } from 'vitest'
+import { isServe, page, viteServer } from '~utils'
+
+test.runIf(isServe)('importedUrls order is preserved', async () => {
+  const el = page.locator('.imported-urls-order')
+  expect(await el.textContent()).toBe('[success]')
+  const mod = await viteServer.moduleGraph.getModuleByUrl(
+    '/imported-urls-order.js',
+  )
+  const importedModuleIds = [...mod.importedModules].map((m) => m.url)
+  expect(importedModuleIds).toEqual(['\x00virtual:slow-module', '/empty.js'])
+})

playground/module-graph/imported-urls-order.js

@@ -0,0 +1,7 @@
+import { msg } from 'virtual:slow-module'
+import './empty.js'
+
+export default msg
+
+// This module tests that the import order is preserved in this module's `importedUrls` property
+// as the imports can be processed in parallel

playground/module-graph/index.html

@@ -0,0 +1,10 @@
+<div class="imported-urls-order"></div>
+
+<script type="module">
+  import importedUrlsOrderSuccess from './imported-urls-order'
+  text('.imported-urls-order', importedUrlsOrderSuccess)
+
+  function text(el, text) {
+    document.querySelector(el).textContent = text
+  }
+</script>

playground/module-graph/package.json

@@ -0,0 +1,12 @@
+{
+  "name": "@vitejs/test-hmr",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "debug": "node --inspect-brk ../../packages/vite/bin/vite",
+    "preview": "vite preview"
+  }
+}

playground/module-graph/vite.config.ts

@@ -0,0 +1,23 @@
+import { defineConfig } from 'vite'
+import type { Plugin } from 'vite'
+
+export default defineConfig({
+  plugins: [slowModulePlugin()],
+})
+
+function slowModulePlugin(): Plugin {
+  return {
+    name: 'slow-module',
+    resolveId(id) {
+      if (id === 'virtual:slow-module') {
+        return '\0virtual:slow-module'
+      }
+    },
+    async load(id) {
+      if (id === '\0virtual:slow-module') {
+        await new Promise((resolve) => setTimeout(resolve, 500))
+        return `export const msg = '[success]'`
+      }
+    },
+  }
+}