Titik henti Mocha menggunakan Visual Studio Code

Apakah mungkin untuk menambahkan breakpoint ke tes Mocha menggunakan Visual Studio Code?

Biasanya ketika men-debug kode seseorang perlu mengkonfigurasi launch.json, mengatur atribut program ke file javascript untuk dieksekusi. Saya tidak yakin bagaimana melakukan ini untuk Mocha.

Tahukah Anda, bahwa Anda baru saja masuk ke konfigurasi peluncuran Anda, meletakkan kursor Anda setelah atau di antara konfigurasi Anda yang lain dan tekan ctrl- spaceuntuk mendapatkan konfigurasi moka saat ini yang valid dibuat secara otomatis?

Yang bekerja dengan baik untuk saya. Termasuk berhenti di breakpoint. (Saya juga memiliki yang sebelumnya, sekarang sudah usang, yang tidak lagi karena berbagai alasan terkait pengaturan.)

Pada VSCode 1.21.1 (Maret 2018) ini menghasilkan:

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

Di samping catatan: debug-brk tidak dikoreksi (untuk siapa pun dengan Node> = setidaknya Versi 8).

Jika Anda tidak ingin menggunakan --debug-brk+ Lampirkan atau nyatakan jalur absolut ke instalasi mocha global Anda (yang akan rusak jika Anda tetap menjalankan launch.json di bawah kontrol versi dan memiliki beberapa pengembang di mesin yang berbeda), instal mocha sebagai ketergantungan dev dan tambahkan ini ke launch.json Anda:

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

Dukungan debugging penuh dalam pengujian Anda hanya dengan menekan F5.

--no-timeoutsmemastikan pengujian Anda tidak memiliki waktu habis karena Anda berhenti di breakpoint, dan --colorsmemastikan Mocha mengeluarkan warna meskipun tidak mendeteksi bahwa VS Code mendukung warna.

Cara lain adalah dengan menggunakan --debug-brkopsi baris perintah mocha dan pengaturan Attachpeluncuran default dari debugger Visual Studio Code.

Penjelasan lebih dalam yang disarankan (dari André)

Untuk melakukan ini:

Jalankan mocha dari baris perintah menggunakan perintah ini:

mocha --debug-brk

Sekarang di VS Code, klik ikon Debug, lalu pilih Attachdari opsi di sebelah tombol start. Tambahkan breakpoints di VS Code dan kemudian klik start.

Saya telah membuat ini bekerja pada VSCode di OS X 10.10. Ganti saja ./settings/launch.jsonfile Anda dengan ini.

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

Ini juga tersedia sebagai intinya di sini .

Nilai kunci yang perlu Anda ubah adalah program, yang harus disetel ke _mochadapat dieksekusi, dan args, yang harus berupa larik file pengujian Anda.

Cara saya membuatnya berfungsi pada VS Code (1.8.2) di Mac OS X adalah:

{
    "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 perlu diinstal di direktori modul npm.

1. Masuk ke Debug > Add Configuration...menu
2. Pilih Node.jslingkungan
3. Pilih Mocha Testsopsi dari daftar drop-down yang muncul
4. Ketik jalur file pengujian Anda sebagai item terakhir dari argsproperti
5. Tambah sebuah breakpoint
6. Klik Debugikon
7. Pilih Mocha Testssebagai konfigurasi
8. Tekan Start debuggingtombol
9. :-)

Saya telah menemukan cara untuk melakukan ini yang saya klasifikasikan sebagai solusi . Saya berharap tim Visual Studio Code memberikan solusi yang lebih pasti untuk ini, tetapi sementara itu, inilah yang telah saya lakukan:

1. Saya telah membuat ./settings/mocha.jsfile yang menjalankan mocha secara terprogram melewati argumen sebagai daftar file yang akan dijalankan. Anda dapat melihat file lengkapnya di sini ;

2. Saya telah membuat konfigurasi peluncuran yang akan menjalankan ./settings/mocha.jssebagai programdan meneruskan pola file / file yang perlu kita uji sebagai argumen:

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

   Contoh launch.json lengkap

Jadi ini setara dengan melakukan mocha test/unit/*.js test/unit/**/*.jsdan sekarang kami dapat menggunakan breakpoint dalam pengujian mocha kami.

Jika Anda menambahkan variabel $ {file} di akhir daftar args, Anda dapat mulai men-debug langsung dari file yang telah Anda buka:

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

Maaf telah menambahkan jawaban lain, tetapi tidak ada jawaban sebelumnya yang cukup berhasil untuk saya pada VS Code 1.8.1 dan debugger Node standar termasuk di dalamnya. Berikut adalah cara saya menyelesaikannya (dengan panduan dari jawaban sebelumnya di sini dan dari dokumen resmi Debugging VS Code Node.js ) jadi ada satu klik / tekan tombol debugging:

• Pastikan mocha dipasang sebagai devDependencydi packages.json:"devDependencies": { "mocha": "^3.2", ... }
• Jalankan npm installdi direktori Anda package.jsonuntuk memastikan mocha sekarang terpasangnode_modules/
• Buka .vscode/launch.json(atau di VS Code, tekan F1, mulai ketik "launch", dan pilih "Debug: Open launch.json")
• Klik tombol biru "Tambahkan Konfigurasi" di kanan bawah (atau cukup salin dan tempel salah satu yang lain); langkah ini opsional ... Maksud saya, Anda dapat menggunakan kembali konfigurasi yang ada. Tapi saya sarankan menambahkan satu agar tidak terlalu membingungkan.
• Ubah perintah berikut di Anda launch.json, lalu pilih nama konfigurasi baru di jendela debug di VS Code dan klik panah hijau untuk mulai men-debug tes node + mocha Anda!

Di konfigurasi baru di 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
}, ...]

Ini mengasumsikan bahwa pola test/**/*.jsakan bekerja di tempat Anda melakukan pengujian. Ganti sesuai kebutuhan.

Jangan ragu untuk mengubah port selama Anda mengubahnya di kedua properti argsdan portagar cocok.

Perbedaan utama bagi saya adalah memastikan moka masuk node_modules, menggunakan programuntuk menunjuk ke yang dapat dieksekusi, dan argsperlu debug-brk=xmenunjuk ke port yang ditentukan di port. Sisa dari yang di atas hanya membuat segalanya lebih cantik dan mudah.

Terserah Anda dan tim apakah Anda taruh .vscode/launch.jsondi repositori atau tidak. Ini adalah file khusus IDE, tetapi seluruh tim Anda dapat menggunakannya seperti ini, tidak masalah, karena semua jalur dan pemasangan bersifat relatif dan eksplisit.

Tip: package.jsonDapat menyertakan scriptstag yang juga meluncurkan mocha dengan sesuatu seperti "test": "./node_modules/.bin/mocha", tetapi tidak digunakan oleh VS Code — melainkan digunakan ketika npm testdijalankan pada baris perintah. Yang ini membuatku sedikit bingung. Mencatatnya di sini kalau-kalau orang lain juga bingung.

EDIT: VS Code 1.9.0 telah menambahkan opsi "Add Configuration" di drop-down konfigurasi debug, dan Anda dapat memilih "Node.js Mocha Tests" yang membantu menyederhanakan sebagian besar hal di atas. Anda masih perlu memastikan mocha ada di Anda node_modulesdan mungkin harus memperbarui cwddan yang terakhir runtimeArgs(yang merupakan pola untuk menemukan pengujian Anda) untuk menunjuk ke jalur yang sesuai. Tapi begitu Anda menyetel kedua properti itu, seharusnya berfungsi cukup banyak dari sana.

di launch.json, tambahkan 1 konfigurasi lagi di bawah

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

jika Anda perlu mengkonfigurasi versi node, cukup tambahkan runtimeExecutablekolom seperti ini

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

Untuk siapa saja yang menggunakan Windows. Jika Anda telah menginstal mocha secara global, maka pengaturan program ke jalur berikut berhasil untuk saya (tukar dengan nama pengguna Anda).

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

Ini bekerja untuk saya pada mesin Windows 7. Saya memang telah menginstal mocha secara global, tetapi konfigurasi ini mengarah ke penginstalan proyek untuk menghindari kebutuhan akan jalur profil pengguna (yang btw, saya mencoba menggunakan variabel% USERPROFILE% tetapi tidak berhasil). Saya dapat menyetel breakpoint dalam pengujian mocha saya sekarang. 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"
    }

Bagi mereka yang menggunakan grunt atau gulp, konfigurasinya cukup sederhana.

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

Dalam VSCode versi 1.13.0 (macOS), mereka memiliki konfigurasi bawaan di bawah -> Mocha Tests.

Saat menggunakan Babel, atau membuat file javascript namun menempatkan breakpoint di sumbernya - Anda harus memastikan untuk mengaktifkan sourceMapsdan menentukan outFiles. Berikut ini contoh konfigurasi yang berhasil untuk saya.

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

Catatan - Anda harus memodifikasi outFiles untuk memasukkan semua yang mungkin ingin Anda tambahkan breakpoint. Ini bisa lebih membosankan ketika dalam monorepo dan beberapa proyek yang bergantung.

1) Pergi ke

.vscode

kemudian

launch.json

mengajukan

2) Tambahkan konfigurasi berikut di launch.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) Atur breakpoints dalam file tes dan kemudian tekan F5

Saat menggunakan TypeScript, konfigurasi berikut berfungsi untuk saya dalam 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"
    ]
}

Hal penting yang perlu diperhatikan di sini adalah bahwa peta sumber dibuat dan direktori keluaran untuk js diatur ke 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"
    }

Harap dicatat bahwa di sourceMapsset ke truedan di outDirset kebuild

untuk men-debug

1. Tempelkan titik index.tsputus di file skrip jenis yang diimpor
2. Buka terminal dan jalankan: mocha --debug-brk ./build/test/appTests.js
3. Dari VSC, jalankan konfigurasi peluncuran 'Lampirkan'

Berikut adalah contoh konfigurasi peluncuran (launch.json) dari Microsoft, yang bekerja dengan Mocha dan memungkinkan penggunaan debugger.

Juga, ada deskripsi tentang bagaimana menggunakan opsi --debug-brk.

Terakhir, berikut adalah versi alternatif tentang cara men-debug kode dengan tes Mocha menggunakan file task.json dari VS Code dan pelari tugas Gulp.

Jika Anda memiliki beberapa ketergantungan dalam pengujian, mudah juga untuk memasangnya.

Misalnya, saya menggunakan mongo-unit-helperuntuk juga memiliki tes unit terintegrasi dengan Database.

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

Saya launch.jsonterlihat seperti:

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

Solusi adalah dengan menempatkan --requiresecara terpisah di argsdalam launch.json.

Solusi paling sederhana

Tambahkan kode berikut ke launch.json di dalam folder .vscode:

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

Namun Anda mungkin ingin menambahkan argumen batas waktu juga:

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