Pontos de interrupção Mocha usando Visual Studio Code

É possível adicionar pontos de interrupção aos testes Mocha usando o Visual Studio Code?

Normalmente, ao depurar o código, é necessário configurar o launch.json, definindo o atributo do programa para o arquivo javascript a ser executado. Não tenho certeza de como fazer isso para Mocha embora.

Você sabia que basta entrar na configuração de inicialização, colocar o cursor após ou entre as outras configurações e pressionar ctrl- spacepara obter uma configuração de mocha válida e atual gerada automaticamente?

O que funciona perfeitamente bem para mim. Incluindo parar em pontos de interrupção. (Eu também tinha um anterior, agora desatualizado, que não existia mais por vários motivos relacionados ao ambiente.)

A partir do VSCode 1.21.1 (março de 2018), isso resulta em:

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

Em uma observação lateral: debug-brk está obsoleto (para qualquer um com Nó> = Versão 8 pelo menos).

Se você não quiser usar --debug-brk+ Attach ou indicar um caminho absoluto para a instalação global do mocha (que será interrompida se você mantiver o launch.json sob controle de versão e tiver vários desenvolvedores em máquinas diferentes), instale o mocha como uma dependência de desenvolvimento e adicione isso ao seu launch.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"
  }
}

Suporte total à depuração em seus testes pressionando apenas F5.

--no-timeoutsgarante que seus testes não expirem porque você parou em um ponto de interrupção e --colorsgarante que o Mocha produza cores, embora não detecte que o VS Code suporta cores.

Outra maneira é usar a --debug-brkopção de linha de comando do mocha e a Attachconfiguração de inicialização padrão do depurador de código do Visual Studio.

Explicação mais aprofundada sugerida (de André)

Para fazer isso:

Execute o mocha a partir da linha de comando usando este comando:

mocha --debug-brk

Agora, no VS Code, clique no ícone Debug e selecione Attacha opção ao lado do botão Iniciar. Adicione pontos de interrupção no VS Code e clique em iniciar.

Fiz este trabalho no VSCode no OS X 10.10. Basta substituir seu ./settings/launch.jsonarquivo por este.

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

Ele também está disponível como uma essência aqui .

Os valores-chave que você precisa alterar são program, que deve ser definido como _mochaexecutável e args, que deve ser uma matriz de seus arquivos de teste.

A forma como o fiz funcionar no VS Code (1.8.2) no 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"
    }
}

O Mocha precisa ser instalado no diretório de módulos npm.

1. Vá para o Debug > Add Configuration...menu
2. Selecione o Node.jsambiente
3. Selecione a Mocha Testsopção na lista suspensa exibida
4. Digite o caminho do seu arquivo de teste como o último item da argspropriedade
5. Adicione um breakpoint
6. Clique no Debugícone
7. Selecione Mocha Testscomo configuração
8. Pressione o Start debuggingbotão
9. :-)

Eu descobri uma maneira de fazer isso que classifico como uma solução alternativa . Espero que a equipe do Visual Studio Code forneça uma solução mais definitiva para isso, mas, enquanto isso, fiz o seguinte:

1. Criei um ./settings/mocha.jsarquivo que executa o mocha, transmitindo argumentos de forma programática como uma lista de arquivos a serem executados. Você pode ver o arquivo completo aqui ;

2. Eu criei uma configuração de inicialização que executará o ./settings/mocha.jscomo programe transmite os arquivos / padrões de arquivo que precisamos testar como argumentos:

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

   Exemplo completo de launch.json

Portanto, isso é o equivalente a fazer mocha test/unit/*.js test/unit/**/*.jse agora podemos usar pontos de interrupção em nossos testes de mocha.

Se você adicionar a variável $ {file} no final da lista de args, poderá começar a depurar diretamente do arquivo que abriu:

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

Desculpe por adicionar outra resposta, mas nenhuma das anteriores funcionou muito bem para mim no VS Code 1.8.1 e no depurador Node padrão incluído nele. Aqui está a maneira como eu resolvi isso (com orientação das respostas anteriores aqui e dos documentos oficiais de depuração do VS Code Node.js ) para que haja depuração com um clique / pressionamento de tecla:

• Certifique-se de que o mocha esteja instalado como devDependencyem packages.json:"devDependencies": { "mocha": "^3.2", ... }
• Execute npm installno diretório do seu package.jsonpara certificar-se de que o mocha agora está instalado emnode_modules/
• Abra .vscode/launch.json(ou em VS Code, pressione F1, comece a digitar "launch" e selecione "Debug: Open launch.json")
• Clique no botão azul "Adicionar configuração" no canto inferior direito (ou apenas copie e cole um dos outros); esta etapa é opcional ... Quer dizer, você pode reutilizar uma configuração existente. Mas sugiro adicionar um para mantê-lo menos confuso.
• Altere o seguinte em seu e launch.json, em seguida, escolha o novo nome de configuração na janela de depuração no VS Code e clique na seta verde para começar a depurar seus testes node + mocha!

Na nova configuração em 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
}, ...]

Isso pressupõe que o padrão test/**/*.jsfuncionará para onde você colocar seus testes. Altere conforme apropriado.

Sinta-se à vontade para alterar a porta, contanto que altere-a nas propriedades argse portpara que correspondam.

A principal diferença para mim era garantir que o mocha estava dentro node_modules, usando programpara apontar para o executável e argsprecisando debug-brk=xapontar para a porta especificada em port. O resto do acima apenas torna as coisas mais bonitas e fáceis.

Cabe a você e sua equipe se você colocar .vscode/launch.jsonno repositório ou não. É um arquivo somente IDE, mas toda a sua equipe poderia usá-lo assim, sem problemas, já que todos os caminhos e instalações são relativos e explícitos.

Dica: O package.jsonpode incluir uma scriptstag que também inicia o mocha com algo semelhante "test": "./node_modules/.bin/mocha", mas não é usada pelo VS Code - em vez disso, é usada quando npm testé executada na linha de comando. Este me confundiu um pouco. Anotando aqui, caso outros também se confundam.

EDIT: VS Code 1.9.0 adicionou uma opção "Adicionar configuração" na lista suspensa de configuração de depuração, e você pode escolher "Testes Mocha Node.js" que ajudam a simplificar a maioria dos itens acima. Você ainda precisa se certificar de que o mocha está em seu node_modulese pode ter que atualizar o cwde last runtimeArgs(que é o padrão para encontrar seus testes) para apontar para os caminhos apropriados. Mas depois de definir essas duas propriedades, deve funcionar praticamente a partir daí.

no launch.json, adicione mais 1 configuração abaixo

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

se você precisar configurar a versão do nó, basta adicionar um runtimeExecutablecampo como este

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

Para qualquer pessoa que use o Windows. Se você instalou o mocha globalmente, configurar o programa para o seguinte caminho funcionou para mim (troque seu nome de usuário).

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

Isso está funcionando para mim em uma máquina com Windows 7. Eu tenho o mocha instalado globalmente, mas esta configuração está apontando para a instalação do projeto para evitar a necessidade de um caminho de perfil de usuário (que btw, eu tentei usar a variável% USERPROFILE% sem sucesso). Sou capaz de definir pontos de interrupção em meus testes de mocha agora. 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"
    }

Para aqueles que usam grunt ou gulp, a configuração é bem simples.

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

No VSCode versão 1.13.0 (macOS), eles o possuem integrado em configurações -> Mocha Tests.

Ao usar o Babel, ou gerar arquivos javascript ainda colocando pontos de interrupção na fonte - você deve certificar-se de habilitar sourceMapse definir outFiles. Aqui está um exemplo de configuração que funcionou para mim.

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

Observação - você precisará modificar outFilespara incluir tudo o que deseja adicionar um ponto de interrupção. Isso pode ser mais tedioso quando em um monorepo e vários projetos dependentes.

1) Vá para

.vscode

então

launch.json

Arquivo

2) Adicione a seguinte configuração em 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) Defina pontos de interrupção no arquivo de teste e pressione F5

Ao usar o TypeScript, a seguinte configuração funciona para mim no 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"
    ]
}

O que é importante notar aqui é que os mapas de origem são gerados e que o diretório de saída para o js está definido como 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"
    }

Observe que sourceMapsestá definido como truee que outDirestá definido comobuild

depurar

1. Cole os pontos de interrupção em index.tsqualquer outro arquivo de texto digitado importado
2. Abra um terminal e execute: mocha --debug-brk ./build/test/appTests.js
3. No VSC, execute a configuração de inicialização 'Anexar'

Aqui está um exemplo de configuração de inicialização (launch.json) da Microsoft, que funciona com o Mocha e permite usar o depurador.

Além disso, há uma descrição de como usar a opção --debug-brk.

Finalmente, aqui está uma versão alternativa de como depurar código com testes Mocha usando o arquivo tasks.json do VS Code e o executor de tarefas Gulp.

Se você tiver alguma dependência no teste, também é fácil anexá-lo.

Por exemplo, estou acostumado mongo-unit-helpera ter testes de unidade integrados ao banco de dados.

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

Minha launch.jsonaparência é:

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

A solução é colocar --requireseparadamente argsem launch.json.

Solução mais simples

Adicione o seguinte código ao launch.json dentro da pasta .vscode:

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

No entanto, você pode querer adicionar um argumento de tempo limite também:

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