convert LokiQueryEditor test to RTL (#54639)

This commit is contained in:
Ashley Harrison 2022-09-02 15:11:13 +01:00 committed by GitHub
parent 22e5ee3b52
commit 3e8d178fc1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 34 additions and 162 deletions

View File

@ -77,9 +77,6 @@ exports[`no enzyme tests`] = {
"public/app/plugins/datasource/cloudwatch/components/ConfigEditor.test.tsx:4057721851": [
[1, 19, 13, "RegExp match", "2409514259"]
],
"public/app/plugins/datasource/loki/components/LokiQueryEditor.test.tsx:146069464": [
[0, 19, 13, "RegExp match", "2409514259"]
],
"public/app/plugins/datasource/loki/configuration/DerivedFields.test.tsx:2402631398": [
[0, 17, 13, "RegExp match", "2409514259"]
]
@ -7050,9 +7047,6 @@ exports[`better eslint`] = {
"public/app/plugins/datasource/loki/components/LokiOptionFields.test.tsx:5381": [
[0, 0, 0, "Unexpected any. Specify a different type.", "0"]
],
"public/app/plugins/datasource/loki/components/LokiQueryEditor.test.tsx:5381": [
[0, 0, 0, "Unexpected any. Specify a different type.", "0"]
],
"public/app/plugins/datasource/loki/components/LokiQueryField.tsx:5381": [
[0, 0, 0, "Do not use any type assertions.", "0"],
[0, 0, 0, "Do not use any type assertions.", "1"],
@ -7840,7 +7834,8 @@ exports[`better eslint`] = {
[0, 0, 0, "Unexpected any. Specify a different type.", "12"],
[0, 0, 0, "Unexpected any. Specify a different type.", "13"],
[0, 0, 0, "Unexpected any. Specify a different type.", "14"],
[0, 0, 0, "Unexpected any. Specify a different type.", "15"]
[0, 0, 0, "Unexpected any. Specify a different type.", "15"],
[0, 0, 0, "Unexpected any. Specify a different type.", "16"]
],
"public/app/plugins/datasource/tempo/datasource.ts:5381": [
[0, 0, 0, "Do not use any type assertions.", "0"],

View File

@ -1,23 +1,35 @@
import { shallow } from 'enzyme';
import { render } from '@testing-library/react';
import React from 'react';
import { toUtc } from '@grafana/data';
import { EventBusSrv, TimeRange, toUtc } from '@grafana/data';
import { setBackendSrv, TemplateSrv } from '@grafana/runtime';
import { BackendSrv } from 'app/core/services/backend_srv';
import { ContextSrv } from 'app/core/services/context_srv';
import { LokiDatasource } from '../datasource';
import { createLokiDatasource } from '../mocks';
import { LokiQuery } from '../types';
import { LokiQueryEditor } from './LokiQueryEditor';
const createMockRequestRange = (from: string, to: string) => {
const createMockRequestRange = (from: string, to: string): TimeRange => {
return {
from: toUtc(from, 'YYYY-MM-DD'),
to: toUtc(to, 'YYYY-MM-DD'),
raw: {
from: toUtc(from, 'YYYY-MM-DD'),
to: toUtc(to, 'YYYY-MM-DD'),
},
};
};
const setup = (propOverrides?: object) => {
const datasourceMock: unknown = {};
const datasource: LokiDatasource = datasourceMock as LokiDatasource;
const mockTemplateSrv: TemplateSrv = {
getVariables: jest.fn(),
replace: jest.fn(),
containsTemplate: jest.fn(),
updateTimeRange: jest.fn(),
};
const datasource = createLokiDatasource(mockTemplateSrv);
const onRunQuery = jest.fn();
const onChange = jest.fn();
@ -29,7 +41,7 @@ const setup = (propOverrides?: object) => {
const range = createMockRequestRange('2020-01-01', '2020-01-02');
const props: any = {
const props = {
datasource,
onChange,
onRunQuery,
@ -39,26 +51,22 @@ const setup = (propOverrides?: object) => {
Object.assign(props, propOverrides);
const wrapper = shallow(<LokiQueryEditor {...props} />);
const instance = wrapper.instance();
return {
instance,
wrapper,
};
render(<LokiQueryEditor {...props} />);
};
describe('Render LokiQueryEditor with legend', () => {
it('should render', () => {
const { wrapper } = setup();
expect(wrapper).toMatchSnapshot();
beforeAll(() => {
const mockedBackendSrv = new BackendSrv({
fromFetch: jest.fn(),
appEvents: new EventBusSrv(),
contextSrv: new ContextSrv(),
logout: jest.fn(),
});
it('should update timerange', () => {
const { wrapper } = setup();
wrapper.setProps({
range: createMockRequestRange('2019-01-01', '2020-01-02'),
});
expect(wrapper).toMatchSnapshot();
setBackendSrv(mockedBackendSrv);
});
describe('LokiQueryEditor', () => {
it('should render without throwing', () => {
expect(() => setup()).not.toThrow();
});
});

View File

@ -1,131 +0,0 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Render LokiQueryEditor with legend should render 1`] = `
<LokiQueryField
ExtraFieldElement={
<React.Fragment>
<LokiOptionFields
lineLimitValue=""
onChange={[MockFunction]}
onRunQuery={[MockFunction]}
query={
Object {
"expr": "",
"legendFormat": "My Legend",
"refId": "A",
}
}
resolution={1}
runOnBlur={true}
/>
<div
className="gf-form-inline"
>
<div
className="gf-form"
>
<FormLabel
tooltip="Controls the name of the time series, using name or pattern. For example
{{hostname}} will be replaced with label value for the label hostname. The legend only applies to metric queries."
width={6}
>
Legend
</FormLabel>
<input
className="gf-form-input"
onBlur={[MockFunction]}
onChange={[Function]}
placeholder="legend format"
type="text"
value="My Legend"
/>
</div>
</div>
</React.Fragment>
}
data-testid="loki-editor"
datasource={Object {}}
history={Array []}
onBlur={[MockFunction]}
onChange={[MockFunction]}
onRunQuery={[MockFunction]}
query={
Object {
"expr": "",
"legendFormat": "My Legend",
"refId": "A",
}
}
range={
Object {
"from": "2020-01-01T00:00:00.000Z",
"to": "2020-01-02T00:00:00.000Z",
}
}
/>
`;
exports[`Render LokiQueryEditor with legend should update timerange 1`] = `
<LokiQueryField
ExtraFieldElement={
<React.Fragment>
<LokiOptionFields
lineLimitValue=""
onChange={[MockFunction]}
onRunQuery={[MockFunction]}
query={
Object {
"expr": "",
"legendFormat": "My Legend",
"refId": "A",
}
}
resolution={1}
runOnBlur={true}
/>
<div
className="gf-form-inline"
>
<div
className="gf-form"
>
<FormLabel
tooltip="Controls the name of the time series, using name or pattern. For example
{{hostname}} will be replaced with label value for the label hostname. The legend only applies to metric queries."
width={6}
>
Legend
</FormLabel>
<input
className="gf-form-input"
onBlur={[MockFunction]}
onChange={[Function]}
placeholder="legend format"
type="text"
value="My Legend"
/>
</div>
</div>
</React.Fragment>
}
data-testid="loki-editor"
datasource={Object {}}
history={Array []}
onBlur={[MockFunction]}
onChange={[MockFunction]}
onRunQuery={[MockFunction]}
query={
Object {
"expr": "",
"legendFormat": "My Legend",
"refId": "A",
}
}
range={
Object {
"from": "2019-01-01T00:00:00.000Z",
"to": "2020-01-02T00:00:00.000Z",
}
}
/>
`;