google-chrome-extension - 如何从 DevTools 代码编辑器中获取选定的文本？

Question

我正在尝试从 DevTools 的代码编辑器中获取选定的文本。我可以在 onSelectionChanged 处理程序中获取 selectionInfo，但我不知道如何获取文本。

另外如何在 onSelectionChanged 触发之前获取 selectionInfo （当前选择）？

chrome.devtools.panels.sources.createSidebarPane(
   "title",
    function(sidebar) {
        function update(selectionInfo) {
            //alert([selectionInfo.url, selectionInfo.startLine, selectionInfo.endLine, selectionInfo.startColumn, selectionInfo.endColumn]);
            sidebar.setObject(JSON.parse(JSON.stringify(selectionInfo)));
            // How to extract text using data from selectionInfo ???
        }

        update(/*selectionInfo should be there*/);
        chrome.devtools.panels.sources.onSelectionChanged.addListener(update);
    }
);

Answer 1

的回调chrome.devtools.panels.elements.onSelectionChanged.addListener不带任何参数，参见API 文档。这意味着你的selectionInfo永远是不确定的。

要获取所选元素，您可以使用$0变量。因此，您的代码将如下所示：

chrome.devtools.panels.elements.createSidebarPane(
   "title",
    function(sidebar) {
        function update() {
            sidebar.setExpression("$0");
        }

        update();
        chrome.devtools.panels.elements.onSelectionChanged.addListener(update);
    }
);

注意：我将chrome.devtools.panels.sources不存在的替换为chrome.devtools.panels.elements。