README.md
# Deprecated
## Please use [istanbul-badges-readme](https://www.npmjs.com/package/istanbul-badges-readme) instead.
## The usage has not changed at all, it has only been made simpler and **hopefully** bug free.
<img align="right" width="200" src="https://github.com/olavoparno/olavoparno.github.io/raw/master/images/jest-badges-readme-logo4.png" />
# [Jest Badges Readme](https://www.npmjs.com/package/@olavoparno/jest-badges-readme)
[![CodeClimate](https://img.shields.io/codeclimate/maintainability/olavoparno/jest-badges-readme.svg)](https://codeclimate.com/github/olavoparno/jest-badges-readme) [![DevDeps](https://david-dm.org/olavoparno/jest-badges-readme/dev-status.svg)](https://david-dm.org/olavoparno/jest-badges-readme/dev-status.svg) [![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/olavoparno/jest-badges-readme/blob/master/LICENSE) [![npm version](https://img.shields.io/npm/v/@olavoparno/jest-badges-readme.svg?style=flat)](https://www.npmjs.com/package/@olavoparno/jest-badges-readme) [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)](https://github.com/olavoparno/jest-badges-readme/pulls) ![BuiltBy](https://img.shields.io/badge/TypeScript-Lovers-black.svg "img.shields.io") ![ForTheBadge](https://img.shields.io/badge/Using-Badges-red.svg "ForTheBadge")
### Creates Jest Coverage badges for your README.md file
| Statements | Branches | Functions | Lines | Build Status |
| -----------|----------|-----------|-------| ------------ |
| ![Statements](https://img.shields.io/badge/Coverage-96.89%25-brightgreen.svg "Make me better!") | ![Branches](https://img.shields.io/badge/Coverage-94.59%25-brightgreen.svg "Make me better!") | ![Functions](https://img.shields.io/badge/Coverage-100%25-brightgreen.svg "Make me better!") | ![Lines](https://img.shields.io/badge/Coverage-96.89%25-brightgreen.svg "Make me better!") | ![BuildStatus](https://img.shields.io/badge/Build-Passing-brightgreen.svg "Building Status") |
### TL;DR
- To be short, all it does is: **Creates your README.md dynamically with your Jest Coverage Badges based on your README-template.md file**
### Installation
- Global Installation
```bash
npm i -g @olavoparno/jest-badges-readme
```
- Local Installation
```bash
npm i @olavoparno/jest-badges-readme --save-dev
```
### Configuration and requirements
1. Have Jest installed and with its Coverage Reporting configuration as below
- It may be set inside your Jest config within `package.json` or inside your jest config file i.e. `jest.config.js` or `jestconfig.json`
```js
"coverageReporters": [
"json-summary",
"lcov"
]
```
2. Have a _*README-template.md*_ file created with the following template (please do feel free to change its presentation structure, e.g. in a table or not)
```md
| Statements | Branches | Functions | Lines |
| -----------|----------|-----------|-------|
| ![Statements](#statements# "Make me better!") | ![Branches](#branches# "Make me better!") | ![Functions](#functions# "Make me better!") | ![Lines](#lines# "Make me better!") |
```
3. Call if from your terminal or from your NPM/YARN Scripts
- For locally installed library
```json
"make-badges": "node_modules/.bin/jest-badges-readme"
```
- For globally installed library
```json
"make-badges": "npm run jest-badges-readme"
```
- You may also provide a different coverage folder path passed as arguments
```json
"make-badges": "npm run jest-badges-readme --coverageDir='./my-custom-coverage-folder'"
```
- And finally via the very terminal
```bash
jest-badges-readme --coverageDir='./my-custom-coverage-folder'
```
### Short summary onto what Jest and Jest Badges Readme covers for us
- % Stmts (which states for Statements)
- % Branch (pretty self explanatory)
- % Functions (won't repeat myself)
- % Lines (last but not least)
#### This library will create badges URLs for these former 4 items into your _*README-template.md*_ if you followed the previous steps
- Open up your _*README-template.md*_ and add 4 _*markers*_ inside it for each Jest coverage item respectively. These _*markers*_ must be as follows:
1. '#statements#'
2. '#branches#'
3. '#functions#'
4. '#lines#'
#### If you feel you might need a local building badge indicator, add these NPM scripts in order to manage your local building badge as well
```json
"prebuild": "echo nok > .buildstatus",
"postbuild": "echo ok > .buildstatus"
```
- Add one more marker like the example below. This is going to create a file called _*.buildstatus*_ in your project's root telling this library if your build is either successful or a failure
1. '#buildstatus#'
#### Example of _*README-template.md*_ with building status too
```md
| Statements | Branches | Functions | Lines | Build Status |
| -----------|----------|-----------|-------| ------------ |
| ![Statements](#statements# "Make me better!") | ![Branches](#branches# "Make me better!") | ![Functions](#functions# "Make me better!") | ![Lines](#lines# "Make me better!") | ![BuildStatus](#buildstatus# "Building Status") |
```
### Using as a part of your githooks
- If you want to have this run on the precommit hook and update the commit in place, just install husky and add the `precommit` script to your package.json
1. Install Husky
```bash
npm install --save-dev husky
```
2. Add your precommit script
```json
"husky": {
"hooks": {
"pre-commit": "jest && node_modules/.bin/jest-badges-readme && git add 'README.md'"
}
}
```
3. Git Commit and Push. Just use your workflow as usual. If your tests fail, no commit. If they pass, update the README.md and add the file to the commit. Nice!
### Contributing
The purpose of this library is to motivate developers to constantly write a solid documentation and testing. A complete and nice looking documentation is key to a successful development and code maintainability.
Please feel free to open any issues you might come up with and to submit your own PRs. There is not a contributing guide yet
### Contributors
Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):
<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
<!-- prettier-ignore-start -->
<!-- markdownlint-disable -->
<table>
<tr>
<td align="center"><a href="https://olavoparno.github.io"><img src="https://avatars1.githubusercontent.com/u/7513162?v=4" width="70px;" alt=""/><br /><sub><b>Olavo Parno</b></sub></a><br /><a href="#ideas-olavoparno" title="Ideas, Planning, & Feedback">🤔</a> <a href="https://github.com/olavoparno/jest-badges-readme/commits?author=olavoparno" title="Code">💻</a> <a href="https://github.com/olavoparno/jest-badges-readme/commits?author=olavoparno" title="Tests">⚠️</a></td>
<td align="center"><a href="https://github.com/nothingismagick"><img src="https://avatars1.githubusercontent.com/u/35242872?v=4" width="70px;" alt=""/><br /><sub><b>nothingismagick</b></sub></a><br /><a href="#ideas-nothingismagick" title="Ideas, Planning, & Feedback">🤔</a> <a href="https://github.com/olavoparno/jest-badges-readme/issues?q=author%3Anothingismagick" title="Bug reports">🐛</a> <a href="#content-nothingismagick" title="Content">🖋</a></td>
<td align="center"><a href="http://www.fallenclient.co.uk"><img src="https://avatars2.githubusercontent.com/u/326470?v=4" width="70px;" alt=""/><br /><sub><b>Dave Fisher</b></sub></a><br /><a href="https://github.com/olavoparno/jest-badges-readme/issues?q=author%3Afallenclient" title="Bug reports">🐛</a></td>
<td align="center"><a href="http://twitter.com/zaggino"><img src="https://avatars1.githubusercontent.com/u/1067319?v=4" width="70px;" alt=""/><br /><sub><b>Martin Zagora</b></sub></a><br /><a href="#ideas-zaggino" title="Ideas, Planning, & Feedback">🤔</a> <a href="https://github.com/olavoparno/jest-badges-readme/issues?q=author%3Azaggino" title="Bug reports">🐛</a></td>
</tr>
</table>
<!-- markdownlint-enable -->
<!-- prettier-ignore-end -->
<!-- ALL-CONTRIBUTORS-LIST:END -->
This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome!
### License
Jest Badges Readme is [MIT licensed](./LICENSE).
<div style="display: none; visibility: hidden; opacity: 0;">
<img height=0 width=0 style="display: none; visibility: hidden; opacity: 0;" src="http://hits.dwyl.com/olavoparno/jest-badges-readme.svg" />
</div>