poke-browser 0.4.2 → 0.4.4

package/extension/background.js

@@ -661,13 +661,20 @@ async function clearFocusedFieldViaDebuggerKeys(tabId) {
     key: "a",
     code: "KeyA",
     windowsVirtualKeyCode: 65,
+    nativeVirtualKeyCode: 65,
+    unmodifiedText: "a",
+    text: "a",
     modifiers: mod,
+    autoRepeat: false,
   });
   await debuggerSend(tabId, "Input.dispatchKeyEvent", {
     type: "keyUp",
     key: "a",
     code: "KeyA",
     windowsVirtualKeyCode: 65,
+    nativeVirtualKeyCode: 65,
+    unmodifiedText: "a",
+    text: "a",
     modifiers: mod,
   });
   await debuggerSend(tabId, "Input.dispatchKeyEvent", {
@@ -675,15 +682,359 @@ async function clearFocusedFieldViaDebuggerKeys(tabId) {
     key: "Backspace",
     code: "Backspace",
     windowsVirtualKeyCode: 8,
+    nativeVirtualKeyCode: 8,
+    unmodifiedText: "",
+    text: "",
+    modifiers: 0,
+    autoRepeat: false,
   });
   await debuggerSend(tabId, "Input.dispatchKeyEvent", {
     type: "keyUp",
     key: "Backspace",
     code: "Backspace",
     windowsVirtualKeyCode: 8,
+    nativeVirtualKeyCode: 8,
+    unmodifiedText: "",
+    text: "",
+    modifiers: 0,
   });
 }
 
+/**
+ * US QWERTY CDP key fields for printable ASCII (Input.dispatchKeyEvent).
+ * @typedef {{ key: string, code: string, windowsVirtualKeyCode: number, nativeVirtualKeyCode: number, modifiers: number, unmodifiedText: string, text: string }} CdpPrintableDescriptor
+ */
+
+/**
+ * @param {string} ch Single UTF-16 code unit
+ * @returns {CdpPrintableDescriptor}
+ */
+function cdpKeyDescriptorForPrintableChar(ch) {
+  const cp = ch.codePointAt(0);
+
+  if (cp >= 97 && cp <= 122) {
+    const up = String.fromCharCode(cp - 32);
+    return {
+      key: ch,
+      code: `Key${up}`,
+      windowsVirtualKeyCode: up.charCodeAt(0),
+      nativeVirtualKeyCode: up.charCodeAt(0),
+      modifiers: 0,
+      unmodifiedText: ch,
+      text: ch,
+    };
+  }
+  if (cp >= 65 && cp <= 90) {
+    const low = String.fromCharCode(cp + 32);
+    return {
+      key: ch,
+      code: `Key${ch}`,
+      windowsVirtualKeyCode: cp,
+      nativeVirtualKeyCode: cp,
+      modifiers: 8,
+      unmodifiedText: low,
+      text: ch,
+    };
+  }
+  if (cp >= 48 && cp <= 57) {
+    return {
+      key: ch,
+      code: `Digit${ch}`,
+      windowsVirtualKeyCode: cp,
+      nativeVirtualKeyCode: cp,
+      modifiers: 0,
+      unmodifiedText: ch,
+      text: ch,
+    };
+  }
+  if (ch === " ") {
+    return {
+      key: " ",
+      code: "Space",
+      windowsVirtualKeyCode: 32,
+      nativeVirtualKeyCode: 32,
+      modifiers: 0,
+      unmodifiedText: " ",
+      text: " ",
+    };
+  }
+
+  /** @type {Record<string, Omit<CdpPrintableDescriptor, "key">>} */
+  const map = {
+    "`": {
+      code: "Backquote",
+      windowsVirtualKeyCode: 192,
+      nativeVirtualKeyCode: 192,
+      modifiers: 0,
+      unmodifiedText: "`",
+      text: "`",
+    },
+    "-": {
+      code: "Minus",
+      windowsVirtualKeyCode: 189,
+      nativeVirtualKeyCode: 189,
+      modifiers: 0,
+      unmodifiedText: "-",
+      text: "-",
+    },
+    "=": {
+      code: "Equal",
+      windowsVirtualKeyCode: 187,
+      nativeVirtualKeyCode: 187,
+      modifiers: 0,
+      unmodifiedText: "=",
+      text: "=",
+    },
+    "[": {
+      code: "BracketLeft",
+      windowsVirtualKeyCode: 219,
+      nativeVirtualKeyCode: 219,
+      modifiers: 0,
+      unmodifiedText: "[",
+      text: "[",
+    },
+    "]": {
+      code: "BracketRight",
+      windowsVirtualKeyCode: 221,
+      nativeVirtualKeyCode: 221,
+      modifiers: 0,
+      unmodifiedText: "]",
+      text: "]",
+    },
+    "\\": {
+      code: "Backslash",
+      windowsVirtualKeyCode: 220,
+      nativeVirtualKeyCode: 220,
+      modifiers: 0,
+      unmodifiedText: "\\",
+      text: "\\",
+    },
+    ";": {
+      code: "Semicolon",
+      windowsVirtualKeyCode: 186,
+      nativeVirtualKeyCode: 186,
+      modifiers: 0,
+      unmodifiedText: ";",
+      text: ";",
+    },
+    "'": {
+      code: "Quote",
+      windowsVirtualKeyCode: 222,
+      nativeVirtualKeyCode: 222,
+      modifiers: 0,
+      unmodifiedText: "'",
+      text: "'",
+    },
+    ",": {
+      code: "Comma",
+      windowsVirtualKeyCode: 188,
+      nativeVirtualKeyCode: 188,
+      modifiers: 0,
+      unmodifiedText: ",",
+      text: ",",
+    },
+    ".": {
+      code: "Period",
+      windowsVirtualKeyCode: 190,
+      nativeVirtualKeyCode: 190,
+      modifiers: 0,
+      unmodifiedText: ".",
+      text: ".",
+    },
+    "/": {
+      code: "Slash",
+      windowsVirtualKeyCode: 191,
+      nativeVirtualKeyCode: 191,
+      modifiers: 0,
+      unmodifiedText: "/",
+      text: "/",
+    },
+    "!": {
+      code: "Digit1",
+      windowsVirtualKeyCode: 49,
+      nativeVirtualKeyCode: 49,
+      modifiers: 8,
+      unmodifiedText: "1",
+      text: "!",
+    },
+    "@": {
+      code: "Digit2",
+      windowsVirtualKeyCode: 50,
+      nativeVirtualKeyCode: 50,
+      modifiers: 8,
+      unmodifiedText: "2",
+      text: "@",
+    },
+    "#": {
+      code: "Digit3",
+      windowsVirtualKeyCode: 51,
+      nativeVirtualKeyCode: 51,
+      modifiers: 8,
+      unmodifiedText: "3",
+      text: "#",
+    },
+    $: {
+      code: "Digit4",
+      windowsVirtualKeyCode: 52,
+      nativeVirtualKeyCode: 52,
+      modifiers: 8,
+      unmodifiedText: "4",
+      text: "$",
+    },
+    "%": {
+      code: "Digit5",
+      windowsVirtualKeyCode: 53,
+      nativeVirtualKeyCode: 53,
+      modifiers: 8,
+      unmodifiedText: "5",
+      text: "%",
+    },
+    "^": {
+      code: "Digit6",
+      windowsVirtualKeyCode: 54,
+      nativeVirtualKeyCode: 54,
+      modifiers: 8,
+      unmodifiedText: "6",
+      text: "^",
+    },
+    "&": {
+      code: "Digit7",
+      windowsVirtualKeyCode: 55,
+      nativeVirtualKeyCode: 55,
+      modifiers: 8,
+      unmodifiedText: "7",
+      text: "&",
+    },
+    "*": {
+      code: "Digit8",
+      windowsVirtualKeyCode: 56,
+      nativeVirtualKeyCode: 56,
+      modifiers: 8,
+      unmodifiedText: "8",
+      text: "*",
+    },
+    "(": {
+      code: "Digit9",
+      windowsVirtualKeyCode: 57,
+      nativeVirtualKeyCode: 57,
+      modifiers: 8,
+      unmodifiedText: "9",
+      text: "(",
+    },
+    ")": {
+      code: "Digit0",
+      windowsVirtualKeyCode: 48,
+      nativeVirtualKeyCode: 48,
+      modifiers: 8,
+      unmodifiedText: "0",
+      text: ")",
+    },
+    _: {
+      code: "Minus",
+      windowsVirtualKeyCode: 189,
+      nativeVirtualKeyCode: 189,
+      modifiers: 8,
+      unmodifiedText: "-",
+      text: "_",
+    },
+    "+": {
+      code: "Equal",
+      windowsVirtualKeyCode: 187,
+      nativeVirtualKeyCode: 187,
+      modifiers: 8,
+      unmodifiedText: "=",
+      text: "+",
+    },
+    "{": {
+      code: "BracketLeft",
+      windowsVirtualKeyCode: 219,
+      nativeVirtualKeyCode: 219,
+      modifiers: 8,
+      unmodifiedText: "[",
+      text: "{",
+    },
+    "}": {
+      code: "BracketRight",
+      windowsVirtualKeyCode: 221,
+      nativeVirtualKeyCode: 221,
+      modifiers: 8,
+      unmodifiedText: "]",
+      text: "}",
+    },
+    "|": {
+      code: "Backslash",
+      windowsVirtualKeyCode: 220,
+      nativeVirtualKeyCode: 220,
+      modifiers: 8,
+      unmodifiedText: "\\",
+      text: "|",
+    },
+    ":": {
+      code: "Semicolon",
+      windowsVirtualKeyCode: 186,
+      nativeVirtualKeyCode: 186,
+      modifiers: 8,
+      unmodifiedText: ";",
+      text: ":",
+    },
+    '"': {
+      code: "Quote",
+      windowsVirtualKeyCode: 222,
+      nativeVirtualKeyCode: 222,
+      modifiers: 8,
+      unmodifiedText: "'",
+      text: '"',
+    },
+    "<": {
+      code: "Comma",
+      windowsVirtualKeyCode: 188,
+      nativeVirtualKeyCode: 188,
+      modifiers: 8,
+      unmodifiedText: ",",
+      text: "<",
+    },
+    ">": {
+      code: "Period",
+      windowsVirtualKeyCode: 190,
+      nativeVirtualKeyCode: 190,
+      modifiers: 8,
+      unmodifiedText: ".",
+      text: ">",
+    },
+    "?": {
+      code: "Slash",
+      windowsVirtualKeyCode: 191,
+      nativeVirtualKeyCode: 191,
+      modifiers: 8,
+      unmodifiedText: "/",
+      text: "?",
+    },
+    "~": {
+      code: "Backquote",
+      windowsVirtualKeyCode: 192,
+      nativeVirtualKeyCode: 192,
+      modifiers: 8,
+      unmodifiedText: "`",
+      text: "~",
+    },
+  };
+
+  const row = map[ch];
+  if (row) {
+    return { key: ch, ...row };
+  }
+
+  return {
+    key: ch,
+    code: "",
+    windowsVirtualKeyCode: 0,
+    nativeVirtualKeyCode: 0,
+    modifiers: 0,
+    unmodifiedText: ch,
+    text: ch,
+  };
+}
+
 /**
  * @param {number} tabId
  * @param {string} text
@@ -696,30 +1047,41 @@ async function typeTextViaDebugger(tabId, text, clearField) {
       await clearFocusedFieldViaDebuggerKeys(tabId);
     }
     for (const ch of text) {
-      if (ch === "\n" || ch === "\r") {
-        if (ch === "\r") continue;
-        await debuggerSend(tabId, "Input.dispatchKeyEvent", {
-          type: "keyDown",
+      if (ch === "\r") continue;
+      if (ch === "\n") {
+        const enterBase = {
           key: "Enter",
           code: "Enter",
           windowsVirtualKeyCode: 13,
-        });
+          nativeVirtualKeyCode: 13,
+          unmodifiedText: "\r",
+          text: "\r",
+          modifiers: 0,
+        };
         await debuggerSend(tabId, "Input.dispatchKeyEvent", {
-          type: "keyUp",
-          key: "Enter",
-          code: "Enter",
-          windowsVirtualKeyCode: 13,
+          type: "keyDown",
+          ...enterBase,
+          autoRepeat: false,
         });
+        await debuggerSend(tabId, "Input.dispatchKeyEvent", { type: "keyUp", ...enterBase });
         continue;
       }
+      const d = cdpKeyDescriptorForPrintableChar(ch);
+      const payload = {
+        key: d.key,
+        code: d.code,
+        windowsVirtualKeyCode: d.windowsVirtualKeyCode,
+        nativeVirtualKeyCode: d.nativeVirtualKeyCode,
+        unmodifiedText: d.unmodifiedText,
+        text: d.text,
+        modifiers: d.modifiers,
+      };
       await debuggerSend(tabId, "Input.dispatchKeyEvent", {
         type: "keyDown",
-        text: ch,
-      });
-      await debuggerSend(tabId, "Input.dispatchKeyEvent", {
-        type: "keyUp",
-        text: ch,
+        ...payload,
+        autoRepeat: false,
       });
+      await debuggerSend(tabId, "Input.dispatchKeyEvent", { type: "keyUp", ...payload });
     }
     return { success: true, charsTyped: text.length };
   } finally {

package/extension/content.js

@@ -256,6 +256,89 @@ function handleResolveClickPoint(message, sendResponse) {
   sendResponse({ success: true, x, y });
 }
 
+/**
+ * React / Draft.js-style editors listen for `beforeinput` + `input` (InputEvent) rather than only
+ * mutating textContent. Mirror native insertion order: beforeinput → DOM update → input → change.
+ * Clears placeholder text and enables Post buttons on Draft.js editors (X.com, LinkedIn, etc.).
+ * @param {HTMLElement} el
+ * @param {string} text
+ * @param {boolean} shouldClear
+ */
+function insertTextIntoContentEditable(el, text, shouldClear) {
+  /** `focus()` can drop a programmatic selection; preserve caret for insert-at-cursor. */
+  let savedRange = null;
+  if (!shouldClear) {
+    const pre = window.getSelection();
+    if (pre && pre.rangeCount > 0) {
+      const r = pre.getRangeAt(0);
+      if (el.contains(r.commonAncestorContainer)) {
+        savedRange = r.cloneRange();
+      }
+    }
+  }
+
+  el.focus();
+  const sel = window.getSelection();
+  if (shouldClear) {
+    if (sel) {
+      const range = document.createRange();
+      range.selectNodeContents(el);
+      sel.removeAllRanges();
+      sel.addRange(range);
+    }
+    document.execCommand("delete");
+  } else if (savedRange && sel) {
+    sel.removeAllRanges();
+    sel.addRange(savedRange);
+  }
+
+  const evInit = /** @type {InputEventInit} */ ({
+    bubbles: true,
+    composed: true,
+    inputType: "insertText",
+    data: text,
+  });
+  el.dispatchEvent(
+    new InputEvent("beforeinput", { ...evInit, cancelable: true })
+  );
+
+  if (shouldClear) {
+    el.textContent = text;
+  } else if (sel && sel.rangeCount > 0) {
+    const range = sel.getRangeAt(0);
+    if (el.contains(range.commonAncestorContainer)) {
+      const cc = range.commonAncestorContainer;
+      if (cc.nodeType === 3) {
+        const node = /** @type {Text} */ (cc);
+        const offset = range.startOffset;
+        const t = node.textContent ?? "";
+        const before = t.slice(0, offset);
+        const after = t.slice(offset);
+        node.textContent = before + text + after;
+        range.setStart(node, before.length + text.length);
+        range.collapse(true);
+        sel.removeAllRanges();
+        sel.addRange(range);
+      } else {
+        range.deleteContents();
+        const tn = document.createTextNode(text);
+        range.insertNode(tn);
+        range.setStartAfter(tn);
+        range.collapse(true);
+        sel.removeAllRanges();
+        sel.addRange(range);
+      }
+    } else {
+      el.textContent = (el.textContent || "") + text;
+    }
+  } else {
+    el.textContent = (el.textContent || "") + text;
+  }
+
+  el.dispatchEvent(new InputEvent("input", { ...evInit, cancelable: false }));
+  el.dispatchEvent(new Event("change", { bubbles: true }));
+}
+
 /**
  * @param {unknown} message
  * @param {(r: unknown) => void} sendResponse
@@ -278,22 +361,7 @@ function handleTypeText(message, sendResponse) {
 
   try {
     if (el.isContentEditable) {
-      el.focus();
-      if (shouldClear) {
-        const sel = window.getSelection();
-        if (sel && el.firstChild) {
-          const range = document.createRange();
-          range.selectNodeContents(el);
-          sel.removeAllRanges();
-          sel.addRange(range);
-        }
-        document.execCommand("delete");
-        el.textContent = text;
-      } else {
-        el.textContent = (el.textContent || "") + text;
-      }
-      el.dispatchEvent(new InputEvent("input", { bubbles: true, data: text, inputType: "insertText" }));
-      el.dispatchEvent(new Event("change", { bubbles: true }));
+      insertTextIntoContentEditable(el, text, shouldClear);
       sendResponse({ success: true, charsTyped: text.length });
       return;
     }

package/extension/manifest.json

@@ -1,7 +1,7 @@
 {
   "manifest_version": 3,
   "name": "poke-browser",
-  "version": "0.4.1",
+  "version": "0.4.3",
   "description": "Browser automation bridge for MCP agents via WebSocket.",
   "permissions": [
     "tabs",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "poke-browser",
-  "version": "0.4.2",
+  "version": "0.4.4",
   "description": "MCP server + WebSocket bridge for the poke-browser Chrome extension",
   "type": "module",
   "engines": {
@@ -62,6 +62,7 @@
     "@types/express": "^5.0.0",
     "@types/node": "^22.13.10",
     "@types/ws": "^8.18.1",
+    "jsdom": "^29.0.1",
     "semantic-release": "^24.2.0",
     "tsx": "^4.19.3",
     "typescript": "^5.8.2",