From c66ea1e761bd7679aacf879eb30ae1f672f383f2 Mon Sep 17 00:00:00 2001
From: SidStraw <j80304xz@gmail.com>
Date: Thu, 27 Aug 2026 10:59:02 +0800
Subject: [PATCH] fix(client): avoid toggling panel in extension inspect flow

The toggle-panel RPC minimizes the Vite overlay while inspecting a
component, which only makes sense when the devtools UI lives on the
page. Emitting it from browser extension panels (Chrome/Firefox)
toggles the page's overlay unexpectedly (#1004).

Skip the emit when running in an extension panel.
---
 packages/client/src/pages/components.vue | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/packages/client/src/pages/components.vue b/packages/client/src/pages/components.vue
index 89837da2c..5b12fea61 100644
--- a/packages/client/src/pages/components.vue
+++ b/packages/client/src/pages/components.vue
@@ -1,14 +1,21 @@
 <script setup lang="ts">
 import { Components as ComponentsPanel } from '@vue/devtools-applet'
 import { rpc } from '@vue/devtools-core'
+import { isInChromePanel } from '@vue/devtools-shared'
 import { openInEditor } from '../composables/open-in-editor'
 import '@vue/devtools-applet/style.css'
 
 function onInspectComponentStart() {
+  if (isInChromePanel)
+    return
+
   rpc.value.emit('toggle-panel', false)
 }
 
 function onInspectComponentEnd() {
+  if (isInChromePanel)
+    return
+
   rpc.value.emit('toggle-panel', true)
 }
 </script>