Chrome扩展开发：获取Google Docs选中文本失败问题求助

问题背景 #

开发面向Google Docs的Chrome扩展时，尝试用以下代码获取选中文本，返回结果是空字符串''：

const docsFrame = document.getElementsByClassName('docs-texteventtarget-iframe')[0]
docsFrame.contentDocument.getSelection().toString()

此前可用的Google Docs Utils库，因Docs切换为Canvas渲染机制已失效。

可行解决方案思路 #

针对Canvas渲染的Google Docs，有几种可行的获取选中文本的方式：

1. 调用Google Docs内部编辑器API #

通过注入脚本到Docs页面上下文，调用其内置的编辑器实例方法获取选区文本：

// 需在Google Docs页面的主上下文执行
function getSelectedText() {
  const editorInstance = document.querySelector('.docs-editor-container')?.__docs_editor_instance;
  if (!editorInstance) return '';
  
  const selection = editorInstance.getSelection();
  return selection?.getText() || '';
}

注：内部API可能随Docs版本更新变化，需做好兼容性处理。

2. 通过剪贴板间接获取 #

利用浏览器复制命令将选中内容存入剪贴板，再读取剪贴板内容：

// 触发复制操作
document.execCommand('copy');
// 读取剪贴板文本
navigator.clipboard.readText().then(selectedText => {
  console.log('选中文本:', selectedText);
});

注：需要在扩展权限中申请clipboardRead和clipboardWrite权限。

3. 解析文档数据模型 #

直接读取Docs存储的内部文档数据，结合选区坐标定位对应文本。这种方式复杂度较高，但能直接从数据源获取内容，不受渲染层变化影响。

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