[MCT Tree] Testathon Fixes (#3324)

* WIP: testing backwards compatibility checks

* added new localstorage key for expanded tree node, delete old one if detected

* removing obsolete backwords compatibility code

* fixed going up the tree items not showing, going down the tree "ghost" image showing

* removing console log

* removed duplicate functionality
This commit is contained in:
Jamie V 2020-08-25 14:15:28 -07:00 committed by GitHub
parent 278f48f65c
commit ffb3b302c7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -95,7 +95,8 @@
import treeItem from './tree-item.vue'; import treeItem from './tree-item.vue';
import search from '../components/search.vue'; import search from '../components/search.vue';
const LOCAL_STORAGE_KEY__TREE_EXPANDED = 'mct-tree-expanded'; const LOCAL_STORAGE_KEY__TREE_EXPANDED__OLD = 'mct-tree-expanded';
const LOCAL_STORAGE_KEY__EXPANDED_TREE_NODE = 'mct-expanded-tree-node';
const ROOT_PATH = '/browse/'; const ROOT_PATH = '/browse/';
const ITEM_BUFFER = 5; const ITEM_BUFFER = 5;
const RECHECK_DELAY = 100; const RECHECK_DELAY = 100;
@ -211,9 +212,17 @@ export default {
}, },
searchResultItems() { searchResultItems() {
this.setContainerHeight(); this.setContainerHeight();
},
allTreeItems() {
// catches an edge case race condition and when new items are added (ex. folder)
if (!this.isLoading) {
this.setContainerHeight();
}
} }
}, },
async mounted() { async mounted() {
this.backwardsCompatibilityCheck();
let savedPath = this.getSavedNavigatedPath(); let savedPath = this.getSavedNavigatedPath();
this.searchService = this.openmct.$injector.get('searchService'); this.searchService = this.openmct.$injector.get('searchService');
window.addEventListener('resize', this.handleWindowResize); window.addEventListener('resize', this.handleWindowResize);
@ -427,9 +436,6 @@ export default {
addChild(child) { addChild(child) {
let item = this.buildTreeItem(child); let item = this.buildTreeItem(child);
this.allTreeItems.push(item); this.allTreeItems.push(item);
if (!this.isLoading) {
this.setContainerHeight();
}
}, },
removeChild(identifier) { removeChild(identifier) {
let removeId = this.openmct.objects.makeKeyString(identifier); let removeId = this.openmct.objects.makeKeyString(identifier);
@ -446,11 +452,6 @@ export default {
this.isLoading = false; this.isLoading = false;
}, },
async jumpToPath(saveExpandedPath = false) { async jumpToPath(saveExpandedPath = false) {
// check for older implementations of tree storage and reformat if necessary
if (Array.isArray(this.jumpPath)) {
this.jumpPath = this.jumpPath[0];
}
// switching back and forth between multiple root children can cause issues, // switching back and forth between multiple root children can cause issues,
// this checks for one of those issues // this checks for one of those issues
if (this.jumpPath.key) { if (this.jumpPath.key) {
@ -551,17 +552,21 @@ export default {
this.$refs.scrollable.scrollTop = 0; this.$refs.scrollable.scrollTop = 0;
this.setContainerHeight(); this.setContainerHeight();
}, },
handleReset(node) { async handleReset(node) {
this.visibleItems = [];
await this.$nextTick(); // prevents "ghost" image of visibleItems
this.childrenSlideClass = 'slide-right'; this.childrenSlideClass = 'slide-right';
this.ancestors.splice(this.ancestors.indexOf(node) + 1); this.ancestors.splice(this.ancestors.indexOf(node) + 1);
this.getAllChildren(node); this.getAllChildren(node);
this.setCurrentNavigatedPath(); this.setCurrentNavigatedPath();
}, },
handleExpanded(node) { async handleExpanded(node) {
if (this.activeSearch) { if (this.activeSearch) {
return; return;
} }
this.visibleItems = [];
await this.$nextTick(); // prevents "ghost" image of visibleItems
this.childrenSlideClass = 'slide-left'; this.childrenSlideClass = 'slide-left';
let newParent = this.buildTreeItem(node); let newParent = this.buildTreeItem(node);
this.ancestors.push(newParent); this.ancestors.push(newParent);
@ -569,11 +574,11 @@ export default {
this.setCurrentNavigatedPath(); this.setCurrentNavigatedPath();
}, },
getSavedNavigatedPath() { getSavedNavigatedPath() {
return JSON.parse(localStorage.getItem(LOCAL_STORAGE_KEY__TREE_EXPANDED)); return JSON.parse(localStorage.getItem(LOCAL_STORAGE_KEY__EXPANDED_TREE_NODE));
}, },
setCurrentNavigatedPath() { setCurrentNavigatedPath() {
if (!this.searchValue) { if (!this.searchValue) {
localStorage.setItem(LOCAL_STORAGE_KEY__TREE_EXPANDED, JSON.stringify(this.currentNavigatedPath)); localStorage.setItem(LOCAL_STORAGE_KEY__EXPANDED_TREE_NODE, JSON.stringify(this.currentNavigatedPath));
} }
}, },
currentPathIsActivePath() { currentPathIsActivePath() {
@ -628,6 +633,13 @@ export default {
let index = styleString.indexOf('px'); let index = styleString.indexOf('px');
return Number(styleString.slice(0, index)); return Number(styleString.slice(0, index));
},
backwardsCompatibilityCheck() {
let oldTreeExpanded = JSON.parse(localStorage.getItem(LOCAL_STORAGE_KEY__TREE_EXPANDED__OLD));
if (oldTreeExpanded) {
localStorage.removeItem(LOCAL_STORAGE_KEY__TREE_EXPANDED__OLD);
}
} }
} }
}; };