Ran this to double check.

On a primitive, double-clicking the node highlights the label + delimiter + value. There's an unrelated node highlighting behavior (#8019) that hides the actual text selection, but I can paste it onto the URL bar in the example below. Double-clicking the label edits as expected.

On an object, double clicking the node registers as a click first which expands the node, and then on the second click it moves on to edit the label/expression. It ignores depth > 0 nodes properly so clicking on properties doesn't prompt an edit.

Thanks for testing it out @jaril. One thing I noticed while using Chrome's DevTools is that double clicking anywhere on the expression block causes editing while on Firefox it does not work on the edge of the expression.

I just pushed a rebase of this branch which hopefully fixes circle

How does this look @nchevobbe ?

code wise it feels fine, but playing with it, it's a bit weird.
Is this only fixing the issue of double clicking on a node from an expanded object?
Also, we lose some affordance, as clicking on the right of the expression result won't edit the expression.
Maybe we could keep the onDoubleClick on the <li>, and check the event target to see if it's not a "child" node?

diff --git a/devtools/client/debugger/src/components/SecondaryPanes/Expressions.js b/devtools/client/debugger/src/components/SecondaryPanes/Expressions.js
--- a/devtools/client/debugger/src/components/SecondaryPanes/Expressions.js
+++ b/devtools/client/debugger/src/components/SecondaryPanes/Expressions.js
@@ -257,9 +257,13 @@ class Expressions extends Component<Prop
         className="expression-container"
         key={input}
         title={expression.input}
-        onDoubleClick={(items, options) =>
-          this.editExpression(expression, index)
-        }
+        onDoubleClick={e => {
+          const treeNode = e.target.closest(".tree-node");
+          const level = treeNode && parseInt(treeNode.getAttribute("aria-level"));
+          if (!treeNode || level === 1) {
+            this.editExpression(expression, index)
+          }
+        }}
       >
         <div className="expression-content">
           <ObjectInspector

Yes, that does feel a bit weird. What do you think @darkwing? Should I change my PR to accommodate that?

Yes, I love @nchevobbe 's idea!

Great @darkwing! I will push the changes as soon as I get back!

I was away from GitHub. Apologies for not closing it in time!