Gmail Chrome扩展适配新写信界面：收件人读写方案技术求助

• 方案1：DOM操作+原生事件触发（无需额外授权，实现成本低）
  新版Gmail收件人输入区已更换为带contenteditable属性的富文本容器，直接修改元素值无法触发内部数据绑定，必须同步触发对应的原生交互事件才能生效：

  // 1. 定位收件人输入框
  const toInput = document.querySelector('div[contenteditable="true"][aria-label="收件人"]');
  // 2. 聚焦元素，模拟用户点击行为
  toInput.focus();
  // 3. 写入目标邮箱地址
  toInput.textContent = 'target@example.com';
  // 4. 触发input事件通知Gmail内部数据更新
  toInput.dispatchEvent(new InputEvent('input', { bubbles: true }));
  // 5. 触发blur事件让输入的邮箱自动转为标准收件人标签
  toInput.dispatchEvent(new Event('blur', { bubbles: true }));
  

  读取操作同理，直接获取toInput.textContent即可拿到当前输入的未转为标签的收件人，已生成标签的收件人可通过遍历输入框同级的span[email]元素，直接读取email属性值即可。

• 方案2：注入页面上下文调用Gmail内部数据接口（稳定性优于纯DOM操作）
  Content Script运行在独立沙箱，无法直接访问页面内置的JS变量，可通过注入script标签到页面上下文，读取Gmail内部存储的写信窗口数据对象，直接修改收件人数组，无需模拟任何UI交互。核心逻辑为在页面中注入执行代码，获取当前激活的草稿实例，直接调用实例的对应方法修改收件人字段，该方案受UI改版影响极小。

• 方案3：对接Gmail官方API（长期稳定性最高）
  若扩展可接受OAuth授权流程，直接调用Gmail API的drafts.update接口修改草稿收件人，完全不依赖前端界面变化，适配所有Gmail界面版本，适合需要高稳定性的商用扩展。

内容的提问来源于stack exchange，提问作者mirik