fix: remove fouc buster (fix #1003)

vike/client/client-routing-runtime/entry.ts

@@ -4,8 +4,11 @@ assertClientRouting()
 import './pageFiles'
 import { installClientRouter } from './installClientRouter.js'
 import { assertSingleInstance_onClientEntryClientRouting } from './utils.js'
+import { removeFoucBuster } from '../shared/removeFoucBuster.js'
 // @ts-ignore Since dist/cjs/client/ is never used, we can ignore this error.
 const isProd: boolean = import.meta.env.PROD
 assertSingleInstance_onClientEntryClientRouting(isProd)
 
+if (import.meta.env.DEV) removeFoucBuster()
+
 installClientRouter()

vike/client/server-routing-runtime/entry.ts

@@ -6,10 +6,13 @@ import { getPageContext } from './getPageContext.js'
 import { executeOnRenderClientHook } from '../shared/executeOnRenderClientHook.js'
 import { assertHook } from '../../shared/hooks/getHook.js'
 import { assertSingleInstance_onClientEntryServerRouting } from './utils.js'
+import { removeFoucBuster } from '../shared/removeFoucBuster.js'
 // @ts-ignore Since dist/cjs/client/ is never used, we can ignore this error.
 const isProd: boolean = import.meta.env.PROD
 assertSingleInstance_onClientEntryServerRouting(isProd)
 
+if (import.meta.env.DEV) removeFoucBuster()
+
 hydrate()
 
 async function hydrate() {

vike/client/shared/removeFoucBuster.ts

@@ -0,0 +1,47 @@
+export { removeFoucBuster }
+
+import { assert } from './utils.js'
+
+function removeFoucBuster() {
+  assert(import.meta.env.DEV)
+
+  let sleep = 2
+  const runClean = () => {
+    if (sleep < 1000) sleep = 2 * sleep
+    const isClean = clean()
+    if (!isClean) {
+      setTimeout(runClean, sleep)
+    }
+  }
+  setTimeout(runClean, sleep)
+}
+
+function clean() {
+  const VITE_ID = 'data-vite-dev-id'
+  const injectedByVite = [...document.querySelectorAll(`style[${VITE_ID}]`)].map(
+    (style) => style.getAttribute(VITE_ID)!
+  )
+  // ```
+  // <link rel="stylesheet" type="text/css" href="/renderer/css/index.css?direct">
+  // <link rel="stylesheet" type="text/css" href="/renderer/Layout.css?direct">
+  // ```
+  const suffix = '?direct'
+  const injectedByVike = [...document.querySelectorAll(`link[rel="stylesheet"][type="text/css"][href$="${suffix}"]`)]
+  if (injectedByVike.length === 0) {
+    // clearInterval(interval)
+  }
+  let isClean = true
+  injectedByVike.forEach((link) => {
+    const filePathAbsoluteUserRootDir = link.getAttribute('href')!.slice(0, -suffix.length)
+    if (
+      injectedByVite.some((filePathAbsoluteFilesystem) =>
+        filePathAbsoluteFilesystem.endsWith(filePathAbsoluteUserRootDir)
+      )
+    ) {
+      link.remove()
+    } else {
+      isClean = false
+    }
+  })
+  return isClean
+}

vike/client/shared/utils.ts

@@ -0,0 +1 @@
+export * from '../../utils/assert.js'