From 68ad98ea8ddf7184be97ee7173f85f67cc18f284 Mon Sep 17 00:00:00 2001
From: Priyanka <priyankaspatel@google.com>
Date: Thu, 22 Jul 2021 16:27:40 +0000
Subject: [PATCH] Property changes now show up on hierarchy view.

Entries that have a modification are now highlighted in cyan on the
hierarchy view.

Test: Find any entry, run a trace - if any properties change at a
particular timestamp they should be highlighted as cyan on the hierarchy
view.

Bug: b/162302603
Change-Id: I1d187ac669f1ff479b7f4e46903576380454a709
---
 tools/winscope/src/TraceView.vue | 10 +++++-----
 tools/winscope/src/TreeView.vue  |  6 +++---
 tools/winscope/src/utils/diff.js |  2 +-
 3 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/tools/winscope/src/TraceView.vue b/tools/winscope/src/TraceView.vue
index 3e343a68f..88bcabd3d 100644
--- a/tools/winscope/src/TraceView.vue
+++ b/tools/winscope/src/TraceView.vue
@@ -32,7 +32,7 @@
         >
           <h2 class="md-title" style="flex: 1;">Hierarchy</h2>
           <md-checkbox
-            v-model="showHierachyDiff"
+            v-model="showHierarchyDiff"
             v-if="diffVisualizationAvailable"
           >
             Show Diff
@@ -116,7 +116,7 @@
             <i class="material-icons none-icon">
               filter_none
             </i>
-            <span>No element selected in the hierachy.</span>
+            <span>No element selected in the hierarchy.</span>
           </div>
         </div>
       </flat-card>
@@ -178,7 +178,7 @@ export default {
       item: null,
       tree: null,
       highlight: null,
-      showHierachyDiff: false,
+      showHierarchyDiff: false,
       displayDefaults: false,
       showPropertiesDiff: false,
       PropertiesTreeElement,
@@ -219,7 +219,7 @@ export default {
       }
     },
     generateTreeFromItem(item) {
-      if (!this.showHierachyDiff || !this.diffVisualizationAvailable) {
+      if (!this.showHierarchyDiff || !this.diffVisualizationAvailable) {
         return item;
       }
 
@@ -314,7 +314,7 @@ export default {
     selectedIndex() {
       this.setData(this.file.data[this.file.selectedIndex ?? 0]);
     },
-    showHierachyDiff() {
+    showHierarchyDiff() {
       this.tree = this.generateTreeFromItem(this.item);
     },
     showPropertiesDiff() {
diff --git a/tools/winscope/src/TreeView.vue b/tools/winscope/src/TreeView.vue
index 929240e27..ff574a59c 100644
--- a/tools/winscope/src/TreeView.vue
+++ b/tools/winscope/src/TreeView.vue
@@ -100,7 +100,7 @@
         v-on:selected="immediateChildSelected = true"
         v-on:unselected="immediateChildSelected = false"
         :elementView="elementView"
-        v-on:collapseSibbling="collapseSibbling"
+        v-on:collapseSibling="collapseSibling"
         v-on:collapseAllOtherNodes="collapseAllOtherNodes"
         v-on:closeAllContextMenus="closeAllContextMenus"
         ref="children"
@@ -352,9 +352,9 @@ export default {
     },
     collapseAllOtherNodes() {
       this.$emit('collapseAllOtherNodes');
-      this.$emit('collapseSibbling', this.item);
+      this.$emit('collapseSibling', this.item);
     },
-    collapseSibbling(item) {
+    collapseSibling(item) {
       if (!this.$refs.children) {
         return;
       }
diff --git a/tools/winscope/src/utils/diff.js b/tools/winscope/src/utils/diff.js
index bc96383bd..76d70e58d 100644
--- a/tools/winscope/src/utils/diff.js
+++ b/tools/winscope/src/utils/diff.js
@@ -35,7 +35,7 @@ export function defaultModifiedCheck(newNode, oldNode) {
     return true;
   }
 
-  return JSON.stringify(newNode.obj) !== JSON.stringify(oldNode.obj);
+  return !newNode.equals(oldNode);
 }
 
 export class DiffGenerator {