mirror of
https://github.com/Azure/cosmos-explorer.git
synced 2024-11-24 22:46:40 +00:00
[Query Copilot] Add unit tests for Welcome Modal (#1535)
This commit is contained in:
v-darkora
GitHub
parent
53cd78452b
commit
de3e56bb99
20
package-lock.json
generated
20
package-lock.json
generated
@ -164,6 +164,7 @@
|
|||||||
"jest": "26.6.3",
|
"jest": "26.6.3",
|
||||||
"jest-canvas-mock": "2.3.1",
|
"jest-canvas-mock": "2.3.1",
|
||||||
"jest-playwright-preset": "1.5.1",
|
"jest-playwright-preset": "1.5.1",
|
||||||
|
"jest-react-hooks-shallow": "1.5.1",
|
||||||
"jest-trx-results-processor": "0.0.7",
|
"jest-trx-results-processor": "0.0.7",
|
||||||
"less": "3.8.1",
|
"less": "3.8.1",
|
||||||
"less-loader": "4.1.0",
|
"less-loader": "4.1.0",
|
||||||
@ -19578,6 +19579,16 @@
|
|||||||
"node": ">=8.9.0"
|
"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": {
|
"node_modules/jest-regex-util": {
|
||||||
"version": "24.9.0",
|
"version": "24.9.0",
|
||||||
"resolved": "https://registry.npmjs.org/jest-regex-util/-/jest-regex-util-24.9.0.tgz",
|
"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": {
|
"jest-regex-util": {
|
||||||
"version": "24.9.0",
|
"version": "24.9.0",
|
||||||
"resolved": "https://registry.npmjs.org/jest-regex-util/-/jest-regex-util-24.9.0.tgz",
|
"resolved": "https://registry.npmjs.org/jest-regex-util/-/jest-regex-util-24.9.0.tgz",
|
||||||
|
|||||||
@ -160,6 +160,7 @@
|
|||||||
"jest": "26.6.3",
|
"jest": "26.6.3",
|
||||||
"jest-canvas-mock": "2.3.1",
|
"jest-canvas-mock": "2.3.1",
|
||||||
"jest-playwright-preset": "1.5.1",
|
"jest-playwright-preset": "1.5.1",
|
||||||
|
"jest-react-hooks-shallow": "1.5.1",
|
||||||
"jest-trx-results-processor": "0.0.7",
|
"jest-trx-results-processor": "0.0.7",
|
||||||
"less": "3.8.1",
|
"less": "3.8.1",
|
||||||
"less-loader": "4.1.0",
|
"less-loader": "4.1.0",
|
||||||
|
|||||||
32
src/Explorer/QueryCopilot/Modal/WelcomeModal.test.tsx
Normal file
32
src/Explorer/QueryCopilot/Modal/WelcomeModal.test.tsx
Normal file
@ -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(<WelcomeModal visible={true} />);
|
||||||
|
|
||||||
|
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(<WelcomeModal visible={false} />);
|
||||||
|
|
||||||
|
expect(wrapper.props().children.props.isOpen).toBeFalsy();
|
||||||
|
|
||||||
|
expect(spy).not.toHaveBeenCalled();
|
||||||
|
expect(spy.mock.instances.length).toBe(0);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
@ -0,0 +1,196 @@
|
|||||||
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||||
|
|
||||||
|
exports[`Query Copilot Carousel snapshot test should render when isOpen is true 1`] = `
|
||||||
|
<Fragment>
|
||||||
|
<Modal
|
||||||
|
isBlocking={false}
|
||||||
|
isOpen={true}
|
||||||
|
onDismiss={[Function]}
|
||||||
|
>
|
||||||
|
<Stack
|
||||||
|
className="modalContentPadding"
|
||||||
|
>
|
||||||
|
<Stack
|
||||||
|
horizontal={true}
|
||||||
|
>
|
||||||
|
<Stack
|
||||||
|
grow={4}
|
||||||
|
horizontal={true}
|
||||||
|
horizontalAlign="end"
|
||||||
|
>
|
||||||
|
<StackItem>
|
||||||
|
<Image
|
||||||
|
src=""
|
||||||
|
/>
|
||||||
|
</StackItem>
|
||||||
|
</Stack>
|
||||||
|
<Stack
|
||||||
|
className="exitPadding"
|
||||||
|
grow={1}
|
||||||
|
horizontal={true}
|
||||||
|
horizontalAlign="end"
|
||||||
|
verticalAlign="start"
|
||||||
|
>
|
||||||
|
<StackItem
|
||||||
|
className="previewMargin"
|
||||||
|
>
|
||||||
|
<Text
|
||||||
|
className="preview"
|
||||||
|
>
|
||||||
|
Preview
|
||||||
|
</Text>
|
||||||
|
</StackItem>
|
||||||
|
<StackItem>
|
||||||
|
<CustomizedIconButton
|
||||||
|
ariaLabel="Exit"
|
||||||
|
className="exitIcon"
|
||||||
|
iconProps={
|
||||||
|
Object {
|
||||||
|
"iconName": "Cancel",
|
||||||
|
}
|
||||||
|
}
|
||||||
|
onClick={[Function]}
|
||||||
|
title="Exit"
|
||||||
|
/>
|
||||||
|
</StackItem>
|
||||||
|
</Stack>
|
||||||
|
</Stack>
|
||||||
|
<Stack
|
||||||
|
horizontalAlign="center"
|
||||||
|
>
|
||||||
|
<StackItem
|
||||||
|
align="center"
|
||||||
|
>
|
||||||
|
<Text
|
||||||
|
className="title bold"
|
||||||
|
>
|
||||||
|
Welcome to Copilot in CosmosDB
|
||||||
|
</Text>
|
||||||
|
</StackItem>
|
||||||
|
<StackItem
|
||||||
|
align="center"
|
||||||
|
className="text"
|
||||||
|
>
|
||||||
|
<Stack
|
||||||
|
horizontal={true}
|
||||||
|
>
|
||||||
|
<StackItem
|
||||||
|
align="start"
|
||||||
|
className="imageTextPadding"
|
||||||
|
>
|
||||||
|
<Image
|
||||||
|
src=""
|
||||||
|
/>
|
||||||
|
</StackItem>
|
||||||
|
<StackItem
|
||||||
|
align="start"
|
||||||
|
>
|
||||||
|
<Text
|
||||||
|
className="bold"
|
||||||
|
>
|
||||||
|
Let copilot do the work for you
|
||||||
|
<br />
|
||||||
|
</Text>
|
||||||
|
</StackItem>
|
||||||
|
</Stack>
|
||||||
|
<Text>
|
||||||
|
Ask Copilot to generate a query by describing the query in your words.
|
||||||
|
<br />
|
||||||
|
<StyledLinkBase
|
||||||
|
href=""
|
||||||
|
>
|
||||||
|
Learn more
|
||||||
|
</StyledLinkBase>
|
||||||
|
</Text>
|
||||||
|
</StackItem>
|
||||||
|
<StackItem
|
||||||
|
align="center"
|
||||||
|
className="text"
|
||||||
|
>
|
||||||
|
<Stack
|
||||||
|
horizontal={true}
|
||||||
|
>
|
||||||
|
<StackItem
|
||||||
|
align="start"
|
||||||
|
className="imageTextPadding"
|
||||||
|
>
|
||||||
|
<Image
|
||||||
|
src=""
|
||||||
|
/>
|
||||||
|
</StackItem>
|
||||||
|
<StackItem
|
||||||
|
align="start"
|
||||||
|
>
|
||||||
|
<Text
|
||||||
|
className="bold"
|
||||||
|
>
|
||||||
|
Use your judgement
|
||||||
|
<br />
|
||||||
|
</Text>
|
||||||
|
</StackItem>
|
||||||
|
</Stack>
|
||||||
|
<Text>
|
||||||
|
AI-generated content can have mistakes. Make sure it’s accurate and appropriate before using it.
|
||||||
|
<br />
|
||||||
|
<StyledLinkBase
|
||||||
|
href=""
|
||||||
|
>
|
||||||
|
Read preview terms
|
||||||
|
</StyledLinkBase>
|
||||||
|
</Text>
|
||||||
|
</StackItem>
|
||||||
|
<StackItem
|
||||||
|
align="center"
|
||||||
|
className="text"
|
||||||
|
>
|
||||||
|
<Stack
|
||||||
|
horizontal={true}
|
||||||
|
>
|
||||||
|
<StackItem
|
||||||
|
align="start"
|
||||||
|
className="imageTextPadding"
|
||||||
|
>
|
||||||
|
<Image
|
||||||
|
src=""
|
||||||
|
/>
|
||||||
|
</StackItem>
|
||||||
|
<StackItem
|
||||||
|
align="start"
|
||||||
|
>
|
||||||
|
<Text
|
||||||
|
className="bold"
|
||||||
|
>
|
||||||
|
Copilot currently works only a sample database
|
||||||
|
<br />
|
||||||
|
</Text>
|
||||||
|
</StackItem>
|
||||||
|
</Stack>
|
||||||
|
<Text>
|
||||||
|
Copilot is setup on a sample database we have configured for you at no cost
|
||||||
|
<br />
|
||||||
|
<StyledLinkBase
|
||||||
|
href=""
|
||||||
|
>
|
||||||
|
Learn more
|
||||||
|
</StyledLinkBase>
|
||||||
|
</Text>
|
||||||
|
</StackItem>
|
||||||
|
</Stack>
|
||||||
|
<Stack
|
||||||
|
className="buttonPadding"
|
||||||
|
>
|
||||||
|
<StackItem
|
||||||
|
align="center"
|
||||||
|
>
|
||||||
|
<CustomizedPrimaryButton
|
||||||
|
className="tryButton"
|
||||||
|
onClick={[Function]}
|
||||||
|
>
|
||||||
|
Try Copilot
|
||||||
|
</CustomizedPrimaryButton>
|
||||||
|
</StackItem>
|
||||||
|
</Stack>
|
||||||
|
</Stack>
|
||||||
|
</Modal>
|
||||||
|
</Fragment>
|
||||||
|
`;
|
||||||
@ -1,7 +1,8 @@
|
|||||||
|
import { initializeIcons } from "@fluentui/react";
|
||||||
import { configure } from "enzyme";
|
import { configure } from "enzyme";
|
||||||
import Adapter from "enzyme-adapter-react-16";
|
import Adapter from "enzyme-adapter-react-16";
|
||||||
import "jest-canvas-mock";
|
import "jest-canvas-mock";
|
||||||
import { initializeIcons } from "@fluentui/react";
|
import enableHooks from "jest-react-hooks-shallow";
|
||||||
import { TextDecoder, TextEncoder } from "util";
|
import { TextDecoder, TextEncoder } from "util";
|
||||||
configure({ adapter: new Adapter() });
|
configure({ adapter: new Adapter() });
|
||||||
initializeIcons();
|
initializeIcons();
|
||||||
@ -10,6 +11,30 @@ if (typeof window.URL.createObjectURL === "undefined") {
|
|||||||
Object.defineProperty(window.URL, "createObjectURL", { value: () => {} });
|
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
|
// TODO Remove when jquery and documentdbclient SDK are removed
|
||||||
(<any>window).$ = (<any>window).jQuery = require("jquery");
|
(<any>window).$ = (<any>window).jQuery = require("jquery");
|
||||||
(<any>global).$ = (<any>global).$.jQuery = require("jquery");
|
(<any>global).$ = (<any>global).$.jQuery = require("jquery");
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user