fix: update appium-mcp tool calls and fix vscode webview buttons

Align tool calls with latest appium-mcp API:
- Serialize capabilities as JSON string for appium_session_management
- Replace removed tools (appium_clear_element, appium_long_press,
  appium_get_window_rect) with their new equivalents
- Clean up stale tool references in exclusion lists

Fix vscode extension webview buttons not responding to clicks by
replacing inline onclick handlers (blocked by CSP) with addEventListener
and resolving a duplicate const declaration that crashed the script.

Co-Authored-By: Sai Krishna <saikrishna321@yahoo.com>
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: 3 people

src/agent/loop.ts

@@ -1197,7 +1197,8 @@ async function executeMetaTool(
         for (const fb of lpFallbackStrategies) {
           try {
             const uuid = await findElement(mcp, fb.s as any, lpSelector);
-            const lpResult = await mcp.callTool('appium_long_press', {
+            const lpResult = await mcp.callTool('appium_gesture', {
+              action: 'long_press',
               elementUUID: uuid,
               duration: lpDuration,
             });
@@ -1359,7 +1360,7 @@ async function executeMetaTool(
 
         // Clear existing text if we have an active element
         if (activeUuid) {
-          await mcp.callTool('appium_clear_element', { elementUUID: activeUuid }).catch(() => {});
+          await mcp.callTool('appium_set_value', { elementUUID: activeUuid, text: '' }).catch(() => {});
         }
 
         // Always use W3C Actions — works on local and cloud, Android and iOS

src/device/session.ts

@@ -49,12 +49,12 @@ export async function createPlatformSession(
 
   const args: Record<string, unknown> = { platform };
 
-  // Add platform-specific capabilities
+  // Add platform-specific capabilities (serialized as JSON string for appium-mcp)
   if (platform === 'android') {
     // extraCaps wins over config defaults (e.g. parallel workers override mjpeg/system ports)
     const caps = { ...buildAndroidCapabilities(config), ...extraCaps };
     if (Object.keys(caps).length > 0) {
-      args.capabilities = caps;
+      args.capabilities = JSON.stringify(caps);
     }
   } else if (platform === 'ios') {
     // For iOS, appium-mcp handles most capabilities internally (WDA setup, device selection).
@@ -64,7 +64,7 @@ export async function createPlatformSession(
       ...extraCaps,
     };
     if (Object.keys(iosCaps).length > 0) {
-      args.capabilities = iosCaps;
+      args.capabilities = JSON.stringify(iosCaps);
     }
   }
 
@@ -154,7 +154,7 @@ async function createLambdaTestSession(
   const args: Record<string, unknown> = {
     platform,
     remoteServerUrl: hubUrl,
-    capabilities,
+    capabilities: JSON.stringify(capabilities),
   };
 
   try {
@@ -218,7 +218,7 @@ async function detectScreenSize(mcp: MCPClient, platform: Platform): Promise<voi
     // skip them here and let getScreenSizeForStark correct them at runtime using
     // the actual screenshot for comparison.
     try {
-      const result = await mcp.callTool('appium_get_window_rect', {});
+      const result = await mcp.callTool('appium_get_window_size', {});
       const text = extractText(result);
       try {
         const obj = JSON.parse(text);

src/flow/run-yaml-flow.ts

@@ -411,7 +411,7 @@ async function flowTypeText(
     if (!target) {
       const visionUuid = await findByVision(mcp, 'text input field, search box, or editable area');
       if (visionUuid && !isAIElement(visionUuid)) {
-        await mcp.callTool('appium_clear_element', { elementUUID: visionUuid }).catch(() => {});
+        await mcp.callTool('appium_set_value', { elementUUID: visionUuid, text: '' }).catch(() => {});
         const setResult = await mcp.callTool('appium_set_value', { elementUUID: visionUuid, text });
         const setText =
           setResult.content
@@ -444,7 +444,7 @@ async function flowTypeText(
     return { success: false, message: 'Could not resolve editable element' };
   }
   await mcp.callTool('appium_gesture', { action: 'tap', elementUUID: uuid });
-  await mcp.callTool('appium_clear_element', { elementUUID: uuid }).catch(() => {});
+  await mcp.callTool('appium_set_value', { elementUUID: uuid, text: '' }).catch(() => {});
   const setResult = await mcp.callTool('appium_set_value', {
     ...(Config.CLOUD_PROVIDER ? { w3cActions: true } : { elementUUID: uuid }),
     text,

src/mcp/client.ts

@@ -30,7 +30,7 @@ function resolveAppiumMcp(): { command: string; args: string[] } {
 const appiumMcp = resolveAppiumMcp();
 
 /** Tools that produce verbose output we don't want to log */
-const QUIET_TOOLS = new Set(['appium_get_page_source', 'appium_screenshot', 'appium_list_apps']);
+const QUIET_TOOLS = new Set(['appium_get_page_source', 'appium_screenshot']);
 
 const mcpDebug = process.env.MCP_DEBUG === '1' || process.env.MCP_DEBUG === 'true';
 

src/mcp/session-client.ts

@@ -19,7 +19,6 @@ import type { MCPClient, MCPToolResult, MCPToolInfo } from './types.js';
 const PRE_SESSION_TOOLS = new Set([
   'appium_session_management',
   'select_device',
-  'delete_all_sessions',
 ]);
 
 export class SessionScopedMCPClient implements MCPClient {

src/mcp/tool-converter.ts

@@ -55,11 +55,8 @@ export const EXCLUDED_MCP_TOOLS = new Set([
 /** Additional tools to exclude in vision mode — DOM-based tools that distract the agent */
 export const VISION_MODE_EXCLUDED_TOOLS = new Set([
   'appium_find_element',
-  'appium_find_elements',
   'appium_get_page_source',
   'appium_get_text',
-  'appium_get_attribute',
+  'appium_get_element_attribute',
   'appium_get_active_element',
-  'appium_clear_element',
-  'appium_scroll_to_element',
 ]);

src/recording/replayer.ts

@@ -273,7 +273,7 @@ async function executeReplayAction(
           const uuid = await findElementWithFallback(mcp, screenElements, elementId, coords);
           if (uuid) {
             await mcp.callTool('appium_gesture', { action: 'tap', elementUUID: uuid });
-            await mcp.callTool('appium_clear_element', { elementUUID: uuid }).catch(() => {});
+            await mcp.callTool('appium_set_value', { elementUUID: uuid, text: '' }).catch(() => {});
             await mcp.callTool('appium_set_value', { elementUUID: uuid, text });
             return { success: true, message: `Typed "${text}"` };
           }
@@ -310,7 +310,7 @@ async function executeReplayAction(
         }
 
         await mcp.callTool('appium_gesture', { action: 'tap', elementUUID: typeUuid });
-        await mcp.callTool('appium_clear_element', { elementUUID: typeUuid }).catch(() => {});
+        await mcp.callTool('appium_set_value', { elementUUID: typeUuid, text: '' }).catch(() => {});
         await mcp.callTool('appium_set_value', { elementUUID: typeUuid, text });
         return { success: true, message: `Typed "${text}"` };
       }

src/vision/window-size.ts

@@ -227,8 +227,8 @@ export async function getScreenSizeForStark(
   //    return physical pixel dimensions (e.g. "Width: 1440, Height: 3120"), making it
   //    ambiguous. appium_get_window_rect is more reliable.
   const windowRectTools = isIos
-    ? (['appium_get_window_rect', 'get_window_rect'] as const)
-    : (['appium_get_window_rect', 'appium_get_window_size', 'get_window_rect'] as const);
+    ? (['appium_get_window_size'] as const)
+    : (['appium_get_window_size'] as const);
 
   for (const name of windowRectTools) {
     try {

vscode-extension/src/webview/device-panel.ts

@@ -615,35 +615,35 @@ export class DevicePanel {
         <div class="hitl-prompt" id="hitlPrompt"></div>
         <div class="hitl-input-row">
           <input type="text" id="hitlInput" placeholder="Enter response...">
-          <button class="btn-run" onclick="submitHitl()">Send</button>
+          <button class="btn-run" id="hitlSendBtn">Send</button>
         </div>
       </div>
 
-      <div id="rawLogToggle" onclick="toggleRawLog()" style="cursor:pointer;font-size:10px;color:var(--vscode-descriptionForeground);padding:2px 10px;border-top:1px solid var(--vscode-panel-border);user-select:none;">▸ Logs</div>
+      <div id="rawLogToggle" style="cursor:pointer;font-size:10px;color:var(--vscode-descriptionForeground);padding:2px 10px;border-top:1px solid var(--vscode-panel-border);user-select:none;">▸ Logs</div>
       <div id="debugLog" style="display:none;font-size:10px;color:var(--vscode-descriptionForeground);padding:3px 10px;max-height:120px;overflow-y:auto;font-family:monospace;"></div>
 
       <div class="input-area">
         <div style="display:flex;gap:6px;align-items:center;">
           <div id="modeToggle" style="display:flex;border-radius:4px;overflow:hidden;border:1px solid var(--vscode-input-border);font-size:11px;cursor:pointer;">
-            <span id="modeGoal" onclick="setMode('goal')" style="padding:2px 8px;background:var(--vscode-button-background);color:var(--vscode-button-foreground);">Goal</span>
-            <span id="modePlayground" onclick="setMode('playground')" style="padding:2px 8px;background:var(--vscode-input-background);color:var(--vscode-input-foreground);">Playground</span>
+            <span id="modeGoal" style="padding:2px 8px;background:var(--vscode-button-background);color:var(--vscode-button-foreground);cursor:pointer;">Goal</span>
+            <span id="modePlayground" style="padding:2px 8px;background:var(--vscode-input-background);color:var(--vscode-input-foreground);cursor:pointer;">Playground</span>
           </div>
           <div id="platformToggle" style="display:flex;border-radius:4px;overflow:hidden;border:1px solid var(--vscode-input-border);font-size:11px;cursor:pointer;">
-            <span id="platAndroid" onclick="setPlatform('android')" style="padding:2px 8px;background:var(--vscode-input-background);color:var(--vscode-input-foreground);">Android</span>
-            <span id="platIos" onclick="setPlatform('ios')" style="padding:2px 8px;background:var(--vscode-input-background);color:var(--vscode-input-foreground);">iOS</span>
+            <span id="platAndroid" style="padding:2px 8px;background:var(--vscode-input-background);color:var(--vscode-input-foreground);cursor:pointer;">Android</span>
+            <span id="platIos" style="padding:2px 8px;background:var(--vscode-input-background);color:var(--vscode-input-foreground);cursor:pointer;">iOS</span>
           </div>
           <span id="modeHint" style="font-size:10px;color:var(--vscode-descriptionForeground);flex:1;">AI agent executes your goal</span>
           <span id="playgroundActions" style="display:none;">
-            <button class="action-btn" onclick="sendSlash('/yaml')">YAML</button>
-            <button class="action-btn" onclick="exportFlow()">Export</button>
-            <button class="action-btn" onclick="sendSlash('/undo')">Undo</button>
-            <button class="action-btn" onclick="sendSlash('/clear')">Clear</button>
+            <button class="action-btn" id="actionYaml">YAML</button>
+            <button class="action-btn" id="actionExport">Export</button>
+            <button class="action-btn" id="actionUndo">Undo</button>
+            <button class="action-btn" id="actionClear">Clear</button>
           </span>
         </div>
         <div style="display:flex;gap:6px;">
           <input type="text" id="goalInput" placeholder="Enter a goal... e.g. &quot;Open Settings and enable Wi-Fi&quot;" />
-          <button class="btn-run" id="runBtn" onclick="handleRun()">Run</button>
-          <button class="btn-stop" id="stopBtn" onclick="stopExecution()" style="display:none">Stop</button>
+          <button class="btn-run" id="runBtn">Run</button>
+          <button class="btn-stop" id="stopBtn" style="display:none">Stop</button>
         </div>
       </div>
     </div>
@@ -677,8 +677,25 @@ export class DevicePanel {
     const platIos = document.getElementById("platIos");
     const platformToggle = document.getElementById("platformToggle");
     const multiLiveGrid = document.getElementById("multiLiveGrid");
+    const rawLogToggle = document.getElementById("rawLogToggle");
+    const debugLog = document.getElementById("debugLog");
+    const hitlSendBtn = document.getElementById("hitlSendBtn");
     let selectedPlatform = ""; // "" = use settings default
 
+    // ── Click event listeners (CSP blocks inline onclick handlers) ──
+    document.getElementById("modeGoal").addEventListener("click", function() { setMode("goal"); });
+    document.getElementById("modePlayground").addEventListener("click", function() { setMode("playground"); });
+    platAndroid.addEventListener("click", function() { setPlatform("android"); });
+    platIos.addEventListener("click", function() { setPlatform("ios"); });
+    runBtn.addEventListener("click", function() { handleRun(); });
+    stopBtn.addEventListener("click", function() { stopExecution(); });
+    hitlSendBtn.addEventListener("click", function() { submitHitl(); });
+    rawLogToggle.addEventListener("click", function() { toggleRawLog(); });
+    document.getElementById("actionYaml").addEventListener("click", function() { sendSlash("/yaml"); });
+    document.getElementById("actionExport").addEventListener("click", function() { exportFlow(); });
+    document.getElementById("actionUndo").addEventListener("click", function() { sendSlash("/undo"); });
+    document.getElementById("actionClear").addEventListener("click", function() { sendSlash("/clear"); });
+
     // ── Multi-device state ──────────────────────────────────
     let panelMode = "single"; // "single" | "multi"
     let liveFrames = {};      // deviceName → { element, imgEl, state }
@@ -1123,8 +1140,6 @@ export class DevicePanel {
       }
     }
 
-    const debugLog = document.getElementById("debugLog");
-    const rawLogToggle = document.getElementById("rawLogToggle");
     var rawLogOpen = false;
     function toggleRawLog() {
       rawLogOpen = !rawLogOpen;