ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2024-12-19 21:27:52 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

do not show loaded tabs before showing current tab (#6424)

Browse Source 
* do not show loaded tabs before showing current tab

* clean up logic to show added tabs

* fix unit tests

* remove unnecessary mocks

* handle objects current tab when last tab removed

---------

Co-authored-by: Shefali Joshi <simplyrender@gmail.com>
This commit is contained in:
David Tsay 2023-03-15 15:29:27 -07:00 committed by GitHub
parent 22cc28d733
commit 0b3e0e7efd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 24 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/plugins/tabs/components/tabs.vue
View File

@ -105,7 +105,7 @@ export default {
currentTab: {},
currentTabIndex: undefined,
tabsList: [],
setCurrentTab: true,
setCurrentTab: false,
isDragging: false,
allowDrop: false,
searchTabKey: `tabs.pos.${keyString}`,
@ -122,7 +122,8 @@ export default {
this.composition.on('add', this.addItem);
this.composition.on('remove', this.removeItem);
this.composition.on('reorder', this.onReorder);
this.composition.load().then(() => {
this.composition.load().then(tabObjects => {
let currentTabIndexFromURL = this.openmct.router.getSearchParam(this.searchTabKey);
let currentTabIndexFromDomainObject = this.internalDomainObject.currentTabIndex;
@ -131,6 +132,11 @@ export default {
} else if (currentTabIndexFromDomainObject !== undefined) {
this.setCurrentTabByIndex(currentTabIndexFromDomainObject);
this.storeCurrentTabIndexInURL(currentTabIndexFromDomainObject);
} else if (tabObjects?.length) {
this.setCurrentTabByIndex(0);
this.storeCurrentTabIndexInURL(0);
} else {
this.setCurrentTab = true;
}
});
}
@ -204,6 +210,7 @@ export default {
}
this.currentTab = tab;
this.setCurrentTab = false;
this.addTabToLoaded(tab);
},
shouldLoadTab(tab) {
@ -263,11 +270,11 @@ export default {
if (this.setCurrentTab) {
this.showTab(tabItem);
this.setCurrentTab = false;
}
},
reset() {
this.currentTab = {};
this.currentTabIndex = undefined;
this.setCurrentTab = true;
},
removeItem(identifier) {
@ -302,7 +309,6 @@ export default {
});
},
onDrop(e) {
this.setCurrentTab = true;
this.storeCurrentTabIndexInURL(this.tabsList.length);
},
dragstart(e) {

48
src/plugins/tabs/pluginSpec.js
View File

@ -22,8 +22,7 @@
import {
createOpenMct,
resetApplicationState,
spyOnBuiltins
resetApplicationState
} from 'utils/testing';
import TabsLayout from './plugin';
import Vue from "vue";
@ -35,9 +34,8 @@ describe('the plugin', function () {
let openmct;
let tabsLayoutDefinition;
const testViewObject = {
id: 'af3f0e11-354e-48b5-9887-de47dfb6ecf6',
identifier: {
key: 'af3f0e11-354e-48b5-9887-de47dfb6ecf6',
key: 'mock-tabs-object',
namespace: ''
},
type: 'tabs',
@ -47,13 +45,13 @@ describe('the plugin', function () {
{
'identifier': {
'namespace': '',
'key': '55122607-e65e-44d5-9c9d-9c31a914ca89'
'key': 'swg-1'
}
},
{
'identifier': {
'namespace': '',
'key': '55122607-e65e-44d5-9c9d-9c31a914ca90'
'key': 'swg-2'
}
}
]
@ -74,18 +72,16 @@ describe('the plugin', function () {
};
let telemetryItem1 = Object.assign({}, telemetryItemTemplate, {
'name': 'Sine Wave Generator 1',
'id': '55122607-e65e-44d5-9c9d-9c31a914ca89',
'identifier': {
'namespace': '',
'key': '55122607-e65e-44d5-9c9d-9c31a914ca89'
'key': 'swg-1'
}
});
let telemetryItem2 = Object.assign({}, telemetryItemTemplate, {
'name': 'Sine Wave Generator 2',
'id': '55122607-e65e-44d5-9c9d-9c31a914ca90',
'identifier': {
'namespace': '',
'key': '55122607-e65e-44d5-9c9d-9c31a914ca90'
'key': 'swg-2'
}
});
@ -158,17 +154,8 @@ describe('the plugin', function () {
let tabsLayoutViewProvider;
let mockComposition;
let count = 0;
let resizeCallback;
beforeEach(() => {
class mockResizeObserver {
constructor(cb) {
resizeCallback = cb;
}
observe() { }
disconnect() { }
}
mockComposition = new EventEmitter();
mockComposition.load = () => {
if (count === 0) {
@ -182,9 +169,6 @@ describe('the plugin', function () {
spyOn(openmct.composition, 'get').and.returnValue(mockComposition);
spyOnBuiltins(['ResizeObserver']);
window.ResizeObserver.and.callFake(mockResizeObserver);
const applicableViews = openmct.objectViews.get(testViewObject, []);
tabsLayoutViewProvider = applicableViews.find((viewProvider) => viewProvider.key === 'tabs');
let view = tabsLayoutViewProvider.view(testViewObject, []);
@ -206,22 +190,18 @@ describe('the plugin', function () {
describe('with domainObject.keep_alive set to', () => {
it ('true, will keep all views loaded, regardless of current tab view', (done) => {
resizeCallback();
it ('true, will keep all views loaded, regardless of current tab view', async () => {
let tabEls = element.querySelectorAll('.js-tab');
// the function called by the resize observer is debounced 500ms,
// this is to account for that
let promise = new Promise((resolve, reject) => {
setTimeout(resolve, 501);
});
for (let i = 0; i < tabEls.length; i++) {
const tab = tabEls[i];
Promise.all([Vue.nextTick(), promise]).then(() => {
let tabViewEls = element.querySelectorAll('.c-tabs-view__object');
tab.click();
await Vue.nextTick();
const tabViewEls = element.querySelectorAll('.c-tabs-view__object');
expect(tabViewEls.length).toEqual(2);
}).finally(() => {
done();
});
}
});
it ('false, will only keep the current tab view loaded', async () => {