Skip to content

Commit 0aac7bb

Browse files
vicbvicb
committed
refactor(NgView): Use the ViewPort
fixes dart-archive#704
1 parent 4e05e5c commit 0aac7bb

File tree

4 files changed

+41
-31
lines changed

4 files changed

+41
-31
lines changed

‎lib/mock/test_bed.dart

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ part of angular.mock;
88
*/
99
class TestBed {
1010
final Injector injector;
11-
final Scope rootScope;
11+
final RootScope rootScope;
1212
final Compiler compiler;
1313
final Parser _parser;
1414
final Expando expando;

‎lib/routing/ng_view.dart

Lines changed: 7 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,8 @@ part of angular.routing;
5454
@Decorator(
5555
selector: 'ng-view',
5656
module: NgView.module,
57-
visibility: Visibility.CHILDREN)
57+
visibility: Visibility.CHILDREN,
58+
children: Directive.TRANSCLUDE_CHILDREN)
5859
class NgView implements DetachAware, RouteProvider {
5960
static void module(DirectiveBinder binder) =>
6061
binder.bind(RouteProvider, toInstanceOf: NG_VIEW_KEY, visibility: Visibility.CHILDREN);
@@ -63,16 +64,16 @@ class NgView implements DetachAware, RouteProvider {
6364
final ViewCache _viewCache;
6465
final Injector _appInjector;
6566
final DirectiveInjector _dirInjector;
66-
final Element _element;
67+
final ViewPort _viewPort;
6768
final Scope _scope;
6869
RouteHandle _parentRoute;
6970

7071
View _view;
7172
Scope _childScope;
7273
Route _viewRoute;
7374

74-
NgView(this._element, this._viewCache, this._dirInjector, this._appInjector,
75-
Router router, this._scope, this._locationService)
75+
NgView(this._viewCache, this._dirInjector, this._appInjector, Router router, this._scope,
76+
this._locationService, this._viewPort)
7677
{
7778
RouteProvider routeProvider = _dirInjector.getFromParentByKey(NG_VIEW_KEY);
7879
// Get the parent route
@@ -123,19 +124,14 @@ class NgView implements DetachAware, RouteProvider {
123124

124125
viewFuture.then((ViewFactory viewFactory) {
125126
_cleanUp();
126-
_childScope = _scope.createChild(new PrototypeMap(_scope.context));
127-
_view = viewFactory(_childScope, _dirInjector);
128-
_view.nodes.forEach((elm) => _element.append(elm));
127+
_view = _viewPort.insertNew(viewFactory);
129128
});
130129
}
131130

132131
void _cleanUp() {
133132
if (_view == null) return;
134-
135-
_view.nodes.forEach((node) => node.remove());
136-
_childScope.destroy();
133+
_viewPort.remove(_view);
137134
_view = null;
138-
_childScope = null;
139135
}
140136

141137
/// implements `RouteProvider.route`

‎test/routing/ng_view_spec.dart

Lines changed: 19 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -28,24 +28,27 @@ main() => describe('ngView', () {
2828

2929

3030
it('should switch template', async(() {
31-
Element root = _.compile('<ng-view></ng-view>');
31+
Element root = _.compile('<div><ng-view></ng-view></div>');
3232
expect(root.text).toEqual('');
3333

3434
router.route('/foo');
3535
microLeap();
36+
_.rootScope.apply();
3637
expect(root.text).toEqual('Foo');
3738

3839
router.route('/bar');
3940
microLeap();
41+
_.rootScope.apply();
4042
expect(root.text).toEqual('Bar');
4143

4244
router.route('/foo');
4345
microLeap();
46+
_.rootScope.apply();
4447
expect(root.text).toEqual('Foo');
4548
}));
4649

4750
it('should expose NgView as RouteProvider', async(() {
48-
_.compile('<ng-view probe="m"></ng-view>');
51+
_.compile('<div><ng-view probe="m"></ng-view></div>');
4952
router.route('/foo');
5053
microLeap();
5154
_.rootScope.apply();
@@ -57,36 +60,38 @@ main() => describe('ngView', () {
5760

5861
it('should switch template when route is already active', async(() {
5962
// Force the routing system to initialize.
60-
_.compile('<ng-view></ng-view>');
63+
_.compile('<div><ng-view></ng-view></div>');
6164

6265
router.route('/foo');
6366
microLeap();
64-
Element root = _.compile('<ng-view></ng-view>');
67+
Element root = _.compile('<div><ng-view></ng-view></div>');
6568
expect(root.text).toEqual('');
6669

67-
_.rootScope.apply();
6870
microLeap();
71+
_.rootScope.apply();
6972
expect(root.text).toEqual('Foo');
7073
}));
7174

7275

7376
it('should clear template when route is deactivated', async(() {
74-
Element root = _.compile('<ng-view></ng-view>');
77+
Element root = _.compile('<div><ng-view></ng-view></div>');
7578
expect(root.text).toEqual('');
7679

7780
router.route('/foo');
7881
microLeap();
82+
_.rootScope.apply();
7983
expect(root.text).toEqual('Foo');
8084

8185
router.route('/baz'); // route without a template
8286
microLeap();
87+
_.rootScope.apply();
8388
expect(root.text).toEqual('');
8489
}));
8590

8691
});
8792

8893

89-
describe('Nested ngView', () {
94+
ddescribe('Nested ngView', () {
9095
TestBed _;
9196
Router router;
9297

@@ -103,7 +108,7 @@ main() => describe('ngView', () {
103108

104109
templates.put('library.html', new HttpResponse(200,
105110
'<div><h1>Library</h1>'
106-
'<ng-view ng-if="flag"></ng-view></div>'));
111+
'<div ng-if="flag"><ng-view></ng-view></div>'));
107112
templates.put('book_list.html', new HttpResponse(200,
108113
'<h1>Books</h1>'));
109114
templates.put('book_overview.html', new HttpResponse(200,
@@ -114,7 +119,7 @@ main() => describe('ngView', () {
114119
});
115120

116121
it('should switch nested templates', async(() {
117-
Element root = _.compile('<ng-view></ng-view>');
122+
Element root = _.compile('<div><ng-view></ng-view></div>');
118123
microLeap(); _.rootScope.apply(); microLeap();
119124
expect(root.text).toEqual('');
120125

@@ -142,7 +147,7 @@ main() => describe('ngView', () {
142147
// https://github.com/angular/angular.dart/issues/1182
143148
// and repro case
144149
// https://github.com/chirayuk/sample/tree/issue_1182_leaving_a_nested_ng_view
145-
Element root = _.compile('<ng-view></ng-view>');
150+
Element root = _.compile('<div><ng-view></ng-view></div>');
146151
microLeap(); _.rootScope.apply(); microLeap();
147152

148153
router.route('/library/1234');
@@ -181,11 +186,12 @@ main() => describe('ngView', () {
181186
});
182187

183188
it('should switch inline templates', async(() {
184-
Element root = _.compile('<ng-view></ng-view>');
189+
Element root = _.compile('<div><ng-view></ng-view></div>');
185190
expect(root.text).toEqual('');
186191

187192
router.route('/foo');
188193
microLeap();
194+
_.rootScope.flush();
189195
expect(root.text).toEqual('Hello');
190196
}));
191197
});
@@ -212,7 +218,8 @@ class NestedRouteInitializer implements Function {
212218
'book': ngRoute(
213219
path: '/:bookId',
214220
mount: {
215-
'overview': ngRoute(path: '/overview', view: 'book_overview.html',
221+
'overview': ngRoute(path: '/overview',
222+
view: 'book_overview.html',
216223
defaultRoute: true),
217224
'read': ngRoute(path: '/read', view: 'book_read.html'),
218225
'admin': ngRoute(path: '/admin', view: 'admin.html'),

‎test/routing/routing_spec.dart

Lines changed: 14 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -182,11 +182,12 @@ main() {
182182
_.injector.get(TemplateCache)
183183
.put('foo.html', new HttpResponse(200, '<h1>Foo</h1>'));
184184

185-
Element root = _.compile('<ng-view></ng-view>');
185+
Element root = _.compile('<div><ng-view></ng-view></div>');
186186
expect(root.text).toEqual('');
187187

188188
router.route('/foo');
189189
microLeap();
190+
_.rootScope.apply();
190191

191192
expect(enterCount).toBe(1);
192193
expect(root.text).toEqual('Foo');
@@ -236,17 +237,19 @@ main() {
236237
_.injector.get(TemplateCache)
237238
.put('foo.html', new HttpResponse(200, '<h1>Foo</h1>'));
238239

239-
Element root = _.compile('<ng-view></ng-view>');
240+
Element root = _.compile('<div><ng-view></ng-view></div>');
240241
expect(root.text).toEqual('');
241242

242243
router.route('/foo');
243244
microLeap();
245+
_.rootScope.apply();
244246

245247
expect(preLeaveCount).toBe(0);
246248
expect(root.text).toEqual('Foo');
247249

248250
router.route('');
249251
microLeap();
252+
_.rootScope.apply();
250253

251254
expect(preLeaveCount).toBe(1);
252255
expect(root.text).toEqual('Foo'); // didn't leave.
@@ -315,17 +318,19 @@ main() {
315318
_.injector.get(TemplateCache)
316319
.put('foo.html', new HttpResponse(200, '<h1>Foo</h1>'));
317320

318-
Element root = _.compile('<ng-view></ng-view>');
321+
Element root = _.compile('<div><ng-view></ng-view></div>');
319322
expect(root.text).toEqual('');
320323

321324
router.route('/foo');
322325
microLeap();
326+
_.rootScope.apply();
323327

324328
expect(root.text).toEqual('Foo');
325329
expect(leaveCount).toBe(0);
326330

327331
router.route('/bar');
328332
microLeap();
333+
_.rootScope.apply();
329334

330335
expect(root.text).toEqual('');
331336
expect(leaveCount).toBe(1);
@@ -347,11 +352,12 @@ main() {
347352
_.injector.get(TemplateCache)
348353
.put('foo.html', new HttpResponse(200, '<div make-it-new>Old!</div>'));
349354

350-
Element root = _.compile('<ng-view></ng-view>');
355+
Element root = _.compile('<div><ng-view></ng-view></div>');
351356
expect(root.text).toEqual('');
352357

353358
router.route('/foo');
354359
microLeap();
360+
_.rootScope.apply();
355361

356362
expect(root.text).toEqual('New!');
357363
}));
@@ -372,11 +378,12 @@ main() {
372378
_.injector.get(TemplateCache)
373379
.put('foo.html', new HttpResponse(200, '<div make-it-new>Old!</div>'));
374380

375-
Element root = _.compile('<ng-view></ng-view>');
381+
Element root = _.compile('<div><ng-view></ng-view></div>');
376382
expect(root.text).toEqual('');
377383

378384
router.route('/foo');
379385
microLeap();
386+
_.rootScope.apply();
380387

381388
expect(root.text).toEqual('New!');
382389
}));
@@ -397,7 +404,7 @@ main() {
397404
_.injector.get(TemplateCache)
398405
.put('foo.html', new HttpResponse(200, '<div>{{\'World\' | hello}}</div>'));
399406

400-
Element root = _.compile('<ng-view></ng-view>');
407+
Element root = _.compile('<div><ng-view></ng-view></div>');
401408
expect(root.text).toEqual('');
402409

403410
router.route('/foo');
@@ -423,7 +430,7 @@ main() {
423430
_.injector.get(TemplateCache)
424431
.put('foo.html', new HttpResponse(200, '<div>{{\'World\' | hello}}</div>'));
425432

426-
Element root = _.compile('<ng-view></ng-view>');
433+
Element root = _.compile('<div><ng-view></ng-view></div>');
427434
expect(root.text).toEqual('');
428435

429436
router.route('/foo');

0 commit comments

Comments
 (0)