From 16b12ddc76ad62ff84db6959a9bd3ebf427f4967 Mon Sep 17 00:00:00 2001 From: Brian Pedersen Date: Wed, 16 Oct 2019 02:00:05 -0600 Subject: [PATCH] refactor(#204): copyToClipBoard.test, moved test of utility to it's own test --- .../CopyToClipBoard/CopyToClipBoard.test.tsx | 29 ++++------- src/utils/cli-utils.test.ts | 49 +++++++++++++++++++ 2 files changed, 58 insertions(+), 20 deletions(-) create mode 100644 src/utils/cli-utils.test.ts diff --git a/src/components/CopyToClipBoard/CopyToClipBoard.test.tsx b/src/components/CopyToClipBoard/CopyToClipBoard.test.tsx index fe530dd..d837055 100644 --- a/src/components/CopyToClipBoard/CopyToClipBoard.test.tsx +++ b/src/components/CopyToClipBoard/CopyToClipBoard.test.tsx @@ -1,38 +1,27 @@ import React from 'react'; import { mount, ReactWrapper } from 'enzyme'; +import { copyToClipBoardUtility } from '../../utils/cli-utils'; + import CopyToClipBoard from './CopyToClipBoard'; import { CopyIcon } from './styles'; +jest.mock('../../utils/cli-utils'); + describe(' component', () => { let wrapper: ReactWrapper; + const copyText = 'copy text'; beforeEach(() => { - wrapper = mount(); + wrapper = mount(); }); test('render the component', () => { expect(wrapper.html()).toMatchSnapshot(); }); - test('should call the DOM APIs for copy to clipboard utility', () => { - const event = { - preventDefault: jest.fn(), - }; - - // @ts-ignore: Property 'getSelection' does not exist on type 'Global'. - global.getSelection = jest.fn(() => ({ - removeAllRanges: () => {}, - addRange: () => {}, - })); - - // @ts-ignore: Property 'document/getSelection' does not exist on type 'Global'. - const { document, getSelection } = global; - - wrapper.find(CopyIcon).simulate('click', event); - expect(event.preventDefault).toHaveBeenCalled(); - expect(document.createRange).toHaveBeenCalled(); - expect(getSelection).toHaveBeenCalled(); - expect(document.execCommand).toHaveBeenCalledWith('copy'); + test('should call the copyToClipBoardUtility for copy to clipboard utility', () => { + wrapper.find(CopyIcon).simulate('click'); + expect(copyToClipBoardUtility).toHaveBeenCalledWith(copyText); }); }); diff --git a/src/utils/cli-utils.test.ts b/src/utils/cli-utils.test.ts new file mode 100644 index 0000000..1fbc255 --- /dev/null +++ b/src/utils/cli-utils.test.ts @@ -0,0 +1,49 @@ +import { SyntheticEvent } from 'react'; + +import { copyToClipBoardUtility } from './cli-utils'; + +describe('copyToClipBoardUtility', () => { + let originalGetSelection; + + const mockGetSelectionResult = { + removeAllRanges: jest.fn(), + addRange: jest.fn(), + }; + beforeEach(() => { + originalGetSelection = window.getSelection; + + window.getSelection = jest.fn().mockReturnValue(mockGetSelectionResult); + }); + afterEach(() => { + window.getSelection = originalGetSelection; + jest.restoreAllMocks(); + }); + + test('should call the DOM APIs', () => { + // Given + const testEvent: { preventDefault: Function } = { + preventDefault: jest.fn(), + }; + const testCopy = 'copy text'; + const spys = { + createElement: jest.spyOn(document, 'createElement'), + execCommand: jest.spyOn(document, 'execCommand'), + appendChild: jest.spyOn(document.body, 'appendChild'), + removeChild: jest.spyOn(document.body, 'removeChild'), + }; + const expectedDiv = document.createElement('div'); + expectedDiv.innerText = testCopy; + + // When + const copyFunc = copyToClipBoardUtility(testCopy); + copyFunc(testEvent as SyntheticEvent); + + // Then + expect(mockGetSelectionResult.removeAllRanges).toHaveBeenCalledWith(); + expect(mockGetSelectionResult.addRange).toHaveBeenCalled(); + expect(spys.createElement).toHaveBeenCalledWith('div'); + expect(spys.appendChild).toHaveBeenCalledWith(expectedDiv); + expect(spys.execCommand).toHaveBeenCalledWith('copy'); + expect(spys.removeChild).toHaveBeenCalledWith(expectedDiv); + }); +});