Set up Cypress component testing.

I had to do manually:

* Add command `npx nx ct` into `angular.json`.
* Configure video and screenshot folder paths so they are automatically git ignored.

angular.json

@@ -91,6 +91,15 @@
             "jestConfig": "apps/test-project/jest.config.js",
             "passWithNoTests": true
           }
+        },
+        "ct": {
+          "builder": "@nrwl/cypress:cypress",
+          "options": {
+            "cypressConfig": "apps/test-project/cypress.json",
+            "tsConfig": "apps/test-project/tsconfig.cypress.json",
+            "devServerTarget": "",
+            "testingType": "component"
+          }
         }
       }
     },

apps/test-project/cypress.json

@@ -0,0 +1,10 @@
+{
+  "pluginsFile": "./cypress/plugins/index.ts",
+  "supportFile": "./cypress/support/index.ts",
+  "component": {
+    "testFiles": "**/*.cy-spec.{js,ts,jsx,tsx}",
+    "componentFolder": "./src",
+    "videosFolder": "../../dist/cypress/apps/test-project/videos",
+    "screenshotsFolder": "../../dist/cypress/apps/test-project/screenshots"
+  }
+}

apps/test-project/cypress/plugins/index.ts

@@ -0,0 +1,8 @@
+import { startAngularDevServer } from '@jscutlery/cypress-angular';
+
+module.exports = (on, config) => {
+  on('dev-server:start', (options) =>
+    startAngularDevServer({ options, tsConfig: 'tsconfig.cypress.json' })
+  );
+  return config;
+};

apps/test-project/cypress/support/index.ts

@@ -0,0 +1 @@
+import '@jscutlery/cypress-angular/support';

apps/test-project/src/sample.cy-spec.ts

@@ -0,0 +1,14 @@
+import { Component } from '@angular/core';
+import { mount } from '@jscutlery/cypress-angular/mount';
+
+@Component({
+  template: `<h1>👋 Hello!</h1>`,
+})
+export class GreetingsComponent {}
+
+describe('greetings', () => {
+  it('should say hello', () => {
+    mount(GreetingsComponent);
+    cy.get('h1').contains('👋 Hello!');
+  });
+});

apps/test-project/tsconfig.cypress.json

@@ -0,0 +1,8 @@
+{
+  "extends": "../../tsconfig.base.json",
+  "compilerOptions": {
+    "allowSyntheticDefaultImports": true,
+    "types": ["cypress"]
+  },
+  "include": ["cypress/support/**/*.ts", "**/*.cy-spec.ts"]
+}

apps/test-project/tsconfig.json

@@ -11,6 +11,9 @@
     },
     {
       "path": "./tsconfig.editor.json"
+    },
+    {
+      "path": "./tsconfig.cypress.json"
     }
   ],
   "compilerOptions": {