unit test fixes (#6314)

Signed-off-by: Boyko Lalov <boyskila@gmail.com>
This commit is contained in:
Boyko 2019-11-13 15:58:45 +02:00 committed by Julius Volz
parent e110402d44
commit 12d347e4db
4 changed files with 22 additions and 21 deletions

View file

@ -1,11 +1,11 @@
import * as React from 'react'; import * as React from 'react';
import { mount, shallow, ReactWrapper } from 'enzyme'; import { mount, shallow, ReactWrapper } from 'enzyme';
import { act } from 'react-dom/test-utils'; import { act } from 'react-dom/test-utils';
import { Alert, Table, Badge } from 'reactstrap'; import { Alert, Table } from 'reactstrap';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faSpinner } from '@fortawesome/free-solid-svg-icons'; import { faSpinner } from '@fortawesome/free-solid-svg-icons';
import { TSDBStatus } from '.'; import { TSDBStatus } from '.';
import { TSDBMap, Stats } from './TSDBStatus'; import { TSDBMap } from './TSDBStatus';
const fakeTSDBStatusResponse: { const fakeTSDBStatusResponse: {
status: string; status: string;
@ -46,7 +46,7 @@ const fakeTSDBStatusResponse: {
describe('TSDB Stats', () => { describe('TSDB Stats', () => {
beforeEach(() => { beforeEach(() => {
fetch.resetMocks(); fetchMock.resetMocks();
}); });
it('before data is returned', () => { it('before data is returned', () => {
@ -58,9 +58,9 @@ describe('TSDB Stats', () => {
describe('when an error is returned', () => { describe('when an error is returned', () => {
it('displays an alert', async () => { it('displays an alert', async () => {
const mock = fetch.mockReject(new Error('error loading tsdb status')); const mock = fetchMock.mockReject(new Error('error loading tsdb status'));
let page: ReactWrapper; let page: any;
await act(async () => { await act(async () => {
page = mount(<TSDBStatus pathPrefix="/path/prefix" />); page = mount(<TSDBStatus pathPrefix="/path/prefix" />);
}); });
@ -94,8 +94,8 @@ describe('TSDB Stats', () => {
}, },
]; ];
const mock = fetch.mockResponse(JSON.stringify(fakeTSDBStatusResponse)); const mock = fetchMock.mockResponse(JSON.stringify(fakeTSDBStatusResponse));
let page: ReactWrapper; let page: any;
await act(async () => { await act(async () => {
page = mount(<TSDBStatus pathPrefix="/path/prefix" />); page = mount(<TSDBStatus pathPrefix="/path/prefix" />);
}); });
@ -104,17 +104,17 @@ describe('TSDB Stats', () => {
expect(mock).toHaveBeenCalledWith('/path/prefix/api/v1/status/tsdb', undefined); expect(mock).toHaveBeenCalledWith('/path/prefix/api/v1/status/tsdb', undefined);
for (let i = 0; i < tables.length; i++) { for (let i = 0; i < tables.length; i++) {
let data = tables[i].data; const data = tables[i].data;
let table = page const table = page
.find(Table) .find(Table)
.at(tables[i].table_index) .at(tables[i].table_index)
.find('tbody'); .find('tbody');
let rows = table.find('tr'); const rows = table.find('tr');
for (let i = 0; i < data.length; i++) { for (let i = 0; i < data.length; i++) {
const firstRowColumns = rows const firstRowColumns = rows
.at(i) .at(i)
.find('td') .find('td')
.map(column => column.text()); .map((column: ReactWrapper) => column.text());
expect(rows.length).toBe(data.length); expect(rows.length).toBe(data.length);
expect(firstRowColumns[0]).toBe(data[i].name); expect(firstRowColumns[0]).toBe(data[i].name);
expect(firstRowColumns[1]).toBe(data[i].value.toString()); expect(firstRowColumns[1]).toBe(data[i].value.toString());

View file

@ -51,9 +51,9 @@ function createTable(title: string, unit: string, stats: Array<Stats>) {
} }
const TSDBStatus: FC<RouteComponentProps & PathPrefixProps> = ({ pathPrefix }) => { const TSDBStatus: FC<RouteComponentProps & PathPrefixProps> = ({ pathPrefix }) => {
const { response, error } = useFetch(`${pathPrefix}/api/v1/status/tsdb`); const { response, error } = useFetch<TSDBMap>(`${pathPrefix}/api/v1/status/tsdb`);
const headStats = () => { const headStats = () => {
const stats = response && (response.data as TSDBMap); const stats = response && response.data;
if (error) { if (error) {
return ( return (
<Alert color="danger"> <Alert color="danger">

View file

@ -8,6 +8,7 @@ import ScrapePoolPanel from './ScrapePoolPanel';
import { Target } from './target'; import { Target } from './target';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faSpinner } from '@fortawesome/free-solid-svg-icons'; import { faSpinner } from '@fortawesome/free-solid-svg-icons';
import { FetchMock } from 'jest-fetch-mock/types';
describe('Flags', () => { describe('Flags', () => {
const defaultProps = { const defaultProps = {
@ -16,7 +17,7 @@ describe('Flags', () => {
}; };
beforeEach(() => { beforeEach(() => {
fetch.resetMocks(); fetchMock.resetMocks();
}); });
describe('before data is returned', () => { describe('before data is returned', () => {
@ -35,7 +36,7 @@ describe('Flags', () => {
describe('when data is returned', () => { describe('when data is returned', () => {
let scrapePoolList: ReactWrapper; let scrapePoolList: ReactWrapper;
let mock: Promise<Response>; let mock: FetchMock;
beforeEach(() => { beforeEach(() => {
//Tooltip requires DOM elements to exist. They do not in enzyme rendering so we must manually create them. //Tooltip requires DOM elements to exist. They do not in enzyme rendering so we must manually create them.
const scrapePools: { [key: string]: number } = { blackbox: 3, node_exporter: 1, prometheus: 1 }; const scrapePools: { [key: string]: number } = { blackbox: 3, node_exporter: 1, prometheus: 1 };
@ -46,7 +47,7 @@ describe('Flags', () => {
document.body.appendChild(div); document.body.appendChild(div);
}); });
}); });
mock = fetch.mockResponse(JSON.stringify(sampleApiResponse)); mock = fetchMock.mockResponse(JSON.stringify(sampleApiResponse));
}); });
it('renders a table', async () => { it('renders a table', async () => {
@ -81,9 +82,9 @@ describe('Flags', () => {
describe('when an error is returned', () => { describe('when an error is returned', () => {
it('displays an alert', async () => { it('displays an alert', async () => {
const mock = fetch.mockReject(new Error('Error fetching targets')); const mock = fetchMock.mockReject(new Error('Error fetching targets'));
let scrapePoolList: ReactWrapper; let scrapePoolList: any;
await act(async () => { await act(async () => {
scrapePoolList = mount(<ScrapePoolList {...defaultProps} />); scrapePoolList = mount(<ScrapePoolList {...defaultProps} />);
}); });

View file

@ -23,7 +23,7 @@ const filterByHealth = ({ upCount, targets }: ScrapePool, { showHealthy, showUnh
}; };
const ScrapePoolList: FC<ScrapePoolListProps & PathPrefixProps> = ({ filter, pathPrefix }) => { const ScrapePoolList: FC<ScrapePoolListProps & PathPrefixProps> = ({ filter, pathPrefix }) => {
const { response, error } = useFetch(`${pathPrefix}/api/v1/targets?state=active`); const { response, error } = useFetch<TargetsResponse>(`${pathPrefix}/api/v1/targets?state=active`);
if (error) { if (error) {
return ( return (
@ -31,14 +31,14 @@ const ScrapePoolList: FC<ScrapePoolListProps & PathPrefixProps> = ({ filter, pat
<strong>Error fetching targets:</strong> {error.message} <strong>Error fetching targets:</strong> {error.message}
</Alert> </Alert>
); );
} else if (response && response.status !== 'success') { } else if (response && response.status !== 'success' && response.status !== 'start fetching') {
return ( return (
<Alert color="danger"> <Alert color="danger">
<strong>Error fetching targets:</strong> {response.status} <strong>Error fetching targets:</strong> {response.status}
</Alert> </Alert>
); );
} else if (response && response.data) { } else if (response && response.data) {
const { activeTargets } = response.data as TargetsResponse; const { activeTargets } = response.data;
const targetGroups = groupTargets(activeTargets); const targetGroups = groupTargets(activeTargets);
return ( return (
<> <>