feat(extension): 添加调试器功能并优化界面布局

- 集成 Chrome 调试器 API 支持 attach/detach 功能
- 新增 tabUtils 工具模块用于获取活动标签页 ID
- 在背景脚本中添加标签页激活和更新事件监听
- 使用 Material-UI 容器和堆叠组件重构页面布局
- 移除 Chromium 启动参数中的自动打开开发者工具选项
- 更新权限配置添加调试器相关权限
- 在测试页面添加多个调试功能按钮和状态管理

utils/tabUtils.ts

@@ -0,0 +1,35 @@
+import { browser } from 'wxt/browser';
+
+/**
+ * 获取当前活动标签页的 ID
+ * @returns Promise<number | undefined> 返回活动标签页的 ID，如果未找到则返回 undefined
+ */
+export async function getActiveTabId(): Promise<number | undefined> {
+  const activeTabs = await browser.tabs.query({
+    active: true,
+    currentWindow: true,
+  });
+  const activeTab = activeTabs[0];
+
+  if (!activeTab) {
+    throw new Error('No active tab found.');
+  }
+
+  // 检查URL是否受限
+  if (activeTab?.url) {
+    const restrictedProtocols = [
+      'chrome:',
+      'chrome-extension:',
+      'about:',
+      'edge:',
+      'view-source:',
+      'data:',
+      'file:',
+    ];
+    if (restrictedProtocols.some((protocol) => activeTab.url!.startsWith(protocol))) {
+      throw new Error(`Cannot send message to a restricted URL: ${activeTab.url}`);
+    }
+  }
+
+  return activeTab.id;
+}