如何在 Visual Studio Code (VSCode) 中调试 Cucumber - Protractor？答案

【问题标题】：How to debug Cucumber - Protractor in Visual Studio Code (VSCode)?如何在 Visual Studio Code (VSCode) 中调试 Cucumber - Protractor？
【发布时间】：2019-12-08 00:00:03
【问题描述】：

我正在尝试在 Visual Studio Code 中调试 Gherkin Cucumber 场景，但出现以下错误：-

“zFunctionalTests\protractor_ui.conf.js”中的解析错误：(1:1)：预期：#EOF、#Language、#TagLine、#FeatureLine、#Comment、#Empty，得到 'var baseConfig =要求('./protractor_base.conf.js');'

我已经创建了以下配置：

launch.json

{
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Launch Program",
            "skipFiles": [
                "<node_internals>/**"
            ],
            "console": "integratedTerminal",
            "cwd": "${workspaceRoot}",
            "program": "${workspaceRoot}\\node_modules\\cucumber\\bin\\cucumber-js",
            "protocol": "inspector",
            "args": [
                "${workspaceRoot}\\zFunctionalTests\\protractor_ui.conf.js",
            ],
            "outFiles": [
                "${workspaceRoot}/FunctionalTests/features/*.feature"
            ]
        }
    ]
}

protractor_ui.conf.js

var baseConfig = require('./protractor_base.conf.js');
var localConfig = baseConfig.config;

localConfig.capabilities = {
    'browserName': 'chrome',
    chromeOptions: {
        args: [
            '--start-maximized',
            '--no-sandbox',
        ]
    }
}

exports.config = localConfig;

protractor_base.conf.js


exports.config = {
  allScriptsTimeout: 15000,
  directConnect: true,
  baseUrl: "http://localhost:3000/",
  specs: ["./features/*.feature"],
  framework: "custom",
  frameworkPath: require.resolve("protractor-cucumber-framework"),
  cucumberOpts: {
    require: ["./steps/*.ts"],
    strict: true,
    dryRun: false,
    tags: true,
    profile: false,
    "no-source": true,
    tags: ["~@ignore"],
    compiler: []
  },
  capabilities: {},
  maxSessions: 1,
  multiCapabilities: {},
  allScriptsTimeout: 15000,
  getPageTimeout: 15000,
  onPrepare() {
    require("ts-node").register({
      project: "zFunctionalTests/tsconfig.e2e.json"
    });
    require("dotenv").config();
  }
};

我已经尝试了以下帖子中描述的方法，但它不起作用。

How to debug Cucumber in Visual Studio Code (VSCode)?

这可能是由于在执行时它没有选择提到目标 es5 的 tsconfig。

任何帮助将不胜感激。

【问题讨论】：

标签： debugging visual-studio-code protractor cucumber angular-e2e

【解决方案1】：

使用 node.js 环境创建 launch.json
复制粘贴以下代码

{
"version": "0.2.0",
"configurations": [
{
"name": "ng e2e",
"type": "node",
"request": "launch",
"cwd": "${workspaceRoot}",
"program": "${workspaceFolder}/node_modules/protractor/bin/protractor",
"protocol": "inspector",
"args": ["${workspaceFolder}/zFunctionalTests/protractor_single.conf.js"]
}]}

现在，转到步骤文件并添加要调试的断点。然后在 vs 代码菜单中点击调试图标并开始调试

注意：工作区文件夹是您的 .vscode 文件夹因此，此处提到的路径是基于您的文件夹结构的假设。它可能与实际路径不同。

【讨论】：

【解决方案2】：

您是否将类型替换为：

"types": ["chai", "cucumber", "node"]

在 tsconfig.json 文件中？

【讨论】：