mirror of
https://github.com/shlinkio/shlink-web-client.git
synced 2026-04-21 05:56:20 +00:00
Migrated TableOrderIcon test to react testing library
This commit is contained in:
@@ -1,38 +1,29 @@
|
||||
import { shallow, ShallowWrapper } from 'enzyme';
|
||||
import { faCaretDown as caretDownIcon, faCaretUp as caretUpIcon } from '@fortawesome/free-solid-svg-icons';
|
||||
import { render } from '@testing-library/react';
|
||||
import { TableOrderIcon } from '../../../src/utils/table/TableOrderIcon';
|
||||
import { OrderDir } from '../../../src/utils/helpers/ordering';
|
||||
|
||||
describe('<TableOrderIcon />', () => {
|
||||
let wrapper: ShallowWrapper;
|
||||
const createWrapper = (field: string, currentDir?: OrderDir, className?: string) => {
|
||||
wrapper = shallow(
|
||||
<TableOrderIcon currentOrder={{ dir: currentDir, field: 'foo' }} field={field} className={className} />,
|
||||
);
|
||||
|
||||
return wrapper;
|
||||
};
|
||||
|
||||
afterEach(() => wrapper?.unmount());
|
||||
const setUp = (field: string, currentDir?: OrderDir, className?: string) => render(
|
||||
<TableOrderIcon currentOrder={{ dir: currentDir, field: 'foo' }} field={field} className={className} />,
|
||||
);
|
||||
|
||||
it.each([
|
||||
['foo', undefined],
|
||||
['bar', 'DESC' as OrderDir],
|
||||
['bar', 'ASC' as OrderDir],
|
||||
])('renders empty when not all conditions are met', (field, dir) => {
|
||||
const wrapper = createWrapper(field, dir);
|
||||
|
||||
expect(wrapper.html()).toEqual(null);
|
||||
const { container } = setUp(field, dir);
|
||||
expect(container.firstChild).toBeNull();
|
||||
});
|
||||
|
||||
it.each([
|
||||
['DESC' as OrderDir, caretDownIcon],
|
||||
['ASC' as OrderDir, caretUpIcon],
|
||||
])('renders an icon when all conditions are met', (dir, expectedIcon) => {
|
||||
const wrapper = createWrapper('foo', dir);
|
||||
['DESC' as OrderDir],
|
||||
['ASC' as OrderDir],
|
||||
])('renders an icon when all conditions are met', (dir) => {
|
||||
const { container } = setUp('foo', dir);
|
||||
|
||||
expect(wrapper.html()).not.toEqual(null);
|
||||
expect(wrapper.prop('icon')).toEqual(expectedIcon);
|
||||
expect(container.firstChild).not.toBeNull();
|
||||
expect(container.firstChild).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it.each([
|
||||
@@ -40,8 +31,7 @@ describe('<TableOrderIcon />', () => {
|
||||
['foo', 'foo'],
|
||||
['bar', 'bar'],
|
||||
])('renders expected classname', (className, expectedClassName) => {
|
||||
const wrapper = createWrapper('foo', 'ASC', className);
|
||||
|
||||
expect(wrapper.prop('className')).toEqual(expectedClassName);
|
||||
const { container } = setUp('foo', 'ASC', className);
|
||||
expect(container.firstChild).toHaveClass(expectedClassName);
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user