[SourceTree] Don't blur when tree is no longer focused (firefox-devtools#6488)

Author: darkwing

packages/devtools-components/src/tree.js

@@ -341,7 +341,9 @@ class Tree extends Component {
       // Additional classes to add to the root element.
       className: PropTypes.string,
       // style object to be applied to the root element.
-      style: PropTypes.object
+      style: PropTypes.object,
+      // Prevents blur when Tree loses focus
+      preventBlur: PropTypes.bool
     };
   }
 
@@ -606,7 +608,9 @@ class Tree extends Component {
    * Sets the state to have no focused item.
    */
   _onBlur() {
-    this._focus(undefined);
+    if (!this.props.preventBlur) {
+      this._focus(undefined);
+    }
   }
 
   /**

src/components/PrimaryPanes/SourcesTree.js

@@ -401,7 +401,8 @@ class SourcesTree extends Component<Props, State> {
       onCollapse: this.onCollapse,
       onExpand: this.onExpand,
       onFocus: this.focusItem,
-      renderItem: this.renderItem
+      renderItem: this.renderItem,
+      preventBlur: true
     };
 
     return <ManagedTree {...treeProps} />;

src/components/test/__snapshots__/SourcesTree.spec.js.snap

@@ -29,6 +29,7 @@ exports[`SourcesTree After changing expanded nodes Shows the tree with four.js,
       onCollapse={[Function]}
       onExpand={[Function]}
       onFocus={[Function]}
+      preventBlur={true}
       renderItem={[Function]}
     />
   </div>
@@ -57,6 +58,7 @@ exports[`SourcesTree Should show the tree with nothing expanded 1`] = `
       onCollapse={[Function]}
       onExpand={[Function]}
       onFocus={[Function]}
+      preventBlur={true}
       renderItem={[Function]}
     />
   </div>
@@ -92,6 +94,7 @@ exports[`SourcesTree When loading initial source Shows the tree with one.js, two
       onCollapse={[Function]}
       onExpand={[Function]}
       onFocus={[Function]}
+      preventBlur={true}
       renderItem={[Function]}
     />
   </div>
@@ -184,6 +187,7 @@ exports[`SourcesTree on receiving new props updates highlighted items updates hi
       onCollapse={[Function]}
       onExpand={[Function]}
       onFocus={[Function]}
+      preventBlur={true}
       renderItem={[Function]}
     />
   </div>
@@ -286,6 +290,7 @@ exports[`SourcesTree on receiving new props updates list items updates list item
       onCollapse={[Function]}
       onExpand={[Function]}
       onFocus={[Function]}
+      preventBlur={true}
       renderItem={[Function]}
     />
   </div>
@@ -640,6 +645,7 @@ exports[`SourcesTree with custom root renders custom root source list 1`] = `
       onCollapse={[Function]}
       onExpand={[Function]}
       onFocus={[Function]}
+      preventBlur={true}
       renderItem={[Function]}
     />
   </div>