snapshot updates and adding missing tests

Signed-off-by: Shenoy Pratik <[email protected]>

public/components/notebooks/components/__tests__/__snapshots__/notebook.test.tsx.snap

@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`<Notebook /> spec renders the empty component 1`] = `
+exports[`<Notebook /> spec renders the empty component and test reporting action button 1`] = `
 <div
   style="float: left; width: 100%; max-width: 1500px;"
 >

public/components/notebooks/components/__tests__/notebook.test.tsx

@@ -9,7 +9,7 @@ import { configure } from 'enzyme';
 import Adapter from 'enzyme-adapter-react-16';
 import React from 'react';
 import { HttpResponse } from '../../../../../../../src/core/public';
-import httpClientMock from '../../../../../test/__mocks__/httpClientMock';
+import { getOSDHttp } from '../../../../../common/utils';
 import {
   addCodeBlockResponse,
   clearOutputNotebook,
@@ -45,7 +45,8 @@ global.fetch = jest.fn(() =>
 
 describe('<Notebook /> spec', () => {
   configure({ adapter: new Adapter() });
-  const pplService = new PPLService(httpClientMock);
+  const httpClient = getOSDHttp();
+  const pplService = new PPLService(httpClient);
   const setBreadcrumbs = jest.fn();
   const renameNotebook = jest.fn();
   const cloneNotebook = jest.fn();
@@ -56,14 +57,14 @@ describe('<Notebook /> spec', () => {
   const history = jest.fn() as any;
   history.replace = jest.fn();
 
-  it('renders the empty component', async () => {
-    httpClientMock.get = jest.fn(() => Promise.resolve((emptyNotebook as unknown) as HttpResponse));
+  it('renders the empty component and test reporting action button', async () => {
+    httpClient.get = jest.fn(() => Promise.resolve((emptyNotebook as unknown) as HttpResponse));
     const utils = render(
       <Notebook
         pplService={pplService}
         openedNoteId="mock-id"
         DashboardContainerByValueRenderer={jest.fn()}
-        http={httpClientMock}
+        http={httpClient}
         parentBreadcrumb={{ href: 'parent-href', text: 'parent-text' }}
         setBreadcrumbs={setBreadcrumbs}
         renameNotebook={renameNotebook}
@@ -78,12 +79,26 @@ describe('<Notebook /> spec', () => {
       expect(utils.getByText('sample-notebook-1')).toBeInTheDocument();
     });
     expect(utils.container.firstChild).toMatchSnapshot();
+
+    act(() => {
+      fireEvent.click(utils.getByText('Reporting actions'));
+    });
+
+    expect(utils.queryByTestId('download-notebook-pdf')).toBeInTheDocument();
+
+    act(() => {
+      fireEvent.click(utils.getByText('Reporting actions'));
+    });
+
+    await waitFor(() => {
+      expect(utils.queryByTestId('download-notebook-pdf')).toBeNull();
+    });
   });
 
   it('renders the empty component and checks code block operations', async () => {
-    httpClientMock.get = jest.fn(() => Promise.resolve((emptyNotebook as unknown) as HttpResponse));
+    httpClient.get = jest.fn(() => Promise.resolve((emptyNotebook as unknown) as HttpResponse));
     let postFlag = 1;
-    httpClientMock.post = jest.fn(() => {
+    httpClient.post = jest.fn(() => {
       if (postFlag === 1) {
         postFlag += 1;
         return Promise.resolve((addCodeBlockResponse as unknown) as HttpResponse);
@@ -94,7 +109,7 @@ describe('<Notebook /> spec', () => {
         pplService={pplService}
         openedNoteId="mock-id"
         DashboardContainerByValueRenderer={jest.fn()}
-        http={httpClientMock}
+        http={httpClient}
         parentBreadcrumb={{ href: 'parent-href', text: 'parent-text' }}
         setBreadcrumbs={setBreadcrumbs}
         renameNotebook={renameNotebook}
@@ -160,13 +175,11 @@ describe('<Notebook /> spec', () => {
   });
 
   it('renders a notebook and checks paragraph actions', async () => {
-    httpClientMock.get = jest.fn(() =>
-      Promise.resolve((codeBlockNotebook as unknown) as HttpResponse)
-    );
-    httpClientMock.put = jest.fn(() =>
+    httpClient.get = jest.fn(() => Promise.resolve((codeBlockNotebook as unknown) as HttpResponse));
+    httpClient.put = jest.fn(() =>
       Promise.resolve((clearOutputNotebook as unknown) as HttpResponse)
     );
-    httpClientMock.delete = jest.fn(() =>
+    httpClient.delete = jest.fn(() =>
       Promise.resolve(({ paragraphs: [] } as unknown) as HttpResponse)
     );
 
@@ -175,7 +188,7 @@ describe('<Notebook /> spec', () => {
         pplService={pplService}
         openedNoteId="mock-id"
         DashboardContainerByValueRenderer={jest.fn()}
-        http={httpClientMock}
+        http={httpClient}
         parentBreadcrumb={{ href: 'parent-href', text: 'parent-text' }}
         setBreadcrumbs={setBreadcrumbs}
         renameNotebook={renameNotebook}
@@ -244,15 +257,13 @@ describe('<Notebook /> spec', () => {
       Promise.resolve((notebookPutResponse as unknown) as HttpResponse)
     );
     const cloneNotebookMock = jest.fn(() => Promise.resolve('dummy-string'));
-    httpClientMock.get = jest.fn(() =>
-      Promise.resolve((codeBlockNotebook as unknown) as HttpResponse)
-    );
+    httpClient.get = jest.fn(() => Promise.resolve((codeBlockNotebook as unknown) as HttpResponse));
 
-    httpClientMock.put = jest.fn(() => {
+    httpClient.put = jest.fn(() => {
       return Promise.resolve((notebookPutResponse as unknown) as HttpResponse);
     });
 
-    httpClientMock.post = jest.fn(() => {
+    httpClient.post = jest.fn(() => {
       return Promise.resolve((addCodeBlockResponse as unknown) as HttpResponse);
     });
 
@@ -261,7 +272,7 @@ describe('<Notebook /> spec', () => {
         pplService={pplService}
         openedNoteId="mock-id"
         DashboardContainerByValueRenderer={jest.fn()}
-        http={httpClientMock}
+        http={httpClient}
         parentBreadcrumb={{ href: 'parent-href', text: 'parent-text' }}
         setBreadcrumbs={setBreadcrumbs}
         renameNotebook={renameNotebookMock}
@@ -347,7 +358,7 @@ describe('<Notebook /> spec', () => {
       observabilityObjectList: [{ savedVisualization: sampleSavedVisualization }],
     });
 
-    httpClientMock.get = jest.fn(() =>
+    httpClient.get = jest.fn(() =>
       Promise.resolve(({
         ...sampleNotebook1,
         path: sampleNotebook1.name,
@@ -372,7 +383,7 @@ describe('<Notebook /> spec', () => {
         pplService={pplService}
         openedNoteId={sampleNotebook1.id}
         DashboardContainerByValueRenderer={jest.fn()}
-        http={httpClientMock}
+        http={httpClient}
         parentBreadcrumb={{ href: 'parent-href', text: 'parent-text' }}
         setBreadcrumbs={setBreadcrumbs}
         renameNotebook={renameNotebook}

public/components/notebooks/components/notebook.tsx

@@ -193,7 +193,7 @@ export class Notebook extends Component<NotebookProps, NotebookState> {
             paragraphId: para.uniqueId,
           },
         })
-        .then((res) => {
+        .then((_res) => {
           const paragraphs = [...this.state.paragraphs];
           paragraphs.splice(index, 1);
           const parsedPara = [...this.state.parsedPara];
@@ -205,6 +205,7 @@ export class Notebook extends Component<NotebookProps, NotebookState> {
             'Error deleting paragraph, please make sure you have the correct permission.',
             'danger'
           );
+          console.error(err);
         });
     }
   };
@@ -246,6 +247,7 @@ export class Notebook extends Component<NotebookProps, NotebookState> {
                 'Error deleting paragraph, please make sure you have the correct permission.',
                 'danger'
               );
+              console.error(err);
             });
         },
         'Delete all paragraphs',
@@ -354,6 +356,7 @@ export class Notebook extends Component<NotebookProps, NotebookState> {
           'Error deleting visualization, please make sure you have the correct permission.',
           'danger'
         );
+        console.error(err);
       });
   };
 
@@ -388,6 +391,7 @@ export class Notebook extends Component<NotebookProps, NotebookState> {
           'Error adding paragraph, please make sure you have the correct permission.',
           'danger'
         );
+        console.error(err);
       });
   };
 
@@ -421,13 +425,14 @@ export class Notebook extends Component<NotebookProps, NotebookState> {
       .post(`${NOTEBOOKS_API_PREFIX}/set_paragraphs/`, {
         body: JSON.stringify(moveParaObj),
       })
-      .then((res) => this.setState({ paragraphs, parsedPara }))
-      .then((res) => this.scrollToPara(targetIndex))
+      .then((_res) => this.setState({ paragraphs, parsedPara }))
+      .then((_res) => this.scrollToPara(targetIndex))
       .catch((err) => {
         this.props.setToast(
           'Error moving paragraphs, please make sure you have the correct permission.',
           'danger'
         );
+        console.error(err);
       });
   };
 
@@ -460,6 +465,7 @@ export class Notebook extends Component<NotebookProps, NotebookState> {
           'Error clearing paragraphs, please make sure you have the correct permission.',
           'danger'
         );
+        console.error(err);
       });
   };
 
@@ -530,9 +536,9 @@ export class Notebook extends Component<NotebookProps, NotebookState> {
     }
   };
 
-  runForAllParagraphs = (reducer: (para: ParaType, index: number) => Promise<any>) => {
+  runForAllParagraphs = (reducer: (para: ParaType, _index: number) => Promise<any>) => {
     return this.state.parsedPara
-      .map((para: ParaType, index: number) => () => reducer(para, index))
+      .map((para: ParaType, _index: number) => () => reducer(para, _index))
       .reduce((chain, func) => chain.then(func), Promise.resolve());
   };
 
@@ -588,6 +594,7 @@ export class Notebook extends Component<NotebookProps, NotebookState> {
           'Error fetching notebooks, please make sure you have the correct permission.',
           'danger'
         );
+        console.error(err);
       });
   };
 
@@ -604,6 +611,7 @@ export class Notebook extends Component<NotebookProps, NotebookState> {
       })
       .catch((err) => {
         this.props.setToast('Error getting query output', 'danger');
+        console.error(err);
       });
   };
 
@@ -655,6 +663,7 @@ export class Notebook extends Component<NotebookProps, NotebookState> {
       })
       .catch((error) => {
         this.props.setToast('Error checking Reporting Plugin Installation status.', 'danger');
+        console.error(error);
       });
   }
 
@@ -743,7 +752,7 @@ export class Notebook extends Component<NotebookProps, NotebookState> {
             disabled: this.state.parsedPara.length === 0,
             onClick: () => {
               this.setState({ isParaActionsPopoverOpen: false });
-              this.runForAllParagraphs((para: ParaType, index: number) => {
+              this.runForAllParagraphs((para: ParaType, _index: number) => {
                 return para.paraRef.current?.runParagraph();
               });
               if (this.state.selectedViewId === 'input_only') {
@@ -847,7 +856,7 @@ export class Notebook extends Component<NotebookProps, NotebookState> {
         items: [
           {
             name: 'Download PDF',
-            icon: <EuiIcon type="download" />,
+            icon: <EuiIcon type="download" data-test-subj="download-notebook-pdf" />,
             onClick: () => {
               this.setState({ isReportingActionsPopoverOpen: false });
               generateInContextReport('pdf', this.props, this.toggleReportingLoadingModal);

public/components/notebooks/components/paragraph_components/__tests__/__snapshots__/para_output.test.tsx.snap

@@ -1,5 +1,14 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`<ParaOutput /> spec renders dashboards visualization outputs 1`] = `
+<div
+  class="euiText euiText--small"
+  style="margin-left: 9px;"
+>
+  2020-Jul-21 18:37:44 - 2020-Aug-20 18:37:44
+</div>
+`;
+
 exports[`<ParaOutput /> spec renders markdown outputs 1`] = `
 <div
   class="euiText euiText--medium wrapAll markdown-output-text"
@@ -14,6 +23,15 @@ exports[`<ParaOutput /> spec renders markdown outputs 1`] = `
 </div>
 `;
 
+exports[`<ParaOutput /> spec renders observability visualization outputs 1`] = `
+<div
+  class="euiText euiText--small"
+  style="margin-left: 9px;"
+>
+  2020-Jul-21 18:37:44 - 2020-Aug-20 18:37:44
+</div>
+`;
+
 exports[`<ParaOutput /> spec renders other types of outputs 1`] = `
 <div
   class="euiText euiText--medium"
@@ -83,12 +101,3 @@ exports[`<ParaOutput /> spec renders query outputs with error 1`] = `
   </pre>
 </div>
 `;
-
-exports[`<ParaOutput /> spec renders visualization outputs 1`] = `
-<div
-  class="euiText euiText--small"
-  style="margin-left: 9px;"
->
-  2020-Jul-21 18:37:44 - 2020-Aug-20 18:37:44
-</div>
-`;

public/components/notebooks/components/paragraph_components/__tests__/para_output.test.tsx

@@ -3,16 +3,29 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
+jest.mock('../../../../../test/__mocks__/httpClientMock');
 import { render } from '@testing-library/react';
 import { configure } from 'enzyme';
 import Adapter from 'enzyme-adapter-react-16';
 import React from 'react';
-import { uiSettingsService } from '../../../../../../common/utils/core_services';
-import { sampleParsedParagraghs1 } from '../../../../../../test/sample_default_notebooks';
+import { Provider } from 'react-redux';
+import { legacy_createStore as createStore } from 'redux';
+import {
+  getOSDHttp,
+  setPPLService,
+  uiSettingsService,
+} from '../../../../../../common/utils/core_services';
+import {
+  sampleObservabilityVizParagraph,
+  sampleParsedParagraghs1,
+} from '../../../../../../test/sample_default_notebooks';
+import { rootReducer } from '../../../../../framework/redux/reducers';
+import PPLService from '../../../../../services/requests/ppl';
 import { ParaOutput } from '../para_output';
 
 describe('<ParaOutput /> spec', () => {
   configure({ adapter: new Adapter() });
+  const store = createStore(rootReducer);
 
   it('renders markdown outputs', () => {
     const para = sampleParsedParagraghs1[0];
@@ -63,7 +76,7 @@ describe('<ParaOutput /> spec', () => {
     expect(utils.container.firstChild).toMatchSnapshot();
   });
 
-  it('renders visualization outputs', () => {
+  it('renders dashboards visualization outputs', () => {
     const para = sampleParsedParagraghs1[2];
     para.isSelected = true;
 
@@ -84,6 +97,30 @@ describe('<ParaOutput /> spec', () => {
     expect(utils.container.firstChild).toMatchSnapshot();
   });
 
+  it('renders observability visualization outputs', () => {
+    setPPLService(new PPLService(getOSDHttp()));
+    const para = sampleObservabilityVizParagraph;
+    para.isSelected = true;
+
+    uiSettingsService.get = jest.fn().mockReturnValue('YYYY-MMM-DD HH:mm:ss');
+    const setVisInput = jest.fn();
+    const utils = render(
+      <Provider store={store}>
+        <ParaOutput
+          key={para.uniqueId}
+          para={para}
+          visInput={{
+            timeRange: { from: '2020-JUL-21 18:37:44', to: '2020-AUG-20 18:37:44' },
+          }}
+          setVisInput={setVisInput}
+          DashboardContainerByValueRenderer={() => null}
+        />
+      </Provider>
+    );
+    expect(utils.container.textContent).toMatch('2020-Jul-21 18:37:44 - 2020-Aug-20 18:37:44');
+    expect(utils.container.firstChild).toMatchSnapshot();
+  });
+
   it('renders other types of outputs', () => {
     const para = sampleParsedParagraghs1[0];
     para.isSelected = true;