remove karma and add jest

examples/angular-cli/README.md

@@ -16,7 +16,7 @@ Run `ng build` to build the project. The build artifacts will be stored in the `
 
 ## Running unit tests
 
-Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
+Run `ng test` to execute the unit tests via [Jest](https://facebook.github.io/jest/).
 
 ## Running end-to-end tests
 

examples/angular-cli/jest-config/globalMocks.ts

@@ -0,0 +1,20 @@
+const mock = () => {
+    let storage = {};
+    return {
+      getItem: key => (key in storage ? storage[key] : null),
+      setItem: (key, value) => (storage[key] = value || ''),
+      removeItem: key => delete storage[key],
+      clear: () => (storage = {})
+    };
+  };
+  
+  Object.defineProperty(window, 'localStorage', {
+    value: mock()
+  });
+  Object.defineProperty(window, 'sessionStorage', {
+    value: mock()
+  });
+  Object.defineProperty(window, 'getComputedStyle', {
+    value: () => ['-webkit-appearance']
+  });
+  

examples/angular-cli/jest-config/setup.ts

@@ -0,0 +1,2 @@
+import 'jest-preset-angular';
+import './globalMocks';

examples/angular-cli/karma.conf.js

@@ -1,35 +0,0 @@
-/*eslint-disable*/
-// Karma configuration file, see link for more information
-// https://karma-runner.github.io/0.13/config/configuration-file.html
-
-module.exports = function(config) {
-  config.set({
-    basePath: '',
-    frameworks: ['jasmine', '@angular/cli'],
-    plugins: [
-      require('karma-jasmine'),
-      require('karma-chrome-launcher'),
-      require('karma-jasmine-html-reporter'),
-      require('karma-coverage-istanbul-reporter'),
-      require('@angular/cli/plugins/karma'),
-    ],
-    client: {
-      clearContext: false, // leave Jasmine Spec Runner output visible in browser
-    },
-    coverageIstanbulReporter: {
-      reports: ['html', 'lcovonly'],
-      fixWebpackSourcePaths: true,
-    },
-    angularCli: {
-      environment: 'dev',
-    },
-    reporters: ['progress', 'kjhtml'],
-    port: 9876,
-    colors: true,
-    logLevel: config.LOG_INFO,
-    autoWatch: true,
-    browsers: ['Chrome'],
-    singleRun: false,
-    webpack: { node: { fs: 'empty', } },
-  });
-};

examples/angular-cli/package.json

@@ -10,7 +10,10 @@
     "ng": "ng",
     "start": "ng serve",
     "storybook": "start-storybook -p 9008 -s src/assets",
-    "test": "ng test"
+    "test": "jest",
+    "test:watch": "jest --watch",
+    "test:coverage": "jest --coverage",
+    "test:generate-output": "jest --json --outputFile=.jest-test-results.json || true"
   },
   "dependencies": {
     "@angular/common": "^5.2.10",
@@ -38,19 +41,31 @@
     "@storybook/angular": "4.0.0-alpha.4",
     "@types/jasmine": "~2.8.6",
     "@types/jasminewd2": "^2.0.3",
+    "@types/jest": "^22.2.3",
     "@types/node": "~9.6.7",
     "babel-core": "^6.26.3",
     "global": "^4.3.2",
     "jasmine-core": "~3.1.0",
     "jasmine-spec-reporter": "~4.2.1",
-    "karma": "~2.0.2",
-    "karma-chrome-launcher": "~2.2.0",
-    "karma-cli": "~1.0.1",
-    "karma-coverage-istanbul-reporter": "^1.4.2",
-    "karma-jasmine": "~1.1.0",
-    "karma-jasmine-html-reporter": "^1.0.0",
+    "jest": "^22.4.3",
+    "jest-preset-angular": "^5.2.2",
     "protractor": "~5.3.1",
+    "react": "^16.3.2",
+    "react-dom": "^16.3.2",
     "ts-node": "~6.0.2",
     "typescript": "^2.8.3"
+  },
+  "jest": {
+    "preset": "jest-preset-angular",
+    "testPathIgnorePatterns": [
+      "/node_modules/",
+      "/build/",
+      "angularshots.test.js"
+    ],
+    "coveragePathIgnorePatterns": [
+      "/jest-config/",
+      "/node_modules/"
+    ],
+    "setupTestFrameworkScriptFile": "./jest-config/setup.ts"
   }
 }