WebdriverIO - 调试代码


要在 Visual Studio Code 编辑器中调试 WebdriverIO 代码,我们必须启用 JavaScript 调试器的夜间版本。调试是识别代码错误根本原因的最重要步骤之一。

它还有助于理解程序流程。

启用调试

下面列出了启用调试的步骤 -

步骤 1 - 如果您使用 Windows 或 Linux 操作系统,请导航至以下链接 -

https://marketplace.visualstudio.com/items?itemName=ms-vscode.js-debug-nightly

步骤 2 - 单击“安装”。您的计算机上将出现以下屏幕 -

启用调试

如果我们使用的是Mac操作系统,我们可以跳过步骤1和2。

步骤 3 - 在项目中创建一个名为 .vscode 的文件夹。然后在此文件夹中创建文件 launch.json。您的计算机上将出现以下屏幕 -

文件 Launch.json

步骤 4 - 在 launch.json 文件中添加以下代码。

{
   "configurations": [
      {
         "name": "Webdriver IO",
         "type": "node",
         "request": "launch",
         "args": ["wdio.conf.js", "--spec", "${file}"],
         "cwd": "${workspaceFolder}",
         "autoAttachChildProcesses": true,
         "program": "${workspaceRoot}/node_modules/@wdio/cli/bin/wdio.js",
         "console": "integratedTerminal",
         "skipFiles": [
            "${workspaceFolder}/node_modules/**/*.js",
            "${workspaceFolder}/lib/**/*.js",
            "<node_internals>/**/*.js"
         ]
      },
   ]
}

步骤 5 - 在规范文件中添加断点。您的计算机上将出现以下屏幕 -

断点

步骤 6 - 转到“运行”菜单并选择“开始调试”选项。您的计算机上将出现以下屏幕 -

开始调试

步骤 7 - 应在调试器模式下触发执行,底部有橙色带。调试器附加消息应反映在终端控制台中。此外,执行应在断点处停止。我们必须再次手动恢复它。

您的计算机上将出现以下屏幕 -

调试器模式