如何在 VSTS 测试中发布 Jest 单元测试结果？

Question

我找到了一些特定于版本的 questions on SO 用于玩笑单元测试，以便在 VSTS 构建测试结果选项卡中发布其结果。但是没有找到合适的解决方案。

Answer 1

我使用了另一种方法，b/c 经过一些研究后，我发现Jest testResultsProcessor property is deprecated.我正在使用 jest-junit 包来生成测试报告（它比 jest-trx-results-processor, fwiw 最近才开始使用）：

1. 将 jest-junit 添加到package.json

   例如yarn add -D jest-junit 或npm add --save-dev jest-junit

2. 添加一个 VSTS 任务以使用 jest-junit 结果报告器运行 Jest

   我使用了the Yarn task，但您也可以使用the npm task。我使用了这些任务参数：

   jest --ci --reporters=jest-junit --reporters=default --coverage --coverageReporters=cobertura --coverageReporters=html
   

   因为我还想要代码覆盖率。要跳过代码覆盖率报告，请使用这些（npm 或 yarn）任务参数：

   jest --ci --reporters=jest-junit --reporters=default
   

   请注意 --reporters=default 是否存在 b/c 我想要在我的构建日志中使用默认标准输出。

3. 添加Publish Test Results task

   由于我们使用默认路径，测试结果文件将写入~/junit.xml

4. （可选）也添加publish code coverage task

   如果你正在运行代码覆盖，你也可以添加一个发布代码覆盖结果的任务：

如果您使用的是 YAML 管道，这里是等效的 YAML（请注意，我们使用的是 yarn 任务而不是 npm 任务，但可以更改）：

 - task: geeklearningio.gl-vsts-tasks-yarn.yarn-task.Yarn@2
    displayName: 'Install dependencies'
    inputs:
      Arguments: install --no-progress

  - task: geeklearningio.gl-vsts-tasks-yarn.yarn-task.Yarn@2
    displayName: 'Unit tests'
    inputs:
      Arguments: 'test --ci --reporters=jest-junit --reporters=default --coverage --coverageReporters=cobertura'
    continueOnError: true # Test failures should be published before failing the build

  - task: PublishTestResults@2
    displayName: 'Publish Jest Unit Test Results'
    inputs:
      testResultsFiles: junit.xml
      mergeTestResults: true
      testRunTitle: 'Jest Unit Tests'
      failTaskOnFailedTests: true

  - task: PublishCodeCoverageResults@1
    displayName: 'Publish code coverage from Jest tests'
    inputs:
      codeCoverageTool: Cobertura
      summaryFileLocation: '$(System.DefaultWorkingDirectory)/coverage/cobertura-coverage.xml'
      # reportDirectory: '$(System.DefaultWorkingDirectory)/coverage'
      failIfCoverageEmpty: true

Answer 2

Evaldas 的解决方案已经过时，所以我将添加一些修改。

更现代的解决方案是 Evaldas 和维护者的组合：https://www.npmjs.com/package/jest-trx-results-processor

我会在下面这样描述它。

1. 安装 jest-trx-results-processor

   # NPM
   npm install jest-trx-results-processor --save-dev
   
   # Yarn
   yarn add -D jest-trx-results-processor
   

2. 更新后的package.json 文件应如下所示：

   "devDependencies": { 
       "jest": "^24.9.0",
       "jest-trx-results-processor": "^1.0.2"
       ...
   },
   "scripts": {
       "test": "jest"
   },
   "jest": {
       ...,
       "reporters": [
   "default",
   [
     "jest-trx-results-processor",
     {
       "outputFile": "./src/jestTestresults.trx",
       "defaultUserName": "user name to use if automatic detection fails"
     }
   ]]}
   

3. 将npm 任务添加到构建管道中的npm test 的VSTS 构建。它应该如下所示：

4. 添加Publish Test Results VSTS 任务以在VSTS 测试中添加jestTestresults.trx 结果。为此，在构建管道中，单击“添加符号”。寻找“发布测试结果”。它会弹出一个这样的菜单。由于它是一个 .trx 文件，因此您需要使用 VSTest 而不是 JTest。
5. 最后，前端项目的构建管道将如下所示：

Answer 3

我已经抛出了一些开玩笑的 npm 包，例如 tap-xunit 和 jest-json-to-tap，但无法弄清楚它是否可以工作。以下步骤对我有用，以便在Test of VSTS build 下查看结果。

1. 安装jest-trx-results-processor

   # NPM
   npm install jest-trx-results-processor --save-dev
   
   # Yarn
   yarn add -D jest-trx-results-processor
   

2. 使用以下内容创建jestTrxProcessor.js 文件：

   var builder = require('jest-trx-results-processor');     
   var processor = builder({
       outputFile: 'jestTestresults.trx' 
   });
   module.exports = processor;
   

3. 更新后的package.json 文件应如下所示：

   "devDependencies": { 
       "jest": "^23.4.1",
       "jest-trx-results-processor": "0.0.7",
       "jsdom": "^11.12.0",
       ...
   },
   "scripts": {
       "test": "jest"
   },
   "jest": {
       ...,
       "testResultsProcessor": "./jestTrxProcessor.js"
   }
   

4. 为npm test 添加npm task to VSTS build。这将运行笑话测试并将结果发布到jestTestresults.trx

5. 在VSTS测试中添加Publish Test Resultstask of VSTS以添加jestTestresults.trx结果。

您将能够看到 JEST 测试以及其他测试。