From 4d8afb1e7ca9b1e112467a75596fd9c9a52bb3bf Mon Sep 17 00:00:00 2001
From: Greg Thompson <thompson.glowe@gmail.com>
Date: Thu, 28 Jan 2021 13:37:48 -0600
Subject: [PATCH] [EuiResizableContainer] Initialize after DOM is ready (#4447)

* init after dom ready

* revert me

* render check

* Revert "revert me"

This reverts commit f8c0fd9b95b524934fc532ac4bcbd82bde022150.

* CL
---
 CHANGELOG.md                                               | 1 +
 src/components/resizable_container/resizable_container.tsx | 6 ++++--
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 1fcfd406d02..aa195d03b85 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -8,6 +8,7 @@
 **Bug fixes**
 
 - Fixed heights of `append` and `prepend` in `EuiComboBox` ([#4410](https://github.com/elastic/eui/pull/4410))
+- Fixed `EuiResizableContainer` initialization timing based on DOM readiness ([#4447](https://github.com/elastic/eui/pull/4447))
 
 ## [`31.3.0`](https://github.com/elastic/eui/tree/v31.3.0)
 
diff --git a/src/components/resizable_container/resizable_container.tsx b/src/components/resizable_container/resizable_container.tsx
index 4f8bf4c1617..a46ff802f53 100644
--- a/src/components/resizable_container/resizable_container.tsx
+++ b/src/components/resizable_container/resizable_container.tsx
@@ -128,7 +128,9 @@ export const EuiResizableContainer: FunctionComponent<EuiResizableContainerProps
   );
 
   useEffect(() => {
-    initialize();
+    if (containerSize.width > 0 && containerSize.height > 0) {
+      initialize();
+    }
   }, [initialize, containerSize]);
 
   const onMouseDown = useCallback(
@@ -273,7 +275,7 @@ export const EuiResizableContainer: FunctionComponent<EuiResizableContainerProps
         onTouchMove={onMouseMove}
         onTouchEnd={onMouseUp}
         {...rest}>
-        {!!reducerState.containerSize && render()}
+        {render()}
       </div>
     </EuiResizableContainerContextProvider>
   );