diff --git a/remix-debugger/src/ui/TreeView.js b/remix-debugger/src/ui/TreeView.js
index 87647d4529..d8ac14d057 100644
--- a/remix-debugger/src/ui/TreeView.js
+++ b/remix-debugger/src/ui/TreeView.js
@@ -74,30 +74,29 @@ class TreeView {
}
formatData (key, data, children, expand, keyPath) {
+ var self = this
var li = yo`
`
- var label = yo`${this.formatSelf(key, data, li)} `
- var renderedChildren = null
- if (data.isNode || children.length) {
- renderedChildren = yo``
- renderedChildren.style.display = this.nodeIsExpanded[keyPath] !== undefined ? (this.nodeIsExpanded[keyPath] ? 'block' : 'none') : (expand ? 'block' : 'none')
- label.firstElementChild.className = renderedChildren.style.display === 'none' ? 'fa fa-caret-right' : 'fa fa-caret-down'
- var self = this
+ var caret = yo``
+ var label = yo`
+
+ ${caret}
+ ${self.formatSelf(key, data, li)}
+
`
+ li.appendChild(label)
+ if (data.children) {
+ var isExpanded = self.nodeIsExpanded[keyPath]
+ var list = yo``
+ list.style.display = isExpanded !== undefined ? (isExpanded ? 'block' : 'none') : (expand ? 'block' : 'none')
+ caret.className = list.style.display === 'none' ? 'fa fa-caret-right' : 'fa fa-caret-down'
label.onclick = function () {
- this.firstElementChild.className = this.firstElementChild.className === 'fa fa-caret-right' ? 'fa fa-caret-down' : 'fa fa-caret-right'
- var list = this.parentElement.querySelector('ul')
+ caret.className = caret.className === 'fa fa-caret-right' ? 'fa fa-caret-down' : 'fa fa-caret-right'
list.style.display = list.style.display === 'none' ? 'block' : 'none'
self.nodeIsExpanded[keyPath] = list.style.display === 'block'
- self.event.trigger('nodeClick', [keyPath, renderedChildren])
+ self.event.trigger('nodeClick', [keyPath, list])
}
+ li.appendChild(list)
} else {
- label.firstElementChild.style.visibility = 'hidden'
- label.onclick = () => {
- this.event.trigger('leafClick', [keyPath, renderedChildren])
- }
- }
- li.appendChild(label)
- if (renderedChildren) {
- li.appendChild(renderedChildren)
+ caret.style.visibility = 'hidden'
}
return li
}