test: Migrate from karma/jasmine to jest

Why? karma had an entire webpack config baked in and due to webpack depending on an old version of chokidar, tests kept failing.  Decided to bite the bullet and remove karma+jasmine+webpack from the project.

Author: christopherthielen

jest.config.js

@@ -0,0 +1,15 @@
+const NG = process.env.NG || '1.6';
+
+module.exports = {
+  preset: 'ts-jest',
+  testEnvironment: 'jsdom',
+  roots: ['src', 'test'],
+  testMatch: ['**/__tests__/**/*.[jt]s?(x)', '**/?(*.)+(spec|test).[jt]s?(x)', '**/?*Spec.[jt]s'],
+  setupFilesAfterEnv: ['./test/jest.init.ts'],
+  moduleNameMapper: {
+    '^angular$': '<rootDir>/test/angular/jest-angular.js',
+    '^jest-angular-import$': `<rootDir>/test/angular/${NG}/angular.js`,
+    '^angular-animate$': `<rootDir>/test/angular/${NG}/angular-animate.js`,
+    '^angular-mocks$': `<rootDir>/test/angular/${NG}/angular-mocks.js`,
+  },
+};

package.json

@@ -15,15 +15,16 @@
     "bundle_router": "rollup -c --environment ROUTER  && rollup -c --environment ROUTER,MINIFY",
     "bundle_events": "rollup -c --environment EVENTS  && rollup -c --environment EVENTS,MINIFY",
     "bundle_resolve": "rollup -c --environment RESOLVE && rollup -c --environment RESOLVE,MINIFY",
-    "test": "tsc && npm run test:ng16 && npm run test:ng15 && npm run test:ng14 && npm run test:ng13 && npm run test:ng12",
-    "test:ng12": "karma start --ngversion 1.2",
-    "test:ng13": "karma start --ngversion 1.3",
-    "test:ng14": "karma start --ngversion 1.4",
-    "test:ng15": "karma start --ngversion 1.5",
-    "test:ng16": "karma start --ngversion 1.6",
+    "test": "tsc && NG=1.6 jest && NG=1.5 jest && NG=1.4 jest && NG=1.3 jest && NG=1.2 jest",
+    "test:debug": "node --inspect ./node_modules/.bin/jest --runInBand --watch",
+    "test:ng12": "NG=1.2 jest",
+    "test:ng13": "NG=1.3 jest",
+    "test:ng14": "NG=1.4 jest",
+    "test:ng15": "NG=1.5 jest",
+    "test:ng16": "NG=1.6 jest",
     "test:downstream": "test_downstream_projects",
-    "watch": "karma start --singleRun=false --autoWatch=true --autoWatchInterval=1",
-    "debug": "karma start --singleRun=false --autoWatch=true --autoWatchInterval=1 --browsers=Chrome",
+    "watch": "jest --watch",
+    "debug": "npm run test:debug",
     "docs": "generate_docs",
     "docs:publish": "generate_docs && publish_docs",
     "release": "release --deps @uirouter/core && node ./scripts/npm_angular_ui_router_release.js && node ./scripts/bower_release.js",
@@ -81,31 +82,22 @@
     "@types/angular": "1.6.57",
     "@types/angular-animate": "^1.5.10",
     "@types/angular-mocks": "^1.7.0",
-    "@types/jasmine": "^3.5.10",
+    "@types/jest": "^25.2.3",
     "@uirouter/publish-scripts": "^2.3.48",
     "dts-downlevel": "^0.3.0",
-    "fork-ts-checker-webpack-plugin": "^4.1.3",
     "husky": "^4.2.5",
-    "jasmine-core": "^3.5.0",
-    "karma": "^4.4.1",
-    "karma-chrome-launcher": "^3.1.0",
-    "karma-jasmine": "^2.0.1",
-    "karma-mocha-reporter": "^2.2.5",
-    "karma-sourcemap-loader": "^0.3.7",
-    "karma-super-dots-reporter": "^0.2.0",
-    "karma-webpack": "^4.0.2",
+    "jest": "^26.0.1",
     "lodash": "^4.17.15",
     "prettier": "^2.0.5",
     "pretty-quick": "^2.0.1",
     "rollup": "^1.27.14",
     "rollup-plugin-node-resolve": "^5.2.0",
     "rollup-plugin-sourcemaps": "^0.5.0",
     "rollup-plugin-uglify": "^6.0.4",
-    "ts-loader": "^7.0.1",
+    "ts-jest": "^26.0.0",
     "tslint": "^6.1.2",
     "tslint-eslint-rules": "^5.4.0",
-    "typescript": "^3.6.4",
-    "webpack": "^4.43.0"
+    "typescript": "^3.6.4"
   },
   "husky": {
     "hooks": {

test/angular/jest-angular.js

@@ -0,0 +1,9 @@
+// This setup is used to inject specific versions of angularjs to test against
+
+// Jest is configured to alias `import * as angular from 'angular'` to this file in jest.config.js.
+// This file then imports angularjs bundle via the 'jest-angular-import' module alias which maps to
+// a specific version of the angularjs bundle.
+// It then exports the window.angular for use in tests that import from 'angular'
+
+require('jest-angular-import');
+module.exports = window.angular;

test/index.js

@@ -0,0 +1,9 @@
+const noop = () => {};
+Object.defineProperty(window, 'scrollTo', { value: noop, writable: true });
+
+import 'angular';
+import 'angular-mocks';
+import 'angular-animate';
+import './util/testUtilsNg1';
+
+require('../src/index');

test/jest.init.ts

@@ -21,19 +21,21 @@ describe('Ng1 StateBuilder', function () {
     const config = { url: '/foo', templateUrl: '/foo.html', controller: 'FooController', parent: parent };
     const built = builder.builder('views')(config);
 
-    expect(built.$default).not.toEqualData(config);
-    expect(built.$default).toEqualData({
-      templateUrl: '/foo.html',
-      controller: 'FooController',
-      resolveAs: '$resolve',
-    });
+    expect(built.$default).not.toEqual(config);
+    expect(built.$default).toEqual(
+      expect.objectContaining({
+        templateUrl: '/foo.html',
+        controller: 'FooController',
+        resolveAs: '$resolve',
+      })
+    );
   });
 
   it('It should use the views object to build views, when defined', function () {
     const config = { a: { foo: 'bar', controller: 'FooController' } };
     const builtViews = builder.builder('views')({ parent: parent, views: config });
-    expect(builtViews.a.foo).toEqualData(config.a.foo);
-    expect(builtViews.a.controller).toEqualData(config.a.controller);
+    expect(builtViews.a.foo).toEqual(config.a.foo);
+    expect(builtViews.a.controller).toEqual(config.a.controller);
   });
 
   it('should not allow a view config with both component and template keys', inject(function ($injector) {

test/ng1StateBuilderSpec.ts

@@ -1,11 +1,10 @@
+import { IPromise } from 'angular';
 import * as angular from 'angular';
-import './util/matchers';
 import './util/testUtilsNg1';
 
 declare var inject;
 import Spy = jasmine.Spy;
-import './util/matchers';
-import { resolvedValue, resolvedError, caught } from './util/testUtilsNg1';
+import { resolvedValue, resolvedError, caught, testablePromise } from './util/testUtilsNg1';
 import { ResolveContext, StateObject, PathNode, omit, pick, inherit, forEach } from '@uirouter/core';
 import { UIRouter, Resolvable, services, StateDeclaration } from '@uirouter/core';
 import '../src/legacy/resolveService';
@@ -214,6 +213,10 @@ function makePath(names: string[]): PathNode[] {
   return names.map((name) => new PathNode(statesMap[name]));
 }
 
+function isResolved(promise: IPromise<any>) {
+  return !!testablePromise(promise).$$resolved;
+}
+
 describe('Resolvables system:', function () {
   beforeEach(inject(function ($transitions, $injector) {
     emptyPath = [];
@@ -290,7 +293,7 @@ describe('$resolve', function () {
       const fun: Spy = jasmine.createSpy('fun');
       fun.and.returnValue(42);
       const r = $r.resolve({ fun: ['$resolve', fun] });
-      expect(r).not.toBeResolved();
+      expect(isResolved(r)).toBe(false);
       tick();
       expect(resolvedValue(r)).toEqual({ fun: 42 });
       expect(fun).toHaveBeenCalled();
@@ -304,7 +307,7 @@ describe('$resolve', function () {
       const fun = jasmine.createSpy('fun').and.returnValue(d.promise);
       const r = $r.resolve({ fun: ['$resolve', fun] });
       tick();
-      expect(r).not.toBeResolved();
+      expect(isResolved(r)).toBe(false);
       d.resolve('async');
       tick();
       expect(resolvedValue(r)).toEqual({ fun: 'async' });
@@ -333,19 +336,19 @@ describe('$resolve', function () {
 
       const r = $r.resolve({ a: ['b', 'c', a], b: ['c', b], c: [c] });
       tick();
-      expect(r).not.toBeResolved();
+      expect(isResolved(r)).toBe(false);
       expect(a).not.toHaveBeenCalled();
       expect(b).not.toHaveBeenCalled();
       expect(c).toHaveBeenCalled();
       cd.resolve('cc');
       tick();
-      expect(r).not.toBeResolved();
+      expect(isResolved(r)).toBe(false);
       expect(a).not.toHaveBeenCalled();
       expect(b).toHaveBeenCalled();
       expect(b.calls.mostRecent().args).toEqual(['cc']);
       bd.resolve('bb');
       tick();
-      expect(r).not.toBeResolved();
+      expect(isResolved(r)).toBe(false);
       expect(a).toHaveBeenCalled();
       expect(a.calls.mostRecent().args).toEqual(['bb', 'cc']);
       ad.resolve('aa');
@@ -418,7 +421,7 @@ describe('$resolve', function () {
         r
       );
       tick();
-      expect(r).toBeResolved();
+      expect(isResolved(r)).toBe(true);
       expect(resolvedValue(s)).toEqual({ fun: true, games: true });
     });
 
@@ -561,8 +564,8 @@ describe('$resolve', function () {
       const s = $r.resolve({ b: [b] }, {}, r);
       bd.resolve('bbb');
       tick();
-      expect(r).not.toBeResolved();
-      expect(s).not.toBeResolved();
+      expect(isResolved(r)).toBe(false);
+      expect(isResolved(s)).toBe(false);
       cd.resolve('ccc');
       tick();
       expect(resolvedValue(r)).toEqual({ c: 'ccc' });
@@ -571,9 +574,9 @@ describe('$resolve', function () {
 
     it('rejects missing dependencies but does not fail synchronously', function () {
       const r = $r.resolve({ fun: function (invalid) {} });
-      expect(r).not.toBeResolved();
+      expect(isResolved(r)).toBe(false);
       tick();
-      expect(resolvedError(r)).toMatch(/unknown provider/i);
+      expect(resolvedError(r).toString()).toMatch(/unknown provider/i);
     });
 
     it('propagates exceptions thrown by the functions as a rejection', function () {
@@ -582,7 +585,7 @@ describe('$resolve', function () {
           throw 'i want cake';
         },
       });
-      expect(r).not.toBeResolved();
+      expect(isResolved(r)).toBe(false);
       tick();
       expect(resolvedError(r)).toBe('i want cake');
     });
@@ -614,7 +617,7 @@ describe('$resolve', function () {
         },
       });
       tick();
-      expect(r).toBeResolved();
+      expect(isResolved(r)).toBe(true);
       const a = jasmine.createSpy('a');
       const s = $r.resolve({ a: [a] }, {}, r);
       tick();
@@ -707,14 +710,14 @@ describe('Integration: Resolvables system', () => {
     $transitions.onStart({ to: 'J' }, ($transition$) => {
       const ctx = new ResolveContext($transition$.treeChanges().to);
       return invokeLater(function (_J) {}, ctx).then(function () {
-        expect(counts._J).toEqualData(1);
+        expect(counts._J).toEqual(1);
         return $state.target('K');
       });
     });
     $state.go('J');
     $rootScope.$digest();
     expect($state.current.name).toBe('K');
-    expect(counts._J).toEqualData(1);
+    expect(counts._J).toEqual(1);
   });
 
   // Test for https://github.com/angular-ui/ui-router/issues/3546