github.com/freiheit-com/kuberpult@v1.24.2-0.20240328135542-315d5630abe6/services/frontend-service/src/ui/components/button/ExpandButton.test.tsx (about) 1 /*This file is part of kuberpult. 2 3 Kuberpult is free software: you can redistribute it and/or modify 4 it under the terms of the Expat(MIT) License as published by 5 the Free Software Foundation. 6 7 Kuberpult is distributed in the hope that it will be useful, 8 but WITHOUT ANY WARRANTY; without even the implied warranty of 9 MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 10 MIT License for more details. 11 12 You should have received a copy of the MIT License 13 along with kuberpult. If not, see <https://directory.fsf.org/wiki/License:Expat>. 14 15 Copyright 2023 freiheit.com*/ 16 import React from 'react'; 17 import { act, render } from '@testing-library/react'; 18 import { elementQuerySelectorSafe } from '../../../setupTests'; 19 import { ExpandButton, ExpandButtonProps } from './ExpandButton'; 20 21 describe('ExpandButton', () => { 22 const mySubmitSpy = jest.fn(() => {}); 23 const defaultProps: ExpandButtonProps = { 24 onClickSubmit: mySubmitSpy, 25 defaultButtonLabel: 'default-button', 26 }; 27 28 const getNode = (): JSX.Element => <ExpandButton {...defaultProps} />; 29 30 const getWrapper = () => render(getNode()); 31 32 type TestData = { 33 name: string; 34 props: Partial<ExpandButtonProps>; 35 // if we click these buttons... 36 clickThis: string[]; 37 // then we expect the popup to show up: 38 expectExpanded: boolean; 39 expectSubmitCalledTimes: number; 40 expectSubmitCalledWith: Object; // only relevant if expectCalledTimes != 0 41 }; 42 43 const data: TestData[] = [ 44 { 45 name: 'click expand once', 46 props: {}, 47 clickThis: ['.button-expand'], 48 expectExpanded: true, 49 expectSubmitCalledTimes: 0, 50 expectSubmitCalledWith: {}, 51 }, 52 { 53 name: 'click expand twice', 54 props: {}, 55 clickThis: ['.button-expand', '.button-expand'], 56 expectExpanded: false, 57 expectSubmitCalledTimes: 0, 58 expectSubmitCalledWith: {}, 59 }, 60 { 61 name: 'click Main button', 62 props: {}, 63 clickThis: ['.button-main'], 64 expectExpanded: false, 65 expectSubmitCalledTimes: 1, 66 expectSubmitCalledWith: true, 67 }, 68 { 69 name: 'click expand, then alternative button', 70 props: {}, 71 clickThis: ['.button-expand', '.button-popup'], 72 expectExpanded: true, 73 expectSubmitCalledTimes: 1, 74 expectSubmitCalledWith: false, 75 }, 76 ]; 77 78 describe.each(data)(`Renders a navigation item with selected`, (testcase) => { 79 it(testcase.name, () => { 80 mySubmitSpy.mockReset(); 81 const { container } = getWrapper(); 82 83 expect(document.getElementsByClassName('expand-dialog').length).toBe(0); 84 expect(mySubmitSpy).toHaveBeenCalledTimes(0); 85 86 testcase.clickThis.forEach((clickMe: string) => { 87 const button = elementQuerySelectorSafe(container, clickMe); 88 act(() => { 89 button.click(); 90 }); 91 }); 92 93 const expectedCount = testcase.expectExpanded ? 1 : 0; 94 expect(document.getElementsByClassName('expand-dialog').length).toBe(expectedCount); 95 96 expect(mySubmitSpy).toHaveBeenCalledTimes(testcase.expectSubmitCalledTimes); 97 if (testcase.expectSubmitCalledTimes !== 0) { 98 expect(mySubmitSpy).toHaveBeenCalledWith(testcase.expectSubmitCalledWith); 99 } 100 }); 101 }); 102 });