added new jest tests for sidebar and for data selector

Signed-off-by: sumukhswamy <[email protected]>
opensearch-project · Dec 19, 2023 · 5574f1d · 5574f1d
1 parent 8b96123
commit 5574f1d
Show file tree

Hide file tree

Showing 5 changed files with 2,459 additions and 96 deletions.
diff --git a/public/components/SQLPage/__tests__/DataSelect.test.tsx b/public/components/SQLPage/__tests__/DataSelect.test.tsx
@@ -0,0 +1,65 @@
+import '@testing-library/jest-dom';
+import '@testing-library/jest-dom/extend-expect';
+import { render, screen, waitFor } from '@testing-library/react';
+import React from 'react';
+import { HttpResponse } from '../../../../../../src/core/public';
+import { httpClientMock } from '../../../../test/mocks';
+import {
+    mockDataSelectQuery
+} from '../../../../test/mocks/mockData';
+import { DataSelect } from '../DataSelect';
+
+describe('Renders the Datasource picker component', () => {
+
+  it('fetches the datasources and selects S3glue as source', async () => {
+    const client = httpClientMock;
+    client.get = jest.fn(() => {
+      return (Promise.resolve(mockDataSelectQuery) as unknown) as HttpResponse;
+    });
+
+    const mockOnSelect = jest.fn();
+    const mockDataSource = jest.fn()
+    const asyncTest = () => {
+      render(
+        <DataSelect
+            http={client}
+            onSelect={mockOnSelect}
+            urlDataSource={'glue_1'}
+            asyncLoading={false}
+      />
+      );
+    };
+
+    await waitFor(() => {
+        asyncTest()
+        expect(screen.getByText('glue_1')).toBeInTheDocument();
+    });
+    expect(document.body.children[0]).toMatchSnapshot();
+  });
+  it('fetches the datasources and selects Opensearch as source', async () => {
+    const client = httpClientMock;
+    client.get = jest.fn(() => {
+      return (Promise.resolve(mockDataSelectQuery) as unknown) as HttpResponse;
+    });
+
+    const mockOnSelect = jest.fn();
+    const mockDataSource = jest.fn()
+    const asyncTest = () => {
+      render(
+        <DataSelect
+            http={client}
+            onSelect={mockOnSelect}
+            urlDataSource={'OpenSearch'}
+            asyncLoading={false}
+      />
+      );
+    };
+
+    await waitFor(() => {
+        asyncTest()
+        expect(screen.getByText('OpenSearch')).toBeInTheDocument();
+    });
+    expect(document.body.children[0]).toMatchSnapshot();
+  });
+
+});
diff --git a/public/components/SQLPage/__tests__/__snapshots__/DataSelect.test.tsx.snap b/public/components/SQLPage/__tests__/__snapshots__/DataSelect.test.tsx.snap
@@ -0,0 +1,140 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Renders the Datasource picker component fetches the datasources and selects Opensearch as source 1`] = `
+<div>
+  <div
+    aria-expanded="false"
+    aria-haspopup="listbox"
+    class="euiComboBox"
+    role="combobox"
+  >
+    <div
+      class="euiFormControlLayout"
+    >
+      <div
+        class="euiFormControlLayout__childrenWrapper"
+      >
+        <div
+          class="euiComboBox__inputWrap euiComboBox__inputWrap--noWrap"
+          data-test-subj="comboBoxInput"
+          tabindex="-1"
+        >
+          <span
+            class="euiComboBoxPill euiComboBoxPill--plainText"
+          >
+            OpenSearch
+          </span>
+          <div
+            class="euiComboBox__input"
+            style="font-size: 14px; display: inline-block;"
+          >
+            <input
+              aria-controls=""
+              data-test-subj="comboBoxSearchInput"
+              role="textbox"
+              style="box-sizing: content-box; width: 2px;"
+              value=""
+            />
+            <div
+              style="position: absolute; top: 0px; left: 0px; visibility: hidden; height: 0px; overflow: scroll; white-space: pre; font-family: -webkit-small-control; letter-spacing: normal; text-transform: none;"
+            />
+          </div>
+        </div>
+        <div
+          class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right"
+        >
+          <button
+            aria-label="Open list of options"
+            class="euiFormControlLayoutCustomIcon euiFormControlLayoutCustomIcon--clickable"
+            data-test-subj="comboBoxToggleListButton"
+            type="button"
+          >
+            <svg
+              aria-hidden="true"
+              class="euiIcon euiIcon--medium euiFormControlLayoutCustomIcon__icon"
+              focusable="false"
+              height="16"
+              role="img"
+              viewBox="0 0 16 16"
+              width="16"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M13.069 5.157 8.384 9.768a.546.546 0 0 1-.768 0L2.93 5.158a.552.552 0 0 0-.771 0 .53.53 0 0 0 0 .759l4.684 4.61c.641.631 1.672.63 2.312 0l4.684-4.61a.53.53 0 0 0 0-.76.552.552 0 0 0-.771 0Z"
+                fill-rule="non-zero"
+              />
+            </svg>
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`Renders the Datasource picker component fetches the datasources and selects S3glue as source 1`] = `
+<div>
+  <div
+    aria-expanded="false"
+    aria-haspopup="listbox"
+    class="euiComboBox"
+    role="combobox"
+  >
+    <div
+      class="euiFormControlLayout"
+    >
+      <div
+        class="euiFormControlLayout__childrenWrapper"
+      >
+        <div
+          class="euiComboBox__inputWrap euiComboBox__inputWrap--noWrap"
+          data-test-subj="comboBoxInput"
+          tabindex="-1"
+        >
+          <span
+            class="euiComboBoxPill euiComboBoxPill--plainText"
+          >
+            glue_1
+          </span>
+          <div
+            class="euiComboBox__input"
+            style="font-size: 14px; display: inline-block;"
+          >
+            <input
+              aria-controls=""
+              data-test-subj="comboBoxSearchInput"
+              role="textbox"
+              style="box-sizing: content-box; width: 2px;"
+              value=""
+            />
+            <div
+              style="position: absolute; top: 0px; left: 0px; visibility: hidden; height: 0px; overflow: scroll; white-space: pre; font-family: -webkit-small-control; letter-spacing: normal; text-transform: none;"
+            />
+          </div>
+        </div>
+        <div
+          class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right"
+        >
+          <button
+            aria-label="Open list of options"
+            class="euiFormControlLayoutCustomIcon euiFormControlLayoutCustomIcon--clickable"
+            data-test-subj="comboBoxToggleListButton"
+            type="button"
+          >
+            <svg
+              aria-hidden="true"
+              class="euiIcon euiIcon--medium euiIcon-isLoading euiFormControlLayoutCustomIcon__icon"
+              focusable="false"
+              height="16"
+              role="img"
+              viewBox="0 0 16 16"
+              width="16"
+              xmlns="http://www.w3.org/2000/svg"
+            />
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;