chrome.experimental.devtools.audits

描述 使用 chrome.experimental.devtools.audits API 向开发者工具的审计面板中添加新的审计类别。
可用版本 警告:该 API 是实验性的,您必须以特殊的参数运行 Chrome 浏览器才能使用该 API。了解更多内容

有关使用开发者工具 API 的一般信息请参见开发者工具 API 概述

概述

在 Audits(审计)面板中,Select audits to run 下面每一行代表一个审计类别。如下例子添加名为 Readability(可读性)的类别:

      var category = chrome.experimental.devtools.audits.addCategory("Readability", 2);
      
Extension audit category on the launch screen of Audits panel

如果选中类别旁边的复选框,则那一类别的 onAuditStarted 事件将会在用户单击 Run(运行)按钮时产生。

您的扩展程序中的事件处理函数接受类型为 AuditResults 的参数,并且应该使用 addResult() 方法添加一个或多个结果。这可以异步地进行,即在事件处理函数返回后。一旦扩展程序使用 addCategory() 添加的结果数量达到声明的值时,或者调用 AuditResultsdone() 方法后,就认为这一类别的审计已经运行完毕。

结果可以包含额外的详情,通过审计面板中可展开的树的形式展现。您可以使用 createResult()addChild() 方法建立包含细节的树,子节点可以包含由 auditsResults.createSnippet()auditResults.createURL() 方法创建的具有特殊格式的片段。

例子

如下例子为 onAuditStarted 事件添加一个处理函数,创建两个审计结果,并为其中一个展现额外的详情:

      category.onAuditStarted.addListener(function(results) {
        var details = results.createResult("Details...");
        var styles = details.addChild("2 styles with small font");
        var elements = details.addChild("3 elements with small font");
      
        results.addResult("Font Size (5)",
            "5 elements use font size below 10pt",
            results.Severity.Severe,
            details);
        results.addResult("Contrast",
                          "Text should stand out from background",
                          results.Severity.Info);
      });
      

以上片段产生的审计结果树如下图所示:

Audit results example

您可以在示例中找到使用这一 API 的更多例子。

摘要

类型
AuditCategory
FormattedValue
AuditResults
AuditResultNode
AuditResultSeverity
方法
addCategory AuditCategory chrome.experimental.devtools.audits.addCategory(string displayName, double resultCount)

类型

AuditCategory

一组逻辑相关的审计检查。

onAuditStarted

如果一种类别已启用,当审计开始时将产生这一事件。事件处理函数应该开始审计逻辑的执行,最终产生 results 集合。

事件

addListener

onAuditStarted.addListener(function callback)
参数
function callback

callback 参数应该是一个如下形式的函数:

function( AuditResults results) {...};
AuditResults results

FormattedValue

由格式化(URL、代码片段等)函数返回的值,可以传递给 createResult() 或者 addChild()。参见 AuditResults.createSnippetAuditResults.createURL

AuditResults

当前运行的审计类别的所有审计结果的集合。
属性
AuditResultSeverity Severity

包含审计结果严重性的所有可能值。

string text

节点内容。

array of AuditResultNode (可选)
children

这一节点的子节点。

boolean (可选)
expanded

这一节点默认情况下是否展开。

方法

addResult

AuditResults.addResult(string displayName, string description, AuditResultSeverity severity, AuditResultNode details)

添加审计结果。结果会在与 AuditResults 对象关联的审计类别下,以带有项目符号的项目呈现。

参数
string displayName

对于结果简洁、高度概括的描述。

string description

对于 displayName 含义的详细描述。

AuditResultSeverity severity
AuditResultNode (可选)
details

出现在已添加结果下方的子树,可以提供发现的问题的额外详情。

createResult

AuditResultNode AuditResults.createResult(string or FormattedValue content)

创建结果节点,可以用于 addResult() 方法的 details 参数。

参数
string or FormattedValue content

从 Chrome 26 开始支持。

字符串或者由审计结果格式化(URL、代码片段等等)函数返回的经过格式化的值。如果传递了多个参数,它们将会拼接成单个节点。

done

AuditResults.done()

通知开发者工具的审计面板,这一类别的审计已经结束。审计的运行也会在已添加的顶层结果的数目等于创建 AuditCategory 时声明的值时自动结束。

createURL

FormattedValue AuditResults.createURL(string href, string displayText)

在审计面板中将指定值显示为 URL。

参数
string href

所得链接的目标指向的 URL。

string (可选)
displayText

显示给用户的字符串。

createSnippet

FormattedValue AuditResults.createSnippet(string text)

在审计面板中将提供的文本显示为代码片段。

参数
string text

片段文本。

AuditResultNode

出现在审计结果树中的节点,可以显示内容,并且可以有可选的子节点。
属性
boolean expanded

如果为 true,子树将总是展开。

方法

addChild

AuditResultNode AuditResultNode.addChild(string or FormattedValue content)

向这一节点添加子节点。

参数
string or FormattedValue content

从 Chrome 26 开始支持。

字符串或者由审计结果格式化(URL、代码片段等等)函数返回的经过格式化的值。如果传递了多个参数,它们将会拼接成单个节点。

AuditResultSeverity

这一类型包含结果严重性的所有可能值,不同严重性的结果通过结果显示名称旁边的彩色符号区分。
属性
string Info
string Warning
string Severe

方法

addCategory

AuditCategory chrome.experimental.devtools.audits.addCategory(string displayName, double resultCount)

添加审计类别。

参数
string displayName

这一类别的显示名称。

double resultCount

这一类别预期的审计结果数目。

示例扩展程序

  • Broken Links – Extends the Developer Tools, adding an audit category that finds broken links on the inspected page.