chromeflow 0.1.38 → 0.1.39

package/CLAUDE.md

@@ -155,14 +155,31 @@ screenshot to check what happened.
 
 **React Select / custom styled dropdowns** (e.g. "Select..." components on DataAnnotation):
 `click_element` and `fill_input` do NOT work on these — they intercept native events. Use
-`execute_script` directly:
+`execute_script` with the hidden combobox input approach (most reliable):
 
 ```js
-// 1. Open the menu — click the control div (filter by pageY if multiple)
+// 1. Find the hidden combobox input (each React Select has one: input[id*="react-select-N-input"])
+var input = document.querySelector('input[id*="react-select-3-input"]');
+input.focus();
+
+// 2. Set value via native setter to trigger React's onChange
+var setter = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value').set;
+setter.call(input, 'Target Option');
+input.dispatchEvent(new Event('input', {bubbles: true}));
+
+// 3. Wait 300ms for the dropdown to filter, then click the first matching option
+// (run this as a separate execute_script call after a brief pause)
+var option = document.querySelector('[id*="react-select-3-option-0"]');
+if (option) option.click();
+
+// 4. Verify — the control div should show the selected value
+document.querySelector('[class*="singleValue"]').textContent.trim();
+```
+
+Fallback if the combobox approach doesn't work (older React Select versions):
+```js
 var controls = document.querySelectorAll('[class*="control"]');
 controls[N].click();
-
-// 2. Pick an option by exact text
 var allEls = document.querySelectorAll('*');
 for (var i = 0; i < allEls.length; i++) {
   if (allEls[i].textContent.trim() === 'Target Option' && allEls[i].children.length === 0) {
@@ -171,9 +188,6 @@ for (var i = 0; i < allEls.length; i++) {
     break;
   }
 }
-
-// 3. Verify
-controls[N].textContent.trim(); // should show selected value
 ```
 
 **Page text with large embedded content** (e.g. uploaded log files previewed inline): full-page `get_page_text()` pagination becomes unwieldy. Scope to a specific section instead:

package/dist/setup.js

@@ -169,7 +169,9 @@ const CHROMEFLOW_TOOLS = [
   // v0.1.32+
   "fill_form",
   // v0.1.36+
-  "set_file_input"
+  "set_file_input",
+  // v0.1.39+
+  "get_console_logs"
 ].map((t) => `mcp__chromeflow__${t}`);
 function patchSettingsLocalJson(cwd) {
   const claudeDir = join(cwd, ".claude");

package/dist/tools/capture.js

@@ -12,10 +12,11 @@ DO NOT use for: email address, password, payment/billing info, phone number \u20
 After filling, call wait_for_click only if the user needs to review/confirm; otherwise proceed directly to the next step.`,
     {
       textHint: z.string().describe("The label, placeholder, or nearby text identifying the input (e.g. 'Product name', 'Amount', 'Description')"),
-      value: z.string().describe("The value to fill in")
+      value: z.string().describe("The value to fill in"),
+      nth: z.number().int().min(1).optional().describe("Which match to fill when multiple inputs share the same label (1 = first/topmost, default 1)")
     },
-    async ({ textHint, value }) => {
-      const response = await bridge.request({ type: "fill_input", textHint, value });
+    async ({ textHint, value, nth }) => {
+      const response = await bridge.request({ type: "fill_input", textHint, value, nth });
       if (response.type !== "fill_response") throw new Error("Unexpected response");
       const r = response;
       return {
@@ -117,6 +118,36 @@ The snapshot is read from the local temp file written by save_page_state.`,
       };
     }
   );
+  server.tool(
+    "get_console_logs",
+    `Read the browser console output (log, warn, error, info) captured since the page loaded.
+Returns the last 200 messages with their level and timestamp.
+Use this to check for JavaScript errors, debug React issues, or verify that an action produced the expected console output.
+Pass level="error" to see only errors, or omit to see all levels.`,
+    {
+      level: z.enum(["log", "warn", "error", "info"]).optional().describe('Filter by log level (e.g. "error" to see only errors). Omit for all levels.')
+    },
+    async ({ level }) => {
+      const response = await bridge.request({ type: "execute_script", code: `JSON.stringify(window._consoleLogs || [])` });
+      if (response.type !== "script_response") throw new Error("Unexpected response");
+      let logs;
+      try {
+        logs = JSON.parse(response.result);
+      } catch {
+        return { content: [{ type: "text", text: "No console logs captured (console capture may not be injected on this page yet \u2014 navigate first)." }] };
+      }
+      if (level) logs = logs.filter((l) => l.level === level);
+      if (logs.length === 0) {
+        return { content: [{ type: "text", text: level ? `No ${level}-level console messages.` : "No console messages captured." }] };
+      }
+      const lines = logs.map((l) => {
+        const time = new Date(l.time).toISOString().slice(11, 23);
+        return `[${time}] ${l.level.toUpperCase()}: ${l.message.slice(0, 500)}`;
+      });
+      return { content: [{ type: "text", text: `Console logs (${logs.length} entries):
+${lines.join("\n")}` }] };
+    }
+  );
   server.tool(
     "write_to_env",
     "Write a key=value pair to a .env file. Use this after capturing an API key or ID from the page.",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "chromeflow",
-  "version": "0.1.38",
+  "version": "0.1.39",
   "description": "Browser guidance MCP server for Claude Code — highlights, clicks, fills, and captures from the web so you don't have to.",
   "type": "module",
   "bin": {