mirror of
https://github.com/apache/superset.git
synced 2024-09-17 11:09:47 -04:00
fix(sqllab): SqlEditorLeftBar listening to database changes (#21628)
This commit is contained in:
parent
ab53d77aba
commit
71bf267307
@ -19,7 +19,7 @@
|
||||
import React from 'react';
|
||||
import configureStore from 'redux-mock-store';
|
||||
import fetchMock from 'fetch-mock';
|
||||
import { render, screen } from 'spec/helpers/testing-library';
|
||||
import { render, screen, act } from 'spec/helpers/testing-library';
|
||||
import userEvent from '@testing-library/user-event';
|
||||
import { Provider } from 'react-redux';
|
||||
import '@testing-library/jest-dom/extend-expect';
|
||||
@ -28,7 +28,6 @@ import SqlEditorLeftBar from 'src/SqlLab/components/SqlEditorLeftBar';
|
||||
import {
|
||||
table,
|
||||
initialState,
|
||||
databases,
|
||||
defaultQueryEditor,
|
||||
mockedActions,
|
||||
} from 'src/SqlLab/fixtures';
|
||||
@ -37,7 +36,11 @@ const mockedProps = {
|
||||
actions: mockedActions,
|
||||
tables: [table],
|
||||
queryEditor: defaultQueryEditor,
|
||||
database: databases,
|
||||
database: {
|
||||
id: 1,
|
||||
database_name: 'main',
|
||||
backend: 'mysql',
|
||||
},
|
||||
height: 0,
|
||||
};
|
||||
const middlewares = [thunk];
|
||||
@ -46,7 +49,6 @@ const store = mockStore(initialState);
|
||||
|
||||
fetchMock.get('glob:*/api/v1/database/*/schemas/?*', { result: [] });
|
||||
fetchMock.get('glob:*/superset/tables/**', {
|
||||
json: {
|
||||
options: [
|
||||
{
|
||||
label: 'ab_user',
|
||||
@ -54,7 +56,6 @@ fetchMock.get('glob:*/superset/tables/**', {
|
||||
},
|
||||
],
|
||||
tableLength: 1,
|
||||
},
|
||||
});
|
||||
|
||||
describe('Left Panel Expansion', () => {
|
||||
@ -74,9 +75,7 @@ describe('Left Panel Expansion', () => {
|
||||
initialState,
|
||||
});
|
||||
|
||||
expect(
|
||||
await screen.findByText(/select database or type database name/i),
|
||||
).toBeInTheDocument();
|
||||
expect(await screen.findByText(/Database/i)).toBeInTheDocument();
|
||||
expect(
|
||||
screen.queryAllByTestId('table-element').length,
|
||||
).toBeGreaterThanOrEqual(1);
|
||||
@ -94,30 +93,27 @@ describe('Left Panel Expansion', () => {
|
||||
const schemaSelect = screen.getByRole('combobox', {
|
||||
name: 'Select schema or type schema name',
|
||||
});
|
||||
const dropdown = screen.getByText(/Select table or type table name/i);
|
||||
const abUser = screen.getByText(/ab_user/i);
|
||||
const dropdown = screen.getByText(/Table/i);
|
||||
const abUser = screen.queryAllByText(/ab_user/i);
|
||||
|
||||
expect(
|
||||
await screen.findByText(/select database or type database name/i),
|
||||
).toBeInTheDocument();
|
||||
act(async () => {
|
||||
expect(await screen.findByText(/Database/i)).toBeInTheDocument();
|
||||
expect(dbSelect).toBeInTheDocument();
|
||||
expect(schemaSelect).toBeInTheDocument();
|
||||
expect(dropdown).toBeInTheDocument();
|
||||
expect(abUser).toBeInTheDocument();
|
||||
expect(abUser).toHaveLength(2);
|
||||
expect(
|
||||
container.querySelector('.ant-collapse-content-active'),
|
||||
).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
|
||||
test('should toggle the table when the header is clicked', async () => {
|
||||
const collapseMock = jest.fn();
|
||||
render(
|
||||
<SqlEditorLeftBar
|
||||
{...mockedProps}
|
||||
actions={{ ...mockedActions, collapseTable: collapseMock }}
|
||||
tables={[table]}
|
||||
queryEditor={defaultQueryEditor}
|
||||
database={databases}
|
||||
height={0}
|
||||
/>,
|
||||
{
|
||||
useRedux: true,
|
||||
@ -130,4 +126,35 @@ describe('Left Panel Expansion', () => {
|
||||
userEvent.click(header);
|
||||
expect(collapseMock).toHaveBeenCalled();
|
||||
});
|
||||
|
||||
test('When changing database the table list must be updated', async () => {
|
||||
const { rerender } = render(<SqlEditorLeftBar {...mockedProps} />, {
|
||||
useRedux: true,
|
||||
initialState,
|
||||
});
|
||||
|
||||
await act(async () => {
|
||||
expect(await screen.findByText(/main/i)).toBeInTheDocument();
|
||||
expect(await screen.findByText(/ab_user/i)).toBeInTheDocument();
|
||||
});
|
||||
rerender(
|
||||
<SqlEditorLeftBar
|
||||
{...mockedProps}
|
||||
actions={{ ...mockedActions }}
|
||||
database={{
|
||||
id: 2,
|
||||
database_name: 'new_db',
|
||||
backend: 'postgresql',
|
||||
}}
|
||||
queryEditor={{ ...mockedProps.queryEditor, schema: 'new_schema' }}
|
||||
tables={[{ ...mockedProps.tables[0], dbId: 2, name: 'new_table' }]}
|
||||
/>,
|
||||
{
|
||||
useRedux: true,
|
||||
initialState,
|
||||
},
|
||||
);
|
||||
expect(await screen.findByText(/new_db/i)).toBeInTheDocument();
|
||||
expect(await screen.findByText(/new_table/i)).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
|
@ -138,7 +138,7 @@ export default function SqlEditorLeftBar({
|
||||
setUserSelected(userSelected);
|
||||
setItem(LocalStorageKeys.db, null);
|
||||
} else setUserSelected(database);
|
||||
}, []);
|
||||
}, [database]);
|
||||
|
||||
useEffect(() => {
|
||||
queryEditorRef.current = queryEditor;
|
||||
|
Loading…
Reference in New Issue
Block a user