diff --git a/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/directive-forest/directive-forest.component.html b/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/directive-forest/directive-forest.component.html
index 9c390af1084..39e3e162ae9 100644
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/directive-forest/directive-forest.component.html
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/directive-forest/directive-forest.component.html
@@ -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>
diff --git a/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/directive-forest/directive-forest.component.ts b/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/directive-forest/directive-forest.component.ts
index c4d00e6d9fc..81cd5a6c697 100644
--- a/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/directive-forest/directive-forest.component.ts
+++ b/devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/directive-forest/directive-forest.component.ts
@@ -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++) {