Upgrade packages

- @angular/cli ^1.2.0
- @angular to ^4.0.0

Author: qjon

.angular-cli.json

@@ -15,8 +15,9 @@
       "index": "index.html",
       "main": "main.ts",
       "polyfills": "polyfills.ts",
-      "test": "test.ts",
+      "test": "../../src/test.ts",
       "tsconfig": "tsconfig.json",
+      "testTsconfig": "../../src/tsconfig.spec.json",
       "prefix": "app",
       "styles": [
         "../../node_modules/bootstrap/dist/css/bootstrap.css",
@@ -31,14 +32,20 @@
       }
     }
   ],
+  "e2e": {
+    "protractor": {
+      "config": "./protractor.conf.js"
+    }
+  },
   "lint": [
     {
-      "files": "src/**/*.ts",
-      "project": "src/tsconfig.json"
+      "project": "src/tsconfig.app.json"
+    },
+    {
+      "project": "src/tsconfig.spec.json"
     },
     {
-      "files": "e2e/**/*.ts",
-      "project": "e2e/tsconfig.json"
+      "project": "e2e/tsconfig.e2e.json"
     }
   ],
   "test": {

demo/src/main.ts

@@ -2,7 +2,7 @@ import {enableProdMode} from '@angular/core';
 import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
 
 import {AppModule} from './app/app.module';
-import {environment} from './environments/environment';
+import {environment} from '../../environments/environment';
 
 if (environment.production) {
   enableProdMode();

demo/src/tsconfig.json

@@ -1,4 +1,5 @@
 {
+  "compileOnSave": false,
   "compilerOptions": {
     "baseUrl": "",
     "declaration": false,

demo/src/environments/environment.prod.ts renamed to environments/environment.prod.ts

@@ -12,29 +12,17 @@ module.exports = function (config) {
       require('karma-coverage-istanbul-reporter'),
       require('@angular/cli/plugins/karma')
     ],
-    client:{
+    client: {
       clearContext: false // leave Jasmine Spec Runner output visible in browser
     },
-    files: [
-      { pattern: './src/test.ts', watched: false }
-    ],
-    preprocessors: {
-      './src/test.ts': ['@angular/cli']
-    },
-    mime: {
-      'text/x-typescript': ['ts','tsx']
-    },
     coverageIstanbulReporter: {
-      reports: [ 'html', 'lcovonly' ],
+      reports: ['html', 'lcovonly'],
       fixWebpackSourcePaths: true
     },
     angularCli: {
-      config: './.angular-cli.json',
       environment: 'dev'
     },
-    reporters: config.angularCli && config.angularCli.codeCoverage
-              ? ['progress', 'coverage-istanbul']
-              : ['progress', 'kjhtml'],
+    reporters: ['progress', 'kjhtml'],
     port: 9876,
     colors: true,
     logLevel: config.LOG_INFO,

demo/src/environments/environment.ts renamed to environments/environment.ts

@@ -5,6 +5,9 @@
   "angular-cli": {},
   "scripts": {
     "start": "ng serve",
+    "build": "ng build",
+    "lint": "ng lint",
+    "e2e": "ng e2e",
     "test": "./node_modules/.bin/karma --config karma.conf.js start",
     "gh-pages" : "ng build --env=prod --base-href \"https://qjon.github.io/angular2-tree/\" &&  ./node_modules/.bin/angular-cli-ghpages -b gh-pages  --name=\"Rafał Ignaszewski\" --email=\"[email protected]\" --no-silent"
   },
@@ -15,45 +18,48 @@
   "main": "main",
   "author": "Rafal Ignaszewski <[email protected]> http://ignaszewski.pl",
   "dependencies": {
-    "@angular/common": "^2.4.0",
-    "@angular/compiler": "^2.4.0",
-    "@angular/core": "^2.4.0",
-    "@angular/forms": "^2.4.0",
-    "@angular/http": "^2.4.0",
-    "@angular/platform-browser": "^2.4.0",
-    "@angular/platform-browser-dynamic": "^2.4.0",
-    "@angular/router": "^3.4.0",
+    "@angular/animations": "^4.0.0",
+    "@angular/common": "^4.0.0",
+    "@angular/compiler": "^4.0.0",
+    "@angular/core": "^4.0.0",
+    "@angular/forms": "^4.0.0",
+    "@angular/http": "^4.0.0",
+    "@angular/platform-browser": "^4.0.0",
+    "@angular/platform-browser-dynamic": "^4.0.0",
+    "@angular/router": "^4.0.0",
+    "zone.js": "^0.8.4",
     "@ngrx/core": "^1.2.0",
     "@ngrx/effects": "^2.0.3",
+    "core-js": "^2.4.1",
     "@ngrx/store": "^2.2.2",
     "angular2-contextmenu": "^0.7.7",
     "angular2-uuid": "^1.1.1",
     "bootstrap": "^3.3.7",
-    "core-js": "^2.4.1",
     "font-awesome": "^4.6.3",
     "ng2-dnd": "^2.2.2",
-    "rxjs": "^5.1.0",
-    "zone.js": "^0.7.6"
+    "rxjs": "^5.1.0"
   },
   "devDependencies": {
-    "@angular/cli": "1.0.0-beta.32.3",
-    "@angular/compiler-cli": "^2.4.0",
+    "@angular/cli": "1.2.0",
+    "@angular/compiler-cli": "^4.0.0",
+    "@angular/language-service": "^4.0.0",
     "@ngrx/store-devtools": "^3.2.4",
-    "@types/jasmine": "2.5.38",
+    "@types/jasmine": "~2.5.53",
+    "@types/jasminewd2": "~2.0.2",
     "@types/node": "~6.0.60",
     "angular-cli-ghpages": "^0.5.1",
-    "codelyzer": "~2.0.0-beta.4",
-    "jasmine-core": "~2.5.2",
-    "jasmine-spec-reporter": "~3.2.0",
-    "karma": "~1.4.1",
-    "karma-chrome-launcher": "~2.0.0",
+    "codelyzer": "~3.0.1",
+    "jasmine-core": "~2.6.2",
+    "jasmine-spec-reporter": "~4.1.0",
+    "karma": "~1.7.0",
+    "karma-chrome-launcher": "~2.1.1",
     "karma-cli": "~1.0.1",
-    "karma-coverage-istanbul-reporter": "^0.2.0",
+    "karma-coverage-istanbul-reporter": "^1.2.1",
     "karma-jasmine": "~1.1.0",
     "karma-jasmine-html-reporter": "^0.2.2",
-    "protractor": "~5.1.0",
-    "ts-node": "~2.0.0",
-    "tslint": "~4.4.2",
-    "typescript": "~2.0.0"
+    "protractor": "~5.1.2",
+    "ts-node": "~3.0.4",
+    "tslint": "~5.3.2",
+    "typescript": "~2.3.3"
   }
 }

karma.conf.js

@@ -35,7 +35,7 @@ describe('TreeModel', () => {
 
   describe('getRootNodes', () => {
     it('should return what getChildren return', () => {
-      const expectedValue = [];
+      const expectedValue = Observable.of([]);
 
       spyOn(treeModel, 'getChildren').and.returnValue(expectedValue)
 

package.json

@@ -1,7 +1,7 @@
 import {IOuterNode} from '../interfaces/IOuterNode';
 import {Observable} from 'rxjs/Observable';
 import {IConfiguration} from '../interfaces/IConfiguration';
-import {ITreeData, ITreeState} from '../store/ITreeState';
+import {ITreeData} from '../store/ITreeState';
 import {BehaviorSubject} from 'rxjs/BehaviorSubject';
 
 export class TreeModel {
@@ -22,7 +22,7 @@ export class TreeModel {
 
   public getChildren(nodeId: string | null) {
     return this.nodes$
-      .map((state: ITreeData) => this.getNodesByParentId(state, nodeId))
+      .map((state: ITreeData): IOuterNode[] => this.getNodesByParentId(state, nodeId))
       .map((nodes: IOuterNode[]) => {
         return nodes.sort(this.sortNodes);
       });

src/models/TreeModel.spec.ts

@@ -82,7 +82,7 @@ function insertNode(state: ITreeState, action: Action): ITreeState {
     parents: []
   };
 
-  newState[action.payload.treeId][null] = newNode;
+  newState[action.payload.treeId][0] = newNode;
 
   return newState;
 }
@@ -94,8 +94,8 @@ function saveNode(state: ITreeState, action: ITreeAction): ITreeState {
   const treeId = action.payload.treeId;
   const treeState = newState[treeId];
 
-  if (treeState[null]) {
-    delete treeState[null];
+  if (treeState[0]) {
+    delete treeState[0];
   } else {
     delete treeState[old.id];
   }

src/models/TreeModel.ts

@@ -12,6 +12,8 @@ import {
   platformBrowserDynamicTesting
 } from '@angular/platform-browser-dynamic/testing';
 
+import 'rxjs/Rx';
+
 // Unfortunately there's no typing for the `__karma__` variable. Just declare it as any.
 declare const __karma__: any;
 declare const require: any;

src/store/treeReducer.ts

@@ -0,0 +1,20 @@
+{
+  "extends": "../demo/src/tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../out-tsc/spec",
+    "module": "commonjs",
+    "target": "es5",
+    "baseUrl": "",
+    "types": [
+      "jasmine",
+      "node"
+    ]
+  },
+  "files": [
+    "test.ts"
+  ],
+  "include": [
+    "**/*.spec.ts",
+    "**/*.d.ts"
+  ]
+}