[maps] fix swap hidden/show icons in layer action panel (#74549)

elastic · Aug 6, 2020 · b71b9c2 · b71b9c2
1 parent 79713b9
commit b71b9c2
Show file tree

Hide file tree

Showing 3 changed files with 151 additions and 10 deletions.
diff --git a/...toc_entry/toc_entry_actions_popover/__snapshots__/toc_entry_actions_popover.test.tsx.snap b/...toc_entry/toc_entry_actions_popover/__snapshots__/toc_entry_actions_popover.test.tsx.snap
diff --git a/..._control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.test.tsx b/..._control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.test.tsx
@@ -6,7 +6,7 @@
 /* eslint-disable max-classes-per-file */
 
 import React from 'react';
-import { shallowWithIntl } from 'test_utils/enzyme_helpers';
+import { shallow } from 'enzyme';
 import { AbstractLayer, ILayer } from '../../../../../../classes/layers/layer';
 import { AbstractSource, ISource } from '../../../../../../classes/sources/source';
 import { AbstractStyle, IStyle } from '../../../../../../classes/styles/style';
@@ -76,7 +76,7 @@ describe('TOCEntryActionsPopover', () => {
   });
 
   test('is rendered', async () => {
-    const component = shallowWithIntl(<TOCEntryActionsPopover {...defaultProps} />);
+    const component = shallow(<TOCEntryActionsPopover {...defaultProps} />);
 
     // Ensure all promises resolve
     await new Promise((resolve) => process.nextTick(resolve));
@@ -87,9 +87,7 @@ describe('TOCEntryActionsPopover', () => {
   });
 
   test('should not show edit actions in read only mode', async () => {
-    const component = shallowWithIntl(
-      <TOCEntryActionsPopover {...defaultProps} isReadOnly={true} />
-    );
+    const component = shallow(<TOCEntryActionsPopover {...defaultProps} isReadOnly={true} />);
 
     // Ensure all promises resolve
     await new Promise((resolve) => process.nextTick(resolve));
@@ -101,7 +99,22 @@ describe('TOCEntryActionsPopover', () => {
 
   test('should disable fit to data when supportsFitToBounds is false', async () => {
     supportsFitToBounds = false;
-    const component = shallowWithIntl(<TOCEntryActionsPopover {...defaultProps} />);
+    const component = shallow(<TOCEntryActionsPopover {...defaultProps} />);
+
+    // Ensure all promises resolve
+    await new Promise((resolve) => process.nextTick(resolve));
+    // Ensure the state changes are reflected
+    component.update();
+
+    expect(component).toMatchSnapshot();
+  });
+
+  test('should have "show layer" action when layer is not visible', async () => {
+    const layer = new LayerMock();
+    layer.isVisible = () => {
+      return false;
+    };
+    const component = shallow(<TOCEntryActionsPopover {...defaultProps} layer={layer} />);
 
     // Ensure all promises resolve
     await new Promise((resolve) => process.nextTick(resolve));

diff --git a/...layer_control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.tsx b/...layer_control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.tsx
@@ -158,7 +158,7 @@ export class TOCEntryActionsPopover extends Component<Props, State> {
           : i18n.translate('xpack.maps.layerTocActions.showLayerTitle', {
               defaultMessage: 'Show layer',
             }),
-        icon: <EuiIcon type={this.props.layer.isVisible() ? 'eye' : 'eyeClosed'} size="m" />,
+        icon: <EuiIcon type={this.props.layer.isVisible() ? 'eyeClosed' : 'eye'} size="m" />,
         'data-test-subj': 'layerVisibilityToggleButton',
         toolTipContent: null,
         onClick: () => {