UNPKG

@unleashit/modal

Version:

Responsive modal component for React with custom header, footer and more.

8 lines (6 loc) 4.62 kB
import { b } from '../chunk-723UIZTO.mjs'; import '../chunk-VRFFRWRJ.mjs'; import { shallow, mount } from 'enzyme'; import n from 'react'; import { act } from 'react-dom/test-utils'; var d=()=>({onClose:jest.fn(),isOpen:!0}),s=n.createElement("div",null,"Test text for modal.");describe("<Modal />",()=>{let e,o;beforeEach(()=>{o=d(),e=shallow(n.createElement(b,{...o},s));}),it("renders when isOpen property is true",()=>{expect(e.find(".unl-modal__overlay")).toHaveLength(1),expect(e).toMatchSnapshot(),delete o.isOpen,e=shallow(n.createElement(b,{...o},s)),expect(e.find(".unl-modal__overlay")).toHaveLength(0);}),it("renders its children",()=>{let t=e.find(".unl-modal__body").children();expect(t.matchesElement(s)).toEqual(!0);}),it("renders the correct size class according to size prop",()=>{expect(e.find(".unl-modal__child--medium")).toHaveLength(1),expect(e.find(".unl-modal__child--large")).toHaveLength(0),o={...d(),size:"large"},e=shallow(n.createElement(b,{...o},s)),expect(e.find(".unl-modal__child--large")).toHaveLength(1),expect(e.find(".unl-modal__child--medium")).toHaveLength(0);}),it("displays custom header component when provided",async()=>{o={...d(),header:()=>n.createElement("div",null,"Test Header")},e=shallow(n.createElement(b,{...o},s));let t=e.find("header").dive();expect(t.text()).toEqual("Test Header");}),it("displays default header component when string is provided",async()=>{o={...d(),header:"Test Header"},e=shallow(n.createElement(b,{...o},s));let t=e.find("ModalHeader").dive();expect(t.find("h3").text()).toEqual("Test Header");}),it("displays custom footer component when provided",async()=>{o={...d(),footer:()=>n.createElement("div",null,"Test Footer")},e=shallow(n.createElement(b,{...o},s));let t=e.find("footer").dive();expect(t.text()).toEqual("Test Footer");}),it("displays default footer component when string is provided",async()=>{o={...d(),footer:"Test Footer"},e=shallow(n.createElement(b,{...o},s));let t=e.find("ModalFooter").dive();expect(t.text()).toEqual("Test Footer");}),it("executes the onClose prop when closed",async()=>{e.find(".unl-modal__close-btn").simulate("click"),expect(o.onClose).toHaveBeenCalledTimes(1),e=shallow(n.createElement(b,{isOpen:!0},s)),e.find(".unl-modal__close-btn").simulate("click"),expect(o.onClose).toHaveBeenCalledTimes(1);}),it("executes the onClose prop when overlay is clicked",async()=>{let t=e.find(".unl-modal__overlay"),c=e.find(".unl-modal__body"),r={stopPropagation:()=>{},target:{getAttribute:()=>"data-modal"}};t.simulate("click",r),c.simulate("click",r),expect(o.onClose).toHaveBeenCalledTimes(1),o={...d(),closeOnOverlayClick:!1},e=shallow(n.createElement(b,{...o},s)),e.find(".unl-modal__overlay").simulate("click",r),expect(o.onClose).toHaveBeenCalledTimes(0);}),it.skip("executes the onClose prop when escape key is pressed",async()=>{let t=(c,r)=>c==="keyup"&&r({key:"Escape"});jest.spyOn(document,"addEventListener").mockImplementation(t),e=mount(n.createElement(b,{...o},s)),expect(o.onClose).toHaveBeenCalledTimes(1);}),it("adds overlay color when provided",async()=>{o={...d(),overlayColor:"red"},e=shallow(n.createElement(b,{...o},s));let t=e.find(".unl-modal__overlay");expect(t.prop("style").backgroundColor).toEqual("red");}),it("show/hide the close button",async()=>{let t=e.find(".unl-modal__close-btn");expect(t).toHaveLength(1),o={...d(),closeBtn:!1},e=shallow(n.createElement(b,{...o},s)),t=e.find(".unl-modal__close-btn"),expect(t).toHaveLength(0);}),it("displays animation classes after timeouts",async()=>{jest.useFakeTimers();let t=e.find(".unl-modal__child--in");expect(t).toHaveLength(1),e=mount(n.createElement(b,{...o},s)),e.setProps({isOpen:!1}),expect(e.find(".unl-modal__child")).toHaveLength(1),expect(e.find(".unl-modal__child--in")).toHaveLength(1),act(()=>{jest.runAllTimers();}),e.update(),expect(e.find(".unl-modal__child")).toHaveLength(0),expect(e.find(".unl-modal__child--in")).toHaveLength(0);}),it("with animationSupport set to false",async()=>{o={...d(),animationSupport:!1},e=mount(n.createElement(b,{...o},s)),expect(e.find(".unl-modal__child")).toHaveLength(1),expect(e.find(".unl-modal__child--in")).toHaveLength(0),act(()=>{e.setProps({isOpen:!1});}),e.update(),expect(e.find(".unl-modal__child")).toHaveLength(0);}),it("clears timeouts on unmount",()=>{jest.useFakeTimers(),jest.spyOn(window,"clearTimeout"),e=mount(n.createElement(b,{...o},s)),act(()=>{jest.runAllTimers();}),act(()=>{e.setProps({isOpen:!1});}),act(()=>{jest.runAllTimers();}),e.update(),act(()=>{e.unmount();}),e.update(),expect(window.clearTimeout).toHaveBeenCalledWith(expect.any(Number));});});