From fae90a15d88e5e87ca9fcbb54cf2dc8773d2f229 Mon Sep 17 00:00:00 2001
From: Romuald Brillout <git@brillout.com>
Date: Thu, 4 Jul 2024 16:13:07 +0200
Subject: [PATCH] fix: remove fouc buster (fix #1003)

---
 vike/client/client-routing-runtime/entry.ts |  3 ++
 vike/client/server-routing-runtime/entry.ts |  3 ++
 vike/client/shared/removeFoucBuster.ts      | 47 +++++++++++++++++++++
 vike/client/shared/utils.ts                 |  1 +
 4 files changed, 54 insertions(+)
 create mode 100644 vike/client/shared/removeFoucBuster.ts
 create mode 100644 vike/client/shared/utils.ts

diff --git a/vike/client/client-routing-runtime/entry.ts b/vike/client/client-routing-runtime/entry.ts
index 060e6242520..35ecf66f435 100644
--- a/vike/client/client-routing-runtime/entry.ts
+++ b/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()
diff --git a/vike/client/server-routing-runtime/entry.ts b/vike/client/server-routing-runtime/entry.ts
index 009732488ce..43709ac8fc8 100644
--- a/vike/client/server-routing-runtime/entry.ts
+++ b/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() {
diff --git a/vike/client/shared/removeFoucBuster.ts b/vike/client/shared/removeFoucBuster.ts
new file mode 100644
index 00000000000..1a45c2fb720
--- /dev/null
+++ b/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
+}
diff --git a/vike/client/shared/utils.ts b/vike/client/shared/utils.ts
new file mode 100644
index 00000000000..abf1292b48e
--- /dev/null
+++ b/vike/client/shared/utils.ts
@@ -0,0 +1 @@
+export * from '../../utils/assert.js'