mirror of
https://github.com/nasa/openmct.git
synced 2024-12-18 20:57:53 +00:00
chore: remove vue/compat and complete Vue 3 migration (#7133)
* chore: remove custom `compatConfig` settings * chore: remove `vue-compat` and adjust webpack config * chore: explicitly define Vue feature flags * fix: `_data` property moved to `_.data` * fix(e2e): revert to original test procedures * refactor: replace final instances of `$set` * refactor: remove `Vue` imports from tests * refactor: `Vue.ref()` -> `ref()` * refactor: actually push the changes... * test: replace unit test with e2e test * test: remove test as it's already covered by e2e * fix(test): use `$ref`s instead of `$children` * test(fix): more `$refs` * fix(test): more `$refs` * fix(test): use `$refs` in InspectorStyles tests * fix(SearchComponent): use `$attrs` correctly --------- Co-authored-by: Scott Bell <scott@traclabs.com>
This commit is contained in:
Jesse Mazzella
GitHub
parent
1414f54c17
commit
43338f3980
@ -77,8 +77,7 @@ const config = {
|
||||
MCT: path.join(projectRootDir, 'src/MCT'),
|
||||
testUtils: path.join(projectRootDir, 'src/utils/testUtils.js'),
|
||||
objectUtils: path.join(projectRootDir, 'src/api/objects/object-utils.js'),
|
||||
utils: path.join(projectRootDir, 'src/utils'),
|
||||
vue: path.join(projectRootDir, 'node_modules/@vue/compat/dist/vue.esm-bundler.js'),
|
||||
utils: path.join(projectRootDir, 'src/utils')
|
||||
}
|
||||
},
|
||||
plugins: [
|
||||
@ -86,7 +85,9 @@ const config = {
|
||||
__OPENMCT_VERSION__: `'${packageDefinition.version}'`,
|
||||
__OPENMCT_BUILD_DATE__: `'${new Date()}'`,
|
||||
__OPENMCT_REVISION__: `'${gitRevision}'`,
|
||||
__OPENMCT_BUILD_BRANCH__: `'${gitBranch}'`
|
||||
__OPENMCT_BUILD_BRANCH__: `'${gitBranch}'`,
|
||||
__VUE_OPTIONS_API__: true, // enable/disable Options API support, default: true
|
||||
__VUE_PROD_DEVTOOLS__: false // enable/disable devtools support in production, default: false
|
||||
}),
|
||||
new VueLoaderPlugin(),
|
||||
new CopyWebpackPlugin({
|
||||
@ -115,7 +116,7 @@ const config = {
|
||||
new webpack.BannerPlugin({
|
||||
test: /.*Theme\.css$/,
|
||||
raw: true,
|
||||
banner: '@charset "UTF-8";',
|
||||
banner: '@charset "UTF-8";'
|
||||
})
|
||||
],
|
||||
module: {
|
||||
@ -142,10 +143,7 @@ const config = {
|
||||
options: {
|
||||
compilerOptions: {
|
||||
hoistStatic: false,
|
||||
whitespace: 'preserve',
|
||||
compatConfig: {
|
||||
MODE: 2
|
||||
}
|
||||
whitespace: 'preserve'
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
59
e2e/tests/functional/clearDataAction.e2e.spec.js
Normal file
59
e2e/tests/functional/clearDataAction.e2e.spec.js
Normal file
@ -0,0 +1,59 @@
|
||||
/*****************************************************************************
|
||||
* Open MCT, Copyright (c) 2014-2023, United States Government
|
||||
* as represented by the Administrator of the National Aeronautics and Space
|
||||
* Administration. All rights reserved.
|
||||
*
|
||||
* Open MCT is licensed under the Apache License, Version 2.0 (the
|
||||
* "License"); you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
* http://www.apache.org/licenses/LICENSE-2.0.
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
|
||||
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
|
||||
* License for the specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*
|
||||
* Open MCT includes source code licensed under additional open source
|
||||
* licenses. See the Open Source Licenses file (LICENSES.md) included with
|
||||
* this source code distribution or the Licensing information page available
|
||||
* at runtime from the About dialog for additional information.
|
||||
*****************************************************************************/
|
||||
|
||||
/*
|
||||
Verify that the "Clear Data" menu action performs as expected for various object types.
|
||||
*/
|
||||
|
||||
const { test, expect } = require('../../pluginFixtures.js');
|
||||
const { createDomainObjectWithDefaults } = require('../../appActions.js');
|
||||
|
||||
const backgroundImageSelector = '.c-imagery__main-image__background-image';
|
||||
|
||||
test.describe('Clear Data Action', () => {
|
||||
test.beforeEach(async ({ page }) => {
|
||||
// Go to baseURL
|
||||
await page.goto('./', { waitUntil: 'domcontentloaded' });
|
||||
|
||||
// Create a default 'Example Imagery' object
|
||||
const exampleImagery = await createDomainObjectWithDefaults(page, { type: 'Example Imagery' });
|
||||
|
||||
// Verify that the created object is focused
|
||||
await expect(page.locator('.l-browse-bar__object-name')).toContainText(exampleImagery.name);
|
||||
await page.locator('.c-imagery__main-image__bg').hover({ trial: true });
|
||||
await expect(page.locator(backgroundImageSelector)).toBeVisible();
|
||||
});
|
||||
test('works as expected with Example Imagery', async ({ page }) => {
|
||||
await expect(await page.locator('.c-thumb__image').count()).toBeGreaterThan(0);
|
||||
// Click the "Clear Data" menu action
|
||||
await page.getByTitle('More options').click();
|
||||
const clearDataMenuItem = page.getByRole('menuitem', {
|
||||
name: 'Clear Data'
|
||||
});
|
||||
await expect(clearDataMenuItem).toBeEnabled();
|
||||
await clearDataMenuItem.click();
|
||||
|
||||
// Verify that the background image is no longer visible
|
||||
await expect(page.locator(backgroundImageSelector)).toBeHidden();
|
||||
await expect(await page.locator('.c-thumb__image').count()).toBe(0);
|
||||
});
|
||||
});
|
||||
@ -77,11 +77,11 @@ test.describe('Grand Search', () => {
|
||||
|
||||
// Click [aria-label="OpenMCT Search"] a >> nth=0
|
||||
await page.locator('[aria-label="Search Result"] >> nth=0').click();
|
||||
await expect(page.locator('[aria-label="Search Result"] >> nth=0')).toBeInViewport();
|
||||
await expect(page.locator('[aria-label="Search Result"] >> nth=0')).toBeHidden();
|
||||
|
||||
// Fill [aria-label="OpenMCT Search"] input[type="search"]
|
||||
await page.locator('[aria-label="OpenMCT Search"] input[type="search"]').fill('foo');
|
||||
await expect(page.locator('[aria-label="Search Result"] >> nth=0')).not.toBeInViewport();
|
||||
await expect(page.locator('[aria-label="Search Result"] >> nth=0')).toBeHidden();
|
||||
|
||||
// Click text=Snapshot Save and Finish Editing Save and Continue Editing >> button >> nth=1
|
||||
await page
|
||||
|
||||
@ -12,7 +12,6 @@
|
||||
"@types/eventemitter3": "1.2.0",
|
||||
"@types/jasmine": "4.3.4",
|
||||
"@types/lodash": "4.14.192",
|
||||
"@vue/compat": "3.3.4",
|
||||
"@vue/compiler-sfc": "3.3.4",
|
||||
"babel-loader": "9.1.0",
|
||||
"babel-plugin-istanbul": "6.1.1",
|
||||
|
||||
@ -20,7 +20,7 @@
|
||||
* at runtime from the About dialog for additional information.
|
||||
*****************************************************************************/
|
||||
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import { createMouseEvent, createOpenMct, resetApplicationState } from '../../utils/testing';
|
||||
import Menu from './menu';
|
||||
@ -186,7 +186,7 @@ describe('The Menu API', () => {
|
||||
superMenuItem.dispatchEvent(mouseOverEvent);
|
||||
const itemDescription = document.querySelector('.l-item-description__description');
|
||||
|
||||
Vue.nextTick(() => {
|
||||
nextTick(() => {
|
||||
expect(menuElement).not.toBeNull();
|
||||
expect(itemDescription.innerText).toEqual(actionsArray[0].description);
|
||||
|
||||
|
||||
@ -71,11 +71,6 @@ class Menu extends EventEmitter {
|
||||
},
|
||||
provide: {
|
||||
options: this.options
|
||||
},
|
||||
// TODO: Remove this exception upon full migration to Vue 3
|
||||
// https://v3-migration.vuejs.org/breaking-changes/render-function-api.html#render-function-argument
|
||||
compatConfig: {
|
||||
RENDER_FUNCTION: false
|
||||
}
|
||||
});
|
||||
|
||||
@ -98,11 +93,6 @@ class Menu extends EventEmitter {
|
||||
},
|
||||
provide: {
|
||||
options: this.options
|
||||
},
|
||||
// TODO: Remove this exception upon full migration to Vue 3
|
||||
// https://v3-migration.vuejs.org/breaking-changes/render-function-api.html#render-function-argument
|
||||
compatConfig: {
|
||||
RENDER_FUNCTION: false
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
@ -192,11 +192,7 @@ export default {
|
||||
reorderLadTables(reorderPlan) {
|
||||
let oldComposition = this.ladTableObjects.slice();
|
||||
reorderPlan.forEach((reorderEvent) => {
|
||||
this.$set(
|
||||
this.ladTableObjects,
|
||||
reorderEvent.newIndex,
|
||||
oldComposition[reorderEvent.oldIndex]
|
||||
);
|
||||
this.ladTableObjects[reorderEvent.newIndex] = oldComposition[reorderEvent.oldIndex];
|
||||
});
|
||||
},
|
||||
addTelemetryObject(ladTable) {
|
||||
|
||||
@ -27,7 +27,7 @@ import {
|
||||
resetApplicationState,
|
||||
spyOnBuiltins
|
||||
} from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import LadPlugin from './plugin.js';
|
||||
|
||||
@ -233,7 +233,7 @@ describe('The LAD Table', () => {
|
||||
anotherTelemetryObjectPromise,
|
||||
aggregateTelemetryObjectResolve
|
||||
]);
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
});
|
||||
|
||||
it('should show one row per object in the composition', () => {
|
||||
@ -244,7 +244,7 @@ describe('The LAD Table', () => {
|
||||
it('should show the most recent datum from the telemetry producing object', async () => {
|
||||
const latestDatum = getLatestTelemetry(mockTelemetry, { timeFormat });
|
||||
const expectedDate = utcTimeFormat(latestDatum[timeFormat]);
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
const latestDate = parent.querySelector(TABLE_BODY_FIRST_ROW_SECOND_DATA).innerText;
|
||||
expect(latestDate).toBe(expectedDate);
|
||||
const dataType = parent
|
||||
@ -254,7 +254,7 @@ describe('The LAD Table', () => {
|
||||
});
|
||||
|
||||
it('should show aggregate telemetry type with blank data', async () => {
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
const latestData = parent
|
||||
.querySelectorAll(TABLE_BODY_ROWS)[1]
|
||||
.querySelectorAll('td')[2].innerText;
|
||||
@ -282,7 +282,7 @@ describe('The LAD Table', () => {
|
||||
const mostRecentTelemetry = getLatestTelemetry(mockTelemetry, { timeFormat });
|
||||
const rangeValue = mostRecentTelemetry[range];
|
||||
const domainValue = utcTimeFormat(mostRecentTelemetry[domain]);
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
const actualDomainValue = parent.querySelector(TABLE_BODY_FIRST_ROW_SECOND_DATA).innerText;
|
||||
const actualRangeValue = parent.querySelector(TABLE_BODY_FIRST_ROW_THIRD_DATA).innerText;
|
||||
expect(actualRangeValue).toBe(rangeValue);
|
||||
@ -424,7 +424,7 @@ describe('The LAD Table Set', () => {
|
||||
ladTableSetView = ladTableSetViewProvider.view(mockObj.ladTableSet, [mockObj.ladTableSet]);
|
||||
ladTableSetView.show(child);
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
|
||||
it('should show one row per lad table object in the composition', () => {
|
||||
|
||||
@ -20,7 +20,7 @@
|
||||
* at runtime from the About dialog for additional information.
|
||||
*****************************************************************************/
|
||||
import { createOpenMct, resetApplicationState, spyOnBuiltins } from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import AutoflowTabularConstants from './AutoflowTabularConstants';
|
||||
import AutoflowTabularPlugin from './AutoflowTabularPlugin';
|
||||
@ -175,7 +175,7 @@ xdescribe('AutoflowTabularPlugin', () => {
|
||||
view = provider.view(testObject, [testObject]);
|
||||
view.show(testContainer);
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
|
||||
@ -23,7 +23,7 @@
|
||||
// import BarGraph from './BarGraphPlot.vue';
|
||||
import EventEmitter from 'EventEmitter';
|
||||
import { createOpenMct, resetApplicationState } from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import { BAR_GRAPH_INSPECTOR_KEY, BAR_GRAPH_KEY, BAR_GRAPH_VIEW } from './BarGraphConstants';
|
||||
import BarGraphPlugin from './plugin';
|
||||
@ -153,7 +153,7 @@ describe('the plugin', function () {
|
||||
|
||||
spyOn(openmct.composition, 'get').and.returnValue(mockComposition);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
});
|
||||
|
||||
it('provides a bar graph view', () => {
|
||||
@ -254,7 +254,7 @@ describe('the plugin', function () {
|
||||
|
||||
spyOn(openmct.composition, 'get').and.returnValue(mockComposition);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
});
|
||||
|
||||
it('Renders spectral plots', async () => {
|
||||
@ -305,8 +305,8 @@ describe('the plugin', function () {
|
||||
barGraphView.show(child, true);
|
||||
mockComposition.emit('add', dotFullTelemetryObject);
|
||||
|
||||
await Vue.nextTick();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
await nextTick();
|
||||
|
||||
const plotElement = element.querySelector('.cartesianlayer .scatterlayer .trace .lines');
|
||||
expect(plotElement).not.toBeNull();
|
||||
@ -581,7 +581,7 @@ describe('the plugin', function () {
|
||||
plotInspectorView = applicableViews.filter((view) => view.key === BAR_GRAPH_INSPECTOR_KEY)[0];
|
||||
plotInspectorView.show(viewContainer);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
optionsElement = element.querySelector('.c-bar-graph-options');
|
||||
});
|
||||
|
||||
|
||||
@ -22,7 +22,7 @@
|
||||
|
||||
import EventEmitter from 'EventEmitter';
|
||||
import { createOpenMct, resetApplicationState } from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import ScatterPlotPlugin from './plugin';
|
||||
import { SCATTER_PLOT_KEY, SCATTER_PLOT_VIEW } from './scatterPlotConstants';
|
||||
@ -178,7 +178,7 @@ describe('the plugin', function () {
|
||||
|
||||
spyOn(openmct.composition, 'get').and.returnValue(mockComposition);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
});
|
||||
|
||||
it('provides a scatter plot view', () => {
|
||||
@ -406,7 +406,7 @@ describe('the plugin', function () {
|
||||
plotInspectorView = applicableViews[0];
|
||||
plotInspectorView.show(viewContainer);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
optionsElement = element.querySelector('.c-scatter-plot-options');
|
||||
});
|
||||
|
||||
|
||||
@ -21,7 +21,7 @@
|
||||
*****************************************************************************/
|
||||
|
||||
import { createMouseEvent, createOpenMct, resetApplicationState } from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import ClearDataPlugin from './plugin.js';
|
||||
|
||||
@ -213,7 +213,7 @@ describe('The Clear Data Plugin:', () => {
|
||||
});
|
||||
|
||||
it('renders its major elements', async () => {
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
const indicatorClass = appHolder.querySelector('.c-indicator');
|
||||
const iconClass = appHolder.querySelector('.icon-clear-data');
|
||||
const indicatorLabel = appHolder.querySelector('.c-indicator__label');
|
||||
|
||||
@ -22,7 +22,7 @@
|
||||
|
||||
import EventEmitter from 'EventEmitter';
|
||||
import { createOpenMct, resetApplicationState } from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import clockPlugin from './plugin';
|
||||
|
||||
@ -106,7 +106,7 @@ describe('Clock plugin:', () => {
|
||||
clockView = clockViewProvider.view(mutableClockObject);
|
||||
clockView.show(child);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
await new Promise((resolve) => requestAnimationFrame(resolve));
|
||||
});
|
||||
|
||||
@ -232,7 +232,7 @@ describe('Clock plugin:', () => {
|
||||
it('contains text', async () => {
|
||||
await setupClock(true);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
await new Promise((resolve) => requestAnimationFrame(resolve));
|
||||
|
||||
clockIndicator = openmct.indicators.indicatorObjects.find(
|
||||
|
||||
@ -78,6 +78,7 @@
|
||||
<!-- Save Styles -->
|
||||
<toolbar-button
|
||||
v-if="canSaveStyle"
|
||||
ref="saveStyleButton"
|
||||
class="c-style__toolbar-button--save c-local-controls--show-on-hover c-icon-button c-icon-button--major"
|
||||
:options="saveOptions"
|
||||
@click="saveItemStyle()"
|
||||
|
||||
@ -38,6 +38,7 @@
|
||||
<div class="c-inspect-styles__content">
|
||||
<div v-if="staticStyle" class="c-inspect-styles__style">
|
||||
<StyleEditor
|
||||
ref="styleEditor"
|
||||
class="c-inspect-styles__editor"
|
||||
:style-item="staticStyle"
|
||||
:is-editing="allowEditing"
|
||||
|
||||
@ -20,8 +20,9 @@
|
||||
* at runtime from the About dialog for additional information.
|
||||
*****************************************************************************/
|
||||
|
||||
import mount from 'utils/mount';
|
||||
import { createOpenMct, resetApplicationState } from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import ConditionManager from '@/plugins/condition/ConditionManager';
|
||||
|
||||
@ -142,6 +143,7 @@ describe('the plugin', function () {
|
||||
let conditionWidgetItem;
|
||||
let selection;
|
||||
let component;
|
||||
let _destroy;
|
||||
let styleViewComponentObject;
|
||||
const conditionSetDomainObject = {
|
||||
configuration: {
|
||||
@ -238,8 +240,7 @@ describe('the plugin', function () {
|
||||
];
|
||||
let viewContainer = document.createElement('div');
|
||||
child.append(viewContainer);
|
||||
component = new Vue({
|
||||
el: viewContainer,
|
||||
const { vNode, destroy } = mount({
|
||||
components: {
|
||||
StylesView
|
||||
},
|
||||
@ -248,17 +249,20 @@ describe('the plugin', function () {
|
||||
selection: selection,
|
||||
stylesManager
|
||||
},
|
||||
template: '<styles-view/>'
|
||||
template: '<styles-view ref="root"/>'
|
||||
});
|
||||
|
||||
return Vue.nextTick().then(() => {
|
||||
styleViewComponentObject = component.$root.$children[0];
|
||||
component = vNode.componentInstance;
|
||||
_destroy = destroy;
|
||||
|
||||
return nextTick().then(() => {
|
||||
styleViewComponentObject = component.$refs.root;
|
||||
styleViewComponentObject.setEditState(true);
|
||||
});
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
component.$destroy();
|
||||
_destroy();
|
||||
});
|
||||
|
||||
it('does not include the output label when the flag is disabled', () => {
|
||||
@ -267,7 +271,7 @@ describe('the plugin', function () {
|
||||
styleViewComponentObject.initializeConditionalStyles();
|
||||
expect(styleViewComponentObject.conditionalStyles.length).toBe(2);
|
||||
|
||||
return Vue.nextTick().then(() => {
|
||||
return nextTick().then(() => {
|
||||
const hasNoOutput =
|
||||
styleViewComponentObject.domainObject.configuration.objectStyles.styles.every((style) => {
|
||||
return style.style.output === '' || style.style.output === undefined;
|
||||
@ -286,7 +290,7 @@ describe('the plugin', function () {
|
||||
styleViewComponentObject.useConditionSetOutputAsLabel = true;
|
||||
styleViewComponentObject.persistLabelConfiguration();
|
||||
|
||||
return Vue.nextTick().then(() => {
|
||||
return nextTick().then(() => {
|
||||
const outputs = styleViewComponentObject.domainObject.configuration.objectStyles.styles.map(
|
||||
(style) => {
|
||||
return style.style.output;
|
||||
@ -306,6 +310,7 @@ describe('the plugin', function () {
|
||||
let selection;
|
||||
let component;
|
||||
let styleViewComponentObject;
|
||||
let _destroy;
|
||||
const conditionSetDomainObject = {
|
||||
configuration: {
|
||||
conditionTestData: [
|
||||
@ -560,8 +565,7 @@ describe('the plugin', function () {
|
||||
];
|
||||
let viewContainer = document.createElement('div');
|
||||
child.append(viewContainer);
|
||||
component = new Vue({
|
||||
el: viewContainer,
|
||||
const { vNode, destroy } = mount({
|
||||
components: {
|
||||
StylesView
|
||||
},
|
||||
@ -570,15 +574,22 @@ describe('the plugin', function () {
|
||||
selection: selection,
|
||||
stylesManager
|
||||
},
|
||||
template: '<styles-view/>'
|
||||
template: '<styles-view ref="root"/>'
|
||||
});
|
||||
|
||||
return Vue.nextTick().then(() => {
|
||||
styleViewComponentObject = component.$root.$children[0];
|
||||
component = vNode.componentInstance;
|
||||
_destroy = destroy;
|
||||
|
||||
return nextTick().then(() => {
|
||||
styleViewComponentObject = component.$refs.root;
|
||||
styleViewComponentObject.setEditState(true);
|
||||
});
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
_destroy();
|
||||
});
|
||||
|
||||
it('initializes the items in the view', () => {
|
||||
expect(styleViewComponentObject.items.length).toBe(3);
|
||||
});
|
||||
@ -597,7 +608,7 @@ describe('the plugin', function () {
|
||||
expect(styleViewComponentObject.conditionalStyles.length).toBe(2);
|
||||
styleViewComponentObject.updateConditionalStyle(conditionalStyle, 'border');
|
||||
|
||||
return Vue.nextTick().then(() => {
|
||||
return nextTick().then(() => {
|
||||
expect(styleViewComponentObject.domainObject.configuration.objectStyles).toBeDefined();
|
||||
[boxLayoutItem, lineLayoutItem, notCreatableObjectItem].forEach((item) => {
|
||||
const itemStyles =
|
||||
@ -627,7 +638,7 @@ describe('the plugin', function () {
|
||||
it('updates applicable static styles', () => {
|
||||
styleViewComponentObject.updateStaticStyle(staticStyle, 'border');
|
||||
|
||||
return Vue.nextTick().then(() => {
|
||||
return nextTick().then(() => {
|
||||
expect(styleViewComponentObject.domainObject.configuration.objectStyles).toBeDefined();
|
||||
[boxLayoutItem, lineLayoutItem, notCreatableObjectItem].forEach((item) => {
|
||||
const itemStyle =
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import { createOpenMct, resetApplicationState } from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import ConditionWidgetPlugin from './plugin';
|
||||
|
||||
@ -148,7 +148,7 @@ describe('the plugin', function () {
|
||||
let view = conditionWidgetView.view(testViewObject, element);
|
||||
view.show(child, true);
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
|
||||
it('provides a view', () => {
|
||||
@ -184,7 +184,7 @@ describe('the plugin', function () {
|
||||
);
|
||||
conditionWidgetView.show(urlChild);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
const domainUrl = mockConditionObject[CONDITION_WIDGET_KEY].url;
|
||||
expect(urlParent.innerHTML).toContain(
|
||||
|
||||
@ -21,7 +21,7 @@
|
||||
*****************************************************************************/
|
||||
|
||||
import { createOpenMct, resetApplicationState } from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import DisplayLayoutPlugin from './plugin';
|
||||
|
||||
@ -163,7 +163,7 @@ describe('the plugin', function () {
|
||||
const view = displayLayoutViewProvider.view(displayLayoutItem, displayLayoutItem);
|
||||
view.show(child, false);
|
||||
|
||||
Vue.nextTick(done);
|
||||
nextTick(done);
|
||||
});
|
||||
|
||||
it('will sync composition and layout items', () => {
|
||||
|
||||
@ -155,11 +155,7 @@ export default {
|
||||
mutateFilters = true;
|
||||
}
|
||||
|
||||
this.$set(
|
||||
this.persistedFilters[keyString],
|
||||
metadatum.key,
|
||||
this.globalFilters[metadatum.key]
|
||||
);
|
||||
this.persistedFilters[keyString][metadatum.key] = this.globalFilters[metadatum.key];
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
@ -22,7 +22,7 @@
|
||||
|
||||
import EventEmitter from 'EventEmitter';
|
||||
import { createOpenMct, resetApplicationState } from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import FlexibleLayout from './plugin';
|
||||
|
||||
@ -105,7 +105,7 @@ describe('the plugin', function () {
|
||||
const flexibleView = flexibleLayoutViewProvider.view(testViewObject, [testViewObject]);
|
||||
flexibleView.show(child, false);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
console.log(child);
|
||||
const flexTitle = child.querySelector('.c-fl');
|
||||
|
||||
|
||||
@ -20,7 +20,7 @@
|
||||
* at runtime from the About dialog for additional information.
|
||||
*****************************************************************************/
|
||||
import { createOpenMct, resetApplicationState } from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import FolderPlugin from './plugin.js';
|
||||
|
||||
@ -132,7 +132,7 @@ describe('The folder plugin', () => {
|
||||
let folderView = gridViewProvider.view(folderObject, [folderObject]);
|
||||
folderView.show(childDiv, true);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
let children = parentDiv.getElementsByClassName('js-folder-child');
|
||||
expect(children.length).toBe(folderObject.composition.length);
|
||||
@ -147,7 +147,7 @@ describe('The folder plugin', () => {
|
||||
let folderView = listViewProvider.view(folderObject, [folderObject]);
|
||||
folderView.show(childDiv, true);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
let children = parentDiv.getElementsByClassName('js-folder-child');
|
||||
expect(children.length).toBe(folderObject.composition.length);
|
||||
|
||||
@ -21,7 +21,7 @@
|
||||
*****************************************************************************/
|
||||
import { debounce } from 'lodash';
|
||||
import { createMouseEvent, createOpenMct, resetApplicationState } from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
describe('EditPropertiesAction plugin', () => {
|
||||
let editPropertiesAction;
|
||||
@ -106,7 +106,7 @@ describe('EditPropertiesAction plugin', () => {
|
||||
done();
|
||||
});
|
||||
|
||||
Vue.nextTick(() => {
|
||||
nextTick(() => {
|
||||
const form = document.querySelector('.js-form');
|
||||
const title = form.querySelector('input');
|
||||
expect(title.value).toEqual(domainObject.name);
|
||||
@ -153,7 +153,7 @@ describe('EditPropertiesAction plugin', () => {
|
||||
|
||||
editPropertiesAction.invoke([domainObject]);
|
||||
|
||||
Vue.nextTick(() => {
|
||||
nextTick(() => {
|
||||
const form = document.querySelector('.js-form');
|
||||
const title = form.querySelector('input');
|
||||
const notes = form.querySelector('textArea');
|
||||
|
||||
@ -21,7 +21,7 @@
|
||||
*****************************************************************************/
|
||||
import { debounce } from 'lodash';
|
||||
import { createOpenMct, resetApplicationState } from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
let gaugeDomainObject = {
|
||||
identifier: {
|
||||
@ -174,7 +174,7 @@ describe('Gauge plugin', () => {
|
||||
gaugeView = gaugeViewProvider.view(mutablegaugeObject, [mutablegaugeObject]);
|
||||
gaugeView.show(child);
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
});
|
||||
|
||||
@ -221,7 +221,7 @@ describe('Gauge plugin', () => {
|
||||
}
|
||||
|
||||
const debouncedWatchUpdate = debounce(WatchUpdateValue, 200);
|
||||
Vue.nextTick(debouncedWatchUpdate);
|
||||
nextTick(debouncedWatchUpdate);
|
||||
});
|
||||
});
|
||||
|
||||
@ -316,7 +316,7 @@ describe('Gauge plugin', () => {
|
||||
gaugeView = gaugeViewProvider.view(mutablegaugeObject, [mutablegaugeObject]);
|
||||
gaugeView.show(child);
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
});
|
||||
|
||||
@ -363,7 +363,7 @@ describe('Gauge plugin', () => {
|
||||
}
|
||||
|
||||
const debouncedWatchUpdate = debounce(WatchUpdateValue, 200);
|
||||
Vue.nextTick(debouncedWatchUpdate);
|
||||
nextTick(debouncedWatchUpdate);
|
||||
});
|
||||
});
|
||||
|
||||
@ -458,7 +458,7 @@ describe('Gauge plugin', () => {
|
||||
gaugeView = gaugeViewProvider.view(mutablegaugeObject, [mutablegaugeObject]);
|
||||
gaugeView.show(child);
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
});
|
||||
|
||||
@ -505,7 +505,7 @@ describe('Gauge plugin', () => {
|
||||
}
|
||||
|
||||
const debouncedWatchUpdate = debounce(WatchUpdateValue, 200);
|
||||
Vue.nextTick(debouncedWatchUpdate);
|
||||
nextTick(debouncedWatchUpdate);
|
||||
});
|
||||
});
|
||||
|
||||
@ -562,7 +562,7 @@ describe('Gauge plugin', () => {
|
||||
gaugeView = gaugeViewProvider.view(mutablegaugeObject, [mutablegaugeObject]);
|
||||
gaugeView.show(child);
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
});
|
||||
|
||||
@ -645,7 +645,7 @@ describe('Gauge plugin', () => {
|
||||
gaugeView = gaugeViewProvider.view(mutablegaugeObject, [mutablegaugeObject]);
|
||||
gaugeView.show(child);
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
});
|
||||
|
||||
@ -773,7 +773,7 @@ describe('Gauge plugin', () => {
|
||||
gaugeView = gaugeViewProvider.view(mutablegaugeObject, [mutablegaugeObject]);
|
||||
gaugeView.show(child);
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
});
|
||||
|
||||
@ -821,7 +821,7 @@ describe('Gauge plugin', () => {
|
||||
}
|
||||
|
||||
const debouncedWatchUpdate = debounce(WatchUpdateValue, 200);
|
||||
Vue.nextTick(debouncedWatchUpdate);
|
||||
nextTick(debouncedWatchUpdate);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
@ -65,7 +65,7 @@ export default function ImageryTimestripViewProvider(openmct) {
|
||||
domainObject: domainObject,
|
||||
objectPath: objectPath
|
||||
},
|
||||
template: '<imagery-time-view></imagery-time-view>'
|
||||
template: '<imagery-time-view ref="root"></imagery-time-view>'
|
||||
},
|
||||
{
|
||||
app: openmct.app,
|
||||
|
||||
@ -19,7 +19,7 @@
|
||||
* this source code distribution or the Licensing information page available
|
||||
* at runtime from the About dialog for additional information.
|
||||
*****************************************************************************/
|
||||
import Vue from 'vue';
|
||||
import mount from 'utils/mount';
|
||||
|
||||
import Compass from './CompassComponent.vue';
|
||||
|
||||
@ -27,7 +27,7 @@ const COMPASS_ROSE_CLASS = '.c-direction-rose';
|
||||
const COMPASS_HUD_CLASS = '.c-compass__hud';
|
||||
|
||||
describe('The Compass component', () => {
|
||||
let app;
|
||||
let _destroy;
|
||||
let instance;
|
||||
|
||||
beforeEach(() => {
|
||||
@ -55,7 +55,7 @@ describe('The Compass component', () => {
|
||||
}
|
||||
};
|
||||
|
||||
app = new Vue({
|
||||
const { vNode, destroy } = mount({
|
||||
components: { Compass },
|
||||
data() {
|
||||
return propsData;
|
||||
@ -66,11 +66,12 @@ describe('The Compass component', () => {
|
||||
:sized-image-dimensions="sizedImageDimensions"
|
||||
/>`
|
||||
});
|
||||
instance = app.$mount();
|
||||
_destroy = destroy;
|
||||
instance = vNode.componentInstance;
|
||||
});
|
||||
|
||||
afterAll(() => {
|
||||
app.$destroy();
|
||||
_destroy();
|
||||
});
|
||||
|
||||
describe('when a heading value and cameraAngleOfView exists on the image', () => {
|
||||
|
||||
@ -26,9 +26,7 @@ import {
|
||||
resetApplicationState,
|
||||
simulateKeyEvent
|
||||
} from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
|
||||
import ClearDataPlugin from '../clearData/plugin';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
const ONE_MINUTE = 1000 * 60;
|
||||
const TEN_MINUTES = ONE_MINUTE * 10;
|
||||
@ -319,63 +317,6 @@ describe('The Imagery View Layouts', () => {
|
||||
expect(imageryView).toBeDefined();
|
||||
});
|
||||
|
||||
describe('Clear data action for imagery', () => {
|
||||
let applicableViews;
|
||||
let imageryViewProvider;
|
||||
let imageryView;
|
||||
let componentView;
|
||||
let clearDataPlugin;
|
||||
let clearDataAction;
|
||||
|
||||
beforeEach(() => {
|
||||
openmct.time.timeSystem('utc', {
|
||||
start: START - 5 * ONE_MINUTE,
|
||||
end: START + 5 * ONE_MINUTE
|
||||
});
|
||||
|
||||
applicableViews = openmct.objectViews.get(imageryObject, [imageryObject]);
|
||||
imageryViewProvider = applicableViews.find((viewProvider) => viewProvider.key === imageryKey);
|
||||
imageryView = imageryViewProvider.view(imageryObject, [imageryObject]);
|
||||
imageryView.show(child);
|
||||
componentView = imageryView._getInstance().$children[0];
|
||||
|
||||
clearDataPlugin = new ClearDataPlugin(['example.imagery'], { indicator: true });
|
||||
openmct.install(clearDataPlugin);
|
||||
clearDataAction = openmct.actions.getAction('clear-data-action');
|
||||
|
||||
return Vue.nextTick();
|
||||
});
|
||||
|
||||
it('clear data action is installed', () => {
|
||||
expect(clearDataAction).toBeDefined();
|
||||
});
|
||||
|
||||
it('on clearData action should clear data for object is selected', (done) => {
|
||||
// force show the thumbnails
|
||||
componentView.forceShowThumbnails = true;
|
||||
Vue.nextTick(() => {
|
||||
let clearDataResolve;
|
||||
let telemetryRequestPromise = new Promise((resolve) => {
|
||||
clearDataResolve = resolve;
|
||||
});
|
||||
expect(parent.querySelectorAll('.c-imagery__thumb').length).not.toBe(0);
|
||||
|
||||
openmct.objectViews.on('clearData', (_domainObject) => {
|
||||
return Vue.nextTick(() => {
|
||||
expect(parent.querySelectorAll('.c-imagery__thumb').length).toBe(0);
|
||||
|
||||
clearDataResolve();
|
||||
});
|
||||
});
|
||||
clearDataAction.invoke(imageryObject);
|
||||
|
||||
telemetryRequestPromise.then(() => {
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('imagery view', () => {
|
||||
let applicableViews;
|
||||
let imageryViewProvider;
|
||||
@ -392,54 +333,35 @@ describe('The Imagery View Layouts', () => {
|
||||
imageryView = imageryViewProvider.view(imageryObject, [imageryObject]);
|
||||
imageryView.show(child);
|
||||
|
||||
imageryView._getInstance().$children[0].forceShowThumbnails = true;
|
||||
imageryView._getInstance().$refs.ImageryContainer.forceShowThumbnails = true;
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
|
||||
it('on mount should show the the most recent image', async () => {
|
||||
//Looks like we need Vue.nextTick here so that computed properties settle down
|
||||
await Vue.nextTick();
|
||||
await Vue.nextTick();
|
||||
await Vue.nextTick();
|
||||
//Looks like we need nextTick here so that computed properties settle down
|
||||
await nextTick();
|
||||
await nextTick();
|
||||
await nextTick();
|
||||
const imageInfo = getImageInfo(parent);
|
||||
expect(imageInfo.url.indexOf(imageTelemetry[COUNT - 1].timeId)).not.toEqual(-1);
|
||||
});
|
||||
|
||||
it('on mount should show any image layers', async () => {
|
||||
//Looks like we need Vue.nextTick here so that computed properties settle down
|
||||
await Vue.nextTick();
|
||||
await Vue.nextTick();
|
||||
//Looks like we need nextTick here so that computed properties settle down
|
||||
await nextTick();
|
||||
await nextTick();
|
||||
const layerEls = parent.querySelectorAll('.js-layer-image');
|
||||
expect(layerEls.length).toEqual(1);
|
||||
});
|
||||
|
||||
it('should use the image thumbnailUrl for thumbnails', async () => {
|
||||
await Vue.nextTick();
|
||||
await Vue.nextTick();
|
||||
const fullSizeImageUrl = imageTelemetry[5].url;
|
||||
const thumbnailUrl = formatThumbnail(imageTelemetry[5].url);
|
||||
|
||||
// Ensure thumbnails are shown w/ thumbnail Urls
|
||||
const thumbnails = parent.querySelectorAll(`img[src='${thumbnailUrl}']`);
|
||||
expect(thumbnails.length).toBeGreaterThan(0);
|
||||
|
||||
// Click a thumbnail
|
||||
parent.querySelectorAll(`img[src='${thumbnailUrl}']`)[0].click();
|
||||
await Vue.nextTick();
|
||||
|
||||
// Ensure full size image is shown w/ full size url
|
||||
const fullSizeImages = parent.querySelectorAll(`img[src='${fullSizeImageUrl}']`);
|
||||
expect(fullSizeImages.length).toBeGreaterThan(0);
|
||||
});
|
||||
|
||||
it('should show the clicked thumbnail as the main image', async () => {
|
||||
//Looks like we need Vue.nextTick here so that computed properties settle down
|
||||
await Vue.nextTick();
|
||||
await Vue.nextTick();
|
||||
//Looks like we need nextTick here so that computed properties settle down
|
||||
await nextTick();
|
||||
await nextTick();
|
||||
const thumbnailUrl = formatThumbnail(imageTelemetry[5].url);
|
||||
parent.querySelectorAll(`img[src='${thumbnailUrl}']`)[0].click();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
const imageInfo = getImageInfo(parent);
|
||||
|
||||
expect(imageInfo.url.indexOf(imageTelemetry[5].timeId)).not.toEqual(-1);
|
||||
@ -451,7 +373,7 @@ describe('The Imagery View Layouts', () => {
|
||||
end: 1000
|
||||
});
|
||||
|
||||
Vue.nextTick(() => {
|
||||
nextTick(() => {
|
||||
// used in code, need to wait to the 500ms here too
|
||||
setTimeout(() => {
|
||||
const imageIsNew = isNew(parent);
|
||||
@ -462,20 +384,20 @@ describe('The Imagery View Layouts', () => {
|
||||
});
|
||||
|
||||
it('should show that an image is not new', async () => {
|
||||
await Vue.nextTick();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
await nextTick();
|
||||
const target = formatThumbnail(imageTelemetry[4].url);
|
||||
parent.querySelectorAll(`img[src='${target}']`)[0].click();
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
const imageIsNew = isNew(parent);
|
||||
|
||||
expect(imageIsNew).toBeFalse();
|
||||
});
|
||||
|
||||
it('should navigate via arrow keys', async () => {
|
||||
await Vue.nextTick();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
await nextTick();
|
||||
const keyOpts = {
|
||||
element: parent.querySelector('.c-imagery'),
|
||||
key: 'ArrowLeft',
|
||||
@ -485,14 +407,14 @@ describe('The Imagery View Layouts', () => {
|
||||
|
||||
simulateKeyEvent(keyOpts);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
const imageInfo = getImageInfo(parent);
|
||||
expect(imageInfo.url.indexOf(imageTelemetry[COUNT - 2].timeId)).not.toEqual(-1);
|
||||
});
|
||||
|
||||
it('should navigate via numerous arrow keys', async () => {
|
||||
await Vue.nextTick();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
await nextTick();
|
||||
const element = parent.querySelector('.c-imagery');
|
||||
const type = 'keyup';
|
||||
const leftKeyOpts = {
|
||||
@ -515,15 +437,15 @@ describe('The Imagery View Layouts', () => {
|
||||
// right once
|
||||
simulateKeyEvent(rightKeyOpts);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
const imageInfo = getImageInfo(parent);
|
||||
expect(imageInfo.url.indexOf(imageTelemetry[COUNT - 3].timeId)).not.toEqual(-1);
|
||||
});
|
||||
it('shows an auto scroll button when scroll to left', (done) => {
|
||||
Vue.nextTick(() => {
|
||||
nextTick(() => {
|
||||
// to mock what a scroll would do
|
||||
imageryView._getInstance().$refs.ImageryContainer.autoScroll = false;
|
||||
Vue.nextTick(() => {
|
||||
nextTick(() => {
|
||||
let autoScrollButton = parent.querySelector('.c-imagery__auto-scroll-resume-button');
|
||||
expect(autoScrollButton).toBeTruthy();
|
||||
done();
|
||||
@ -531,16 +453,16 @@ describe('The Imagery View Layouts', () => {
|
||||
});
|
||||
});
|
||||
it('scrollToRight is called when clicking on auto scroll button', async () => {
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
// use spyon to spy the scroll function
|
||||
spyOn(imageryView._getInstance().$refs.ImageryContainer, 'scrollHandler');
|
||||
imageryView._getInstance().$refs.ImageryContainer.autoScroll = false;
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
parent.querySelector('.c-imagery__auto-scroll-resume-button').click();
|
||||
expect(imageryView._getInstance().$refs.ImageryContainer.scrollHandler);
|
||||
});
|
||||
xit('should change the image zoom factor when using the zoom buttons', async () => {
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
let imageSizeBefore;
|
||||
let imageSizeAfter;
|
||||
|
||||
@ -549,7 +471,7 @@ describe('The Imagery View Layouts', () => {
|
||||
.querySelector('.c-imagery_main-image_background-image')
|
||||
.getBoundingClientRect();
|
||||
parent.querySelector('.t-btn-zoom-in').click();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
imageSizeAfter = parent
|
||||
.querySelector('.c-imagery_main-image_background-image')
|
||||
.getBoundingClientRect();
|
||||
@ -560,7 +482,7 @@ describe('The Imagery View Layouts', () => {
|
||||
.querySelector('.c-imagery_main-image_background-image')
|
||||
.getBoundingClientRect();
|
||||
parent.querySelector('.t-btn-zoom-out').click();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
imageSizeAfter = parent
|
||||
.querySelector('.c-imagery_main-image_background-image')
|
||||
.getBoundingClientRect();
|
||||
@ -568,15 +490,15 @@ describe('The Imagery View Layouts', () => {
|
||||
expect(imageSizeAfter.width).toBeLessThan(imageSizeBefore.width);
|
||||
});
|
||||
xit('should reset the zoom factor on the image when clicking the zoom button', async (done) => {
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
// test clicking the zoom reset button
|
||||
// zoom in to scale up the image dimensions
|
||||
parent.querySelector('.t-btn-zoom-in').click();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
let imageSizeBefore = parent
|
||||
.querySelector('.c-imagery_main-image_background-image')
|
||||
.getBoundingClientRect();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
parent.querySelector('.t-btn-zoom-reset').click();
|
||||
let imageSizeAfter = parent
|
||||
.querySelector('.c-imagery_main-image_background-image')
|
||||
@ -587,22 +509,22 @@ describe('The Imagery View Layouts', () => {
|
||||
});
|
||||
|
||||
it('should display the viewable area when zoom factor is greater than 1', async () => {
|
||||
await Vue.nextTick();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
await nextTick();
|
||||
expect(parent.querySelectorAll('.c-thumb__viewable-area').length).toBe(0);
|
||||
|
||||
parent.querySelector('.t-btn-zoom-in').click();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
expect(parent.querySelectorAll('.c-thumb__viewable-area').length).toBe(1);
|
||||
|
||||
parent.querySelector('.t-btn-zoom-reset').click();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
expect(parent.querySelectorAll('.c-thumb__viewable-area').length).toBe(0);
|
||||
});
|
||||
|
||||
it('should reset the brightness and contrast when clicking the reset button', async () => {
|
||||
const viewInstance = imageryView._getInstance();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
// Save the original brightness and contrast values
|
||||
const origBrightness = viewInstance.$refs.ImageryContainer.filters.brightness;
|
||||
@ -613,7 +535,7 @@ describe('The Imagery View Layouts', () => {
|
||||
brightness: 200,
|
||||
contrast: 200
|
||||
});
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
// Verify that the values actually changed
|
||||
expect(viewInstance.$refs.ImageryContainer.filters.brightness).toBe(200);
|
||||
@ -621,7 +543,7 @@ describe('The Imagery View Layouts', () => {
|
||||
|
||||
// Click the reset button
|
||||
parent.querySelector('.t-btn-reset').click();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
// Verify that the values were reset
|
||||
expect(viewInstance.$refs.ImageryContainer.filters.brightness).toBe(origBrightness);
|
||||
@ -631,8 +553,8 @@ describe('The Imagery View Layouts', () => {
|
||||
|
||||
describe('imagery time strip view', () => {
|
||||
let applicableViews;
|
||||
let imageryViewProvider;
|
||||
let imageryView;
|
||||
let imageryTimestripViewProvider;
|
||||
let imageryTimeView;
|
||||
let componentView;
|
||||
|
||||
beforeEach(() => {
|
||||
@ -671,10 +593,10 @@ describe('The Imagery View Layouts', () => {
|
||||
type: 'time-strip'
|
||||
}
|
||||
]);
|
||||
imageryViewProvider = applicableViews.find(
|
||||
imageryTimestripViewProvider = applicableViews.find(
|
||||
(viewProvider) => viewProvider.key === imageryForTimeStripKey
|
||||
);
|
||||
imageryView = imageryViewProvider.view(imageryObject, [
|
||||
imageryTimeView = imageryTimestripViewProvider.view(imageryObject, [
|
||||
imageryObject,
|
||||
{
|
||||
identifier: {
|
||||
@ -684,12 +606,12 @@ describe('The Imagery View Layouts', () => {
|
||||
type: 'time-strip'
|
||||
}
|
||||
]);
|
||||
imageryView.show(child);
|
||||
imageryTimeView.show(child);
|
||||
|
||||
componentView = imageryView.getComponent().$children[0];
|
||||
componentView = imageryTimeView.getComponent().$refs.root;
|
||||
spyOn(componentView.previewAction, 'invoke').and.callThrough();
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
@ -697,19 +619,19 @@ describe('The Imagery View Layouts', () => {
|
||||
});
|
||||
|
||||
it('on mount should show imagery within the given bounds', async () => {
|
||||
await Vue.nextTick();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
await nextTick();
|
||||
const imageElements = parent.querySelectorAll('.c-imagery-tsv__image-wrapper');
|
||||
expect(imageElements.length).toEqual(5);
|
||||
});
|
||||
|
||||
it('should show the clicked thumbnail as the preview image', async () => {
|
||||
await Vue.nextTick();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
await nextTick();
|
||||
const mouseDownEvent = createMouseEvent('mousedown');
|
||||
let imageWrapper = parent.querySelectorAll(`.c-imagery-tsv__image-wrapper`);
|
||||
imageWrapper[2].dispatchEvent(mouseDownEvent);
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
const timestamp = imageWrapper[2].id.replace('wrapper-', '');
|
||||
expect(componentView.previewAction.invoke).toHaveBeenCalledWith(
|
||||
[componentView.objectPath[0]],
|
||||
@ -722,8 +644,8 @@ describe('The Imagery View Layouts', () => {
|
||||
|
||||
it('should remove images when clock advances', async () => {
|
||||
openmct.time.tick(ONE_MINUTE * 2);
|
||||
await Vue.nextTick();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
await nextTick();
|
||||
const imageElements = parent.querySelectorAll('.c-imagery-tsv__image-wrapper');
|
||||
expect(imageElements.length).toEqual(4);
|
||||
});
|
||||
@ -733,8 +655,8 @@ describe('The Imagery View Layouts', () => {
|
||||
start: START,
|
||||
end: START + 5 * ONE_MINUTE
|
||||
});
|
||||
await Vue.nextTick();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
await nextTick();
|
||||
const imageElements = parent.querySelectorAll('.c-imagery-tsv__image-wrapper');
|
||||
expect(imageElements.length).toEqual(1);
|
||||
});
|
||||
@ -744,8 +666,8 @@ describe('The Imagery View Layouts', () => {
|
||||
start: START - 5 * ONE_MINUTE,
|
||||
end: START - 2 * ONE_MINUTE
|
||||
});
|
||||
await Vue.nextTick();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
await nextTick();
|
||||
const imageElements = parent.querySelectorAll('.c-imagery-tsv__image-wrapper');
|
||||
expect(imageElements.length).toEqual(4);
|
||||
});
|
||||
@ -755,8 +677,8 @@ describe('The Imagery View Layouts', () => {
|
||||
start: START - 2 * ONE_MINUTE,
|
||||
end: START + 2 * ONE_MINUTE
|
||||
});
|
||||
await Vue.nextTick();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
await nextTick();
|
||||
const imageElements = parent.querySelectorAll('.c-imagery-tsv__image-wrapper');
|
||||
expect(imageElements.length).toEqual(3);
|
||||
});
|
||||
|
||||
@ -410,7 +410,7 @@ export default {
|
||||
this.manageEmbedLayout();
|
||||
this.timestampAndUpdate();
|
||||
},
|
||||
convertMarkDownToHtml(text) {
|
||||
convertMarkDownToHtml(text = '') {
|
||||
let markDownHtml = this.marked.parse(text, {
|
||||
breaks: true,
|
||||
renderer: this.renderer
|
||||
|
||||
@ -21,7 +21,7 @@
|
||||
*****************************************************************************/
|
||||
|
||||
import { createMouseEvent, createOpenMct, resetApplicationState } from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import { NotebookPlugin } from './plugin';
|
||||
|
||||
@ -189,7 +189,7 @@ describe('Notebook plugin:', () => {
|
||||
notebookView = notebookViewProvider.view(mutableNotebookObject, [mutableNotebookObject]);
|
||||
notebookView.show(child);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
@ -237,7 +237,7 @@ describe('Notebook plugin:', () => {
|
||||
'Modified entry text';
|
||||
objectProviderObserver(objectCloneToSyncFrom);
|
||||
|
||||
return Vue.nextTick().then(() => {
|
||||
return nextTick().then(() => {
|
||||
expect(getEntryText(0).innerText.trim()).toBe('Modified entry text');
|
||||
});
|
||||
});
|
||||
@ -252,7 +252,7 @@ describe('Notebook plugin:', () => {
|
||||
});
|
||||
objectProviderObserver(objectCloneToSyncFrom);
|
||||
|
||||
return Vue.nextTick().then(() => {
|
||||
return nextTick().then(() => {
|
||||
expect(allNotebookEntryElements().length).toBe(3);
|
||||
});
|
||||
});
|
||||
@ -263,7 +263,7 @@ describe('Notebook plugin:', () => {
|
||||
entries.splice(0, 1);
|
||||
objectProviderObserver(objectCloneToSyncFrom);
|
||||
|
||||
return Vue.nextTick().then(() => {
|
||||
return nextTick().then(() => {
|
||||
expect(allNotebookEntryElements().length).toBe(1);
|
||||
});
|
||||
});
|
||||
@ -281,7 +281,7 @@ describe('Notebook plugin:', () => {
|
||||
objectCloneToSyncFrom.configuration.sections[0].pages.push(newPage);
|
||||
objectProviderObserver(objectCloneToSyncFrom);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
expect(allNotebookPageElements().length).toBe(3);
|
||||
});
|
||||
|
||||
@ -290,7 +290,7 @@ describe('Notebook plugin:', () => {
|
||||
objectCloneToSyncFrom.configuration.sections[0].pages.splice(0, 1);
|
||||
objectProviderObserver(objectCloneToSyncFrom);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
expect(allNotebookPageElements().length).toBe(1);
|
||||
});
|
||||
|
||||
@ -315,7 +315,7 @@ describe('Notebook plugin:', () => {
|
||||
objectCloneToSyncFrom.configuration.sections.push(newSection);
|
||||
objectProviderObserver(objectCloneToSyncFrom);
|
||||
|
||||
return Vue.nextTick().then(() => {
|
||||
return nextTick().then(() => {
|
||||
expect(allNotebookSectionElements().length).toBe(3);
|
||||
});
|
||||
});
|
||||
@ -325,7 +325,7 @@ describe('Notebook plugin:', () => {
|
||||
objectCloneToSyncFrom.configuration.sections.splice(0, 1);
|
||||
objectProviderObserver(objectCloneToSyncFrom);
|
||||
|
||||
return Vue.nextTick().then(() => {
|
||||
return nextTick().then(() => {
|
||||
expect(allNotebookSectionElements().length).toBe(1);
|
||||
});
|
||||
});
|
||||
@ -351,7 +351,7 @@ describe('Notebook plugin:', () => {
|
||||
|
||||
element.append(snapshotIndicator);
|
||||
|
||||
return Vue.nextTick().then(() => {
|
||||
return nextTick().then(() => {
|
||||
drawerElement = document.querySelector('.l-shell__drawer');
|
||||
});
|
||||
});
|
||||
|
||||
@ -21,7 +21,7 @@
|
||||
*****************************************************************************/
|
||||
|
||||
import { createOpenMct, resetApplicationState } from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import NotificationIndicatorPlugin from './plugin.js';
|
||||
|
||||
@ -58,7 +58,7 @@ describe('the plugin', () => {
|
||||
beforeEach(() => {
|
||||
parentElement.append(indicatorElement);
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
|
||||
it('notifies the user of the number of notifications', () => {
|
||||
|
||||
@ -20,7 +20,7 @@
|
||||
* at runtime from the About dialog for additional information.
|
||||
*****************************************************************************/
|
||||
import { createOpenMct, resetApplicationState, spyOnBuiltins } from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import { CONNECTED, DISCONNECTED, PENDING, UNKNOWN } from './CouchStatusIndicator';
|
||||
import CouchPlugin from './plugin.js';
|
||||
@ -478,7 +478,7 @@ describe('the view', () => {
|
||||
namespace: '',
|
||||
key: 'object-1'
|
||||
});
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
assertCouchIndicatorStatus(CONNECTED);
|
||||
});
|
||||
@ -490,7 +490,7 @@ describe('the view', () => {
|
||||
namespace: '',
|
||||
key: 'object-1'
|
||||
});
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
assertCouchIndicatorStatus(DISCONNECTED);
|
||||
});
|
||||
@ -523,7 +523,7 @@ describe('the view', () => {
|
||||
|
||||
// Simulate 'pending' state from worker message
|
||||
provider.onSharedWorkerMessage(workerMessage);
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
assertCouchIndicatorStatus(PENDING);
|
||||
});
|
||||
@ -556,7 +556,7 @@ describe('the view', () => {
|
||||
|
||||
// Simulate 'pending' state from worker message
|
||||
provider.onSharedWorkerMessage(workerMessage);
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
assertCouchIndicatorStatus(UNKNOWN);
|
||||
});
|
||||
|
||||
@ -69,11 +69,11 @@ export default {
|
||||
const label = this.activity[key].label;
|
||||
const value = String(this.activity[key].value);
|
||||
|
||||
this.$set(this.timeProperties, this.timeProperties.length, {
|
||||
this.timeProperties[this.timeProperties.length] = {
|
||||
id: uuid(),
|
||||
label,
|
||||
value
|
||||
});
|
||||
};
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
@ -20,8 +20,9 @@
|
||||
* at runtime from the About dialog for additional information.
|
||||
*****************************************************************************/
|
||||
|
||||
import mount from 'utils/mount';
|
||||
import { createOpenMct, resetApplicationState } from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import Properties from '../inspectorViews/properties/PropertiesComponent.vue';
|
||||
import PlanPlugin from '../plan/plugin';
|
||||
@ -187,7 +188,7 @@ describe('the plugin', function () {
|
||||
let view = planView.view(planDomainObject, mockObjectPath);
|
||||
view.show(child, true);
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
|
||||
it('loads activities into the view', () => {
|
||||
@ -210,7 +211,7 @@ describe('the plugin', function () {
|
||||
|
||||
openmct.time.bounds(bounds);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
const rectEls = element.querySelectorAll('.c-plan__contents use');
|
||||
expect(rectEls.length).toEqual(2);
|
||||
const textEls = element.querySelectorAll('.c-plan__contents text');
|
||||
@ -226,7 +227,7 @@ describe('the plugin', function () {
|
||||
'draft'
|
||||
);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
const statusEl = element.querySelector('.c-plan__contents .is-status--draft');
|
||||
expect(statusEl).toBeDefined();
|
||||
});
|
||||
@ -235,6 +236,7 @@ describe('the plugin', function () {
|
||||
describe('the plan version', () => {
|
||||
let component;
|
||||
let componentObject;
|
||||
let _destroy;
|
||||
let testPlanObject = {
|
||||
name: 'Plan',
|
||||
type: 'plan',
|
||||
@ -267,27 +269,28 @@ describe('the plugin', function () {
|
||||
false
|
||||
);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
let viewContainer = document.createElement('div');
|
||||
child.append(viewContainer);
|
||||
component = new Vue({
|
||||
el: viewContainer,
|
||||
const { vNode, destroy } = mount({
|
||||
components: {
|
||||
Properties
|
||||
},
|
||||
provide: {
|
||||
openmct: openmct
|
||||
},
|
||||
template: '<properties/>'
|
||||
template: '<properties ref="root"/>'
|
||||
});
|
||||
_destroy = destroy;
|
||||
component = vNode.componentInstance;
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
component.$destroy();
|
||||
_destroy();
|
||||
});
|
||||
|
||||
it('provides an inspector view with the version information if available', () => {
|
||||
componentObject = component.$root.$children[0];
|
||||
componentObject = component.$refs.root;
|
||||
const propertiesEls = componentObject.$el.querySelectorAll('.c-inspect-properties__row');
|
||||
const found = Array.from(propertiesEls).some((propertyEl) => {
|
||||
return (
|
||||
|
||||
@ -32,6 +32,7 @@
|
||||
:model="{ progressPerc: null }"
|
||||
/>
|
||||
<mct-plot
|
||||
ref="mctPlot"
|
||||
:class="[plotLegendExpandedStateClass, plotLegendPositionClass]"
|
||||
:init-grid-lines="gridLinesProp"
|
||||
:init-cursor-guide="cursorGuide"
|
||||
|
||||
@ -28,7 +28,7 @@ import {
|
||||
resetApplicationState,
|
||||
spyOnBuiltins
|
||||
} from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import configStore from './configuration/ConfigStore';
|
||||
import PlotConfigurationModel from './configuration/PlotConfigurationModel';
|
||||
@ -172,7 +172,7 @@ describe('the plugin', function () {
|
||||
end: 2
|
||||
});
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
configStore.deleteAll();
|
||||
return resetApplicationState(openmct);
|
||||
});
|
||||
@ -374,7 +374,7 @@ describe('the plugin', function () {
|
||||
plotView = plotViewProvider.view(testTelemetryObject, []);
|
||||
plotView.show(child, true);
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
@ -386,14 +386,14 @@ describe('the plugin', function () {
|
||||
});
|
||||
|
||||
it('Renders a collapsed legend for every telemetry', async () => {
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
let legend = element.querySelectorAll('.plot-wrapper-collapsed-legend .plot-series-name');
|
||||
expect(legend.length).toBe(1);
|
||||
expect(legend[0].innerHTML).toEqual('Test Object');
|
||||
});
|
||||
|
||||
it('Renders an expanded legend for every telemetry', async () => {
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
let legendControl = element.querySelector(
|
||||
'.c-plot-legend__view-control.gl-plot-legend__view-control.c-disclosure-triangle'
|
||||
);
|
||||
@ -413,7 +413,7 @@ describe('the plugin', function () {
|
||||
max: 4
|
||||
});
|
||||
|
||||
Vue.nextTick(() => {
|
||||
nextTick(() => {
|
||||
let xAxisElement = element.querySelectorAll(
|
||||
'.gl-plot-axis-area.gl-plot-x .gl-plot-tick-wrapper'
|
||||
);
|
||||
@ -427,7 +427,7 @@ describe('the plugin', function () {
|
||||
});
|
||||
|
||||
it('Renders Y-axis options for the telemetry object', async () => {
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
let yAxisElement = element.querySelectorAll(
|
||||
'.gl-plot-axis-area.gl-plot-y .gl-plot-y-label__select'
|
||||
);
|
||||
@ -468,11 +468,11 @@ describe('the plugin', function () {
|
||||
end: 100
|
||||
});
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
|
||||
it('shows the pause controls', (done) => {
|
||||
Vue.nextTick(() => {
|
||||
nextTick(() => {
|
||||
let pauseEl = element.querySelectorAll('.c-button-set .icon-pause');
|
||||
expect(pauseEl.length).toBe(1);
|
||||
done();
|
||||
@ -484,7 +484,7 @@ describe('the plugin', function () {
|
||||
const clickEvent = createMouseEvent('click');
|
||||
|
||||
pauseEl.dispatchEvent(clickEvent);
|
||||
Vue.nextTick(() => {
|
||||
nextTick(() => {
|
||||
let playEl = element.querySelectorAll('.c-button-set .is-paused');
|
||||
expect(playEl.length).toBe(1);
|
||||
done();
|
||||
@ -500,7 +500,7 @@ describe('the plugin', function () {
|
||||
end: 100
|
||||
});
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
|
||||
it('clicking the plot view without movement resumes the plot while active', async () => {
|
||||
@ -516,7 +516,7 @@ describe('the plugin', function () {
|
||||
canvas.dispatchEvent(mouseDownEvent);
|
||||
// mouseup event is bound to the window
|
||||
window.dispatchEvent(mouseUpEvent);
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
const pauseElAfterClick = element.querySelectorAll('.c-button-set .icon-pause');
|
||||
console.log('pauseElAfterClick', pauseElAfterClick);
|
||||
@ -527,7 +527,7 @@ describe('the plugin', function () {
|
||||
const pauseEl = element.querySelector('.c-button-set .icon-pause');
|
||||
// pause the plot
|
||||
pauseEl.dispatchEvent(createMouseEvent('click'));
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
const playEl = element.querySelectorAll('.c-button-set .is-paused');
|
||||
expect(playEl.length).toBe(1);
|
||||
@ -540,7 +540,7 @@ describe('the plugin', function () {
|
||||
canvas.dispatchEvent(mouseDownEvent);
|
||||
// mouseup event is bound to the window
|
||||
window.dispatchEvent(mouseUpEvent);
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
const playElAfterChartClick = element.querySelectorAll('.c-button-set .is-paused');
|
||||
expect(playElAfterChartClick.length).toBe(1);
|
||||
@ -557,7 +557,7 @@ describe('the plugin', function () {
|
||||
canvas.dispatchEvent(mouseDownEvent);
|
||||
// mouseup event is bound to the window
|
||||
window.dispatchEvent(mouseUpEvent);
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
expect(openmct.telemetry.request).toHaveBeenCalledTimes(2);
|
||||
});
|
||||
@ -569,7 +569,7 @@ describe('the plugin', function () {
|
||||
});
|
||||
|
||||
it('lines are displayed when configuration is set to true', async () => {
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
const configId = openmct.objects.makeKeyString(testTelemetryObject.identifier);
|
||||
const config = configStore.get(configId);
|
||||
config.yAxis.set('displayRange', {
|
||||
@ -578,7 +578,7 @@ describe('the plugin', function () {
|
||||
});
|
||||
config.series.models[0].set('limitLines', true);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
let limitEl = element.querySelectorAll('.js-limit-area .js-limit-line');
|
||||
expect(limitEl.length).toBe(4);
|
||||
});
|
||||
@ -666,13 +666,13 @@ describe('the plugin', function () {
|
||||
|
||||
plotContainerResizeObserver = new ResizeObserver(handlePlotResize);
|
||||
plotContainerResizeObserver.observe(
|
||||
plotView.getComponent().$children[0].$children[1].$parent.$refs.plotWrapper
|
||||
plotView.getComponent().$refs.plotComponent.$refs.plotWrapper
|
||||
);
|
||||
|
||||
return Vue.nextTick(() => {
|
||||
plotView.getComponent().$children[0].$children[1].stopFollowingTimeContext();
|
||||
return nextTick(() => {
|
||||
plotView.getComponent().$refs.plotComponent.$refs.mctPlot.stopFollowingTimeContext();
|
||||
spyOn(
|
||||
plotView.getComponent().$children[0].$children[1],
|
||||
plotView.getComponent().$refs.plotComponent.$refs.mctPlot,
|
||||
'loadSeriesData'
|
||||
).and.callThrough();
|
||||
});
|
||||
@ -684,22 +684,20 @@ describe('the plugin', function () {
|
||||
});
|
||||
|
||||
xit('requests historical data when over the threshold', async () => {
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
element.style.width = '680px';
|
||||
await resizePromise;
|
||||
expect(
|
||||
plotView.getComponent().$children[0].$children[1].loadSeriesData
|
||||
plotView.getComponent().$refs.plotComponent.$refs.mctPlot.loadSeriesData
|
||||
).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
|
||||
it('does not request historical data when under the threshold', (done) => {
|
||||
it('does not request historical data when under the threshold', async () => {
|
||||
element.style.width = '644px';
|
||||
resizePromise.then(() => {
|
||||
expect(
|
||||
plotView.getComponent().$children[0].$children[1].loadSeriesData
|
||||
).not.toHaveBeenCalled();
|
||||
done();
|
||||
});
|
||||
await resizePromise;
|
||||
expect(
|
||||
plotView.getComponent().$refs.plotComponent.$refs.mctPlot.loadSeriesData
|
||||
).not.toHaveBeenCalled();
|
||||
});
|
||||
});
|
||||
|
||||
@ -815,7 +813,7 @@ describe('the plugin', function () {
|
||||
domainObject: selection[0][0].context.item,
|
||||
path: [selection[0][0].context.item, selection[0][1].context.item]
|
||||
},
|
||||
template: '<plot-options/>'
|
||||
template: '<plot-options ref="root"/>'
|
||||
},
|
||||
{
|
||||
element: viewContainer
|
||||
@ -823,8 +821,8 @@ describe('the plugin', function () {
|
||||
);
|
||||
component = vNode.componentInstance;
|
||||
|
||||
Vue.nextTick(() => {
|
||||
viewComponentObject = component.$root.$children[0];
|
||||
nextTick(() => {
|
||||
viewComponentObject = component.$refs.root;
|
||||
done();
|
||||
});
|
||||
});
|
||||
@ -873,7 +871,7 @@ describe('the plugin', function () {
|
||||
|
||||
beforeEach((done) => {
|
||||
viewComponentObject.setEditState(true);
|
||||
Vue.nextTick(() => {
|
||||
nextTick(() => {
|
||||
editOptionsEl = viewComponentObject.$el.querySelector('.js-plot-options-edit');
|
||||
browseOptionsEl = viewComponentObject.$el.querySelector('.js-plot-options-browse');
|
||||
done();
|
||||
|
||||
@ -38,6 +38,7 @@
|
||||
<div class="l-view-section">
|
||||
<stacked-plot-item
|
||||
v-for="objectWrapper in compositionObjects"
|
||||
ref="stackedPlotItems"
|
||||
:key="objectWrapper.keyString"
|
||||
class="c-plot--stacked-container"
|
||||
:child-object="objectWrapper.object"
|
||||
|
||||
@ -28,7 +28,7 @@ import {
|
||||
resetApplicationState,
|
||||
spyOnBuiltins
|
||||
} from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick, ref } from 'vue';
|
||||
|
||||
import configStore from '../configuration/ConfigStore';
|
||||
import PlotConfigurationModel from '../configuration/PlotConfigurationModel';
|
||||
@ -342,7 +342,7 @@ describe('the plugin', function () {
|
||||
destroyStackedPlot = destroy;
|
||||
|
||||
await telemetryPromise;
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
plotViewComponentObject = component.$refs.stackedPlotRef;
|
||||
const configId = openmct.objects.makeKeyString(testTelemetryObject.identifier);
|
||||
config = configStore.get(configId);
|
||||
@ -390,7 +390,7 @@ describe('the plugin', function () {
|
||||
min: 10,
|
||||
max: 20
|
||||
});
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
let yAxisElement = element.querySelectorAll(
|
||||
'.gl-plot-axis-area.gl-plot-y .gl-plot-tick-wrapper'
|
||||
);
|
||||
@ -411,10 +411,10 @@ describe('the plugin', function () {
|
||||
});
|
||||
|
||||
it('turns on cursor Guides all telemetry objects', async () => {
|
||||
let cursorGuide = Vue.ref(plotViewComponentObject.cursorGuide);
|
||||
let cursorGuide = ref(plotViewComponentObject.cursorGuide);
|
||||
expect(cursorGuide.value).toBeFalse();
|
||||
cursorGuide.value = true;
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
let childCursorGuides = element.querySelectorAll('.c-cursor-guide--v');
|
||||
expect(childCursorGuides.length).toBe(1);
|
||||
});
|
||||
@ -432,10 +432,10 @@ describe('the plugin', function () {
|
||||
});
|
||||
|
||||
it('hides grid lines for all telemetry objects', async () => {
|
||||
let gridLines = Vue.ref(plotViewComponentObject.gridLines);
|
||||
let gridLines = ref(plotViewComponentObject.gridLines);
|
||||
expect(gridLines.value).toBeTrue();
|
||||
gridLines.value = false;
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
expect(gridLines.value).toBeFalse();
|
||||
let gridLinesContainer = element.querySelectorAll('.gl-plot-display-area .js-ticks');
|
||||
let visible = 0;
|
||||
@ -488,7 +488,7 @@ describe('the plugin', function () {
|
||||
max: 10
|
||||
});
|
||||
expect(
|
||||
plotViewComponentObject.$children[0].component.$children[0].$children[1].xScale.domain()
|
||||
plotViewComponentObject.$refs.stackedPlotItems[0].component.$refs.plotComponent.$refs.mctPlot.xScale.domain()
|
||||
).toEqual({
|
||||
min: 0,
|
||||
max: 10
|
||||
@ -505,7 +505,8 @@ describe('the plugin', function () {
|
||||
});
|
||||
|
||||
const yAxesScales =
|
||||
plotViewComponentObject.$children[0].component.$children[0].$children[1].yScale;
|
||||
plotViewComponentObject.$refs.stackedPlotItems[0].component.$refs.plotComponent.$refs
|
||||
.mctPlot.yScale;
|
||||
yAxesScales.forEach((yAxisScale) => {
|
||||
expect(yAxisScale.scale.domain()).toEqual({
|
||||
min: 10,
|
||||
@ -628,7 +629,7 @@ describe('the plugin', function () {
|
||||
);
|
||||
destroyPlotOptions = destroy;
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
viewComponentObject = vNode.componentInstance;
|
||||
});
|
||||
|
||||
@ -783,7 +784,7 @@ describe('the plugin', function () {
|
||||
);
|
||||
destroyPlotOptions = destroy;
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
viewComponentObject = vNode.componentInstance;
|
||||
});
|
||||
|
||||
|
||||
@ -22,7 +22,7 @@
|
||||
|
||||
import EventEmitter from 'EventEmitter';
|
||||
import { createOpenMct, resetApplicationState } from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import TabsLayout from './plugin';
|
||||
|
||||
@ -128,7 +128,7 @@ describe('the plugin', function () {
|
||||
let view = tabsLayoutViewProvider.view(testViewObject, []);
|
||||
view.show(child, true);
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
|
||||
it('provides a view', () => {
|
||||
@ -172,7 +172,7 @@ describe('the plugin', function () {
|
||||
let view = tabsLayoutViewProvider.view(testViewObject, []);
|
||||
view.show(child, true);
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
@ -194,7 +194,7 @@ describe('the plugin', function () {
|
||||
const tab = tabEls[i];
|
||||
|
||||
tab.click();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
const tabViewEls = element.querySelectorAll('.c-tabs-view__object');
|
||||
expect(tabViewEls.length).toEqual(2);
|
||||
@ -204,7 +204,7 @@ describe('the plugin', function () {
|
||||
it('false, will only keep the current tab view loaded', async () => {
|
||||
testViewObject.keep_alive = false;
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
let tabViewEls = element.querySelectorAll('.c-tabs-view__object');
|
||||
|
||||
|
||||
@ -25,7 +25,7 @@ import {
|
||||
resetApplicationState,
|
||||
spyOnBuiltins
|
||||
} from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import TablePlugin from './plugin.js';
|
||||
|
||||
@ -225,7 +225,7 @@ describe('the plugin', () => {
|
||||
|
||||
tableInstance = tableView.getTable();
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
@ -242,7 +242,7 @@ describe('the plugin', () => {
|
||||
|
||||
it('Shows a progress bar while making requests', async () => {
|
||||
tableInstance.incrementOutstandingRequests();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
let progressBar = element.querySelector('.c-progress-bar');
|
||||
|
||||
@ -252,7 +252,7 @@ describe('the plugin', () => {
|
||||
|
||||
it('Renders a row for every telemetry datum returned', async () => {
|
||||
let rows = element.querySelectorAll('table.c-telemetry-table__body tr');
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
expect(rows.length).toBe(3);
|
||||
});
|
||||
|
||||
@ -287,7 +287,7 @@ describe('the plugin', () => {
|
||||
toColumn.dispatchEvent(dragOverEvent);
|
||||
toColumn.dispatchEvent(dropEvent);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
columns = element.querySelectorAll('tr.c-telemetry-table__headers__labels th');
|
||||
let firstColumn = columns[0];
|
||||
let secondColumn = columns[1];
|
||||
@ -305,12 +305,12 @@ describe('the plugin', () => {
|
||||
|
||||
it('Supports filtering telemetry by regular text search', async () => {
|
||||
tableInstance.tableRows.setColumnFilter('some-key', '1');
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
let filteredRowElements = element.querySelectorAll('table.c-telemetry-table__body tr');
|
||||
|
||||
expect(filteredRowElements.length).toEqual(1);
|
||||
tableInstance.tableRows.setColumnFilter('some-key', '');
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
let allRowElements = element.querySelectorAll('table.c-telemetry-table__body tr');
|
||||
expect(allRowElements.length).toEqual(3);
|
||||
@ -318,13 +318,13 @@ describe('the plugin', () => {
|
||||
|
||||
it('Supports filtering using Regex', async () => {
|
||||
tableInstance.tableRows.setColumnRegexFilter('some-key', '^some-value$');
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
let filteredRowElements = element.querySelectorAll('table.c-telemetry-table__body tr');
|
||||
|
||||
expect(filteredRowElements.length).toEqual(0);
|
||||
|
||||
tableInstance.tableRows.setColumnRegexFilter('some-key', '^some-value');
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
let allRowElements = element.querySelectorAll('table.c-telemetry-table__body tr');
|
||||
|
||||
expect(allRowElements.length).toEqual(3);
|
||||
@ -339,7 +339,7 @@ describe('the plugin', () => {
|
||||
tableInstanceConfiguration
|
||||
);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
let tableHeaderElements = element.querySelectorAll('.c-telemetry-table__headers__label');
|
||||
expect(tableHeaderElements.length).toEqual(3);
|
||||
|
||||
@ -350,7 +350,7 @@ describe('the plugin', () => {
|
||||
tableInstanceConfiguration
|
||||
);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
tableHeaderElements = element.querySelectorAll('.c-telemetry-table__headers__label');
|
||||
expect(tableHeaderElements.length).toEqual(4);
|
||||
});
|
||||
@ -364,7 +364,7 @@ describe('the plugin', () => {
|
||||
tableInstanceConfiguration
|
||||
);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
let tableRowCells = element.querySelectorAll(
|
||||
'table.c-telemetry-table__body > tbody > tr:first-child td'
|
||||
);
|
||||
@ -377,7 +377,7 @@ describe('the plugin', () => {
|
||||
tableInstanceConfiguration
|
||||
);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
tableRowCells = element.querySelectorAll(
|
||||
'table.c-telemetry-table__body > tbody > tr:first-child td'
|
||||
);
|
||||
@ -391,7 +391,7 @@ describe('the plugin', () => {
|
||||
// Mark a row
|
||||
firstRow.dispatchEvent(clickEvent);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
// Verify table is paused
|
||||
expect(element.querySelector('div.c-table.is-paused')).not.toBeNull();
|
||||
@ -404,13 +404,13 @@ describe('the plugin', () => {
|
||||
// Mark a row
|
||||
firstRow.dispatchEvent(clickEvent);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
// Verify table is paused
|
||||
expect(element.querySelector('div.c-table.is-paused')).not.toBeNull();
|
||||
|
||||
const currentBounds = openmct.time.bounds();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
const newBounds = {
|
||||
start: currentBounds.start,
|
||||
end: currentBounds.end - 3
|
||||
@ -418,7 +418,7 @@ describe('the plugin', () => {
|
||||
|
||||
// Manually change the time bounds
|
||||
openmct.time.bounds(newBounds);
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
// Verify table is no longer paused
|
||||
expect(element.querySelector('div.c-table.is-paused')).toBeNull();
|
||||
@ -429,13 +429,13 @@ describe('the plugin', () => {
|
||||
|
||||
// Pause by button
|
||||
viewContext.togglePauseByButton();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
// Verify table is paused
|
||||
expect(element.querySelector('div.c-table.is-paused')).not.toBeNull();
|
||||
|
||||
const currentBounds = openmct.time.bounds();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
const newBounds = {
|
||||
start: currentBounds.start,
|
||||
@ -444,7 +444,7 @@ describe('the plugin', () => {
|
||||
// Manually change the time bounds
|
||||
openmct.time.bounds(newBounds);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
// Verify table is no longer paused
|
||||
expect(element.querySelector('div.c-table.is-paused')).toBeNull();
|
||||
@ -456,7 +456,7 @@ describe('the plugin', () => {
|
||||
// Pause by button
|
||||
viewContext.togglePauseByButton();
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
// Verify table displays the correct number of rows
|
||||
let tableRows = element.querySelectorAll('table.c-telemetry-table__body > tbody > tr');
|
||||
@ -468,12 +468,12 @@ describe('the plugin', () => {
|
||||
// Tick the clock
|
||||
openmct.time.tick(1);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
// Verify table is still paused
|
||||
expect(element.querySelector('div.c-table.is-paused')).not.toBeNull();
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
// Verify table displays the correct number of rows
|
||||
tableRows = element.querySelectorAll('table.c-telemetry-table__body > tbody > tr');
|
||||
|
||||
@ -21,7 +21,7 @@
|
||||
*****************************************************************************/
|
||||
|
||||
import { createMouseEvent, createOpenMct, resetApplicationState } from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import { FIXED_MODE_KEY } from '../../api/time/constants';
|
||||
import { getPreciseDuration, millisecondsToDHMS } from '../../utils/duration';
|
||||
@ -80,7 +80,7 @@ describe('time conductor', () => {
|
||||
start: config.menuOptions[0].bounds.start,
|
||||
end: config.menuOptions[0].bounds.end
|
||||
});
|
||||
Vue.nextTick(() => {
|
||||
nextTick(() => {
|
||||
done();
|
||||
});
|
||||
});
|
||||
@ -118,18 +118,18 @@ describe('time conductor', () => {
|
||||
const switcher = appHolder.querySelector('.is-fixed-mode');
|
||||
const clickEvent = createMouseEvent('click');
|
||||
switcher.dispatchEvent(clickEvent);
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
const modeButton = switcher.querySelector('.c-tc-input-popup .c-button--menu');
|
||||
const clickEvent1 = createMouseEvent('click');
|
||||
modeButton.dispatchEvent(clickEvent1);
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
const clockItem = document.querySelectorAll(
|
||||
'.c-conductor__mode-menu .c-super-menu__menu li'
|
||||
)[1];
|
||||
const clickEvent2 = createMouseEvent('click');
|
||||
clockItem.dispatchEvent(clickEvent2);
|
||||
await Vue.nextTick();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
await nextTick();
|
||||
});
|
||||
|
||||
it('shows delta inputs', () => {
|
||||
|
||||
@ -21,7 +21,7 @@
|
||||
*****************************************************************************/
|
||||
|
||||
import EventEmitter from 'EventEmitter';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import { createOpenMct, resetApplicationState } from '@/utils/testing';
|
||||
|
||||
@ -184,11 +184,11 @@ describe('the plugin', function () {
|
||||
let view = timelineView.view(testViewObject, mockObjectPath);
|
||||
view.show(child, true);
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
|
||||
it('provides a view', async () => {
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
expect(timelineView).toBeDefined();
|
||||
});
|
||||
|
||||
@ -240,12 +240,12 @@ describe('the plugin', function () {
|
||||
let view = timelineView.view(timelineDomainObject, [timelineDomainObject]);
|
||||
view.show(child, true);
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
|
||||
xit('loads the plan from composition', async () => {
|
||||
await Vue.nextTick();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
await nextTick();
|
||||
const items = element.querySelectorAll('.js-timeline__content');
|
||||
expect(items.length).toEqual(1);
|
||||
});
|
||||
@ -267,11 +267,11 @@ describe('the plugin', function () {
|
||||
let view = timelineView.view(testViewObject, mockObjectPath);
|
||||
view.show(child, true);
|
||||
|
||||
Vue.nextTick(done);
|
||||
nextTick(done);
|
||||
});
|
||||
|
||||
xit('displays an independent time conductor with saved options - local clock', () => {
|
||||
return Vue.nextTick(() => {
|
||||
return nextTick(() => {
|
||||
const independentTimeConductorEl = element.querySelector(
|
||||
'.c-timeline-holder > .c-conductor__controls'
|
||||
);
|
||||
@ -308,11 +308,11 @@ describe('the plugin', function () {
|
||||
let view = timelineView.view(testViewObject2, mockObjectPath);
|
||||
view.show(child, true);
|
||||
|
||||
Vue.nextTick(done);
|
||||
nextTick(done);
|
||||
});
|
||||
|
||||
xit('displays an independent time conductor with saved options - fixed timespan', () => {
|
||||
return Vue.nextTick(() => {
|
||||
return nextTick(() => {
|
||||
const independentTimeConductorEl = element.querySelector(
|
||||
'.c-timeline-holder > .c-conductor__controls'
|
||||
);
|
||||
|
||||
@ -22,7 +22,7 @@
|
||||
|
||||
import EventEmitter from 'EventEmitter';
|
||||
import { createOpenMct, resetApplicationState } from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import { FIXED_MODE_KEY } from '../../api/time/constants';
|
||||
import { TIMELIST_TYPE } from './constants';
|
||||
@ -210,7 +210,7 @@ describe('the plugin', function () {
|
||||
let view = timelistView.view(timelistDomainObject, []);
|
||||
view.show(child, true);
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
|
||||
it('displays the activities', () => {
|
||||
@ -226,7 +226,7 @@ describe('the plugin', function () {
|
||||
it('displays activity details', (done) => {
|
||||
const timeFormat = openmct.time.timeSystem().timeFormat;
|
||||
const timeFormatter = openmct.telemetry.getValueFormatter({ format: timeFormat }).formatter;
|
||||
Vue.nextTick(() => {
|
||||
nextTick(() => {
|
||||
const itemEls = element.querySelectorAll(LIST_ITEM_CLASS);
|
||||
const itemValues = itemEls[0].querySelectorAll(LIST_ITEM_VALUE_CLASS);
|
||||
expect(itemValues.length).toEqual(4);
|
||||
@ -287,13 +287,13 @@ describe('the plugin', function () {
|
||||
let view = timelistView.view(timelistDomainObject, [timelistDomainObject]);
|
||||
view.show(child, true);
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
|
||||
it('loads the plan from composition', () => {
|
||||
mockComposition.emit('add', planObject);
|
||||
|
||||
return Vue.nextTick(() => {
|
||||
return nextTick(() => {
|
||||
const items = element.querySelectorAll(LIST_ITEM_CLASS);
|
||||
expect(items.length).toEqual(2);
|
||||
});
|
||||
@ -342,13 +342,13 @@ describe('the plugin', function () {
|
||||
let view = timelistView.view(timelistDomainObject, [timelistDomainObject]);
|
||||
view.show(child, true);
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
|
||||
it('activities', () => {
|
||||
mockComposition.emit('add', planObject);
|
||||
|
||||
return Vue.nextTick(() => {
|
||||
return nextTick(() => {
|
||||
const items = element.querySelectorAll(LIST_ITEM_CLASS);
|
||||
expect(items.length).toEqual(1);
|
||||
});
|
||||
@ -397,13 +397,13 @@ describe('the plugin', function () {
|
||||
let view = timelistView.view(timelistDomainObject, [timelistDomainObject]);
|
||||
view.show(child, true);
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
|
||||
it('hides past events', () => {
|
||||
mockComposition.emit('add', planObject);
|
||||
|
||||
return Vue.nextTick(() => {
|
||||
return nextTick(() => {
|
||||
const items = element.querySelectorAll(LIST_ITEM_CLASS);
|
||||
expect(items.length).toEqual(1);
|
||||
});
|
||||
|
||||
@ -21,7 +21,7 @@
|
||||
*****************************************************************************/
|
||||
|
||||
import { createOpenMct, resetApplicationState, spyOnBuiltins } from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import timerPlugin from './plugin';
|
||||
|
||||
@ -108,7 +108,7 @@ xdescribe('Timer plugin:', () => {
|
||||
timerView = timerViewProvider.view(mutableTimerObject, timerObjectPath);
|
||||
timerView.show(child);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
@ -168,7 +168,7 @@ xdescribe('Timer plugin:', () => {
|
||||
timerView = timerViewProvider.view(mutableTimerObject, timerObjectPath);
|
||||
timerView.show(child);
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
@ -211,7 +211,7 @@ xdescribe('Timer plugin:', () => {
|
||||
});
|
||||
|
||||
it('gets errors from actions if configuration is not passed', async () => {
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
const objectPath = _.cloneDeep(timerObjectPath);
|
||||
delete objectPath[0].configuration;
|
||||
|
||||
@ -265,7 +265,7 @@ xdescribe('Timer plugin:', () => {
|
||||
openmct.objects.mutate(timerViewObject, 'configuration.timestamp', newBaseTime);
|
||||
|
||||
jasmine.clock().tick(5000);
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
const timerElement = element.querySelector('.c-timer');
|
||||
const timerPausePlayButton = timerElement.querySelector('.c-timer__ctrl-pause-play');
|
||||
@ -282,7 +282,7 @@ xdescribe('Timer plugin:', () => {
|
||||
openmct.objects.mutate(timerViewObject, 'configuration.timestamp', newBaseTime);
|
||||
|
||||
jasmine.clock().tick(5000);
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
const timerElement = element.querySelector('.c-timer');
|
||||
const timerPausePlayButton = timerElement.querySelector('.c-timer__ctrl-pause-play');
|
||||
@ -296,14 +296,14 @@ xdescribe('Timer plugin:', () => {
|
||||
|
||||
it('displays a paused timer correctly in the DOM', async () => {
|
||||
jasmine.clock().tick(5000);
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
let action = openmct.actions.getAction('timer.pause');
|
||||
if (action) {
|
||||
action.invoke(timerObjectPath, timerView);
|
||||
}
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
const timerElement = element.querySelector('.c-timer');
|
||||
const timerPausePlayButton = timerElement.querySelector('.c-timer__ctrl-pause-play');
|
||||
let timerValue = timerElement.querySelector('.c-timer__value').innerText;
|
||||
@ -312,7 +312,7 @@ xdescribe('Timer plugin:', () => {
|
||||
expect(timerValue).toBe('0D 23:59:55');
|
||||
|
||||
jasmine.clock().tick(5000);
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
expect(timerValue).toBe('0D 23:59:55');
|
||||
|
||||
action = openmct.actions.getAction('timer.start');
|
||||
@ -320,13 +320,13 @@ xdescribe('Timer plugin:', () => {
|
||||
action.invoke(timerObjectPath, timerView);
|
||||
}
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
action = openmct.actions.getAction('timer.pause');
|
||||
if (action) {
|
||||
action.invoke(timerObjectPath, timerView);
|
||||
}
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
timerValue = timerElement.querySelector('.c-timer__value').innerText;
|
||||
expect(timerValue).toBe('1D 00:00:00');
|
||||
});
|
||||
@ -337,7 +337,7 @@ xdescribe('Timer plugin:', () => {
|
||||
action.invoke(timerObjectPath, timerView);
|
||||
}
|
||||
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
const timerElement = element.querySelector('.c-timer');
|
||||
const timerValue = timerElement.querySelector('.c-timer__value').innerText;
|
||||
const timerResetButton = timerElement.querySelector('.c-timer__ctrl-reset');
|
||||
@ -355,7 +355,7 @@ xdescribe('Timer plugin:', () => {
|
||||
}
|
||||
|
||||
jasmine.clock().tick(5000);
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
const timerElement = element.querySelector('.c-timer');
|
||||
const timerValue = timerElement.querySelector('.c-timer__value').innerText;
|
||||
const timerPausePlayButton = timerElement.querySelector('.c-timer__ctrl-pause-play');
|
||||
|
||||
@ -21,7 +21,7 @@
|
||||
*****************************************************************************/
|
||||
|
||||
import { createOpenMct, resetApplicationState } from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import ExampleUserProvider from '../../../example/exampleUser/ExampleUserProvider';
|
||||
|
||||
@ -69,7 +69,7 @@ describe('The User Indicator plugin', () => {
|
||||
|
||||
openmct.user.setProvider(provider);
|
||||
|
||||
return Vue.nextTick();
|
||||
return nextTick();
|
||||
});
|
||||
|
||||
it('exists', () => {
|
||||
@ -85,7 +85,7 @@ describe('The User Indicator plugin', () => {
|
||||
openmct.user
|
||||
.getCurrentUser()
|
||||
.then(async (user) => {
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
userIndicator = openmct.indicators.indicatorObjects.find(
|
||||
(indicator) => indicator.key === 'user-indicator'
|
||||
|
||||
@ -27,6 +27,7 @@
|
||||
|
||||
<script>
|
||||
import _ from 'lodash';
|
||||
import { toRaw } from 'vue';
|
||||
|
||||
import StyleRuleManager from '@/plugins/condition/StyleRuleManager';
|
||||
import { STYLE_CONSTANTS } from '@/plugins/condition/utils/constants';
|
||||
@ -272,16 +273,16 @@ export default {
|
||||
|
||||
if (provider.edit && this.showEditView) {
|
||||
if (this.openmct.editor.isEditing()) {
|
||||
this.currentView = provider.edit(this.domainObject, true, objectPath);
|
||||
this.currentView = provider.edit(toRaw(this.domainObject), true, objectPath);
|
||||
} else {
|
||||
this.currentView = provider.view(this.domainObject, objectPath);
|
||||
this.currentView = provider.view(toRaw(this.domainObject), objectPath);
|
||||
}
|
||||
|
||||
this.openmct.editor.on('isEditing', this.toggleEditView);
|
||||
this.releaseEditModeHandler = () =>
|
||||
this.openmct.editor.off('isEditing', this.toggleEditView);
|
||||
} else {
|
||||
this.currentView = provider.view(this.domainObject, objectPath);
|
||||
this.currentView = provider.view(toRaw(this.domainObject), objectPath);
|
||||
|
||||
if (this.currentView.onEditModeChange) {
|
||||
this.openmct.editor.on('isEditing', this.invokeEditModeHandler);
|
||||
@ -439,7 +440,7 @@ export default {
|
||||
if (
|
||||
provider &&
|
||||
provider.canEdit &&
|
||||
provider.canEdit(this.domainObject, objectPath) &&
|
||||
provider.canEdit(toRaw(this.domainObject), objectPath) &&
|
||||
this.isEditingAllowed() &&
|
||||
!this.openmct.editor.isEditing()
|
||||
) {
|
||||
|
||||
@ -20,16 +20,16 @@
|
||||
at runtime from the About dialog for additional information.
|
||||
-->
|
||||
<template>
|
||||
<div class="c-search" :class="{ 'is-active': active }">
|
||||
<div class="c-search" v-bind="$attrs" :class="{ 'is-active': active }">
|
||||
<input
|
||||
v-bind="$attrs"
|
||||
class="c-search__input"
|
||||
aria-label="Search Input"
|
||||
tabindex="10000"
|
||||
type="search"
|
||||
:value="value"
|
||||
@input="handleInput"
|
||||
@click="handleClick"
|
||||
v-bind="$attrs"
|
||||
@click="() => $emit('click')"
|
||||
@input="($event) => $emit('input', $event.target.value)"
|
||||
/>
|
||||
<a v-if="value" class="c-search__clear-input icon-x-in-circle" @click="clearInput"></a>
|
||||
<slot></slot>
|
||||
@ -46,7 +46,7 @@ export default {
|
||||
}
|
||||
},
|
||||
emits: ['input', 'clear', 'click'],
|
||||
data: function () {
|
||||
data() {
|
||||
return {
|
||||
active: false
|
||||
};
|
||||
@ -61,12 +61,6 @@ export default {
|
||||
// Clear the user's input and set 'active' to false
|
||||
this.$emit('clear', '');
|
||||
this.active = false;
|
||||
},
|
||||
handleInput(event) {
|
||||
this.$emit('input', event.target.value);
|
||||
},
|
||||
handleClick() {
|
||||
this.$emit('click');
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@ -21,7 +21,7 @@
|
||||
*****************************************************************************/
|
||||
|
||||
import { createOpenMct, resetApplicationState } from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
const INSPECTOR_SELECTOR_PREFIX = '.c-inspect-properties__';
|
||||
|
||||
@ -67,7 +67,7 @@ describe('the inspector', () => {
|
||||
|
||||
it('displays default details for selection', async () => {
|
||||
openmct.selection.select(selection);
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
const details = getDetails();
|
||||
const [title, type, createdBy, modifiedBy, notes, timestamp] = details;
|
||||
@ -92,7 +92,7 @@ describe('the inspector', () => {
|
||||
folderItem.modified = modifiedTimestamp;
|
||||
|
||||
openmct.selection.select(selection);
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
const details = getDetails();
|
||||
const timestamp = details[details.length - 1];
|
||||
@ -115,7 +115,7 @@ describe('the inspector', () => {
|
||||
selection[0].context.details = customDetails;
|
||||
|
||||
openmct.selection.select(selection);
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
const details = getDetails();
|
||||
|
||||
|
||||
@ -60,11 +60,11 @@ describe('the inspector', () => {
|
||||
stylesViewComponent = createViewComponent(StylesView, selection, openmct);
|
||||
savedStylesViewComponent = createViewComponent(SavedStylesView, selection, openmct);
|
||||
|
||||
expect(savedStylesViewComponent.$children[0].savedStyles.length).toBe(0);
|
||||
expect(savedStylesViewComponent.$refs.root.savedStyles.length).toBe(0);
|
||||
|
||||
stylesViewComponent.$children[0].saveStyle(mockStyle);
|
||||
stylesViewComponent.$refs.root.saveStyle(mockStyle);
|
||||
|
||||
expect(savedStylesViewComponent.$children[0].savedStyles.length).toBe(1);
|
||||
expect(savedStylesViewComponent.$refs.root.savedStyles.length).toBe(1);
|
||||
});
|
||||
|
||||
it('should display all saved styles', () => {
|
||||
@ -72,11 +72,11 @@ describe('the inspector', () => {
|
||||
stylesViewComponent = createViewComponent(StylesView, selection, openmct);
|
||||
savedStylesViewComponent = createViewComponent(SavedStylesView, selection, openmct);
|
||||
|
||||
expect(savedStylesViewComponent.$children[0].$children.length).toBe(0);
|
||||
stylesViewComponent.$children[0].saveStyle(mockStyle);
|
||||
expect(savedStylesViewComponent.$refs.root.savedStyles.length).toBe(0);
|
||||
stylesViewComponent.$refs.root.saveStyle(mockStyle);
|
||||
|
||||
return stylesViewComponent.$nextTick().then(() => {
|
||||
expect(savedStylesViewComponent.$children[0].$children.length).toBe(1);
|
||||
expect(savedStylesViewComponent.$refs.root.savedStyles.length).toBe(1);
|
||||
});
|
||||
});
|
||||
|
||||
@ -87,17 +87,15 @@ describe('the inspector', () => {
|
||||
stylesViewComponent = createViewComponent(StylesView, selection, openmct);
|
||||
savedStylesViewComponent = createViewComponent(SavedStylesView, selection, openmct);
|
||||
|
||||
stylesViewComponent.$children[0].saveStyle(mockStyle);
|
||||
stylesViewComponent.$refs.root.saveStyle(mockStyle);
|
||||
|
||||
return stylesViewComponent.$nextTick().then(() => {
|
||||
const styleSelectorComponent = savedStylesViewComponent.$children[0].$children[0];
|
||||
const styleSelectorComponent = savedStylesViewComponent.$refs.root.$refs.root;
|
||||
|
||||
styleSelectorComponent.selectStyle();
|
||||
|
||||
return savedStylesViewComponent.$nextTick().then(() => {
|
||||
const styleEditorComponentIndex = stylesViewComponent.$children[0].$children.length - 1;
|
||||
const styleEditorComponent =
|
||||
stylesViewComponent.$children[0].$children[styleEditorComponentIndex];
|
||||
const styleEditorComponent = stylesViewComponent.$refs.root.$refs.styleEditor;
|
||||
const styles = styleEditorComponent.$children.filter(
|
||||
(component) => component.options.value === mockStyle.color
|
||||
);
|
||||
@ -112,13 +110,13 @@ describe('the inspector', () => {
|
||||
stylesViewComponent = createViewComponent(StylesView, selection, openmct);
|
||||
savedStylesViewComponent = createViewComponent(SavedStylesView, selection, openmct);
|
||||
|
||||
stylesViewComponent.$children[0].saveStyle(mockStyle);
|
||||
stylesViewComponent.$refs.root.saveStyle(mockStyle);
|
||||
|
||||
expect(savedStylesViewComponent.$children[0].savedStyles.length).toBe(1);
|
||||
expect(savedStylesViewComponent.$refs.root.savedStyles.length).toBe(1);
|
||||
|
||||
savedStylesViewComponent.$children[0].deleteStyle(0);
|
||||
savedStylesViewComponent.$refs.root.deleteStyle(0);
|
||||
|
||||
expect(savedStylesViewComponent.$children[0].savedStyles.length).toBe(0);
|
||||
expect(savedStylesViewComponent.$refs.root.savedStyles.length).toBe(0);
|
||||
});
|
||||
|
||||
it('should prevent a style from being saved when the number of saved styles is at the limit', () => {
|
||||
@ -129,16 +127,16 @@ describe('the inspector', () => {
|
||||
savedStylesViewComponent = createViewComponent(SavedStylesView, selection, openmct);
|
||||
|
||||
for (let i = 1; i <= 20; i++) {
|
||||
stylesViewComponent.$children[0].saveStyle(mockStyle);
|
||||
stylesViewComponent.$refs.root.saveStyle(mockStyle);
|
||||
}
|
||||
|
||||
expect(SavedStylesView.methods.showLimitReachedDialog).not.toHaveBeenCalled();
|
||||
expect(savedStylesViewComponent.$children[0].savedStyles.length).toBe(20);
|
||||
expect(savedStylesViewComponent.$refs.root.savedStyles.length).toBe(20);
|
||||
|
||||
stylesViewComponent.$children[0].saveStyle(mockStyle);
|
||||
stylesViewComponent.$refs.root.saveStyle(mockStyle);
|
||||
|
||||
expect(SavedStylesView.methods.showLimitReachedDialog).toHaveBeenCalled();
|
||||
expect(savedStylesViewComponent.$children[0].savedStyles.length).toBe(20);
|
||||
expect(savedStylesViewComponent.$refs.root.savedStyles.length).toBe(20);
|
||||
});
|
||||
|
||||
it('should allow styles from multi-selections to be saved', () => {
|
||||
@ -149,17 +147,14 @@ describe('the inspector', () => {
|
||||
savedStylesViewComponent = createViewComponent(SavedStylesView, selection, openmct);
|
||||
|
||||
return stylesViewComponent.$nextTick().then(() => {
|
||||
const styleEditorComponentIndex = stylesViewComponent.$children[0].$children.length - 1;
|
||||
const styleEditorComponent =
|
||||
stylesViewComponent.$children[0].$children[styleEditorComponentIndex];
|
||||
const saveStyleButtonIndex = styleEditorComponent.$children.length - 1;
|
||||
const saveStyleButton = styleEditorComponent.$children[saveStyleButtonIndex];
|
||||
const styleEditorComponent = stylesViewComponent.$refs.root.$refs.styleEditor;
|
||||
const saveStyleButton = styleEditorComponent.$refs.saveStyleButton;
|
||||
|
||||
expect(saveStyleButton.$listeners.click).not.toBe(undefined);
|
||||
expect(saveStyleButton).not.toBe(undefined);
|
||||
|
||||
saveStyleButton.$listeners.click();
|
||||
saveStyleButton.$refs.button.click();
|
||||
|
||||
expect(savedStylesViewComponent.$children[0].savedStyles.length).toBe(1);
|
||||
expect(savedStylesViewComponent.$refs.root.$data.savedStyles.length).toBe(1);
|
||||
});
|
||||
});
|
||||
|
||||
@ -171,13 +166,11 @@ describe('the inspector', () => {
|
||||
savedStylesViewComponent = createViewComponent(SavedStylesView, selection, openmct);
|
||||
|
||||
return stylesViewComponent.$nextTick().then(() => {
|
||||
const styleEditorComponentIndex = stylesViewComponent.$children[0].$children.length - 1;
|
||||
const styleEditorComponent =
|
||||
stylesViewComponent.$children[0].$children[styleEditorComponentIndex];
|
||||
const saveStyleButtonIndex = styleEditorComponent.$children.length - 1;
|
||||
const saveStyleButton = styleEditorComponent.$children[saveStyleButtonIndex];
|
||||
const styleEditorComponent = stylesViewComponent.$refs.root.$refs.styleEditor;
|
||||
const saveStyleButton = styleEditorComponent.$refs.saveStyleButton;
|
||||
|
||||
expect(saveStyleButton.$listeners.click).toBe(undefined);
|
||||
// Saving should not be enabled, thus the button ref should be undefined
|
||||
expect(saveStyleButton).toBe(undefined);
|
||||
});
|
||||
});
|
||||
|
||||
@ -189,13 +182,11 @@ describe('the inspector', () => {
|
||||
savedStylesViewComponent = createViewComponent(SavedStylesView, selection, openmct);
|
||||
|
||||
return stylesViewComponent.$nextTick().then(() => {
|
||||
const styleEditorComponentIndex = stylesViewComponent.$children[0].$children.length - 1;
|
||||
const styleEditorComponent =
|
||||
stylesViewComponent.$children[0].$children[styleEditorComponentIndex];
|
||||
const saveStyleButtonIndex = styleEditorComponent.$children.length - 1;
|
||||
const saveStyleButton = styleEditorComponent.$children[saveStyleButtonIndex];
|
||||
const styleEditorComponent = stylesViewComponent.$refs.root.$refs.styleEditor;
|
||||
const saveStyleButton = styleEditorComponent.$refs.saveStyleButton;
|
||||
|
||||
expect(saveStyleButton.$listeners.click).toBe(undefined);
|
||||
// Saving should not be enabled, thus the button ref should be undefined
|
||||
expect(saveStyleButton).toBe(undefined);
|
||||
});
|
||||
});
|
||||
|
||||
@ -211,7 +202,7 @@ describe('the inspector', () => {
|
||||
stylesManager
|
||||
},
|
||||
components: {},
|
||||
template: `<${component.name} />`
|
||||
template: `<${component.name} ref="root"/>`
|
||||
};
|
||||
|
||||
config.components[component.name] = component;
|
||||
|
||||
@ -22,7 +22,7 @@
|
||||
|
||||
import mount from 'utils/mount';
|
||||
import { createOpenMct, resetApplicationState } from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import Layout from './AppLayout.vue';
|
||||
|
||||
@ -48,7 +48,7 @@ describe('Open MCT Layout:', () => {
|
||||
describe('the pane:', () => {
|
||||
it('is displayed on layout load', async () => {
|
||||
await createLayout();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
Object.entries(components).forEach(([name, component]) => {
|
||||
expect(component.pane).toBeTruthy();
|
||||
@ -61,8 +61,8 @@ describe('Open MCT Layout:', () => {
|
||||
setHideParams();
|
||||
|
||||
await createLayout();
|
||||
await Vue.nextTick();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
await nextTick();
|
||||
|
||||
Object.entries(components).forEach(([name, component]) => {
|
||||
expect(isCollapsed(component.pane)).toBeTrue();
|
||||
@ -71,9 +71,9 @@ describe('Open MCT Layout:', () => {
|
||||
|
||||
it('on toggle collapses if expanded', async () => {
|
||||
await createLayout();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
toggleCollapseButtons();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
|
||||
Object.entries(components).forEach(([name, component]) => {
|
||||
expect(openmct.router.getSearchParam(component.param)).toEqual('true');
|
||||
@ -86,7 +86,7 @@ describe('Open MCT Layout:', () => {
|
||||
setHideParams();
|
||||
|
||||
await createLayout();
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
toggleExpandButtons();
|
||||
|
||||
Object.entries(components).forEach(([name, component]) => {
|
||||
|
||||
@ -187,7 +187,7 @@ export default {
|
||||
const clickedPreviewClose =
|
||||
event.target.parentElement &&
|
||||
event.target.parentElement.querySelector('.js-preview-window');
|
||||
const searchResultsDropDown = this.$refs.searchResultsDropDown._data;
|
||||
const searchResultsDropDown = this.$refs.searchResultsDropDown._.data;
|
||||
if (
|
||||
!clickedInsideDropdown &&
|
||||
searchResultsDropDown.resultsShown &&
|
||||
|
||||
@ -22,7 +22,7 @@
|
||||
|
||||
import mount from 'utils/mount';
|
||||
import { createOpenMct, resetApplicationState } from 'utils/testing';
|
||||
import Vue from 'vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
import ExampleTagsPlugin from '../../../../example/exampleTags/plugin';
|
||||
import DisplayLayoutPlugin from '../../../plugins/displayLayout/plugin';
|
||||
@ -197,7 +197,7 @@ describe('GrandSearch', () => {
|
||||
provide: {
|
||||
openmct
|
||||
},
|
||||
template: '<GrandSearch/>'
|
||||
template: '<GrandSearch ref="root"/>'
|
||||
},
|
||||
{
|
||||
element: viewContainer
|
||||
@ -205,7 +205,7 @@ describe('GrandSearch', () => {
|
||||
);
|
||||
grandSearchComponent = vNode.componentInstance;
|
||||
_destroy = destroy;
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
done();
|
||||
});
|
||||
openmct.startHeadless();
|
||||
@ -220,8 +220,8 @@ describe('GrandSearch', () => {
|
||||
});
|
||||
|
||||
it('should render an object search result', async () => {
|
||||
await grandSearchComponent.$children[0].searchEverything('foo');
|
||||
await Vue.nextTick();
|
||||
await grandSearchComponent.$refs.root.searchEverything('foo');
|
||||
await nextTick();
|
||||
const searchResults = document.querySelectorAll(
|
||||
'[aria-label="fooRabbitNotebook notebook result"]'
|
||||
);
|
||||
@ -233,9 +233,9 @@ describe('GrandSearch', () => {
|
||||
const composition = openmct.composition.get(mockFolderObject);
|
||||
composition.add(mockNewObject);
|
||||
// after adding, need to wait a beat for the folder to be indexed
|
||||
await Vue.nextTick();
|
||||
await grandSearchComponent.$children[0].searchEverything('apple');
|
||||
await Vue.nextTick();
|
||||
await nextTick();
|
||||
await grandSearchComponent.$refs.root.searchEverything('apple');
|
||||
await nextTick();
|
||||
const searchResults = document.querySelectorAll(
|
||||
'[aria-label="New Apple Test Folder folder result"]'
|
||||
);
|
||||
@ -259,8 +259,8 @@ describe('GrandSearch', () => {
|
||||
|
||||
const composition = openmct.composition.get(mockFolderObject);
|
||||
composition.add(mockNewObject);
|
||||
await grandSearchComponent.$children[0].searchEverything('apple');
|
||||
await Vue.nextTick();
|
||||
await grandSearchComponent.$refs.root.searchEverything('apple');
|
||||
await nextTick();
|
||||
const searchResults = document.querySelectorAll(
|
||||
'[aria-label="New Apple Test Folder folder result"]'
|
||||
);
|
||||
@ -270,24 +270,24 @@ describe('GrandSearch', () => {
|
||||
});
|
||||
|
||||
it('should render an annotation search result', async () => {
|
||||
await grandSearchComponent.$children[0].searchEverything('S');
|
||||
await Vue.nextTick();
|
||||
await grandSearchComponent.$refs.root.searchEverything('S');
|
||||
await nextTick();
|
||||
const annotationResults = document.querySelectorAll('[aria-label="Search Result"]');
|
||||
expect(annotationResults.length).toBe(2);
|
||||
expect(annotationResults[1].innerText).toContain('Driving');
|
||||
});
|
||||
|
||||
it('should render no annotation search results if no match', async () => {
|
||||
await grandSearchComponent.$children[0].searchEverything('Qbert');
|
||||
await Vue.nextTick();
|
||||
await grandSearchComponent.$refs.root.searchEverything('Qbert');
|
||||
await nextTick();
|
||||
const annotationResults = document.querySelectorAll('[aria-label="Search Result"]');
|
||||
expect(annotationResults.length).toBe(0);
|
||||
});
|
||||
|
||||
it('should preview object search results in edit mode if object clicked', async () => {
|
||||
await grandSearchComponent.$children[0].searchEverything('Folder');
|
||||
grandSearchComponent.$children[0].openmct.router.path = [mockDisplayLayout];
|
||||
await Vue.nextTick();
|
||||
await grandSearchComponent.$refs.root.searchEverything('Folder');
|
||||
grandSearchComponent.$refs.root.openmct.router.path = [mockDisplayLayout];
|
||||
await nextTick();
|
||||
const searchResults = document.querySelectorAll('[name="Test Folder"]');
|
||||
expect(searchResults.length).toBe(1);
|
||||
expect(searchResults[0].innerText).toContain('Folder');
|
||||
@ -297,9 +297,9 @@ describe('GrandSearch', () => {
|
||||
});
|
||||
|
||||
it('should preview annotation search results in edit mode if annotation clicked', async () => {
|
||||
await grandSearchComponent.$children[0].searchEverything('Dri');
|
||||
grandSearchComponent.$children[0].openmct.router.path = [mockDisplayLayout];
|
||||
await Vue.nextTick();
|
||||
await grandSearchComponent.$refs.root.searchEverything('Dri');
|
||||
grandSearchComponent.$refs.root.openmct.router.path = [mockDisplayLayout];
|
||||
await nextTick();
|
||||
const annotationResults = document.querySelectorAll('[aria-label="Search Result"]');
|
||||
expect(annotationResults.length).toBe(1);
|
||||
expect(annotationResults[0].innerText).toContain('Driving');
|
||||
|
||||
@ -22,6 +22,7 @@
|
||||
<template>
|
||||
<div class="c-ctrl-wrapper">
|
||||
<div
|
||||
ref="button"
|
||||
class="c-icon-button"
|
||||
:title="options.title"
|
||||
:class="{
|
||||
|
||||
Loading…
Reference in New Issue
Block a user