android-midscene-automation 0.1.28 → 0.1.30

package/CHANGELOG.md

@@ -1,7 +1,20 @@
 # 更新记录
 
+## v0.1.30
+
+- 新增节点批量删除功能，支持多选节点，选中节点及所属子节点以柔和红色背景和浅色文字标记，确认后统一删除；支持普通与放大视图同步操作。
+
+## v0.1.29
+
+- 判断节点新增“合并分支”，支持选择一侧公共流程起点，将两侧后续汇入同一段居中流程；另一侧可保留独有操作或确认删除重复后缀，支持嵌套判断及各类分支，公共节点只执行一次且不随单侧节点删除。
+- 将 Checkbox、RadioButton 判断入口合并为“判断勾选”，新增 Switch 支持；添加和回放时自动校验组件类型及可勾选属性，读取实时 checked 状态进入 true / false 分支，不改变控件状态，兼容已有独立判断节点。
+- “流程控制”新增终止流程节点，执行到该节点时主动结束本次回放，不再执行后续节点或连接脚本；子脚本触发时也结束整个流程，保留执行日志和报告，不作为执行失败。
+- “设备操作”新增启动相册顺序节点，优先解析系统相册入口，必要时查找已安装的常见相册应用；仅打开相册，不选择照片，日志记录实际启动应用，找不到或启动失败时明确报错。
+- Appium 配置新增流程背景色设置，默认沿用浅绿色，支持预选颜色、颜色选择器、#RGB / #RRGGBB 输入校验和恢复默认；保存后持久化，普通画布、放大视图和连接脚本预览统一应用。
+
 ## v0.1.28
 
+- Appium 配置中的流程背景色独立成区，与节点模型配置分开展示，保留预选颜色、自定义颜色及保存入口。
 - “组件操作”新增文字点击分支节点，无需预选元素，支持精准匹配和模糊匹配原生组件文字；匹配并点击后进入“匹配到文字”，等待超时未找到则进入“未匹配到文字”。支持编辑文字和超时，多元素匹配及点击异常明确报错，日志和报告保留分支结果。
 - “流程控制”新增输出日志节点，支持设置日志内容和自定义关键字，默认按 `stageLog:内容` 输出；支持添加后编辑，回放实时输出、日志文件及报告均保留日志内容，多行内容逐行添加关键字。
 - 新增 AI 识别判断节点，可输入按钮可用、画面黑屏等识别要求，通过当前设备截图返回 `true / false` 并进入对应分支；Appium配置支持独立设置 Base URL、API Key、Model Name 和测试模型，模型需支持图片输入。

package/README.md

@@ -1229,8 +1229,21 @@ Linux: ~/.local/share/android-midscene-automation
 
 # 项目更新记录
 
+## v0.1.30
+
+- 新增节点批量删除功能，支持多选节点，选中节点及所属子节点以柔和红色背景和浅色文字标记，确认后统一删除；支持普通与放大视图同步操作。
+
+## v0.1.29
+
+- 判断节点新增“合并分支”，支持选择一侧公共流程起点，将两侧后续汇入同一段居中流程；另一侧可保留独有操作或确认删除重复后缀，支持嵌套判断及各类分支，公共节点只执行一次且不随单侧节点删除。
+- 将 Checkbox、RadioButton 判断入口合并为“判断勾选”，新增 Switch 支持；添加和回放时自动校验组件类型及可勾选属性，读取实时 checked 状态进入 true / false 分支，不改变控件状态，兼容已有独立判断节点。
+- “流程控制”新增终止流程节点，执行到该节点时主动结束本次回放，不再执行后续节点或连接脚本；子脚本触发时也结束整个流程，保留执行日志和报告，不作为执行失败。
+- “设备操作”新增启动相册顺序节点，优先解析系统相册入口，必要时查找已安装的常见相册应用；仅打开相册，不选择照片，日志记录实际启动应用，找不到或启动失败时明确报错。
+- Appium 配置新增流程背景色设置，默认沿用浅绿色，支持预选颜色、颜色选择器、#RGB / #RRGGBB 输入校验和恢复默认；保存后持久化，普通画布、放大视图和连接脚本预览统一应用。
+
 ## v0.1.28
 
+- Appium 配置中的流程背景色独立成区，与节点模型配置分开展示，保留预选颜色、自定义颜色及保存入口。
 - “组件操作”新增文字点击分支节点，无需预选元素，支持精准匹配和模糊匹配原生组件文字；匹配并点击后进入“匹配到文字”，等待超时未找到则进入“未匹配到文字”。支持编辑文字和超时，多元素匹配及点击异常明确报错，日志和报告保留分支结果。
 - “流程控制”新增输出日志节点，支持设置日志内容和自定义关键字，默认按 `stageLog:内容` 输出；支持添加后编辑，回放实时输出、日志文件及报告均保留日志内容，多行内容逐行添加关键字。
 - 新增 AI 识别判断节点，可输入按钮可用、画面黑屏等识别要求，通过当前设备截图返回 `true / false` 并进入对应分支；Appium配置支持独立设置 Base URL、API Key、Model Name 和测试模型，模型需支持图片输入。

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "android-midscene-automation",
-  "version": "0.1.28",
+  "version": "0.1.30",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/oooooooko/android-midscene-automation.git"

package/server/appium-recorder/appium-runner.ts

@@ -2,6 +2,7 @@ import { execFile } from 'node:child_process';
 import { adbScreenshotBase64 } from './screenshot';
 import { recognizeDeviceScreen } from './ai-recognition';
 import { formatStageLog } from '../../src/appium-recorder/stage-log';
+import { openGalleryOnDevice } from './open-gallery';
 import { textClickSelector } from '../../src/appium-recorder/text-click';
 import { AsyncLocalStorage } from 'node:async_hooks';
 import { mkdir, writeFile } from 'node:fs/promises';
@@ -14,7 +15,7 @@ import { startManagedAppiumServer, usesManagedAppiumServer } from './managed-app
 import { compareVisualChangeFrames, type VisualChangeRegion } from './visual-change';
 import { longPressMode, validateLongPress } from '../../src/appium-recorder/long-press';
 import { defaultFlowKind, flowBranchLabel } from '../../src/appium-recorder/flow-labels';
-import { isNativeStateCondition, nativeControlName, nativeControlType, parseNativeBoolean } from '../../src/appium-recorder/native-control-state';
+import { isNativeStateCondition, nativeControlName, matchesNativeControl, parseNativeBoolean } from '../../src/appium-recorder/native-control-state';
 
 type AppiumSessionResponse = {
   value?: {
@@ -57,6 +58,7 @@ const replayContext = new AsyncLocalStorage<{
   visualChecks: AppiumReplayVisualCheck[];
   pendingVisualChecks: PendingVisualChangeCheck[];
   softFailureCount: number;
+  flowEnded?: boolean;
 }>();
 
 const appiumServerUrl = () => replayContext.getStore()?.serverUrl || configuredAppiumServerUrl();
@@ -523,6 +525,7 @@ type RunStepResult = string | {
 };
 
 function completedStepStatus(step: AppiumRecordedStepRecord, softFailed: boolean) {
+  if (step.type === 'endFlow') return '流程已结束';
   if (step.type === 'visualChange') {
     if (step.visualChange?.role === 'start') return '已记录基准帧';
     if (step.visualChange?.role === 'end') return '已记录对比帧';
@@ -729,6 +732,13 @@ async function runStep(
     return;
   }
   if (step.type === 'log') return formatStageLog(step);
+  if (step.type === 'openGallery') return openGalleryOnDevice(deviceId, replayContext.getStore()?.signal);
+  if (step.type === 'endFlow') {
+    // 同一次回放的主脚本和连接脚本共享结束状态，不影响下一次回放。
+    const context = replayContext.getStore();
+    if (context) context.flowEnded = true;
+    return '流程已主动结束，后续节点不再执行';
+  }
 
   if (step.type === 'coordinateTap') {
     await tapFallback(deviceId, step);
@@ -894,7 +904,7 @@ async function readNativeControlState(sessionId: string, step: AppiumRecordedSte
     await appiumRequest<AppiumValueResponse<unknown>>(`/session/${sessionId}/element/${elementId}/attribute/${name}`)
   ).value;
   const className = await attribute('className');
-  if (nativeControlType(className) !== step.type) {
+  if (!matchesNativeControl(step.type, className)) {
     throw new Error(`${step.label} 目标不是原生 ${nativeControlName(step.type)}，实际类型：${String(className ?? '未知')}`);
   }
   if (parseNativeBoolean(await attribute('checkable')) !== true) {
@@ -1067,6 +1077,7 @@ async function replayLinearSteps(
   options: ReplayStepOptions = {},
 ) {
   for (const [index, step] of steps.entries()) {
+    if (replayContext.getStore()?.flowEnded) return;
     throwIfReplayStopped();
     if (shouldSkipLinkedScriptInitStep(options, step)) {
       lines.push(`[节点 ${index + 1}] 跳过：${step.label}（${linkedScriptInitSkipReason(step)}）`);
@@ -1133,6 +1144,7 @@ async function replayFlowSteps(
   const maxVisits = Math.max(steps.length * 4, 20);
 
   while (typeof index === 'number' && index >= 0 && index < steps.length) {
+    if (replayContext.getStore()?.flowEnded) return;
     throwIfReplayStopped();
     guard += 1;
     if (guard > maxVisits) throw new Error('流程图可能存在循环，已终止回放');
@@ -1261,6 +1273,7 @@ async function replayScriptSteps(
   await replayStepGroup(sessionId, deviceId, mainSteps, lines, stack, options);
 
   for (const [offset, step] of trailingLinkedSteps.entries()) {
+    if (replayContext.getStore()?.flowEnded) return;
     const nodeNumber = trailingLinkIndex + offset + 1;
     lines.push(`当前脚本步骤完成，开始执行：${step.label}`);
     lines.push(`[节点 ${nodeNumber}] 开始：${step.label}`);

package/server/appium-recorder/open-gallery.ts

@@ -0,0 +1,52 @@
+import { execFile } from 'node:child_process';
+import { getAdbCommand } from '../android-sdk';
+
+const MAIN = 'android.intent.action.MAIN';
+const GALLERY = 'android.intent.category.APP_GALLERY';
+const LAUNCHER = 'android.intent.category.LAUNCHER';
+// 仅检查已安装的相册应用，不安装应用，也不打开照片选择器。
+const galleryPackages = [
+  'com.android.gallery3d', 'com.miui.gallery', 'com.sec.android.gallery3d',
+  'com.huawei.photos', 'com.hihonor.photos', 'com.coloros.gallery3d',
+  'com.oplus.gallery', 'com.vivo.gallery', 'com.google.android.apps.photos',
+];
+
+function components(output: string) {
+  return output.split(/\r?\n/).map((line) => line.trim()).filter((line) => (
+    /^[\w.]+\/[\w.$]+$/.test(line) && !/(?:Resolver|Chooser)Activity/.test(line)
+  ));
+}
+
+export async function openGalleryOnDevice(deviceId: string, signal?: AbortSignal) {
+  const run = (args: string[]) => new Promise<string>((resolve, reject) => {
+    execFile(getAdbCommand(), ['-s', deviceId, 'shell', ...args], {
+      timeout: 20000, maxBuffer: 4 * 1024 * 1024, signal,
+    }, (error, stdout, stderr) => {
+      if (error) { reject(error); return; }
+      resolve(`${stdout}\n${stderr}`.trim());
+    });
+  });
+  const query = (command: string, category: string, packageName?: string) => run([
+    'cmd', 'package', command, '--brief', '--user', 'current', '-a', MAIN, '-c', category,
+    ...(packageName ? ['-p', packageName] : []),
+  ]);
+  let component = components(await query('resolve-activity', GALLERY))[0];
+  if (!component) component = components(await query('query-activities', GALLERY))[0];
+  if (!component) {
+    const installed = new Set((await run(['pm', 'list', 'packages', '--user', 'current']))
+      .split(/\r?\n/).map((line) => line.trim().replace(/^package:/, '')));
+    for (const packageName of galleryPackages) {
+      if (!installed.has(packageName)) continue;
+      component = components(await query('resolve-activity', LAUNCHER, packageName))
+        .find((item) => item.startsWith(`${packageName}/`));
+      if (component) break;
+    }
+  }
+  if (!component) throw new Error('未找到可启动的相册应用，请检查手机是否安装并启用了相册');
+  const output = await run(['am', 'start', '-W', '--user', 'current', '-a', MAIN, '-n', component]);
+  // am start 某些错误仍返回 0，不能只检查进程退出码。
+  if (!/^Status:\s*ok\s*$/im.test(output) || /Error:|Exception|Permission Denial/i.test(output)) {
+    throw new Error(`启动相册失败：${output || component}`);
+  }
+  return `已启动相册：${component}`;
+}

package/server/appium-recorder/repository.ts

@@ -20,6 +20,7 @@ export type AppiumRecordedStepRecord = {
     | 'waitFor'
     | 'assertExists'
     | 'checkboxState'
+    | 'checkedState'
     | 'radioButtonState'
     | 'aiRecognition'
     | 'textClick'
@@ -31,6 +32,8 @@ export type AppiumRecordedStepRecord = {
     | 'swipe'
     | 'screenshot'
     | 'launchApp'
+    | 'openGallery'
+    | 'endFlow'
     | 'clearAppData'
     | 'waitDisappear'
     | 'assertText'

package/server/config.ts

@@ -1,4 +1,5 @@
 import fs from 'node:fs';
+import { isHexColor, normalizeFlowBackground } from '../src/appium-recorder/flow-appearance';
 import os from 'node:os';
 import path from 'node:path';
 import YAML from 'yaml';
@@ -7,7 +8,7 @@ import { loadModelConfigFromDb, saveModelConfigToDb } from './config-store';
 import type { AiRecognitionModel } from '../src/appium-recorder/ai-recognition';
 
 export type AppConfig = {
-  appium: { model: AiRecognitionModel };
+  appium: { model: AiRecognitionModel; flowBackgroundColor?: string };
   runtime: {
     androidSdkPath: string;
     reportOutputPath: string;
@@ -83,6 +84,7 @@ function normalizeConfig(config: Partial<AppConfig> | null | undefined): AppConf
   return {
     // 旧配置没有 Appium 模型时保留空值，不借用其他模型或改变已有配置。
     appium: {
+      flowBackgroundColor: normalizeFlowBackground(config?.appium?.flowBackgroundColor),
       model: Object.fromEntries(['baseUrl', 'apiKey', 'name'].map((key) => {
         const value = config?.appium?.model?.[key as keyof AiRecognitionModel];
         return [key, typeof value === 'string' ? value.trim() : ''];
@@ -204,6 +206,9 @@ export function loadConfig(): AppConfig {
 }
 
 export function saveConfig(config: AppConfig) {
+  if (config.appium?.flowBackgroundColor !== undefined && !isHexColor(config.appium.flowBackgroundColor)) {
+    throw new ConfigValidationError('流程背景色必须是有效的十六进制颜色（#RGB 或 #RRGGBB）');
+  }
   const normalized = normalizeConfig(config);
   validateRuntimeConfig(normalized);
   cachedConfig = normalized;

package/src/App.vue

@@ -33,6 +33,7 @@ import {
 import * as api from './api';
 import AutomationPage from './pages/AutomationPage.vue';
 import AppiumPage from './appium-recorder/AppiumPage.vue';
+import { DEFAULT_FLOW_BACKGROUND, isHexColor } from './appium-recorder/flow-appearance';
 import ConfigPage from './pages/ConfigPage.vue';
 import GeneratorPage from './pages/GeneratorPage.vue';
 import type {
@@ -702,6 +703,10 @@ const getMidsceneModelConfigError = () => {
 };
 
 const saveModelConfig = async () => {
+  if (!isHexColor(configForm.appium.flowBackgroundColor ?? DEFAULT_FLOW_BACKGROUND)) {
+    ElMessage.warning('流程背景色格式错误，请输入 #RGB 或 #RRGGBB');
+    return;
+  }
   isSavingModelConfig.value = true;
   errorMessage.value = '';
   openActionDialog('保存参数配置');
@@ -1564,6 +1569,7 @@ onUnmounted(() => {
           :active="activeMenu === 'appium'"
           :app-presets="appPresets"
           :ai-recognition-model-configured="aiRecognitionModelConfigured"
+          :flow-background-color="configForm.appium.flowBackgroundColor"
           :device-actions="deviceActions"
           :playground-available="playgroundAvailable"
           :playground-device-id="playgroundDeviceId"

package/src/appium-recorder/AppiumPage.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
-import { computed, h, onMounted, onUnmounted, reactive, shallowRef, watch } from 'vue';
+import { computed, h, onMounted, onUnmounted, provide, reactive, shallowRef, watch } from 'vue';
+import { flowBackgroundKey, normalizeFlowBackground } from './flow-appearance';
 import { ElForm, ElFormItem, ElInputNumber, ElMessage, ElMessageBox, ElOption, ElSelect } from 'element-plus';
 import { Check, CircleClose, CopyDocument, Delete, Document, Download, Edit, Plus, Refresh, Upload, VideoPlay, View } from '@element-plus/icons-vue';
 import type { AndroidDevice, AppPreset, DeviceAction } from '../types';
@@ -37,7 +38,7 @@ import {
 } from './flow-copy';
 import { labelFlowStep } from './flow-labels';
 import { validateLongPress } from './long-press';
-import { nativeControlName, nativeControlType } from './native-control-state';
+import { nativeControlName, matchesNativeControl } from './native-control-state';
 import { normalizeLegacyNestedConditionBranches } from './flow-normalize';
 import { removeFlowStep } from './flow-remove';
 import type { FlowActionGroup, InsertAction } from './flow-graph';
@@ -89,6 +90,7 @@ const insertableRecorderActions: RecorderAction[] = [
   'backIfExists',
   'popupCondition',
   'checkboxState',
+  'checkedState',
   'radioButtonState',
   'aiRecognition',
   'textClick',
@@ -102,6 +104,8 @@ const insertableRecorderActions: RecorderAction[] = [
   'clearInput',
   'coordinateTap',
   'launchApp',
+  'openGallery',
+  'endFlow',
   'clearAppData',
   'waitDisappear',
   'assertText',
@@ -117,6 +121,7 @@ const readonlyFlowSelectedIndexes: number[] = [];
 
 const props = defineProps<{
   aiRecognitionModelConfigured?: boolean;
+  flowBackgroundColor?: string;
   active: boolean;
   appPresets: AppPreset[];
   deviceActions: readonly DeviceAction[];
@@ -140,6 +145,8 @@ const props = defineProps<{
   ) => Promise<void>;
 }>();
 
+// provide/inject 随组件关系传递，放大弹窗 teleport 后也能使用同一颜色。
+provide(flowBackgroundKey, computed(() => normalizeFlowBackground(props.flowBackgroundColor)));
 const selectedDeviceId = computed(() => props.playgroundDeviceId);
 const tree = shallowRef<AppiumNode | null>(null);
 const selectedNode = shallowRef<AppiumNode | null>(null);
@@ -1273,6 +1280,12 @@ async function addAction(
   if (action === 'delay') {
     return addDelayStep(index, branchTarget);
   }
+  if (action === 'openGallery') {
+    return insertStep({ id: createStepId(), type: 'openGallery', label: '启动相册', flow: { nodeKind: 'action' } }, index, branchTarget);
+  }
+  if (action === 'endFlow') {
+    return insertStep({ id: createStepId(), type: 'endFlow', label: '终止流程', flow: { nodeKind: 'action' } }, index, branchTarget);
+  }
   if (action === 'aiRecognition') {
     const input = await ElMessageBox.prompt('识别内容', '添加 AI 识别', {
       inputType: 'textarea',
@@ -1416,13 +1429,13 @@ async function addAction(
   }
   const node = getSelectedNode();
   if (!node) return;
-  if (action === 'checkboxState' || action === 'radioButtonState') {
+  if (action === 'checkboxState' || action === 'radioButtonState' || action === 'checkedState') {
     const controlName = nativeControlName(action);
-    if (nativeControlType(node.className) !== action || node.checkable !== true) {
+    if (!matchesNativeControl(action, node.className) || node.checkable !== true) {
       ElMessage.warning(`请选择原生 ${controlName} 元素，当前选中：${node.className || '未知类型'}`);
       return;
     }
-    const step = createNodeActionStep(action, `判断 ${controlName} 状态`, node, { timeoutMs: 2000 });
+    const step = createNodeActionStep(action, action === 'checkedState' ? '判断勾选' : `判断 ${controlName} 状态`, node, { timeoutMs: 2000 });
     if ((!step.selector?.value || step.selector.strategy === 'bounds') && node.xpath) {
       step.selector = { strategy: 'xpath', value: node.xpath };
       step.contextSelector = undefined;
@@ -2082,14 +2095,11 @@ watch(
                     />
                   </el-select>
                 </div>
-                <el-alert
+                <details
                   v-if="scriptActivityMismatch"
-                  class="appium-activity-lock-alert"
-                  title="当前脚本已锁定"
-                  type="warning"
-                  show-icon
-                  :closable="false"
+                  class="appium-activity-summary"
                 >
+                  <summary>当前页面与脚本不一致，部分录制操作不可用</summary>
                   <div class="appium-activity-lock-alert__details">
                     <div>
                       <strong>脚本绑定</strong>
@@ -2101,7 +2111,7 @@ watch(
                     </div>
                     <p>请在录制流程中添加或执行“启动 APP”节点；Activity 匹配后会自动解除编辑锁定。</p>
                   </div>
-                </el-alert>
+                </details>
                 <NodeDetail
                   :node="selectedNode"
                   :current-activity="currentActivity"
@@ -2109,7 +2119,7 @@ watch(
                 />
               </section>
 
-              <section class="appium-workbench__section">
+              <section class="appium-workbench__section appium-workbench__flow">
                 <h3>录制步骤</h3>
                 <RecordedSteps
                   :key="newScriptRevision"
@@ -2118,6 +2128,7 @@ watch(
                   :clipboard-count="flowClipboardCount"
                   :disabled="recordingLocked"
                   :remove-disabled="recordingBusy"
+                  :merge-disabled="recordingBusy || replaying || saving"
                   :allowed-locked-actions="scriptActivityMismatch && !recordingBusy ? insertableRecorderActions : []"
                   :launching-step-id="executingAppStepId"
                   @remove="removeStep"
@@ -2130,6 +2141,7 @@ watch(
                   @preview-linked-script="previewLinkedScriptStep"
                   @execute-step="executeFlowStep"
                   @update-step="updateStep"
+                  @replace-steps="!recordingBusy && !replaying && !saving && (steps = $event)"
                 />
               </section>
 
@@ -2388,3 +2400,18 @@ watch(
     </el-tooltip>
   </section>
 </template>
+
+<style scoped>
+.appium-activity-summary { margin: 8px 0; color: #946000; font-size: 12px; }
+.appium-activity-summary summary { cursor: pointer; line-height: 20px; }
+.appium-activity-summary[open] .appium-activity-lock-alert__details { max-height: 110px; overflow: auto; margin-top: 6px; }
+: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(180px, 1fr); gap: 10px; overflow: auto; }
+.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; }
+.appium-workbench__flow :deep(.appium-flow-toolbar) { flex: none; margin-bottom: 8px; }
+.appium-workbench__flow :deep(.appium-flow-canvas--vue:not(.appium-flow-canvas--dialog)) { flex: 1; height: auto; min-height: 120px; }
+</style>

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

@@ -1,5 +1,6 @@
 <script setup lang="ts">
-import { computed, nextTick, onBeforeUnmount, shallowRef, watch } from 'vue';
+import { computed, inject, nextTick, onBeforeUnmount, shallowRef, watch } from 'vue';
+import { DEFAULT_FLOW_BACKGROUND, flowBackgroundKey } from '../flow-appearance';
 import { useVueFlow, VueFlow } from '@vue-flow/core';
 import FlowNodeCard from './FlowNodeCard.vue';
 import FlowRoundedEdge from './FlowRoundedEdge.vue';
@@ -12,15 +13,19 @@ import {
 } from '../flow-graph';
 import type { AppiumRecordedStep } from '../types';
 
+const flowBackground = inject(flowBackgroundKey, computed(() => DEFAULT_FLOW_BACKGROUND));
+
 const props = defineProps<{
   aiRecognitionModelConfigured?: boolean;
   id: string;
   steps: AppiumRecordedStep[];
   expandedStepIndex: number | null;
   copyMode: boolean;
+  deleteMode?: boolean;
   selectedCopyIndexes: number[];
   disabled?: boolean;
   removeDisabled?: boolean;
+  mergeDisabled?: boolean;
   readonly?: boolean;
   launchingStepId?: string;
   clipboardCount?: number;
@@ -37,6 +42,7 @@ const props = defineProps<{
 
 const emit = defineEmits<{
   nodeClick: [index: number];
+  merge: [index: number];
   copy: [indexes: number[]];
   paste: [index: number, branch?: FlowBranch];
   remove: [index: number];
@@ -56,6 +62,8 @@ let resetViewFrame = 0;
 let pendingResetView = false;
 
 const graph = computed(() => buildFlowGraph(props.steps, {
+  deleteMode: props.deleteMode,
+  mergeDisabled: props.mergeDisabled,
   aiRecognitionModelConfigured: props.aiRecognitionModelConfigured,
   expandedStepIndex: props.expandedStepIndex,
   selectedCopyIndexes: props.selectedCopyIndexes,
@@ -170,7 +178,7 @@ function handleInsert(payload: {
 </script>
 
 <template>
-  <div class="appium-flow-canvas appium-flow-canvas--vue">
+  <div class="appium-flow-canvas appium-flow-canvas--vue" :style="{ '--flow-background': flowBackground }">
     <VueFlow
       :id="id"
       class="appium-vue-flow"
@@ -204,6 +212,7 @@ function handleInsert(payload: {
           @execute="emit('executeStep', $event)"
           @insert="handleInsert"
           @update-step="emit('updateStep', $event.index, $event.step)"
+          @merge="emit('merge', $event)"
           @preview-linked-script="emit('previewLinkedScript', $event)"
           @resize="handleNodeResize"
         />

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

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { computed, nextTick, onBeforeUnmount, onMounted, shallowRef, watch } from 'vue';
 import { Handle, Position } from '@vue-flow/core';
-import { CopyDocument, Delete, Edit, Plus, VideoPlay, View, WarningFilled } from '@element-plus/icons-vue';
+import { CopyDocument, Delete, Edit, Plus, VideoPlay, View, WarningFilled, Connection } from '@element-plus/icons-vue';
 import { AI_MODEL_CONFIG_HINT } from '../ai-recognition';
 import type { AppiumRecordedStep } from '../types';
 import {
@@ -22,6 +22,7 @@ const props = defineProps<{
 const emit = defineEmits<{
   nodeClick: [index: number];
   copy: [index: number];
+  merge: [index: number];
   remove: [index: number];
   editInput: [index: number];
   previewLinkedScript: [index: number];
@@ -158,6 +159,7 @@ watch(() => props.data, () => {
         {
           'appium-flow-step-shell--expanded': data.expanded,
           'appium-flow-step-shell--selected': data.selected,
+          'appium-flow-step-shell--delete-selected': data.selected && data.deleteMode,
           'appium-flow-step-shell--copying': data.copyMode,
           'appium-flow-step-shell--readonly': props.readonly,
         },
@@ -180,17 +182,25 @@ watch(() => props.data, () => {
           <em v-if="data.note" :title="data.note">{{ data.note }}</em>
         </span>
       </button>
-      <span v-if="!props.readonly" class="appium-flow-step-card__actions nodrag nopan" @click.stop>
+      <span v-if="!props.readonly && !data.deleteMode" class="appium-flow-step-card__actions nodrag nopan" @click.stop>
+        <el-tooltip v-if="data.flowKind === 'condition' && !data.copyMode" content="合并分支：将两侧后续节点汇入公共流程" placement="top" :show-after="200">
+        <span class="appium-node-action-tooltip"><el-button text size="small" :icon="Connection"
+          title="合并分支" aria-label="合并分支" :disabled="data.mergeDisabled || Boolean(data.step.flow?.successTargetId)"
+          @click="emit('merge', data.index)" />
+        </span></el-tooltip>
+        <el-tooltip v-if="!data.copyMode && data.canCopy" content="复制节点：复制后可在插入位置粘贴" placement="top" :show-after="200">
+        <span class="appium-node-action-tooltip">
         <el-button
-          v-if="!data.copyMode && data.canCopy"
           text
           size="small"
           :icon="CopyDocument"
           title="复制节点"
           @click="emit('copy', data.index)"
         />
+        </span></el-tooltip>
+        <el-tooltip v-if="data.canExecute" :content="data.step.type === 'aiRecognition' ? '测试 AI 识别：使用当前设备画面测试识别结果' : '立即执行：在当前设备上执行此操作'" placement="top" :show-after="200">
+        <span class="appium-node-action-tooltip">
         <el-button
-          v-if="data.canExecute"
           text
           size="small"
           :icon="VideoPlay"
@@ -200,8 +210,10 @@ watch(() => props.data, () => {
           :aria-label="data.step.type === 'aiRecognition' ? '测试 AI 识别' : '立即执行'"
           @click="emit('execute', data.index)"
         />
+        </span></el-tooltip>
+        <el-tooltip v-if="data.canEditInput" content="修改输入内容：编辑此节点要输入的文字" placement="top" :show-after="200">
+        <span class="appium-node-action-tooltip">
         <el-button
-          v-if="data.canEditInput"
           text
           size="small"
           :icon="Edit"
@@ -209,14 +221,19 @@ watch(() => props.data, () => {
           title="修改输入内容"
           @click="emit('editInput', data.index)"
         />
+        </span></el-tooltip>
+        <el-tooltip v-if="data.step.type === 'runScript'" content="预览连接脚本：查看关联脚本的流程" placement="top" :show-after="200">
+        <span class="appium-node-action-tooltip">
         <el-button
-          v-if="data.step.type === 'runScript'"
           text
           size="small"
           :icon="View"
           title="预览连接脚本"
           @click="emit('previewLinkedScript', data.index)"
         />
+        </span></el-tooltip>
+        <el-tooltip :content="data.flowKind === 'condition' ? '删除节点：同时删除所属分支子节点，保留公共流程' : '删除节点：移除此操作并连接前后节点'" placement="top" :show-after="200">
+        <span class="appium-node-action-tooltip">
         <el-button
           text
           size="small"
@@ -225,6 +242,7 @@ watch(() => props.data, () => {
           title="删除节点"
           @click="emit('remove', data.index)"
         />
+        </span></el-tooltip>
       </span>
       <FlowStepEditor
         v-if="!props.readonly && data.expanded"
@@ -246,5 +264,10 @@ watch(() => props.data, () => {
 </template>
 
 <style scoped>
+.appium-flow-step-shell--delete-selected .appium-flow-step-card { background: #b83232; border-color: #a52a2a; }
+.appium-flow-step-shell--delete-selected .appium-flow-step-card__content strong,
+.appium-flow-step-shell--delete-selected .appium-flow-step-card__content em { color: #fff; }
+.appium-flow-step-shell--delete-selected .appium-flow-step-card__content small { color: #fee2e2; }
+.appium-node-action-tooltip { display: inline-flex; }
 .appium-ai-model-warning { float: left; margin: 2px 6px 0 0; font-size: 16px; }
 </style>

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

@@ -27,6 +27,12 @@ const path = computed(() => {
   const deltaX = target.x - source.x;
   const deltaY = target.y - source.y;
 
+  if (props.data?.merge && deltaY > 0) {
+    // 同一公共节点的入边共用横线高度，不能随各分支的长度变化。
+    const joinY = target.y - 24;
+    return linePath([source, { x: source.x, y: joinY }, { x: target.x, y: joinY }, target]);
+  }
+
   if (targetData.value?.kind === 'branch') {
     const direction = deltaY >= 0 ? 1 : -1;
     const branchY = source.y + direction * Math.min(Math.max(Math.abs(deltaY) * 0.45, 18), 34);

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

@@ -134,7 +134,7 @@ function patchSelector(patch: Partial<AppiumSelector>) {
         <el-form-item label="节点类型">
           <el-select
             :model-value="defaultKind()"
-            :disabled="disabled || isBooleanCondition(step) || step.type === 'log'"
+            :disabled="disabled || isBooleanCondition(step) || step.type === 'log' || step.type === 'openGallery' || step.type === 'endFlow'"
             @update:model-value="patchFlow({ nodeKind: $event as FlowKind })"
           >
             <el-option label="操作" value="action" />
@@ -142,7 +142,7 @@ function patchSelector(patch: Partial<AppiumSelector>) {
             <el-option label="校验" value="assertion" />
           </el-select>
         </el-form-item>
-        <el-form-item v-if="step.type !== 'longPress' && step.type !== 'log'" label="超时时间 ms">
+        <el-form-item v-if="step.type !== 'longPress' && step.type !== 'log' && step.type !== 'openGallery' && step.type !== 'endFlow'" label="超时时间 ms">
           <el-input-number
             :model-value="step.timeoutMs || undefined"
             :disabled="disabled"