@xbrowser/cli 1.18.2 → 1.20.0

package/dist/cli.js

@@ -72,7 +72,7 @@ import {
   setActivePage,
   sleep,
   wheelDelta
-} from "./chunk-7SDM4EA4.js";
+} from "./chunk-T2KUVO4H.js";
 import "./chunk-3KZ34AUC.js";
 import {
   errMsg
@@ -203,8 +203,8 @@ function asZodSchema(value) {
 
 // src/executor.ts
 import {
-  ok as ok28,
-  fail as fail13,
+  ok as ok30,
+  fail as fail15,
   isCommandResult,
   CompositeStorage as CompositeStorage2,
   TipCollector as TipCollector2,
@@ -6362,6 +6362,709 @@ function describeSelector(strategy, value, name) {
   }
 }
 
+// src/commands/visual-tag.ts
+import { z as z29 } from "zod";
+import { ok as ok28, fail as fail13 } from "@dyyz1993/xcli-core";
+var SAFE_SET = "ahjkmnprtw3479".split("");
+var TAG_SCRIPT = `
+(function() {
+  // \u6E05\u9664\u65E7\u6807\u6CE8
+  var old = document.getElementById('__xb-tag-overlay');
+  if (old) old.remove();
+  window.__xbTagMap = {};
+
+  var SAFE_SET = ${JSON.stringify(SAFE_SET)};
+  function genId(idx) {
+    var base = SAFE_SET.length;
+    if (idx < base * base) return SAFE_SET[Math.floor(idx / base)] + SAFE_SET[idx % base];
+    var i = idx - base * base;
+    return SAFE_SET[Math.floor(i / (base * base))] + SAFE_SET[Math.floor(i / base) % base] + SAFE_SET[i % base];
+  }
+
+  // \u627E\u6240\u6709\u53EF\u4EA4\u4E92\u5143\u7D20
+  var els = [];
+  var all = document.querySelectorAll('button, a[href], input, select, textarea, [onclick], [role="button"], [contenteditable], [class*="btn"], [class*="button"], [class*="link"]');
+  for (var i = 0; i < all.length && els.length < 200; i++) {
+    var el = all[i];
+    var r = el.getBoundingClientRect();
+    if (r.width < 10 || r.height < 10) continue;
+    if (r.x < 0 || r.y < 0 || r.x + r.width > window.innerWidth || r.y + r.height > window.innerHeight + 100) continue;
+    var style = getComputedStyle(el);
+    if (style.display === 'none' || style.visibility === 'hidden' || style.opacity === '0') continue;
+    els.push({ el: el, rect: r });
+  }
+
+  // \u521B\u5EFA\u53E0\u52A0 Canvas
+  var canvas = document.createElement('canvas');
+  canvas.id = '__xb-tag-overlay';
+  canvas.width = window.innerWidth;
+  canvas.height = Math.max(window.innerHeight, document.documentElement.scrollHeight);
+  canvas.style.cssText = 'position:fixed;top:0;left:0;pointer-events:none;z-index:999999;';
+  document.body.appendChild(canvas);
+  var ctx = canvas.getContext('2d');
+
+  // \u7ED8\u5236\u6807\u7B7E
+  for (var j = 0; j < els.length; j++) {
+    var item = els[j];
+    var id = genId(j);
+    var x = item.rect.x;
+    var y = item.rect.y;
+
+    // \u6807\u7B7E\u6846\uFF1A\u9AD8\u5BF9\u6BD4\uFF08\u9EC4\u5E95\u9ED1\u5B57\uFF09
+    ctx.fillStyle = '#FFD700';
+    ctx.fillRect(x - 2, y - 16, id.length * 8 + 8, 16);
+    ctx.strokeStyle = '#000';
+    ctx.lineWidth = 1.5;
+    ctx.strokeRect(x - 2, y - 16, id.length * 8 + 8, 16);
+    ctx.fillStyle = '#000';
+    ctx.font = 'bold 12px monospace';
+    ctx.fillText(id, x + 2, y - 5);
+
+    // \u5143\u7D20\u8F6E\u5ED3
+    ctx.strokeStyle = '#FF0000';
+    ctx.lineWidth = 1.5;
+    ctx.strokeRect(x, y, item.rect.width, item.rect.height);
+
+    // \u5B58\u50A8 ID \u2192 \u5143\u7D20\u6620\u5C04
+    window.__xbTagMap[id] = {
+      tagName: item.el.tagName,
+      text: (item.el.textContent || '').trim().slice(0, 50),
+      rect: { x: x, y: y, w: item.rect.width, h: item.rect.height },
+      selector: (function(e) {
+        if (e.id) return '#' + e.id;
+        if (e.getAttribute('data-testid')) return '[data-testid="' + e.getAttribute('data-testid') + '"]';
+        // \u751F\u6210 nth-child \u9009\u62E9\u5668
+        var path = [];
+        var node = e;
+        while (node && node !== document.body) {
+          var idx = 1;
+          var sib = node.previousElementSibling;
+          while (sib) { if (sib.tagName === node.tagName) idx++; sib = sib.previousElementSibling; }
+          path.unshift(node.tagName.toLowerCase() + ':nth-of-type(' + idx + ')');
+          node = node.parentElement;
+        }
+        return path.join(' > ');
+      })(item.el)
+    };
+  }
+
+  return JSON.stringify({ tagged: els.length, overlay: true });
+})()
+`;
+var visualTagCommand = registerCommand({
+  name: "visual-tag",
+  description: "\u5728\u9875\u9762\u4E0A\u7ED9\u53EF\u4EA4\u4E92\u5143\u7D20\u53E0\u52A0\u9632\u6DF7\u6DC6\u77ED ID \u6807\u7B7E\uFF08\u89C6\u89C9\u5B9A\u4F4D\u7528\uFF09",
+  scope: "page",
+  parameters: z29.object({
+    action: z29.enum(["tag", "lookup", "clear", "list"]),
+    id: z29.string().optional().describe("lookup \u65F6\u6307\u5B9A\u8981\u67E5\u7684 ID")
+  }),
+  result: z29.object({
+    action: z29.string(),
+    tagged: z29.number().optional(),
+    id: z29.string().optional(),
+    element: z29.record(z29.unknown()).optional()
+  }),
+  handler: async (p, ctx) => {
+    switch (p.action) {
+      case "tag": {
+        const result = await ctx.page.evaluate(TAG_SCRIPT);
+        const parsed = JSON.parse(result);
+        return ok28({ action: "tag", tagged: parsed.tagged });
+      }
+      case "lookup": {
+        if (!p.id) return fail13("lookup \u9700\u8981 --id \u53C2\u6570");
+        const result = await ctx.page.evaluate(
+          `(function() { var m = window.__xbTagMap; if (!m) return JSON.stringify({err:'no-map'}); var e = m[${JSON.stringify(p.id)}]; return e ? JSON.stringify(e) : JSON.stringify({err:'not-found'}); })()`
+        );
+        const parsed = JSON.parse(result);
+        if (parsed.err) return fail13(`ID ${p.id}: ${parsed.err}`);
+        return ok28({ action: "lookup", id: p.id, element: parsed });
+      }
+      case "list": {
+        const result = await ctx.page.evaluate(
+          `(function() { var m = window.__xbTagMap; if (!m) return '{}'; var out = {}; for (var k in m) { out[k] = m[k].text || m[k].tagName; } return JSON.stringify(out); })()`
+        );
+        return ok28({ action: "list", element: JSON.parse(result) });
+      }
+      case "clear": {
+        await ctx.page.evaluate(`(function(){var o=document.getElementById('__xb-tag-overlay');if(o)o.remove();window.__xbTagMap=null;return 'cleared'})()`);
+        return ok28({ action: "clear" });
+      }
+    }
+  }
+});
+
+// src/commands/visual-tag-v2.ts
+import { z as z30 } from "zod";
+import { ok as ok29, fail as fail14 } from "@dyyz1993/xcli-core";
+var SAFE_SET2 = "ahjkmnprtw3479".split("");
+var TAG_V2_SCRIPT = `
+(function() {
+  var old = document.getElementById('__xb-tag-overlay');
+  if (old) old.remove();
+  window.__xbTagMap = {};
+  window.__xbTagStats = {};
+
+  var SAFE_SET = ${JSON.stringify(SAFE_SET2)};
+  var TYPE_PREFIX = { click:'k', input:'n', img:'m', list:'h', count:'p', text:'t' };
+  function genId(prefix, idx) {
+    var base = SAFE_SET.length;
+    var suffix = SAFE_SET[Math.floor(idx / base) % base] + SAFE_SET[idx % base];
+    return prefix + suffix;
+  }
+
+  var counters = { click: 0, input: 0, img: 0, list: 0, count: 0, text: 0 };
+
+  var canvas = document.createElement('canvas');
+  canvas.id = '__xb-tag-overlay';
+  canvas.width = window.innerWidth;
+  canvas.height = Math.max(window.innerHeight, document.documentElement.scrollHeight);
+  canvas.style.cssText = 'position:fixed;top:0;left:0;pointer-events:none;z-index:999999;';
+  document.body.appendChild(canvas);
+  var ctx = canvas.getContext('2d');
+
+  function classifyElement(el) {
+    var tag = el.tagName;
+    var text = (el.textContent || '').trim();
+    var cls = el.className || '';
+
+    // \u4F18\u5148\u7EA71\uFF1A\u6570\u5B57/\u8BA1\u6570\u5668\u2014\u2014\u5148\u4E8E\u5217\u8868\uFF08S129 \u9057\u7559\u95EE\u9898\u4FEE\u590D\uFF09
+    var hasOnlySvgChildren = true;
+    for (var ci = 0; ci < el.children.length; ci++) {
+      if (el.children[ci].tagName.toUpperCase() !== 'SVG' && el.children[ci].tagName.toUpperCase() !== 'PATH' && el.children[ci].tagName.toUpperCase() !== 'SPAN') { hasOnlySvgChildren = false; break; }
+    }
+    if ((el.children.length === 0 || hasOnlySvgChildren) && text.length > 0 && text.length < 25) {
+      var numMatch = /^[0-9]/.test(text) && text.length < 20;
+      if (numMatch) return 'count';
+    }
+    // \u4F18\u5148\u7EA71.5\uFF1Aclass \u542B count/num/like/star/fork \u7684\u5BB9\u5668
+    if (/count|num\b|like|star|fork|rating|badge/i.test(cls) && el.children.length <= 2) return 'count';
+
+    // \u4F18\u5148\u7EA72\uFF1A\u8F93\u5165\u6846
+    if (tag === 'INPUT' || tag === 'TEXTAREA' || tag === 'SELECT' ||
+        el.getAttribute('contenteditable')) return 'input';
+
+    // \u4F18\u5148\u7EA73\uFF1A\u53EF\u70B9\u51FB\uFF08v3 \u6269\u5BBD\uFF1Adata-target/onclick/tab/menu/nav/link class\uFF09
+    if (tag === 'BUTTON' || (el.getAttribute('role') === 'button') ||
+        (tag === 'A' && el.getAttribute('href')) ||
+        el.hasAttribute('onclick') || el.hasAttribute('data-target') ||
+        /btn|button|click|action|tab\b|menu|nav\b|link\b/i.test(cls)) return 'click';
+
+    // \u4F18\u5148\u7EA74\uFF1A\u56FE\u7247\uFF08v3\uFF1A\u542B SVG \u56FE\u6807\uFF09
+    if (tag === 'IMG' || (tag === 'SVG') ||
+        (el.querySelector && el.querySelector('img,svg') &&
+         el.children.length <= 2 && !text)) return 'img';
+
+    // \u4F18\u5148\u7EA74.5\uFF1A\u8868\u683C\u5355\u5143\u683C
+    if (tag === 'TD' || tag === 'TH') return 'list';
+
+    // \u4F18\u5148\u7EA75\uFF1A\u5217\u8868\uFF08v3\uFF1A\u52A0 card\uFF09
+    if (tag === 'UL' || tag === 'OL' || tag === 'LI' ||
+        /list|item|feed|timeline|card/i.test(cls)) return 'list';
+
+    // \u4F18\u5148\u7EA76\uFF1A\u6587\u672C
+    if (text.length > 20) return 'text';
+    return null;
+  }
+
+  var COLORS = {
+    click: { stroke: '#FF0000', fill: '#FFD700' },  // \u7EA2+\u9EC4
+    input: { stroke: '#0000FF', fill: '#ADD8E6' },  // \u84DD
+    img:   { stroke: '#00AA00', fill: '#90EE90' },  // \u7EFF
+    list:  { stroke: '#FFAA00', fill: '#FFE4B5' },  // \u6A59\u9EC4
+    count: { stroke: '#9900CC', fill: '#E0B0FF' },  // \u7D2B
+    text:  { stroke: '#FF8C00', fill: '#FFECD2' },  // \u6A59
+  };
+
+  var all = document.querySelectorAll('button, a[href], td, th, input, select, textarea, img, ul, ol, li, svg, [onclick], [role="button"], [contenteditable], [aria-label], [data-target], [class*="btn"], [class*="list"], [class*="item"], [class*="count"], [class*="num"], [class*="like"], [class*="comment"], [class*="stat"], [class*="card"], [class*="tab"], [class*="menu"], [class*="nav"], [class*="link"], [class*="Link"], [class*="Card"]');
+
+  for (var i = 0; i < all.length && i < 3000; i++) {
+    var el = all[i];
+    var r = el.getBoundingClientRect();
+    if (r.width < 8 || r.height < 8) continue;
+    if (r.x < -50 || r.y < -50 || r.x > window.innerWidth || r.y > window.innerHeight + 200) continue;
+    var style = getComputedStyle(el);
+    if (style.display === 'none' || style.visibility === 'hidden' || style.opacity === '0') continue;
+
+    var type = classifyElement(el);
+    if (!type) continue;
+
+    var id = genId(TYPE_PREFIX[type] || 't', counters[type]);
+    counters[type]++;
+    var colors = COLORS[type];
+
+    // \u6807\u7B7E
+    ctx.fillStyle = colors.fill;
+    ctx.fillRect(r.x - 2, r.y - 14, id.length * 7 + 6, 14);
+    ctx.strokeStyle = '#000';
+    ctx.lineWidth = 1;
+    ctx.strokeRect(r.x - 2, r.y - 14, id.length * 7 + 6, 14);
+    ctx.fillStyle = '#000';
+    ctx.font = 'bold 11px monospace';
+    ctx.fillText(id, r.x + 1, r.y - 4);
+
+    // \u5143\u7D20\u6846\uFF08\u5206\u8272\uFF09
+    ctx.strokeStyle = colors.stroke;
+    ctx.lineWidth = 1.5;
+    ctx.strokeRect(r.x, r.y, r.width, r.height);
+
+    // v4\uFF1A\u67E5\u7236\u7EA7\u6807\u6CE8 ID\uFF08\u5D4C\u5957\u5173\u7CFB\uFF09
+    var parentId = null;
+    var parentNode = el.parentElement;
+    while (parentNode && parentNode !== document.body) {
+      for (var pk in window.__xbTagMap) {
+        if (window.__xbTagMap[pk]._el === parentNode) { parentId = pk; break; }
+      }
+      if (parentId) break;
+      parentNode = parentNode.parentElement;
+    }
+
+    // v6\uFF1A\u8868\u5355\u8BED\u4E49\u2014\u2014\u8BC6\u522B input \u7684\u5173\u8054 label
+    var formLabel = null;
+    if (el.tagName === 'INPUT' || el.tagName === 'TEXTAREA' || el.tagName === 'SELECT') {
+      var inputId = el.id;
+      if (inputId) {
+        var lbl = document.querySelector('label[for="' + inputId + '"]');
+        if (lbl) formLabel = lbl.textContent.trim();
+      }
+      if (!formLabel) {
+        var aria = el.getAttribute('aria-label');
+        if (aria) formLabel = aria;
+      }
+      if (!formLabel) {
+        var ph = el.getAttribute('placeholder');
+        if (ph) formLabel = '(placeholder) ' + ph;
+      }
+      if (!formLabel) {
+        var parentLbl = el.closest('label');
+        if (parentLbl) formLabel = parentLbl.textContent.trim().slice(0, 30);
+      }
+      if (!formLabel) {
+        var prev = el.previousElementSibling;
+        if (prev && (prev.tagName === 'LABEL' || prev.tagName === 'SPAN' || prev.tagName === 'DIV') && prev.textContent.trim()) {
+          formLabel = '(adjacent) ' + prev.textContent.trim().slice(0, 30);
+        }
+      }
+    }
+
+    // v7\uFF1A\u8868\u683C\u8BED\u4E49\u2014\u2014\u5355\u5143\u683C \u2192 \u5217\u540D + \u884C\u53F7
+    var tableInfo = null;
+    if (el.tagName === 'TD' || el.tagName === 'TH') {
+      var table = el.closest('table');
+      if (table) {
+        var row = el.closest('tr');
+        var cellIndex = el.cellIndex;
+        var rowIndex = row ? row.rowIndex : -1;
+        // \u627E\u8868\u5934\uFF08thead \u7684 th \u6216\u7B2C\u4E00\u884C\u7684 th\uFF09
+        var header = table.querySelector('thead th:nth-child(' + (cellIndex + 1) + ')') ||
+                     table.querySelector('tr:first-child th:nth-child(' + (cellIndex + 1) + ')');
+        var colName = header ? header.textContent.trim() : 'col-' + (cellIndex + 1);
+        tableInfo = { col: colName, colIndex: cellIndex, rowIndex: rowIndex, value: el.textContent.trim().slice(0, 20) };
+      }
+    }
+
+    window.__xbTagMap[id] = {
+      type: type,
+      parent: parentId,
+      _el: el,
+      formLabel: formLabel,
+      table: tableInfo,
+      tagName: el.tagName,
+      text: (el.textContent || '').trim().slice(0, 40),
+      num: (el.textContent || '').trim().match(/[\\d,.]+/)?.[0] || null,
+      rect: { x: Math.round(r.x), y: Math.round(r.y), w: Math.round(r.width), h: Math.round(r.height) },
+      selector: (function(e) {
+        if (e.id) return '#' + e.id;
+        if (e.getAttribute('data-testid')) return '[data-testid="' + e.getAttribute('data-testid') + '"]';
+        var path = [];
+        var node = e;
+        while (node && node !== document.body) {
+          var idx = 1;
+          var sib = node.previousElementSibling;
+          while (sib) { if (sib.tagName === node.tagName) idx++; sib = sib.previousElementSibling; }
+          path.unshift(node.tagName.toLowerCase() + ':nth-of-type(' + idx + ')');
+          node = node.parentElement;
+        }
+        return path.join(' > ');
+      })(el)
+    };
+  }
+
+  // v9\uFF1A\u8DE8 frame \u6807\u6CE8\u2014\u2014\u9012\u5F52\u5904\u7406\u540C\u6E90 iframe \u5185\u7684\u5143\u7D20
+  function tagFrame(doc, offsetX, offsetY) {
+    var frameAll = doc.querySelectorAll('button, a[href], input, select, textarea, img, [onclick], [role=button], [contenteditable], [aria-label]');
+    for (var fi = 0; fi < frameAll.length && fi < 100; fi++) {
+      var fel = frameAll[fi];
+      var fr = fel.getBoundingClientRect();
+      if (fr.width < 8 || fr.height < 8) continue;
+      var fType = classifyElement(fel);
+      if (!fType) continue;
+      var fId = genId(TYPE_PREFIX[fType] || 't', counters[fType]);
+      counters[fType]++;
+      var fColors = COLORS[fType];
+      // \u5750\u6807\u504F\u79FB\u5230\u4E3B\u6587\u6863 Canvas\uFF08iframe \u5728\u4E3B\u6587\u6863\u4E2D\u7684\u4F4D\u7F6E + \u5143\u7D20\u5728 iframe \u4E2D\u7684\u4F4D\u7F6E\uFF09
+      var fx = fr.x + offsetX, fy = fr.y + offsetY;
+      ctx.fillStyle = fColors.fill;
+      ctx.fillRect(fx - 2, fy - 14, fId.length * 7 + 6, 14);
+      ctx.strokeStyle = '#000'; ctx.lineWidth = 1;
+      ctx.strokeRect(fx - 2, fy - 14, fId.length * 7 + 6, 14);
+      ctx.fillStyle = '#000'; ctx.font = 'bold 11px monospace';
+      ctx.fillText(fId, fx + 1, fy - 4);
+      ctx.strokeStyle = fColors.stroke; ctx.lineWidth = 1.5;
+      ctx.strokeRect(fx, fy, fr.width, fr.height);
+      window.__xbTagMap[fId] = {
+        type: fType, tagName: fel.tagName,
+        text: (fel.textContent||'').trim().slice(0,40),
+        num: (fel.textContent||'').trim().match(/[0-9,.]+/)?.[0] || null,
+        formLabel: (fel.getAttribute('aria-label')||fel.getAttribute('placeholder')||'').slice(0,30) || null,
+        frame: 'iframe',
+        _el: fel,
+        rect: {x:Math.round(fx),y:Math.round(fy),w:Math.round(fr.width),h:Math.round(fr.height)},
+        selector: (function(e){return e.id?'#'+e.id:e.tagName.toLowerCase()}) (fel)
+      };
+    }
+    // \u9012\u5F52\u5904\u7406\u5D4C\u5957 iframe
+    var nestedFrames = doc.querySelectorAll('iframe');
+    for (var nf = 0; nf < nestedFrames.length; nf++) {
+      try {
+        var nestedDoc = nestedFrames[nf].contentDocument;
+        if (!nestedDoc) continue;
+        var nestedRect = nestedFrames[nf].getBoundingClientRect();
+        tagFrame(nestedDoc, nestedRect.x, nestedRect.y);
+      } catch(e) { /* \u8DE8\u57DF iframe \u8DF3\u8FC7 */ }
+    }
+  }
+  // \u904D\u5386\u4E3B\u6587\u6863\u7684\u6240\u6709\u540C\u6E90 iframe
+  var mainFrames = document.querySelectorAll('iframe');
+  for (var mf = 0; mf < mainFrames.length; mf++) {
+    try {
+      var mDoc = mainFrames[mf].contentDocument;
+      if (!mDoc) continue;
+      var mRect = mainFrames[mf].getBoundingClientRect();
+      tagFrame(mDoc, mRect.x, mRect.y);
+    } catch(e) { /* \u8DE8\u57DF\u8DF3\u8FC7 */ }
+  }
+
+  // v8\uFF1A\u52A8\u6001\u6807\u6CE8\u2014\u2014MutationObserver \u76D1\u542C\u65B0\u5143\u7D20\uFF0C\u81EA\u52A8\u8865\u5145\u6807\u6CE8
+  if (window.__xbTagObserver) { window.__xbTagObserver.disconnect(); }
+  window.__xbTagObserver = new MutationObserver(function(mutations) {
+    var needsRetag = false;
+    for (var mi = 0; mi < mutations.length; mi++) {
+      if (mutations[mi].addedNodes.length > 0) { needsRetag = true; break; }
+    }
+    if (!needsRetag) return;
+    // v8.1\uFF1A\u6E05\u7406\u88AB\u79FB\u9664\u5143\u7D20\u7684\u6807\u6CE8\uFF08\u6B7B\u6807\u6CE8\u4F1A\u7559\u5728 Canvas \u4E0A\uFF09
+    for (var ri = 0; ri < mutations.length; ri++) {
+      var removed = mutations[ri].removedNodes;
+      for (var rj = 0; rj < removed.length; rj++) {
+        var removedNode = removed[rj];
+        if (!removedNode.tagName) continue;
+        for (var rk in window.__xbTagMap) {
+          var entry = window.__xbTagMap[rk];
+          if (entry._el === removedNode || (entry._el && removedNode.contains && removedNode.contains(entry._el))) {
+            delete window.__xbTagMap[rk];
+            window.__xbTagStats.total--;
+          }
+        }
+      }
+    }
+    // \u9632\u6296\uFF1A300ms \u5185\u7684\u8FDE\u7EED\u53D8\u5316\u53EA\u89E6\u53D1\u4E00\u6B21\u91CD\u6807\u6CE8
+    clearTimeout(window.__xbTagRetagTimer);
+    window.__xbTagRetagTimer = setTimeout(function() {
+      // \u53EA\u6807\u6CE8\u65B0\u589E\u7684\u53EF\u89C1\u5143\u7D20\uFF08\u4E0D\u91CD\u753B\u6574\u4E2A Canvas\uFF09
+      var ctx2 = document.getElementById('__xb-tag-overlay');
+      if (!ctx2) return;
+      var canvas2 = ctx2.getContext('2d');
+      for (var ni = 0; ni < mutations.length; ni++) {
+        var nodes = mutations[ni].addedNodes;
+        for (var nj = 0; nj < nodes.length; nj++) {
+          var node = nodes[nj];
+          if (!node.getBoundingClientRect) continue;
+          var r = node.getBoundingClientRect();
+          if (r.width < 8 || r.height < 8) continue;
+          // \u5206\u7C7B\u5E76\u6807\u6CE8
+          var newType = classifyElement(node);
+          if (!newType) continue;
+          var newId = genId(TYPE_PREFIX[newType] || 't', counters[newType]);
+          counters[newType]++;
+          var colors = COLORS[newType];
+          canvas2.fillStyle = colors.fill;
+          canvas2.fillRect(r.x - 2, r.y - 14, newId.length * 7 + 6, 14);
+          canvas2.strokeStyle = '#000';
+          canvas2.lineWidth = 1;
+          canvas2.strokeRect(r.x - 2, r.y - 14, newId.length * 7 + 6, 14);
+          canvas2.fillStyle = '#000';
+          canvas2.font = 'bold 11px monospace';
+          canvas2.fillText(newId, r.x + 1, r.y - 4);
+          canvas2.strokeStyle = colors.stroke;
+          canvas2.lineWidth = 1.5;
+          canvas2.strokeRect(r.x, r.y, r.width, r.height);
+          // \u5B58\u6620\u5C04
+          var parentId = null;
+          var parentNode = node.parentElement;
+          while (parentNode && parentNode !== document.body) {
+            for (var pk in window.__xbTagMap) {
+              if (window.__xbTagMap[pk]._el === parentNode) { parentId = pk; break; }
+            }
+            if (parentId) break;
+            parentNode = parentNode.parentElement;
+          }
+          window.__xbTagMap[newId] = { type: newType, tagName: node.tagName, text: (node.textContent||'').trim().slice(0,40), parent: parentId, _el: node, rect: {x:Math.round(r.x),y:Math.round(r.y),w:Math.round(r.width),h:Math.round(r.height)} };
+          window.__xbTagStats.total++;
+        }
+      }
+      // \u66F4\u65B0 serializable
+      var ser = {};
+      for (var sk2 in window.__xbTagMap) {
+        var item = {};
+        for (var key in window.__xbTagMap[sk2]) { if (key !== '_el') item[key] = window.__xbTagMap[sk2][key]; }
+        ser[sk2] = item;
+      }
+      window.__xbTagSerializable = ser;
+    }, 300);
+  });
+  window.__xbTagObserver.observe(document.body, { childList: true, subtree: true });
+
+  // v4\uFF1A\u751F\u6210\u53EF\u5E8F\u5217\u5316\u7248\u672C\uFF08\u53BB\u6389 _el DOM \u5F15\u7528\uFF09
+  var serializable = {};
+  for (var sk in window.__xbTagMap) {
+    var item = {};
+    for (var key in window.__xbTagMap[sk]) {
+      if (key !== '_el') item[key] = window.__xbTagMap[sk][key];
+    }
+    serializable[sk] = item;
+  }
+  window.__xbTagSerializable = serializable;
+  window.__xbTagStats = { total: Object.keys(window.__xbTagMap).length, byType: counters };
+  return JSON.stringify(window.__xbTagStats);
+})()
+`;
+var visualTagV2Command = registerCommand({
+  name: "visual-tag-v2",
+  description: "\u5206\u8272\u6807\u6CE8\u9875\u9762\u5143\u7D20\uFF08\u7EA2=\u53EF\u70B9\u51FB \u84DD=\u8F93\u5165 \u7EFF=\u56FE\u7247 \u9EC4=\u5217\u8868 \u7D2B=\u6570\u5B57 \u6A59=\u6587\u672C\uFF09",
+  scope: "page",
+  parameters: z30.object({
+    action: z30.enum(["tag", "lookup", "clear", "stats", "by-type", "find", "export", "interact"]),
+    id: z30.string().optional().describe("lookup \u65F6\u6307\u5B9A\u8981\u67E5\u7684 ID"),
+    query: z30.string().optional().describe('find \u65F6\u6307\u5B9A\u641C\u7D22\u8BCD\uFF08\u5982 "\u627E\u6709AI\u7F16\u7A0B\u6807\u7B7E\u7684\u5361\u7247"\uFF09'),
+    type: z30.string().optional().describe("by-type \u65F6\u8FC7\u6EE4\u7C7B\u578B\uFF1Aclick/input/img/list/count/text"),
+    "interact-action": z30.enum(["click", "fill", "read"]).optional().describe("interact \u52A8\u4F5C\u7C7B\u578B"),
+    value: z30.string().optional().describe("fill \u65F6\u7684\u586B\u5145\u503C")
+  }),
+  result: z30.object({
+    action: z30.string(),
+    total: z30.number().optional(),
+    byType: z30.record(z30.number()).optional(),
+    element: z30.record(z30.unknown()).optional()
+  }),
+  handler: async (p, ctx) => {
+    switch (p.action) {
+      case "tag": {
+        const result = await ctx.page.evaluate(TAG_V2_SCRIPT);
+        const parsed = JSON.parse(result);
+        return ok29({ action: "tag", total: parsed.total, byType: parsed.byType });
+      }
+      case "lookup": {
+        if (!p.id) return fail14("lookup \u9700\u8981 --id");
+        const result = await ctx.page.evaluate(
+          `(function(){var m=window.__xbTagMap;if(!m)return JSON.stringify({err:'no-map'});var e=m[${JSON.stringify(p.id)}];return e?JSON.stringify(e):JSON.stringify({err:'not-found'})})()`
+        );
+        const parsed = JSON.parse(result);
+        if (parsed.err) return fail14(`ID ${p.id}: ${parsed.err}`);
+        return ok29({ action: "lookup", id: p.id, element: parsed });
+      }
+      case "by-type": {
+        const result = await ctx.page.evaluate(
+          `(function(){var m=window.__xbTagMap;if(!m)return'{}';var out={};for(var k in m){if(!${JSON.stringify(p.type || "")}||m[k].type===${JSON.stringify(p.type || "")}){out[k]={type:m[k].type,text:m[k].text,num:m[k].num,label:m[k].formLabel}}}return JSON.stringify(out)})()`
+        );
+        return ok29({ action: "by-type", element: JSON.parse(result) });
+      }
+      case "find": {
+        const query = p.query;
+        if (!query) return fail14('find \u9700\u8981 --query \u53C2\u6570\uFF08\u5982 "\u627E\u6709AI\u7F16\u7A0B\u6807\u7B7E\u7684\u5361\u7247"\uFF09');
+        const result = await ctx.page.evaluate(
+          `(function(){
+            var map = window.__xbTagSerializable;
+            if (!map) return JSON.stringify({err:'no-map'});
+            var query = ${JSON.stringify(query)};
+            var results = [];
+            // 1) \u76F4\u63A5\u6587\u672C\u5339\u914D
+            for (var id in map) {
+              var e = map[id];
+              var text = (e.text || '').toLowerCase();
+              var q = query.toLowerCase();
+              if (text.includes(q)) {
+                results.push({id:id, type:e.type, text:e.text, num:e.num, parent:e.parent, reason:'text-match'});
+              }
+            }
+            // 2) \u7C7B\u578B\u5339\u914D\uFF08query \u542B"\u6309\u94AE"/"\u94FE\u63A5"/"\u56FE\u7247"/"\u6570\u5B57"\u7B49\uFF09
+            var typeMap = {button:'click', link:'click', \u6309\u94AE:'click', \u94FE\u63A5:'click', \u56FE\u7247:'img', image:'img',
+                          \u8F93\u5165:'input', input:'input', \u5217\u8868:'list', list:'list', \u5361\u7247:'list', card:'list',
+                          \u6570\u5B57:'count', count:'count', \u8BA1\u6570:'count', \u6587\u672C:'text'};
+            for (var tk in typeMap) {
+              if (query.toLowerCase().includes(tk)) {
+                for (var id2 in map) {
+                  if (map[id2].type === typeMap[tk]) {
+                    results.push({id:id2, type:map[id2].type, text:map[id2].text, num:map[id2].num, parent:map[id2].parent, reason:'type-match:'+tk});
+                  }
+                }
+              }
+            }
+            // 3) \u6570\u5B57\u5339\u914D\uFF08query \u542B\u6570\u5B57\uFF09
+            var numMatch = query.match(/([0-9,.]+)/);
+            if (numMatch && map) {
+              var target = parseFloat(numMatch[1].replace(/,/g,''));
+              for (var id3 in map) {
+                if (map[id3].num && parseFloat(map[id3].num.replace(/,/g,'')) === target) {
+                  results.push({id:id3, type:map[id3].type, text:map[id3].text, num:map[id3].num, parent:map[id3].parent, reason:'num-match'});
+                }
+              }
+            }
+            return JSON.stringify({total:results.length, results:results.slice(0,20)});
+          })()`
+        );
+        return ok29({ action: "find", query, element: JSON.parse(result) });
+      }
+      case "stats": {
+        const result = await ctx.page.evaluate(
+          `(function(){return JSON.stringify(window.__xbTagStats||{})})()`
+        );
+        return ok29({ action: "stats", element: JSON.parse(result) });
+      }
+      case "interact": {
+        const query = p.query;
+        const pAny = p;
+        const action = pAny["interact-action"] || pAny.interactAction || pAny.interact_action;
+        const value = pAny.value;
+        if (!query) return fail14("interact \u9700\u8981 --query \u53C2\u6570");
+        if (!action) return fail14("interact \u9700\u8981 --interact-action \u53C2\u6570\uFF08click/fill/read\uFF09");
+        const findResult = await ctx.page.evaluate(
+          `(function(){
+            var map = window.__xbTagSerializable;
+            if (!map) return JSON.stringify({err:'no-map'});
+            var query = ${JSON.stringify(query)};
+            var results = [];
+            for (var id in map) {
+              var e = map[id];
+              var text = (e.text || '').toLowerCase();
+              if (text.includes(query.toLowerCase())) {
+                results.push({id:id, type:e.type, text:e.text, num:e.num, label:e.formLabel});
+              }
+            }
+            // \u7C7B\u578B\u5339\u914D
+            var typeMap = {button:'click', link:'click', \u6309\u94AE:'click', \u56FE\u7247:'img', image:'img',
+                          \u8F93\u5165:'input', input:'input', \u5217\u8868:'list', \u6570\u5B57:'count', count:'count'};
+            for (var tk in typeMap) {
+              if (query.toLowerCase().includes(tk)) {
+                for (var id2 in map) {
+                  if (map[id2].type === typeMap[tk]) {
+                    results.push({id:id2, type:map[id2].type, text:map[id2].text, num:map[id2].num, label:map[id2].formLabel});
+                  }
+                }
+              }
+            }
+            return JSON.stringify({total:results.length, results:results.slice(0,10)});
+          })()`
+        );
+        const parsed = JSON.parse(findResult);
+        if (parsed.err) return fail14(parsed.err);
+        if (!parsed.total || !parsed.results?.length) return fail14(`\u672A\u627E\u5230\u5339\u914D "${query}" \u7684\u5143\u7D20`);
+        const target = parsed.results[0];
+        if (action === "read") {
+          return ok29({ action: "interact", query, target, result: { read: target.text || target.label } });
+        }
+        if (action === "click") {
+          const el = await ctx.page.evaluate(
+            `(function(){
+              var map = window.__xbTagMap;
+              if (!map) return null;
+              var entry = map[${JSON.stringify(target.id)}];
+              if (!entry || !entry._el) return null;
+              var r = entry._el.getBoundingClientRect();
+              return {x: Math.round(r.x + r.width/2), y: Math.round(r.y + r.height/2)};
+            })()`
+          );
+          if (!el) return fail14(`\u5143\u7D20 ${target.id} \u4E0D\u53EF\u4EA4\u4E92`);
+          await ctx.page.mouse.click(el.x, el.y, { stealth: true });
+          return ok29({ action: "interact", query, target, result: { clicked: true, x: el.x, y: el.y } });
+        }
+        if (action === "fill") {
+          if (!value) return fail14("fill \u9700\u8981 --value \u53C2\u6570");
+          const el = await ctx.page.evaluate(
+            `(function(){
+              var map = window.__xbTagMap;
+              if (!map) return null;
+              var entry = map[${JSON.stringify(target.id)}];
+              if (!entry || !entry._el) return null;
+              var r = entry._el.getBoundingClientRect();
+              return {x: Math.round(r.x + r.width/2), y: Math.round(r.y + r.height/2)};
+            })()`
+          );
+          if (!el) return fail14(`\u5143\u7D20 ${target.id} \u4E0D\u53EF\u4EA4\u4E92`);
+          await ctx.page.mouse.click(el.x, el.y, { stealth: true });
+          await ctx.page.keyboard.type(value, { stealth: true });
+          return ok29({ action: "interact", query, target, result: { filled: true, value } });
+        }
+        return fail14(`\u672A\u77E5 action: ${action}`);
+      }
+      case "export": {
+        const result = await ctx.page.evaluate(
+          `(function(){
+            var map = window.__xbTagSerializable;
+            if (!map) return JSON.stringify({err:'no-map'});
+            // \u6309 type \u5206\u7EC4\u7EDF\u8BA1
+            var byType = {};
+            for (var id in map) {
+              var t = map[id].type || 'unknown';
+              byType[t] = (byType[t] || 0) + 1;
+            }
+            // \u6784\u5EFA\u5C42\u7EA7\u6811\uFF08parent \u2192 children\uFF09
+            var tree = {};
+            var roots = [];
+            for (var id2 in map) {
+              var parent = map[id2].parent;
+              if (parent && map[parent]) {
+                if (!tree[parent]) tree[parent] = [];
+                tree[parent].push(id2);
+              } else {
+                roots.push(id2);
+              }
+            }
+            // elements \u5BFC\u51FA\u6458\u8981\uFF08\u5B8C\u6574 DOM \u6620\u5C04\u592A\u5927\uFF0C\u53EA\u5BFC\u6838\u5FC3\u5B57\u6BB5\uFF09
+            var elementsOut = {};
+            for (var id3 in map) {
+              elementsOut[id3] = {
+                type: map[id3].type,
+                text: (map[id3].text || '').slice(0, 20),
+                num: map[id3].num,
+                label: map[id3].formLabel,
+                frame: map[id3].frame,
+                parent: map[id3].parent,
+                table: map[id3].table ? {col: map[id3].table.col, row: map[id3].table.rowIndex} : null
+              };
+            }
+            return JSON.stringify({
+              total: Object.keys(map).length,
+              byType: byType,
+              rootIds: roots.slice(0, 20),
+              hierarchy: Object.keys(tree).slice(0, 50).reduce(function(acc, k) { acc[k] = tree[k]; return acc; }, {}),
+              elements: elementsOut
+            });
+          })()`
+        );
+        const parsed = JSON.parse(result);
+        if (parsed.err) return fail14(String(parsed.err));
+        return ok29({ action: "export", element: parsed });
+      }
+      case "clear": {
+        await ctx.page.evaluate(`(function(){var o=document.getElementById('__xb-tag-overlay');if(o)o.remove();window.__xbTagMap=null;window.__xbTagStats=null;return 'ok'})()`);
+        return ok29({ action: "clear" });
+      }
+    }
+  }
+});
+
 // src/context.ts
 function attachDetectAntiBot(ctx) {
   ctx.detectAntiBot = async (page, config) => {
@@ -7468,7 +8171,7 @@ async function guardCheck(commandName) {
   }
 }
 function errorResult(message) {
-  return { ...fail13(message), duration: 0 };
+  return { ...fail15(message), duration: 0 };
 }
 function tipsToMessages(tips) {
   if (!tips || tips.length === 0) return [];
@@ -7545,7 +8248,7 @@ async function executeCommand(commandName, params, sessionName = "default", extr
   }
   let targetPageOverride = null;
   if (_target && extraOpts?.cdpEndpoint) {
-    const { findTargetPage } = await import("./browser-BEERPZPB.js");
+    const { findTargetPage } = await import("./browser-Y6B3NS4Q.js");
     targetPageOverride = await findTargetPage(extraOpts.cdpEndpoint, _target);
     if (!targetPageOverride) {
       return errorResult(`Target "${_target}" not found. Use 'xbrowser targets --cdp ${extraOpts.cdpEndpoint}' to list available pages.`);
@@ -7741,7 +8444,7 @@ async function executeCommand(commandName, params, sessionName = "default", extr
         timestamp: start
       });
       if (isSuccess) {
-        return { ...ok28(raw.data, merged.length > 0 ? merged : raw.tips), duration, ...hookOutputs ? { hookOutputs } : {} };
+        return { ...ok30(raw.data, merged.length > 0 ? merged : raw.tips), duration, ...hookOutputs ? { hookOutputs } : {} };
       }
       return { success: false, data: raw.data, message: raw.message, tips: mergedOrRaw, duration, ...hookOutputs ? { hookOutputs } : {} };
     }
@@ -7755,7 +8458,7 @@ async function executeCommand(commandName, params, sessionName = "default", extr
       duration,
       timestamp: start
     });
-    return { ...ok28(raw, smartTipNormalized), duration, ...hookOutputs ? { hookOutputs } : {} };
+    return { ...ok30(raw, smartTipNormalized), duration, ...hookOutputs ? { hookOutputs } : {} };
   } catch (err) {
     const end = Date.now();
     const duration = end - start;
@@ -7800,7 +8503,7 @@ async function executeCommand(commandName, params, sessionName = "default", extr
       duration,
       timestamp: start
     });
-    return { ...fail13(errorMessage), duration };
+    return { ...fail15(errorMessage), duration };
   } finally {
   }
 }
@@ -7844,7 +8547,7 @@ async function executeChain(input, options) {
             results.push({
               command: cmdName,
               raw: cmdStr,
-              ...fail13(`Plugin "${cmdName}" requires a sub-command`),
+              ...fail15(`Plugin "${cmdName}" requires a sub-command`),
               duration: 0
             });
             if (type === "and") {
@@ -7863,7 +8566,7 @@ async function executeChain(input, options) {
             results.push({
               command: cmdName,
               raw: cmdStr,
-              ...fail13(`Unknown command "${subCommand}" for plugin "${cmdName}"`),
+              ...fail15(`Unknown command "${subCommand}" for plugin "${cmdName}"`),
               duration: 0
             });
             if (type === "and") {
@@ -7967,7 +8670,7 @@ async function executeChain(input, options) {
             results.push({
               command: `${cmdName} ${subCommand}`,
               raw: cmdStr,
-              ...ok28(data),
+              ...ok30(data),
               duration: duration2,
               ...hookOutputs ? { hookOutputs } : {}
             });
@@ -7995,7 +8698,7 @@ async function executeChain(input, options) {
             results.push({
               command: `${cmdName} ${subCommand}`,
               raw: cmdStr,
-              ...fail13(errorMessage),
+              ...fail15(errorMessage),
               duration: duration2
             });
             if (type === "and") {
@@ -10189,6 +10892,7 @@ var HTML_TAGS = /* @__PURE__ */ new Set([
 var SELECTOR_DSL_PREFIXES = /^(text=|popup-text=|xpath=|role=|css=|chain=)/;
 function normalizeSelector(input) {
   if (!input) return input;
+  if (typeof input !== "string") input = String(input);
   if (/^[#\.\[\:\/]/.test(input)) return input;
   if (input === "*") return input;
   if (SELECTOR_DSL_PREFIXES.test(input)) return input;
@@ -13224,6 +13928,12 @@ function findEvalStart(argv) {
 async function handleEvalScript(parts, argv) {
   const cdpEndpoint = extractCdpFromArgv(argv);
   const sessionName = extractSessionNameFromArgv(argv);
+  if (parts[0] === "--script-b64" && parts[1]) {
+    const chainResult2 = await executeChain(`eval --script-b64 ${parts[1]}`, { cdpEndpoint, sessionName });
+    printChainResult(chainResult2);
+    if (!chainResult2.success) throw new Error("Command failed");
+    return;
+  }
   let frame;
   const scriptLines = [];
   for (let i = 0; i < parts.length; i++) {
@@ -13723,7 +14433,7 @@ Run "xbrowser ${command} ${subCommand} --help" to see available parameters.`
               const targetPage = pages[cmdTabIndex];
               await targetPage.bringToFront().catch(() => {
               });
-              const { setActivePage: setActivePage2 } = await import("./browser-BEERPZPB.js");
+              const { setActivePage: setActivePage2 } = await import("./browser-Y6B3NS4Q.js");
               setActivePage2(session, targetPage);
             }
           }
@@ -13999,7 +14709,7 @@ async function main() {
     const command = process.argv[2];
     const isLongRunning = command === "preview" || command === "serve";
     if (!isLongRunning) {
-      const { ensureProcessCanExit } = await import("./browser-BEERPZPB.js");
+      const { ensureProcessCanExit } = await import("./browser-Y6B3NS4Q.js");
       await ensureProcessCanExit().catch(() => {
       });
       process.exit(process.exitCode || exitCode);