From 6fe0d6121cdcb6d9fc3105728d39a800300cbfe6 Mon Sep 17 00:00:00 2001
From: Andreas Hocevar <andreas.hocevar@gmail.com>
Date: Sat, 6 Feb 2021 14:18:23 +0100
Subject: [PATCH] Warn when map container's width or height are zero

---
 src/ol/PluggableMap.js | 27 +++++++++++++++++----------
 1 file changed, 17 insertions(+), 10 deletions(-)

diff --git a/src/ol/PluggableMap.js b/src/ol/PluggableMap.js
index 54f1e34607..7f53e2cd7b 100644
--- a/src/ol/PluggableMap.js
+++ b/src/ol/PluggableMap.js
@@ -1500,18 +1500,25 @@ class PluggableMap extends BaseObject {
       this.setSize(undefined);
     } else {
       const computedStyle = getComputedStyle(targetElement);
-      this.setSize([
+      const width =
         targetElement.offsetWidth -
-          parseFloat(computedStyle['borderLeftWidth']) -
-          parseFloat(computedStyle['paddingLeft']) -
-          parseFloat(computedStyle['paddingRight']) -
-          parseFloat(computedStyle['borderRightWidth']),
+        parseFloat(computedStyle['borderLeftWidth']) -
+        parseFloat(computedStyle['paddingLeft']) -
+        parseFloat(computedStyle['paddingRight']) -
+        parseFloat(computedStyle['borderRightWidth']);
+      const height =
         targetElement.offsetHeight -
-          parseFloat(computedStyle['borderTopWidth']) -
-          parseFloat(computedStyle['paddingTop']) -
-          parseFloat(computedStyle['paddingBottom']) -
-          parseFloat(computedStyle['borderBottomWidth']),
-      ]);
+        parseFloat(computedStyle['borderTopWidth']) -
+        parseFloat(computedStyle['paddingTop']) -
+        parseFloat(computedStyle['paddingBottom']) -
+        parseFloat(computedStyle['borderBottomWidth']);
+      if (height === 0 || width === 0) {
+        // eslint-disable-next-line
+        console.warn(
+          "No map visible because the map container's width or height are 0."
+        );
+      }
+      this.setSize([width, height]);
     }
 
     this.updateViewportSize_();