mirror of
https://github.com/shlinkio/shlink-web-client.git
synced 2024-12-23 01:20:24 +03:00
Migrated CopyToClipboard test to react testing library
This commit is contained in:
parent
72f790b28c
commit
44a93ae556
3 changed files with 43 additions and 18 deletions
|
@ -4,4 +4,5 @@ import ResizeObserver from 'resize-observer-polyfill';
|
|||
|
||||
(global as any).ResizeObserver = ResizeObserver;
|
||||
(global as any).scrollTo = () => {};
|
||||
(global as any).prompt = () => {};
|
||||
(global as any).matchMedia = (media: string) => ({ matches: false, media });
|
||||
|
|
|
@ -1,27 +1,30 @@
|
|||
import { shallow, ShallowWrapper } from 'enzyme';
|
||||
import CopyToClipboard from 'react-copy-to-clipboard';
|
||||
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
||||
import { faCopy as copyIcon } from '@fortawesome/free-regular-svg-icons';
|
||||
import { render } from '@testing-library/react';
|
||||
import userEvent from '@testing-library/user-event';
|
||||
import { CopyToClipboardIcon } from '../../src/utils/CopyToClipboardIcon';
|
||||
|
||||
describe('<CopyToClipboardIcon />', () => {
|
||||
let wrapper: ShallowWrapper;
|
||||
const onCopy = () => {};
|
||||
|
||||
beforeEach(() => {
|
||||
wrapper = shallow(<CopyToClipboardIcon text="foo" onCopy={onCopy} />);
|
||||
const onCopy = jest.fn();
|
||||
const setUp = (text = 'foo') => ({
|
||||
user: userEvent.setup(),
|
||||
...render(<CopyToClipboardIcon text={text} onCopy={onCopy} />),
|
||||
});
|
||||
afterEach(() => wrapper?.unmount());
|
||||
|
||||
afterEach(jest.clearAllMocks);
|
||||
|
||||
it('wraps expected components', () => {
|
||||
const copyToClipboard = wrapper.find(CopyToClipboard);
|
||||
const icon = wrapper.find(FontAwesomeIcon);
|
||||
const { container } = setUp();
|
||||
expect(container).toMatchSnapshot();
|
||||
});
|
||||
|
||||
expect(copyToClipboard).toHaveLength(1);
|
||||
expect(copyToClipboard.prop('text')).toEqual('foo');
|
||||
expect(copyToClipboard.prop('onCopy')).toEqual(onCopy);
|
||||
expect(icon).toHaveLength(1);
|
||||
expect(icon.prop('icon')).toEqual(copyIcon);
|
||||
expect(icon.prop('className')).toEqual('ms-2 copy-to-clipboard-icon');
|
||||
it.each([
|
||||
['text'],
|
||||
['bar'],
|
||||
['baz'],
|
||||
])('copies content to clipboard when clicked', async (text) => {
|
||||
const { user, container } = setUp(text);
|
||||
|
||||
expect(onCopy).not.toHaveBeenCalled();
|
||||
container.firstElementChild && await user.click(container.firstElementChild);
|
||||
expect(onCopy).toHaveBeenCalledWith(text, false);
|
||||
});
|
||||
});
|
||||
|
|
21
test/utils/__snapshots__/CopyToClipboardIcon.test.tsx.snap
Normal file
21
test/utils/__snapshots__/CopyToClipboardIcon.test.tsx.snap
Normal file
|
@ -0,0 +1,21 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`<CopyToClipboardIcon /> wraps expected components 1`] = `
|
||||
<div>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class="svg-inline--fa fa-copy ms-2 copy-to-clipboard-icon"
|
||||
data-icon="copy"
|
||||
data-prefix="far"
|
||||
focusable="false"
|
||||
role="img"
|
||||
viewBox="0 0 512 512"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M502.6 70.63l-61.25-61.25C435.4 3.371 427.2 0 418.7 0H255.1c-35.35 0-64 28.66-64 64l.0195 256C192 355.4 220.7 384 256 384h192c35.2 0 64-28.8 64-64V93.25C512 84.77 508.6 76.63 502.6 70.63zM464 320c0 8.836-7.164 16-16 16H255.1c-8.838 0-16-7.164-16-16L239.1 64.13c0-8.836 7.164-16 16-16h128L384 96c0 17.67 14.33 32 32 32h47.1V320zM272 448c0 8.836-7.164 16-16 16H63.1c-8.838 0-16-7.164-16-16L47.98 192.1c0-8.836 7.164-16 16-16H160V128H63.99c-35.35 0-64 28.65-64 64l.0098 256C.002 483.3 28.66 512 64 512h192c35.2 0 64-28.8 64-64v-32h-47.1L272 448z"
|
||||
fill="currentColor"
|
||||
/>
|
||||
</svg>
|
||||
</div>
|
||||
`;
|
Loading…
Reference in a new issue