From d81d43c24754b1a9afdb61be945c31034671db03 Mon Sep 17 00:00:00 2001
From: Alexey Pyltsyn <lex61rus@gmail.com>
Date: Wed, 9 Jun 2021 14:41:57 +0300
Subject: [PATCH] fix(v2): render children in BrowserOnly after client is ready
 (#4935)

* fix(v2): render children in BrowserOnly after client is ready

* Fix fallback issue
---
 packages/docusaurus/src/client/exports/BrowserOnly.tsx | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/packages/docusaurus/src/client/exports/BrowserOnly.tsx b/packages/docusaurus/src/client/exports/BrowserOnly.tsx
index 417c3cbb12..81e56d8b1f 100644
--- a/packages/docusaurus/src/client/exports/BrowserOnly.tsx
+++ b/packages/docusaurus/src/client/exports/BrowserOnly.tsx
@@ -6,7 +6,7 @@
  */
 
 import React from 'react';
-import ExecutionEnvironment from './ExecutionEnvironment';
+import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
 
 function BrowserOnly({
   children,
@@ -15,11 +15,13 @@ function BrowserOnly({
   children?: () => JSX.Element;
   fallback?: JSX.Element;
 }): JSX.Element | null {
-  if (!ExecutionEnvironment.canUseDOM || children == null) {
-    return fallback || null;
+  const {isClient} = useDocusaurusContext();
+
+  if (isClient && children != null) {
+    return <>{children()}</>;
   }
 
-  return <>{children()}</>;
+  return fallback || null;
 }
 
 export default BrowserOnly;