Add unit test framework for QDS Extension (#23776)

* Query store unit test infra setup

* Update yarn.lock file

* Update tests for utils.ts

* Move test utilities interfaces and functions to its own file

extensions/query-store/src/test/index.ts

@@ -0,0 +1,11 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the Source EULA. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+
+import { getDefaultMochaOptions } from '@microsoft/azdata-test';
+import * as testRunner from '@microsoft/vscodetestcover';
+
+testRunner.configure(getDefaultMochaOptions('Query Store Extension Tests'), { coverConfig: '../../coverConfig.json' });
+
+export = testRunner;

extensions/query-store/src/test/testUtils.ts

@@ -0,0 +1,113 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the Source EULA. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+
+import * as azdata from 'azdata';
+
+export interface TestContext {
+	view: azdata.ModelView;
+	component: azdata.Component
+}
+
+export function createViewContext(): TestContext {
+	let componentBase: azdata.Component = {
+		id: '',
+		updateProperties: () => Promise.resolve(),
+		updateProperty: () => Promise.resolve(),
+		updateCssStyles: undefined!,
+		onValidityChanged: undefined!,
+		valid: true,
+		validate: undefined!,
+		focus: undefined!
+	};
+
+	const components: azdata.Component[] = [];
+	let container = {
+		clearItems: () => { },
+		addItems: () => { },
+		addItem: () => { },
+		removeItem: () => true,
+		insertItem: () => { },
+		items: components,
+		setLayout: () => { },
+		setItemLayout: () => { },
+		updateCssStyles: () => { }
+	};
+
+	let flex: azdata.FlexContainer = Object.assign({}, componentBase, container, {
+	});
+
+	let flexBuilder: azdata.FlexBuilder = Object.assign({}, {
+		component: () => flex,
+		withProperties: () => flexBuilder,
+		withValidation: () => flexBuilder,
+		withItems: () => flexBuilder,
+		withLayout: () => flexBuilder,
+		withProps: () => flexBuilder
+	});
+
+	let split: azdata.SplitViewContainer = Object.assign({}, componentBase, container, {
+	});
+
+	let splitViewBuilder: azdata.SplitViewBuilder = Object.assign({}, {
+		component: () => split,
+		withProperties: () => splitViewBuilder,
+		withValidation: () => splitViewBuilder,
+		withItems: () => splitViewBuilder,
+		withLayout: () => splitViewBuilder,
+		withProps: () => splitViewBuilder
+	});
+
+	let view: azdata.ModelView = {
+		onClosed: undefined!,
+		connection: undefined!,
+		serverInfo: undefined!,
+		valid: true,
+		onValidityChanged: undefined!,
+		validate: undefined!,
+		initializeModel: () => { return Promise.resolve(); },
+		modelBuilder: {
+			listView: undefined!,
+			radioCardGroup: undefined!,
+			navContainer: undefined!,
+			divContainer: undefined!,
+			flexContainer: () => flexBuilder,
+			splitViewContainer: () => splitViewBuilder,
+			card: undefined!,
+			inputBox: () => undefined!,
+			checkBox: undefined!,
+			radioButton: () => undefined!,
+			webView: undefined!,
+			editor: undefined!,
+			diffeditor: undefined!,
+			text: () => undefined!,
+			image: () => undefined!,
+			button: () => undefined!,
+			dropDown: () => undefined!,
+			tree: undefined!,
+			listBox: undefined!,
+			table: undefined!,
+			declarativeTable: () => undefined!,
+			dashboardWidget: undefined!,
+			dashboardWebview: undefined!,
+			formContainer: () => undefined!,
+			groupContainer: undefined!,
+			toolbarContainer: undefined!,
+			loadingComponent: () => undefined!,
+			fileBrowserTree: undefined!,
+			hyperlink: undefined!,
+			tabbedPanel: undefined!,
+			separator: undefined!,
+			propertiesContainer: undefined!,
+			infoBox: undefined!,
+			slider: undefined!,
+			executionPlan: undefined!,
+		}
+	};
+
+	return {
+		view: view,
+		component: componentBase
+	};
+}

extensions/query-store/src/test/utils.test.ts

@@ -0,0 +1,36 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the Source EULA. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+
+import * as azdata from 'azdata';
+import * as should from 'should';
+import { createOneComponentFlexContainer, createTwoComponentFlexContainer, createVerticalSplitView } from '../common/utils';
+import { TestContext, createViewContext } from './testUtils';
+
+let testContext: TestContext;
+
+describe('Test to verify flex container creation util function', () => {
+	beforeEach(() => {
+		testContext = createViewContext();
+	});
+	it('Should create a component as expected with createOneComponentFlexContainer', async () => {
+		let flexContainer: azdata.FlexContainer = await createOneComponentFlexContainer(testContext.view, testContext.component, 'black');
+		should(flexContainer.valid).be.true();
+	});
+
+	it('Should create a component as expected with createTwoComponentFlexContainer with row flow', () => {
+		let flexContainer: azdata.FlexContainer = createTwoComponentFlexContainer(testContext.view, testContext.component, testContext.component, 'row');
+		should(flexContainer.valid).be.true();
+	});
+
+	it('Should create a component as expected with createTwoComponentFlexContainer with column flow', () => {
+		let flexContainer: azdata.FlexContainer = createTwoComponentFlexContainer(testContext.view, testContext.component, testContext.component, 'column');
+		should(flexContainer.valid).be.true();
+	});
+
+	it('Should create a component as expected with createVerticalSplitView', () => {
+		let splitViewContainer: azdata.SplitViewContainer = createVerticalSplitView(testContext.view, testContext.component, testContext.component, 100);
+		should(splitViewContainer.valid).be.true();
+	});
+});