From 149f48e811e87901b213e9ab5d1202fce0e97a2c Mon Sep 17 00:00:00 2001
From: Matthias Wilhelm <matthias.wilhelm@elastic.co>
Date: Wed, 14 Apr 2021 11:00:06 +0200
Subject: [PATCH] [Discover][DocViewer] Fix toggle columns from doc viewer
 table tab (#95748)

---
 .../doc_viewer/doc_viewer_tab.test.tsx        | 43 +++++++++++++++++++
 .../components/doc_viewer/doc_viewer_tab.tsx  |  2 +
 2 files changed, 45 insertions(+)
 create mode 100644 src/plugins/discover/public/application/components/doc_viewer/doc_viewer_tab.test.tsx

diff --git a/src/plugins/discover/public/application/components/doc_viewer/doc_viewer_tab.test.tsx b/src/plugins/discover/public/application/components/doc_viewer/doc_viewer_tab.test.tsx
new file mode 100644
index 0000000000000..a2434170acdd7
--- /dev/null
+++ b/src/plugins/discover/public/application/components/doc_viewer/doc_viewer_tab.test.tsx
@@ -0,0 +1,43 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import React from 'react';
+import { shallow } from 'enzyme';
+import { DocViewerTab } from './doc_viewer_tab';
+import { ElasticSearchHit } from '../../doc_views/doc_views_types';
+
+describe('DocViewerTab', () => {
+  test('changing columns triggers an update', () => {
+    const props = {
+      title: 'test',
+      component: jest.fn(),
+      id: 1,
+      render: jest.fn(),
+      renderProps: {
+        hit: {} as ElasticSearchHit,
+        columns: ['test'],
+      },
+    };
+
+    const wrapper = shallow(<DocViewerTab {...props} />);
+
+    const nextProps = {
+      ...props,
+      renderProps: {
+        hit: {} as ElasticSearchHit,
+        columns: ['test2'],
+      },
+    };
+
+    const shouldUpdate = (wrapper!.instance() as DocViewerTab).shouldComponentUpdate(nextProps, {
+      hasError: false,
+      error: '',
+    });
+    expect(shouldUpdate).toBe(true);
+  });
+});
diff --git a/src/plugins/discover/public/application/components/doc_viewer/doc_viewer_tab.tsx b/src/plugins/discover/public/application/components/doc_viewer/doc_viewer_tab.tsx
index bad72eb42055d..4ca53d929eeab 100644
--- a/src/plugins/discover/public/application/components/doc_viewer/doc_viewer_tab.tsx
+++ b/src/plugins/discover/public/application/components/doc_viewer/doc_viewer_tab.tsx
@@ -7,6 +7,7 @@
  */
 
 import React from 'react';
+import { isEqual } from 'lodash';
 import { I18nProvider } from '@kbn/i18n/react';
 import { DocViewRenderTab } from './doc_viewer_render_tab';
 import { DocViewerError } from './doc_viewer_render_error';
@@ -46,6 +47,7 @@ export class DocViewerTab extends React.Component<Props, State> {
     return (
       nextProps.renderProps.hit._id !== this.props.renderProps.hit._id ||
       nextProps.id !== this.props.id ||
+      !isEqual(nextProps.renderProps.columns, this.props.renderProps.columns) ||
       nextState.hasError
     );
   }