chore: fixing remaining tests and merge conflicts

This commit is contained in:
blam
2020-10-20 00:59:50 +02:00
parent 23eaaa7019
commit a8d7e4cfe3
7 changed files with 83 additions and 83 deletions
@@ -26,7 +26,7 @@ jest.mock('react-router-dom', () => {
import React from 'react';
import { render, fireEvent } from '@testing-library/react';
import { ApiRegistry, ApiProvider } from '@backstage/core';
import { wrapInTestApp } from '@backstage/test-utils';
import { wrapInTestApp, msw } from '@backstage/test-utils';
import {
lighthouseApiRef,
@@ -39,10 +39,15 @@ import * as data from '../../__fixtures__/website-list-response.json';
const { useNavigate } = jest.requireMock('react-router-dom');
const websiteListResponse = data as WebsiteListResponse;
import { rest } from 'msw';
import { setupServer } from 'msw/node';
describe('AuditList', () => {
let apis: ApiRegistry;
const server = setupServer();
msw.setupDefaultHandlers(server);
beforeEach(() => {
apis = ApiRegistry.from([
[lighthouseApiRef, new LighthouseRestApi('http://lighthouse')],
@@ -50,6 +55,7 @@ describe('AuditList', () => {
});
it('should render the table', async () => {
server.use(rest.get('*', (_req, res, ctx) => res(ctx.json(data))));
const rendered = render(
wrapInTestApp(
<ApiProvider apis={apis}>
@@ -72,24 +78,8 @@ describe('AuditList', () => {
const button = await rendered.findByText('Create Audit');
expect(button).toBeInTheDocument();
});
/* need to rewrite these tests */
/*
describe('pagination', () => {
it('requests the correct limit and offset from the api based on the query', () => {
render(
wrapInTestApp(
<ApiProvider apis={apis}>
<AuditList />
</ApiProvider>,
{ routeEntries: ['?page=2'] },
),
);
expect(mockFetch).toHaveBeenLastCalledWith(
'http://lighthouse/v1/websites?limit=10&offset=10',
undefined,
);
});
describe('pagination', () => {
describe('when only one page is needed', () => {
it('hides pagination elements', () => {
const rendered = render(
@@ -109,7 +99,8 @@ describe('AuditList', () => {
response.limit = 5;
response.offset = 5;
response.total = 7;
mockFetch.mockResponseOnce(JSON.stringify(response));
server.use(rest.get('*', (_req, res, ctx) => res(ctx.json(response))));
server.use(rest.post('*', (_req, res, ctx) => res(ctx.json(response))));
});
it('shows pagination elements', async () => {
@@ -144,7 +135,7 @@ describe('AuditList', () => {
describe('when waiting on the request', () => {
it('should render the loader', async () => {
mockFetch.mockResponseOnce(() => new Promise(() => {}));
server.use(rest.get('*', (_req, res, ctx) => res(ctx.delay(20000))));
const rendered = render(
wrapInTestApp(
<ApiProvider apis={apis}>
@@ -159,7 +150,11 @@ describe('AuditList', () => {
describe('when the audits fail', () => {
it('should render an error', async () => {
mockFetch.mockRejectOnce(new Error('failed to fetch'));
server.use(
rest.get('*', (_req, res, ctx) =>
res(ctx.status(500, 'something broke')),
),
);
const rendered = render(
wrapInTestApp(
<ApiProvider apis={apis}>
@@ -171,5 +166,4 @@ describe('AuditList', () => {
expect(element).toBeInTheDocument();
});
});
*/
});
@@ -27,17 +27,18 @@ jest.mock('react-router-dom', () => {
});
import React from 'react';
import mockFetch from 'jest-fetch-mock';
import { render, fireEvent } from '@testing-library/react';
import { wrapInTestApp } from '@backstage/test-utils';
import { wrapInTestApp, msw } from '@backstage/test-utils';
import { ApiRegistry, ApiProvider } from '@backstage/core';
import AuditView from '.';
import { lighthouseApiRef, LighthouseRestApi, Audit, Website } from '../../api';
import { formatTime } from '../../utils';
import * as data from '../../__fixtures__/website-response.json';
import { act } from 'react-dom/test-utils';
import { setupServer } from 'msw/node';
import { rest } from 'msw';
const { useParams }: { useParams: jest.Mock } = jest.requireMock(
'react-router-dom',
);
@@ -48,8 +49,16 @@ describe('AuditView', () => {
let apis: ApiRegistry;
let id: string;
const server = setupServer();
msw.setupDefaultHandlers(server);
beforeEach(() => {
mockFetch.mockResponse(JSON.stringify(websiteResponse));
server.use(
rest.get('https://lighthouse/*', async (_req, res, ctx) =>
res(ctx.json(websiteResponse)),
),
);
apis = ApiRegistry.from([
[lighthouseApiRef, new LighthouseRestApi('https://lighthouse')],
]);
@@ -74,27 +83,6 @@ describe('AuditView', () => {
expect(iframe).toHaveAttribute('src', `https://lighthouse/v1/audits/${id}`);
});
it('renders a button to click to create a new audit for this website', async () => {
const rendered = render(
wrapInTestApp(
<ApiProvider apis={apis}>
<AuditView />
</ApiProvider>,
),
);
const button = await rendered.findByText('Create New Audit');
expect(button).toBeInTheDocument();
act(() => {
fireEvent.click(button);
});
expect(useNavigate()).toHaveBeenCalledWith(
`../../create-audit?url=${encodeURIComponent('https://spotify.com')}`,
);
});
describe('sidebar', () => {
it('renders a list of all audits for the website', async () => {
const rendered = render(
@@ -164,7 +152,7 @@ describe('AuditView', () => {
describe('when the request for the website by id is pending', () => {
it('shows the loading', async () => {
mockFetch.mockImplementationOnce(() => new Promise(() => {}));
server.use(rest.get('*', (_req, res, ctx) => res(ctx.delay(20000))));
const rendered = render(
wrapInTestApp(
<ApiProvider apis={apis}>
@@ -178,7 +166,11 @@ describe('AuditView', () => {
describe('when the request for the website by id fails', () => {
it('shows an error', async () => {
mockFetch.mockRejectOnce(new Error('failed to fetch'));
server.use(
rest.get('*', (_req, res, ctx) =>
res(ctx.status(500), ctx.body('failed to fetch')),
),
);
const rendered = render(
wrapInTestApp(
<ApiProvider apis={apis}>
@@ -186,7 +178,7 @@ describe('AuditView', () => {
</ApiProvider>,
),
);
expect(await rendered.findByText('failed to fetch')).toBeInTheDocument();
expect(await rendered.findByText(/failed to fetch/)).toBeInTheDocument();
});
});
@@ -24,20 +24,22 @@ jest.mock('react-router-dom', () => {
});
import React from 'react';
import mockFetch from 'jest-fetch-mock';
import { wait, render, fireEvent } from '@testing-library/react';
import { waitFor, render, fireEvent } from '@testing-library/react';
import {
ApiRegistry,
ApiProvider,
ErrorApi,
errorApiRef,
} from '@backstage/core';
import { wrapInTestApp } from '@backstage/test-utils';
import { wrapInTestApp, msw } from '@backstage/test-utils';
import { lighthouseApiRef, LighthouseRestApi, Audit } from '../../api';
import CreateAudit from '.';
import * as data from '../../__fixtures__/create-audit-response.json';
import { setupServer } from 'msw/node';
import { rest } from 'msw';
const { useNavigate }: { useNavigate: jest.Mock } = jest.requireMock(
'react-router-dom',
);
@@ -47,6 +49,8 @@ const createAuditResponse = data as Audit;
describe('CreateAudit', () => {
let apis: ApiRegistry;
let errorApi: ErrorApi;
const server = setupServer();
msw.setupDefaultHandlers(server);
beforeEach(() => {
errorApi = { post: jest.fn(), error$: jest.fn() };
@@ -88,7 +92,7 @@ describe('CreateAudit', () => {
describe('when waiting on the request', () => {
it('disables the form fields', () => {
mockFetch.mockResponseOnce(() => new Promise(() => {}));
server.use(rest.get('*', (_req, res, ctx) => res(ctx.delay(20000))));
const rendered = render(
wrapInTestApp(
@@ -111,7 +115,11 @@ describe('CreateAudit', () => {
describe('when the audit is successfully created', () => {
it('triggers a location change to the table', async () => {
useNavigate.mockClear();
mockFetch.mockResponseOnce(JSON.stringify(createAuditResponse));
server.use(
rest.post('http://lighthouse/v1/audits', (_req, res, ctx) =>
res(ctx.json(createAuditResponse)),
),
);
const rendered = render(
wrapInTestApp(
@@ -126,14 +134,7 @@ describe('CreateAudit', () => {
});
fireEvent.click(rendered.getByText(/Create Audit/));
expect(mockFetch).toHaveBeenCalledWith(
'http://lighthouse/v1/audits',
expect.objectContaining({
method: 'POST',
}),
);
await wait(() => expect(rendered.getByLabelText(/URL/)).toBeEnabled());
await waitFor(() => expect(rendered.getByLabelText(/URL/)).toBeEnabled());
expect(useNavigate()).toHaveBeenCalledWith('..');
});
@@ -141,9 +142,11 @@ describe('CreateAudit', () => {
describe('when the audits fail', () => {
it('should render an error', async () => {
(errorApi.post as jest.Mock).mockClear();
mockFetch.mockRejectOnce(new Error('failed to post'));
server.use(
rest.post('http://lighthouse/v1/audits', (_req, res, ctx) =>
res(ctx.status(500, 'failed to post')),
),
);
const rendered = render(
wrapInTestApp(
<ApiProvider apis={apis}>
@@ -157,8 +160,7 @@ describe('CreateAudit', () => {
});
fireEvent.click(rendered.getByText(/Create Audit/));
await wait(() => expect(rendered.getByLabelText(/URL/)).toBeEnabled());
await new Promise(r => setTimeout(r, 0));
await waitFor(() => expect(rendered.getByLabelText(/URL/)).toBeEnabled());
expect(errorApi.post).toHaveBeenCalledWith(expect.any(Error));
});
+1
View File
@@ -15,3 +15,4 @@
*/
import '@testing-library/jest-dom';
import 'cross-fetch/polyfill';