You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by ly...@apache.org on 2022/10/11 16:18:21 UTC
[superset] branch lyndsi/client-side-search created (now 06b1202b9f)
This is an automated email from the ASF dual-hosted git repository.
lyndsi pushed a change to branch lyndsi/client-side-search
in repository https://gitbox.apache.org/repos/asf/superset.git
at 06b1202b9f Debugging LeftPanel.test.tsx
This branch includes the following new commits:
new ead3c2baa4 Add client side searching to table list in dataset left panel
new 06b1202b9f Debugging LeftPanel.test.tsx
The 2 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails. The revisions
listed as "add" were already present in the repository and have only
been added to this reference.
[superset] 02/02: Debugging LeftPanel.test.tsx
Posted by ly...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
lyndsi pushed a commit to branch lyndsi/client-side-search
in repository https://gitbox.apache.org/repos/asf/superset.git
commit 06b1202b9fcb72eae823c503232b9294e51d841f
Author: lyndsiWilliams <kc...@gmail.com>
AuthorDate: Tue Oct 11 11:18:01 2022 -0500
Debugging LeftPanel.test.tsx
---
.../AddDataset/LeftPanel/LeftPanel.test.tsx | 33 +---------------------
1 file changed, 1 insertion(+), 32 deletions(-)
diff --git a/superset-frontend/src/views/CRUD/data/dataset/AddDataset/LeftPanel/LeftPanel.test.tsx b/superset-frontend/src/views/CRUD/data/dataset/AddDataset/LeftPanel/LeftPanel.test.tsx
index 574928126b..5af028492c 100644
--- a/superset-frontend/src/views/CRUD/data/dataset/AddDataset/LeftPanel/LeftPanel.test.tsx
+++ b/superset-frontend/src/views/CRUD/data/dataset/AddDataset/LeftPanel/LeftPanel.test.tsx
@@ -20,7 +20,7 @@ import React from 'react';
import { SupersetClient } from '@superset-ui/core';
// import fetchMock from 'fetch-mock';
import userEvent from '@testing-library/user-event';
-import { render, screen, waitFor, within } from 'spec/helpers/testing-library';
+import { render, screen, waitFor } from 'spec/helpers/testing-library';
import LeftPanel from 'src/views/CRUD/data/dataset/AddDataset/LeftPanel';
// const tablesEndpoint = 'glob:*/superset/tables*';
@@ -219,44 +219,13 @@ describe('LeftPanel', () => {
expect(await screen.findByText('test-postgres')).toBeInTheDocument();
expect(schemaSelect).toBeDisabled();
userEvent.click(screen.getByText('test-postgres'));
- // screen.debug(databaseSelect);
- // userEvent.selectOptions(databaseSelect, 'test-postgres');
// Wait for schema field to be enabled
await waitFor(() => {
expect(schemaSelect).toBeEnabled();
});
- const lbs = screen.getAllByRole('listbox');
- const cbs = screen.getAllByRole('combobox');
- const options = screen.getAllByRole('option');
-
- // userEvent.selectOptions(schemaSelect, '');
- screen.debug(within(lbs[0]).getAllByRole('option')[1]);
- userEvent.click(within(lbs[0]).getAllByRole('option')[1]);
- // await waitFor(() =>
- // expect(screen.getByRole('option', { name: 'public' })).toBeVisible(),
- // );
- // // screen.debug(screen.getByRole('option', { name: 'information_schema' }));
- // expect(
- // await screen.findByRole('option', { name: 'information_schema' }),
- // ).toBeVisible();
- // expect(await screen.findByRole('option', { name: 'public' })).toBeVisible();
-
- // SupersetClientGet.mockImplementation(await getTableMockFunction());
- // screen.logTestingPlaygroundURL();
-
- // userEvent.click(screen.getByRole('option', { name: '2' }));
- // screen.logTestingPlaygroundURL();
// // Todo: (Phillip) finish testing for showing list of options once table is implemented
// // screen.debug(screen.getByText('table_a'));
- // screen.debug(screen.getAllByRole('option'));
- // userEvent.selectOptions(
- // schemaSelect,
- // screen.getByRole('option', { name: 'public' }),
- // );
- // screen.logTestingPlaygroundURL();
- // screen.debug(screen.getByTestId('options-list'));
- // expect(screen.getByTestId('options-list')).toBeInTheDocument();
});
});
[superset] 01/02: Add client side searching to table list in dataset left panel
Posted by ly...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
lyndsi pushed a commit to branch lyndsi/client-side-search
in repository https://gitbox.apache.org/repos/asf/superset.git
commit ead3c2baa4077a22ae16f8af980d62d911749833
Author: lyndsiWilliams <kc...@gmail.com>
AuthorDate: Wed Sep 28 14:48:46 2022 -0500
Add client side searching to table list in dataset left panel
---
.../AddDataset/LeftPanel/LeftPanel.test.tsx | 88 +++++++++++++++-------
.../data/dataset/AddDataset/LeftPanel/index.tsx | 8 +-
2 files changed, 65 insertions(+), 31 deletions(-)
diff --git a/superset-frontend/src/views/CRUD/data/dataset/AddDataset/LeftPanel/LeftPanel.test.tsx b/superset-frontend/src/views/CRUD/data/dataset/AddDataset/LeftPanel/LeftPanel.test.tsx
index 9027b232af..574928126b 100644
--- a/superset-frontend/src/views/CRUD/data/dataset/AddDataset/LeftPanel/LeftPanel.test.tsx
+++ b/superset-frontend/src/views/CRUD/data/dataset/AddDataset/LeftPanel/LeftPanel.test.tsx
@@ -18,10 +18,18 @@
*/
import React from 'react';
import { SupersetClient } from '@superset-ui/core';
+// import fetchMock from 'fetch-mock';
import userEvent from '@testing-library/user-event';
-import { render, screen, waitFor } from 'spec/helpers/testing-library';
+import { render, screen, waitFor, within } from 'spec/helpers/testing-library';
import LeftPanel from 'src/views/CRUD/data/dataset/AddDataset/LeftPanel';
+// const tablesEndpoint = 'glob:*/superset/tables*';
+
+// fetchMock.get(tablesEndpoint, {
+// tableLength: 1,
+// options: [{ value: 'Sheet1', type: 'table', extra: null }],
+// });
+
describe('LeftPanel', () => {
const mockFun = jest.fn();
@@ -31,11 +39,18 @@ describe('LeftPanel', () => {
jest.resetAllMocks();
SupersetClientGet.mockImplementation(
async ({ endpoint }: { endpoint: string }) => {
+ console.log('FINDME TEST', endpoint);
if (endpoint.includes('schemas')) {
return {
json: { result: ['information_schema', 'public'] },
} as any;
}
+ if (endpoint.includes('tables')) {
+ return {
+ tableLength: 1,
+ options: [{ value: 'Sheet1', type: 'table', extra: null }],
+ };
+ }
return {
json: {
count: 2,
@@ -149,28 +164,20 @@ describe('LeftPanel', () => {
const getTableMockFunction = async () =>
({
- json: {
- options: [
- { label: 'table_a', value: 'table_a' },
- { label: 'table_b', value: 'table_b' },
- { label: 'table_c', value: 'table_c' },
- { label: 'table_d', value: 'table_d' },
- ],
- },
+ tableLength: 1,
+ options: [{ value: 'Sheet1', type: 'table', extra: null }],
} as any);
test('should render', async () => {
- const { container } = render(<LeftPanel setDataset={mockFun} />, {
+ render(<LeftPanel setDataset={mockFun} />, {
useRedux: true,
});
-
expect(
await screen.findByText(/select database & schema/i),
).toBeInTheDocument();
- expect(container).toBeInTheDocument();
});
- test('should render tableselector and databaselector container and selects', async () => {
+ test('should render schema selector, databa selector container, and selects', async () => {
render(<LeftPanel setDataset={mockFun} />, { useRedux: true });
expect(await screen.findByText(/select database & schema/i)).toBeVisible();
@@ -200,33 +207,56 @@ describe('LeftPanel', () => {
useRedux: true,
});
+ // Click 'test-postgres' database to access schemas
const databaseSelect = screen.getByRole('combobox', {
name: 'Select database or type database name',
});
- userEvent.click(databaseSelect);
- expect(await screen.findByText('test-postgres')).toBeInTheDocument();
-
- userEvent.click(screen.getAllByText('test-postgres')[0]);
- const tableSelect = screen.getByRole('combobox', {
+ // Schema select should be disabled until database is selected
+ const schemaSelect = screen.getByRole('combobox', {
name: /select schema or type schema name/i,
});
+ userEvent.click(databaseSelect);
+ expect(await screen.findByText('test-postgres')).toBeInTheDocument();
+ expect(schemaSelect).toBeDisabled();
+ userEvent.click(screen.getByText('test-postgres'));
+ // screen.debug(databaseSelect);
+ // userEvent.selectOptions(databaseSelect, 'test-postgres');
+ // Wait for schema field to be enabled
await waitFor(() => {
- expect(tableSelect).toBeEnabled();
+ expect(schemaSelect).toBeEnabled();
});
+ const lbs = screen.getAllByRole('listbox');
+ const cbs = screen.getAllByRole('combobox');
+ const options = screen.getAllByRole('option');
- userEvent.click(tableSelect);
- expect(
- await screen.findByRole('option', { name: 'information_schema' }),
- ).toBeInTheDocument();
- expect(
- await screen.findByRole('option', { name: 'public' }),
- ).toBeInTheDocument();
+ // userEvent.selectOptions(schemaSelect, '');
+ screen.debug(within(lbs[0]).getAllByRole('option')[1]);
+ userEvent.click(within(lbs[0]).getAllByRole('option')[1]);
+ // await waitFor(() =>
+ // expect(screen.getByRole('option', { name: 'public' })).toBeVisible(),
+ // );
+ // // screen.debug(screen.getByRole('option', { name: 'information_schema' }));
+ // expect(
+ // await screen.findByRole('option', { name: 'information_schema' }),
+ // ).toBeVisible();
+ // expect(await screen.findByRole('option', { name: 'public' })).toBeVisible();
+
+ // SupersetClientGet.mockImplementation(await getTableMockFunction());
+ // screen.logTestingPlaygroundURL();
- SupersetClientGet.mockImplementation(getTableMockFunction);
+ // userEvent.click(screen.getByRole('option', { name: '2' }));
+ // screen.logTestingPlaygroundURL();
- // Todo: (Phillip) finish testing for showing list of options once table is implemented
- // userEvent.click(screen.getAllByText('public')[1]);
+ // // Todo: (Phillip) finish testing for showing list of options once table is implemented
+ // // screen.debug(screen.getByText('table_a'));
+ // screen.debug(screen.getAllByRole('option'));
+ // userEvent.selectOptions(
+ // schemaSelect,
+ // screen.getByRole('option', { name: 'public' }),
+ // );
+ // screen.logTestingPlaygroundURL();
+ // screen.debug(screen.getByTestId('options-list'));
// expect(screen.getByTestId('options-list')).toBeInTheDocument();
});
});
diff --git a/superset-frontend/src/views/CRUD/data/dataset/AddDataset/LeftPanel/index.tsx b/superset-frontend/src/views/CRUD/data/dataset/AddDataset/LeftPanel/index.tsx
index bcc7a4a0db..03c865ddcb 100644
--- a/superset-frontend/src/views/CRUD/data/dataset/AddDataset/LeftPanel/index.tsx
+++ b/superset-frontend/src/views/CRUD/data/dataset/AddDataset/LeftPanel/index.tsx
@@ -219,10 +219,14 @@ export default function LeftPanel({
[dbId, encodedSchema],
);
+ const filteredOptions = tableOptions.filter(option =>
+ option?.value?.toLowerCase().includes(searchVal.toLowerCase()),
+ );
+
const Loader = (inline: string) => (
<div className="loading-container">
<Loading position="inline" />
- <p>{inline} </p>
+ <p>{inline}</p>
</div>
);
@@ -273,7 +277,7 @@ export default function LeftPanel({
</Form>
<div className="options-list" data-test="options-list">
{!refresh &&
- tableOptions.map((option, i) => (
+ filteredOptions.map((option, i) => (
<div
className={
selectedTable === i ? 'options-highlighted' : 'options'