| OLD | NEW |
| 1 library routing_spec; | 1 library routing_spec; |
| 2 | 2 |
| 3 import '../_specs.dart'; | 3 import '../_specs.dart'; |
| 4 import 'package:angular/mock/module.dart'; | 4 import 'package:angular/mock/module.dart'; |
| 5 import 'package:angular/application_factory.dart'; |
| 5 import 'dart:async'; | 6 import 'dart:async'; |
| 6 | 7 |
| 7 main() { | 8 main() { |
| 8 describe('routing', () { | 9 describe('routing', () { |
| 9 TestBed _; | 10 TestBed _; |
| 10 Router router; | 11 Router router; |
| 11 | 12 |
| 12 beforeEach(module((Module m) { | 13 beforeEachModule((Module m) { |
| 13 _initRoutesCalls = 0; | 14 _initRoutesCalls = 0; |
| 14 _router = null; | 15 _router = null; |
| 15 router = new Router(useFragment: false, windowImpl: new MockWindow()); | 16 router = new Router(useFragment: false, windowImpl: new MockWindow()); |
| 16 m | 17 m |
| 17 ..install(new AngularMockModule()) | 18 ..install(new AngularMockModule()) |
| 18 ..factory(RouteInitializerFn, (_) => initRoutes) | 19 ..factory(RouteInitializerFn, (_) => initRoutes) |
| 19 ..value(Router, router); | 20 ..value(Router, router); |
| 20 })); | 21 }); |
| 21 | 22 |
| 22 beforeEach(inject((TestBed tb) { | 23 beforeEach((TestBed tb) { |
| 23 _ = tb; | 24 _ = tb; |
| 24 })); | 25 }); |
| 25 | 26 |
| 26 it('should call init of the RouteInitializer once', async(() { | 27 it('should call init of the RouteInitializer once', async(() { |
| 27 expect(_initRoutesCalls).toEqual(0); | 28 expect(_initRoutesCalls).toEqual(0); |
| 28 | 29 |
| 29 // Force the routing system to initialize. | 30 // Force the routing system to initialize. |
| 30 _.compile('<ng-view></ng-view>'); | 31 _.compile('<ng-view></ng-view>'); |
| 31 | 32 |
| 32 expect(_initRoutesCalls).toEqual(1); | 33 expect(_initRoutesCalls).toEqual(1); |
| 33 expect(_router).toBe(router); | 34 expect(_router).toBe(router); |
| 34 })); | 35 })); |
| 35 | |
| 36 }); | 36 }); |
| 37 | 37 |
| 38 describe('routing DSL', () { | 38 describe('routing DSL', () { |
| 39 Router router; | 39 Router router; |
| 40 TestBed _; | 40 TestBed _; |
| 41 | 41 |
| 42 afterEach(() { | 42 afterEach(() { |
| 43 router = _ = null; | 43 router = _ = null; |
| 44 }); | 44 }); |
| 45 | 45 |
| 46 initRouter(initializer) { | 46 initRouter(initializer) { |
| 47 var module = new Module() | 47 var injector = applicationFactory() |
| 48 ..value(RouteInitializerFn, initializer); | 48 .addModule(new AngularMockModule()) |
| 49 var injector = new DynamicInjector( | 49 .addModule(new Module()..value(RouteInitializerFn, initializer)) |
| 50 modules: [new AngularModule(), new AngularMockModule(), module]); | 50 .createInjector(); |
| 51 injector.get(NgRoutingHelper); // force routing initialization | 51 injector.get(NgRoutingHelper); // force routing initialization |
| 52 router = injector.get(Router); | 52 router = injector.get(Router); |
| 53 _ = injector.get(TestBed); | 53 _ = injector.get(TestBed); |
| 54 } | 54 } |
| 55 | 55 |
| 56 it('should configure route hierarchy from provided config', async(() { | 56 it('should configure route hierarchy from provided config', async(() { |
| 57 var counters = { | 57 var counters = { |
| 58 'foo': 0, | 58 'foo': 0, |
| 59 'bar': 0, | 59 'bar': 0, |
| 60 'baz': 0, | 60 'baz': 0, |
| 61 'aux': 0, | 61 'aux': 0, |
| 62 }; | 62 }; |
| 63 initRouter((Router router, ViewFactory views) { | 63 initRouter((Router router, RouteViewFactory views) { |
| 64 views.configure({ | 64 views.configure({ |
| 65 'foo': ngRoute( | 65 'foo': ngRoute( |
| 66 path: '/foo', | 66 path: '/foo', |
| 67 enter: (_) => counters['foo']++, | 67 enter: (_) => counters['foo']++, |
| 68 mount: { | 68 mount: { |
| 69 'bar': ngRoute( | 69 'bar': ngRoute( |
| 70 path: '/bar', | 70 path: '/bar', |
| 71 enter: (_) => counters['bar']++ | 71 enter: (_) => counters['bar']++ |
| 72 ), | 72 ), |
| 73 'baz': ngRoute( | 73 'baz': ngRoute( |
| 74 path: '/baz', | 74 path: '/baz', |
| 75 enter: (_) => counters['baz']++ | 75 enter: (_) => counters['baz']++ |
| 76 ) | 76 ) |
| 77 } | 77 } |
| 78 ), | 78 ), |
| 79 'aux': ngRoute( | 79 'aux': ngRoute( |
| 80 path: '/aux', | 80 path: '/aux', |
| 81 enter: (_) => counters['aux']++ | 81 enter: (_) => counters['aux']++ |
| 82 ) | 82 ) |
| 83 }); | 83 }); |
| 84 }); | 84 }); |
| 85 | 85 |
| 86 expect(router.root.getRoute('foo').name).toEqual('foo'); | 86 expect(router.root.findRoute('foo').name).toEqual('foo'); |
| 87 expect(router.root.getRoute('foo.bar').name).toEqual('bar'); | 87 expect(router.root.findRoute('foo.bar').name).toEqual('bar'); |
| 88 expect(router.root.getRoute('foo.baz').name).toEqual('baz'); | 88 expect(router.root.findRoute('foo.baz').name).toEqual('baz'); |
| 89 expect(router.root.getRoute('aux').name).toEqual('aux'); | 89 expect(router.root.findRoute('aux').name).toEqual('aux'); |
| 90 | 90 |
| 91 router.route('/foo'); | 91 router.route('/foo'); |
| 92 microLeap(); | 92 microLeap(); |
| 93 expect(counters, equals({ | 93 expect(counters, equals({ |
| 94 'foo': 1, | 94 'foo': 1, |
| 95 'bar': 0, | 95 'bar': 0, |
| 96 'baz': 0, | 96 'baz': 0, |
| 97 'aux': 0, | 97 'aux': 0, |
| 98 })); | 98 })); |
| 99 | 99 |
| (...skipping 21 matching lines...) Expand all Loading... |
| 121 'foo': 1, | 121 'foo': 1, |
| 122 'bar': 1, | 122 'bar': 1, |
| 123 'baz': 1, | 123 'baz': 1, |
| 124 'aux': 1, | 124 'aux': 1, |
| 125 })); | 125 })); |
| 126 })); | 126 })); |
| 127 | 127 |
| 128 | 128 |
| 129 it('should set the default route', async(() { | 129 it('should set the default route', async(() { |
| 130 int enterCount = 0; | 130 int enterCount = 0; |
| 131 initRouter((Router router, ViewFactory views) { | 131 initRouter((Router router, RouteViewFactory views) { |
| 132 views.configure({ | 132 views.configure({ |
| 133 'foo': ngRoute(path: '/foo'), | 133 'foo': ngRoute(path: '/foo'), |
| 134 'bar': ngRoute(path: '/bar', defaultRoute: true), | 134 'bar': ngRoute(path: '/bar', defaultRoute: true), |
| 135 'baz': ngRoute(path: '/baz'), | 135 'baz': ngRoute(path: '/baz'), |
| 136 }); | 136 }); |
| 137 }); | 137 }); |
| 138 | 138 |
| 139 router.route('/invalidRoute'); | 139 router.route('/invalidRoute'); |
| 140 microLeap(); | 140 microLeap(); |
| 141 | 141 |
| 142 expect(router.activePath.length).toBe(1); | 142 expect(router.activePath.length).toBe(1); |
| 143 expect(router.activePath.first.name).toBe('bar'); | 143 expect(router.activePath.first.name).toBe('bar'); |
| 144 })); | 144 })); |
| 145 | 145 |
| 146 | 146 |
| 147 it('should call enter callback and show the view when routed', async(() { | 147 it('should call enter callback and show the view when routed', async(() { |
| 148 int enterCount = 0; | 148 int enterCount = 0; |
| 149 initRouter((Router router, ViewFactory views) { | 149 initRouter((Router router, RouteViewFactory views) { |
| 150 views.configure({ | 150 views.configure({ |
| 151 'foo': ngRoute( | 151 'foo': ngRoute( |
| 152 path: '/foo', | 152 path: '/foo', |
| 153 enter: (_) => enterCount++, | 153 enter: (_) => enterCount++, |
| 154 view: 'foo.html' | 154 view: 'foo.html' |
| 155 ), | 155 ), |
| 156 }); | 156 }); |
| 157 }); | 157 }); |
| 158 _.injector.get(TemplateCache) | 158 _.injector.get(TemplateCache) |
| 159 .put('foo.html', new HttpResponse(200, '<h1>Foo</h1>')); | 159 .put('foo.html', new HttpResponse(200, '<h1>Foo</h1>')); |
| 160 | 160 |
| 161 Element root = _.compile('<ng-view></ng-view>'); | 161 Element root = _.compile('<div><ng-view></ng-view><div>'); |
| 162 expect(root.text).toEqual(''); | 162 expect(root.text).toEqual(''); |
| 163 | 163 |
| 164 router.route('/foo'); | 164 router.route('/foo'); |
| 165 microLeap(); | 165 microLeap(); |
| 166 | 166 _.rootScope.apply(); |
| 167 expect(enterCount).toBe(1); | 167 expect(enterCount).toBe(1); |
| 168 expect(root.text).toEqual('Foo'); | 168 expect(root.text).toEqual('Foo'); |
| 169 })); | 169 })); |
| 170 | 170 |
| 171 | 171 |
| 172 it('should call preEnter callback and load modules', async(() { | 172 it('should call preEnter callback and load modules', async(() { |
| 173 int preEnterCount = 0; | 173 int preEnterCount = 0; |
| 174 int modulesCount = 0; | 174 int modulesCount = 0; |
| 175 initRouter((Router router, ViewFactory views) { | 175 initRouter((Router router, RouteViewFactory views) { |
| 176 views.configure({ | 176 views.configure({ |
| 177 'foo': ngRoute( | 177 'foo': ngRoute( |
| 178 path: '/foo', | 178 path: '/foo', |
| 179 preEnter: (_) => preEnterCount++, | 179 preEnter: (_) => preEnterCount++, |
| 180 modules: () { | 180 modules: () { |
| 181 modulesCount++; | 181 modulesCount++; |
| 182 return new Future.value(); | 182 return new Future.value(); |
| 183 } | 183 } |
| 184 ), | 184 ), |
| 185 'bar': ngRoute( | 185 'bar': ngRoute( |
| (...skipping 23 matching lines...) Expand all Loading... |
| 209 router.route('/foo'); | 209 router.route('/foo'); |
| 210 microLeap(); | 210 microLeap(); |
| 211 | 211 |
| 212 expect(preEnterCount).toBe(2); | 212 expect(preEnterCount).toBe(2); |
| 213 expect(modulesCount).toBe(1); | 213 expect(modulesCount).toBe(1); |
| 214 })); | 214 })); |
| 215 | 215 |
| 216 | 216 |
| 217 it('should clear view on leave an call leave callback', async(() { | 217 it('should clear view on leave an call leave callback', async(() { |
| 218 int leaveCount = 0; | 218 int leaveCount = 0; |
| 219 initRouter((Router router, ViewFactory views) { | 219 initRouter((Router router, RouteViewFactory views) { |
| 220 views.configure({ | 220 views.configure({ |
| 221 'foo': ngRoute( | 221 'foo': ngRoute( |
| 222 path: '/foo', | 222 path: '/foo', |
| 223 leave: (_) => leaveCount++, | 223 leave: (_) => leaveCount++, |
| 224 view: 'foo.html' | 224 view: 'foo.html' |
| 225 ), | 225 ), |
| 226 'bar': ngRoute( | 226 'bar': ngRoute( |
| 227 path: '/bar' | 227 path: '/bar' |
| 228 ), | 228 ), |
| 229 }); | 229 }); |
| 230 }); | 230 }); |
| 231 _.injector.get(TemplateCache) | 231 _.injector.get(TemplateCache) |
| 232 .put('foo.html', new HttpResponse(200, '<h1>Foo</h1>')); | 232 .put('foo.html', new HttpResponse(200, '<h1>Foo</h1>')); |
| 233 | 233 |
| 234 Element root = _.compile('<ng-view></ng-view>'); | 234 Element root = _.compile('<div><ng-view></ng-view><div>'); |
| 235 expect(root.text).toEqual(''); | 235 expect(root.text).toEqual(''); |
| 236 | 236 |
| 237 router.route('/foo'); | 237 router.route('/foo'); |
| 238 microLeap(); | 238 microLeap(); |
| 239 | 239 _.rootScope.apply(); |
| 240 expect(root.text).toEqual('Foo'); | 240 expect(root.text).toEqual('Foo'); |
| 241 expect(leaveCount).toBe(0); | 241 expect(leaveCount).toBe(0); |
| 242 | 242 |
| 243 router.route('/bar'); | 243 router.route('/bar'); |
| 244 microLeap(); | 244 microLeap(); |
| 245 | 245 _.rootScope.apply(); |
| 246 expect(root.text).toEqual(''); | 246 expect(root.text).toEqual(''); |
| 247 expect(leaveCount).toBe(1); | 247 expect(leaveCount).toBe(1); |
| 248 })); | 248 })); |
| 249 | 249 |
| 250 | 250 |
| 251 it('should synchronously load new directives from modules ', async(() { | 251 it('should synchronously load new directives from modules ', async(() { |
| 252 initRouter((Router router, ViewFactory views) { | 252 initRouter((Router router, RouteViewFactory views) { |
| 253 views.configure({ | 253 views.configure({ |
| 254 'foo': ngRoute( | 254 'foo': ngRoute( |
| 255 path: '/foo', | 255 path: '/foo', |
| 256 modules: () => [ | 256 modules: () => [ |
| 257 new Module()..type(NewDirective) | 257 new Module()..type(NewDirective) |
| 258 ], | 258 ], |
| 259 view: 'foo.html' | 259 view: 'foo.html' |
| 260 ), | 260 ), |
| 261 }); | 261 }); |
| 262 }); | 262 }); |
| 263 _.injector.get(TemplateCache) | 263 _.injector.get(TemplateCache) |
| 264 .put('foo.html', new HttpResponse(200, '<div make-it-new>Old!</div>'))
; | 264 .put('foo.html', new HttpResponse(200, '<div make-it-new>Old!</div>'))
; |
| 265 | 265 |
| 266 Element root = _.compile('<ng-view></ng-view>'); | 266 Element root = _.compile('<div><ng-view></ng-view><div>'); |
| 267 expect(root.text).toEqual(''); | 267 expect(root.text).toEqual(''); |
| 268 | 268 |
| 269 router.route('/foo'); | 269 router.route('/foo'); |
| 270 microLeap(); | 270 microLeap(); |
| 271 | 271 _.rootScope.apply(); |
| 272 expect(root.text).toEqual('New!'); | 272 expect(root.text).toEqual('New!'); |
| 273 })); | 273 })); |
| 274 | 274 |
| 275 | 275 |
| 276 it('should asynchronously load new directives from modules ', async(() { | 276 it('should asynchronously load new directives from modules ', async(() { |
| 277 initRouter((Router router, ViewFactory views) { | 277 initRouter((Router router, RouteViewFactory views) { |
| 278 views.configure({ | 278 views.configure({ |
| 279 'foo': ngRoute( | 279 'foo': ngRoute( |
| 280 path: '/foo', | 280 path: '/foo', |
| 281 modules: () => new Future.value([ | 281 modules: () => new Future.value([ |
| 282 new Module()..type(NewDirective) | 282 new Module()..type(NewDirective) |
| 283 ]), | 283 ]), |
| 284 view: 'foo.html' | 284 view: 'foo.html' |
| 285 ), | 285 ), |
| 286 }); | 286 }); |
| 287 }); | 287 }); |
| 288 _.injector.get(TemplateCache) | 288 _.injector.get(TemplateCache) |
| 289 .put('foo.html', new HttpResponse(200, '<div make-it-new>Old!</div>'))
; | 289 .put('foo.html', new HttpResponse(200, '<div make-it-new>Old!</div>'))
; |
| 290 | 290 |
| 291 Element root = _.compile('<ng-view></ng-view>'); | 291 Element root = _.compile('<div><ng-view></ng-view><div>'); |
| 292 expect(root.text).toEqual(''); | 292 expect(root.text).toEqual(''); |
| 293 | 293 |
| 294 router.route('/foo'); | 294 router.route('/foo'); |
| 295 microLeap(); | 295 microLeap(); |
| 296 | 296 _.rootScope.apply(); |
| 297 expect(root.text).toEqual('New!'); | 297 expect(root.text).toEqual('New!'); |
| 298 })); | 298 })); |
| 299 | 299 |
| 300 | 300 |
| 301 it('should synchronously load new filters from modules ', async(() { | 301 it('should synchronously load new formatters from modules ', async(() { |
| 302 initRouter((Router router, ViewFactory views) { | 302 initRouter((Router router, RouteViewFactory views) { |
| 303 views.configure({ | 303 views.configure({ |
| 304 'foo': ngRoute( | 304 'foo': ngRoute( |
| 305 path: '/foo', | 305 path: '/foo', |
| 306 modules: () => [ | 306 modules: () => [ |
| 307 new Module()..type(HelloFilter) | 307 new Module()..type(HelloFilter) |
| 308 ], | 308 ], |
| 309 view: 'foo.html' | 309 view: 'foo.html' |
| 310 ), | 310 ), |
| 311 }); | 311 }); |
| 312 }); | 312 }); |
| 313 _.injector.get(TemplateCache) | 313 _.injector.get(TemplateCache) |
| 314 .put('foo.html', new HttpResponse(200, '<div>{{\'World\' | hello}}</di
v>')); | 314 .put('foo.html', new HttpResponse(200, '<div>{{\'World\' | hello}}</di
v>')); |
| 315 | 315 |
| 316 Element root = _.compile('<ng-view></ng-view>'); | 316 Element root = _.compile('<div><ng-view></ng-view></div>'); |
| 317 expect(root.text).toEqual(''); | 317 expect(root.text).toEqual(''); |
| 318 | 318 |
| 319 router.route('/foo'); | 319 router.route('/foo'); |
| 320 microLeap(); | 320 microLeap(); |
| 321 _.rootScope.apply(); | 321 _.rootScope.apply(); |
| 322 | |
| 323 expect(root.text).toEqual('Hello, World!'); | 322 expect(root.text).toEqual('Hello, World!'); |
| 324 })); | 323 })); |
| 325 | 324 |
| 326 | 325 |
| 327 it('should asynchronously load new filters from modules ', async(() { | 326 it('should asynchronously load new formatters from modules ', async(() { |
| 328 initRouter((Router router, ViewFactory views) { | 327 initRouter((Router router, RouteViewFactory views) { |
| 329 views.configure({ | 328 views.configure({ |
| 330 'foo': ngRoute( | 329 'foo': ngRoute( |
| 331 path: '/foo', | 330 path: '/foo', |
| 332 modules: () => new Future.value([ | 331 modules: () => new Future.value([ |
| 333 new Module()..type(HelloFilter) | 332 new Module()..type(HelloFilter) |
| 334 ]), | 333 ]), |
| 335 view: 'foo.html' | 334 view: 'foo.html' |
| 336 ), | 335 ), |
| 337 }); | 336 }); |
| 338 }); | 337 }); |
| 339 _.injector.get(TemplateCache) | 338 _.injector.get(TemplateCache) |
| 340 .put('foo.html', new HttpResponse(200, '<div>{{\'World\' | hello}}</di
v>')); | 339 .put('foo.html', new HttpResponse(200, '<div>{{\'World\' | hello}}</di
v>')); |
| 341 | 340 |
| 342 Element root = _.compile('<ng-view></ng-view>'); | 341 Element root = _.compile('<div><ng-view></ng-view></div>'); |
| 343 expect(root.text).toEqual(''); | 342 expect(root.text).toEqual(''); |
| 344 | 343 |
| 345 router.route('/foo'); | 344 router.route('/foo'); |
| 346 microLeap(); | 345 microLeap(); |
| 347 _.rootScope.apply(); | 346 _.rootScope.apply(); |
| 348 | |
| 349 expect(root.text).toEqual('Hello, World!'); | 347 expect(root.text).toEqual('Hello, World!'); |
| 350 })); | 348 })); |
| 351 | 349 |
| 352 }); | 350 }); |
| 353 } | 351 } |
| 354 | 352 |
| 355 var _router; | 353 var _router; |
| 356 var _initRoutesCalls = 0; | 354 var _initRoutesCalls = 0; |
| 357 | 355 |
| 358 void initRoutes(Router router, ViewFactory view) { | 356 void initRoutes(Router router, RouteViewFactory view) { |
| 359 _initRoutesCalls++; | 357 _initRoutesCalls++; |
| 360 _router = router; | 358 _router = router; |
| 361 } | 359 } |
| 362 | 360 |
| 363 @NgDirective(selector: '[make-it-new]') | 361 @Decorator(selector: '[make-it-new]') |
| 364 class NewDirective { | 362 class NewDirective { |
| 365 NewDirective(Element element) { | 363 NewDirective(Element element) { |
| 366 element.innerHtml = 'New!'; | 364 element.innerHtml = 'New!'; |
| 367 } | 365 } |
| 368 } | 366 } |
| 369 | 367 |
| 370 @NgFilter(name:'hello') | 368 @Formatter(name:'hello') |
| 371 class HelloFilter { | 369 class HelloFilter { |
| 372 call(String str) { | 370 String call(String str) { |
| 373 return 'Hello, $str!'; | 371 return 'Hello, $str!'; |
| 374 } | 372 } |
| 375 } | 373 } |
| 376 | 374 |
| OLD | NEW |