ui_migration feature(vitest) Split allComponents.spec.js for readability using now overrides.js for prop,mock component injection
This commit is contained in:
Antonio Anaya
Antonio Anaya
parent
7e8f0b3957
commit
ffcc7f936b
2 changed files with 191 additions and 198 deletions
|
|
@ -1,7 +1,7 @@
|
|||
import { describe, it, expect, beforeEach, afterEach, afterAll, vi } from "vitest";
|
||||
import { shallowMount, flushPromises } from "@vue/test-utils";
|
||||
import { createTestingPinia } from "@pinia/testing";
|
||||
import { markRaw } from "vue";
|
||||
import { componentOverrides } from "./overrides";
|
||||
|
||||
/**
|
||||
* @file Automated component smoke testing suite.
|
||||
|
|
@ -9,6 +9,7 @@ import { markRaw } from "vue";
|
|||
* shallow mount on each. This acts as a first line of defense to catch
|
||||
* fatal DOM runtime errors, missing dependencies, or script crashes
|
||||
* before they reach production.
|
||||
* @requires overrides.js for component-specific prop and mock configurations.
|
||||
*/
|
||||
|
||||
/** * Vite eagerly grabs all .vue components, explicitly excluding the experimental folder.
|
||||
|
|
@ -20,211 +21,15 @@ const componentModules = import.meta.glob(
|
|||
);
|
||||
|
||||
/**
|
||||
* IMPORTANT
|
||||
* Skip list, add here components that have their own test .spec.js file
|
||||
* @note IMPORTANT: Skip list, add here components that have their own test .spec.js file
|
||||
* */
|
||||
const skipList = ["loggingContent.vue"];
|
||||
|
||||
/**
|
||||
* Map filenames to the specific props or mocks required
|
||||
* Not all components ask for props
|
||||
* If a component has unmet props or global mocks setup.js is set to fail the test
|
||||
**/
|
||||
const componentOverrides = {
|
||||
"serverSpecifiedPropertyControl.vue": {
|
||||
props: {
|
||||
propertyData: {},
|
||||
propertyName: "",
|
||||
thingName: "",
|
||||
},
|
||||
global: {
|
||||
mocks: {
|
||||
wotStore: {
|
||||
thingDescriptions: {
|
||||
test_thing: {
|
||||
properties: {
|
||||
test_property_1: {},
|
||||
test_property_2: {},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
"slideScanContent.vue": {
|
||||
global: {
|
||||
mocks: {
|
||||
wotStore: {
|
||||
thingDescriptions: {
|
||||
test_thing: {
|
||||
properties: {
|
||||
test_property_1: {},
|
||||
test_property_2: {},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
"slideScanControls.vue": {
|
||||
global: {
|
||||
mocks: {
|
||||
wotStore: {
|
||||
thingDescriptions: {
|
||||
test_thing: {
|
||||
properties: {
|
||||
test_property_1: {},
|
||||
test_property_2: {},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
"miniStreamDisplay.vue": {
|
||||
props: { streamId: "testProp" },
|
||||
},
|
||||
"streamContent.vue": {
|
||||
props: { streamId: "testProp" },
|
||||
},
|
||||
"paginateLinks.vue": {
|
||||
props: { totalPages: 5, currentPage: 1 },
|
||||
},
|
||||
"simpleAccordion.vue": {
|
||||
props: { title: "Test Accordion Title" },
|
||||
},
|
||||
"tabContent.vue": {
|
||||
props: { tabID: "tab-1", currentTab: "tab-1" },
|
||||
},
|
||||
"tabIcon.vue": {
|
||||
props: { tabID: "tab-1", currentTab: "tab-1" },
|
||||
},
|
||||
"actionButton.vue": {
|
||||
props: { action: "test-action", thing: "test-thing" },
|
||||
},
|
||||
"actionLogDisplay.vue": {
|
||||
props: { taskStatus: "", log: [] },
|
||||
},
|
||||
"endActionButton.vue": {
|
||||
props: { url: "http://microscope.local/api/v3" },
|
||||
},
|
||||
"endpointButton.vue": {
|
||||
props: { url: "http://microscope.local/api/v3" },
|
||||
},
|
||||
"matrixDisplay.vue": {
|
||||
props: { matrix: [] },
|
||||
},
|
||||
"actionProgressBar.vue": {
|
||||
props: { taskStatus: "" },
|
||||
},
|
||||
"actionStatusModal.vue": {
|
||||
props: {
|
||||
title: "",
|
||||
log: [],
|
||||
canTerminate: true,
|
||||
taskRunning: true,
|
||||
taskStarted: true,
|
||||
taskStatus: "",
|
||||
},
|
||||
},
|
||||
"inputFromSchema.vue": {
|
||||
props: { dataSchema: {} },
|
||||
},
|
||||
|
||||
"propertyControl.vue": {
|
||||
props: {
|
||||
propertyName: "",
|
||||
thingName: "test_thing",
|
||||
dataSchema: {},
|
||||
},
|
||||
|
||||
mocks: {
|
||||
wotStore: {
|
||||
thingDescriptions: {
|
||||
test_thing: {
|
||||
actions: {},
|
||||
properties: {},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
"serverSpecifiedActionButton.vue": {
|
||||
props: {
|
||||
actionData: {},
|
||||
elements: {},
|
||||
propertyData: {},
|
||||
action: "test-action",
|
||||
thing: "test-thing",
|
||||
},
|
||||
},
|
||||
"serverSpecifiedInterface.vue": {
|
||||
props: { elements: [] },
|
||||
},
|
||||
"calibrationWizardTask.vue": {
|
||||
props: { steps: [] },
|
||||
},
|
||||
"singleStepTask.vue": {
|
||||
props: {
|
||||
stepComponent: markRaw({ template: '<div class="dummy"></div>' }),
|
||||
},
|
||||
},
|
||||
"actionTab.vue": {
|
||||
props: {
|
||||
action: "test-action",
|
||||
thing: "test-thing",
|
||||
taskId: "",
|
||||
taskUrl: "",
|
||||
},
|
||||
},
|
||||
"galleryCard.vue": {
|
||||
props: { itemData: {} },
|
||||
},
|
||||
"openSeadragonViewer.vue": {
|
||||
props: {
|
||||
src: "",
|
||||
brightness: 0,
|
||||
contrast: 0,
|
||||
saturation: 0,
|
||||
},
|
||||
},
|
||||
"cameraCalibrationSettings.vue": {
|
||||
props: { cameraUri: "" },
|
||||
},
|
||||
|
||||
"galleryContent.vue": {
|
||||
global: {
|
||||
mocks: {
|
||||
readThingProperty: vi.fn(() => []),
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
"CSMCalibrationSettings.vue": {
|
||||
global: {
|
||||
mocks: {
|
||||
thingDescriptions: {
|
||||
csm: {
|
||||
actions: {},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
/**
|
||||
* Test description this is a fast unit test
|
||||
* The objective of this testing is find early
|
||||
* component loading issues like bad component setups
|
||||
*/
|
||||
|
||||
describe("Unit Test", () => {
|
||||
let wrapper;
|
||||
|
||||
|
|
|
|||
188
webapp/src/tests/unit/overrides.js
Normal file
188
webapp/src/tests/unit/overrides.js
Normal file
|
|
@ -0,0 +1,188 @@
|
|||
import { markRaw } from "vue";
|
||||
|
||||
/**
|
||||
* @file Component-specific overrides for unit testing.
|
||||
* @description Map filenames to the specific props or mocks required
|
||||
* Not all components ask for props
|
||||
* If a component has unmet props or global mocks setup.js is set to fail the test
|
||||
**/
|
||||
export const componentOverrides = {
|
||||
"serverSpecifiedPropertyControl.vue": {
|
||||
props: {
|
||||
propertyData: {},
|
||||
propertyName: "",
|
||||
thingName: "",
|
||||
},
|
||||
global: {
|
||||
mocks: {
|
||||
wotStore: {
|
||||
thingDescriptions: {
|
||||
test_thing: {
|
||||
properties: {
|
||||
test_property_1: {},
|
||||
test_property_2: {},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
"slideScanContent.vue": {
|
||||
global: {
|
||||
mocks: {
|
||||
wotStore: {
|
||||
thingDescriptions: {
|
||||
test_thing: {
|
||||
properties: {
|
||||
test_property_1: {},
|
||||
test_property_2: {},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
"slideScanControls.vue": {
|
||||
global: {
|
||||
mocks: {
|
||||
wotStore: {
|
||||
thingDescriptions: {
|
||||
test_thing: {
|
||||
properties: {
|
||||
test_property_1: {},
|
||||
test_property_2: {},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
"miniStreamDisplay.vue": {
|
||||
props: { streamId: "testProp" },
|
||||
},
|
||||
"streamContent.vue": {
|
||||
props: { streamId: "testProp" },
|
||||
},
|
||||
"paginateLinks.vue": {
|
||||
props: { totalPages: 5, currentPage: 1 },
|
||||
},
|
||||
"simpleAccordion.vue": {
|
||||
props: { title: "Test Accordion Title" },
|
||||
},
|
||||
"tabContent.vue": {
|
||||
props: { tabID: "tab-1", currentTab: "tab-1" },
|
||||
},
|
||||
"tabIcon.vue": {
|
||||
props: { tabID: "tab-1", currentTab: "tab-1" },
|
||||
},
|
||||
"actionButton.vue": {
|
||||
props: { action: "test-action", thing: "test-thing" },
|
||||
},
|
||||
"actionLogDisplay.vue": {
|
||||
props: { taskStatus: "", log: [] },
|
||||
},
|
||||
"endActionButton.vue": {
|
||||
props: { url: "http://microscope.local/api/v3" },
|
||||
},
|
||||
"endpointButton.vue": {
|
||||
props: { url: "http://microscope.local/api/v3" },
|
||||
},
|
||||
"matrixDisplay.vue": {
|
||||
props: { matrix: [] },
|
||||
},
|
||||
"actionProgressBar.vue": {
|
||||
props: { taskStatus: "" },
|
||||
},
|
||||
"actionStatusModal.vue": {
|
||||
props: {
|
||||
title: "",
|
||||
log: [],
|
||||
canTerminate: true,
|
||||
taskRunning: true,
|
||||
taskStarted: true,
|
||||
taskStatus: "",
|
||||
},
|
||||
},
|
||||
"inputFromSchema.vue": {
|
||||
props: { dataSchema: {} },
|
||||
},
|
||||
|
||||
"propertyControl.vue": {
|
||||
props: {
|
||||
propertyName: "",
|
||||
thingName: "test_thing",
|
||||
dataSchema: {},
|
||||
},
|
||||
|
||||
mocks: {
|
||||
wotStore: {
|
||||
thingDescriptions: {
|
||||
test_thing: {
|
||||
actions: {},
|
||||
properties: {},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
"serverSpecifiedActionButton.vue": {
|
||||
props: {
|
||||
actionData: {},
|
||||
elements: {},
|
||||
propertyData: {},
|
||||
action: "test-action",
|
||||
thing: "test-thing",
|
||||
},
|
||||
},
|
||||
"serverSpecifiedInterface.vue": {
|
||||
props: { elements: [] },
|
||||
},
|
||||
"calibrationWizardTask.vue": {
|
||||
props: { steps: [] },
|
||||
},
|
||||
"singleStepTask.vue": {
|
||||
props: {
|
||||
stepComponent: markRaw({ template: '<div class="dummy"></div>' }),
|
||||
},
|
||||
},
|
||||
"actionTab.vue": {
|
||||
props: {
|
||||
action: "test-action",
|
||||
thing: "test-thing",
|
||||
taskId: "",
|
||||
taskUrl: "",
|
||||
},
|
||||
},
|
||||
"galleryCard.vue": {
|
||||
props: { itemData: {} },
|
||||
},
|
||||
"openSeadragonViewer.vue": {
|
||||
props: {
|
||||
src: "",
|
||||
brightness: 0,
|
||||
contrast: 0,
|
||||
saturation: 0,
|
||||
},
|
||||
},
|
||||
"cameraCalibrationSettings.vue": {
|
||||
props: { cameraUri: "" },
|
||||
},
|
||||
|
||||
"CSMCalibrationSettings.vue": {
|
||||
global: {
|
||||
mocks: {
|
||||
thingDescriptions: {
|
||||
csm: {
|
||||
actions: {},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
Loading…
Add table
Add a link
Reference in a new issue