diff --git a/src/ui/layout/mct-tree.vue b/src/ui/layout/mct-tree.vue
index ad54a315ee..567bb93b88 100644
--- a/src/ui/layout/mct-tree.vue
+++ b/src/ui/layout/mct-tree.vue
@@ -265,11 +265,7 @@ export default {
     async mounted() {
 
         // only reliable way to get final tree top margin
-        document.onreadystatechange = () => {
-            if (document.readyState === "complete") {
-                this.mainTreeTopMargin = this.getElementStyleValue(this.$refs.mainTree, 'marginTop');
-            }
-        };
+        this.readyStateCheck();
 
         this.backwardsCompatibilityCheck();
 
@@ -323,8 +319,21 @@ export default {
     destroyed() {
         window.removeEventListener('resize', this.handleWindowResize);
         this.stopObservingAncestors();
+        document.removeEventListener('readystatechange', this.setTreeTopMargin);
     },
     methods: {
+        readyStateCheck() {
+            if (document.readyState !== 'complete') {
+                document.addEventListener('readystatechange', this.setTreeTopMargin);
+            } else {
+                this.setTreeTopMargin();
+            }
+        },
+        setTreeTopMargin() {
+            if (document.readyState === 'complete') {
+                this.mainTreeTopMargin = this.getElementStyleValue(this.$refs.mainTree, 'marginTop');
+            }
+        },
         updateVisibleItems() {
             if (this.updatingView) {
                 return;
diff --git a/src/ui/layout/tree-item.vue b/src/ui/layout/tree-item.vue
index be10350f71..586d093c97 100644
--- a/src/ui/layout/tree-item.vue
+++ b/src/ui/layout/tree-item.vue
@@ -122,13 +122,7 @@ export default {
         let objectComposition = this.openmct.composition.get(this.node.object);
 
         // only reliable way to get final item height
-        document.onreadystatechange = () => {
-            if (document.readyState === "complete") {
-                if (this.shouldEmitHeight) {
-                    this.$emit('emittedHeight', this.$el.offsetHeight);
-                }
-            }
-        };
+        this.readyStateCheck();
 
         this.domainObject = this.node.object;
         let removeListener = this.openmct.objects.observe(this.domainObject, '*', (newObject) => {
@@ -144,8 +138,21 @@ export default {
     },
     destroyed() {
         this.openmct.router.off('change:path', this.highlightIfNavigated);
+        document.removeEventListener('readystatechange', this.emitHeight);
     },
     methods: {
+        readyStateCheck() {
+            if (document.readyState !== 'complete') {
+                document.addEventListener('readystatechange', this.emitHeight);
+            } else {
+                this.emitHeight();
+            }
+        },
+        emitHeight() {
+            if (this.shouldEmitHeight && document.readyState === 'complete') {
+                this.$emit('emittedHeight', this.$el.offsetHeight);
+            }
+        },
         buildPathString(parentPath) {
             return [parentPath, this.openmct.objects.makeKeyString(this.node.object.identifier)].join('/');
         },