Puppeteer中page.type()输入文本随机丢失开头字符问题求助

根因定位 #

首先可以排除你怀疑的两个方向：Base64解码、数组索引查找都是同步执行的，代码逻辑上会等待执行完成后才触发输入，加上日志已经验证待输入文本是完整的，字符丢失的核心触发点在三个环节：

• 聚焦目标不匹配：你只等待并聚焦了外层div[role="presentation"]容器，实际接收输入的是内部的span可编辑节点，焦点没有落到真正能接住键盘输入的元素上，初始触发的几个按键事件会被浏览器直接丢弃。
• 编辑器初始化时序差：你遇到的大概率是基于contenteditable实现的富文本编辑器，这类编辑器的DOM节点挂载完成后，还需要数百毫秒完成内部的事件绑定、光标初始化、输入监听挂载，waitForSelector只校验DOM节点存在，没有判断编辑器是否进入可交互状态。
• page.type的事件触发特性：page.type本质是逐字符发送键盘敲击事件，只要首个按键发出时目标元素未处于激活输入状态，不管后续输入多快，最开始的几个字符都会消失。

可落地的修复方案 #

按可靠性从高到低排序选择：

• 修正等待与聚焦逻辑，匹配真实输入节点
  不要再只等待外层容器，直接等待可输入的内部节点可见，聚焦到节点本身，给编辑器留足初始化响应时间，替换原来的等待聚焦代码：

  // 等待实际接收输入的节点完全可见
  await page.waitForSelector('div[role="presentation"] span', {
    visible: true,
    timeout: 3000
  });
  // 点击聚焦到实际输入节点，而非外层容器
  await page.click('div[role="presentation"] span');
  // 给编辑器留150ms的初始化响应时间
  await new Promise(resolve => setTimeout(resolve, 150));
  

• 优先用非逐字输入方式替代page.type，从根源避免丢字符
  对于不需要模拟逐字输入效果的场景，page.type逐字符敲击在富文本场景下的稳定性极差，可直接替换为零字符丢失的输入逻辑：

  // 直接写入可编辑节点内容，触发原生输入事件让编辑器识别变更
  await page.evaluate((inputText) => {
    const editorNode = document.querySelector('div[role="presentation"] span');
    editorNode.innerText = inputText;
    editorNode.dispatchEvent(new InputEvent('input', { bubbles: true }));
  }, textContent);
  

  如果需要模拟真实用户的输入路径，可以用剪贴板粘贴代替逐字敲击，稳定性远高于page.type：

  // 把文本写入剪贴板
  await page.evaluate((inputText) => navigator.clipboard.writeText(inputText), textContent);
  // 聚焦输入节点后执行粘贴
  await page.click('div[role="presentation"] span');
  await page.keyboard.press('Control+V'); // macOS设备替换为Meta+V
  

• 必须保留page.type逐字输入效果时的兼容处理
  当业务需要逐字符触发编辑器的实时校验、联动逻辑时，可以在正式输入前先做一次焦点占位，避免初始字符被丢弃：

  // 聚焦输入节点
  await page.click('div[role="presentation"] span');
  // 敲一个空格占住输入焦点
  await page.keyboard.press('Space');
  // 删掉占位空格，光标位置已经稳定激活
  await page.keyboard.press('Backspace');
  // 此时再执行逐字输入，不会出现开头字符丢失
  await page.type('div[role="presentation"] span', textContent, { delay: 100 });
  

注意：很多人提到的增大page.type的delay参数并不能解决开头丢字符的问题，这类问题的核心是焦点未就绪导致的事件丢弃，和输入速度无关，即使把delay调到500ms，只要第一个按键发出时元素未激活，开头字符依然会丢失。

内容的提问来源于stack exchange，提问作者s.khan