Merge pull request #35 from sjetha/add_cypress_coverage

Switch to using Cypress code coverage

Author: sardapv

.github/workflows/coverage.yml

@@ -36,8 +36,14 @@ jobs:
       - name: Install dependencies
         run: npm install
 
-      - name: Run the tests
-        run: npm test -- --coverage
+      - name: Run unit tests
+        run: npm run test:coverage
+
+      - name: Run Cypress tests
+        run: npm run e2e:ci
+
+      - name: Convert test results
+        run: npx nyc report --reporter=lcov
 
       - name: Upload coverage to Codecov
         uses: codecov/codecov-action@v1

.gitignore

@@ -38,6 +38,7 @@ speed-measure-plugin*.json
 /.sass-cache
 /connect.lock
 /coverage
+/.nyc_output
 /libpeerconnection.log
 npm-debug.log
 yarn-error.log

.prettierignore

@@ -2,7 +2,4 @@ package.json
 package-lock.json
 dist
 build
-cypress
-e2e
-node_modules
-environments
+node_modules

.prettierrc

@@ -1,9 +1,9 @@
 {
-    "tabWidth": 2,
-    "printWidth": 120,
-    "useTabs": false,
-    "semi": true,
-    "singleQuote": true,
-    "quoteProps": "as-needed",
-    "bracketSpacing": true,
-}
+  "tabWidth": 2,
+  "printWidth": 120,
+  "useTabs": false,
+  "semi": true,
+  "singleQuote": true,
+  "quoteProps": "as-needed",
+  "bracketSpacing": true
+}

angular.json

@@ -26,17 +26,10 @@
             "polyfills": "src/polyfills.ts",
             "tsConfig": "src/tsconfig.app.json",
             "inlineStyleLanguage": "scss",
-            "assets": [
-              "src/favicon.ico",
-              "src/assets"
-            ],
-            "styles": [
-              "src/styles/styles.scss"
-            ],
+            "assets": ["src/favicon.ico", "src/assets"],
+            "styles": ["src/styles/styles.scss"],
             "stylePreprocessorOptions": {
-              "includePaths": [
-                "src/styles/shared"
-              ]
+              "includePaths": ["src/styles/shared"]
             },
             "scripts": []
           },
@@ -80,7 +73,7 @@
           "defaultConfiguration": "production"
         },
         "serve": {
-          "builder": "@angular-devkit/build-angular:dev-server",
+          "builder": "ngx-build-plus:dev-server",
           "configurations": {
             "production": {
               "browserTarget": "ng-new-app:build:production"
@@ -89,7 +82,8 @@
               "browserTarget": "ng-new-app:build:development"
             }
           },
-          "defaultConfiguration": "development"
+          "defaultConfiguration": "development",
+          "options": { "browserTarget": "ng-new-app:build", "extraWebpackConfig": "./cypress/coverage.webpack.js" }
         },
         "extract-i18n": {
           "builder": "@angular-devkit/build-angular:extract-i18n",
@@ -103,24 +97,16 @@
             "polyfills": "src/polyfills.ts",
             "tsConfig": "tsconfig.spec.json",
             "inlineStyleLanguage": "scss",
-            "assets": [
-              "src/favicon.ico",
-              "src/assets"
-            ],
-            "styles": [
-              "src/styles.scss"
-            ],
+            "assets": ["src/favicon.ico", "src/assets"],
+            "styles": ["src/styles.scss"],
             "scripts": []
           }
         },
         "lint": {
           "builder": "@angular-eslint/builder:lint",
           "options": {
-            "lintFilePatterns": [
-              "src/**/*.ts",
-              "src/**/*.html"
-            ]
-         }
+            "lintFilePatterns": ["src/**/*.ts", "src/**/*.html"]
+          }
         },
         "cypress-run": {
           "builder": "@briebug/cypress-schematic:cypress",

cypress/coverage.webpack.js

@@ -0,0 +1,14 @@
+module.exports = {
+  module: {
+    rules: [
+      {
+        test: /\.(js|ts)$/,
+        loader: 'istanbul-instrumenter-loader',
+        options: { esModules: true },
+        enforce: 'post',
+        include: require('path').join(__dirname, '..', 'src'),
+        exclude: [/\.(e2e|spec)\.ts$/, /node_modules/, /(ngfactory|ngstyle)\.js/],
+      },
+    ],
+  },
+};

cypress/plugins/index.js

@@ -1 +1,4 @@
-module.exports = (on, config) => {};
+module.exports = (on, config) => {
+  require('@cypress/code-coverage/task')(on, config);
+  return config;
+};

cypress/support/index.ts

@@ -15,3 +15,4 @@
 
 // When a command from ./commands is ready to use, import with `import './commands'` syntax
 // import './commands';
+import '@cypress/code-coverage/support';

jest.config.js

@@ -8,7 +8,7 @@ module.exports = {
   preset: 'jest-preset-angular',
   setupFilesAfterEnv: ['../setup-jest.ts'],
   collectCoverage: true,
-  coverageReporters: ['json', 'html', 'text'],
-  coverageDirectory: '../coverage/',
+  coverageReporters: ['lcov'],
+  coverageDirectory: '../coverage/jest',
   collectCoverageFrom: ['**/*.ts'],
 };