性能测试示例：检查器中点击事件的性能

让我们看一个简单但实用的例子，并添加一个简单的测试来衡量检查器中点击的性能。

首先，我们在 tests/inspector 下创建一个文件，因为我们正在编写一个检查器测试。我们称该文件为 click.js。

我们将在这里使用一个虚拟测试文档： data:text/html,click test document。

我们准备编写测试所需的导入，来自 head.js 和 inspector-helper.js

• testSetup、testTeardown、openToolbox 和 runTest 来自 head.js

• reloadInspectorAndLog 来自 inspector-helper.js

测试的完整代码如下所示

const {
  reloadInspectorAndLog,
} = require("devtools/docs/tests/inspector-helpers");

const {
  openToolbox,
  runTest,
  testSetup,
  testTeardown,
} = require("devtools/docs/head");

module.exports = async function() {
  // Define here your custom document via a data URI:
  const url = "data:text/html,click test document";

  await testSetup(url);
  const toolbox = await openToolbox("inspector");

  const inspector = toolbox.getPanel("inspector");
  const window = inspector.panelWin; // Get inspector's panel window object
  const body = window.document.body;

  await new Promise(resolve => {
    const test = runTest("inspector.click");
    body.addEventListener("click", function () {
      test.done();
      resolve();
    }, { once: true });
    body.click();
  });

  // Check if the inspector reload is impacted by click
  await reloadInspectorAndLog("click", toolbox);

  await testTeardown();
}

最后，我们在 damp-tests.js 中添加一个条目

  {
    name: "inspector.click",
    path: "inspector/click.js",
    description:
      "Measure the time to click in the inspector, and reload the inspector",
  },

由于这是一个检查器测试，因此我们在 TEST_SUITES.INSPECTOR 下添加它，其中包含所有将在持续集成中使用 damp-inspector 测试套件运行的测试。该测试默认仍然是整体 damp 套件的一部分，无需任何操作即可确保这一点。

然后我们可以使用以下命令运行我们的测试：

./mach talos-test --suite damp --subtest inspector.click