Точки останова Mocha с помощью кода Visual Studio


можно ли добавить точки останова к тестам Mocha с помощью кода Visual Studio?

обычно при отладке кода нужно настроить запуск.json, Установка атрибута программы в файл javascript для выполнения. Я не уверен, как это сделать для Мокко, хотя.

17 61

17 ответов:

знаете ли вы, что вы просто заходите в свою конфигурацию запуска, помещаете курсор после или между другими конфигурациями и нажимаете ctrl -пробел чтобы получить текущий, действительный Mocha config автоматически генерируется?

который отлично работает для меня. В том числе остановка в точках останова. ( У меня также был предыдущий, теперь устаревший, который больше не работал по различным причинам, связанным с настройкой. )

enter image description here

по состоянию на VSCode 1.21.1 (март 2018) это дает:

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Mocha (Test single file)",
      "type": "node",
      "request": "launch",
      "runtimeArgs": [
        "${workspaceRoot}/node_modules/.bin/mocha",
        "--inspect-brk",
        "${relativeFile}",
      ],
      "console": "integratedTerminal",
      "internalConsoleOptions": "neverOpen",
      "port": 9229
    }
}

на стороне записки: debug-brkявляется устаревшим (для любого с узлом >= версия 8 по крайней мере).

если вы не хотите использовать --debug-brk+прикрепите или укажите абсолютный путь к вашей глобальной установке mocha (которая будет тормозить, если вы сохраните свой запуск.json под управлением версий и имеет несколько разработчиков на разных машинах), установите mocha в качестве зависимости от разработчика и добавьте это в свой запуск.json:

{
  "name": "mocha",
  "type": "node",
  "request": "launch",
  "program": "${workspaceRoot}/node_modules/mocha/bin/_mocha",
  "stopOnEntry": false,
  "args": ["--no-timeouts", "--colors"], //you can specify paths to specific tests here
  "cwd": "${workspaceRoot}",
  "runtimeExecutable": null,
  "env": {
    "NODE_ENV": "testing"
  }
}

полная поддержка отладки в ваших тестах, просто нажав F5.

--no-timeouts убедитесь, что ваши тесты не тайм-аут, потому что вы остановились в точке останова, и --colors убедитесь, что Mocha выводит цвета, даже если он не обнаруживает, что VS-код поддерживает цвета.

другой способ-использовать --debug-brk опция командной строки мокко и по умолчанию Attach запуск настройки отладчика кода Visual Studio.


предложил более глубокое объяснение (от Андре)

для этого:

запустите mocha из командной строки с помощью этой команды:

mocha --debug-brk

теперь в VS Code нажмите на значок отладки, затем выберите Attach опции рядом с кнопкой Пуск. Добавьте точки останова в VS-код и нажмите кнопку начать.

Я сделал эту работу на VSCode на OS X 10.10. Просто замените ваш С этим.

{
    "version": "0.1.0",
    "configurations": [
        {
            "name": "Run app.js",
            "type": "node",
            "program": "app.js", // Assuming this is your main app file.
            "stopOnEntry": false,
            "args": [],
            "cwd": ".",
            "runtimeExecutable": null,
            "env": { "NODE_ENV": "production"}
        },
        {
            "name": "Run mocha",
            "type": "node",
            "program": "/Users/myname/myfolder/node_modules/mocha/bin/_mocha",
            "stopOnEntry": false,
            "args": ["test/unit.js"],
            "cwd": ".",
            "runtimeExecutable": null,
            "env": { "NODE_ENV": "production"}
        }
    ]
}

Он также доступен как gist здесь.

Ключевые значения, которые необходимо изменить program, который должен быть установлен на _mocha исполняемый файл, и args, который должен быть массивом ваших тестовых файлов.

способ, которым я получил его для работы над VS Code (1.8.2) на Mac OS X:

{
    "name": "Mocha",
    "type": "node",
    "request": "launch",
    "program": "${workspaceRoot}/node_modules/mocha/bin/_mocha",
    "stopOnEntry": false,
    "args": ["--recursive"], //you can specify paths to specific tests here
    "cwd": "${workspaceRoot}",
    "runtimeExecutable": null,
    "env": {
        "NODE_ENV": "testing"
    }
}

Mocha должен быть установлен в каталоге модулей npm.

я нашел способ сделать это, который я классифицирую как решение. Я ожидаю, что команда Visual Studio Code предоставит более окончательное решение для этого, но пока это то, что я сделал:

  1. я создал ./settings/mocha.js файл, который запускает mocha программно передавая аргументы в виде списка файлов для запуска. Вы можете увидеть полный файл здесь;
  2. Я создал конфигурацию запуска, которая будет запускать ./settings/mocha.js как program и передает файлы / шаблоны файлов, которые нам нужно проверить в качестве аргументов:

    {
        "name": "Unit tests",
        "type": "node",
        "program": ".settings/mocha.js",
        "stopOnEntry": true,
        "args": ["test/unit/*.js", "test/unit/**/*.js"],
        "cwd": ".",
        "runtimeExecutable": null,
        "env": { }
    }
    

    полный запуск.пример json

так что это эквивалентно делать mocha test/unit/*.js test/unit/**/*.js и теперь мы можем использовать точки останова в наших тестах мокко.

в начало.json, добавьте еще 1 конфигурацию ниже

{
      "type": "node",
      "request": "launch",
      "name": "Mocha Tests",
      "program": "${workspaceRoot}/node_modules/mocha/bin/_mocha",
      "args": [
        "--timeout",
        "10000",
        "${workspaceRoot}/services/*.spec.js",
        "${workspaceRoot}/*.spec.js"
      ],
      "internalConsoleOptions": "openOnSessionStart"
    },

Если вам нужно настроить версию узла, просто добавьте runtimeExecutable поле вот так

{
      "type": "node",
      "request": "launch",
      "name": "Mocha Tests",
      "program": "${workspaceRoot}/node_modules/mocha/bin/_mocha",
      "args": [
        "--timeout",
        "10000",
        "${workspaceRoot}/services/*.spec.js",
        "${workspaceRoot}/*.spec.js"
      ],
      "internalConsoleOptions": "openOnSessionStart",
      "runtimeExecutable": "${env:HOME}/.nvm/versions/node/v8.2.1/bin/node"
    },
  1. на Debug > Add Configuration... меню
  2. выберите Node.js среда
  3. выберите Mocha Tests параметр, из выпадающего списка
  4. введите путь к тестовому файлу в качестве последнего элемента args свойства
  5. добавить breakpoint
  6. нажать на кнопку Debug значок
  7. выберите Mocha Tests конфигурации
  8. пресс
  9. : -)

для всех, кто использует Windows. Если вы установили mocha глобально, то установка программы на следующий путь работала для меня (обмен в вашем имени пользователя).

"program": "C:\Users\myname\AppData\Roaming\npm\node_modules\mocha\bin\_mocha"

извините за добавление еще одного ответа, но ни один из предыдущих не работал для меня с VS Code 1.8.1 и стандартным отладчиком узлов, включенным в него. Вот как я решил это (с руководством из предыдущих ответов здесь и от официального VS код узла.отладка JS в docs) так что есть один клик/нажатие клавиши отладки:

  • убедитесь, что мокко установлен как devDependency in packages.json:"devDependencies": { "mocha": "^3.2", ... }
  • выполнить npm install в каталоге ваш package.json чтобы убедиться, что мокко теперь установлен в node_modules/
  • открыть .vscode/launch.json (или в VS-коде нажмите F1, начните вводить " запуск "и выберите" отладка: открыть запуск.json")
  • нажмите на синюю кнопку "Добавить настройки" в правом нижнем углу (или просто скопируйте и вставьте один из ваших других); этот шаг является необязательным... Я имею в виду, вы можете повторно использовать существующую конфигурацию. Но я предлагаю добавить один, чтобы он был менее запутанным.
  • измените следующее в вашем launch.json, а затем выбрать новое имя конфигурации в окне отладки в VS-коде и нажмите зеленую стрелку, чтобы начать отладку тестов node + mocha!

в новой конфигурации в launch.json:

"configurations": [{
    "name": "whatever name you want to show in the VS Code debug list",
    "type": "node",
    "cwd": "${workspaceRoot}",
    "program": "${workspaceRoot}/node_modules/mocha/bin/mocha",
    "args": ["--debug-brk=5858", "--no-timeouts", "--colors", "test/**/*.js"],
    "address": "localhost",
    "port": 5858,
    // the other default properties that are created for you are fine as-is
}, ...]

это предполагает шаблона test/**/*.js будет работать там, где вы ставите свои тесты. Измените по мере необходимости.

не стесняйтесь менять порт, пока вы меняете его в обоих args и port свойства, чтобы соответствовать.

ключевые различия для меня были уверены мокко был в node_modules, используя program указать на исполняемый файл, и args необходимости debug-brk=x указывая на порт, указанный в port. Все остальное просто делает вещи красивее и проще.

это зависит от вас и вашей команды, если вы ставите .vscode/launch.json в репозитории или нет. Это файл только для IDE, но вся ваша команда может использовать его так, без проблем, поскольку все пути и установки являются относительными и явными.

Совет: The package.json может включать в себя scripts тег, который также запускает мокко с чем-то вроде "test": "./node_modules/.bin/mocha", но он не используется VS Code-вместо этого он используется, когда npm test выполняется в командной строке. Это меня немного смутило. Отмечая это здесь, если другие тоже запутаются.

EDIT: VS Code 1.9.0 добавил опцию " Добавить конфигурацию "в раскрывающемся списке конфигурация отладки, и Вы можете выбрать" узел.тесты JS Mocha", которые помогают упростить большинство из вышеперечисленных. Вам все еще нужно убедиться, что мокко находится в вашем node_modules и, возможно, чтобы обновить cwd и последний runtimeArgs (который является шаблоном для поиска ваших тестов), чтобы указать на соответствующие пути. Но как только вы установите эти два свойства, он должен очень много работать оттуда.

это работает для меня на машине Windows 7. У меня есть mocha, установленный глобально, но эта конфигурация указывает на установку проекта, чтобы избежать необходимости в пути профиля пользователя (который, кстати, я пробовал использовать переменную %USERPROFILE% без успеха). Теперь я могу установить точки останова в своих тестах мокко. Ура!

{
        "name": "Mocha Tests",
        "type": "node",
        "request": "launch",
        "stopOnEntry": false,
        "program": "${workspaceRoot}/node_modules/mocha/bin/_mocha",
        "cwd": "${workspaceRoot}",
        "args": ["./test/**/*.js"],
        "runtimeExecutable": null,
        "envFile": "${workspaceRoot}/.env"
    }

для тех, кто использует grunt или gulp, конфигурация довольно проста.

запуск.json

{
"version": "0.2.0",
"configurations": [

    {
        "name": "Run mocha by grunt",
        "type": "node",
        "program": "${workspaceRoot}/node_modules/grunt/bin/grunt",
        "stopOnEntry": false,
        "args": ["mochaTest"],
        "cwd": "${workspaceRoot}",
        "runtimeExecutable": null
    }
]}

Gruntfile.js

module.exports = function (grunt) {

grunt.initConfig({
    mochaTest: {
        test: {
            options: {
                reporter: 'spec'
            },
            src: ['test/**/*test.js']
        }
    }
});

grunt.loadNpmTasks('grunt-mocha-test');

grunt.registerTask('default', 'mochaTest');};

в VSCode версии 1.13.0 (macOS), они имеют его встроенный в конфигурациях ->Mocha Tests.

Если вы добавляете переменную ${file} в конце списка args, вы можете начать отладку непосредственно из открытого файла:

        {
            "type": "node",
            "request": "launch",
            "name": "Mocha Tests",
            "program": "${workspaceFolder}/node_modules/mocha/bin/_mocha",
            "args": [
                "-u",
                "tdd",
                "--timeout",
                "999999",
                "--colors",
                "${file}"
            ],
            "internalConsoleOptions": "openOnSessionStart"
        }

при использовании TypeScript, следующая конфигурация работает для меня в Visual Studio Code 0.8.0 (tsc 1.5.3)

tsconfig.json

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es5",
        "noImplicitAny": false,
        "removeComments": true,
        "preserveConstEnums": true,
        "sourceMap": true,
        "outDir": "build",
        "declaration": false
    },
    "files": [
        "./src/index.ts",
        "./src/test/appTests.ts"
    ]
}

важно отметить, что исходные карты генерируются и что выходной каталог для js установлен в build

launch.json

    {
        "name": "Attach",
        "type": "node",
        // TCP/IP address. Default is "localhost".
        "address": "localhost",
        // Port to attach to.
        "port": 5858,
        "sourceMaps": true,
        "outDir": "build"
    }

обратите внимание:sourceMaps установлено значение true и outDir установлено значение build

to отладка

  1. Stick точки останова в index.ts любой другой импортированный файл typescript
  2. откройте терминал и запустите : mocha --debug-brk ./build/test/appTests.js
  3. из VSC запустите конфигурацию запуска' Attach'

вот пример конфигурация запуска (старта.json) от Microsoft, которая работает с Mocha и позволяет использовать отладчик.

кроме того, есть описание Как использовать параметр --debug-brk.

наконец, вот это альтернативная версия того, как отлаживать код с помощью тестов Мокко через задач.json-файл VS-кода и Gulp Task runner.

при использовании Babel или создании файлов javascript, но размещении точек останова в источнике - вы должны обязательно включить sourceMaps и определить outFiles. Вот пример конфигурации, которая работала для меня.

    {
        "name": "Mocha Test",
        "type": "node",
        "request": "launch",
        "program": "${workspaceRoot}/packages/api/node_modules/mocha/bin/_mocha",
        "cwd": "${workspaceRoot}/packages/api",
        "args": ["--colors", "--no-timeouts", "out/test"],
        "outFiles": ["${workspaceRoot}/packages/api/out/*"],
        "sourceMaps": true,
    },

Примечание - вам нужно изменить outFiles чтобы включить все, что вы можете добавить точку останова. Это может быть более утомительным, когда в монорепо и нескольких зависимых проектов.