VSコードでJestユニットテストをデバッグする

Reactの流行に伴い、jestも多くのプロジェクトで広く使われているテストフレームワークとなっている.jestのデフォルトは同時実行テストであるため、日常の仕事の中で多くの学生がjestユニットのテストをどのようにデバッグするかについて困っていることが分かった.これらの細かい点は、「できる人は難しくないし、難しい人はできない」ということもあります.codeでjestテストをデバッグする方法を紹介します.
注意:ここではNode>v 8が必要です.4.以前のバージョンV8にバグがあり、Jestテストのブレークポイントがまったく切れなかった.

デバッグタスクの追加

Codeにデバッグタスクを追加する必要があります.内容は次のとおりです.

{
    "type": "node",
    "request": "launch",
    "protocol": "inspector",
    "name": "Jest Debug",
    "program": "${workspaceRoot}/node_modules/jest/bin/jest",
    "stopOnEntry": false,
    "args": ["--runInBand", "--env=jsdom", "${fileBasename}"],
    "runtimeArgs": [
        "--inspect-brk"
     ],
     "cwd": "${workspaceRoot}",
     "sourceMaps": true,
     "console": "integratedTerminal"
}

ここにはjestの運転時パラメータがあります:--runInBandまたは-iと略記されていますが、皆さんは気づいていますか?このパラメータ制御jestは、すべてのテストをシリアルで実行する.
その他のパラメータと設定は言うまでもなく、みんなは自分でcodeの助けを見て勉強します.

ブレークポイントを設定してデバッグを開始

はい、codeでデバッグする必要があるテストファイルを開き、ブレークポイントを設定できます.そして、F5を思い切り押します.次は...君の番だ!