diff --git a/x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/__snapshots__/view.test.js.snap b/x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/__snapshots__/view.test.js.snap
index 2ca994647e1dac..27ea52bfed0440 100644
--- a/x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/__snapshots__/view.test.js.snap
+++ b/x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/__snapshots__/view.test.js.snap
@@ -67,6 +67,140 @@ exports[`TOCEntry is rendered 1`] = `
`;
+exports[`TOCEntry props Should shade background when not selected layer 1`] = `
+
{
return LAYER_ID;
},
- hasLegendDetails: async () => {
- return true;
- },
renderLegendDetails: () => {
return
TOC details mock
;
},
@@ -83,5 +80,33 @@ describe('TOCEntry', () => {
expect(component).toMatchSnapshot();
});
+
+ test('Should shade background when selected layer', async () => {
+ const component = shallowWithIntl(
);
+
+ // Ensure all promises resolve
+ await new Promise(resolve => process.nextTick(resolve));
+ // Ensure the state changes are reflected
+ component.update();
+
+ expect(component).toMatchSnapshot();
+ });
+
+ test('Should shade background when not selected layer', async () => {
+ const differentLayer = Object.create(mockLayer);
+ differentLayer.getId = () => {
+ return 'foobar';
+ };
+ const component = shallowWithIntl(
+
+ );
+
+ // Ensure all promises resolve
+ await new Promise(resolve => process.nextTick(resolve));
+ // Ensure the state changes are reflected
+ component.update();
+
+ expect(component).toMatchSnapshot();
+ });
});
});