shlink-web-client/test/app/App.test.tsx

71 lines
2.2 KiB
TypeScript
Raw Normal View History

import { render, screen } from '@testing-library/react';
import { fromPartial } from '@total-typescript/shoehorn';
import { createMemoryHistory } from 'history';
2023-02-18 13:11:01 +03:00
import { Router } from 'react-router-dom';
import { App as createApp } from '../../src/app/App';
2018-08-26 20:48:21 +03:00
describe('<App />', () => {
const App = createApp(
() => <>MainHeader</>,
() => <>Home</>,
() => <>MenuLayout</>,
() => <>CreateServer</>,
() => <>EditServer</>,
() => <>SettingsComp</>,
() => <>ManageServers</>,
() => <>ShlinkVersions</>,
);
const setUp = (activeRoute = '/') => {
const history = createMemoryHistory();
history.push(activeRoute);
2018-08-26 20:48:21 +03:00
return render(
<Router location={history.location} navigator={history}>
<App
fetchServers={() => {}}
servers={{}}
settings={fromPartial({})}
appUpdated
resetAppUpdate={() => {}}
/>
</Router>,
);
};
2018-08-26 20:48:21 +03:00
afterEach(jest.clearAllMocks);
2021-06-06 19:54:55 +03:00
it('renders children components', () => {
setUp();
expect(screen.getByText('MainHeader')).toBeInTheDocument();
expect(screen.getByText('ShlinkVersions')).toBeInTheDocument();
expect(screen.getByText('This app has just been updated!')).toBeInTheDocument();
});
2021-06-06 19:54:55 +03:00
it.each([
['/settings/foo', 'SettingsComp'],
['/settings/bar', 'SettingsComp'],
['/manage-servers', 'ManageServers'],
['/server/create', 'CreateServer'],
['/server/abc123/edit', 'EditServer'],
['/server/def456/edit', 'EditServer'],
['/server/abc123/foo', 'MenuLayout'],
['/server/def456/bar', 'MenuLayout'],
['/other', 'Oops! We could not find requested route.'],
])('renders expected route', async (activeRoute, expectedComponent) => {
setUp(activeRoute);
expect(await screen.findByText(expectedComponent)).toBeInTheDocument();
2018-08-26 20:48:21 +03:00
});
it.each([
2022-03-26 14:17:42 +03:00
['/foo', 'shlink-wrapper'],
['/bar', 'shlink-wrapper'],
['/', 'shlink-wrapper d-flex d-md-block align-items-center'],
])('renders expected classes on shlink-wrapper based on current pathname', (pathname, expectedClasses) => {
const { container } = setUp(pathname);
const shlinkWrapper = container.querySelector('.shlink-wrapper');
expect(shlinkWrapper).toHaveAttribute('class', expectedClasses);
});
2018-08-26 20:48:21 +03:00
});