From 459d6a4352a53e788f5940eb19e5aa2072d832d8 Mon Sep 17 00:00:00 2001 From: Tobi Adeyemi Date: Mon, 6 Nov 2023 15:08:16 +0100 Subject: [PATCH] Git action component test (#569) * feat: add Cypress code coverage - update dependencies * feat: add test commands to README.md * fix: add coverage threshold to package.json * feat: add component tests for Cypress * chore: add failing test to check if it fails git workflow * chore: remove failing test --- .github/workflows/test.yml | 3 ++ README.md | 32 +++++++++++++++++-- package.json | 15 ++++++--- .../Episode/TypeTweet/TypeTweet.cy.tsx | 2 +- yarn.lock | 21 ++++++------ 5 files changed, 55 insertions(+), 18 deletions(-) diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml index 61eac767b..9b5f9310a 100644 --- a/.github/workflows/test.yml +++ b/.github/workflows/test.yml @@ -34,6 +34,9 @@ jobs: CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_RECORD_KEY }} # created by the GH Action automatically GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} + - name: Component tests + run: yarn run cy-comp + continue-on-error: false - name: Check the coverage value run: yarn test-coverage diff --git a/README.md b/README.md index 8638030bf..829951aa8 100644 --- a/README.md +++ b/README.md @@ -14,10 +14,36 @@ Open [http://localhost:3000](http://localhost:3000) to view it in the browser. The page will reload if you make edits.\ You will also see any lint errors in the console. -### `yarn test` +### `run tests` + +Run e2e and component tests (cypress non-headless mode) like so +```bash +yarn run cy-open +``` + +Run e2e test in headless mode like so +```bash +yarn run cy-run +``` + +Run component test in headless mode like so +```bash +yarn run cy-comp +``` + +To create a test coverage report +- while running the application do +```bash +yarn run cy-run +``` + +- whithout running the application do +```bash +yarn run test-coverage +``` + +The `coverage` folder contains generated coverage report -Launches the test runner in the interactive watch mode.\ -See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information. ### `yarn build` diff --git a/package.json b/package.json index b318185ad..fcba47d35 100644 --- a/package.json +++ b/package.json @@ -80,6 +80,7 @@ "cy-open": "cypress open", "cy-run": "cypress run", "cy-comp": "cypress run --component", + "test:coverage": "npx nyc report --reporter=html --reporter=text-summary", "format": "prettier --write --config prettier.config.js ./src", "prettier": "npx prettier --config prettier.config.js --check ./src", "postinstall": "husky install", @@ -100,7 +101,7 @@ ], "coverageThreshold": { "global": { - "lines": 0 + "lines": 0 }, "./src/components/**/utils/**.ts": { "lines": 92 @@ -144,7 +145,7 @@ "@babel/preset-typescript": "^7.21.5", "@commitlint/cli": "^17.1.2", "@commitlint/config-conventional": "^17.1.0", - "@cypress/code-coverage": "^3.11.0", + "@cypress/code-coverage": "^3.12.8", "@esbuild-plugins/node-globals-polyfill": "^0.2.3", "@testing-library/cypress": "^10.0.1", "@testing-library/jest-dom": "^5.16.5", @@ -189,7 +190,7 @@ "vite": "^4.4.11", "vite-compatible-readable-stream": "^3.6.1", "vite-plugin-eslint": "^1.8.1", - "vite-plugin-istanbul": "^4.1.0", + "vite-plugin-istanbul": "^5.0.0", "vite-plugin-node-polyfills": "^0.8.2", "vite-plugin-svgr": "^3.2.0", "vite-tsconfig-paths": "^4.2.0" @@ -199,8 +200,14 @@ "node": ">=16.0.0" }, "nyc": { + "cache": false, + "instrument": false, + "sourceMap": false, + "all": true, + "include": "src/**/*.{js,jsx,ts,tsx}", "reporter": [ - "html" + "html", + "text-summary" ] }, "coverage": { diff --git a/src/components/App/SideBar/Relevance/Episode/TypeTweet/TypeTweet.cy.tsx b/src/components/App/SideBar/Relevance/Episode/TypeTweet/TypeTweet.cy.tsx index e221b2060..7e0cb8a33 100644 --- a/src/components/App/SideBar/Relevance/Episode/TypeTweet/TypeTweet.cy.tsx +++ b/src/components/App/SideBar/Relevance/Episode/TypeTweet/TypeTweet.cy.tsx @@ -1,4 +1,4 @@ -import { TypeTweet, Props } from '.' +import { Props, TypeTweet } from '.' function unixTimestampInSeconds() { return Math.floor(Date.now() / 1000) diff --git a/yarn.lock b/yarn.lock index 5dfbde151..57c5ec82a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1699,9 +1699,9 @@ __metadata: languageName: node linkType: hard -"@cypress/code-coverage@npm:^3.11.0": - version: 3.12.7 - resolution: "@cypress/code-coverage@npm:3.12.7" +"@cypress/code-coverage@npm:^3.12.8": + version: 3.12.8 + resolution: "@cypress/code-coverage@npm:3.12.8" dependencies: "@cypress/webpack-preprocessor": ^6.0.0 chalk: 4.1.2 @@ -1718,7 +1718,7 @@ __metadata: babel-loader: ^8.3 || ^9 cypress: "*" webpack: ^4 || ^5 - checksum: 8deeaeac41f57859a5cbb018a41e5137cf5ed14629285e5ff6f4339dcdf7586eb7859a97eade9224377159d85ee08b8b5eac3fdc78a0f772057a22eb0714088d + checksum: 664692fb8b1bb1e8645bf19cf133046af871b765998ce030dd581395cc5677948be91fd6b6e2f4cf86fa9af78a13023bac7d911f3205d628431044722c7e68d2 languageName: node linkType: hard @@ -13488,7 +13488,7 @@ __metadata: "@babel/preset-typescript": ^7.21.5 "@commitlint/cli": ^17.1.2 "@commitlint/config-conventional": ^17.1.0 - "@cypress/code-coverage": ^3.11.0 + "@cypress/code-coverage": ^3.12.8 "@emotion/react": ^11.11.1 "@emotion/styled": ^11.11.0 "@esbuild-plugins/node-globals-polyfill": ^0.2.3 @@ -13590,7 +13590,7 @@ __metadata: vite: ^4.4.11 vite-compatible-readable-stream: ^3.6.1 vite-plugin-eslint: ^1.8.1 - vite-plugin-istanbul: ^4.1.0 + vite-plugin-istanbul: ^5.0.0 vite-plugin-node-polyfills: ^0.8.2 vite-plugin-svgr: ^3.2.0 vite-tsconfig-paths: ^4.2.0 @@ -14837,17 +14837,18 @@ __metadata: languageName: node linkType: hard -"vite-plugin-istanbul@npm:^4.1.0": - version: 4.1.0 - resolution: "vite-plugin-istanbul@npm:4.1.0" +"vite-plugin-istanbul@npm:^5.0.0": + version: 5.0.0 + resolution: "vite-plugin-istanbul@npm:5.0.0" dependencies: "@istanbuljs/load-nyc-config": ^1.1.0 + espree: ^9.6.1 istanbul-lib-instrument: ^5.1.0 picocolors: ^1.0.0 test-exclude: ^6.0.0 peerDependencies: vite: ">=2.9.1 <= 5" - checksum: b7b766638ec8d8f261ea758c61bdfeb66e00b1dbdd456db93e9541dd13dce63a4707faeeb888b516f7150a5cdb10fa8775dfdc314a39e975f8ca15d26c11c50b + checksum: 1d5d7a91eecd3356a7ceba60f437ee1b5a3db53e8a928d7476fe2919ff1e101c2e0c0b87c8c9680cef72c0158ced1a75d56e9f5cc6f4f427dfe670c62ecdeec1 languageName: node linkType: hard