mirrors/shlink-web-client
1
0
Fork 0
mirror of https://github.com/shlinkio/shlink-web-client.git synced 2025-01-09 01:37:24 +03:00
Code Issues Projects Releases Packages Wiki Activity

Migrated AppUpdateBanner test to react testing library

Browse source
This commit is contained in:
Alejandro Celaya 2022-05-03 17:49:42 +02:00
parent 9784cbb3ac
commit f72251c125
2 changed files with 14 additions and 26 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/common/AppUpdateBanner.tsx
View file

@ -24,7 +24,7 @@ export const AppUpdateBanner: FC<AppUpdateBannerProps> = ({ isOpen, toggle, forc
<h4 className="mb-4">This app has just been updated!</h4>
<p className="mb-0">
Restart it to enjoy the new features.
<Button disabled={isUpdating} className="ms-2" color="secondary" size="sm" onClick={update}>
<Button role="button" disabled={isUpdating} className="ms-2" color="secondary" size="sm" onClick={update}>
{!isUpdating && <>Restart now <FontAwesomeIcon icon={reloadIcon} className="ms-1" /></>}
{isUpdating && <>Restarting...</>}
</Button>

38
test/common/AppUpdateBanner.test.tsx
View file

@ -1,43 +1,31 @@
import { shallow, ShallowWrapper } from 'enzyme';
import { Button } from 'reactstrap';
import { fireEvent, render, screen } from '@testing-library/react';
import { AppUpdateBanner } from '../../src/common/AppUpdateBanner';
import { SimpleCard } from '../../src/utils/SimpleCard';
describe('<AppUpdateBanner />', () => {
const toggle = jest.fn();
const forceUpdate = jest.fn();
let wrapper: ShallowWrapper;
beforeEach(() => {
wrapper = shallow(<AppUpdateBanner isOpen toggle={toggle} forceUpdate={forceUpdate} />);
});
beforeEach(() => render(<AppUpdateBanner isOpen toggle={toggle} forceUpdate={forceUpdate} />));
afterEach(jest.clearAllMocks);
afterEach(() => wrapper?.unmount());
it('renders an alert with expected props', () => {
expect(wrapper.prop('className')).toEqual('app-update-banner');
expect(wrapper.prop('isOpen')).toEqual(true);
expect(wrapper.prop('toggle')).toEqual(toggle);
expect(wrapper.prop('tag')).toEqual(SimpleCard);
expect(wrapper.prop('color')).toEqual('secondary');
it('renders initial state', () => {
expect(screen.getByRole('heading')).toHaveTextContent('This app has just been updated!');
expect(screen.queryByText('Restarting...')).not.toBeInTheDocument();
expect(screen.getByText('Restart now')).not.toHaveAttribute('disabled');
});
it('invokes toggle when alert is toggled', () => {
(wrapper.prop('toggle') as Function)();
it('invokes toggle when alert is closed', () => {
expect(toggle).not.toHaveBeenCalled();
fireEvent.click(screen.getByLabelText('Close'));
expect(toggle).toHaveBeenCalled();
});
it('triggers the update when clicking the button', () => {
expect(wrapper.find(Button).html()).toContain('Restart now');
expect(wrapper.find(Button).prop('disabled')).toEqual(false);
it('triggers the update when clicking the button', async () => {
expect(forceUpdate).not.toHaveBeenCalled();
wrapper.find(Button).simulate('click');
expect(wrapper.find(Button).html()).toContain('Restarting...');
expect(wrapper.find(Button).prop('disabled')).toEqual(true);
fireEvent.click(screen.getByText(/^Restart now/));
expect(forceUpdate).toHaveBeenCalled();
expect(await screen.findByText('Restarting...')).toBeInTheDocument();
expect(screen.queryByText(/^Restart now/)).not.toBeInTheDocument();
});
});