surf-cli 2.7.2 → 2.8.0

package/native/grok-client.cjs

@@ -1,6 +1,6 @@
 /**
  * Grok Web Client for surf-cli
- * 
+ *
  * CDP-based client for X.com's Grok AI using browser automation.
  * Provides access to Grok's unique real-time X/Twitter data capabilities.
  */
@@ -8,14 +8,14 @@
 const { loadConfig, getConfigPath, clearCache } = require("./config.cjs");
 
 const GROK_URL = "https://x.com/i/grok";
-const DEFAULT_MODEL = "thinking";
+const DEFAULT_MODEL = "fast";
 
-// Default models (as of Jan 2026)
+// Default models (as of Jun 2026)
 const DEFAULT_GROK_MODELS = {
   "auto": { id: "auto", name: "Auto", desc: "Chooses Fast or Expert" },
   "fast": { id: "fast", name: "Fast", desc: "Quick responses" },
   "expert": { id: "expert", name: "Expert", desc: "Thinks hard" },
-  "thinking": { id: "thinking", name: "Grok 4.1 Thinking", desc: "Thinks fast" },
+  "grok-4.20-beta": { id: "grok-4.20-beta", name: "Grok 4.20 Beta", desc: "4 Agents" },
 };
 
 // Load models from surf.json config or use defaults
@@ -60,6 +60,70 @@ function buildClickDispatcher() {
   }`;
 }
 
+function normalizeGrokModelLabel(text) {
+  return String(text || "").toLowerCase().replace(/[^a-z0-9]/g, "");
+}
+
+function getGrokModelMatchLabels(desiredModel) {
+  const labels = new Set([desiredModel]);
+  const models = getGrokModels();
+  const configured = models[desiredModel];
+  if (configured) {
+    labels.add(configured.id);
+    labels.add(configured.name);
+  } else {
+    for (const model of Object.values(models)) {
+      if (model?.id === desiredModel) {
+        labels.add(model.id);
+        labels.add(model.name);
+      }
+    }
+  }
+  return Array.from(labels).filter(Boolean).map(normalizeGrokModelLabel);
+}
+
+function grokModelLabelsMatch(foundLabel, requestedLabels) {
+  const found = normalizeGrokModelLabel(foundLabel);
+  return requestedLabels.some(label => label && (found.includes(label) || label.includes(found)));
+}
+
+function grokSendButtonFinderScript() {
+  return `
+    const isVisible = (el) => {
+      const style = window.getComputedStyle?.(el);
+      const rect = el.getBoundingClientRect?.();
+      return el.offsetParent !== null &&
+             (!style || (style.visibility !== 'hidden' && style.display !== 'none')) &&
+             (!rect || (rect.width > 0 && rect.height > 0));
+    };
+    const isEnabled = (el) => !el.disabled && el.getAttribute('aria-disabled') !== 'true';
+    const matchesSendButton = (button) => {
+      const label = (button.getAttribute('aria-label') || '').trim().toLowerCase();
+      const testId = (button.getAttribute('data-testid') || '').trim().toLowerCase();
+      return label === 'send' || label === 'submit' ||
+             label.startsWith('send ') || label.startsWith('submit ') ||
+             testId === 'groksend' || testId === 'send-button' ||
+             testId.includes('composer-send') || testId.includes('grok-send');
+    };
+    const input = document.querySelector('textarea, [contenteditable="true"][role="textbox"], [data-testid="grokComposerInput"]');
+    const scopes = [];
+    if (input) {
+      const form = input.closest('form');
+      const composer = input.closest('[data-testid*="composer" i], [aria-label*="composer" i], [role="form"]');
+      if (form) scopes.push(form);
+      if (composer && composer !== form) scopes.push(composer);
+    }
+    scopes.push(document);
+    let sendBtn = null;
+    for (const scope of scopes) {
+      sendBtn = Array.from(scope.querySelectorAll('button')).find(b =>
+        matchesSendButton(b) && isVisible(b) && isEnabled(b)
+      );
+      if (sendBtn) break;
+    }
+  `;
+}
+
 function hasRequiredCookies(cookies) {
   if (!cookies || !Array.isArray(cookies)) return false;
   // auth_token is the primary session cookie for X.com
@@ -71,8 +135,8 @@ function hasRequiredCookies(cookies) {
 async function evaluate(cdp, expression) {
   const result = await cdp(expression);
   if (result.exceptionDetails) {
-    const desc = result.exceptionDetails.exception?.description || 
-                 result.exceptionDetails.text || 
+    const desc = result.exceptionDetails.exception?.description ||
+                 result.exceptionDetails.text ||
                  "Evaluation failed";
     throw new Error(desc);
   }
@@ -106,30 +170,30 @@ async function checkLoginStatus(cdp) {
     const hasLoginButton = !!document.querySelector('a[href*="/login"], [data-testid="loginButton"]');
     const hasGrokUI = body.includes('ask anything') || body.includes('grok');
     const hasPremiumPrompt = body.includes('subscribe') || body.includes('premium required');
-    
+
     return {
       loggedIn: !hasLoginButton && hasGrokUI,
       hasPremium: hasGrokUI && !hasPremiumPrompt,
       url: location.href
     };
   })()`);
-  
+
   return result || { loggedIn: false, hasPremium: false };
 }
 
 async function waitForGrokReady(cdp, timeoutMs = 20000) {
   const deadline = Date.now() + timeoutMs;
   let lastState = null;
-  
+
   while (Date.now() < deadline) {
     const state = await evaluate(cdp, `(() => {
       // Check for Grok-specific elements
       const hasInput = !!document.querySelector('textarea, [contenteditable="true"][role="textbox"], [data-testid="grokComposerInput"]');
-      const hasGrokBranding = document.body.innerText.includes('Grok') || 
+      const hasGrokBranding = document.body.innerText.includes('Grok') ||
                                !!document.querySelector('[data-testid*="grok"]');
       const isGrokPage = location.pathname.includes('/grok');
       const isLoginPage = location.pathname.includes('/login') || location.pathname.includes('/i/flow');
-      
+
       return {
         ready: isGrokPage && (hasInput || hasGrokBranding),
         hasInput,
@@ -138,26 +202,26 @@ async function waitForGrokReady(cdp, timeoutMs = 20000) {
         url: location.href
       };
     })()`);
-    
+
     lastState = state;
-    
+
     if (state && state.ready) {
       return state;
     }
-    
+
     // If redirected to login, fail fast
     if (state && state.isLoginPage) {
       throw new Error("Redirected to login page - X.com login required");
     }
-    
+
     await delay(200);
   }
-  
+
   // Timeout - provide helpful error based on last state
   if (lastState && !lastState.isGrokPage) {
     throw new Error(`Not on Grok page (current: ${lastState.url}) - may need to log in`);
   }
-  
+
   // Return fallback for edge cases where we're on Grok page but UI isn't detected
   return { ready: true, fallback: true };
 }
@@ -167,13 +231,13 @@ async function waitForGrokReady(cdp, timeoutMs = 20000) {
 // ============================================================================
 
 async function selectModel(cdp, desiredModel, timeoutMs = 8000) {
-  const normalizedModel = desiredModel.toLowerCase().replace(/[^a-z0-9.-]/g, "");
-  
+  const requestedLabels = getGrokModelMatchLabels(desiredModel);
+
   // First, find and click the model selector button
   const buttonClicked = await evaluate(cdp, `(() => {
     ${buildClickDispatcher()}
-    
-    // Look for model selector button (shows current model: Auto, Fast, Expert, or Grok 4.1 Thinking)
+
+    // Look for model selector button (shows current model: Auto, Fast, Expert, or Grok 4.x)
     const buttons = Array.from(document.querySelectorAll('button'));
     const modelBtn = buttons.find(b => {
       const text = (b.textContent || '').toLowerCase();
@@ -184,78 +248,81 @@ async function selectModel(cdp, desiredModel, timeoutMs = 8000) {
       const hasModelLabel = label.includes('model') || testId.includes('model');
       return hasModelName || hasModelLabel;
     });
-    
+
     if (!modelBtn) return { success: false, error: 'Model selector not found' };
-    
+
     dispatchClickSequence(modelBtn);
     return { success: true };
   })()`);
-  
+
   if (!buttonClicked || !buttonClicked.success) {
     // Model selector might not exist (single model), continue anyway
     return desiredModel;
   }
-  
+
   await delay(400);
-  
+
   // Select from menu - loop in Node.js to avoid CDP timeout issues
   const deadline = Date.now() + timeoutMs;
-  
+
   while (Date.now() < deadline) {
     const result = await evaluate(cdp, `(() => {
       ${buildClickDispatcher()}
-      
-      const targetModel = ${JSON.stringify(normalizedModel)};
-      const normalize = (text) => (text || '').toLowerCase().replace(/[^a-z0-9.-]/g, '');
-      
+
+      const requestedLabels = ${JSON.stringify(requestedLabels)};
+      const normalize = (text) => (text || '').toLowerCase().replace(/[^a-z0-9]/g, '');
+
       // Look for menu items
       const items = document.querySelectorAll('[role="menuitem"], [role="menuitemradio"], [role="option"]');
-      
+
       if (items.length === 0) {
         return { found: false, waiting: true };
       }
-      
+
       let bestMatch = null;
       let bestScore = 0;
-      
+
       for (const item of items) {
         const text = normalize(item.textContent || '');
         let score = 0;
-        
-        if (text.includes(targetModel)) score = 100;
-        else if (targetModel.includes(text) && text.length > 3) score = 50;
-        else if (text.includes('thinking') && targetModel.includes('thinking')) score = 75;
-        
+
+        for (const label of requestedLabels) {
+          if (!label) continue;
+          if (text === label) score = Math.max(score, 100);
+          else if (text.includes(label)) score = Math.max(score, 90);
+          else if (label.includes(text) && text.length > 3) score = Math.max(score, 50);
+        }
+
         if (score > bestScore) {
           bestScore = score;
           bestMatch = item;
         }
       }
-      
+
       if (bestMatch) {
         dispatchClickSequence(bestMatch);
         return { found: true, success: true, model: bestMatch.textContent?.trim() };
       }
-      
+
       return { found: true, success: false, error: 'No matching model in menu' };
     })()`);
-    
+
     if (result && result.found) {
       if (result.success) {
         await delay(200);
         return result.model;
       }
-      // Items found but no match - close menu and return default
+      // Items found but no match - close menu and surface the failure to callers.
       await evaluate(cdp, `document.body.click()`);
-      return desiredModel;
+      throw new Error(result.error ? `${result.error} for "${desiredModel}"` : `No matching model in menu for "${desiredModel}"`);
     }
-    
+
     await delay(100);
   }
-  
+
   // Timeout - close menu
   await evaluate(cdp, `document.body.click()`);
-  return desiredModel;
+  throw new Error(`Timed out waiting for model menu to show "${desiredModel}"`);
 }
 
 // ============================================================================
@@ -265,7 +332,7 @@ async function selectModel(cdp, desiredModel, timeoutMs = 8000) {
 async function enableDeepSearch(cdp) {
   const result = await evaluate(cdp, `(() => {
     ${buildClickDispatcher()}
-    
+
     // Look for DeepSearch toggle or button
     const buttons = Array.from(document.querySelectorAll('button, [role="switch"]'));
     const deepSearchBtn = buttons.find(b => {
@@ -275,27 +342,27 @@ async function enableDeepSearch(cdp) {
       return text.includes('deepsearch') || text.includes('deep search') ||
              label.includes('deepsearch') || label.includes('deep search');
     });
-    
+
     if (!deepSearchBtn) {
       return { success: false, error: 'DeepSearch toggle not found' };
     }
-    
+
     // Check if already enabled
     const isEnabled = deepSearchBtn.getAttribute('aria-checked') === 'true' ||
                       deepSearchBtn.classList.contains('active');
-    
+
     if (isEnabled) {
       return { success: true, alreadyEnabled: true };
     }
-    
+
     dispatchClickSequence(deepSearchBtn);
     return { success: true };
   })()`);
-  
+
   if (result && result.success) {
     await delay(300);
   }
-  
+
   return result || { success: false };
 }
 
@@ -307,7 +374,7 @@ async function typePrompt(cdp, inputCdp, prompt) {
   // Focus the input area
   const focused = await evaluate(cdp, `(() => {
     ${buildClickDispatcher()}
-    
+
     // Strategy 1: Find textarea or contenteditable
     const inputs = document.querySelectorAll('textarea, [contenteditable="true"][role="textbox"], [data-testid="grokComposerInput"]');
     for (const el of inputs) {
@@ -317,7 +384,7 @@ async function typePrompt(cdp, inputCdp, prompt) {
         return { success: true, method: 'input' };
       }
     }
-    
+
     // Strategy 2: Look for elements with "Ask" placeholder (more targeted selector)
     const placeholderEls = document.querySelectorAll('[placeholder*="Ask"], [placeholder*="ask"], [aria-placeholder*="Ask"]');
     for (const el of placeholderEls) {
@@ -327,16 +394,16 @@ async function typePrompt(cdp, inputCdp, prompt) {
         return { success: true, method: 'placeholder' };
       }
     }
-    
+
     return { success: false, error: 'Input not found' };
   })()`);
-  
+
   if (!focused || !focused.success) {
     throw new Error(`Could not focus input: ${focused?.error || 'unknown'}`);
   }
-  
+
   await delay(300);
-  
+
   // Type using CDP Input API
   await inputCdp("Input.insertText", { text: prompt });
   await delay(200);
@@ -346,24 +413,17 @@ async function submitPrompt(cdp, inputCdp) {
   // Try to click send button
   const clicked = await evaluate(cdp, `(() => {
     ${buildClickDispatcher()}
-    
-    // Look for send button
-    const buttons = Array.from(document.querySelectorAll('button'));
-    const sendBtn = buttons.find(b => {
-      const label = (b.getAttribute('aria-label') || '').toLowerCase();
-      const testId = b.getAttribute('data-testid') || '';
-      return label.includes('send') || testId.includes('send') || 
-             testId.includes('submit') || testId.includes('grokSend');
-    });
-    
-    if (sendBtn && !sendBtn.disabled) {
+
+    ${grokSendButtonFinderScript()}
+
+    if (sendBtn) {
       dispatchClickSequence(sendBtn);
       return { success: true, method: 'button' };
     }
-    
+
     return { success: false };
   })()`);
-  
+
   if (!clicked || !clicked.success) {
     // Fallback: press Enter
     await inputCdp("Input.dispatchKeyEvent", {
@@ -382,7 +442,7 @@ async function submitPrompt(cdp, inputCdp) {
       nativeVirtualKeyCode: 13,
     });
   }
-  
+
   await delay(500);
 }
 
@@ -390,13 +450,56 @@ async function submitPrompt(cdp, inputCdp) {
 // Response Handling
 // ============================================================================
 
+function looksLikeTrailingSuggestion(line) {
+  if (!line || line.length < 4 || line.length > 90) return false;
+  if (/[.!:;)]$/.test(line)) return false;
+  const words = line.split(/\s+/).filter(Boolean);
+  if (words.length < 2 || words.length > 9) return false;
+  if (/^[-*•\d]/.test(line)) return false;
+  if (/\b(https?:\/\/|www\.)\b/i.test(line)) return false;
+  return true;
+}
+
+function trimTrailingSuggestionLines(lines) {
+  let end = lines.length;
+  while (end > 0 && looksLikeTrailingSuggestion(lines[end - 1])) {
+    end--;
+  }
+
+  const trimmedCount = lines.length - end;
+  if (trimmedCount >= 2 && end > 0) {
+    return lines.slice(0, end);
+  }
+
+  const last = lines[lines.length - 1];
+  if (
+    trimmedCount === 1 &&
+    lines.length > 1 &&
+    /^(explain|tell|share|compare|derive|make|show|summari[sz]e|expand|rewrite)\b/i.test(last)
+  ) {
+    return lines.slice(0, -1);
+  }
+
+  const previous = lines[lines.length - 2];
+  if (
+    last &&
+    previous &&
+    /^[A-Z][a-z]{3,}$/.test(last) &&
+    /(?:[.!?)]|^\d+(?:\.\d+)?$)/.test(previous)
+  ) {
+    return lines.slice(0, -1);
+  }
+
+  return lines;
+}
+
 // Extract Grok's response from the full page body text
 function extractGrokResponse(bodyText, userPrompt = '') {
   if (!bodyText) return null;
-  
+
   // Split into lines and filter out navigation/UI elements
   const lines = bodyText.split('\n').map(l => l.trim()).filter(l => l);
-  
+
   // Known UI elements to skip
   const uiPatterns = [
     /^(Home|Explore|Notifications|Messages|Chat|Grok|Premium|Bookmarks|Communities|Profile|More|Post)$/i,
@@ -405,15 +508,15 @@ function extractGrokResponse(bodyText, userPrompt = '') {
     /^(Create recurring tasks|Get access to|Explore)$/i,
     /^(Think Harder)$/i,
     /^(Auto|Fast|Expert)$/i, // Model names
-    /^Grok\s*\d/i, // "Grok 4.1 Thinking" etc
+    /^Grok\s*\d/i, // Grok 4.x model names
     /^@\w+$/, // Username mentions alone
     /^[A-Z][a-z]+ \d+$/, // Dates like "Jan 20"
     /^(See new posts|Talk to Grok|Get access to)/, // Sidebar promos
   ];
-  
+
   // Normalize prompt for comparison (first 30 chars to handle truncation)
   const promptNorm = userPrompt.toLowerCase().replace(/[^a-z0-9]/g, '').substring(0, 30);
-  
+
   // Find the LAST occurrence of the user's question to get the most recent conversation
   let lastQuestionIndex = -1;
   for (let i = lines.length - 1; i >= 0; i--) {
@@ -423,31 +526,30 @@ function extractGrokResponse(bodyText, userPrompt = '') {
       break;
     }
   }
-  
+
   // Extract content after the last question
   const contentLines = [];
   const startIndex = lastQuestionIndex >= 0 ? lastQuestionIndex + 1 : 0;
-  
+
   for (let i = startIndex; i < lines.length; i++) {
     const line = lines[i];
-    
+
     // Skip empty and UI lines
     if (!line || uiPatterns.some(p => p.test(line))) continue;
-    
+
     // Skip very short lines that are likely icons/buttons (but keep numbers)
     if (line.length <= 2 && !/^\d+$/.test(line)) continue;
-    
-    // Stop at follow-up suggestions (they mark the end of the response)
-    if (/^(Explain|Tell me|Learn more|Show me|Multiplication)/i.test(line)) break;
-    
+
     contentLines.push(line);
   }
-  
+
+  const responseLines = trimTrailingSuggestionLines(contentLines);
+
   // If we found content after the question, return the response
-  if (contentLines.length > 0) {
-    return contentLines.join('\n').trim();
+  if (responseLines.length > 0) {
+    return responseLines.join('\n').trim();
   }
-  
+
   // Fallback: look for the LAST standalone numeric answer
   for (let i = lines.length - 1; i >= 0; i--) {
     const line = lines[i];
@@ -455,15 +557,15 @@ function extractGrokResponse(bodyText, userPrompt = '') {
       return line;
     }
   }
-  
+
   return null;
 }
 
 async function waitForResponse(cdp, timeoutMs = 300000, userPrompt = '') {
   // Grok can take a long time:
-  // - Thinking models (Grok 4.1 Thinking): 40-60+ seconds to think, then streams
+  // - Thinking models: 40-60+ seconds to think, then streams
   // - Fast/Auto models: No thinking phase, just streams directly
-  
+
   const deadline = Date.now() + timeoutMs;
   let previousText = '';
   let previousLength = 0;
@@ -472,30 +574,30 @@ async function waitForResponse(cdp, timeoutMs = 300000, userPrompt = '') {
   let thinkingComplete = false;
   let lastResponseText = '';
   let responseStableCycles = 0;
-  
+
   while (Date.now() < deadline) {
     // Get page state with multiple completion indicators
     const snapshot = await evaluate(cdp, `(function() {
       const bodyText = document.body.innerText || '';
-      
+
       // Check for stop/cancel button (indicates still generating)
       const hasStopBtn = !!document.querySelector('button[aria-label*="Stop"], button[aria-label*="stop"], button[aria-label*="Cancel"]');
-      
+
       // Check for "Thought for Xs" which indicates thinking model completed thinking
       const thinkMatch = bodyText.match(/Thought for (\\d+)s/i);
       const thinkingDone = !!thinkMatch;
       const thinkingSecs = thinkMatch ? parseInt(thinkMatch[1], 10) : null;
-      
+
       // Check if actively showing "thinking..." or similar loading state
-      const isThinking = /\\bthinking\\.\\.\\./i.test(bodyText) || 
+      const isThinking = /\\bthinking\\.\\.\\./i.test(bodyText) ||
                          /\\bSearching\\.\\.\\./i.test(bodyText) ||
                          bodyText.includes('Grok is thinking') ||
                          bodyText.includes('is thinking...');
-      
+
       // Try to find the actual Grok response in the DOM
       // Look for the main content area - Grok responses appear in the conversation area
       let responseText = '';
-      
+
       // Strategy 1: Look for article elements or main content containers
       const articles = document.querySelectorAll('article');
       if (articles.length > 0) {
@@ -503,7 +605,7 @@ async function waitForResponse(cdp, timeoutMs = 300000, userPrompt = '') {
         const lastArticle = articles[articles.length - 1];
         responseText = lastArticle.innerText || '';
       }
-      
+
       // Strategy 2: If no articles, look for the conversation container
       if (!responseText) {
         const convArea = document.querySelector('[data-testid="conversation"], [role="main"] > div > div');
@@ -511,14 +613,14 @@ async function waitForResponse(cdp, timeoutMs = 300000, userPrompt = '') {
           responseText = convArea.innerText || '';
         }
       }
-      
+
       // Strategy 3: Fallback to looking for text after common Grok UI patterns
       if (!responseText || responseText.length < 10) {
         // Find content between user question and follow-up suggestions
         const mainArea = document.querySelector('main') || document.body;
         responseText = mainArea.innerText || bodyText;
       }
-      
+
       return {
         bodyText: bodyText,
         responseText: responseText,
@@ -530,22 +632,22 @@ async function waitForResponse(cdp, timeoutMs = 300000, userPrompt = '') {
         url: location.href
       };
     })()`);
-    
+
     if (!snapshot || !snapshot.bodyText) {
       await delay(300);
       continue;
     }
-    
+
     const bodyText = snapshot.bodyText;
     const bodyLength = snapshot.bodyLength;
-    
+
     // Track thinking time (for thinking models)
     if (snapshot.thinkingSecs) {
       if (!thinkingTime || snapshot.thinkingSecs > thinkingTime) {
         thinkingTime = snapshot.thinkingSecs;
       }
     }
-    
+
     // Detect when thinking completes (thinking models only)
     // "Thought for Xs" is a DEFINITIVE signal that thinking AND response generation is done
     if (snapshot.thinkingDone && !thinkingComplete) {
@@ -553,7 +655,7 @@ async function waitForResponse(cdp, timeoutMs = 300000, userPrompt = '') {
       // Give a brief moment for final render, then we're done
       await delay(500);
     }
-    
+
     // Extract the actual response text - try DOM-extracted first, fall back to body parsing
     let currentResponseText = '';
     if (snapshot.responseText && snapshot.responseText.length > 10) {
@@ -562,7 +664,7 @@ async function waitForResponse(cdp, timeoutMs = 300000, userPrompt = '') {
     if (!currentResponseText || currentResponseText.length < 5) {
       currentResponseText = extractGrokResponse(bodyText, userPrompt) || '';
     }
-    
+
     // Track RESPONSE text stability (more reliable than body text)
     if (currentResponseText !== lastResponseText) {
       lastResponseText = currentResponseText;
@@ -571,34 +673,34 @@ async function waitForResponse(cdp, timeoutMs = 300000, userPrompt = '') {
     } else if (currentResponseText.length > 0) {
       responseStableCycles++;
     }
-    
+
     // Track body text for timeout fallback
     if (bodyLength !== previousLength) {
       previousText = bodyText;
       previousLength = bodyLength;
     }
-    
+
     const stableMs = Date.now() - lastChangeAt;
     const noStopButton = !snapshot.hasStopBtn;
-    
+
     // Response is stable if the extracted response text hasn't changed
     // Use shorter thresholds since we're checking actual content, not noisy body text
     // 4 cycles (1.2s) + 1.5s minimum is enough for response stability
     const responseIsStable = responseStableCycles >= 4 && stableMs >= 1500 && currentResponseText.length > 10;
-    
+
     // "Thought for Xs" is the strongest completion signal - response is definitely done
     const thinkingModelDone = snapshot.thinkingDone && noStopButton;
-    
+
     // SIMPLE CHECK: If we have response content, no stop button, and stable for 3+ cycles
     const hasResponseNoStop = currentResponseText.length > 5 && noStopButton && responseStableCycles >= 3;
-    
+
     // Response is complete when:
     // 1. Has meaningful response content (> 5 chars)
     // 2. No stop button
     // 3. Either: thinking done, response stable for 3+ cycles, OR stable for 4+ cycles with 1.5s
     const isDone = currentResponseText.length > 5 && noStopButton &&
                    (thinkingModelDone || hasResponseNoStop || responseIsStable);
-    
+
     if (isDone) {
       return {
         text: currentResponseText,
@@ -606,10 +708,10 @@ async function waitForResponse(cdp, timeoutMs = 300000, userPrompt = '') {
         url: snapshot.url,
       };
     }
-    
+
     await delay(300);
   }
-  
+
   // Timeout - return whatever we have (partial response is better than nothing)
   const finalText = extractGrokResponse(previousText, userPrompt);
   if (finalText && finalText.length > 10) {
@@ -619,7 +721,7 @@ async function waitForResponse(cdp, timeoutMs = 300000, userPrompt = '') {
       partial: true,
     };
   }
-  
+
   throw new Error("Response timeout - Grok did not complete in time");
 }
 
@@ -640,34 +742,34 @@ async function query(options) {
     cdpCommand,
     log = () => {},
   } = options;
-  
+
   const startTime = Date.now();
   log("Starting Grok query");
-  
+
   // Check cookies for X.com authentication
   const { cookies } = await getCookies();
   if (!hasRequiredCookies(cookies)) {
     throw new Error("X.com login required - log in to x.com in Chrome first");
   }
   log(`Got ${cookies.length} cookies`);
-  
+
   // Create tab
   const tabInfo = await createTab();
   const { tabId } = tabInfo || {};
-  
+
   if (!tabId) {
     throw new Error(`Failed to create Grok tab: ${JSON.stringify(tabInfo)}`);
   }
   log(`Created tab ${tabId}`);
-  
+
   const cdp = (expr) => cdpEvaluate(tabId, expr);
   const inputCdp = (method, params) => cdpCommand(tabId, method, params);
-  
+
   try {
     // Wait for page load
     await waitForPageLoad(cdp);
     log("Page loaded");
-    
+
     // Check login status
     const loginStatus = await checkLoginStatus(cdp);
     if (!loginStatus.loggedIn) {
@@ -677,14 +779,14 @@ async function query(options) {
       log("Warning: X Premium may be required for some Grok features");
     }
     log(`Login: yes${loginStatus.hasPremium ? ' (Premium)' : ''}`);
-    
+
     // Track warnings for agent feedback
     const warnings = [];
-    
+
     // Wait for Grok UI
     await waitForGrokReady(cdp);
     log("Grok ready");
-    
+
     // Select model (use default if not specified)
     const targetModel = model || DEFAULT_MODEL;
     let selectedModel = targetModel;
@@ -703,7 +805,7 @@ async function query(options) {
       warnings.push(`Model selection failed: ${e.message}. Run 'surf grok --validate' to check available models.`);
       log(`Model selection failed: ${e.message}`);
     }
-    
+
     // Enable DeepSearch if requested
     let deepSearchEnabled = false;
     if (deepSearch) {
@@ -720,20 +822,20 @@ async function query(options) {
         log(`DeepSearch toggle failed: ${e.message}`);
       }
     }
-    
+
     // Type prompt
     await typePrompt(cdp, inputCdp, prompt);
     log("Prompt typed");
-    
+
     // Submit
     await submitPrompt(cdp, inputCdp);
     log("Submitted, waiting for response...");
-    
+
     // Wait for response
     const response = await waitForResponse(cdp, timeout, prompt);
     const thinkingInfo = response.thinkingTime ? ` (thought for ${response.thinkingTime}s)` : '';
     log(`Response: ${response.text.length} chars${thinkingInfo}${response.partial ? ' (partial)' : ''}`);
-    
+
     return {
       response: response.text,
       model: selectedModel,
@@ -764,10 +866,10 @@ async function validate(options) {
     cdpEvaluate,
     log = () => {},
   } = options;
-  
+
   const startTime = Date.now();
   log("Starting Grok validation");
-  
+
   const result = {
     authenticated: false,
     premium: false,
@@ -779,7 +881,7 @@ async function validate(options) {
     errors: [],
     configPath: getConfigPath() || "~/surf.json",
   };
-  
+
   // Check cookies
   try {
     const { cookies } = await getCookies();
@@ -793,7 +895,7 @@ async function validate(options) {
     result.errors.push(`Cookie check failed: ${e.message}`);
     return { ...result, tookMs: Date.now() - startTime };
   }
-  
+
   // Create tab
   let tabId;
   try {
@@ -808,29 +910,29 @@ async function validate(options) {
     result.errors.push(`Tab creation failed: ${e.message}`);
     return { ...result, tookMs: Date.now() - startTime };
   }
-  
+
   const cdp = (expr) => cdpEvaluate(tabId, expr);
-  
+
   try {
     // Wait for page load
     await waitForPageLoad(cdp);
     log("Page loaded");
-    
+
     // Check login status
     const loginStatus = await checkLoginStatus(cdp);
     result.authenticated = loginStatus.loggedIn;
     result.premium = loginStatus.hasPremium;
-    
+
     if (!loginStatus.loggedIn) {
       result.errors.push("Page shows logged out state");
       return { ...result, tookMs: Date.now() - startTime };
     }
     log(`Login: yes${result.premium ? ' (Premium)' : ''}`);
-    
+
     // Wait for Grok UI
     await waitForGrokReady(cdp);
     log("Grok ready");
-    
+
     // Check for input field
     const inputCheck = await evaluate(cdp, `(() => {
       const input = document.querySelector('textarea, [contenteditable="true"][role="textbox"], [data-testid="grokComposerInput"]');
@@ -838,20 +940,15 @@ async function validate(options) {
     })()`);
     result.inputFound = inputCheck?.found || false;
     log(`Input field: ${result.inputFound ? 'found' : 'NOT FOUND'}`);
-    
+
     // Check for send button
     const sendCheck = await evaluate(cdp, `(() => {
-      const buttons = Array.from(document.querySelectorAll('button'));
-      const sendBtn = buttons.find(b => {
-        const label = (b.getAttribute('aria-label') || '').toLowerCase();
-        const testId = b.getAttribute('data-testid') || '';
-        return label.includes('send') || testId.includes('send') || testId.includes('submit');
-      });
+      ${grokSendButtonFinderScript()}
       return { found: !!sendBtn };
     })()`);
     result.sendButtonFound = sendCheck?.found || false;
     log(`Send button: ${result.sendButtonFound ? 'found' : 'NOT FOUND'}`);
-    
+
     // Click model selector and scrape models
     const modelButtonClicked = await evaluate(cdp, `(() => {
       ${buildClickDispatcher()}
@@ -868,10 +965,10 @@ async function validate(options) {
       dispatchClickSequence(modelBtn);
       return { success: true };
     })()`);
-    
+
     if (modelButtonClicked?.success) {
       await delay(500);
-      
+
       // Scrape model options
       const modelScrape = await evaluate(cdp, `(() => {
         const items = document.querySelectorAll('[role="menuitem"], [role="menuitemradio"], [role="option"]');
@@ -887,24 +984,24 @@ async function validate(options) {
         }
         return { models };
       })()`);
-      
+
       result.models = modelScrape?.models || [];
       log(`Found models: ${result.models.join(', ')}`);
-      
+
       // Close the menu
       await evaluate(cdp, `document.body.click()`);
     } else {
       log("Could not open model selector");
       result.errors.push("Model selector button not found");
     }
-    
+
     // Check for model mismatch
-    const expectedNames = Object.values(getGrokModels()).map(m => m.name.toLowerCase());
-    const foundNames = result.models.map(m => m.toLowerCase());
-    
+    const expectedNames = Object.values(getGrokModels()).map(m => normalizeGrokModelLabel(m.name));
+    const foundNames = result.models.map(m => normalizeGrokModelLabel(m));
+
     const missing = expectedNames.filter(e => !foundNames.some(f => f.includes(e) || e.includes(f)));
     const extra = foundNames.filter(f => !expectedNames.some(e => f.includes(e) || e.includes(f)));
-    
+
     if (missing.length > 0 || extra.length > 0) {
       result.modelMismatch = true;
       if (missing.length > 0) {
@@ -914,13 +1011,13 @@ async function validate(options) {
         result.errors.push(`Unexpected models found: ${extra.join(', ')}`);
       }
     }
-    
+
   } catch (e) {
     result.errors.push(`Validation error: ${e.message}`);
   } finally {
     await closeTab(tabId).catch(() => {});
   }
-  
+
   result.tookMs = Date.now() - startTime;
   return result;
 }
@@ -930,14 +1027,14 @@ function saveModels(models) {
   const fs = require("fs");
   const path = require("path");
   const os = require("os");
-  
+
   try {
     // Use existing config path or default to ~/surf.json
     let configPath = getConfigPath();
     if (!configPath) {
       configPath = path.join(os.homedir(), "surf.json");
     }
-    
+
     // Load existing config or start fresh
     let config = {};
     if (fs.existsSync(configPath)) {
@@ -947,11 +1044,11 @@ function saveModels(models) {
         // Start fresh if parse fails
       }
     }
-    
+
     // Update grok.models
     config.grok = config.grok || {};
     config.grok.models = models;
-    
+
     fs.writeFileSync(configPath, JSON.stringify(config, null, 2) + "\n");
     clearCache(); // Clear config cache so subsequent reads see new values
     return { success: true, path: configPath };
@@ -960,13 +1057,16 @@ function saveModels(models) {
   }
 }
 
-module.exports = { 
+module.exports = {
   query,
   validate,
-  hasRequiredCookies, 
+  hasRequiredCookies,
   getGrokModels,
   saveModels,
   extractGrokResponse,
+  normalizeGrokModelLabel,
+  getGrokModelMatchLabels,
+  grokModelLabelsMatch,
   GROK_URL,
   GROK_MODELS,
   DEFAULT_GROK_MODELS,