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-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",
|
||||
|
||||
@ -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
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
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 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
|
||||
(<any>window).$ = (<any>window).jQuery = require("jquery");
|
||||
(<any>global).$ = (<any>global).$.jQuery = require("jquery");
|
||||
|
||||
Loading…
Reference in New Issue
Block a user