WIP: Update Example App to angular v7, angular-redux v9

.prettierignore

@@ -1,2 +1,3 @@
 dist
 coverage
+angular.json

jest/tests-setup.ts

@@ -11,14 +11,14 @@ import 'zone.js/dist/sync-test';
 // tslint:disable-next-line:ordered-imports
 import 'jest-zone-patch';
 
-import { TestBed } from '@angular/core/testing';
+import { getTestBed } from '@angular/core/testing';
 import {
   BrowserDynamicTestingModule,
   platformBrowserDynamicTesting,
 } from '@angular/platform-browser-dynamic/testing';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
 
-TestBed.initTestEnvironment(
+getTestBed().initTestEnvironment(
   [BrowserDynamicTestingModule, NoopAnimationsModule],
   platformBrowserDynamicTesting(),
 );

package.json

@@ -34,40 +34,40 @@
     ]
   },
   "devDependencies": {
-    "@angular/animations": "6.0.7",
-    "@angular/common": "6.0.7",
-    "@angular/compiler": "6.0.7",
-    "@angular/compiler-cli": "6.0.7",
-    "@angular/core": "6.0.7",
-    "@angular/forms": "6.0.7",
-    "@angular/platform-browser": "6.0.7",
-    "@angular/platform-browser-dynamic": "6.0.7",
-    "@angular/router": "6.0.7",
+    "@angular/animations": "7.1.4",
+    "@angular/common": "7.1.4",
+    "@angular/compiler": "7.1.4",
+    "@angular/compiler-cli": "7.1.4",
+    "@angular/core": "7.1.4",
+    "@angular/forms": "7.1.4",
+    "@angular/platform-browser": "7.1.4",
+    "@angular/platform-browser-dynamic": "7.1.4",
+    "@angular/router": "7.1.4",
     "@commitlint/cli": "7.0.0",
     "@commitlint/config-conventional": "7.0.1",
     "@commitlint/prompt-cli": "7.0.0",
     "@types/jest": "23.1.6",
     "babel-core": "6.26.3",
     "babel-jest": "23.4.2",
-    "codelyzer": "4.4.2",
+    "codelyzer": "4.5.0",
     "husky": "1.1.3",
-    "jest": "23.4.1",
-    "jest-junit": "5.1.0",
-    "jest-preset-angular": "6.0.0",
+    "jest": "23.6.0",
+    "jest-junit": "5.2.0",
+    "jest-preset-angular": "6.0.2",
     "jest-zone-patch": "0.0.8",
     "lerna": "3.4.3",
     "lint-staged": "7.2.0",
-    "ng-packagr": "3.0.6",
+    "ng-packagr": "4.4.5",
     "npm-run-all": "4.1.3",
     "prettier": "1.13.7",
-    "redux": "4.0.0",
+    "redux": "4.0.1",
     "redux-logger": "2.10.2",
     "rimraf": "2.6.2",
-    "rxjs": "6.2.1",
+    "rxjs": "6.3.3",
     "tsickle": "0.32.1",
     "tslib": "1.9.3",
     "tslint": "5.11.0",
-    "typescript": "2.7.2",
+    "typescript": "3.1.6",
     "zone.js": "0.8.26"
   }
 }

packages/example-app/angular.json

@@ -0,0 +1,136 @@
+{
+  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "version": 1,
+  "newProjectRoot": "projects",
+  "projects": {
+    "example-app": {
+      "root": "",
+      "sourceRoot": "src",
+      "projectType": "application",
+      "prefix": "app",
+      "schematics": {
+        "@schematics/angular:component": {
+          "styleext": "css"
+        }
+      },
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:browser",
+          "options": {
+            "outputPath": "dist/example-app",
+            "index": "src/index.html",
+            "main": "src/main.ts",
+            "polyfills": "src/polyfills.ts",
+            "tsConfig": "src/tsconfig.app.json",
+            "assets": [
+              "src/favicon.ico",
+              "src/assets"
+            ],
+            "styles": [
+              "src/styles.css"
+            ],
+            "scripts": []
+          },
+          "configurations": {
+            "production": {
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.prod.ts"
+                }
+              ],
+              "optimization": true,
+              "outputHashing": "all",
+              "sourceMap": false,
+              "extractCss": true,
+              "namedChunks": false,
+              "aot": true,
+              "extractLicenses": true,
+              "vendorChunk": false,
+              "buildOptimizer": true,
+              "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "2mb",
+                  "maximumError": "5mb"
+                }
+              ]
+            }
+          }
+        },
+        "serve": {
+          "builder": "@angular-devkit/build-angular:dev-server",
+          "options": {
+            "browserTarget": "example-app:build"
+          },
+          "configurations": {
+            "production": {
+              "browserTarget": "example-app:build:production"
+            }
+          }
+        },
+        "extract-i18n": {
+          "builder": "@angular-devkit/build-angular:extract-i18n",
+          "options": {
+            "browserTarget": "example-app:build"
+          }
+        },
+        "test": {
+          "builder": "@angular-builders/jest:run",
+          "options": {
+            "configPath": "../jest.config.js"
+          },
+          "configurations": {
+            "ci": {
+              "runInBand": true
+            }
+          }
+        },
+        "lint": {
+          "builder": "@angular-devkit/build-angular:tslint",
+          "options": {
+            "tsConfig": [
+              "src/tsconfig.app.json",
+              "src/tsconfig.spec.json"
+            ],
+            "exclude": [
+              "**/node_modules/**"
+            ]
+          }
+        }
+      }
+    },
+    "example-app-e2e": {
+      "root": "e2e/",
+      "projectType": "application",
+      "prefix": "",
+      "architect": {
+        "e2e": {
+          "builder": "@angular-devkit/build-angular:protractor",
+          "options": {
+            "protractorConfig": "e2e/protractor.conf.js",
+            "devServerTarget": "example-app:serve"
+          },
+          "configurations": {
+            "production": {
+              "devServerTarget": "example-app:serve:production"
+            }
+          }
+        },
+        "lint": {
+          "builder": "@angular-devkit/build-angular:tslint",
+          "options": {
+            "tsConfig": "e2e/tsconfig.e2e.json",
+            "exclude": [
+              "**/node_modules/**"
+            ]
+          }
+        }
+      }
+    }
+  },
+  "defaultProject": "example-app",
+  "cli": {
+    "packageManager": "yarn"
+  }
+}

packages/example-app/jest.config.js

@@ -0,0 +1,33 @@
+'use strict';
+
+// Jest JUnit Reporter config
+process.env.JEST_JUNIT_OUTPUT = './coverage/junit.xml';
+
+module.exports = {
+  globals: {
+    __TRANSFORM_HTML__: true,
+  },
+  transform: {
+    '^.+\\.(ts|js|html)$':
+      '<rootDir>/node_modules/jest-preset-angular/preprocessor.js',
+  },
+  testMatch: ['**/*.spec.{ts,js}'],
+  moduleFileExtensions: ['ts', 'js', 'html', 'json'],
+  setupTestFrameworkScriptFile: '<rootDir>/src/test.ts',
+  snapshotSerializers: [
+    '<rootDir>/node_modules/jest-preset-angular/AngularSnapshotSerializer.js',
+    '<rootDir>/node_modules/jest-preset-angular/HTMLCommentSerializer.js',
+  ],
+  moduleNameMapper: {
+    '\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$':
+      '<rootDir>/src/testing/file.mock.ts',
+  },
+  modulePathIgnorePatterns: ['dist'],
+  reporters: ['default', 'jest-junit'],
+  collectCoverageFrom: [
+    '**/packages/**/*.{ts,js}',
+    '!**/node_modules/**',
+    '!**/dist/**',
+  ],
+  coverageReporters: ['lcov', 'text-summary'],
+};

packages/example-app/package.json

@@ -6,7 +6,10 @@
   "scripts": {
     "ng": "ng",
     "start": "ng serve",
-    "build": "ng build"
+    "build": "ng build",
+    "test": "ng test",
+    "test:watch": "node --inspect node_modules/jest/bin/jest.js --watch --no-cache",
+    "test:ci": "ng test --runInBand"
   },
   "engines": {
     "node": ">=6.9.5"
@@ -15,30 +18,38 @@
     "@angular-redux/form": "latest",
     "@angular-redux/router": "latest",
     "@angular-redux/store": "latest",
-    "@angular/common": "^4.1.0",
-    "@angular/compiler": "^4.1.0",
-    "@angular/core": "^4.1.0",
-    "@angular/forms": "^4.1.0",
-    "@angular/http": "^4.1.0",
-    "@angular/platform-browser": "^4.1.0",
-    "@angular/platform-browser-dynamic": "^4.1.0",
-    "@angular/router": "^4.1.0",
+    "@angular/animations": "7.1.4",
+    "@angular/common": "^7.1.4",
+    "@angular/compiler": "^7.1.4",
+    "@angular/core": "^7.1.4",
+    "@angular/forms": "^7.1.4",
+    "@angular/http": "^7.1.4",
+    "@angular/platform-browser": "^7.1.4",
+    "@angular/platform-browser-dynamic": "^7.1.4",
+    "@angular/router": "^7.1.4",
     "core-js": "^2.4.1",
-    "flux-standard-action": "^1.2.0",
-    "ramda": "^0.23.0",
-    "redux": "^3.6.0",
+    "flux-standard-action": "^2.0.3",
+    "ramda": "^0.26.0",
+    "redux": "^4.0.1",
     "redux-logger": "^3.0.1",
-    "redux-observable": "^0.14.1",
-    "rxjs": "^5.3.0",
+    "redux-observable": "^1.0.0",
+    "rxjs": "^6.3.3",
     "zone.js": "^0.8.9"
   },
   "devDependencies": {
-    "@angular/cli": "1.7.3",
-    "@angular/compiler-cli": "^4.1.0",
-    "@types/node": "~6.0.71",
+    "@angular-builders/jest": "^7.1.1",
+    "@angular-devkit/build-angular": "^0.10.6",
+    "@angular/cli": "^7.0.6",
+    "@angular/compiler-cli": "^7.1.0",
+    "@types/jest": "^23.3.9",
+    "@types/node": "^10.12.10",
+    "@types/ramda": "^0.24.18",
     "@types/redux-logger": "^3.0.0",
-    "protractor": "~5.1.1",
-    "ts-node": "~3.0.2",
-    "typescript": "^2.4.1"
+    "jest": "^23.6.0",
+    "jest-junit": "5.2.0",
+    "jest-preset-angular": "6.0.2",
+    "protractor": "^5.4.1",
+    "ts-node": "^7.0.1",
+    "typescript": ">=3.1.1 < 3.2"
   }
 }

packages/example-app/src/app/animals/animal-list/component.spec.ts

@@ -11,7 +11,7 @@ class MockAnimalComponent {
   @Input() animalType: AnimalType;
 }
 
-xdescribe('AnimalListComponent', () => {
+describe('AnimalListComponent', () => {
   beforeEach(async(() => {
     TestBed.configureTestingModule({
       declarations: [AnimalListComponent, MockAnimalComponent],
@@ -21,7 +21,7 @@ xdescribe('AnimalListComponent', () => {
 
   it("should have as title 'Welcome to the Zoo'", async(() => {
     const fixture = TestBed.createComponent(AnimalListComponent);
-    const animalList = fixture.debugElement.componentInstance;
+    const animalList = fixture.componentInstance;
 
     animalList.animalsName = 'Wallabies';
     animalList.animalType = 'WALLABIES';