Các điểm ngắt Mocha bằng Visual Studio Code

Có thể thêm các điểm ngắt vào những bài kiểm tra Mocha bằng Visual Studio Code không?

Thông thường khi gỡ lỗi mã người ta cần phải cấu hình khởi chạy.json, đặt thuộc tính chương trình thành tệp javascript để thực thi. Tôi không chắc làm thế nào để làm điều này cho Mocha.

Bạn có biết rằng bạn chỉ cần vào cấu hình khởi chạy của mình, đặt con trỏ vào sau hoặc giữa các cấu hình khác và nhấn ctrl- spaceđể nhận cấu hình mocha hợp lệ, hiện tại được tạo tự động?

Điều đó hoàn toàn tốt cho tôi. Kể cả việc dừng ở các điểm ngắt. (Tôi cũng có một cái trước đây, giờ đã lỗi thời, không còn nữa vì nhiều lý do liên quan đến cài đặt.)

Kể từ VSCode 1.21.1 (tháng 3 năm 2018), điều này mang lại:

{
  "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
    }
}

Lưu ý bên lề: debug-brk được mô tả (đối với bất kỳ ai có Node> = Ít nhất là phiên bản 8).

Nếu bạn không muốn sử dụng --debug-brk+ Đính kèm hoặc nêu một đường dẫn tuyệt đối đến cài đặt mocha toàn cầu của bạn (điều này sẽ bị phanh nếu bạn giữ launcher.json của mình dưới sự kiểm soát của phiên bản và có nhiều nhà phát triển trên các máy khác nhau), hãy cài đặt mocha như một phụ thuộc của nhà phát triển và thêm cái này vào launcher.json của bạn:

{
  "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"
  }
}

Hỗ trợ gỡ lỗi đầy đủ trong các bài kiểm tra của bạn chỉ bằng cách nhấn F5.

--no-timeoutsđảm bảo các bài kiểm tra của bạn không hết thời gian vì bạn đã dừng lại ở điểm ngắt và --colorsđảm bảo Mocha xuất ra màu sắc mặc dù nó không phát hiện ra rằng VS Code hỗ trợ màu sắc.

Một cách khác là sử dụng --debug-brktùy chọn dòng lệnh của mocha và Attachcài đặt khởi chạy mặc định của trình gỡ lỗi Visual Studio Code.

Đề xuất giải thích sâu hơn (từ André)

Để làm điều này:

Chạy mocha từ dòng lệnh bằng lệnh này:

mocha --debug-brk

Bây giờ trong VS Code, hãy nhấp vào biểu tượng Gỡ lỗi, sau đó chọn Attachtừ tùy chọn bên cạnh nút bắt đầu. Thêm các điểm ngắt trong Mã VS và sau đó nhấp vào bắt đầu.

Tôi đã thực hiện công việc này trên VSCode trên OS X 10.10. Chỉ cần thay thế ./settings/launch.jsontệp của bạn bằng tệp này.

{
    "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"}
        }
    ]
}

Nó cũng có sẵn như một ý chính ở đây .

Các giá trị chính bạn cần thay đổi là giá trị programnày phải được đặt thành _mochatệp thực thi và argsphải là một mảng các tệp thử nghiệm của bạn.

Cách tôi làm cho nó hoạt động trên VS Code (1.8.2) trên Mac OS X là:

{
    "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 cần được cài đặt trong thư mục mô-đun npm.

1. Đi tới Debug > Add Configuration...menu
2. Chọn Node.jsmôi trường
3. Chọn Mocha Teststùy chọn từ danh sách thả xuống xuất hiện
4. Nhập đường dẫn của tệp thử nghiệm của bạn làm mục cuối cùng của thuộc argstính
5. Thêm một breakpoint
6. Nhấp vào Debugbiểu tượng
7. Chọn Mocha Testslàm cấu hình
8. Nhấn Start debuggingnút
9. :-)

Tôi đã tìm ra một cách để làm điều này mà tôi phân loại là một giải pháp . Tôi hy vọng nhóm Visual Studio Code sẽ cung cấp một giải pháp dứt khoát hơn cho vấn đề này nhưng trong khi đó tôi đã làm được điều này:

1. Tôi đã tạo một ./settings/mocha.jstệp chạy mocha theo chương trình truyền các đối số dưới dạng danh sách các tệp sẽ chạy. Bạn có thể xem toàn bộ tập tin tại đây ;

2. Tôi đã tạo một cấu hình khởi chạy sẽ chạy ./settings/mocha.jsnhư sau programvà chuyển các tệp / mẫu tệp mà chúng tôi cần kiểm tra làm đối số:

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

   Ví dụ đầy đủ về launcher.json

Vì vậy, điều này tương đương với việc làm mocha test/unit/*.js test/unit/**/*.jsvà bây giờ chúng ta có thể sử dụng các điểm ngắt trong các bài kiểm tra mocha của mình.

Nếu bạn thêm biến $ {file} vào cuối danh sách args, bạn có thể bắt đầu gỡ lỗi trực tiếp từ tệp bạn đã mở:

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

Xin lỗi vì đã thêm câu trả lời khác, nhưng không có câu trả lời nào trước đó phù hợp với tôi kể từ VS Code 1.8.1 và trình gỡ lỗi Node tiêu chuẩn được bao gồm trong đó. Đây là cách tôi đã giải quyết nó (với hướng dẫn từ các câu trả lời trước ở đây và từ tài liệu gỡ lỗi VS Code Node.js chính thức ) để gỡ lỗi bằng một cú nhấp chuột / nhấn phím:

• Đảm bảo mocha được cài đặt devDependencytrong packages.json:"devDependencies": { "mocha": "^3.2", ... }
• Chạy npm installtrong thư mục của bạn package.jsonđể đảm bảo rằng mocha hiện đã được cài đặt trongnode_modules/
• Mở .vscode/launch.json(hoặc trong Mã VS, nhấn F1, bắt đầu nhập "khởi chạy" và chọn "Gỡ lỗi: Mở khởi chạy.json")
• Nhấp vào nút "Thêm cấu hình" màu xanh lam ở dưới cùng bên phải (hoặc chỉ sao chép và dán một trong những người khác của bạn); bước này là tùy chọn ... Ý tôi là, bạn có thể sử dụng lại cấu hình hiện có. Nhưng tôi đề nghị thêm một cái để đỡ nhầm lẫn.
• Thay đổi phần sau trong của bạn launch.json, sau đó chọn tên cấu hình mới trong cửa sổ gỡ lỗi trong VS Code và nhấp vào mũi tên màu xanh lục để bắt đầu gỡ lỗi các bài kiểm tra nút + mocha của bạn!

Trong cấu hình mới trong 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
}, ...]

Điều này giả định rằng mẫu test/**/*.jssẽ hoạt động cho nơi bạn đặt các bài kiểm tra của mình. Thay đổi khi thích hợp.

Hãy thoải mái thay đổi cổng miễn là bạn thay đổi nó trong cả hai thuộc tính argsvà portthuộc tính để phù hợp.

Sự khác biệt chính đối với tôi là đảm bảo mocha ở trong node_modules, sử dụng programđể trỏ đến tệp thực thi và argscần debug-brk=xtrỏ đến cổng được chỉ định trong port. Phần còn lại ở trên chỉ làm cho mọi thứ đẹp hơn và dễ dàng hơn.

Bạn và nhóm của bạn có đưa .vscode/launch.jsonvào kho lưu trữ hay không. Đó là một tệp chỉ dành cho IDE, nhưng toàn bộ nhóm của bạn có thể sử dụng nó như thế này, không có vấn đề gì, vì tất cả các đường dẫn và cài đặt là tương đối và rõ ràng.

Mẹo: Có package.jsonthể bao gồm một scriptsthẻ cũng khởi chạy mocha với một cái gì đó giống như "test": "./node_modules/.bin/mocha", nhưng nó không được VS Code sử dụng — thay vào đó nó được sử dụng khi npm testđược chạy ở dòng lệnh. Cái này làm tôi bối rối một chút. Lưu ý nó ở đây trong trường hợp những người khác cũng nhầm lẫn.

CHỈNH SỬA: VS Code 1.9.0 đã thêm tùy chọn "Thêm cấu hình" trong trình đơn thả xuống cấu hình gỡ lỗi và bạn có thể chọn "Node.js Mocha Tests" giúp đơn giản hóa hầu hết các thao tác trên. Bạn vẫn cần đảm bảo mocha có trong của bạn node_modulesvà có thể phải cập nhật cwdvà cuối cùng runtimeArgs(là mẫu để tìm kiếm các bài kiểm tra của bạn) để chỉ đến các đường dẫn thích hợp. Nhưng một khi bạn đặt hai thuộc tính đó, nó sẽ hoạt động khá nhiều từ đó.

trong launcher.json, hãy thêm 1 cấu hình khác bên dưới

{
      "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"
    },

nếu bạn cần định cấu hình phiên bản nút, chỉ cần thêm runtimeExecutabletrường như thế này

{
      "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"
    },

Đối với bất kỳ ai sử dụng Windows. Nếu bạn đã cài đặt mocha trên toàn cầu thì việc cài đặt chương trình theo đường dẫn sau sẽ phù hợp với tôi (hoán đổi tên người dùng của bạn).

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

Điều này đang hoạt động với tôi trên máy Windows 7. Tôi đã cài đặt mocha trên toàn cầu, nhưng cấu hình này chỉ đến cài đặt dự án để tránh cần đường dẫn hồ sơ người dùng (btw, tôi đã thử sử dụng biến% USERPROFILE% nhưng không thành công). Bây giờ tôi có thể đặt các điểm ngắt trong các bài kiểm tra mocha của mình. Yay!

{
        "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"
    }

Đối với những người đang sử dụng grunt hoặc gulp, cấu hình khá đơn giản.

Launch.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');};

Trong phiên bản VSCode 1.13.0 (macOS), họ đã tích hợp sẵn nó trong các cấu hình -> Mocha Tests.

Khi sử dụng Babel hoặc tạo các tệp javascript chưa đặt các điểm ngắt trong nguồn - bạn phải đảm bảo bật sourceMapsvà xác định outFiles. Đây là một cấu hình ví dụ phù hợp với tôi.

    {
        "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,
    },

Lưu ý - bạn sẽ cần sửa đổi outFilesđể bao gồm mọi thứ bạn có thể muốn thêm điểm ngắt vào. Điều này có thể tẻ nhạt hơn khi trong một monorepo và nhiều dự án phụ thuộc.

1) Đi tới

.vscode

sau đó

Launcher.json

tập tin

2) Thêm cấu hình sau vào launcher.json -

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Mocha Test",
            "cwd": "${workspaceRoot}",
            "runtimeExecutable": "${workspaceRoot}/*folder_path_containing_test*/node_modules/.bin/mocha",
            "windows": {
                "runtimeExecutable": "${workspaceRoot}/*folder_path_containing_test*/node_modules/.bin/mocha.cmd"
            },
            "runtimeArgs": [
                "--colors",
                "--recursive",
                "${workspaceRoot}/*folder_path_till_test*/tests"
            ],
            "internalConsoleOptions": "openOnSessionStart"
        },
        {
            "type": "node",
            "request": "launch",
            "name": "Launch Program",
            "program": "${workspaceRoot}/*folder_path_to_test*/app.js"
        }
    ]
}

3) Đặt các điểm ngắt trong tệp thử nghiệm và sau đó nhấn F5

Khi sử dụng TypeScript, cấu hình sau phù hợp với tôi trong 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"
    ]
}

Những điều quan trọng cần lưu ý ở đây là bản đồ nguồn được tạo và thư mục đầu ra cho js được đặt thành 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"
    }

Xin lưu ý rằng điều đó sourceMapsđược đặt thành truevà outDirđặt thànhbuild

tìm lỗi

1. Dính các điểm ngắt trong index.tsbất kỳ tệp typecript đã nhập nào khác
2. Mở một thiết bị đầu cuối và chạy: mocha --debug-brk ./build/test/appTests.js
3. Từ VSC, chạy cấu hình khởi chạy 'Đính kèm'

Đây là một ví dụ về cấu hình khởi chạy (khởi chạy.json) từ Microsoft, hoạt động với Mocha và cho phép sử dụng trình gỡ lỗi.

Ngoài ra, có một mô tả về cách sử dụng tùy chọn --debug-brk.

Cuối cùng, đây là một phiên bản thay thế của cách gỡ lỗi mã với các bài kiểm tra Mocha bằng cách sử dụng tệp task.json của VS Code và Gulp task runner.

Nếu bạn có một số phụ thuộc trong bài kiểm tra, bạn cũng có thể dễ dàng đính kèm nó.

Ví dụ: tôi đang sử dụng mongo-unit-helperđể cũng có các bài kiểm tra đơn vị được tích hợp với Cơ sở dữ liệu.

package.json script là: mocha --recursive --require ./test/mongo-unit-helper.js --exit"

Của tôi launch.jsontrông giống như:

  "configurations": [
  {
  "type": "node",
  "request": "launch",
  "name": "Mocha Tests",
  "program": "${workspaceFolder}/node_modules/mocha/bin/_mocha",
  "args": [
    "-u",
    "tdd",
    "--timeout",
    "999999",
    "--colors",
    "--recursive",
    "--require",
    "${workspaceFolder}/test/mongo-unit-helper.js",
    "${workspaceFolder}/test/**/*.js",
  ],
  "internalConsoleOptions": "openOnSessionStart"
 }
]

Giải pháp là đưa --requireriêng argsvào launch.json.

Giải pháp đơn giản nhất

Thêm mã sau vào launcher.json bên trong thư mục .vscode:

{
            "name": "Unit tests",
            "type": "node",
            "request": "launch",
            "program": "${workspaceRoot}/node_modules/mocha/bin/_mocha",
            "args": [
            ],
        }

Tuy nhiên, bạn có thể muốn thêm đối số thời gian chờ:

 {
            "name": "Unit tests",
            "type": "node",
            "request": "launch",
            "program": "${workspaceRoot}/node_modules/mocha/bin/_mocha",
            "args": [
                "--timeout",
                "999999"
            ],
        }