angular
diff --git a/‎devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/directive-forest/directive-forest.component.html‎
Lines changed: 15 additions & 13 deletions b/‎devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/directive-forest/directive-forest.component.html‎
Lines changed: 15 additions & 13 deletions
diff --git a/‎devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/directive-forest/directive-forest.component.ts‎
Lines changed: 4 additions & 0 deletions b/‎devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/directive-forest/directive-forest.component.ts‎
Lines changed: 4 additions & 0 deletions
@@ -21,19 +21,21 @@
       (mouseleave)="removeHighlight()"
       [style.padding-left]="15 + 15 * node.level + 'px'"
     >
-    <div class="tree-node-info">
-      @if (node.expandable) {
-        <button
-          [style.left]="15 * node.level + 'px'"
-          (click)="treeControl.toggle(node)"
-          [attr.aria-label]="'toggle ' + node.name"
-        >
-          <mat-icon class="mat-icon-rtl-mirror">
-            {{ treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right' }}
-          </mat-icon>
-        </button>
-      }
-      <span class="element-name" [class.angular-element]="isElement(node)">{{ node.name }}</span>
+      <div class="tree-node-info">
+        @if (node.expandable) {
+          <!-- We stop propagration on dblClick to prevent to show the element panel -->
+          <button
+            [style.left]="15 * node.level + 'px'"
+            (click)="treeControl.toggle(node)"
+            (dblclick)="stopPropagation($event)"
+            [attr.aria-label]="'toggle ' + node.name"
+          >
+            <mat-icon class="mat-icon-rtl-mirror">
+              {{ treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right' }}
+            </mat-icon>
+          </button>
+        }
+        <span class="element-name" [class.angular-element]="isElement(node)">{{ node.name }}</span>
 
       @if (node.directives) {
         <span class="dir-names">[{{ node.directives }}]</span>
 
@@ -344,6 +344,10 @@ export class DirectiveForestComponent {
     }
   }
 
+  stopPropagation(event: Event): void {
+    event.stopPropagation();
+  }
+
   private _findMatchedNodes(): number[] {
     const indexesOfMatchedNodes: number[] = [];
     for (let i = 0; i < this.dataSource.data.length; i++) {
Original file line number	Diff line number	Diff line change
`@@ -344,6 +344,10 @@ export class DirectiveForestComponent {`
`344`	`344`	`}`
`345`	`345`	`}`
`346`	`346`
	`347`	`+ stopPropagation(event: Event): void {`
	`348`	`+ event.stopPropagation();`
	`349`	`+ }`
	`350`	`+`
`347`	`351`	`private _findMatchedNodes(): number[] {`
`348`	`352`	`const indexesOfMatchedNodes: number[] = [];`
`349`	`353`	`for (let i = 0; i < this.dataSource.data.length; i++) {`