Merge pull request #47 from valor-software/chore-coverage

Chore coverage

Author: Georgii Rychko

karma.conf.js

@@ -1,26 +1,34 @@
 'use strict';
 
 module.exports = config => {
-    config.set({
-        autoWatch: true,
-        browsers: ['PhantomJS'],
-        files: [
-            {pattern: 'test.bundle.js',  watched: false}
-        ],
-        frameworks: ['jasmine'],
-        logLevel: config.LOG_INFO,
-        phantomJsLauncher: {
-            exitOnResourceError: true
-        },
-        port: 9876,
-        preprocessors: {
-            'test.bundle.js': ['webpack', 'sourcemap']
-        },
-        reporters: ['spec'],
-        singleRun: true,
-        webpack: require('./webpack.test.js'),
-        webpackServer: {
-            noInfo: true
-        }
-    });
+  config.set({
+    autoWatch: true,
+    browsers: ['PhantomJS'],
+    files: [
+      { pattern: 'test.bundle.js', watched: false }
+    ],
+    frameworks: ['jasmine'],
+    logLevel: config.LOG_INFO,
+    phantomJsLauncher: {
+      exitOnResourceError: true
+    },
+    port: 9876,
+    preprocessors: {
+      'test.bundle.js': ['webpack', 'sourcemap']
+    },
+    reporters: process.env.COVERAGE === 'enabled' ? ['spec', 'karma-remap-istanbul'] : ['spec'],
+    remapIstanbulReporter: {
+      reports: {
+        html: 'coverage'
+      }
+    },
+    coverageReporter: {
+      includeAllSources: true
+    },
+    singleRun: true,
+    webpack: require('./webpack.test.js'),
+    webpackServer: {
+      noInfo: true
+    }
+  });
 };

package.json

@@ -34,7 +34,7 @@
     "flow.compile": "npm run flow.compile:common && npm run flow.compile:system",
     "flow.compile:common": "ngc -p tsconfig-aot.json",
     "flow.compile:system": "node umd-bundler.js",
-    "flow.clean": "rimraf build demo-dist dist bundles factories",
+    "flow.clean": "rimraf coverage build demo-dist dist bundles factories",
     "flow.deploy:gh-pages": "npm run flow.build && gulp deploy",
     "flow.tslint": "tslint \"**/*.ts\" -c tslint.json --type-check -t prose -e \"node_modules/**\" -e \"test/**\" -e \"factories/**\" -e \"dist/**\" -e \"demo/**\" -e \"demo-dist/**\"",
     "flow.lint": "npm run flow.tslint",
@@ -43,7 +43,8 @@
     "pre:publish": "npm run flow.clean && npm run flow.lint && npm run test && npm run flow.compile && mkdir -p dist && cp src/styles.css dist && cp README.md dist && cp --parents media/* dist",
     "post:publish": "npm run flow.deploy:gh-pages",
     "start": "npm run flow.serve",
-    "test": "karma start karma.conf.js"
+    "test": "npm run flow.clean && karma start karma.conf.js",
+    "test:cover": "COVERAGE=enabled npm run test"
   },
   "devDependencies": {
     "@angular/common": "2.4.5",
@@ -63,14 +64,15 @@
     "codelyzer": "~2.0.0-beta.4",
     "core-js": "2.4.1",
     "css-loader": "0.26.1",
-    "del": "2.2.2",
     "gulp": "3.9.1",
     "gulp-gh-pages": "0.5.4",
+    "istanbul-instrumenter-loader": "2.0.0",
     "jasmine-core": "2.5.2",
     "karma": "1.4.0",
-    "karma-chrome-launcher": "2.0.0",
+    "karma-coverage-istanbul-reporter": "0.2.0",
     "karma-jasmine": "1.1.0",
     "karma-phantomjs-launcher": "github:karma-runner/karma-phantomjs-launcher",
+    "karma-remap-istanbul": "0.6.0",
     "karma-sourcemap-loader": "0.3.7",
     "karma-spec-reporter": "0.0.26",
     "karma-webpack": "1.8.1",

src/tree-internal.component.ts

@@ -14,18 +14,18 @@ import { NodeDraggableEvent } from './draggable/draggable.events';
   <ul class="tree" *ngIf="tree" [ngClass]="{rootless: isRootHidden()}">
     <li>
       <div class="value-container"
-        [ngClass]="{rootless: isRootHidden()}" 
-        (contextmenu)="showMenu($event)" 
+        [ngClass]="{rootless: isRootHidden()}"
+        (contextmenu)="showMenu($event)"
         [nodeDraggable]="element"
         [tree]="tree">
 
         <div class="folding" (click)="tree.switchFoldingType()" [ngClass]="tree.foldingType.cssClass"></div>
-        <div class="node-value" 
-          *ngIf="!shouldShowInputForTreeValue()" 
-          [class.node-selected]="isSelected" 
+        <div class="node-value"
+          *ngIf="!shouldShowInputForTreeValue()"
+          [class.node-selected]="isSelected"
           (click)="onNodeSelected($event)">{{tree.value}}</div>
 
-        <input type="text" class="node-value" 
+        <input type="text" class="node-value"
            *ngIf="shouldShowInputForTreeValue()"
            [nodeEditable]="tree.value"
            (valueChanged)="applyNewValue($event)"/>

test/tree.components.spec.ts

@@ -0,0 +1,63 @@
+import { TestBed, ComponentFixture } from '@angular/core/testing';
+import { By } from '@angular/platform-browser';
+import { Component, DebugElement } from '@angular/core';
+import { TreeInternalComponent } from '../src/tree-internal.component';
+import { TreeComponent } from '../src/tree.component';
+import { TreeModel } from '../src/tree.types';
+import { TreeService } from '../src/tree.service';
+import { NodeMenuService } from '../src/menu/node-menu.service';
+import { NodeMenuComponent } from '../src/menu/node-menu.component';
+import { NodeDraggableService } from '../src/draggable/node-draggable.service';
+import { NodeDraggableDirective } from '../src/draggable/node-draggable.directive';
+import { NodeEditableDirective } from '../src/editable/node-editable.directive';
+
+let fixture: ComponentFixture<TestComponent>;
+let componentInstance: TreeComponent;
+let componentEl: DebugElement;
+
+describe('TreeComponent (the one that wraps TreeInternalComponent)', () => {
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      declarations: [TestComponent, TreeInternalComponent, TreeComponent, NodeEditableDirective, NodeMenuComponent, NodeDraggableDirective],
+      providers: [NodeMenuService, NodeDraggableService, TreeService]
+    });
+
+    fixture = TestBed.createComponent(TestComponent);
+    componentEl = fixture.debugElement.query(By.directive(TreeComponent));
+    componentInstance = componentEl.componentInstance;
+
+    fixture.detectChanges();
+  });
+
+  it('should be initialized', () => {
+    expect(fixture).not.toBeNull();
+    expect(componentInstance.tree).not.toBeFalsy();
+  });
+
+  it('should have default empty tree if none was given via input', () => {
+    expect(componentInstance.tree.value).toEqual('');
+    expect(componentInstance.tree.isRoot()).toEqual(true);
+    expect(componentInstance.treeModel).toBeFalsy();
+    expect(componentInstance.tree.children).toBeFalsy();
+  });
+
+  it('should use given model if it is not falsy', () => {
+    fixture.debugElement.componentInstance.model = {
+      value: '42'
+    };
+
+    fixture.detectChanges();
+
+    expect(componentInstance.tree.value).toEqual('42');
+    expect(componentInstance.treeModel.value).toEqual('42');
+  });
+});
+
+@Component({
+  template: `
+    <div><tree [tree]="model"></tree></div>
+  `
+})
+class TestComponent {
+  public model: TreeModel;
+}

tsconfig.json

@@ -5,7 +5,7 @@
     "moduleResolution": "node",
     "emitDecoratorMetadata": true,
     "experimentalDecorators": true,
-    "sourceMap": false,
+    "sourceMap": true,
     "noImplicitAny": false,
     "removeComments": true,
     "declaration": false,

webpack.test.js

@@ -1,18 +1,30 @@
 'use strict';
 
 const path = require('path');
+const SRC = path.resolve('src');
 
 module.exports = {
-    devtool: 'inline-source-map',
-    module: {
-        loaders: [
-            { loader: 'raw', test: /\.(css|html)$/ },
-            { exclude: /node_modules/, loader: 'ts', test: /\.ts$/ }
+  // devtool: 'inline-source-map',
+  module: {
+    postLoaders: [
+      {
+        test: /\.(ts)$/,
+        loader: 'istanbul-instrumenter-loader',
+        include: SRC,
+        exclude: [
+          /\.(e2e|spec)\.ts$/,
+          /node_modules/
         ]
-    },
-    resolve: {
-        extensions: ['', '.js', '.ts'],
-        modulesDirectories: ['node_modules'],
-        root: path.resolve('.', 'src')
-    }
+      }
+    ],
+    loaders: [
+      { loader: 'raw', test: /\.(css|html)$/ },
+      { exclude: /node_modules/, loader: 'ts', test: /\.ts$/ }
+    ]
+  },
+  resolve: {
+    extensions: ['', '.js', '.ts'],
+    modulesDirectories: ['node_modules'],
+    root: SRC
+  }
 };