Refactor/Explore: Inline datasource actions into initialisation (#28953)

* Inline datasource actions into initialisation

* Fix datasource change

* Fix rich history

* Fix test

* Move rich history init to Wrapper

* Remove console log

* TS fixes

Co-authored-by: Zoltán Bedi <zoltan.bedi@gmail.com>
This commit is contained in:
Andrej Ocenas
2020-11-19 11:33:52 +01:00
committed by GitHub
parent 2c898ab1bc
commit 66cdc18705
11 changed files with 172 additions and 298 deletions

View File

@@ -1,5 +1,5 @@
import React from 'react';
import { render, screen, fireEvent } from '@testing-library/react';
import { render, screen, fireEvent, waitFor } from '@testing-library/react';
import Wrapper from './Wrapper';
import { configureStore } from '../../store/configureStore';
import { Provider } from 'react-redux';
@@ -73,6 +73,12 @@ describe('Wrapper', () => {
...query,
});
expect(store.getState().explore.richHistory[0]).toMatchObject({
datasourceId: '1',
datasourceName: 'loki',
queries: [{ expr: '{ label="value"}' }],
});
// We called the data source query method once
expect(datasources.loki.query).toBeCalledTimes(1);
expect((datasources.loki.query as Mock).mock.calls[0][0]).toMatchObject({
@@ -107,6 +113,7 @@ describe('Wrapper', () => {
(datasources.loki.query as Mock).mockReturnValueOnce(makeLogsQueryResponse());
// Wait for rendering the logs
await screen.findByText(/custom log line/i);
await screen.findByText(`loki Editor input: { label="value"}`);
(datasources.elastic.query as Mock).mockReturnValueOnce(makeMetricsQueryResponse());
store.dispatch(
@@ -117,19 +124,25 @@ describe('Wrapper', () => {
);
// Editor renders the new query
await screen.findByText(`loki Editor input: other query`);
await screen.findByText(`elastic Editor input: other query`);
// Renders graph
await screen.findByText(/Graph/i);
});
it('handles changing the datasource manually', async () => {
const { datasources } = setup();
const query = { left: JSON.stringify(['now-1h', 'now', 'loki', { expr: '{ label="value"}' }]) };
const { datasources } = setup({ query });
(datasources.loki.query as Mock).mockReturnValueOnce(makeLogsQueryResponse());
// Wait for rendering the editor
await screen.findByText(/Editor/i);
await changeDatasource('elastic');
await screen.findByText('elastic Editor input:');
expect(datasources.elastic.query).not.toBeCalled();
expect(store.getState().location.query).toEqual({
orgId: '1',
left: JSON.stringify(['now-1h', 'now', 'elastic', {}]),
});
});
it('opens the split pane', async () => {
@@ -154,8 +167,10 @@ describe('Wrapper', () => {
(datasources.elastic.query as Mock).mockReturnValueOnce(makeLogsQueryResponse());
// Make sure we render the logs panel
const logsPanels = await screen.findAllByText(/^Logs$/i);
expect(logsPanels.length).toBe(2);
await waitFor(() => {
const logsPanels = screen.getAllByText(/^Logs$/i);
expect(logsPanels.length).toBe(2);
});
// Make sure we render the log line
const logsLines = await screen.findAllByText(/custom log line/i);
@@ -195,7 +210,10 @@ function setup(options?: SetupOptions): { datasources: { [name: string]: DataSou
window.localStorage.clear();
// Create this here so any mocks are recreated on setup and don't retain state
const defaultDatasources: DatasourceSetup[] = [makeDatasourceSetup(), makeDatasourceSetup({ name: 'elastic' })];
const defaultDatasources: DatasourceSetup[] = [
makeDatasourceSetup(),
makeDatasourceSetup({ name: 'elastic', id: 2 }),
];
const dsSettings = options?.datasources || defaultDatasources;
@@ -235,18 +253,18 @@ function setup(options?: SetupOptions): { datasources: { [name: string]: DataSou
return { datasources: fromPairs(dsSettings.map(d => [d.api.name, d.api])) };
}
function makeDatasourceSetup({ name = 'loki' }: { name?: string } = {}): DatasourceSetup {
function makeDatasourceSetup({ name = 'loki', id = 1 }: { name?: string; id?: number } = {}): DatasourceSetup {
const meta: any = {
info: {
logos: {
small: '',
},
},
id: '1',
id: id.toString(),
};
return {
settings: {
id: 1,
id,
uid: name,
type: 'logs',
name,