From 740e2f24bc2cb7776d4e0a61a666265789955d91 Mon Sep 17 00:00:00 2001
From: Vesa Luusua <vesa.luusua@gmail.com>
Date: Wed, 22 May 2019 12:54:15 +0300
Subject: [PATCH] Menu needs to wait mounting to calculate dimensions reliably

---
 src/components/Menu/Menu.js | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/components/Menu/Menu.js b/src/components/Menu/Menu.js
index 26ff2790..eb255f2b 100644
--- a/src/components/Menu/Menu.js
+++ b/src/components/Menu/Menu.js
@@ -38,7 +38,7 @@ class Menu extends Component {
   constructor(props) {
     super(props);
 
-    this.state = { isOpen: false };
+    this.state = { isOpen: false, ready: false };
 
     const { isOpen, onToggleActive } = props;
     const isIndependentMenu = isOpen === null && onToggleActive === null;
@@ -60,6 +60,10 @@ class Menu extends Component {
     this.menu = null;
     this.menuContent = null;
   }
+  componentDidMount() {
+    // Menu needs to know about DOM before it can calculate it's size proberly.
+    this.setState({ ready: true });
+  }
 
   onBlur(event) {
     // FocusEvent is fired faster than the link elements native click handler
@@ -168,7 +172,7 @@ class Menu extends Component {
     const { className, rootClassName } = this.props;
     const rootClass = rootClassName || css.root;
     const classes = classNames(rootClass, className);
-    const menuChildren = this.prepareChildren();
+    const menuChildren = this.state.ready ? this.prepareChildren() : null;
 
     return (
       <div