Jest coverage report in Markdown

This action uses a text coverage report from Jest and generates a Markdown report based on it in the format shown below. The table shows the status of each file. Each file and uncovered line is properly linked to it's examined version on GitHub.

St	File	% Stmts	% Branch	% Funcs	% Lines	Uncovered Line #s
🟡	All files	70.58	72.22	83.33	71.42
🟡	src	63.23	64.28	80	64.17
🔴	main.ts	0	0	0	0	1-37
🟢	report.ts	95.55	100	88.88	95.55	14-15
🟢	src/utils	100	100	100	100
🟢	getReportParts.ts	100	100	100	100
🟢	status.ts	100	100	100	100

Note This package isn’t part of our core product. It’s kindly shared “as-is” without any guaranteed level of support from Fingerprint. We warmly welcome community contributions.

Usage

The action returns a markdownReport output that you can use in other actions. The example below shows how to use the report in a pull request comment.

steps:
  - name: Prepare coverage report in markdown
    uses: fingerprintjs/action-coverage-report-md@v2
    id: coverage
  - name: Add coverage comment to the PR
    uses: marocchino/sticky-pull-request-comment@v2
    with:
      message: ${{ steps.coverage.outputs.markdownReport }}

Extended usage

steps:
  - name: Prepare coverage report in markdown
    uses: fingerprintjs/action-coverage-report-md@v2
    id: coverage
    with:
      textReportPath: './coverage/text-report.txt'
      srcBasePath: './utils'
  - name: Add coverage comment to the PR
    uses: marocchino/sticky-pull-request-comment@v2
    with:
      message: ${{ steps.coverage.outputs.markdownReport }}

Add coverage report to the job summary

You can add a code coverage report to the job summary. For more information, see Adding a job summary in the GitHub Actions documentation.

steps:
  - name: Prepare coverage report in markdown
    uses: fingerprintjs/action-coverage-report-md@v2
    id: coverage
    with:
      textReportPath: './coverage/text-report.txt'
      srcBasePath: './utils'
  - name: Add coverage report to the job summary
    run: |
      echo "## Code Coverage" >> $GITHUB_STEP_SUMMARY
      echo "${{ steps.coverage.outputs.markdownReport }}" >> $GITHUB_STEP_SUMMARY

API

Inputs

Name	Type	Default Value	Description
`textReportPath`	`string`	`'./coverage/coverage.txt'`	Path to the coverage report in the Istanbul text format.
`srcBasePath`	`string`	`'./src'`	Base path for the source folder.

Outputs

Name	Type	Description
`markdownReport`	`string`	Coverage report in Markdown format.

How to get a text coverage report

Jest

Using a CLI:

npx jest --coverage --coverageReporters="text" > coverage.txt

Using a Configuration file:

module.exports = {
  // ... other settings
  coverageReporters: [['text', { file: 'coverage.txt', path: './' }]],
};

nyc (Istanbul)

Using a CLI:

npx nyc report --reporter=text > ./coverage/coverage.txt

Using a Configuration file:

module.exports = {
  // ... other settings
  "reporter": ["text"],
  "report-dir": "./coverage"  // will generate a file ./coverage/text.txt
}

Karma

module.exports = function(config) {
  config.set({
    // ... other settings
    reporters: ['coverage'],
    coverageReporter: {
        type : 'text',
        dir: './coverage',
        file: 'coverage.txt'
    }
  });
};

Update Documentation

I have recently implemented code coverage reports using this action, and I wanted to share where I think more documentation could be helpful. Thank you for making this GitHub Action!

I implemented this with Cypress and Istanbul js and React Native Web / Expo.

Update Usage section with example on how to publish to Job Summary section

Some people may not be aware of how to do this so documenting this would be nice. It is a cool feature to be able to use this action on pipeline runs that are not pull requests!

More Info on Job Summaries

      - uses: fingerprintjs/action-coverage-report-md@v1
        id: coverage
        with:
          textReportPath: './coverage/coverage-final.txt'
          srcBasePath: ''
      
      - run: | 
          echo "" >> $GITHUB_STEP_SUMMARY
          echo "## Code Coverage" >> $GITHUB_STEP_SUMMARY
          echo "${{ steps.coverage.outputs.markdownReport }}" >> $GITHUB_STEP_SUMMARY

Update usage section with how to generate text reports with nyc package

For some reason I could not figure out a way to generate .txt reports. I used this command to generate the text report.

      - run: npx nyc report --reporter=text > coverage-final.txt
        working-directory: ./coverage

Code links in report break if there are code files in the root folder of the repository

I do not know if this is a bug or not, but I needed to move my App.tsx file out of the root folder of my project.
When I had App.tsx inside of my root folder, my reports generated as below: The links in the report redirected here:

https://github.com/SudoKuru/Frontend/blob/ed0aefe25c93ac6bf3425e417f8473558911ceeb/Frontend/App.tsx

The valid link should be:
https://github.com/SudoKuru/Frontend/blob/ed0aefe25c93ac6bf3425e417f8473558911ceeb/App.tsx

The link is incorrect because Frontend is the name of the repository and not a folder. When there is code in the root of the folder, it appears that the Istanbul reporter uses the repository name as the root folder.

This is the PR for the project where I implemented Code Coverage using this action.

fingerprintjs / action-coverage-report-md Goto Github PK

action-coverage-report-md's Introduction

Jest coverage report in Markdown

Usage

Extended usage

Add coverage report to the job summary

API

Inputs

Outputs

How to get a text coverage report

Jest

nyc (Istanbul)

Karma

action-coverage-report-md's People

Contributors

Stargazers

Watchers

action-coverage-report-md's Issues

Update Usage section with example on how to publish to Job Summary section

Update usage section with how to generate text reports with nyc package

Code links in report break if there are code files in the root folder of the repository

Recommend Projects

Recommend Topics

Recommend Org