From e8f2f7e34110bb6936810e69d00227cfdfc682aa Mon Sep 17 00:00:00 2001
From: Marco Liberati <dej611@users.noreply.github.com>
Date: Thu, 25 Feb 2021 09:42:50 +0100
Subject: [PATCH] [Lens] Fix Workspace hidden when using Safari (#92616)

Co-authored-by: Marta Bondyra <marta.bondyra@elastic.co>
---
 .../__snapshots__/drag_drop.test.tsx.snap          | 14 +++++---------
 .../plugins/lens/public/drag_drop/drag_drop.scss   |  7 -------
 x-pack/plugins/lens/public/drag_drop/drag_drop.tsx |  4 ++--
 .../workspace_panel/workspace_panel_wrapper.scss   |  1 +
 4 files changed, 8 insertions(+), 18 deletions(-)

diff --git a/x-pack/plugins/lens/public/drag_drop/__snapshots__/drag_drop.test.tsx.snap b/x-pack/plugins/lens/public/drag_drop/__snapshots__/drag_drop.test.tsx.snap
index e5594bb0bb769..7aa838021f2a8 100644
--- a/x-pack/plugins/lens/public/drag_drop/__snapshots__/drag_drop.test.tsx.snap
+++ b/x-pack/plugins/lens/public/drag_drop/__snapshots__/drag_drop.test.tsx.snap
@@ -1,16 +1,12 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`DragDrop defined dropType is reflected in the className 1`] = `
-<div
-  class="lnsDragDrop__container"
+<button
+  class="lnsDragDrop lnsDragDrop-isDroppable lnsDragDrop-isDropTarget"
+  data-test-subj="lnsDragDrop"
 >
-  <button
-    class="lnsDragDrop lnsDragDrop-isDroppable lnsDragDrop-isDropTarget"
-    data-test-subj="lnsDragDrop"
-  >
-    Hello!
-  </button>
-</div>
+  Hello!
+</button>
 `;
 
 exports[`DragDrop items that has dropType=undefined get special styling when another item is dragged 1`] = `
diff --git a/x-pack/plugins/lens/public/drag_drop/drag_drop.scss b/x-pack/plugins/lens/public/drag_drop/drag_drop.scss
index 9e3f1e1c3cf26..961f7ee0ec400 100644
--- a/x-pack/plugins/lens/public/drag_drop/drag_drop.scss
+++ b/x-pack/plugins/lens/public/drag_drop/drag_drop.scss
@@ -81,13 +81,6 @@
   }
 }
 
-.lnsDragDrop__container {
-  position: relative;
-  overflow: visible !important; // sass-lint:disable-line no-important
-  width: 100%;
-  height: 100%;
-}
-
 .lnsDragDrop__reorderableDrop {
   position: absolute;
   width: 100%;
diff --git a/x-pack/plugins/lens/public/drag_drop/drag_drop.tsx b/x-pack/plugins/lens/public/drag_drop/drag_drop.tsx
index 618a7accb9b2b..76e44c29eaed5 100644
--- a/x-pack/plugins/lens/public/drag_drop/drag_drop.tsx
+++ b/x-pack/plugins/lens/public/drag_drop/drag_drop.tsx
@@ -456,7 +456,7 @@ const DropInner = memo(function DropInner(props: DropInnerProps) {
     isActiveDropTarget && dropType !== 'reorder' && dragging?.ghost ? dragging.ghost : undefined;
 
   return (
-    <div className="lnsDragDrop__container">
+    <>
       {React.cloneElement(children, {
         'data-test-subj': dataTestSubj || 'lnsDragDrop',
         className: classNames(children.props.className, classes, className),
@@ -471,7 +471,7 @@ const DropInner = memo(function DropInner(props: DropInnerProps) {
             style: ghost.style,
           })
         : null}
-    </div>
+    </>
   );
 });
 
diff --git a/x-pack/plugins/lens/public/editor_frame_service/editor_frame/workspace_panel/workspace_panel_wrapper.scss b/x-pack/plugins/lens/public/editor_frame_service/editor_frame/workspace_panel/workspace_panel_wrapper.scss
index 3949c7deb53b4..167c17ee6ae9c 100644
--- a/x-pack/plugins/lens/public/editor_frame_service/editor_frame/workspace_panel/workspace_panel_wrapper.scss
+++ b/x-pack/plugins/lens/public/editor_frame_service/editor_frame/workspace_panel/workspace_panel_wrapper.scss
@@ -11,6 +11,7 @@
   min-height: $euiSizeXXL * 10;
   overflow: visible;
   border: none;
+  height: 100%;
 
   .lnsWorkspacePanelWrapper__pageContentBody {
     @include euiScrollBar;