refactor: remove ?used inject in glob plugin (#8900)

vitejs · Jul 3, 2022 · f9b5c14 · f9b5c14
1 parent ae34565
commit f9b5c14
Show file tree

Hide file tree

Showing 5 changed files with 91 additions and 79 deletions.
diff --git a/packages/vite/src/node/plugins/importMetaGlob.ts b/packages/vite/src/node/plugins/importMetaGlob.ts
@@ -18,7 +18,6 @@ import type { ViteDevServer } from '../server'
 import type { ModuleNode } from '../server/moduleGraph'
 import type { ResolvedConfig } from '../config'
 import { normalizePath, slash, transformStableResult } from '../utils'
-import { isCSSRequest } from './css'
 
 const { isMatch, scan } = micromatch
 
@@ -393,9 +392,6 @@ export async function transformGlobImport(
             let importPath = paths.importPath
             let importQuery = query
 
-            if (isCSSRequest(file))
-              importQuery = importQuery ? `${importQuery}&used` : '?used'
-
             if (importQuery && importQuery !== '?raw') {
               const fileExtension = basename(file).split('.').slice(-1)[0]
               if (fileExtension && restoreQueryExtension)

diff --git a/playground/glob-import/__tests__/glob-import.spec.ts b/playground/glob-import/__tests__/glob-import.spec.ts
@@ -1,11 +1,4 @@
-import {
-  addFile,
-  editFile,
-  isBuild,
-  page,
-  removeFile,
-  untilUpdated
-} from '~utils'
+import { addFile, editFile, isBuild, page, removeFile, withRetry } from '~utils'
 
 const filteredResult = {
   './alias.js': {
@@ -16,21 +9,12 @@ const filteredResult = {
   }
 }
 
-// json exports key order is altered during build, but it doesn't matter in
-// terms of behavior since module exports are not ordered anyway
-const json = isBuild
-  ? {
-      msg: 'baz',
-      default: {
-        msg: 'baz'
-      }
-    }
-  : {
-      default: {
-        msg: 'baz'
-      },
-      msg: 'baz'
-    }
+const json = {
+  msg: 'baz',
+  default: {
+    msg: 'baz'
+  }
+}
 
 const globWithAlias = {
   '/dir/alias.js': {
@@ -44,6 +28,13 @@ const allResult = {
     default: 'hi'
   },
   '/dir/baz.json': json,
+  '/dir/foo.css': isBuild
+    ? {
+        default: '.foo{color:#00f}\n'
+      }
+    : {
+        default: '.foo {\n  color: blue;\n}\n'
+      },
   '/dir/foo.js': {
     msg: 'foo'
   },
@@ -81,16 +72,18 @@ const relativeRawResult = {
 }
 
 test('should work', async () => {
-  await untilUpdated(
-    () => page.textContent('.result'),
-    JSON.stringify(allResult, null, 2),
-    true
-  )
-  await untilUpdated(
-    () => page.textContent('.result-node_modules'),
-    JSON.stringify(nodeModulesResult, null, 2),
-    true
-  )
+  await withRetry(async () => {
+    const actual = await page.textContent('.result')
+    expect(JSON.parse(actual)).toStrictEqual(allResult)
+  }, true)
+  await withRetry(async () => {
+    const actualEager = await page.textContent('.result-eager')
+    expect(JSON.parse(actualEager)).toStrictEqual(allResult)
+  }, true)
+  await withRetry(async () => {
+    const actualNodeModules = await page.textContent('.result-node_modules')
+    expect(JSON.parse(actualNodeModules)).toStrictEqual(nodeModulesResult)
+  }, true)
 })
 
 test('import glob raw', async () => {
@@ -113,55 +106,49 @@ test('unassigned import processes', async () => {
 
 if (!isBuild) {
   test('hmr for adding/removing files', async () => {
+    const resultElement = page.locator('.result')
+
     addFile('dir/a.js', '')
-    await untilUpdated(
-      () => page.textContent('.result'),
-      JSON.stringify(
-        {
-          '/dir/a.js': {},
-          ...allResult,
-          '/dir/index.js': {
-            ...allResult['/dir/index.js'],
-            modules: {
-              './a.js': {},
-              ...allResult['/dir/index.js'].modules
-            }
+    await withRetry(async () => {
+      const actualAdd = await resultElement.textContent()
+      expect(JSON.parse(actualAdd)).toStrictEqual({
+        '/dir/a.js': {},
+        ...allResult,
+        '/dir/index.js': {
+          ...allResult['/dir/index.js'],
+          modules: {
+            './a.js': {},
+            ...allResult['/dir/index.js'].modules
           }
-        },
-        null,
-        2
-      )
-    )
+        }
+      })
+    })
 
     // edit the added file
     editFile('dir/a.js', () => 'export const msg ="a"')
-    await untilUpdated(
-      () => page.textContent('.result'),
-      JSON.stringify(
-        {
-          '/dir/a.js': {
-            msg: 'a'
-          },
-          ...allResult,
-          '/dir/index.js': {
-            ...allResult['/dir/index.js'],
-            modules: {
-              './a.js': {
-                msg: 'a'
-              },
-              ...allResult['/dir/index.js'].modules
-            }
-          }
+    await withRetry(async () => {
+      const actualEdit = await resultElement.textContent()
+      expect(JSON.parse(actualEdit)).toStrictEqual({
+        '/dir/a.js': {
+          msg: 'a'
         },
-        null,
-        2
-      )
-    )
+        ...allResult,
+        '/dir/index.js': {
+          ...allResult['/dir/index.js'],
+          modules: {
+            './a.js': {
+              msg: 'a'
+            },
+            ...allResult['/dir/index.js'].modules
+          }
+        }
+      })
+    })
 
     removeFile('dir/a.js')
-    await untilUpdated(
-      () => page.textContent('.result'),
-      JSON.stringify(allResult, null, 2)
-    )
+    await withRetry(async () => {
+      const actualRemove = await resultElement.textContent()
+      expect(JSON.parse(actualRemove)).toStrictEqual(allResult)
+    })
   })
 }
diff --git a/playground/glob-import/dir/foo.css b/playground/glob-import/dir/foo.css
@@ -0,0 +1,3 @@
+.foo {
+  color: blue;
+}
diff --git a/playground/glob-import/index.html b/playground/glob-import/index.html
@@ -1,4 +1,5 @@
 <pre class="result"></pre>
+<pre class="result-eager"></pre>
 <pre class="result-node_modules"></pre>
 <pre class="globraw"></pre>
 <pre class="relative-glob-raw"></pre>
@@ -35,6 +36,12 @@
      * */
   )
   useImports(modules, '.result')
+  const eagerModules = import.meta.glob('/dir/**', { eager: true })
+  document.querySelector('.result-eager').textContent = JSON.stringify(
+    eagerModules,
+    null,
+    2
+  )
 
   const nodeModules = import.meta.glob('/dir/node_modules/**')
   useImports(nodeModules, '.result-node_modules')

diff --git a/playground/test-utils.ts b/playground/test-utils.ts
@@ -162,6 +162,25 @@ export async function untilUpdated(
   }
 }
 
+/**
+ * Retry `func` until it does not throw error.
+ */
+export async function withRetry(
+  func: () => Promise<void>,
+  runInBuild = false
+): Promise<void> {
+  if (isBuild && !runInBuild) return
+  const maxTries = process.env.CI ? 200 : 50
+  for (let tries = 0; tries < maxTries; tries++) {
+    try {
+      await func()
+      return
+    } catch {}
+    await timeout(50)
+  }
+  await func()
+}
+
 export async function untilBrowserLogAfter(
   operation: () => any,
   target: string | RegExp | Array<string | RegExp>,