As a developer, the importance of testing code is well known. Testing source code helps to prevent bugs and syntax errors by cross-checking it with an expected output.
As stated on their official website: “Code coverage provides a visual measurement of what source code is being executed by a test suite”. This information indicates to the software developer where they should write new tests in the effort to achieve higher coverage, and consequently a lower chance of being buggy. Hence nearly every public repository on git uses codecov, a tool to measure the coverage of their source code.
In this blog, we shall see how to link codecov, with a public repository on Github when the code has been written in Angular2(Typescript). We shall assume that the repository uses Travis CI for integration.
STEP 1:
Go to https://codecov.io/gh/ and login to your Github account.
It will now give you the option to chose a repository to add for coverage. Select your repository.
STEP 2:
Navigate to Settings Tab, you should see something like this:
Follow the above-mentioned instructions.
STEP 3:
We now come to one of the most important parts of Codecov integration. Writing the files in our repo to enable this.
We will need three main files:
Travis.yml- which will ensure continuous integration services on your git hosted project
Codecov.yml- to personalise your settings and override the default settings in codecov.”The Codecov Yaml file is the single point of configuration, providing the developers with a transparent and version controlled file to adjust all Codecov settings.” as mentioned in the official website
Package.json- to inform npm of the new dependencies related to codecov, in addition to providing all the metadata to the user.
In .travis.yml, Add the following line:
after_success:
- bash <(curl -s https://codecov.io/bash)
In codecov.yml, Add the following
Source: https://github.com/codecov/support/wiki/Codecov-Yaml# codecov: url: "string" # [enterprise] your self-hosted Codecov endpoint # ex. https://codecov.company.com slug: "owner/repo" # [enterprise] the project's name when using the global upload tokens branch: master # the branch to show by default, inherited from your git repository settings # ex. master, stable or release # default: the default branch in git/mercurial bot: username # the username that will consume any oauth requests # must have previously logged into Codecov ci: # [advanced] a list of custom CI domains - "ci.custom.com" notify: # [advanced] usage only after_n_builds: 5 # how many build to wait for before submitting notifications # therefore skipping status checks countdown: 50 # number of seconds to wait before checking CI status delay: 100 # number of seconds between each CI status check coverage: precision: 2 # how many decimal places to display in the UI: 0 <= value <= 4 round: down # how coverage is rounded: down/up/nearest range: 50...100 # custom range of coverage colors from red -> yellow -> green notify: irc: default: # -> see "sections" below server: "chat.freenode.net" #*S the domain of the irc server branches: null # -> see "branch patterns" below threshold: null # -> see "threshold" below message: "template string" # [advanced] -> see "customized message" below gitter: default: # -> see "sections" below url: "https://webhooks.gitter.im/..." #*S unique Gitter notifications url branches: null # -> see "branch patterns" below threshold: null # -> see "threshold" below message: "template string" # [advanced] -> see "customized message" below status: project: # measuring the overall project coverage default: # context, you can create multiple ones with custom titles enabled: yes # must be yes|true to enable this status target: auto # specify the target coverage for each commit status # option: "auto" (must increase from parent commit or pull request base) # option: "X%" a static target percentage to hit branches: # -> see "branch patterns" below threshold: null # allowed to drop X% and still result in a "success" commit status if_no_uploads: error # will post commit status of "error" if no coverage reports we uploaded # options: success, error, failure if_not_found: success # if parent is not found report status as success, error, or failure if_ci_failed: error # if ci fails report status as success, error, or failure patch: # pull requests only: this commit status will measure the # entire pull requests Coverage Diff. Checking if the lines # adjusted are covered at least X%. default: enabled: yes # must be yes|true to enable this status target: 80% # specify the target "X%" coverage to hit branches: null # -> see "branch patterns" below threshold: null # allowed to drop X% and still result in a "success" commit status if_no_uploads: error # will post commit status of "error" if no coverage reports we uploaded # options: success, error, failure if_not_found: success if_ci_failed: error changes: # if there are any unexpected changes in coverage default: enabled: yes # must be yes|true to enable this status branches: null # -> see "branch patterns" below if_no_uploads: error if_not_found: success if_ci_failed: error ignore: # files and folders that will be removed during processing - "tests/*" - "demo/*.rb" fixes: # [advanced] in rare cases the report tree is invalid, specify adjustments here - "old_path::new_path" # comment: false # to disable comments comment: layout: "header, diff, changes, sunburst, suggestions, tree" branches: null # -> see "branch patterns" below behavior: default # option: "default" posts once then update, posts new if delete # option: "once" post once then updates, if deleted do not post new # option: "new" delete old, post new # option: "spammy" post new
Your package.json should look like this:
{
"name": "example-typescript",
"version": "1.0.0",
"description": "Codecov Example Typescript",
"main": "index.js",
"devDependencies": {
"chai": "^3.5.0",
"codecov": "^1.0.1",
"mocha": "^2.5.3",
"nyc": "^6.4.4",
"tsd": "^0.6.5",
"typescript": "^1.8.10"
},
"scripts": {
"postinstall": "tsd install",
"pretest": "tsc test/*.ts --module commonjs --sourcemap",
"test": "nyc mocha",
"posttest": "nyc report --reporter=json && codecov -f coverage/*.json"
},
"repository": {
"type": "git",
"url": "git+https://github.com/Myname/example-typescript.git"
},
/*Optional*/
"author": "Myname",
"license": "Lic.name",
"bugs": {
"url": "https://github.com/example-typescript-path"
},
"homepage": "https://github.com/Myname/example-typescript#readme"
}
Most of the code in package.json is metadata.
Two major parts of the code above are the devDependencies and the scripts.
In devDependencies, make sure to include the latest versions of all the packages your repository is using.
In scripts:
- Postinstall – indicates the actions to be performed, once installation is complete.
- Pretest – is for just before running ng test.
- Test – indicates what is used while testing.
- Posttest – is what is run just after testing is complete.
Check this repository for the sample files to generate the reports to be uploaded for Codecov: https://github.com/codecov/example-typescript
Check https://docs.codecov.io/v4.3.6/docs/codecov-yaml for detailed step by step instructions on writing codecov.yaml and https://docs.codecov.io/v4.3.6/docs for any general information
