viyv-browser-mcp 0.6.7 → 0.7.0

package/dist/index.js

@@ -967,6 +967,18 @@ form_input \u2014 For setting form values (PREFERRED for forms)
   - submit: true \u2192 sets value + presses Enter + waits for navigation
   - Best for: search boxes, login forms, any form submission
 
+form_fill \u2014 For setting MULTIPLE form values in one call
+  - Same semantics as form_input for each field
+  - Sequential processing (important for dependent fields like country \u2192 city)
+  - Max 50 fields per call
+  - Optional submit after all fields are set
+  - Best for: registration forms, admin panels with many fields
+
+bulk_action \u2014 For repeating the SAME action on multiple elements
+  - Actions: click, check, uncheck, focus, scroll_to
+  - Max 200 refs per call
+  - Best for: checking/unchecking many checkboxes, clicking multiple buttons
+
 type \u2014 For raw text input into focused element
   - Requires element to be focused first (click it first)
   - Character-by-character with keyDown/keyUp events
@@ -978,11 +990,21 @@ key \u2014 For keyboard shortcuts and special keys
   - Use repeat parameter for multiple presses
   - Use for: keyboard navigation, shortcuts, special key combos
 
+file_upload \u2014 For uploading files or dropping files onto elements
+  - File input (ref \u2192 <input type="file">): sets files via CDP
+  - Drag & drop (ref \u2192 non-input, or coordinate): simulates file drag via CDP
+  - Don't click file inputs \u2014 use file_upload instead
+  - Best for: file inputs, canvas apps (Canva, Figma), custom drop zones
+
 Common patterns:
-  Form fill: find(input) \u2192 form_input(ref, value, submit: true)
+  Single field: find(input) \u2192 form_input(ref, value, submit: true)
+  Multi-field form: read_page \u2192 form_fill([{ref, value}, ...], submit: true)
+  Batch checkboxes: read_page \u2192 bulk_action(refs[], "check")
   Button click: find(button) \u2192 click(ref) \u2192 wait_for(navigation)
   Dropdown: click(select ref) \u2192 key("ArrowDown ArrowDown Enter")
-  Search: form_input(search input ref, query, submit: true)`
+  Search: form_input(search input ref, query, submit: true)
+  File upload: find(file input) \u2192 file_upload(ref, paths)
+  File drop: find(canvas) \u2192 file_upload(ref, paths) or file_upload(coordinate, paths)`
   },
   navigation: {
     title: "Navigation \u2014 How to navigate between pages",
@@ -1030,6 +1052,12 @@ find \u2192 Locate specific elements
   - Returns text + rect + ref for each match
   - Best for: finding specific values on page
 
+read_table \u2192 Structured table data (headers + rows)
+  - Best for: admin panel tables, data grids, price lists
+  - Supports HTML <table> and ARIA role="table"
+  - Cell interactive elements include refs for follow-up actions
+  - Max 500 rows
+
 batch_fetch \u2192 HTTP requests with browser session
   - Best for: API endpoints, AJAX data, paginated results
   - Uses browser cookies/auth automatically
@@ -1210,18 +1238,26 @@ ${guide.content}` };
 import { z } from "zod";
 
 // src/tools/advanced/file-upload.ts
-var FILE_UPLOAD_DESCRIPTION = `Upload local files to file input by ref. Use absolute paths. Don't click file inputs.
-Returns: { uploaded, fileCount }`;
-var FILE_UPLOAD_DETAIL = `Upload local files to a file input element on the page using absolute file paths.
-Do not click on file input elements \u2014 clicking opens a native file picker dialog.
-Instead, use read_page or find to locate the file input, then use this tool with its ref.
+var FILE_UPLOAD_DESCRIPTION = `Upload files to file input or drop files onto any element.
+For <input type="file">: use ref. For canvas/drop zones (Canva, Figma): use ref or coordinate.
+Returns: { uploaded/dropped, fileCount }`;
+var FILE_UPLOAD_DETAIL = `Upload or drop local files onto page elements using absolute file paths.
+
+Two modes:
+1. **File input** (ref \u2192 <input type="file">): Sets files via CDP. Don't click file inputs \u2014 use this tool instead.
+2. **Drag & drop** (ref \u2192 non-input, or coordinate): Simulates file drag & drop via CDP.
+   Use for canvas apps (Canva, Figma), custom drop zones, or any non-input upload area.
+
+If both ref and coordinate are provided, ref takes priority.
 The paths must be absolute paths accessible from the machine running Chrome.`;
 var FILE_UPLOAD_RETURNS = `{
-  uploaded: boolean
+  uploaded?: boolean  // file input mode
+  dropped?: boolean   // drag & drop mode
   fileCount: number
-  ref: string
+  ref?: string
+  coordinate?: [number, number]
 }`;
-var FILE_UPLOAD_RELATED = ["upload_image", "find", "read_page"];
+var FILE_UPLOAD_RELATED = ["upload_image", "find", "read_page", "drag"];
 
 // src/tools/advanced/gif-creator.ts
 var GIF_CREATOR_DESCRIPTION = `Record/export GIF. Actions: start_recording, stop_recording, export, clear.
@@ -1358,6 +1394,30 @@ var BATCH_FETCH_RETURNS = `{
 }`;
 var BATCH_FETCH_RELATED = ["javascript_exec", "read_network_requests", "sm_fetch"];
 
+// src/tools/core/bulk-action.ts
+var BULK_ACTION_DESCRIPTION = `Execute the same action on multiple elements by ref. Actions: click, check, uncheck, focus, scroll_to.
+Returns: { total, succeeded, failed, results[] }`;
+var BULK_ACTION_DETAIL = `Execute a single action across multiple element refs in one call.
+Designed for repetitive operations like checking/unchecking many checkboxes in admin panels.
+
+Actions:
+- click: DOM click on each element
+- check: Set checkbox/radio to checked (skip if already checked)
+- uncheck: Set checkbox to unchecked (skip if already unchecked)
+- focus: Focus each element sequentially
+- scroll_to: Scroll each element into view
+
+Operations execute sequentially to avoid DOM mutation race conditions.
+Maximum 200 refs per call. Disabled elements are reported as errors.
+Refs can span multiple frames (main page and iframes).`;
+var BULK_ACTION_RETURNS = `{
+  total: number
+  succeeded: number
+  failed: number
+  results: Array<{ ref: string, ok: boolean, error?: string }>
+}`;
+var BULK_ACTION_RELATED = ["click", "form_input", "form_fill", "find", "read_page"];
+
 // src/tools/core/click.ts
 var CLICK_DESCRIPTION = `Click at coordinate or ref. Actions: left/right/double/triple_click. Modifiers: ctrl/shift/alt/cmd.
 Does NOT wait for navigation \u2014 use form_input(submit:true) for forms.
@@ -1411,6 +1471,43 @@ var FIND_RETURNS = `{
 }`;
 var FIND_RELATED = ["read_page", "click", "form_input", "page_outline"];
 
+// src/tools/core/form-fill.ts
+var FORM_FILL_DESCRIPTION = `Set values on multiple form elements in one call. Same semantics as form_input for each field.
+Returns: { total, succeeded, failed, results[] }`;
+var FORM_FILL_DETAIL = `Set values on multiple form elements in a single call.
+Each field uses the same value-setting logic as form_input (supports text inputs,
+textareas, selects, checkboxes, radio buttons, contenteditable, date inputs).
+
+Fields are processed sequentially in array order (important for dependent fields
+like country \u2192 city selects). Maximum 50 fields per call.
+
+Each field result includes verification (verified: true/false) indicating whether
+the value was accepted by the page.
+
+Optional submit: if submit is true, the form is submitted after setting all fields
+(same as form_input submit behavior \u2014 requestSubmit or Enter key fallback).
+Submit is only attempted if at least one field succeeded.
+The submitRef defaults to the last field's ref if not specified.`;
+var FORM_FILL_RETURNS = `{
+  total: number          // Total fields attempted
+  succeeded: number      // Fields set successfully
+  failed: number         // Fields that failed
+  results: Array<{
+    ref: string
+    set: boolean
+    value?: string       // For text/select fields
+    checked?: boolean    // For checkbox/radio
+    selectedText?: string // For select fields
+    verified: boolean
+    error?: string       // If set failed
+    warning?: string     // If verification concern
+  }>
+  submitted?: boolean    // If submit was requested
+  navigated?: boolean    // If navigation occurred after submit
+  url?: string           // New URL after navigation
+}`;
+var FORM_FILL_RELATED = ["form_input", "bulk_action", "find", "read_page"];
+
 // src/tools/core/form-input.ts
 var FORM_INPUT_DESCRIPTION = `Set value on form element by ref. Supports inputs, selects, checkboxes, radio, contenteditable.
 Use submit:true to submit and wait for navigation.
@@ -1483,6 +1580,42 @@ Useful for revealing tooltips, dropdown menus, or triggering hover states.`;
 var HOVER_RETURNS = `{ hovered: true }`;
 var HOVER_RELATED = ["click", "wait_for", "screenshot"];
 
+// src/tools/core/inspect.ts
+var INSPECT_DESCRIPTION = `Inspect element: computed styles, attributes, dimensions, DOM structure, images.
+Use ref from read_page/find or CSS selector. Specify sections to control output size.
+Returns: { identity, box, typography, visual, layout, attributes, dom, form, image, accessibility }`;
+var INSPECT_DETAIL = `Deep-inspect a single element for development/QA tasks.
+
+Sections (pick what you need via sections param, default: identity box typography visual layout attributes):
+- identity: tag, id, classes, role, data-* attributes
+- box: bounding rect, margin, padding, border-width, box-sizing, overflow
+- typography: font-family/size/weight/style, line-height, letter-spacing, text-align, color (#hex)
+- visual: background-color, border (color/style/radius), opacity, box-shadow, cursor
+- layout: display, position, z-index, top/right/bottom/left, flex/grid properties
+- attributes: all HTML attributes as key-value pairs
+- dom: parent path, child summary, textContent (500 chars), innerHTML (1000 chars)
+- form: value, checked, disabled, readonly, required, validation constraints, validity state
+- image: src, naturalWidth/Height, alt, loaded state + actual image as content block (for img/canvas/svg/video/audio)
+- accessibility: accessible name, role, all aria-* attrs, focusable, tab index, contrast ratio (WCAG)
+
+Use properties param to request additional CSS properties not in the default sections.
+All colors returned in #hex format.`;
+var INSPECT_RETURNS = `{
+  // Only requested sections are returned
+  identity?: { tag, id?, classes[], role?, dataAttributes{} }
+  box?: { rect{x,y,width,height}, margin{top,right,bottom,left}, padding{...}, borderWidth{...}, boxSizing, overflow{x,y} }
+  typography?: { fontFamily, fontSize, fontWeight, fontStyle, lineHeight, letterSpacing, textAlign, color }
+  visual?: { backgroundColor, border{color,style,radius}, opacity, boxShadow, cursor }
+  layout?: { display, position, zIndex, top?, right?, bottom?, left?, flex?{direction,justifyContent,alignItems,gap,wrap}, grid?{...} }
+  attributes?: { [name]: value }
+  dom?: { parentPath, childSummary, textContent, innerHTML }
+  form?: { value?, checked?, disabled, readonly, required, validation{}, validity{} }
+  image?: { src?, currentSrc?, naturalWidth?, naturalHeight?, alt?, complete?, svgMarkup?, videoWidth?, videoHeight?, duration?, paused?, muted? }  // + image/frame content block
+  accessibility?: { accessibleName, role, ariaAttributes{}, focusable, tabIndex, contrastRatio{ratio,aa,aaa,textColor,bgColor} }
+  properties?: { [cssPropertyName]: value }  // extra CSS properties if requested
+}`;
+var INSPECT_RELATED = ["read_page", "find", "screenshot"];
+
 // src/tools/core/javascript-exec.ts
 var JAVASCRIPT_EXEC_DESCRIPTION = `Execute JavaScript in page context. Supports top-level await. Use file_path for large results.
 Returns: { result }`;
@@ -1579,6 +1712,32 @@ var READ_PAGE_RETURNS = `{
 }`;
 var READ_PAGE_RELATED = ["page_outline", "find", "get_page_text", "screenshot"];
 
+// src/tools/core/read-table.ts
+var READ_TABLE_DESCRIPTION = `Extract structured table data by ref. Supports <table> and ARIA role="table".
+Returns: { headers, rows, totalRows, truncated, tableRef }`;
+var READ_TABLE_DETAIL = `Extract structured data from a table element identified by ref.
+
+Supports:
+- Standard HTML tables (table/thead/tbody/tfoot/tr/th/td)
+- ARIA role-based tables (role="table", role="row", role="cell", role="columnheader")
+- Nested tables are excluded (only the target table level is extracted)
+
+The ref can point to a <table> element, a role="table" element, or an ancestor/descendant
+of a table. The tool searches upward first, then downward to find the nearest table.
+
+Cells containing interactive elements (links, buttons, inputs) include their refs
+in the format "text [ref_N]" so the agent can interact with them.
+
+Cell content is truncated to 200 characters. Maximum 500 rows returned.`;
+var READ_TABLE_RETURNS = `{
+  headers: string[]       // Column headers (from <thead>/<th> or role="columnheader")
+  rows: string[][]        // Data rows (each row is array of cell strings)
+  totalRows: number       // Total rows before truncation
+  truncated: boolean      // Whether rows were truncated
+  tableRef: string        // Ref of the resolved table element
+}`;
+var READ_TABLE_RELATED = ["read_page", "find", "form_input", "form_fill", "get_page_text"];
+
 // src/tools/core/screenshot.ts
 var SCREENSHOT_DESCRIPTION = `Take screenshot. Use ref for element, ref+refTo for range. WebP q70 default.
 Prefer read_page/find for text data \u2014 screenshot only when visual verification needed.
@@ -3000,8 +3159,8 @@ Actions:
   Returns: url_pattern, selector, element_tag, text_preview, created_by, latest_comment, attachment_count, has_screenshots.
 - get: Get full thread details including all comments. Requires thread_id.
   Comments include attachment metadata and screenshot IDs (images not inline \u2014 use get_attachment to download).
-- add: Create new thread on an element. Requires ref (from read_page) or selector + body.
-- reply: Add comment to existing thread. Requires thread_id + body.
+- add: Create new thread on an element. Requires ref (from read_page) or selector + body. Optional attachments (base64 images).
+- reply: Add comment to existing thread. Requires thread_id + body. Optional attachments (base64 images).
 - resolve: Mark thread as resolved. Requires thread_id. Optional resolution_note.
 - reopen: Reopen a resolved thread. Requires thread_id.
 - complete: Archive/dismiss a thread (removes pin). Requires thread_id.
@@ -3213,6 +3372,36 @@ var findTool = {
     maxResults: z.coerce.number().min(1).max(50).optional().describe("Max results to return (default: 25, max: 50)")
   })
 };
+var inspectTool = {
+  name: "inspect",
+  description: INSPECT_DESCRIPTION,
+  detail: INSPECT_DETAIL,
+  returns: INSPECT_RETURNS,
+  category: "core",
+  related: INSPECT_RELATED,
+  inputSchema: z.object({
+    tabId: z.coerce.number().describe("Tab ID"),
+    ref: z.string().optional().describe("Element ref from read_page or find"),
+    selector: z.string().optional().describe("CSS selector (alternative to ref)"),
+    sections: z.array(
+      z.enum([
+        "identity",
+        "box",
+        "typography",
+        "visual",
+        "layout",
+        "attributes",
+        "dom",
+        "form",
+        "image",
+        "accessibility"
+      ])
+    ).optional().describe(
+      "Sections to return (default: identity, box, typography, visual, layout, attributes)"
+    ),
+    properties: z.array(z.string()).optional().describe('Additional CSS property names to include (e.g. ["gap", "grid-template-columns"])')
+  })
+};
 var formInputTool = {
   name: "form_input",
   description: FORM_INPUT_DESCRIPTION,
@@ -3230,6 +3419,51 @@ var formInputTool = {
     listOptions: z.boolean().optional().describe("List select options without changing selection")
   })
 };
+var formFillTool = {
+  name: "form_fill",
+  description: FORM_FILL_DESCRIPTION,
+  detail: FORM_FILL_DETAIL,
+  returns: FORM_FILL_RETURNS,
+  category: "core",
+  related: FORM_FILL_RELATED,
+  inputSchema: z.object({
+    tabId: z.coerce.number().describe("Tab ID"),
+    fields: z.array(
+      z.object({
+        ref: z.string().describe("Element reference ID"),
+        value: z.union([z.string(), z.boolean(), z.coerce.number()]).describe("Value to set")
+      })
+    ).min(1).max(50).describe("Array of {ref, value} objects"),
+    submit: z.boolean().optional().describe("Submit the form after setting all values"),
+    submitRef: z.string().optional().describe("Ref of element to use for submit (default: last field)")
+  })
+};
+var bulkActionTool = {
+  name: "bulk_action",
+  description: BULK_ACTION_DESCRIPTION,
+  detail: BULK_ACTION_DETAIL,
+  returns: BULK_ACTION_RETURNS,
+  category: "core",
+  related: BULK_ACTION_RELATED,
+  inputSchema: z.object({
+    tabId: z.coerce.number().describe("Tab ID"),
+    refs: z.array(z.string()).min(1).max(200).describe("Array of element reference IDs"),
+    action: z.enum(["click", "check", "uncheck", "focus", "scroll_to"]).describe("Action to perform on each element")
+  })
+};
+var readTableTool = {
+  name: "read_table",
+  description: READ_TABLE_DESCRIPTION,
+  detail: READ_TABLE_DETAIL,
+  returns: READ_TABLE_RETURNS,
+  category: "core",
+  related: READ_TABLE_RELATED,
+  inputSchema: z.object({
+    tabId: z.coerce.number().describe("Tab ID"),
+    ref: z.string().describe("Element reference ID pointing to or containing a table"),
+    maxRows: z.coerce.number().min(1).max(500).optional().describe("Max rows to return (default: 500)")
+  })
+};
 var javascriptExecTool = {
   name: "javascript_exec",
   description: JAVASCRIPT_EXEC_DESCRIPTION,
@@ -3537,8 +3771,11 @@ var fileUploadTool = {
   related: FILE_UPLOAD_RELATED,
   inputSchema: z.object({
     tabId: z.coerce.number().describe("Tab ID"),
-    ref: z.string().describe("Element reference ID of the file input"),
-    paths: z.array(z.string()).min(1).describe("Absolute file paths to upload")
+    ref: z.string().describe("Element reference ID (file input or drop target)").optional(),
+    coordinate: z.tuple([z.coerce.number(), z.coerce.number()]).describe("Drop target coordinates [x, y]").optional(),
+    paths: z.array(z.string()).min(1).describe("Absolute file paths to upload/drop")
+  }).refine((d) => d.ref || d.coordinate, {
+    message: 'Either "ref" or "coordinate" must be provided'
   })
 };
 var agentTabAssignTool = {
@@ -3637,6 +3874,15 @@ var feedbackTool = {
     body: z.string().optional().describe("Comment text (for add/reply)"),
     thread_id: z.string().optional().describe("Thread ID (for reply/resolve/reopen/complete)"),
     resolution_note: z.string().optional().describe("Resolution note (for resolve)"),
+    attachments: z.array(
+      z.object({
+        filename: z.string(),
+        base64: z.string(),
+        mime_type: z.string(),
+        width: z.coerce.number(),
+        height: z.coerce.number()
+      })
+    ).optional().describe("Image attachments as base64 (for add/reply, max 5)"),
     attachment_id: z.string().optional().describe("Attachment or screenshot ID (for get_attachment)"),
     status: z.enum(["open", "resolved", "completed", "all"]).optional().describe("Status filter (for list, default: open)")
   })
@@ -4464,7 +4710,11 @@ var allTools = [
   dragTool,
   readPageTool,
   findTool,
+  inspectTool,
   formInputTool,
+  formFillTool,
+  bulkActionTool,
+  readTableTool,
   javascriptExecTool,
   waitForTool,
   getPageTextTool,