[Security Solution] styling for reason popover (#111338) (#111400)

* add panelClassName * remove unused data-test-subj Co-authored-by: Angela Chuang <[email protected]>
elastic · Sep 7, 2021 · 403ac3d · 403ac3d
1 parent 32abdc7
commit 403ac3d
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 0 deletions.
diff --git a/...ution/public/timelines/components/timeline/body/renderers/reason_column_renderer.test.tsx b/...ution/public/timelines/components/timeline/body/renderers/reason_column_renderer.test.tsx
@@ -144,5 +144,22 @@ describe('reasonColumnRenderer', () => {
 
       expect(wrapper.queryByTestId('test-row-render')).toBeInTheDocument();
     });
+
+    it('the popover always contains a class that hides it when an overlay (e.g. the inspect modal) is displayed', () => {
+      const renderedColumn = reasonColumnRenderer.renderColumn({
+        ...defaultProps,
+        ecsData: validEcs,
+        rowRenderers,
+        browserFields,
+      });
+
+      const wrapper = render(<TestProviders>{renderedColumn}</TestProviders>);
+
+      fireEvent.click(wrapper.getByTestId('reason-cell-button'));
+
+      expect(wrapper.getByRole('dialog')).toHaveClass(
+        'euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--noShadow euiPopover__panel euiPopover__panel--right withHoverActions__popover'
+      );
+    });
   });
 });
diff --git a/...y_solution/public/timelines/components/timeline/body/renderers/reason_column_renderer.tsx b/...y_solution/public/timelines/components/timeline/body/renderers/reason_column_renderer.tsx
@@ -122,6 +122,7 @@ const ReasonCell: React.FC<{
           isOpen={isOpen}
           anchorPosition="rightCenter"
           closePopover={handleClosePopOver}
+          panelClassName="withHoverActions__popover"
           button={button}
         >
           <EuiPopoverTitle paddingSize="s">