Add CodeClimate Coverage Tests to React App

[RyanMarten]

integrate test coverage into our app

[RyanMarten]

Starting here: https://docs.codeclimate.com/docs/configuring-test-coverage

[RyanMarten]

CodeClimate takes a code coverage report and generalizes and also relates it to the repo

Supported Languages By CodeClimate ... JavaScript: lcov (generated by Istanbul e.g.)

[RyanMarten]

Look more into npm test later: https://docs.npmjs.com/cli/test

https://discuss.codecademy.com/t/how-does-npm-test-work/387017

[RyanMarten]

Referring to the team app docs for how to set up coverage for our react app https://dcsil-team-app.herokuapp.com/docs/software/code/coverage

might need to use some test framework like mocha for js

[RyanMarten]

npm install --save-dev nyc

I should use the --save-dev feature more.... firebase-tools doesn't need to go to prod

[RyanMarten]

Need to add the jq package.....

How should I add this without actually adding it to the repo..... need to add it to the bootstrap for the local development.

https://stedolan.github.io/jq/download/ brew install jq

added to bootstrap

129

[RyanMarten]

How to test a react app? Let's find out: https://reactjs.org/docs/testing.html

Rendering component trees in a simplified test environment and asserting on their output. Running a complete app in a realistic browser environment (also known as “end-to-end” tests).

Two different choices, but the first one is easier to do. It is faster but doesn't model the browser completely accurately.

Recommends Jest and React Testing Library

JEST GENERATES CODE COVERAGE! May not be in the right JSON form though.

[RyanMarten]

Using Instabul with Jest: https://istanbul.js.org/docs/tutorials/jest/

Istanbul is built into Jest, so configuration is handled directly by Jest. The report can be generated by triggering jest with the --coverage flag. Jest provides documentation for configuring test coverage here.

[RyanMarten]

Starting by setting up Jest using the getting started link: https://jestjs.io/docs/en/getting-started.html

removed the native "test": "react-scripts test", and replacing with "test": "jest"

mv App.test.js old.Apptest.js just in case I need to change these back later

added jest configuration to package.json --> verbose and collectCoverage are both true

[RyanMarten]

Added secret to the repo so we can upload our coverage report

[RyanMarten]

Successfully generate a coverage report, but when uploaded to the DSCIL API, it is rejected for "not being in the right format"