Chore: convert DebugSection test to RTL (#53965)

* convert DebugSection test to RTL

* remove unused import
This commit is contained in:
Ashley Harrison 2022-08-22 13:19:46 +01:00 committed by GitHub
parent 395e443932
commit f91f05f32c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 26 additions and 38 deletions

View File

@ -92,9 +92,6 @@ exports[`no enzyme tests`] = {
"public/app/plugins/datasource/loki/configuration/ConfigEditor.test.tsx:2659566901": [
[0, 17, 13, "RegExp match", "2409514259"]
],
"public/app/plugins/datasource/loki/configuration/DebugSection.test.tsx:1551927716": [
[0, 17, 13, "RegExp match", "2409514259"]
],
"public/app/plugins/datasource/loki/configuration/DerivedField.test.tsx:3570129984": [
[0, 19, 13, "RegExp match", "2409514259"]
],
@ -7258,12 +7255,8 @@ exports[`better eslint`] = {
[0, 0, 0, "Unexpected any. Specify a different type.", "0"]
],
"public/app/plugins/datasource/loki/configuration/DebugSection.tsx:5381": [
[0, 0, 0, "Unexpected any. Specify a different type.", "0"],
[0, 0, 0, "Unexpected any. Specify a different type.", "1"],
[0, 0, 0, "Do not use any type assertions.", "2"],
[0, 0, 0, "Unexpected any. Specify a different type.", "3"],
[0, 0, 0, "Do not use any type assertions.", "4"],
[0, 0, 0, "Do not use any type assertions.", "5"]
[0, 0, 0, "Do not use any type assertions.", "0"],
[0, 0, 0, "Unexpected any. Specify a different type.", "1"]
],
"public/app/plugins/datasource/loki/configuration/DerivedField.test.tsx:5381": [
[0, 0, 0, "Unexpected any. Specify a different type.", "0"],

View File

@ -1,4 +1,5 @@
import { mount } from 'enzyme';
import { render, screen } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import React from 'react';
import { dateTime, TimeRange } from '@grafana/data';
@ -48,20 +49,12 @@ describe('DebugSection', () => {
setLinkSrv(originalLinkSrv);
});
it('does not render any field if no debug text', () => {
const wrapper = mount(<DebugSection derivedFields={[]} />);
expect(wrapper.find('DebugFieldItem').length).toBe(0);
it('does not render any table rows if no debug text', () => {
render(<DebugSection derivedFields={[]} />);
expect(screen.queryByRole('row')).not.toBeInTheDocument();
});
it('does not render any field if no derived fields', () => {
const wrapper = mount(<DebugSection derivedFields={[]} />);
const textarea = wrapper.find('textarea');
(textarea.getDOMNode() as HTMLTextAreaElement).value = 'traceId=1234';
textarea.simulate('change');
expect(wrapper.find('DebugFieldItem').length).toBe(0);
});
it('renders derived fields', () => {
it('renders derived fields as table rows', async () => {
const derivedFields = [
{
matcherRegex: 'traceId=(\\w+)',
@ -78,14 +71,14 @@ describe('DebugSection', () => {
},
];
const wrapper = mount(<DebugSection derivedFields={derivedFields} />);
const textarea = wrapper.find('textarea');
(textarea.getDOMNode() as HTMLTextAreaElement).value = 'traceId=1234';
textarea.simulate('change');
render(<DebugSection derivedFields={derivedFields} />);
const textarea = screen.getByRole('textbox');
await userEvent.type(textarea, 'traceId=1234');
expect(wrapper.find('table').length).toBe(1);
expect(screen.getByRole('table')).toBeInTheDocument();
// 3 rows + one header
expect(wrapper.find('tr').length).toBe(4);
expect(wrapper.find('tr').at(1).contains('http://localhost/trace/${__value.raw}')).toBeTruthy();
const rows = screen.getAllByRole('row');
expect(rows.length).toBe(4);
expect(rows[1]).toHaveTextContent('http://localhost/trace/${__value.raw}');
});
});

View File

@ -1,6 +1,6 @@
import { css } from '@emotion/css';
import cx from 'classnames';
import React, { useState } from 'react';
import React, { ReactNode, useState } from 'react';
import { ArrayVector, Field, FieldType, LinkModel } from '@grafana/data';
import { LegacyForms } from '@grafana/ui';
@ -62,8 +62,8 @@ const DebugFields = ({ fields }: DebugFieldItemProps) => {
</thead>
<tbody>
{fields.map((field) => {
let value: any = field.value;
if (field.error) {
let value: ReactNode = field.value;
if (field.error && field.error instanceof Error) {
value = field.error.message;
} else if (field.href) {
value = <a href={field.href}>{value}</a>;
@ -83,7 +83,7 @@ const DebugFields = ({ fields }: DebugFieldItemProps) => {
type DebugField = {
name: string;
error?: any;
error?: unknown;
value?: string;
href?: string;
};
@ -112,16 +112,18 @@ function makeDebugFields(derivedFields: DerivedFieldConfig[], debugText: string)
})[0];
}
return {
const result: DebugField = {
name: field.name,
value: value || '<no match>',
href: link && link.href,
} as DebugField;
href: link ? link.href : undefined,
};
return result;
} catch (error) {
return {
const result: DebugField = {
name: field.name,
error,
} as DebugField;
};
return result;
}
});
}