Chrome扩展无法获取Google Docs选中文本，求解决方案

问题根源 #

Google Docs的编辑内容托管在独立iframe中，且文本并非以原生DOM文本节点形式渲染，而是采用Google自定义的渲染引擎。常规的window.getSelection()调用无法穿透iframe获取选中内容，导致你的代码在Docs页面失效。

解决方案 #

1. 适配Google Docs的文本获取逻辑 #

修改getSelectedText函数，先尝试常规方式获取文本，若失败则针对Google Docs的特殊结构做适配，同时增加剪贴板兜底方案：

async function getSelectedText() {
  let text = "";
  const activeEl = document.activeElement;
  const activeElTagName = activeEl ? activeEl.tagName.toLowerCase() : null;

  // 处理输入框/文本域的选中内容
  if (activeElTagName === "textarea" || 
      (activeElTagName === "input" && 
       /^(?:text|search|tel|url)$/i.test(activeEl.type) && 
       typeof activeEl.selectionStart === "number")) {
    text = activeEl.value.slice(activeEl.selectionStart, activeEl.selectionEnd);
  } 
  // 处理普通页面的文本选中
  else if (window.getSelection) {
    text = window.getSelection().toString();
  }

  // Google Docs专属处理：穿透编辑器iframe
  if (!text && window.location.host.includes("docs.google.com")) {
    const editorIframe = document.querySelector('iframe[title="文档内容"]');
    if (editorIframe?.contentWindow) {
      const iframeDoc = editorIframe.contentDocument || editorIframe.contentWindow.document;
      if (iframeDoc.getSelection) {
        text = iframeDoc.getSelection().toString();
      }
    }
  }

  // 兜底方案：通过剪贴板读取选中内容（需权限）
  if (!text) {
    try {
      document.execCommand('copy');
      text = await navigator.clipboard.readText();
    } catch (err) {
      console.error('剪贴板读取失败:', err);
    }
  }

  return text;
}

async function scriptSelectionText(tabId) {
  console.log("tabId", tabId);
  const data = await chrome.scripting.executeScript({
    target: { tabId: tabId },
    func: getSelectedText,
    world: 'MAIN' // 指定在页面主上下文执行，确保能访问iframe
  });
  return data[0]?.result;
}

2. 更新扩展权限配置 #

在manifest.json中添加必要权限，确保扩展能访问Google Docs页面和剪贴板：

{
  "permissions": [
    "scripting",
    "clipboardRead",
    "activeTab"
  ],
  "host_permissions": [
    "https://docs.google.com/*"
  ]
}

关键说明 #

• iframe穿透：通过定位Google Docs的编辑器iframe，切换到其上下文执行选择获取逻辑，适配Docs的特殊DOM结构。
• 剪贴板兜底：若iframe选择器因Docs界面更新失效，剪贴板方案可作为后备，需提前申请clipboardRead权限。
• 主世界执行：world: 'MAIN'确保注入的脚本能访问页面主上下文，包括iframe内部内容。

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