shlink-web-client/test/short-urls/helpers/DeleteShortUrlModal.test.tsx

92 lines
3.3 KiB
TypeScript
Raw Normal View History

import { screen, waitFor } from '@testing-library/react';
import { Mock } from 'ts-mockery';
import { DeleteShortUrlModal } from '../../../src/short-urls/helpers/DeleteShortUrlModal';
import { ShortUrl } from '../../../src/short-urls/data';
import { ShortUrlDeletion } from '../../../src/short-urls/reducers/shortUrlDeletion';
import { renderWithEvents } from '../../__helpers__/setUpTest';
import { ErrorTypeV2, ErrorTypeV3, InvalidShortUrlDeletion, ProblemDetailsError } from '../../../src/api/types/errors';
import { TestModalWrapper } from '../../__helpers__/TestModalWrapper';
2018-11-01 14:24:16 +03:00
describe('<DeleteShortUrlModal />', () => {
const shortUrl = Mock.of<ShortUrl>({
2018-11-01 14:24:16 +03:00
tags: [],
shortCode: 'abc123',
longUrl: 'https://long-domain.com/foo/bar',
});
const deleteShortUrl = jest.fn().mockResolvedValue(undefined);
const shortUrlDeleted = jest.fn();
const setUp = (shortUrlDeletion: Partial<ShortUrlDeletion>) => renderWithEvents(
<TestModalWrapper
renderModal={(args) => (
<DeleteShortUrlModal
{...args}
shortUrl={shortUrl}
shortUrlDeletion={Mock.of<ShortUrlDeletion>(shortUrlDeletion)}
deleteShortUrl={deleteShortUrl}
shortUrlDeleted={shortUrlDeleted}
resetDeleteShortUrl={jest.fn()}
/>
)}
/>,
);
2018-11-01 14:24:16 +03:00
afterEach(jest.clearAllMocks);
2018-11-01 14:24:16 +03:00
it('shows generic error when non-threshold error occurs', () => {
setUp({
2018-11-01 14:24:16 +03:00
loading: false,
error: true,
shortCode: 'abc123',
2020-12-12 15:33:21 +03:00
errorData: Mock.of<ProblemDetailsError>({ type: 'OTHER_ERROR' }),
2018-11-01 14:24:16 +03:00
});
expect(screen.getByText('Something went wrong while deleting the URL :(').parentElement).not.toHaveClass(
'bg-warning',
);
});
it.each([
[Mock.of<InvalidShortUrlDeletion>({ type: ErrorTypeV3.INVALID_SHORT_URL_DELETION })],
[Mock.of<InvalidShortUrlDeletion>({ type: ErrorTypeV2.INVALID_SHORT_URL_DELETION })],
])('shows specific error when threshold error occurs', (errorData) => {
setUp({ loading: false, error: true, shortCode: 'abc123', errorData });
expect(screen.getByText('Something went wrong while deleting the URL :(').parentElement).toHaveClass('bg-warning');
2018-11-01 14:24:16 +03:00
});
it('disables submit button when loading', () => {
setUp({
2018-11-01 14:24:16 +03:00
loading: true,
error: false,
shortCode: 'abc123',
});
expect(screen.getByRole('button', { name: 'Deleting...' })).toHaveAttribute('disabled');
2018-11-01 14:24:16 +03:00
});
it('enables submit button when proper short code is provided', async () => {
const { user } = setUp({
2018-11-01 14:24:16 +03:00
loading: false,
error: false,
shortCode: 'abc123',
2018-11-01 14:24:16 +03:00
});
const getDeleteBtn = () => screen.getByRole('button', { name: 'Delete' });
2018-11-01 14:24:16 +03:00
expect(getDeleteBtn()).toHaveAttribute('disabled');
await user.type(screen.getByPlaceholderText('Insert delete'), 'delete');
expect(getDeleteBtn()).not.toHaveAttribute('disabled');
2018-11-01 14:24:16 +03:00
});
it('tries to delete short URL when form is submit', async () => {
const { user } = setUp({
2018-11-01 14:24:16 +03:00
loading: false,
error: false,
deleted: true,
shortCode: 'abc123',
2018-11-01 14:24:16 +03:00
});
expect(deleteShortUrl).not.toHaveBeenCalled();
await user.type(screen.getByPlaceholderText('Insert delete'), 'delete');
await user.click(screen.getByRole('button', { name: 'Delete' }));
expect(deleteShortUrl).toHaveBeenCalledTimes(1);
await waitFor(() => expect(shortUrlDeleted).toHaveBeenCalledTimes(1));
2018-11-01 14:24:16 +03:00
});
});