Merge pull request #234 from bwsw/angular-cli

Angular CLI integration

Author: zolotyx

.angular-cli.json

@@ -0,0 +1,59 @@
+{
+  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "project": {
+    "name": "cloudstack-ui"
+  },
+  "apps": [
+    {
+      "root": "src",
+      "outDir": "dist",
+      "assets": [
+        "config",
+        "i18n",
+        "css",
+        "img"
+      ],
+      "index": "index.html",
+      "main": "main.ts",
+      "polyfills": "polyfills.ts",
+      "test": "test.ts",
+      "tsconfig": "tsconfig.app.json",
+      "testTsconfig": "tsconfig.spec.json",
+      "prefix": "cs",
+      "styles": [
+        "style/app.scss"
+      ],
+      "scripts": [],
+      "environmentSource": "environments/environment.ts",
+      "environments": {
+        "dev": "environments/environment.ts",
+        "prod": "environments/environment.prod.ts"
+      }
+    }
+  ],
+  "e2e": {
+    "protractor": {
+      "config": "./protractor.conf.js"
+    }
+  },
+  "lint": [
+    {
+      "project": "src/tsconfig.app.json"
+    },
+    {
+      "project": "src/tsconfig.spec.json"
+    },
+    {
+      "project": "e2e/tsconfig.e2e.json"
+    }
+  ],
+  "test": {
+    "karma": {
+      "config": "./karma.conf.js"
+    }
+  },
+  "defaults": {
+    "styleExt": "scss",
+    "component": {}
+  }
+}

e2e/app.e2e-spec.ts

@@ -0,0 +1,14 @@
+import { CloudstackUiPage } from './app.po';
+
+describe('cloudstack-ui App', () => {
+  let page: CloudstackUiPage;
+
+  beforeEach(() => {
+    page = new CloudstackUiPage();
+  });
+
+  it('should display welcome message', () => {
+    page.navigateTo();
+    expect(page.getParagraphText()).toEqual('Welcome to app!!');
+  });
+});

e2e/app.po.ts

@@ -0,0 +1,11 @@
+import { browser, by, element } from 'protractor';
+
+export class CloudstackUiPage {
+  navigateTo() {
+    return browser.get('/');
+  }
+
+  getParagraphText() {
+    return element(by.css('app-root h1')).getText();
+  }
+}

e2e/tsconfig.e2e.json

@@ -0,0 +1,12 @@
+{
+  "extends": "../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../out-tsc/e2e",
+    "module": "commonjs",
+    "target": "es5",
+    "types": [
+      "jasmine",
+      "node"
+    ]
+  }
+}

karma-shim.js

@@ -1,68 +1,47 @@
-var path = require('path');
-
-var webpackConfig = require('./webpack.config');
-
-var ENV = process.env.npm_lifecycle_event;
-var isTestWatch = ENV === 'test-watch';
+// Karma configuration file, see link for more information
+// https://karma-runner.github.io/0.13/config/configuration-file.html
 
 module.exports = function (config) {
-  var _config = {
-
-    // base path that will be used to resolve all patterns (eg. files, exclude)
+  config.set({
     basePath: '',
-
-    // frameworks to use
-    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
-    frameworks: ['jasmine'],
-
-    // list of files / patterns to load in the browser
-    files: [
-      { pattern: './karma-shim.js', watched: false }
+    frameworks: ['jasmine', '@angular/cli'],
+    plugins: [
+      require('karma-jasmine'),
+      require('karma-chrome-launcher'),
+      require('karma-junit-reporter'),
+      require('karma-mocha-reporter'),
+      require('karma-jasmine-html-reporter'),
+      require('karma-coverage-istanbul-reporter'),
+      require('@angular/cli/plugins/karma')
     ],
-
-    // list of files to exclude
-    exclude: [],
-
-    // preprocess matching files before serving them to the browser
-    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
-    preprocessors: {
-      './karma-shim.js': ['webpack', 'sourcemap']
+    client: {
+      clearContext: false // leave Jasmine Spec Runner output visible in browser
     },
-
-    webpack: webpackConfig,
-
-    webpackMiddleware: {
-      // webpack-dev-middleware configuration
-      // i. e.
-      stats: 'errors-only'
+    coverageIstanbulReporter: {
+      dir: 'reports/coverage',
+      'report-config': {
+        cobertura: {
+          file: 'cobertura/cobertura.xml'
+        }
+      },
+      reports: ['html', 'lcovonly', 'cobertura'],
+      fixWebpackSourcePaths: true
     },
-
-    webpackServer: {
-      noInfo: true // please don't spam the console when running in karma!
+    angularCli: {
+      environment: 'dev'
     },
-
-    // test results reporter to use
-    // possible values: 'dots', 'progress', 'mocha'
-    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
-    reporters: ['mocha'],
-
-    // web server port
+    reporters: ['mocha', 'junit', 'kjhtml', 'coverage-istanbul'],
     port: 9876,
-
-    // enable / disable colors in the output (reporters and logs)
+    junitReporter: {
+      outputDir: 'reports', // results will be saved as $outputDir/$browserName.xml
+      outputFile: 'junit.xml', // if included, results will be saved as $outputDir/$browserName/$outputFile
+      suite: '', // suite will become the package name attribute in xml testsuite element
+      useBrowserName: false // add browser name to report and classes names
+    },
     colors: true,
-
-    // level of logging
-    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
     logLevel: config.LOG_INFO,
-
-    // enable / disable watching file and executing tests whenever any file changes
-    autoWatch: false,
-
-    // start these browsers
-    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
-    browsers: isTestWatch ? ['Chrome'] : ['ChromeHeadless'],
-
+    autoWatch: true,
+    browsers: ['ChromeHeadless'],
     customLaunchers: {
       ChromeHeadless: {
         base: 'Chrome',
@@ -74,40 +53,6 @@ module.exports = function (config) {
         ]
       }
     },
-
-    // Continuous Integration mode
-    // if true, Karma captures browsers, runs the tests and exits
-    singleRun: true
-  };
-
-  if (!isTestWatch) {
-    _config.reporters.push('coverage');
-    _config.reporters.push('junit');
-
-    _config.junitReporter = {
-      outputDir: 'reports', // results will be saved as $outputDir/$browserName.xml
-      outputFile: 'junit.xml', // if included, results will be saved as $outputDir/$browserName/$outputFile
-      suite: '', // suite will become the package name attribute in xml testsuite element
-      useBrowserName: false // add browser name to report and classes names
-    };
-
-    _config.coverageReporter = {
-      dir: 'reports/',
-      reporters: [
-        {
-          type: 'json',
-          subdir: 'coverage/json',
-          file: 'coverage-final.json'
-        },
-        {
-          type: 'cobertura',
-          subdir: 'coverage/cobertura',
-          file: 'cobertura.xml'
-        }
-      ]
-    };
-  }
-
-  config.set(_config);
-
+    singleRun: false
+  });
 };