diff --git a/package-lock.json b/package-lock.json
index 0a05d1161..be9e9f2e4 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -164,6 +164,7 @@
"jest": "26.6.3",
"jest-canvas-mock": "2.3.1",
"jest-playwright-preset": "1.5.1",
+ "jest-react-hooks-shallow": "1.5.1",
"jest-trx-results-processor": "0.0.7",
"less": "3.8.1",
"less-loader": "4.1.0",
@@ -19578,6 +19579,16 @@
"node": ">=8.9.0"
}
},
+ "node_modules/jest-react-hooks-shallow": {
+ "version": "1.5.1",
+ "resolved": "https://msazure.pkgs.visualstudio.com/_packaging/AzurePortal/npm/registry/jest-react-hooks-shallow/-/jest-react-hooks-shallow-1.5.1.tgz",
+ "integrity": "sha1-1SI4EGG7nf9WcfhLBT0LPxy+N/k=",
+ "dev": true,
+ "license": "ISC",
+ "dependencies": {
+ "react": "^16.8.0"
+ }
+ },
"node_modules/jest-regex-util": {
"version": "24.9.0",
"resolved": "https://registry.npmjs.org/jest-regex-util/-/jest-regex-util-24.9.0.tgz",
@@ -48608,6 +48619,15 @@
}
}
},
+ "jest-react-hooks-shallow": {
+ "version": "1.5.1",
+ "resolved": "https://msazure.pkgs.visualstudio.com/_packaging/AzurePortal/npm/registry/jest-react-hooks-shallow/-/jest-react-hooks-shallow-1.5.1.tgz",
+ "integrity": "sha1-1SI4EGG7nf9WcfhLBT0LPxy+N/k=",
+ "dev": true,
+ "requires": {
+ "react": "^16.8.0"
+ }
+ },
"jest-regex-util": {
"version": "24.9.0",
"resolved": "https://registry.npmjs.org/jest-regex-util/-/jest-regex-util-24.9.0.tgz",
diff --git a/package.json b/package.json
index fd01978f6..db137bd57 100644
--- a/package.json
+++ b/package.json
@@ -160,6 +160,7 @@
"jest": "26.6.3",
"jest-canvas-mock": "2.3.1",
"jest-playwright-preset": "1.5.1",
+ "jest-react-hooks-shallow": "1.5.1",
"jest-trx-results-processor": "0.0.7",
"less": "3.8.1",
"less-loader": "4.1.0",
@@ -232,4 +233,4 @@
"prettier": {
"printWidth": 120
}
-}
\ No newline at end of file
+}
diff --git a/src/Explorer/QueryCopilot/Modal/WelcomeModal.test.tsx b/src/Explorer/QueryCopilot/Modal/WelcomeModal.test.tsx
new file mode 100644
index 000000000..63dc8af04
--- /dev/null
+++ b/src/Explorer/QueryCopilot/Modal/WelcomeModal.test.tsx
@@ -0,0 +1,32 @@
+import { shallow } from "enzyme";
+import { withHooks } from "jest-react-hooks-shallow";
+import React from "react";
+import { WelcomeModal } from "./WelcomeModal";
+
+describe("Query Copilot Carousel snapshot test", () => {
+ it("should render when isOpen is true", () => {
+ withHooks(() => {
+ const spy = jest.spyOn(localStorage, "setItem");
+ spy.mockClear();
+ const wrapper = shallow();
+
+ expect(wrapper.props().children.props.isOpen).toBeTruthy();
+ expect(wrapper).toMatchSnapshot();
+
+ expect(spy).toHaveBeenCalledTimes(1);
+ expect(spy).toHaveBeenLastCalledWith("hideWelcomeModal", "true");
+ });
+ });
+ it("should not render when isOpen is false", () => {
+ withHooks(() => {
+ const spy = jest.spyOn(localStorage, "setItem");
+ spy.mockClear();
+ const wrapper = shallow();
+
+ expect(wrapper.props().children.props.isOpen).toBeFalsy();
+
+ expect(spy).not.toHaveBeenCalled();
+ expect(spy.mock.instances.length).toBe(0);
+ });
+ });
+});
diff --git a/src/Explorer/QueryCopilot/Modal/__snapshots__/WelcomeModal.test.tsx.snap b/src/Explorer/QueryCopilot/Modal/__snapshots__/WelcomeModal.test.tsx.snap
new file mode 100644
index 000000000..f0b77ac4d
--- /dev/null
+++ b/src/Explorer/QueryCopilot/Modal/__snapshots__/WelcomeModal.test.tsx.snap
@@ -0,0 +1,196 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Query Copilot Carousel snapshot test should render when isOpen is true 1`] = `
+
+
+
+
+
+
+
+
+
+
+
+
+ Preview
+
+
+
+
+
+
+
+
+
+
+ Welcome to Copilot in CosmosDB
+
+
+
+
+
+
+
+
+
+ Let copilot do the work for you
+
+
+
+
+
+ Ask Copilot to generate a query by describing the query in your words.
+
+
+ Learn more
+
+
+
+
+
+
+
+
+
+
+ Use your judgement
+
+
+
+
+
+ AI-generated content can have mistakes. Make sure it’s accurate and appropriate before using it.
+
+
+ Read preview terms
+
+
+
+
+
+
+
+
+
+
+ Copilot currently works only a sample database
+
+
+
+
+
+ Copilot is setup on a sample database we have configured for you at no cost
+
+
+ Learn more
+
+
+
+
+
+
+
+ Try Copilot
+
+
+
+
+
+
+`;
diff --git a/src/setupTests.ts b/src/setupTests.ts
index fa8564a3a..35af8a5a9 100644
--- a/src/setupTests.ts
+++ b/src/setupTests.ts
@@ -1,7 +1,8 @@
+import { initializeIcons } from "@fluentui/react";
import { configure } from "enzyme";
import Adapter from "enzyme-adapter-react-16";
import "jest-canvas-mock";
-import { initializeIcons } from "@fluentui/react";
+import enableHooks from "jest-react-hooks-shallow";
import { TextDecoder, TextEncoder } from "util";
configure({ adapter: new Adapter() });
initializeIcons();
@@ -10,6 +11,30 @@ if (typeof window.URL.createObjectURL === "undefined") {
Object.defineProperty(window.URL, "createObjectURL", { value: () => {} });
}
+enableHooks(jest, { dontMockByDefault: true });
+
+const localStorageMock = (function () {
+ let store: { [key: string]: string } = {};
+ return {
+ getItem: function (key: string) {
+ return store[key] || null;
+ },
+ setItem: function (key: string, value: string) {
+ store[key] = value.toString();
+ },
+ removeItem: function (key: string) {
+ delete store[key];
+ },
+ clear: function () {
+ store = {};
+ },
+ };
+})();
+
+Object.defineProperty(window, "localStorage", {
+ value: localStorageMock,
+});
+
// TODO Remove when jquery and documentdbclient SDK are removed
(window).$ = (window).jQuery = require("jquery");
(global).$ = (global).$.jQuery = require("jquery");