android-midscene-automation 0.2.4 → 1.1.1

package/bin/android-midscene-automation.js

@@ -1,15 +1,11 @@
 #!/usr/bin/env node
 import { spawn } from 'node:child_process';
-import { createRequire } from 'node:module';
 import fs from 'node:fs';
 import os from 'node:os';
 import path from 'node:path';
 import { fileURLToPath } from 'node:url';
 
-const require = createRequire(import.meta.url);
 const packageRoot = path.resolve(path.dirname(fileURLToPath(import.meta.url)), '..');
-const viteRoot = path.dirname(require.resolve('vite/package.json'));
-const viteBin = path.join(viteRoot, 'bin', 'vite.js');
 const args = process.argv.slice(2);
 const userRoot = process.cwd();
 const githubUrl = 'https://github.com/oooooooko/android-midscene-automation';
@@ -90,7 +86,7 @@ console.log(`\nGitHub 源码 / 二次修改：${githubUrl}`);
 console.log(`问题反馈 / 功能建议：${githubUrl}/issues\n`);
 console.log(`本地数据目录：${dataRoot}\n`);
 
-const child = spawn(process.execPath, [viteBin, ...args], {
+const child = spawn(process.execPath, [path.join(packageRoot, 'bin/start-dev.mjs'), ...args], {
   cwd: packageRoot,
   env: {
     ...process.env,

package/bin/artemis-config.mjs

@@ -0,0 +1,15 @@
+import { constants, copyFileSync, existsSync, mkdirSync } from 'node:fs';
+import { resolve } from 'node:path';
+
+export function ensureArtemisConfig(projectDir) {
+  const configDir = resolve(projectDir, 'config');
+  const target = resolve(configDir, 'artemis.jsonc');
+  if (existsSync(target)) return;
+  mkdirSync(configDir, { recursive: true });
+  try {
+    copyFileSync(resolve(configDir, 'artemis.example.jsonc'), target, constants.COPYFILE_EXCL);
+  } catch (error) {
+    // Never overwrite a user's configuration, including concurrent first starts.
+    if (error.code !== 'EEXIST') throw error;
+  }
+}

package/bin/artemis-embedded.py

@@ -0,0 +1,56 @@
+"""Launch an unmodified Artemis checkout with an explicit frame-ancestor allowlist."""
+
+import os
+from pathlib import Path
+import sys
+from urllib.parse import urlsplit
+
+
+def frame_policy(origins: str) -> str:
+    allowed = []
+    for value in origins.split(','):
+        origin = value.strip()
+        parsed = urlsplit(origin)
+        if (parsed.scheme not in {'http', 'https'} or not parsed.hostname
+                or parsed.username or parsed.password or parsed.path not in {'', '/'}
+                or parsed.query or parsed.fragment
+                or any(char in origin for char in " \t\r\n;*'")):
+            raise ValueError(f'Invalid ARTEMIS_EMBED_ORIGINS origin: {origin!r}')
+        allowed.append(f'{parsed.scheme}://{parsed.netloc}')
+    return "frame-ancestors 'self' " + ' '.join(allowed)
+
+
+class EmbedBoundary:
+    def __init__(self, app, policy: str):
+        self.app = app
+        self.policy = policy.encode('ascii')
+
+    async def __call__(self, scope, receive, send):
+        async def send_headers(message):
+            if message['type'] == 'http.response.start':
+                # Replace only the framing restriction; retain Host/Origin checks
+                # and all other headers installed by Artemis's inner middleware.
+                headers = [(key, value) for key, value in message.get('headers', [])
+                           if key.lower() != b'x-frame-options']
+                # Multiple CSP headers are enforced together by the browser.
+                headers.append((b'content-security-policy', self.policy))
+                message = {**message, 'headers': headers}
+            await send(message)
+
+        await self.app(scope, receive, send_headers)
+
+
+if __name__ == '__main__':
+    policy = frame_policy(os.environ.get(
+        'ARTEMIS_EMBED_ORIGINS',
+        'http://127.0.0.1:5173,http://localhost:5173,'
+        'http://127.0.0.1:4173,http://localhost:4173',
+    ))
+    sys.path.insert(0, str(Path(os.environ['ARTEMIS_PROJECT_DIR']).resolve()))
+    from apps.admin_console.server import app, run_ui_server
+    from artemis.interfaces.cli.commands.ui import ensure_showcase_built
+    from rich.console import Console
+
+    ensure_showcase_built(Console())
+    app.add_middleware(EmbedBoundary, policy=policy)
+    run_ui_server(host='127.0.0.1', port=int(os.environ.get('ARTEMIS_PORT', '8000')))

package/bin/start-artemis.mjs

@@ -0,0 +1,30 @@
+import { spawn } from 'node:child_process';
+import { existsSync } from 'node:fs';
+import { dirname, resolve } from 'node:path';
+import { fileURLToPath } from 'node:url';
+import { ensureArtemisConfig } from './artemis-config.mjs';
+
+const binDir = dirname(fileURLToPath(import.meta.url));
+const projectDir = resolve(process.env.ARTEMIS_PROJECT_DIR || resolve(binDir, '../artemis-main'));
+if (!existsSync(resolve(projectDir, 'pyproject.toml'))) {
+  console.error('找不到 Artemis 源码。请将源码放在 artemis-main，或设置 ARTEMIS_PROJECT_DIR。');
+  process.exit(1);
+}
+
+ensureArtemisConfig(projectDir);
+
+const child = spawn('uv', ['run', '--project', projectDir, 'python', resolve(binDir, 'artemis-embedded.py')], {
+  cwd: projectDir,
+  stdio: 'inherit',
+  env: { ...process.env, ARTEMIS_PROJECT_DIR: projectDir },
+});
+child.once('error', error => {
+  console.error(`Artemis 启动失败，请确认已安装 uv：${error.message}`);
+  process.exitCode = 1;
+});
+for (const signal of ['SIGINT', 'SIGTERM']) {
+  process.on(signal, () => child.kill(signal));
+}
+child.once('exit', (code, signal) => {
+  process.exitCode = code ?? (signal ? 1 : 0);
+});

package/bin/start-dev.mjs

@@ -0,0 +1,112 @@
+import { spawn } from 'node:child_process';
+import { existsSync } from 'node:fs';
+import { createRequire } from 'node:module';
+import { dirname, resolve } from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+const require = createRequire(import.meta.url);
+const binDir = dirname(fileURLToPath(import.meta.url));
+const projectRoot = resolve(binDir, '..');
+const args = process.argv.slice(2);
+const portIndex = args.indexOf('--port');
+const vitePort = args.find(arg => arg.startsWith('--port='))?.slice(7)
+  || (portIndex >= 0 ? args[portIndex + 1] : '5173');
+const artemisPort = process.env.ARTEMIS_PORT || '8000';
+const localArtemisUrl = `http://127.0.0.1:${artemisPort}`;
+const env = {
+  ...process.env,
+  ARTEMIS_URL: process.env.ARTEMIS_URL || localArtemisUrl,
+  ARTEMIS_EMBED_ORIGINS: process.env.ARTEMIS_EMBED_ORIGINS
+    || `http://127.0.0.1:${vitePort},http://localhost:${vitePort},http://127.0.0.1:4173,http://localhost:4173`,
+};
+const children = new Set();
+let stopping = false;
+let killTimer;
+
+function signalChild(child, signal) {
+  try {
+    if (!child.devProcessGroup) child.kill(signal);
+    else process.kill(-child.pid, signal);
+  } catch (error) {
+    if (error.code !== 'ESRCH') console.error(`停止开发服务失败：${error.message}`);
+  }
+}
+
+function stop(code = 0) {
+  if (stopping) return;
+  stopping = true;
+  process.exitCode = code;
+  for (const child of children) signalChild(child, 'SIGTERM');
+  // uv and Python belong to the launcher group, so descendants are cleaned too.
+  killTimer = setTimeout(() => {
+    for (const child of children) signalChild(child, 'SIGKILL');
+  }, 5000);
+  killTimer.unref();
+}
+
+function start(script, scriptArgs, required) {
+  const devProcessGroup = !required && process.platform !== 'win32';
+  const child = spawn(process.execPath, [script, ...scriptArgs], {
+    cwd: projectRoot, env, stdio: 'inherit', detached: devProcessGroup,
+  });
+  child.devProcessGroup = devProcessGroup;
+  children.add(child);
+  child.once('error', error => {
+    console.error(`${required ? '主项目' : 'Artemis'} 启动失败：${error.message}`);
+    children.delete(child);
+    if (required) stop(1);
+  });
+  child.once('exit', code => {
+    // Clean any descendants even if their direct parent has already exited.
+    signalChild(child, 'SIGTERM');
+    children.delete(child);
+    if (!children.size) clearTimeout(killTimer);
+    if (stopping) return;
+    if (required) stop(code ?? 1);
+    else console.warn('Artemis 服务已退出，主项目继续运行；排查上方日志后可执行 npm run artemis 重试。');
+  });
+}
+
+// npm may forward a signal already delivered by the terminal; keep both handlers.
+process.on('SIGINT', () => stop());
+process.on('SIGTERM', () => stop());
+process.on('exit', () => {
+  for (const child of children) signalChild(child, 'SIGTERM');
+});
+
+async function startArtemis() {
+  if (env.ARTEMIS_AUTO_START === '0') return;
+  try {
+    const response = await fetch(new URL('/api/status', env.ARTEMIS_URL), {
+      signal: AbortSignal.timeout(1500), redirect: 'error',
+    });
+    const data = await response.json();
+    if (response.ok && data.model_info) {
+      console.log(`复用已运行的 Artemis：${env.ARTEMIS_URL}`);
+      return;
+    }
+  } catch { /* No running Artemis; try the local launcher below. */ }
+  if (stopping) return;
+  const target = new URL(env.ARTEMIS_URL);
+  if (!['127.0.0.1', 'localhost'].includes(target.hostname)
+      || target.protocol !== 'http:' || (target.port || '80') !== artemisPort) {
+    console.warn('ARTEMIS_URL 指向外部或不同端口的服务，请单独启动该服务；主项目继续运行。');
+    return;
+  }
+  const projectDir = resolve(env.ARTEMIS_PROJECT_DIR || resolve(projectRoot, 'artemis-main'));
+  if (!existsSync(resolve(projectDir, 'pyproject.toml'))) {
+    console.warn('未找到 Artemis 源码，跳过自动启动。请准备 artemis-main 或设置 ARTEMIS_PROJECT_DIR；主项目继续运行。');
+    return;
+  }
+  console.log(`正在自动启动 Artemis：${localArtemisUrl}`);
+  start(resolve(binDir, 'start-artemis.mjs'), [], false);
+}
+
+const viteBin = resolve(dirname(require.resolve('vite/package.json')), 'bin/vite.js');
+// Keep the port fixed so iframe origins match the actual dev server.
+start(viteBin, ['--host', '127.0.0.1', '--strictPort', ...args], true);
+try {
+  await startArtemis();
+} catch (error) {
+  console.warn(`Artemis 自动启动失败：${error.message}；主项目继续运行。`);
+}

package/bin/test_artemis_embedded.py

@@ -0,0 +1,44 @@
+import asyncio
+import importlib.util
+from pathlib import Path
+import unittest
+
+spec = importlib.util.spec_from_file_location('embedded', Path(__file__).with_name('artemis-embedded.py'))
+embedded = importlib.util.module_from_spec(spec)
+spec.loader.exec_module(embedded)
+
+
+class EmbedTests(unittest.TestCase):
+    def test_only_explicit_origins(self):
+        self.assertEqual(embedded.frame_policy('http://localhost:5173/'),
+                         "frame-ancestors 'self' http://localhost:5173")
+        for origin in ['*', 'https://*.example.com', 'http://localhost:5173;script-src *',
+                       'http://user:pass@localhost:5173', 'http://localhost/path', 'null']:
+            with self.subTest(origin=origin), self.assertRaises(ValueError):
+                embedded.frame_policy(origin)
+
+    def test_preserves_origin_rejection_and_other_headers(self):
+        async def run():
+            async def app(scope, receive, send):
+                await send({'type': 'http.response.start', 'status': 403, 'headers': [
+                    (b'x-frame-options', b'DENY'), (b'x-content-type-options', b'nosniff'),
+                    (b'content-security-policy', b"script-src 'self'"),
+                ]})
+                await send({'type': 'http.response.body', 'body': b'Forbidden'})
+            messages = []
+            async def send(message):
+                messages.append(message)
+            await embedded.EmbedBoundary(app, embedded.frame_policy('http://localhost:5173'))(
+                {'type': 'http'}, None, send)
+            self.assertEqual(messages[0]['status'], 403)
+            self.assertEqual(messages[1]['body'], b'Forbidden')
+            headers = messages[0]['headers']
+            self.assertIn((b'x-content-type-options', b'nosniff'), headers)
+            self.assertIn((b'content-security-policy', b"script-src 'self'"), headers)
+            self.assertNotIn((b'x-frame-options', b'DENY'), headers)
+            self.assertIn((b'content-security-policy', b"frame-ancestors 'self' http://localhost:5173"), headers)
+        asyncio.run(run())
+
+
+if __name__ == '__main__':
+    unittest.main()

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "android-midscene-automation",
-  "version": "0.2.4",
+  "version": "1.1.1",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/oooooooko/android-midscene-automation.git"
@@ -14,6 +14,7 @@
     "android-midscene-automation": "bin/android-midscene-automation.js"
   },
   "files": [
+    "artemis-main",
     "bin",
     "index.html",
     "remote-agent",
@@ -29,7 +30,8 @@
     "CHANGELOG.md"
   ],
   "scripts": {
-    "dev": "vite --host 127.0.0.1",
+    "artemis": "node bin/start-artemis.mjs",
+    "dev": "node bin/start-dev.mjs",
     "prepack": "node bin/sync-readme-docs.mjs",
     "remote-agent": "tsx remote-agent/index.ts",
     "build": "vue-tsc -b && vite build",

package/server/artemis.ts

@@ -0,0 +1,34 @@
+import { readFile } from 'node:fs/promises';
+import { resolve } from 'node:path';
+import { appPath } from './paths';
+
+export async function getArtemisVersion() {
+  try {
+    const projectDir = process.env.ARTEMIS_PROJECT_DIR || appPath('artemis-main');
+    const source = await readFile(resolve(projectDir, 'pyproject.toml'), 'utf8');
+    const project = source.split(/^\[project\]\s*$/m)[1]?.split(/^\[/m)[0] || '';
+    const version = project.match(/^version\s*=\s*["']([^"']+)["']/m)?.[1];
+    return { version: version || '', message: version ? '本地 Artemis 源码版本' : '未找到 Artemis 版本信息' };
+  } catch {
+    return { version: '', message: '未找到本地 Artemis 源码，请检查 ARTEMIS_PROJECT_DIR' };
+  }
+}
+
+export async function getArtemisStatus() {
+  const configuredUrl = process.env.ARTEMIS_URL || 'http://127.0.0.1:8000';
+  try {
+    const url = new URL(configuredUrl);
+    const response = await fetch(new URL('/api/status', url), {
+      signal: AbortSignal.timeout(3000),
+      redirect: 'error',
+    });
+    const data = await response.json() as { model_info?: unknown };
+    if (!response.ok || !data.model_info) throw new Error('服务响应不是 Artemis 控制台');
+    const policy = response.headers.get('content-security-policy') || '';
+    const ancestors = response.headers.get('x-frame-options')
+      ? [] : policy.match(/(?:^|;)\s*frame-ancestors\s+([^;]+)/)?.[1].split(/\s+/) || [];
+    return { url: url.origin, available: true, ancestors, message: '' };
+  } catch {
+    return { url: '', available: false, ancestors: [], message: '未连接到 Artemis，请先在项目根目录运行 npm run artemis，并检查 ARTEMIS_URL 配置。' };
+  }
+}

package/server/http-api.ts

@@ -1,4 +1,5 @@
 import { getTestAnalytics } from './analytics';
+import { getArtemisStatus, getArtemisVersion } from './artemis';
 import { readBody, readRawBody, requestErrorStatus } from './request-body';
 import { canManageConfig, publicConfig, resolveSavedModelKey } from './config-access';
 import { resolveReportSummary } from '../src/appium-recorder/report-summary';
@@ -615,6 +616,17 @@ export function createApiMiddleware() {
     const requestUrl = new URL(req.url || '/', 'http://localhost');
     const pathname = requestUrl.pathname;
     const allowLocalDevice = isLocalRequest(req);
+    if (['/api/artemis/status', '/api/artemis/version'].includes(pathname) && req.method === 'GET') {
+      res.setHeader('Content-Type', 'application/json; charset=utf-8');
+      res.setHeader('Cache-Control', 'no-store');
+      if (!canManageConfig(req)) {
+        res.statusCode = 403;
+        res.end(JSON.stringify({ message: 'Artemis 集成仅允许在本机页面访问' }));
+      } else {
+        res.end(JSON.stringify(await (pathname.endsWith('/version') ? getArtemisVersion() : getArtemisStatus())));
+      }
+      return;
+    }
     if ((pathname === '/api/config' || pathname.startsWith('/api/config/') || pathname === '/api/test-model') && !canManageConfig(req)) {
       res.statusCode = 403;
       res.setHeader('Content-Type', 'application/json; charset=utf-8');

package/src/App.vue

@@ -36,9 +36,11 @@ import { useDevicePreview } from './composables/use-device-preview';
 import { useScriptExecution } from './composables/use-script-execution';
 import { useInitialResource } from './composables/use-initial-resource';
 import AppSidebar from './components/AppSidebar.vue';
+import MidsceneMaintenanceNotice from './components/MidsceneMaintenanceNotice.vue';
 const AnalysisPage = defineAsyncComponent(() => import('./pages/AnalysisPage.vue'));
 const AutomationPage = defineAsyncComponent(() => import('./pages/AutomationPage.vue'));
 const AppiumPage = defineAsyncComponent(() => import('./appium-recorder/AppiumPage.vue'));
+const ArtemisPage = defineAsyncComponent(() => import('./pages/ArtemisPage.vue'));
 const ConfigPage = defineAsyncComponent(() => import('./pages/ConfigPage.vue'));
 const GeneratorPage = defineAsyncComponent(() => import('./pages/GeneratorPage.vue'));
 const HelpCenter = defineAsyncComponent(() => import('./components/help/HelpCenter.vue'));
@@ -50,7 +52,7 @@ import type {
 } from './types';
 
 const ACTIVE_MENU_STORAGE_KEY = 'android-midscene-automation:active-menu';
-const menuKeys: MenuKey[] = ['analysis', 'generator', 'automation', 'config', 'appium', 'about'];
+const menuKeys: MenuKey[] = ['appium', 'artemis', 'generator', 'automation', 'analysis', 'config', 'about'];
 const storedMenu = window.localStorage.getItem(ACTIVE_MENU_STORAGE_KEY) as MenuKey | null;
 const activeMenu = ref<MenuKey>(storedMenu && menuKeys.includes(storedMenu) ? storedMenu : 'generator');
 const activeGeneratorMode = ref<GeneratorMode>('ai');
@@ -120,10 +122,11 @@ async function closeMenu(key: MenuKey) {
 
 const sidebarCollapsed = shallowRef(false);
 const menuItems = [
-  { key: 'analysis', label: '分析页', icon: DataAnalysis },
+  { key: 'appium', label: 'Appium', icon: Monitor },
+  { key: 'artemis', label: 'Artemis', icon: Monitor },
   { key: 'generator', label: '测试脚本生成', icon: Operation },
   { key: 'automation', label: '自动化测试', icon: Monitor },
-  { key: 'appium', label: 'Appium', icon: Monitor },
+  { key: 'analysis', label: '分析页', icon: DataAnalysis },
   { key: 'config', label: '参数配置', icon: Setting },
   { key: 'about', label: '关于', icon: InfoFilled },
 ] as const;
@@ -875,6 +878,7 @@ onUnmounted(() => {
         </div>
       </nav>
 
+      <MidsceneMaintenanceNotice v-if="activeMenu === 'generator' || activeMenu === 'automation'" />
       <div v-if="connectionError" class="connection-status" role="status">
         <span>{{ connectionError }}</span><el-button link type="primary" :loading="reconnecting" @click="reconnect">重新连接</el-button>
       </div>
@@ -885,12 +889,12 @@ onUnmounted(() => {
       <main
         class="page-body"
         :class="{
-          'page-body--fixed': activeMenu === 'generator' && activeGeneratorMode === 'ai',
           'page-body--appium': activeMenu === 'appium',
           'page-body--config': activeMenu === 'config',
+          'page-body--artemis': activeMenu === 'artemis',
         }"
       >
-        <el-alert v-if="activeMenu !== 'appium' && activeMenu !== 'config' && activeMenu !== 'about' && errorMessage" type="error" :closable="false" show-icon class="page-alert">
+        <el-alert v-if="activeMenu !== 'appium' && activeMenu !== 'artemis' && activeMenu !== 'config' && activeMenu !== 'about' && errorMessage" type="error" :closable="false" show-icon class="page-alert">
           <template #title>{{ errorMessage }}</template>
         </el-alert>
 
@@ -1006,6 +1010,7 @@ onUnmounted(() => {
         />
 
         <HelpCenter v-if="visitedMenus.has('about')" v-show="activeMenu === 'about'" :active="activeMenu === 'about'" />
+        <ArtemisPage v-if="visitedMenus.has('artemis')" v-show="activeMenu === 'artemis'" :active="activeMenu === 'artemis'" />
       </main>
     </div>
 

package/src/api.ts

@@ -48,6 +48,11 @@ export async function getAppiumVersion() {
   return readJson<AppiumVersionInfo>(response);
 }
 
+export async function getArtemisVersion() {
+  const response = await fetch(`${APP_BASE}/api/artemis/version`, { signal: AbortSignal.timeout(8000) });
+  return readJson<{ version: string; message: string }>(response);
+}
+
 // 读取已保存的脚本列表，自动化测试页面左侧脚本列表使用。
 export async function getScripts() {
   const response = await fetch(`${APP_BASE}/api/scripts`);

package/src/appium-recorder/AppiumPage.vue

@@ -2658,7 +2658,7 @@ watch(
 :deep(.appium-recorder-card--workbench > .el-card__body) { overflow: hidden; }
 :deep(.appium-workbench-tabs > .el-tabs__content) { overflow: hidden; }
 :deep(.appium-workbench-tabs .el-tab-pane) { height: 100%; overflow: auto; }
-.appium-workbench { height: 100%; box-sizing: border-box; grid-template-rows: auto minmax(0, 1fr); gap: 10px; overflow: hidden; padding: 12px; }
+.appium-workbench { height: 100%; box-sizing: border-box; grid-template-rows: auto minmax(0, 1fr); gap: 12px; overflow: hidden; padding: 8px 16px 16px; }
 .appium-workbench__flow { display: flex; flex-direction: column; min-height: 0; }
 .appium-workbench__flow h3 { margin-bottom: 6px; }
 .appium-workbench__flow :deep(.appium-recorded-steps-panel) { display: flex; flex-direction: column; flex: 1; min-height: 0; }

package/src/appium-recorder/components/ComponentInspector.vue

@@ -27,7 +27,7 @@ defineEmits<{ refresh: []; select: [node: AppiumNode] }>();
 .component-inspector :deep(.appium-tree-container) { flex: 1; min-height: 0; }
 .component-inspector :deep(.appium-node-summary) { flex: none; }
 .panel-header { font-size: 14px; gap: 4px; }
-.component-inspector__activity { flex: none; display: flex; min-width: 0; gap: 6px; padding-top: 8px; border-top: 1px solid #e4e7ed; font-size: 12px; color: #606266; }
+.component-inspector__activity { flex: none; display: flex; min-width: 0; gap: 6px; padding-top: 8px; border-top: 1px solid var(--ui-border); font-size: 12px; color: var(--ui-text-secondary); }
 .component-inspector__activity > span { flex-shrink: 0; }
 .component-inspector__activity code { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 </style>

package/src/appium-recorder/components/FlowNodeSearch.vue

@@ -49,12 +49,12 @@ function move(direction: number) {
 .flow-node-search__navigation > span:first-child { margin-right: auto; font-size: 12px; }
 .flow-node-search__navigation .el-button { width: 26px; height: 26px; min-height: 26px; padding: 0; }
 .flow-node-search__results { max-height: min(320px, 45vh); overflow: auto; }
-.flow-node-search__result { display: flex; flex-direction: column; text-align: left; gap: 4px; width: 100%; border: 0; border-bottom: 1px solid #e4e7ed; padding: 10px 8px; background: #fff; color: #303133; cursor: pointer; overflow-wrap: anywhere; }
+.flow-node-search__result { display: flex; flex-direction: column; text-align: left; gap: 4px; width: 100%; border: 0; border-bottom: 1px solid var(--ui-border); padding: 10px 8px; background: #fff; color: var(--ui-text); cursor: pointer; overflow-wrap: anywhere; }
 .flow-node-search__result[aria-current="true"] { background: #e6f4ff; }
 .flow-node-search__result:hover { background: #f0f7fc; }
 .flow-node-search__result strong { font-size: 13px; }
-.flow-node-search__result span, .flow-node-search__result small { font-size: 12px; color: #606266; }
-.flow-node-search__empty { padding: 16px 0; text-align: center; color: #606266; }
+.flow-node-search__result span, .flow-node-search__result small { font-size: 12px; color: var(--ui-text-secondary); }
+.flow-node-search__empty { padding: 16px 0; text-align: center; color: var(--ui-text-secondary); }
 </style>
 
 <style>

package/src/appium-recorder/components/ImageCheckDialog.vue

@@ -155,17 +155,17 @@ async function upload(event: Event) {
 .image-check-dialog .el-select { flex: 1; }
 .image-check-dialog .el-input-number { width: 100%; }
 .image-check-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 12px; }
-.image-check-help { margin-left: 8px; color: #606266; }
+.image-check-help { margin-left: 8px; color: var(--ui-text-secondary); }
 .image-check-grid .el-form-item__label { display: flex; align-items: center; min-height: 20px; }
 .image-check-threshold-label { display: inline-flex; align-items: center; gap: 4px; }
 .image-check-dialog .el-button.image-check-threshold-button { flex: 0 0 20px; width: 20px; height: 20px; min-height: 20px; padding: 0; font-size: 14px; }
 .image-check-threshold-help { max-width: min(300px, calc(100vw - 40px)); font-size: 12px; line-height: 1.7; overflow-wrap: anywhere; }
 .image-check-strict-warning { margin-top: 6px; }
 .image-check-template { display: grid; gap: 6px; margin-bottom: 16px; min-width: 0; }
-.image-check-size { color: #606266; font-size: 12px; }
+.image-check-size { color: var(--ui-text-secondary); font-size: 12px; }
 .image-check-region-warning { margin-bottom: 16px; }
 .image-check-template .el-image, .image-check-empty { height: 96px; width: 100%; background: #eff5f3; border: 1px solid #d5dfdb; border-radius: 4px; }
-.image-check-empty { display: grid; place-items: center; color: #606266; }
+.image-check-empty { display: grid; place-items: center; color: var(--ui-text-secondary); }
 @media (max-width: 480px) {
   .image-check-grid { grid-template-columns: minmax(0, 1fr); }
 }

package/src/appium-recorder/components/RecorderWorkspace.vue

@@ -114,19 +114,19 @@ defineExpose({ showTree, showPreview });
 <style scoped>
 .recorder-workspace { display: flex; flex-direction: column; flex: 1; min-width: 0; min-height: 0; gap: 8px; }
 .recorder-workspace__toolbar { display: flex; align-items: center; flex: none; gap: 8px; }
-.recorder-workspace__tools { display: flex; }
-.recorder-workspace__tools .el-button { width: 24px; height: 24px; min-height: 24px; padding: 0; font-size: 12px; border-radius: 4px; }
+.recorder-workspace__tools { display: flex; gap: 6px; }
+.recorder-workspace__tools .el-button { width: 24px; height: 24px; min-height: 24px; padding: 0; font-size: 12px; border-radius: 50%; }
 .recorder-workspace__panels { display: grid; position: relative; flex: 1; min-height: 0; }
 .recorder-workspace__panel, .recorder-workspace__main { position: relative; min-width: 0; min-height: 0; display: flex; flex-direction: column; }
 .recorder-workspace__panel :deep(> .el-card), .recorder-workspace__main :deep(> .el-card) { flex: 1; min-width: 0; min-height: 0; }
 .recorder-workspace__panel :deep(.el-card__header) { padding: 12px 46px 12px 12px; min-height: 56px; }
 .recorder-workspace__panel :deep(.el-card__body) { padding: 10px; }
 .recorder-workspace__collapse { position: absolute; right: 9px; top: 13px; }
-.recorder-workspace__rail { display: flex; flex-direction: column; align-items: center; gap: 12px; border: 1px solid #dce3e8; border-radius: 4px; background: #fff; color: #475569; padding: 14px 4px; cursor: pointer; }
+.recorder-workspace__rail { display: flex; flex-direction: column; align-items: center; gap: 12px; border: 1px solid var(--ui-border); border-radius: var(--ui-radius-control); background: var(--ui-surface); color: #475569; padding: 14px 4px; cursor: pointer; }
 .recorder-workspace__rail span { writing-mode: vertical-rl; font-size: 13px; }
 .recorder-workspace__separator { cursor: col-resize; touch-action: none; user-select: none; }
 .recorder-workspace__separator:hover, .recorder-workspace__separator:focus-visible { background: #b3d8ff; outline: none; }
 .recorder-workspace__separator.is-disabled { pointer-events: none; }
-.recorder-workspace__panel--drawer { position: absolute; inset: 0 auto 0 0; width: min(340px, 100%); z-index: 22; background: #fff; box-shadow: 3px 0 16px #0002; }
+.recorder-workspace__panel--drawer { position: absolute; inset: 0 auto 0 0; width: min(340px, 100%); z-index: 22; background: var(--ui-surface); box-shadow: var(--ui-shadow-popover); }
 .recorder-workspace__backdrop { position: absolute; inset: 0; border: 0; background: #0003; z-index: 21; }
 </style>

package/src/appium-recorder/flow-appearance.ts

@@ -1,10 +1,10 @@
 import type { InjectionKey, Ref } from 'vue';
 
-export const DEFAULT_FLOW_BACKGROUND = '#d4e8dd';
-export const FLOW_BACKGROUND_PRESETS = ['#d4e8dd', '#d5e6f5', '#e4dcf2', '#f2dedc', '#d5eae9', '#e8e4cc'];
+export const DEFAULT_FLOW_BACKGROUND = '#f8fafc';
+export const FLOW_BACKGROUND_PRESETS = ['#f8fafc', '#d4e8dd', '#d5e6f5', '#e4dcf2', '#f2dedc', '#d5eae9', '#e8e4cc'];
 export const flowBackgroundKey: InjectionKey<Readonly<Ref<string>>> = Symbol('flowBackground');
-export const DEFAULT_FLOW_LINE_COLOR = '#719985';
-export const FLOW_LINE_COLOR_PRESETS = ['#719985', '#4b83c4', '#8b6bb1', '#c78a46', '#7b8794', '#374151'];
+export const DEFAULT_FLOW_LINE_COLOR = '#94a3b8';
+export const FLOW_LINE_COLOR_PRESETS = ['#94a3b8', '#719985', '#4b83c4', '#8b6bb1', '#c78a46', '#7b8794', '#374151'];
 export const flowLineColorKey: InjectionKey<Readonly<Ref<string>>> = Symbol('flowLineColor');
 
 export function isHexColor(value: unknown): value is string {

package/src/components/AppSidebar.vue

@@ -9,21 +9,22 @@ defineEmits<{ select: [key: string] }>();
 <template>
   <aside class="layout-sidebar" aria-label="主导航">
     <div class="layout-sidebar__top">
-      <div class="layout-sidebar__logo" aria-hidden="true">M</div>
-      <span v-if="!collapsed" class="layout-sidebar__brand">Midscene <span>Admin</span></span>
+      <div class="layout-sidebar__logo" aria-hidden="true">A</div>
+      <span v-if="!collapsed" class="layout-sidebar__brand" title="移动自动化控制台">移动自动化<span>控制台</span></span>
     </div>
     <el-menu :default-active="activeMenu" :default-openeds="['overview', 'midscene']" :collapse="collapsed"
       :collapse-transition="false" class="layout-menu" @select="$emit('select', $event)">
-      <el-sub-menu index="overview" aria-label="概览">
-        <template #title><el-icon><Grid /></el-icon><span>概览</span></template>
-        <el-menu-item index="analysis" aria-label="分析页"><el-icon><DataAnalysis /></el-icon><template #title>分析页</template></el-menu-item>
-      </el-sub-menu>
+      <el-menu-item index="appium" aria-label="Appium"><el-icon><Monitor /></el-icon><template #title>Appium</template></el-menu-item>
+      <el-menu-item index="artemis" aria-label="Artemis"><el-icon><Monitor /></el-icon><template #title>Artemis</template></el-menu-item>
       <el-sub-menu index="midscene" aria-label="Midscene">
         <template #title><el-icon><Operation /></el-icon><span>Midscene</span></template>
         <el-menu-item index="generator" aria-label="测试脚本生成"><el-icon><Operation /></el-icon><template #title>测试脚本生成</template></el-menu-item>
         <el-menu-item index="automation" aria-label="自动化测试"><el-icon><Monitor /></el-icon><template #title>自动化测试</template></el-menu-item>
       </el-sub-menu>
-      <el-menu-item index="appium" aria-label="Appium"><el-icon><Monitor /></el-icon><template #title>Appium</template></el-menu-item>
+      <el-sub-menu index="overview" aria-label="概览">
+        <template #title><el-icon><Grid /></el-icon><span>概览</span></template>
+        <el-menu-item index="analysis" aria-label="分析页"><el-icon><DataAnalysis /></el-icon><template #title>分析页</template></el-menu-item>
+      </el-sub-menu>
       <el-menu-item index="config" aria-label="参数配置"><el-icon><Setting /></el-icon><template #title>参数配置</template></el-menu-item>
       <el-menu-item index="about" aria-label="关于"><el-icon><InfoFilled /></el-icon><template #title>关于</template></el-menu-item>
     </el-menu>

package/src/components/MidsceneMaintenanceNotice.vue

@@ -0,0 +1,17 @@
+<template>
+  <div class="midscene-maintenance">
+    <el-alert title="Midscene 维护说明" type="warning" :closable="false" show-icon>
+      本项目中的 Midscene 集成已停止日常维护，现有功能仍保留。后续可能根据情况升级依赖版本，但不再进行深入测试，建议使用 Midscene 官方版本。
+      <a href="https://midscenejs.com/zh/" target="_blank" rel="noopener noreferrer">查看官方文档 ↗</a>
+    </el-alert>
+  </div>
+</template>
+
+<style scoped>
+.midscene-maintenance { flex: none; padding: 8px 20px 0; }
+.midscene-maintenance :deep(.el-alert) { padding: 6px 12px; }
+.midscene-maintenance :deep(.el-alert__title) { font-size: 13px; line-height: 19px; }
+.midscene-maintenance :deep(.el-alert__description) { margin-top: 2px; font-size: 12px; line-height: 18px; }
+.midscene-maintenance :deep(.el-alert__icon) { font-size: 16px; width: 16px; }
+.midscene-maintenance a { margin-left: 8px; color: var(--ui-primary); text-decoration: underline; white-space: nowrap; }
+</style>