在Dev Tools的Sources'面板中以编程方式打开JS / CSS文件

Question

我知道可以将我自己的面板添加到Chrome开发者工具中，但是可以单击我自己面板中的按钮并让开发者工具在“来源”面板中打开特定的脚本或样式表他们正在检查的页面？

如果您确切知道要查找的内容，可以从左侧菜单中打开文件，但我基本上只想提供一个快捷方式来打开特定文件进行编辑。

Answer 1

现在有openResource API：

chrome.devtools.panels.openResource(string url, integer lineNumber, function callback)

如chrome.devtools docs。

中所述

您将要检查的文件的绝对URL传递给它，并带有可选的行号和回调。行号基于0，而在UI中基于1。因此，如果您想在UI中打开行10，则需要在该函数调用中传递9。

在撰写本文时，回调函数的文档是错误的：在成功和失败时调用它并采用一个参数。该参数是描述结果的对象。

成功之后，你得到：

{
    code: "OK",
    description: "OK",
    details: []
}

如果出错，您会得到:(可能存在其他错误情况）

{
    code: "E_NOTFOUND",
    description: "Object not found: %s",
    details: [
        "http://localhost/foo.js"
    ],
    isError: true
}