From 10037d844eff87a3c510069f57f8c16fc812f2fe Mon Sep 17 00:00:00 2001 From: Predrag Klepic <60631598+Klepic95@users.noreply.github.com> Date: Wed, 19 Jul 2023 10:13:04 +0200 Subject: [PATCH] [Query Copilot] Improving test coverage (#1539) * Improving test coverage * Not leaving empty functions * Additional test editing * Correction of the unit test * Changes made so the tests work correctly * removing problematic tests --------- Co-authored-by: Predrag Klepic --- .../QueryCopilot/Popup/CopyPopup.test.tsx | 41 ++++++- .../QueryCopilot/Popup/DeletePopup.test.tsx | 106 +++++++++++++++++- .../__snapshots__/CopyPopup.test.tsx.snap | 2 + .../__snapshots__/DeletePopup.test.tsx.snap | 78 +++++++++++++ .../SamplePrompts/SamplePrompts.test.tsx | 23 ++-- 5 files changed, 231 insertions(+), 19 deletions(-) diff --git a/src/Explorer/QueryCopilot/Popup/CopyPopup.test.tsx b/src/Explorer/QueryCopilot/Popup/CopyPopup.test.tsx index 63337268b..0414983a9 100644 --- a/src/Explorer/QueryCopilot/Popup/CopyPopup.test.tsx +++ b/src/Explorer/QueryCopilot/Popup/CopyPopup.test.tsx @@ -1,11 +1,48 @@ +import { IconButton } from "@fluentui/react"; import { shallow } from "enzyme"; import React from "react"; -import { any } from "underscore"; import { CopyPopup } from "./CopyPopup"; describe("Copy Popup snapshot test", () => { + const setShowCopyPopupMock = jest.fn(); it("should render when showCopyPopup is true", () => { - const wrapper = shallow( any} />); + const wrapper = shallow(); + expect(wrapper.exists()).toBe(true); + expect(wrapper.prop("setShowCopyPopup")).toBeUndefined(); expect(wrapper).toMatchSnapshot(); }); + + it("should render when showCopyPopup is false", () => { + const wrapper = shallow(); + expect(wrapper.prop("showCopyPopup")).toBeFalsy(); + expect(wrapper.prop("setShowCopyPopup")).toBeUndefined(); + expect(wrapper).toMatchSnapshot(); + }); + + it("should call setShowCopyPopup(false) when close button is clicked", () => { + const wrapper = shallow(); + + const closeButton = wrapper.find(IconButton); + closeButton.props().onClick?.({} as React.MouseEvent); + + expect(setShowCopyPopupMock).toHaveBeenCalledWith(false); + }); + + it("should have the correct inline styles", () => { + const wrapper = shallow(); + + const stackStyle = wrapper.find("Stack").first().props().style; + + expect(stackStyle).toEqual({ + position: "fixed", + width: 345, + height: 66, + padding: 10, + gap: 5, + top: 75, + right: 20, + background: "#FFFFFF", + boxShadow: "0 2px 6px rgba(0, 0, 0, 0.16)", + }); + }); }); diff --git a/src/Explorer/QueryCopilot/Popup/DeletePopup.test.tsx b/src/Explorer/QueryCopilot/Popup/DeletePopup.test.tsx index b14ca69ce..00cac184f 100644 --- a/src/Explorer/QueryCopilot/Popup/DeletePopup.test.tsx +++ b/src/Explorer/QueryCopilot/Popup/DeletePopup.test.tsx @@ -1,19 +1,113 @@ -import { shallow } from "enzyme"; +import { mount, shallow } from "enzyme"; import React from "react"; -import { any } from "underscore"; import { DeletePopup } from "./DeletePopup"; describe("Delete Popup snapshot test", () => { + const setShowDeletePopupMock = jest.fn(); + const setQueryMock = jest.fn(); + const clearFeedbackMock = jest.fn(); + const showFeedbackBarMock = jest.fn(); + it("should render when showDeletePopup is true", () => { const wrapper = shallow( any} - setQuery={() => any} - clearFeedback={() => any} - showFeedbackBar={() => any} + setShowDeletePopup={setShowDeletePopupMock} + setQuery={setQueryMock} + clearFeedback={clearFeedbackMock} + showFeedbackBar={showFeedbackBarMock} /> ); + expect(wrapper.find("Modal").prop("isOpen")).toBeTruthy(); expect(wrapper).toMatchSnapshot(); }); + + it("should not render when showDeletePopup is false", () => { + const wrapper = shallow( + + ); + expect(wrapper.props().children.props.showDeletePopup).toBeFalsy(); + expect(wrapper).toMatchSnapshot(); + }); + + it("should call setQuery with an empty string and setShowDeletePopup(false) when delete button is clicked", () => { + const wrapper = mount( + + ); + + wrapper.find("PrimaryButton").simulate("click"); + + expect(setQueryMock).toHaveBeenCalledWith(""); + expect(setShowDeletePopupMock).toHaveBeenCalledWith(false); + }); + + it("should call setShowDeletePopup(false) when close button is clicked", () => { + const setShowDeletePopupMock = jest.fn(); + const wrapper = mount( + + ); + + wrapper.find("DefaultButton").at(1).simulate("click"); + + expect(setShowDeletePopupMock).toHaveBeenCalledWith(false); + }); + + it("should render the appropriate text content", () => { + const wrapper = shallow( + + ); + + const textContent = wrapper + .find("Text") + .map((text, index) => {text.props().children}); + + expect(textContent).toEqual([ + + Delete code? + , + + This will clear the query from the query builder pane along with all comments and also reset the prompt pane + , + ]); + }); + + it("should have the correct inline style", () => { + const wrapper = shallow( + + ); + + const stackStyle = wrapper.find("Stack[style]").props().style; + + expect(stackStyle).toEqual({ padding: "16px 24px", height: "auto" }); + }); }); diff --git a/src/Explorer/QueryCopilot/Popup/__snapshots__/CopyPopup.test.tsx.snap b/src/Explorer/QueryCopilot/Popup/__snapshots__/CopyPopup.test.tsx.snap index 5f62ca542..2ef797391 100644 --- a/src/Explorer/QueryCopilot/Popup/__snapshots__/CopyPopup.test.tsx.snap +++ b/src/Explorer/QueryCopilot/Popup/__snapshots__/CopyPopup.test.tsx.snap @@ -1,5 +1,7 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP +exports[`Copy Popup snapshot test should render when showCopyPopup is false 1`] = ``; + exports[`Copy Popup snapshot test should render when showCopyPopup is true 1`] = ` + + + + Delete code? + + + + This will clear the query from the query builder pane along with all comments and also reset the prompt pane + + + + Delete + + + Close + + + + +`; + exports[`Delete Popup snapshot test should render when showDeletePopup is true 1`] = ` { - it("should render properly if isSamplePromptsOpen is true", () => { - const sampleProps: SamplePromptsProps = { - isSamplePromptsOpen: true, - setIsSamplePromptsOpen: () => undefined, - setTextBox: () => undefined, - }; + const setTextBoxMock = jest.fn(); + const setIsSamplePromptsOpenMock = jest.fn(); + const sampleProps: SamplePromptsProps = { + isSamplePromptsOpen: true, + setIsSamplePromptsOpen: setIsSamplePromptsOpenMock, + setTextBox: setTextBoxMock, + }; + it("should render properly if isSamplePromptsOpen is true", () => { const wrapper = shallow(); + expect(wrapper).toMatchSnapshot(); }); it("should render properly if isSamplePromptsOpen is false", () => { - const sampleProps: SamplePromptsProps = { - isSamplePromptsOpen: false, - setIsSamplePromptsOpen: () => undefined, - setTextBox: () => undefined, - }; + sampleProps.isSamplePromptsOpen = false; + const wrapper = shallow(); + expect(wrapper).toMatchSnapshot(); }); });