fix dom loaded race condition

vercel · Mar 18, 2022 · 58c7c2e · 58c7c2e
1 parent 31a1a69
commit 58c7c2e
Showing 1 changed file with 14 additions and 12 deletions.
diff --git a/packages/next/client/index.tsx b/packages/next/client/index.tsx
@@ -724,18 +724,20 @@ if (process.env.__NEXT_RSC) {
   }
 
   // When `DOMContentLoaded`, we can close all pending writers to finish hydration.
-  document.addEventListener(
-    'DOMContentLoaded',
-    function () {
-      if (initialServerDataWriter && !initialServerDataFlushed) {
-        initialServerDataWriter.close()
-        initialServerDataFlushed = true
-        initialServerDataBuffer = undefined
-      }
-      initialServerDataLoaded = true
-    },
-    false
-  )
+  const DOMContentLoaded = function () {
+    if (initialServerDataWriter && !initialServerDataFlushed) {
+      initialServerDataWriter.close()
+      initialServerDataFlushed = true
+      initialServerDataBuffer = undefined
+    }
+    initialServerDataLoaded = true
+  }
+  // It's possible that the DOM is already loaded.
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', DOMContentLoaded, false)
+  } else {
+    DOMContentLoaded()
+  }
 
   const nextServerDataLoadingGlobal = ((self as any).__next_s =
     (self as any).__next_s || [])