diff --git a/modules/angular2/test/directives/class_spec.js b/modules/angular2/test/directives/class_spec.js
deleted file mode 100644
index d58f87e265..0000000000
--- a/modules/angular2/test/directives/class_spec.js
+++ /dev/null
@@ -1,152 +0,0 @@
-import {
- AsyncTestCompleter,
- beforeEach,
- beforeEachBindings,
- ddescribe,
- xdescribe,
- describe,
- el,
- expect,
- iit,
- inject,
- it,
- xit,
- } from 'angular2/test_lib';
-
-import {StringMapWrapper} from 'angular2/src/facade/collection';
-
-import {View} from 'angular2/src/core/annotations_impl/view';
-import {Component} from 'angular2/src/core/annotations_impl/annotations';
-
-import {TestBed} from 'angular2/src/test_lib/test_bed';
-
-import {CSSClass} from 'angular2/src/directives/class';
-
-export function main() {
- describe('binding to CSS class list', () => {
-
- it('should add classes specified in an object literal',
- inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var template = '
';
-
- tb.createView(TestComponent, {html: template}).then((view) => {
- view.detectChanges();
- expect(view.rootNodes[0].className).toEqual('ng-binding foo');
-
- async.done();
- });
- }));
-
- it('should add and remove classes based on changes in object literal values',
- inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var template = '';
-
- tb.createView(TestComponent, {html: template}).then((view) => {
- view.detectChanges();
- expect(view.rootNodes[0].className).toEqual('ng-binding foo');
-
- view.context.condition = false;
- view.detectChanges();
- expect(view.rootNodes[0].className).toEqual('ng-binding bar');
-
- async.done();
- });
- }));
-
- it('should add and remove classes based on changes to the expression object',
- inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var template = '';
-
- tb.createView(TestComponent, {html: template}).then((view) => {
- view.detectChanges();
- expect(view.rootNodes[0].className).toEqual('ng-binding foo');
-
- StringMapWrapper.set(view.context.expr, 'bar', true);
- view.detectChanges();
- expect(view.rootNodes[0].className).toEqual('ng-binding foo bar');
-
- StringMapWrapper.set(view.context.expr, 'baz', true);
- view.detectChanges();
- expect(view.rootNodes[0].className).toEqual('ng-binding foo bar baz');
-
- StringMapWrapper.delete(view.context.expr, 'bar');
- view.detectChanges();
- expect(view.rootNodes[0].className).toEqual('ng-binding foo baz');
-
- async.done();
- });
- }));
-
- it('should retain existing classes when expression evaluates to null',
- inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var template = '';
-
- tb.createView(TestComponent, {html: template}).then((view) => {
- view.detectChanges();
- expect(view.rootNodes[0].className).toEqual('ng-binding foo');
-
- view.context.expr = null;
- view.detectChanges();
- expect(view.rootNodes[0].className).toEqual('ng-binding foo');
-
- view.context.expr = {'foo': false, 'bar': true};
- view.detectChanges();
- expect(view.rootNodes[0].className).toEqual('ng-binding bar');
-
- async.done();
- });
- }));
-
- it('should co-operate with the class attribute',
- inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var template = '';
-
- tb.createView(TestComponent, {html: template}).then((view) => {
- StringMapWrapper.set(view.context.expr, 'bar', true);
- view.detectChanges();
- expect(view.rootNodes[0].className).toEqual('init foo ng-binding bar');
-
- StringMapWrapper.set(view.context.expr, 'foo', false);
- view.detectChanges();
- expect(view.rootNodes[0].className).toEqual('init ng-binding bar');
-
- async.done();
- });
- }));
-
- it('should co-operate with the class attribute and class.name binding',
- inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var template = '';
-
- tb.createView(TestComponent, {html: template}).then((view) => {
- view.detectChanges();
- expect(view.rootNodes[0].className).toEqual('init foo ng-binding baz');
-
- StringMapWrapper.set(view.context.expr, 'bar', true);
- view.detectChanges();
- expect(view.rootNodes[0].className).toEqual('init foo ng-binding baz bar');
-
- StringMapWrapper.set(view.context.expr, 'foo', false);
- view.detectChanges();
- expect(view.rootNodes[0].className).toEqual('init ng-binding baz bar');
-
- view.context.condition = false;
- view.detectChanges();
- expect(view.rootNodes[0].className).toEqual('init ng-binding bar');
-
- async.done();
- });
- }));
- })
-}
-
-@Component({selector: 'test-cmp'})
-@View({directives: [CSSClass]})
-class TestComponent {
- condition:boolean;
- expr;
- constructor() {
- this.condition = true;
- this.expr = {'foo': true, 'bar': false};
- }
-}
diff --git a/modules/angular2/test/directives/class_spec.ts b/modules/angular2/test/directives/class_spec.ts
new file mode 100644
index 0000000000..63a5eb5d1d
--- /dev/null
+++ b/modules/angular2/test/directives/class_spec.ts
@@ -0,0 +1,160 @@
+import {
+ AsyncTestCompleter,
+ beforeEach,
+ beforeEachBindings,
+ ddescribe,
+ xdescribe,
+ describe,
+ el,
+ expect,
+ iit,
+ inject,
+ it,
+ xit,
+} from 'angular2/test_lib';
+
+import {StringMapWrapper} from 'angular2/src/facade/collection';
+
+import {Component, View} from 'angular2/angular2';
+
+import {TestBed} from 'angular2/src/test_lib/test_bed';
+
+import {CSSClass} from 'angular2/src/directives/class';
+
+export function main() {
+ describe('binding to CSS class list', () => {
+
+ it('should add classes specified in an object literal',
+ inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var template = '';
+
+ tb.createView(TestComponent, {html: template})
+ .then((view) => {
+ view.detectChanges();
+ expect(view.rootNodes[0].className).toEqual('ng-binding foo');
+
+ async.done();
+ });
+ }));
+
+ it('should add and remove classes based on changes in object literal values',
+ inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var template = '';
+
+ tb.createView(TestComponent, {html: template})
+ .then((view) => {
+ view.detectChanges();
+ expect(view.rootNodes[0].className).toEqual('ng-binding foo');
+
+ view.context.condition = false;
+ view.detectChanges();
+ expect(view.rootNodes[0].className).toEqual('ng-binding bar');
+
+ async.done();
+ });
+ }));
+
+ it('should add and remove classes based on changes to the expression object',
+ inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var template = '';
+
+ tb.createView(TestComponent, {html: template})
+ .then((view) => {
+ view.detectChanges();
+ expect(view.rootNodes[0].className).toEqual('ng-binding foo');
+
+ StringMapWrapper.set(view.context.expr, 'bar', true);
+ view.detectChanges();
+ expect(view.rootNodes[0].className).toEqual('ng-binding foo bar');
+
+ StringMapWrapper.set(view.context.expr, 'baz', true);
+ view.detectChanges();
+ expect(view.rootNodes[0].className).toEqual('ng-binding foo bar baz');
+
+ StringMapWrapper.delete(view.context.expr, 'bar');
+ view.detectChanges();
+ expect(view.rootNodes[0].className).toEqual('ng-binding foo baz');
+
+ async.done();
+ });
+ }));
+
+ it('should retain existing classes when expression evaluates to null',
+ inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var template = '';
+
+ tb.createView(TestComponent, {html: template})
+ .then((view) => {
+ view.detectChanges();
+ expect(view.rootNodes[0].className).toEqual('ng-binding foo');
+
+ view.context.expr = null;
+ view.detectChanges();
+ expect(view.rootNodes[0].className).toEqual('ng-binding foo');
+
+ view.context.expr = {
+ 'foo': false,
+ 'bar': true
+ };
+ view.detectChanges();
+ expect(view.rootNodes[0].className).toEqual('ng-binding bar');
+
+ async.done();
+ });
+ }));
+
+ it('should co-operate with the class attribute',
+ inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var template = '';
+
+ tb.createView(TestComponent, {html: template})
+ .then((view) => {
+ StringMapWrapper.set(view.context.expr, 'bar', true);
+ view.detectChanges();
+ expect(view.rootNodes[0].className).toEqual('init foo ng-binding bar');
+
+ StringMapWrapper.set(view.context.expr, 'foo', false);
+ view.detectChanges();
+ expect(view.rootNodes[0].className).toEqual('init ng-binding bar');
+
+ async.done();
+ });
+ }));
+
+ it('should co-operate with the class attribute and class.name binding',
+ inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var template = '';
+
+ tb.createView(TestComponent, {html: template})
+ .then((view) => {
+ view.detectChanges();
+ expect(view.rootNodes[0].className).toEqual('init foo ng-binding baz');
+
+ StringMapWrapper.set(view.context.expr, 'bar', true);
+ view.detectChanges();
+ expect(view.rootNodes[0].className).toEqual('init foo ng-binding baz bar');
+
+ StringMapWrapper.set(view.context.expr, 'foo', false);
+ view.detectChanges();
+ expect(view.rootNodes[0].className).toEqual('init ng-binding baz bar');
+
+ view.context.condition = false;
+ view.detectChanges();
+ expect(view.rootNodes[0].className).toEqual('init ng-binding bar');
+
+ async.done();
+ });
+ }));
+ })
+}
+
+@Component({selector: 'test-cmp'})
+@View({directives: [CSSClass]})
+class TestComponent {
+ condition: boolean;
+ expr;
+ constructor() {
+ this.condition = true;
+ this.expr = {'foo': true, 'bar': false};
+ }
+}
diff --git a/modules/angular2/test/directives/ng_for_spec.js b/modules/angular2/test/directives/ng_for_spec.js
deleted file mode 100644
index 6a99a28f55..0000000000
--- a/modules/angular2/test/directives/ng_for_spec.js
+++ /dev/null
@@ -1,240 +0,0 @@
-import {
- AsyncTestCompleter,
- beforeEach,
- beforeEachBindings,
- ddescribe,
- describe,
- el,
- expect,
- iit,
- inject,
- it,
- xit,
-} from 'angular2/test_lib';
-
-import {DOM} from 'angular2/src/dom/dom_adapter';
-import {ListWrapper} from 'angular2/src/facade/collection';
-
-import {Component} from 'angular2/src/core/annotations_impl/annotations';
-import {View} from 'angular2/src/core/annotations_impl/view';
-
-import {NgFor} from 'angular2/src/directives/ng_for';
-
-import {TestBed} from 'angular2/src/test_lib/test_bed';
-
-
-export function main() {
- describe('ng-for', () => {
- var TEMPLATE = '{{item.toString()}};
';
-
- it('should reflect initial elements', inject([TestBed, AsyncTestCompleter], (tb, async) => {
- tb.createView(TestComponent, {html: TEMPLATE}).then((view) => {
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('1;2;');
- async.done();
- });
- }));
-
- it('should reflect added elements', inject([TestBed, AsyncTestCompleter], (tb, async) => {
- tb.createView(TestComponent, {html: TEMPLATE}).then((view) => {
- view.detectChanges();
-
- ListWrapper.push(view.context.items, 3);
- view.detectChanges();
-
- expect(DOM.getText(view.rootNodes[0])).toEqual('1;2;3;');
- async.done();
- });
- }));
-
- it('should reflect removed elements', inject([TestBed, AsyncTestCompleter], (tb, async) => {
- tb.createView(TestComponent, {html: TEMPLATE}).then((view) => {
- view.detectChanges();
-
- ListWrapper.removeAt(view.context.items, 1);
- view.detectChanges();
-
- expect(DOM.getText(view.rootNodes[0])).toEqual('1;');
- async.done();
- });
- }));
-
- it('should reflect moved elements', inject([TestBed, AsyncTestCompleter], (tb, async) => {
- tb.createView(TestComponent, {html: TEMPLATE}).then((view) => {
- view.detectChanges();
-
- ListWrapper.removeAt(view.context.items, 0);
- ListWrapper.push(view.context.items, 1);
- view.detectChanges();
-
- expect(DOM.getText(view.rootNodes[0])).toEqual('2;1;');
- async.done();
- });
- }));
-
- it('should reflect a mix of all changes (additions/removals/moves)',
- inject([TestBed, AsyncTestCompleter], (tb, async) => {
- tb.createView(TestComponent, {html: TEMPLATE}).then((view) => {
- view.context.items = [0, 1, 2, 3, 4, 5];
- view.detectChanges();
-
- view.context.items = [6, 2, 7, 0, 4, 8];
- view.detectChanges();
-
- expect(DOM.getText(view.rootNodes[0])).toEqual('6;2;7;0;4;8;');
- async.done();
- });
- }));
-
- it('should iterate over an array of objects', inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var template = '';
-
- tb.createView(TestComponent, {html: template}).then((view) => {
-
- // INIT
- view.context.items = [{'name': 'misko'}, {'name':'shyam'}];
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('misko;shyam;');
-
- // GROW
- ListWrapper.push(view.context.items, {'name': 'adam'});
- view.detectChanges();
-
- expect(DOM.getText(view.rootNodes[0])).toEqual('misko;shyam;adam;');
-
- // SHRINK
- ListWrapper.removeAt(view.context.items, 2);
- ListWrapper.removeAt(view.context.items, 0);
- view.detectChanges();
-
- expect(DOM.getText(view.rootNodes[0])).toEqual('shyam;');
- async.done();
- });
- }));
-
- it('should gracefully handle nulls', inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var template = '';
- tb.createView(TestComponent, {html: template}).then((view) => {
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('');
- async.done();
- });
- }));
-
- it('should gracefully handle ref changing to null and back',
- inject([TestBed, AsyncTestCompleter], (tb, async) => {
- tb.createView(TestComponent, {html: TEMPLATE}).then((view) => {
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('1;2;');
-
- view.context.items = null;
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('');
-
- view.context.items = [1, 2, 3];
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('1;2;3;');
- async.done();
- });
- }));
-
- it('should throw on ref changing to string', inject([TestBed, AsyncTestCompleter], (tb, async) => {
- tb.createView(TestComponent, {html: TEMPLATE}).then((view) => {
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('1;2;');
-
- view.context.items = 'whaaa';
- expect(() => view.detectChanges()).toThrowError();
- async.done();
- });
- }));
-
- it('should works with duplicates', inject([TestBed, AsyncTestCompleter], (tb, async) => {
- tb.createView(TestComponent, {html: TEMPLATE}).then((view) => {
- var a = new Foo();
- view.context.items = [a, a];
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('foo;foo;');
- async.done();
- });
- }));
-
- it('should repeat over nested arrays', inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var template =
- ''+
- '
' +
- '
' +
- '{{subitem}}-{{item.length}};' +
- '
|'+
- '
'+
- '
';
-
- tb.createView(TestComponent, {html: template}).then((view) => {
- view.context.items = [['a', 'b'], ['c']];
- view.detectChanges();
- view.detectChanges();
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('a-2;b-2;|c-1;|');
-
- view.context.items = [['e'], ['f', 'g']];
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('e-1;|f-2;g-2;|');
-
- async.done();
- });
- }));
-
- it('should repeat over nested arrays with no intermediate element',
- inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var template =
- '' +
- '' +
- '{{subitem}}-{{item.length}};' +
- '
';
-
- tb.createView(TestComponent, {html: template}).then((view) => {
- view.context.items = [['a', 'b'], ['c']];
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('a-2;b-2;c-1;');
-
- view.context.items = [['e'], ['f', 'g']];
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('e-1;f-2;g-2;');
- async.done();
- });
- }));
-
- it('should display indices correctly',
- inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var template =
- '{{i.toString()}}
';
-
- tb.createView(TestComponent, {html: template}).then((view) => {
- view.context.items = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('0123456789');
-
- view.context.items = [1, 2, 6, 7, 4, 3, 5, 8, 9, 0];
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('0123456789');
- async.done();
- });
- }));
-
- });
-}
-
-class Foo {
- toString() {
- return 'foo';
- }
-}
-
-@Component({selector: 'test-cmp'})
-@View({directives: [NgFor]})
-class TestComponent {
- items: any;
- constructor() {
- this.items = [1, 2];
- }
-}
diff --git a/modules/angular2/test/directives/ng_for_spec.ts b/modules/angular2/test/directives/ng_for_spec.ts
new file mode 100644
index 0000000000..beb395f1c3
--- /dev/null
+++ b/modules/angular2/test/directives/ng_for_spec.ts
@@ -0,0 +1,248 @@
+import {
+ AsyncTestCompleter,
+ beforeEach,
+ beforeEachBindings,
+ ddescribe,
+ describe,
+ el,
+ expect,
+ iit,
+ inject,
+ it,
+ xit,
+} from 'angular2/test_lib';
+
+import {DOM} from 'angular2/src/dom/dom_adapter';
+import {ListWrapper} from 'angular2/src/facade/collection';
+
+import {Component, View} from 'angular2/angular2';
+
+import {NgFor} from 'angular2/src/directives/ng_for';
+
+import {TestBed} from 'angular2/src/test_lib/test_bed';
+
+
+export function main() {
+ describe('ng-for', () => {
+ var TEMPLATE =
+ '{{item.toString()}};
';
+
+ it('should reflect initial elements', inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ tb.createView(TestComponent, {html: TEMPLATE})
+ .then((view) => {
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('1;2;');
+ async.done();
+ });
+ }));
+
+ it('should reflect added elements', inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ tb.createView(TestComponent, {html: TEMPLATE})
+ .then((view) => {
+ view.detectChanges();
+
+ ListWrapper.push(view.context.items, 3);
+ view.detectChanges();
+
+ expect(DOM.getText(view.rootNodes[0])).toEqual('1;2;3;');
+ async.done();
+ });
+ }));
+
+ it('should reflect removed elements', inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ tb.createView(TestComponent, {html: TEMPLATE})
+ .then((view) => {
+ view.detectChanges();
+
+ ListWrapper.removeAt(view.context.items, 1);
+ view.detectChanges();
+
+ expect(DOM.getText(view.rootNodes[0])).toEqual('1;');
+ async.done();
+ });
+ }));
+
+ it('should reflect moved elements', inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ tb.createView(TestComponent, {html: TEMPLATE})
+ .then((view) => {
+ view.detectChanges();
+
+ ListWrapper.removeAt(view.context.items, 0);
+ ListWrapper.push(view.context.items, 1);
+ view.detectChanges();
+
+ expect(DOM.getText(view.rootNodes[0])).toEqual('2;1;');
+ async.done();
+ });
+ }));
+
+ it('should reflect a mix of all changes (additions/removals/moves)',
+ inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ tb.createView(TestComponent, {html: TEMPLATE})
+ .then((view) => {
+ view.context.items = [0, 1, 2, 3, 4, 5];
+ view.detectChanges();
+
+ view.context.items = [6, 2, 7, 0, 4, 8];
+ view.detectChanges();
+
+ expect(DOM.getText(view.rootNodes[0])).toEqual('6;2;7;0;4;8;');
+ async.done();
+ });
+ }));
+
+ it('should iterate over an array of objects',
+ inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var template = '';
+
+ tb.createView(TestComponent, {html: template})
+ .then((view) => {
+
+ // INIT
+ view.context.items = [{'name': 'misko'}, {'name': 'shyam'}];
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('misko;shyam;');
+
+ // GROW
+ ListWrapper.push(view.context.items, {'name': 'adam'});
+ view.detectChanges();
+
+ expect(DOM.getText(view.rootNodes[0])).toEqual('misko;shyam;adam;');
+
+ // SHRINK
+ ListWrapper.removeAt(view.context.items, 2);
+ ListWrapper.removeAt(view.context.items, 0);
+ view.detectChanges();
+
+ expect(DOM.getText(view.rootNodes[0])).toEqual('shyam;');
+ async.done();
+ });
+ }));
+
+ it('should gracefully handle nulls', inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var template = '';
+ tb.createView(TestComponent, {html: template})
+ .then((view) => {
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('');
+ async.done();
+ });
+ }));
+
+ it('should gracefully handle ref changing to null and back',
+ inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ tb.createView(TestComponent, {html: TEMPLATE})
+ .then((view) => {
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('1;2;');
+
+ view.context.items = null;
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('');
+
+ view.context.items = [1, 2, 3];
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('1;2;3;');
+ async.done();
+ });
+ }));
+
+ it('should throw on ref changing to string',
+ inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ tb.createView(TestComponent, {html: TEMPLATE})
+ .then((view) => {
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('1;2;');
+
+ view.context.items = 'whaaa';
+ expect(() => view.detectChanges()).toThrowError();
+ async.done();
+ });
+ }));
+
+ it('should works with duplicates', inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ tb.createView(TestComponent, {html: TEMPLATE})
+ .then((view) => {
+ var a = new Foo();
+ view.context.items = [a, a];
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('foo;foo;');
+ async.done();
+ });
+ }));
+
+ it('should repeat over nested arrays', inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var template = '' +
+ '
' +
+ '
' +
+ '{{subitem}}-{{item.length}};' +
+ '
|' +
+ '
' +
+ '
';
+
+ tb.createView(TestComponent, {html: template})
+ .then((view) => {
+ view.context.items = [['a', 'b'], ['c']];
+ view.detectChanges();
+ view.detectChanges();
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('a-2;b-2;|c-1;|');
+
+ view.context.items = [['e'], ['f', 'g']];
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('e-1;|f-2;g-2;|');
+
+ async.done();
+ });
+ }));
+
+ it('should repeat over nested arrays with no intermediate element',
+ inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var template = '' +
+ '' +
+ '{{subitem}}-{{item.length}};' +
+ '
';
+
+ tb.createView(TestComponent, {html: template})
+ .then((view) => {
+ view.context.items = [['a', 'b'], ['c']];
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('a-2;b-2;c-1;');
+
+ view.context.items = [['e'], ['f', 'g']];
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('e-1;f-2;g-2;');
+ async.done();
+ });
+ }));
+
+ it('should display indices correctly', inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var template =
+ '{{i.toString()}}
';
+
+ tb.createView(TestComponent, {html: template})
+ .then((view) => {
+ view.context.items = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('0123456789');
+
+ view.context.items = [1, 2, 6, 7, 4, 3, 5, 8, 9, 0];
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('0123456789');
+ async.done();
+ });
+ }));
+
+ });
+}
+
+class Foo {
+ toString() { return 'foo'; }
+}
+
+@Component({selector: 'test-cmp'})
+@View({directives: [NgFor]})
+class TestComponent {
+ items: any;
+ constructor() { this.items = [1, 2]; }
+}
diff --git a/modules/angular2/test/directives/ng_if_spec.js b/modules/angular2/test/directives/ng_if_spec.js
deleted file mode 100644
index efbef80599..0000000000
--- a/modules/angular2/test/directives/ng_if_spec.js
+++ /dev/null
@@ -1,202 +0,0 @@
-import {
- AsyncTestCompleter,
- beforeEach,
- ddescribe,
- describe,
- el,
- expect,
- iit,
- inject,
- IS_DARTIUM,
- it,
- xit,
-} from 'angular2/test_lib';
-
-import {DOM} from 'angular2/src/dom/dom_adapter';
-
-import {TestBed} from 'angular2/src/test_lib/test_bed';
-
-import {Component} from 'angular2/src/core/annotations_impl/annotations';
-import {View} from 'angular2/src/core/annotations_impl/view';
-
-import {NgIf} from 'angular2/src/directives/ng_if';
-
-export function main() {
- describe('if directive', () => {
- it('should work in a template attribute', inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var html = 'hello
';
-
- tb.createView(TestComponent, {html: html}).then((view) => {
- view.detectChanges();
- expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(1);
- expect(DOM.getText(view.rootNodes[0])).toEqual('hello');
- async.done();
- });
- }));
-
- it('should work in a template element', inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var html = 'hello2
';
-
- tb.createView(TestComponent, {html: html}).then((view) => {
- view.detectChanges();
- expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(1);
- expect(DOM.getText(view.rootNodes[0])).toEqual('hello2');
- async.done();
- });
- }));
-
- it('should toggle node when condition changes', inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var html = 'hello
';
-
- tb.createView(TestComponent, {html: html}).then((view) => {
- view.context.booleanCondition = false;
- view.detectChanges();
- expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(0);
- expect(DOM.getText(view.rootNodes[0])).toEqual('');
-
- view.context.booleanCondition = true;
- view.detectChanges();
- expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(1);
- expect(DOM.getText(view.rootNodes[0])).toEqual('hello');
-
- view.context.booleanCondition = false;
- view.detectChanges();
- expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(0);
- expect(DOM.getText(view.rootNodes[0])).toEqual('');
-
- async.done();
- });
- }));
-
- it('should handle nested if correctly', inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var html = 'hello
';
-
- tb.createView(TestComponent, {html: html}).then((view) => {
- view.context.booleanCondition = false;
- view.detectChanges();
- expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(0);
- expect(DOM.getText(view.rootNodes[0])).toEqual('');
-
- view.context.booleanCondition = true;
- view.detectChanges();
- expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(1);
- expect(DOM.getText(view.rootNodes[0])).toEqual('hello');
-
- view.context.nestedBooleanCondition = false;
- view.detectChanges();
- expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(0);
- expect(DOM.getText(view.rootNodes[0])).toEqual('');
-
- view.context.nestedBooleanCondition = true;
- view.detectChanges();
- expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(1);
- expect(DOM.getText(view.rootNodes[0])).toEqual('hello');
-
- view.context.booleanCondition = false;
- view.detectChanges();
- expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(0);
- expect(DOM.getText(view.rootNodes[0])).toEqual('');
-
- async.done();
- });
- }));
-
- it('should update several nodes with if', inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var html =
- '' +
- 'helloNumber' +
- 'helloString' +
- 'helloFunction' +
- '
';
-
- tb.createView(TestComponent, {html: html}).then((view) => {
- view.detectChanges();
- expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(3);
- expect(DOM.getText(view.rootNodes[0])).toEqual('helloNumberhelloStringhelloFunction');
-
- view.context.numberCondition = 0;
- view.detectChanges();
- expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(1);
- expect(DOM.getText(view.rootNodes[0])).toEqual('helloString');
-
- view.context.numberCondition = 1;
- view.context.stringCondition = "bar";
- view.detectChanges();
- expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(1);
- expect(DOM.getText(view.rootNodes[0])).toEqual('helloNumber');
- async.done();
- });
- }));
-
-
- if (!IS_DARTIUM) {
- it('should not add the element twice if the condition goes from true to true (JS)',
- inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var html = 'hello
';
-
- tb.createView(TestComponent, {html: html}).then((view) => {
- view.detectChanges();
- expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(1);
- expect(DOM.getText(view.rootNodes[0])).toEqual('hello');
-
- view.context.numberCondition = 2;
- view.detectChanges();
- expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(1);
- expect(DOM.getText(view.rootNodes[0])).toEqual('hello');
-
- async.done();
- });
- }));
-
- it('should not recreate the element if the condition goes from true to true (JS)',
- inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var html = 'hello
';
-
- tb.createView(TestComponent, {html: html}).then((view) => {
- view.detectChanges();
- DOM.addClass(view.rootNodes[0].childNodes[1], "foo");
-
- view.context.numberCondition = 2;
- view.detectChanges();
- expect(DOM.hasClass(view.rootNodes[0].childNodes[1], "foo")).toBe(true);
-
- async.done();
- });
- }));
- }
-
- if (IS_DARTIUM) {
- it('should not create the element if the condition is not a boolean (DART)',
- inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var html = 'hello
';
-
- tb.createView(TestComponent, {html: html}).then((view) => {
- expect(() => view.detectChanges()).toThrowError();
- expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(0);
- expect(DOM.getText(view.rootNodes[0])).toEqual('');
- async.done();
- });
- }));
- }
-
- });
-}
-
-@Component({selector: 'test-cmp'})
-@View({directives: [NgIf]})
-class TestComponent {
- booleanCondition: boolean;
- nestedBooleanCondition: boolean;
- numberCondition: number;
- stringCondition: string;
- functionCondition: Function;
- constructor() {
- this.booleanCondition = true;
- this.nestedBooleanCondition = true;
- this.numberCondition = 1;
- this.stringCondition = "foo";
- this.functionCondition = function(s, n){
- return s == "foo" && n == 1;
- };
- }
-}
diff --git a/modules/angular2/test/directives/ng_if_spec.ts b/modules/angular2/test/directives/ng_if_spec.ts
new file mode 100644
index 0000000000..f88c910724
--- /dev/null
+++ b/modules/angular2/test/directives/ng_if_spec.ts
@@ -0,0 +1,211 @@
+import {
+ AsyncTestCompleter,
+ beforeEach,
+ ddescribe,
+ describe,
+ el,
+ expect,
+ iit,
+ inject,
+ IS_DARTIUM,
+ it,
+ xit,
+} from 'angular2/test_lib';
+
+import {DOM} from 'angular2/src/dom/dom_adapter';
+
+import {TestBed} from 'angular2/src/test_lib/test_bed';
+
+import {Component, View} from 'angular2/angular2';
+
+import {NgIf} from 'angular2/src/directives/ng_if';
+
+export function main() {
+ describe('if directive', () => {
+ it('should work in a template attribute', inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var html = 'hello
';
+
+ tb.createView(TestComponent, {html: html})
+ .then((view) => {
+ view.detectChanges();
+ expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(1);
+ expect(DOM.getText(view.rootNodes[0])).toEqual('hello');
+ async.done();
+ });
+ }));
+
+ it('should work in a template element', inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var html =
+ 'hello2
';
+
+ tb.createView(TestComponent, {html: html})
+ .then((view) => {
+ view.detectChanges();
+ expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(1);
+ expect(DOM.getText(view.rootNodes[0])).toEqual('hello2');
+ async.done();
+ });
+ }));
+
+ it('should toggle node when condition changes',
+ inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var html = 'hello
';
+
+ tb.createView(TestComponent, {html: html})
+ .then((view) => {
+ view.context.booleanCondition = false;
+ view.detectChanges();
+ expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(0);
+ expect(DOM.getText(view.rootNodes[0])).toEqual('');
+
+ view.context.booleanCondition = true;
+ view.detectChanges();
+ expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(1);
+ expect(DOM.getText(view.rootNodes[0])).toEqual('hello');
+
+ view.context.booleanCondition = false;
+ view.detectChanges();
+ expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(0);
+ expect(DOM.getText(view.rootNodes[0])).toEqual('');
+
+ async.done();
+ });
+ }));
+
+ it('should handle nested if correctly', inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var html =
+ 'hello
';
+
+ tb.createView(TestComponent, {html: html})
+ .then((view) => {
+ view.context.booleanCondition = false;
+ view.detectChanges();
+ expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(0);
+ expect(DOM.getText(view.rootNodes[0])).toEqual('');
+
+ view.context.booleanCondition = true;
+ view.detectChanges();
+ expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(1);
+ expect(DOM.getText(view.rootNodes[0])).toEqual('hello');
+
+ view.context.nestedBooleanCondition = false;
+ view.detectChanges();
+ expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(0);
+ expect(DOM.getText(view.rootNodes[0])).toEqual('');
+
+ view.context.nestedBooleanCondition = true;
+ view.detectChanges();
+ expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(1);
+ expect(DOM.getText(view.rootNodes[0])).toEqual('hello');
+
+ view.context.booleanCondition = false;
+ view.detectChanges();
+ expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(0);
+ expect(DOM.getText(view.rootNodes[0])).toEqual('');
+
+ async.done();
+ });
+ }));
+
+ it('should update several nodes with if', inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var html =
+ '' +
+ 'helloNumber' +
+ 'helloString' +
+ 'helloFunction' +
+ '
';
+
+ tb.createView(TestComponent, {html: html})
+ .then((view) => {
+ view.detectChanges();
+ expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(3);
+ expect(DOM.getText(view.rootNodes[0]))
+ .toEqual('helloNumberhelloStringhelloFunction');
+
+ view.context.numberCondition = 0;
+ view.detectChanges();
+ expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(1);
+ expect(DOM.getText(view.rootNodes[0])).toEqual('helloString');
+
+ view.context.numberCondition = 1;
+ view.context.stringCondition = "bar";
+ view.detectChanges();
+ expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(1);
+ expect(DOM.getText(view.rootNodes[0])).toEqual('helloNumber');
+ async.done();
+ });
+ }));
+
+
+ if (!IS_DARTIUM) {
+ it('should not add the element twice if the condition goes from true to true (JS)',
+ inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var html = 'hello
';
+
+ tb.createView(TestComponent, {html: html})
+ .then((view) => {
+ view.detectChanges();
+ expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(1);
+ expect(DOM.getText(view.rootNodes[0])).toEqual('hello');
+
+ view.context.numberCondition = 2;
+ view.detectChanges();
+ expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(1);
+ expect(DOM.getText(view.rootNodes[0])).toEqual('hello');
+
+ async.done();
+ });
+ }));
+
+ it('should not recreate the element if the condition goes from true to true (JS)',
+ inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var html = 'hello
';
+
+ tb.createView(TestComponent, {html: html})
+ .then((view) => {
+ view.detectChanges();
+ DOM.addClass(view.rootNodes[0].childNodes[1], "foo");
+
+ view.context.numberCondition = 2;
+ view.detectChanges();
+ expect(DOM.hasClass(view.rootNodes[0].childNodes[1], "foo")).toBe(true);
+
+ async.done();
+ });
+ }));
+ }
+
+ if (IS_DARTIUM) {
+ it('should not create the element if the condition is not a boolean (DART)',
+ inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var html = 'hello
';
+
+ tb.createView(TestComponent, {html: html})
+ .then((view) => {
+ expect(() => view.detectChanges()).toThrowError();
+ expect(DOM.querySelectorAll(view.rootNodes[0], 'copy-me').length).toEqual(0);
+ expect(DOM.getText(view.rootNodes[0])).toEqual('');
+ async.done();
+ });
+ }));
+ }
+
+ });
+}
+
+@Component({selector: 'test-cmp'})
+@View({directives: [NgIf]})
+class TestComponent {
+ booleanCondition: boolean;
+ nestedBooleanCondition: boolean;
+ numberCondition: number;
+ stringCondition: string;
+ functionCondition: Function;
+ constructor() {
+ this.booleanCondition = true;
+ this.nestedBooleanCondition = true;
+ this.numberCondition = 1;
+ this.stringCondition = "foo";
+ this.functionCondition = function(s, n) { return s == "foo" && n == 1; };
+ }
+}
diff --git a/modules/angular2/test/directives/ng_switch_spec.js b/modules/angular2/test/directives/ng_switch_spec.js
deleted file mode 100644
index d8deec4931..0000000000
--- a/modules/angular2/test/directives/ng_switch_spec.js
+++ /dev/null
@@ -1,153 +0,0 @@
-import {
- AsyncTestCompleter,
- beforeEach,
- ddescribe,
- describe,
- el,
- expect,
- iit,
- inject,
- it,
- xit,
-} from 'angular2/test_lib';
-import {DOM} from 'angular2/src/dom/dom_adapter';
-
-import {Component} from 'angular2/src/core/annotations_impl/annotations';
-import {View} from 'angular2/src/core/annotations_impl/view';
-
-import {NgSwitch, NgSwitchWhen, NgSwitchDefault} from 'angular2/src/directives/ng_switch';
-
-import {TestBed} from 'angular2/src/test_lib/test_bed';
-
-export function main() {
- describe('switch', () => {
- describe('switch value changes', () => {
- it('should switch amongst when values', inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var template = '' +
- '
' +
- '- when a
' +
- '- when b
' +
- '
';
-
- tb.createView(TestComponent, {html: template}).then((view) => {
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('');
-
- view.context.switchValue = 'a';
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('when a');
-
- view.context.switchValue = 'b';
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('when b');
-
- async.done();
- });
- }));
-
- it('should switch amongst when values with fallback to default',
- inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var template = '' +
- '
' +
- '- when a
' +
- '- when default
' +
- '
';
-
- tb.createView(TestComponent, {html: template}).then((view) => {
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('when default');
-
- view.context.switchValue = 'a';
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('when a');
-
- view.context.switchValue = 'b';
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('when default');
-
- async.done();
- });
- }));
-
- it('should support multiple whens with the same value',
- inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var template = '' +
- '
' +
- '- when a1;
' +
- '- when b1;
' +
- '- when a2;
' +
- '- when b2;
' +
- '- when default1;
' +
- '- when default2;
' +
- '
';
-
- tb.createView(TestComponent, {html: template}).then((view) => {
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('when default1;when default2;');
-
- view.context.switchValue = 'a';
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('when a1;when a2;');
-
- view.context.switchValue = 'b';
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('when b1;when b2;');
-
- async.done();
- });
- }));
- });
-
- describe('when values changes', () => {
- it('should switch amongst when values',
- inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var template = '' +
- '
' +
- '- when 1;
' +
- '- when 2;
' +
- '- when default;
' +
- '
';
-
- tb.createView(TestComponent, {html: template}).then((view) => {
- view.context.when1 = 'a';
- view.context.when2 = 'b';
- view.context.switchValue = 'a';
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('when 1;');
-
- view.context.switchValue = 'b';
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('when 2;');
-
- view.context.switchValue = 'c';
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('when default;');
-
- view.context.when1 = 'c';
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('when 1;');
-
- view.context.when1 = 'd';
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('when default;');
-
- async.done();
- });
- }));
- });
- });
-}
-
-@Component({selector: 'test-cmp'})
-@View({directives: [NgSwitch, NgSwitchWhen, NgSwitchDefault]})
-class TestComponent {
- switchValue: any;
- when1: any;
- when2: any;
-
- constructor() {
- this.switchValue = null;
- this.when1 = null;
- this.when2 = null;
- }
-}
diff --git a/modules/angular2/test/directives/ng_switch_spec.ts b/modules/angular2/test/directives/ng_switch_spec.ts
new file mode 100644
index 0000000000..7166e49503
--- /dev/null
+++ b/modules/angular2/test/directives/ng_switch_spec.ts
@@ -0,0 +1,155 @@
+import {
+ AsyncTestCompleter,
+ beforeEach,
+ ddescribe,
+ describe,
+ el,
+ expect,
+ iit,
+ inject,
+ it,
+ xit,
+} from 'angular2/test_lib';
+import {DOM} from 'angular2/src/dom/dom_adapter';
+
+import {Component, View} from 'angular2/angular2';
+
+import {NgSwitch, NgSwitchWhen, NgSwitchDefault} from 'angular2/src/directives/ng_switch';
+
+import {TestBed} from 'angular2/src/test_lib/test_bed';
+
+export function main() {
+ describe('switch', () => {
+ describe('switch value changes', () => {
+ it('should switch amongst when values', inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var template = '' +
+ '
' +
+ '- when a
' +
+ '- when b
' +
+ '
';
+
+ tb.createView(TestComponent, {html: template})
+ .then((view) => {
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('');
+
+ view.context.switchValue = 'a';
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('when a');
+
+ view.context.switchValue = 'b';
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('when b');
+
+ async.done();
+ });
+ }));
+
+ it('should switch amongst when values with fallback to default',
+ inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var template = '' +
+ '
' +
+ '- when a
' +
+ '- when default
' +
+ '
';
+
+ tb.createView(TestComponent, {html: template})
+ .then((view) => {
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('when default');
+
+ view.context.switchValue = 'a';
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('when a');
+
+ view.context.switchValue = 'b';
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('when default');
+
+ async.done();
+ });
+ }));
+
+ it('should support multiple whens with the same value',
+ inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var template = '' +
+ '
' +
+ '- when a1;
' +
+ '- when b1;
' +
+ '- when a2;
' +
+ '- when b2;
' +
+ '- when default1;
' +
+ '- when default2;
' +
+ '
';
+
+ tb.createView(TestComponent, {html: template})
+ .then((view) => {
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('when default1;when default2;');
+
+ view.context.switchValue = 'a';
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('when a1;when a2;');
+
+ view.context.switchValue = 'b';
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('when b1;when b2;');
+
+ async.done();
+ });
+ }));
+ });
+
+ describe('when values changes', () => {
+ it('should switch amongst when values', inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var template = '' +
+ '
' +
+ '- when 1;
' +
+ '- when 2;
' +
+ '- when default;
' +
+ '
';
+
+ tb.createView(TestComponent, {html: template})
+ .then((view) => {
+ view.context.when1 = 'a';
+ view.context.when2 = 'b';
+ view.context.switchValue = 'a';
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('when 1;');
+
+ view.context.switchValue = 'b';
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('when 2;');
+
+ view.context.switchValue = 'c';
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('when default;');
+
+ view.context.when1 = 'c';
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('when 1;');
+
+ view.context.when1 = 'd';
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('when default;');
+
+ async.done();
+ });
+ }));
+ });
+ });
+}
+
+@Component({selector: 'test-cmp'})
+@View({directives: [NgSwitch, NgSwitchWhen, NgSwitchDefault]})
+class TestComponent {
+ switchValue: any;
+ when1: any;
+ when2: any;
+
+ constructor() {
+ this.switchValue = null;
+ this.when1 = null;
+ this.when2 = null;
+ }
+}
diff --git a/modules/angular2/test/directives/non_bindable_spec.js b/modules/angular2/test/directives/non_bindable_spec.js
deleted file mode 100644
index d07d24c7f1..0000000000
--- a/modules/angular2/test/directives/non_bindable_spec.js
+++ /dev/null
@@ -1,73 +0,0 @@
-import {
- AsyncTestCompleter,
- beforeEach,
- ddescribe,
- describe,
- el,
- expect,
- iit,
- inject,
- it,
- xit,
-} from 'angular2/test_lib';
-import {DOM} from 'angular2/src/dom/dom_adapter';
-
-import {Directive, Component} from 'angular2/src/core/annotations_impl/annotations';
-import {View} from 'angular2/src/core/annotations_impl/view';
-
-import {ElementRef} from 'angular2/src/core/compiler/element_ref';
-
-import {NgNonBindable} from 'angular2/src/directives/ng_non_bindable';
-
-import {TestBed} from 'angular2/src/test_lib/test_bed';
-
-export function main() {
- describe('non-bindable', () => {
- it('should not interpolate children', inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var template = '{{text}}{{text}}
';
- tb.createView(TestComponent, {html: template}).then((view) => {
- view.detectChanges();
- expect(DOM.getText(view.rootNodes[0])).toEqual('foo{{text}}');
- async.done();
- });
- }));
-
- it('should ignore directives on child nodes', inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var template = '{{text}}
';
- tb.createView(TestComponent, {html: template}).then((view) => {
- view.detectChanges();
- var span = DOM.querySelector(view.rootNodes[0], '#child');
- expect(DOM.hasClass(span, 'compiled')).toBeFalsy();
- async.done();
- });
- }));
-
- it('should trigger directives on the same node', inject([TestBed, AsyncTestCompleter], (tb, async) => {
- var template = '{{text}}
';
- tb.createView(TestComponent, {html: template}).then((view) => {
- view.detectChanges();
- var span = DOM.querySelector(view.rootNodes[0], '#child');
- expect(DOM.hasClass(span, 'compiled')).toBeTruthy();
- async.done();
- });
- }));
- })
-}
-
-@Component({selector: 'test-cmp'})
-@View({directives: [NgNonBindable, TestDirective]})
-class TestComponent {
- text: string;
- constructor() {
- this.text = 'foo';
- }
-}
-
-@Directive({
- selector: '[test-dec]'
-})
-class TestDirective {
- constructor(el: ElementRef) {
- DOM.addClass(el.domElement, 'compiled');
- }
-}
diff --git a/modules/angular2/test/directives/non_bindable_spec.ts b/modules/angular2/test/directives/non_bindable_spec.ts
new file mode 100644
index 0000000000..c5347122be
--- /dev/null
+++ b/modules/angular2/test/directives/non_bindable_spec.ts
@@ -0,0 +1,71 @@
+import {
+ AsyncTestCompleter,
+ beforeEach,
+ ddescribe,
+ describe,
+ el,
+ expect,
+ iit,
+ inject,
+ it,
+ xit,
+} from 'angular2/test_lib';
+import {DOM} from 'angular2/src/dom/dom_adapter';
+
+import {Component, Directive, View} from 'angular2/angular2';
+
+import {ElementRef} from 'angular2/src/core/compiler/element_ref';
+
+import {NgNonBindable} from 'angular2/src/directives/ng_non_bindable';
+
+import {TestBed} from 'angular2/src/test_lib/test_bed';
+
+export function main() {
+ describe('non-bindable', () => {
+ it('should not interpolate children', inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var template = '{{text}}{{text}}
';
+ tb.createView(TestComponent, {html: template})
+ .then((view) => {
+ view.detectChanges();
+ expect(DOM.getText(view.rootNodes[0])).toEqual('foo{{text}}');
+ async.done();
+ });
+ }));
+
+ it('should ignore directives on child nodes',
+ inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var template = '{{text}}
';
+ tb.createView(TestComponent, {html: template})
+ .then((view) => {
+ view.detectChanges();
+ var span = DOM.querySelector(view.rootNodes[0], '#child');
+ expect(DOM.hasClass(span, 'compiled')).toBeFalsy();
+ async.done();
+ });
+ }));
+
+ it('should trigger directives on the same node',
+ inject([TestBed, AsyncTestCompleter], (tb, async) => {
+ var template = '{{text}}
';
+ tb.createView(TestComponent, {html: template})
+ .then((view) => {
+ view.detectChanges();
+ var span = DOM.querySelector(view.rootNodes[0], '#child');
+ expect(DOM.hasClass(span, 'compiled')).toBeTruthy();
+ async.done();
+ });
+ }));
+ })
+}
+
+@Directive({selector: '[test-dec]'})
+class TestDirective {
+ constructor(el: ElementRef) { DOM.addClass(el.domElement, 'compiled'); }
+}
+
+@Component({selector: 'test-cmp'})
+@View({directives: [NgNonBindable, TestDirective]})
+class TestComponent {
+ text: string;
+ constructor() { this.text = 'foo'; }
+}