时间戳

首页 > 解决方案 > devtool 扩展面板中的免费搜索文本

javascript - devtool 扩展面板中的免费搜索文本

问题描述

我正在寻找一种在 Chrome Devtools 面板扩展中搜索文本以查找我编写的扩展的方法。该面板是一个标准的 Web 应用程序（js、css、html）。
目前，当我点击cmd + f扩展面板底部的搜索栏时会弹出。
在下面的示例中，我希望该词Hello会突出显示，但 Chrome Devtools 面板可能不支持这种行为 OOB。
有没有办法在我的扩展代码中实现这种行为（通过绑定到特殊事件或配置）？

在此处输入图像描述

标签： javascriptgoogle-chromegoogle-chrome-extensiongoogle-chrome-devtools

解决方案

您可能需要手动实现该功能。但是，我知道有一个事件侦听器用于触发 chrome.devtools.panels api 的搜索事件。

它将像这样实现：

chrome.devtools.panels.create("My devtools extension",
"logo.png",
"page.html",
function(panel) {
    panel.onShown.addListener(function(event) {
        ...
    });

    panel.onHidden.addListener(function(event) {
        ...
    });

    panel.onSearch.addListener(function(event) {
        <your code here>
    });
});

这样，您可以以任何您想要的方式实现此功能。

这是有关 Chrome 面板的更多信息的链接：https ://developer.chrome.com/extensions/devtools_panels

希望这可以帮助！

推荐阅读