diff --git a/modules/angular1_router/karma-router.conf.js b/modules/angular1_router/karma-router.conf.js
index d7d014f265..09fc1a408d 100644
--- a/modules/angular1_router/karma-router.conf.js
+++ b/modules/angular1_router/karma-router.conf.js
@@ -16,7 +16,7 @@ module.exports = function (config) {
'../../dist/angular_1_router.js',
'test/*.es5.js',
- 'test/*_spec.js'
+ 'test/**/*_spec.js'
],
customLaunchers: sauceConf.customLaunchers,
diff --git a/modules/angular1_router/test/ng_outlet_spec.js b/modules/angular1_router/test/integration/lifecycle_hook_spec.js
similarity index 53%
rename from modules/angular1_router/test/ng_outlet_spec.js
rename to modules/angular1_router/test/integration/lifecycle_hook_spec.js
index ac9c977683..a6eccaaa25 100644
--- a/modules/angular1_router/test/ng_outlet_spec.js
+++ b/modules/angular1_router/test/integration/lifecycle_hook_spec.js
@@ -40,177 +40,6 @@ describe('ngOutlet', function () {
});
- it('should work in a simple case', function () {
- compile('');
-
- $router.config([
- { path: '/', component: OneController }
- ]);
-
- $router.navigate('/');
- $rootScope.$digest();
-
- expect(elt.text()).toBe('one');
- });
-
-
- // See https://github.com/angular/router/issues/105
- xit('should warn when instantiating a component with no controller', function () {
- put('noController', '
{{ 2 + 2 }}
');
- $router.config([
- { path: '/', component: 'noController' }
- ]);
-
- spyOn(console, 'warn');
- compile('');
- $router.navigate('/');
-
- expect(console.warn).toHaveBeenCalledWith('Could not find controller for', 'NoControllerController');
- expect(elt.text()).toBe('4');
- });
-
-
- it('should navigate between components with different parameters', function () {
- $router.config([
- { path: '/user/:name', component: UserController }
- ]);
- compile('');
-
- $router.navigate('/user/brian');
- $rootScope.$digest();
- expect(elt.text()).toBe('hello brian');
-
- $router.navigate('/user/igor');
- $rootScope.$digest();
- expect(elt.text()).toBe('hello igor');
- });
-
-
- it('should not reactivate a parent when navigating between child components with different parameters', function () {
- var spy = jasmine.createSpy('onActivate');
- function ParentController() {}
- ParentController.$routeConfig = [
- { path: '/user/:name', component: UserController }
- ];
- ParentController.prototype.onActivate = spy;
-
- registerComponent('parent', 'parent { }', ParentController);
-
- $router.config([
- { path: '/parent/...', component: ParentController }
- ]);
- compile('');
-
- $router.navigate('/parent/user/brian');
- $rootScope.$digest();
- expect(spy).toHaveBeenCalled();
- expect(elt.text()).toBe('parent { hello brian }');
-
- spy.calls.reset();
-
- $router.navigate('/parent/user/igor');
- $rootScope.$digest();
- expect(spy).not.toHaveBeenCalled();
- expect(elt.text()).toBe('parent { hello igor }');
- });
-
-
- it('should work with nested outlets', function () {
- var childComponent = registerComponent('childComponent', '', [
- { path: '/b', component: OneController }
- ]);
-
- $router.config([
- { path: '/a/...', component: childComponent }
- ]);
- compile('');
-
- $router.navigate('/a/b');
- $rootScope.$digest();
-
- expect(elt.text()).toBe('outer { inner { one } }');
- });
-
-
- it('should work with recursive nested outlets', function () {
- put('two', '');
- $router.config([
- { path: '/recur', component: TwoController },
- { path: '/', component: OneController }
- ]);
-
- compile('');
- $router.navigate('/');
- $rootScope.$digest();
- expect(elt.text()).toBe('root { one }');
- });
-
-
- it('should allow linking from the parent to the child', function () {
- put('one', '{{number}}
');
-
- $router.config([
- { path: '/a', component: OneController },
- { path: '/b', component: TwoController, as: 'two' }
- ]);
- compile('link | outer { }');
-
- $router.navigate('/a');
- $rootScope.$digest();
-
- expect(elt.find('a').attr('href')).toBe('./b');
- });
-
- it('should allow linking from the child and the parent', function () {
- put('one', '');
-
- $router.config([
- { path: '/a', component: OneController },
- { path: '/b', component: TwoController, as: 'two' }
- ]);
- compile('outer { }');
-
- $router.navigate('/a');
- $rootScope.$digest();
-
- expect(elt.find('a').attr('href')).toBe('./b');
- });
-
-
- it('should allow params in routerLink directive', function () {
- put('router', '');
- put('one', '');
-
- $router.config([
- { path: '/a', component: OneController },
- { path: '/b/:param', component: TwoController, as: 'two' }
- ]);
- compile('');
-
- $router.navigate('/a');
- $rootScope.$digest();
-
- expect(elt.find('a').attr('href')).toBe('./b/lol');
- });
-
- // TODO: test dynamic links
- it('should update the href of links with bound params', function () {
- put('router', '');
- put('one', '');
-
- $router.config([
- { path: '/a', component: OneController },
- { path: '/b/:param', component: TwoController, as: 'two' }
- ]);
- compile('');
-
- $router.navigate('/a');
- $rootScope.$digest();
-
- expect(elt.find('a').attr('href')).toBe('./b/one');
- });
-
-
it('should run the activate hook of controllers', function () {
var spy = jasmine.createSpy('activate');
var activate = registerComponent('activate', '', {
@@ -267,7 +96,6 @@ describe('ngOutlet', function () {
instructionFor(OneController));
});
-
it('should inject $scope into the controller constructor', function () {
var injectedScope;
@@ -601,149 +429,6 @@ describe('ngOutlet', function () {
instructionFor(deactivate));
});
-
- it('should change location path', inject(function ($location) {
- $router.config([
- { path: '/user', component: UserController }
- ]);
-
- compile('');
-
- $router.navigate('/user');
- $rootScope.$digest();
-
- expect($location.path()).toBe('/user');
- }));
-
- // TODO: test injecting $scope
-
- it('should navigate on left-mouse click when a link url matches a route', function () {
- $router.config([
- { path: '/', component: OneController },
- { path: '/two', component: TwoController }
- ]);
-
- compile('link | ');
- $rootScope.$digest();
- expect(elt.text()).toBe('link | one');
- elt.find('a')[0].click();
-
- $rootScope.$digest();
- expect(elt.text()).toBe('link | two');
- });
-
-
- it('should not navigate on non-left mouse click when a link url matches a route', inject(function ($router) {
- $router.config([
- { path: '/', component: OneController },
- { path: '/two', component: TwoController }
- ]);
-
- compile('link | ');
- $rootScope.$digest();
- expect(elt.text()).toBe('link | one');
- elt.find('a').triggerHandler({ type: 'click', which: 3 });
-
- $rootScope.$digest();
- expect(elt.text()).toBe('link | one');
- }));
-
-
- // See https://github.com/angular/router/issues/206
- it('should not navigate a link without an href', function () {
- $router.config([
- { path: '/', component: OneController },
- { path: '/two', component: TwoController }
- ]);
- expect(function () {
- compile('link');
- $rootScope.$digest();
- expect(elt.text()).toBe('link');
- elt.find('a')[0].click();
- $rootScope.$digest();
- }).not.toThrow();
- });
-
-
- it('should change location to the canonical route', inject(function ($location) {
- compile('');
-
- $router.config([
- { path: '/', redirectTo: '/user' },
- { path: '/user', component: UserController }
- ]);
-
- $router.navigate('/');
- $rootScope.$digest();
-
- expect($location.path()).toBe('/user');
- }));
-
-
- it('should change location to the canonical route with nested components', inject(function ($location) {
- var childRouter = registerComponent('childRouter', '', [
- { path: '/old-child', redirectTo: '/new-child' },
- { path: '/new-child', component: OneController},
- { path: '/old-child-two', redirectTo: '/new-child-two' },
- { path: '/new-child-two', component: TwoController}
- ]);
-
- $router.config([
- { path: '/old-parent', redirectTo: '/new-parent' },
- { path: '/new-parent/...', component: childRouter }
- ]);
-
- compile('');
-
- $router.navigate('/old-parent/old-child');
- $rootScope.$digest();
-
- expect($location.path()).toBe('/new-parent/new-child');
- expect(elt.text()).toBe('inner { one }');
-
- $router.navigate('/old-parent/old-child-two');
- $rootScope.$digest();
-
- expect($location.path()).toBe('/new-parent/new-child-two');
- expect(elt.text()).toBe('inner { two }');
- }));
-
-
- it('should navigate when the location path changes', inject(function ($location) {
- $router.config([
- { path: '/one', component: OneController }
- ]);
- compile('');
-
- $location.path('/one');
- $rootScope.$digest();
-
- expect(elt.text()).toBe('one');
- }));
-
-
- it('should expose a "navigating" property on $router', inject(function ($q) {
- var defer;
- var pendingActivate = registerComponent('pendingActivate', '', {
- onActivate: function () {
- defer = $q.defer();
- return defer.promise;
- }
- });
- $router.config([
- { path: '/pendingActivate', component: pendingActivate }
- ]);
- compile('');
-
- $router.navigate('/pendingActivate');
- $rootScope.$digest();
- expect($router.navigating).toBe(true);
- defer.resolve();
- $rootScope.$digest();
- expect($router.navigating).toBe(false);
- }));
-
-
function registerComponent(name, template, config) {
var Ctrl;
if (!template) {
@@ -785,86 +470,3 @@ describe('ngOutlet', function () {
return elt;
}
});
-
-
-describe('ngOutlet animations', function () {
-
- var elt,
- $animate,
- $compile,
- $rootScope,
- $router,
- $templateCache,
- $controllerProvider;
-
- function UserController($routeParams) {
- this.name = $routeParams.name;
- }
-
- beforeEach(function () {
- module('ngAnimate');
- module('ngAnimateMock');
- module('ngComponentRouter');
- module(function (_$controllerProvider_) {
- $controllerProvider = _$controllerProvider_;
- });
-
- inject(function (_$animate_, _$compile_, _$rootScope_, _$router_, _$templateCache_) {
- $animate = _$animate_;
- $compile = _$compile_;
- $rootScope = _$rootScope_;
- $router = _$router_;
- $templateCache = _$templateCache_;
- });
-
- put('user', 'hello {{user.name}}
');
- $controllerProvider.register('UserController', UserController);
- });
-
- afterEach(function () {
- expect($animate.queue).toEqual([]);
- });
-
- it('should work in a simple case', function () {
- var item;
-
- compile('');
-
- $router.config([
- { path: '/user/:name', component: UserController }
- ]);
-
- $router.navigate('/user/brian');
- $rootScope.$digest();
- expect(elt.text()).toBe('hello brian');
-
- // "user" component enters
- item = $animate.queue.shift();
- expect(item.event).toBe('enter');
-
- // navigate to pete
- $router.navigate('/user/pete');
- $rootScope.$digest();
- expect(elt.text()).toBe('hello pete');
-
- // "user pete" component enters
- item = $animate.queue.shift();
- expect(item.event).toBe('enter');
- expect(item.element.text()).toBe('hello pete');
-
- // "user brian" component leaves
- item = $animate.queue.shift();
- expect(item.event).toBe('leave');
- expect(item.element.text()).toBe('hello brian');
- });
-
- function put(name, template) {
- $templateCache.put(componentTemplatePath(name), [200, template, {}]);
- }
-
- function compile(template) {
- elt = $compile('' + template + '
')($rootScope);
- $rootScope.$digest();
- return elt;
- }
-});
diff --git a/modules/angular1_router/test/integration/ng_outlet_spec.js b/modules/angular1_router/test/integration/ng_outlet_spec.js
new file mode 100644
index 0000000000..7000af54bf
--- /dev/null
+++ b/modules/angular1_router/test/integration/ng_outlet_spec.js
@@ -0,0 +1,295 @@
+'use strict';
+
+describe('ngOutlet', function () {
+
+ var elt,
+ $compile,
+ $rootScope,
+ $router,
+ $templateCache,
+ $controllerProvider,
+ $componentMapperProvider;
+
+ var OneController, TwoController, UserController;
+
+
+ beforeEach(function () {
+ module('ng');
+ module('ngComponentRouter');
+ module(function (_$controllerProvider_, _$componentMapperProvider_) {
+ $controllerProvider = _$controllerProvider_;
+ $componentMapperProvider = _$componentMapperProvider_;
+ });
+
+ inject(function (_$compile_, _$rootScope_, _$router_, _$templateCache_) {
+ $compile = _$compile_;
+ $rootScope = _$rootScope_;
+ $router = _$router_;
+ $templateCache = _$templateCache_;
+ });
+
+ UserController = registerComponent('user', 'hello {{user.name}}
', function ($routeParams) {
+ this.name = $routeParams.name;
+ });
+ OneController = registerComponent('one', '{{one.number}}
', boringController('number', 'one'));
+ TwoController = registerComponent('two', '{{two.number}}
', boringController('number', 'two'));
+ });
+
+
+ it('should work in a simple case', function () {
+ compile('');
+
+ $router.config([
+ { path: '/', component: OneController }
+ ]);
+
+ $router.navigate('/');
+ $rootScope.$digest();
+
+ expect(elt.text()).toBe('one');
+ });
+
+
+ // See https://github.com/angular/router/issues/105
+ xit('should warn when instantiating a component with no controller', function () {
+ put('noController', '{{ 2 + 2 }}
');
+ $router.config([
+ { path: '/', component: 'noController' }
+ ]);
+
+ spyOn(console, 'warn');
+ compile('');
+ $router.navigate('/');
+
+ expect(console.warn).toHaveBeenCalledWith('Could not find controller for', 'NoControllerController');
+ expect(elt.text()).toBe('4');
+ });
+
+
+ it('should navigate between components with different parameters', function () {
+ $router.config([
+ { path: '/user/:name', component: UserController }
+ ]);
+ compile('');
+
+ $router.navigate('/user/brian');
+ $rootScope.$digest();
+ expect(elt.text()).toBe('hello brian');
+
+ $router.navigate('/user/igor');
+ $rootScope.$digest();
+ expect(elt.text()).toBe('hello igor');
+ });
+
+
+ it('should not reactivate a parent when navigating between child components with different parameters', function () {
+ var spy = jasmine.createSpy('onActivate');
+ function ParentController() {}
+ ParentController.$routeConfig = [
+ { path: '/user/:name', component: UserController }
+ ];
+ ParentController.prototype.onActivate = spy;
+
+ registerComponent('parent', 'parent { }', ParentController);
+
+ $router.config([
+ { path: '/parent/...', component: ParentController }
+ ]);
+ compile('');
+
+ $router.navigate('/parent/user/brian');
+ $rootScope.$digest();
+ expect(spy).toHaveBeenCalled();
+ expect(elt.text()).toBe('parent { hello brian }');
+
+ spy.calls.reset();
+
+ $router.navigate('/parent/user/igor');
+ $rootScope.$digest();
+ expect(spy).not.toHaveBeenCalled();
+ expect(elt.text()).toBe('parent { hello igor }');
+ });
+
+
+ it('should work with nested outlets', function () {
+ var childComponent = registerComponent('childComponent', '', [
+ { path: '/b', component: OneController }
+ ]);
+
+ $router.config([
+ { path: '/a/...', component: childComponent }
+ ]);
+ compile('');
+
+ $router.navigate('/a/b');
+ $rootScope.$digest();
+
+ expect(elt.text()).toBe('outer { inner { one } }');
+ });
+
+
+ it('should work with recursive nested outlets', function () {
+ put('two', '');
+ $router.config([
+ { path: '/recur', component: TwoController },
+ { path: '/', component: OneController }
+ ]);
+
+ compile('');
+ $router.navigate('/');
+ $rootScope.$digest();
+ expect(elt.text()).toBe('root { one }');
+ });
+
+ it('should inject $scope into the controller constructor', function () {
+ var injectedScope;
+ var UserController = registerComponent('user', '', function ($scope) {
+ injectedScope = $scope;
+ });
+
+ $router.config([
+ { path: '/user', component: UserController }
+ ]);
+ compile('');
+
+ $router.navigate('/user');
+ $rootScope.$digest();
+
+ expect(injectedScope).toBeDefined();
+ });
+
+
+ it('should change location path', inject(function ($location) {
+ $router.config([
+ { path: '/user', component: UserController }
+ ]);
+
+ compile('');
+
+ $router.navigate('/user');
+ $rootScope.$digest();
+
+ expect($location.path()).toBe('/user');
+ }));
+
+
+ it('should change location to the canonical route', inject(function ($location) {
+ compile('');
+
+ $router.config([
+ { path: '/', redirectTo: '/user' },
+ { path: '/user', component: UserController }
+ ]);
+
+ $router.navigate('/');
+ $rootScope.$digest();
+
+ expect($location.path()).toBe('/user');
+ }));
+
+
+ it('should change location to the canonical route with nested components', inject(function ($location) {
+ var childRouter = registerComponent('childRouter', '', [
+ { path: '/old-child', redirectTo: '/new-child' },
+ { path: '/new-child', component: OneController},
+ { path: '/old-child-two', redirectTo: '/new-child-two' },
+ { path: '/new-child-two', component: TwoController}
+ ]);
+
+ $router.config([
+ { path: '/old-parent', redirectTo: '/new-parent' },
+ { path: '/new-parent/...', component: childRouter }
+ ]);
+
+ compile('');
+
+ $router.navigate('/old-parent/old-child');
+ $rootScope.$digest();
+
+ expect($location.path()).toBe('/new-parent/new-child');
+ expect(elt.text()).toBe('inner { one }');
+
+ $router.navigate('/old-parent/old-child-two');
+ $rootScope.$digest();
+
+ expect($location.path()).toBe('/new-parent/new-child-two');
+ expect(elt.text()).toBe('inner { two }');
+ }));
+
+
+ it('should navigate when the location path changes', inject(function ($location) {
+ $router.config([
+ { path: '/one', component: OneController }
+ ]);
+ compile('');
+
+ $location.path('/one');
+ $rootScope.$digest();
+
+ expect(elt.text()).toBe('one');
+ }));
+
+
+ it('should expose a "navigating" property on $router', inject(function ($q) {
+ var defer;
+ var pendingActivate = registerComponent('pendingActivate', '', {
+ onActivate: function () {
+ defer = $q.defer();
+ return defer.promise;
+ }
+ });
+ $router.config([
+ { path: '/pendingActivate', component: pendingActivate }
+ ]);
+ compile('');
+
+ $router.navigate('/pendingActivate');
+ $rootScope.$digest();
+ expect($router.navigating).toBe(true);
+ defer.resolve();
+ $rootScope.$digest();
+ expect($router.navigating).toBe(false);
+ }));
+
+
+ function registerComponent(name, template, config) {
+ var Ctrl;
+ if (!template) {
+ template = '';
+ }
+ if (!config) {
+ Ctrl = function () {};
+ } else if (angular.isArray(config)) {
+ Ctrl = function () {};
+ Ctrl.annotations = [new angular.annotations.RouteConfig(config)];
+ } else if (typeof config === 'function') {
+ Ctrl = config;
+ } else {
+ Ctrl = function () {};
+ if (config.canActivate) {
+ Ctrl.$canActivate = config.canActivate;
+ delete config.canActivate;
+ }
+ Ctrl.prototype = config;
+ }
+ $controllerProvider.register(componentControllerName(name), Ctrl);
+ put(name, template);
+ return Ctrl;
+ }
+
+ function boringController(model, value) {
+ return function () {
+ this[model] = value;
+ };
+ }
+
+ function put(name, template) {
+ $templateCache.put(componentTemplatePath(name), [200, template, {}]);
+ }
+
+ function compile(template) {
+ elt = $compile('' + template + '
')($rootScope);
+ $rootScope.$digest();
+ return elt;
+ }
+});
diff --git a/modules/angular1_router/test/ng_link_spec.js b/modules/angular1_router/test/ng_link_spec.js
new file mode 100644
index 0000000000..a900a4dba5
--- /dev/null
+++ b/modules/angular1_router/test/ng_link_spec.js
@@ -0,0 +1,189 @@
+'use strict';
+
+describe('ngOutlet', function () {
+
+ var elt,
+ $compile,
+ $rootScope,
+ $router,
+ $templateCache,
+ $controllerProvider;
+
+ var OneController, TwoController, UserController;
+
+ beforeEach(function () {
+ module('ng');
+ module('ngComponentRouter');
+ module(function (_$controllerProvider_) {
+ $controllerProvider = _$controllerProvider_;
+ });
+
+ inject(function (_$compile_, _$rootScope_, _$router_, _$templateCache_) {
+ $compile = _$compile_;
+ $rootScope = _$rootScope_;
+ $router = _$router_;
+ $templateCache = _$templateCache_;
+ });
+
+ UserController = registerComponent('user', 'hello {{user.name}}
', function ($routeParams) {
+ this.name = $routeParams.name;
+ });
+ OneController = registerComponent('one', '{{one.number}}
', boringController('number', 'one'));
+ TwoController = registerComponent('two', '{{two.number}}
', boringController('number', 'two'));
+ });
+
+
+ it('should allow linking from the parent to the child', function () {
+ put('one', '{{number}}
');
+
+ $router.config([
+ { path: '/a', component: OneController },
+ { path: '/b', component: TwoController, as: 'two' }
+ ]);
+ compile('link | outer { }');
+
+ $router.navigate('/a');
+ $rootScope.$digest();
+
+ expect(elt.find('a').attr('href')).toBe('./b');
+ });
+
+ it('should allow linking from the child and the parent', function () {
+ put('one', '');
+
+ $router.config([
+ { path: '/a', component: OneController },
+ { path: '/b', component: TwoController, as: 'two' }
+ ]);
+ compile('outer { }');
+
+ $router.navigate('/a');
+ $rootScope.$digest();
+
+ expect(elt.find('a').attr('href')).toBe('./b');
+ });
+
+
+ it('should allow params in routerLink directive', function () {
+ put('router', '');
+ put('one', '');
+
+ $router.config([
+ { path: '/a', component: OneController },
+ { path: '/b/:param', component: TwoController, as: 'two' }
+ ]);
+ compile('');
+
+ $router.navigate('/a');
+ $rootScope.$digest();
+
+ expect(elt.find('a').attr('href')).toBe('./b/lol');
+ });
+
+ // TODO: test dynamic links
+ it('should update the href of links with bound params', function () {
+ put('router', '');
+ put('one', '');
+
+ $router.config([
+ { path: '/a', component: OneController },
+ { path: '/b/:param', component: TwoController, as: 'two' }
+ ]);
+ compile('');
+
+ $router.navigate('/a');
+ $rootScope.$digest();
+
+ expect(elt.find('a').attr('href')).toBe('./b/one');
+ });
+
+
+ it('should navigate on left-mouse click when a link url matches a route', function () {
+ $router.config([
+ { path: '/', component: OneController },
+ { path: '/two', component: TwoController }
+ ]);
+
+ compile('link | ');
+ $rootScope.$digest();
+ expect(elt.text()).toBe('link | one');
+ elt.find('a')[0].click();
+
+ $rootScope.$digest();
+ expect(elt.text()).toBe('link | two');
+ });
+
+
+ it('should not navigate on non-left mouse click when a link url matches a route', inject(function ($router) {
+ $router.config([
+ { path: '/', component: OneController },
+ { path: '/two', component: TwoController }
+ ]);
+
+ compile('link | ');
+ $rootScope.$digest();
+ expect(elt.text()).toBe('link | one');
+ elt.find('a').triggerHandler({ type: 'click', which: 3 });
+
+ $rootScope.$digest();
+ expect(elt.text()).toBe('link | one');
+ }));
+
+
+ // See https://github.com/angular/router/issues/206
+ it('should not navigate a link without an href', function () {
+ $router.config([
+ { path: '/', component: OneController },
+ { path: '/two', component: TwoController }
+ ]);
+ expect(function () {
+ compile('link');
+ $rootScope.$digest();
+ expect(elt.text()).toBe('link');
+ elt.find('a')[0].click();
+ $rootScope.$digest();
+ }).not.toThrow();
+ });
+
+
+ function registerComponent(name, template, config) {
+ var Ctrl;
+ if (!template) {
+ template = '';
+ }
+ if (!config) {
+ Ctrl = function () {};
+ } else if (angular.isArray(config)) {
+ Ctrl = function () {};
+ Ctrl.annotations = [new angular.annotations.RouteConfig(config)];
+ } else if (typeof config === 'function') {
+ Ctrl = config;
+ } else {
+ Ctrl = function () {};
+ if (config.canActivate) {
+ Ctrl.$canActivate = config.canActivate;
+ delete config.canActivate;
+ }
+ Ctrl.prototype = config;
+ }
+ $controllerProvider.register(componentControllerName(name), Ctrl);
+ put(name, template);
+ return Ctrl;
+ }
+
+ function boringController(model, value) {
+ return function () {
+ this[model] = value;
+ };
+ }
+
+ function put(name, template) {
+ $templateCache.put(componentTemplatePath(name), [200, template, {}]);
+ }
+
+ function compile(template) {
+ elt = $compile('' + template + '
')($rootScope);
+ $rootScope.$digest();
+ return elt;
+ }
+});
diff --git a/modules/angular1_router/test/ng_outlet_animation_spec.js b/modules/angular1_router/test/ng_outlet_animation_spec.js
new file mode 100644
index 0000000000..dffd6581c3
--- /dev/null
+++ b/modules/angular1_router/test/ng_outlet_animation_spec.js
@@ -0,0 +1,82 @@
+'use strict';
+
+describe('ngOutlet animations', function () {
+ var elt,
+ $animate,
+ $compile,
+ $rootScope,
+ $router,
+ $templateCache,
+ $controllerProvider;
+
+ function UserController($routeParams) {
+ this.name = $routeParams.name;
+ }
+
+ beforeEach(function () {
+ module('ngAnimate');
+ module('ngAnimateMock');
+ module('ngComponentRouter');
+ module(function (_$controllerProvider_) {
+ $controllerProvider = _$controllerProvider_;
+ });
+
+ inject(function (_$animate_, _$compile_, _$rootScope_, _$router_, _$templateCache_) {
+ $animate = _$animate_;
+ $compile = _$compile_;
+ $rootScope = _$rootScope_;
+ $router = _$router_;
+ $templateCache = _$templateCache_;
+ });
+
+ put('user', 'hello {{user.name}}
');
+ $controllerProvider.register('UserController', UserController);
+ });
+
+ afterEach(function () {
+ expect($animate.queue).toEqual([]);
+ });
+
+ it('should work in a simple case', function () {
+ var item;
+
+ compile('');
+
+ $router.config([
+ { path: '/user/:name', component: UserController }
+ ]);
+
+ $router.navigate('/user/brian');
+ $rootScope.$digest();
+ expect(elt.text()).toBe('hello brian');
+
+ // "user" component enters
+ item = $animate.queue.shift();
+ expect(item.event).toBe('enter');
+
+ // navigate to pete
+ $router.navigate('/user/pete');
+ $rootScope.$digest();
+ expect(elt.text()).toBe('hello pete');
+
+ // "user pete" component enters
+ item = $animate.queue.shift();
+ expect(item.event).toBe('enter');
+ expect(item.element.text()).toBe('hello pete');
+
+ // "user brian" component leaves
+ item = $animate.queue.shift();
+ expect(item.event).toBe('leave');
+ expect(item.element.text()).toBe('hello brian');
+ });
+
+ function put(name, template) {
+ $templateCache.put(componentTemplatePath(name), [200, template, {}]);
+ }
+
+ function compile(template) {
+ elt = $compile('' + template + '
')($rootScope);
+ $rootScope.$digest();
+ return elt;
+ }
+});