import {Component, Directive, Output, EventEmitter} from 'angular2/core';
import {ComponentFixture, afterEach, AsyncTestCompleter, TestComponentBuilder, beforeEach, ddescribe, describe, dispatchEvent, fakeAsync, tick, flushMicrotasks, expect, it, inject, iit, xit, browserDetection} from 'angular2/testing_internal';
import {DOM} from 'angular2/src/platform/dom/dom_adapter';
import {Control, ControlGroup, ControlValueAccessor, FORM_DIRECTIVES, NG_VALIDATORS, NG_ASYNC_VALIDATORS, NgControl, NgIf, NgFor, NgForm, Validators, Validator, RadioButtonState} from 'angular2/common';
import {Provider, forwardRef, Input} from 'angular2/core';
import {By} from 'angular2/platform/browser';
import {ListWrapper} from 'angular2/src/facade/collection';
import {ObservableWrapper, TimerWrapper} from 'angular2/src/facade/async';
import {CONST_EXPR} from 'angular2/src/facade/lang';
import {PromiseWrapper} from 'angular2/src/facade/promise';
export function main() {
describe('integration tests', () => {
it('should initialize DOM elements with the given form object',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var t = `
`;
tcb.overrideTemplate(MyComp, t).createAsync(MyComp).then((fixture) => {
fixture.debugElement.componentInstance.form =
new ControlGroup({'login': new Control('loginValue')});
fixture.detectChanges();
var input = fixture.debugElement.query(By.css('input'));
expect(input.nativeElement.value).toEqual('loginValue');
async.done();
});
}));
it('should update the control group values on DOM change',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var form = new ControlGroup({'login': new Control('oldValue')});
var t = `
`;
tcb.overrideTemplate(MyComp, t).createAsync(MyComp).then((fixture) => {
fixture.debugElement.componentInstance.form = form;
fixture.detectChanges();
var input = fixture.debugElement.query(By.css('input'));
input.nativeElement.value = 'updatedValue';
dispatchEvent(input.nativeElement, 'input');
expect(form.value).toEqual({'login': 'updatedValue'});
async.done();
});
}));
it('should ignore the change event for ',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var form = new ControlGroup({'login': new Control('oldValue')});
var t = `
`;
tcb.overrideTemplate(MyComp, t).createAsync(MyComp).then((fixture) => {
fixture.debugElement.componentInstance.form = form;
fixture.detectChanges();
var input = fixture.debugElement.query(By.css('input'));
input.nativeElement.value = 'updatedValue';
ObservableWrapper.subscribe(
form.valueChanges, (value) => { throw 'Should not happen'; });
dispatchEvent(input.nativeElement, 'change');
async.done();
});
}));
it('should emit ngSubmit event on submit',
inject([TestComponentBuilder], fakeAsync((tcb: TestComponentBuilder) => {
var t = `
{{name}}
`;
var fixture: ComponentFixture;
tcb.overrideTemplate(MyComp, t).createAsync(MyComp).then(
(root) => { fixture = root; });
tick();
fixture.debugElement.componentInstance.form = new ControlGroup({});
fixture.debugElement.componentInstance.name = 'old';
tick();
var form = fixture.debugElement.query(By.css('form'));
dispatchEvent(form.nativeElement, 'submit');
tick();
expect(fixture.debugElement.componentInstance.name).toEqual('updated');
})));
it('should work with single controls',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var control = new Control('loginValue');
var t = ``;
tcb.overrideTemplate(MyComp, t).createAsync(MyComp).then((fixture) => {
fixture.debugElement.componentInstance.form = control;
fixture.detectChanges();
var input = fixture.debugElement.query(By.css('input'));
expect(input.nativeElement.value).toEqual('loginValue');
input.nativeElement.value = 'updatedValue';
dispatchEvent(input.nativeElement, 'input');
expect(control.value).toEqual('updatedValue');
async.done();
});
}));
it('should update DOM elements when rebinding the control group',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var t = `
`;
tcb.overrideTemplate(MyComp, t).createAsync(MyComp).then((fixture) => {
fixture.debugElement.componentInstance.form =
new ControlGroup({'login': new Control('oldValue')});
fixture.detectChanges();
fixture.debugElement.componentInstance.form =
new ControlGroup({'login': new Control('newValue')});
fixture.detectChanges();
var input = fixture.debugElement.query(By.css('input'));
expect(input.nativeElement.value).toEqual('newValue');
async.done();
});
}));
it('should update DOM elements when updating the value of a control',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var login = new Control('oldValue');
var form = new ControlGroup({'login': login});
var t = `
`;
tcb.overrideTemplate(MyComp, t).createAsync(MyComp).then((fixture) => {
fixture.debugElement.componentInstance.form = form;
fixture.detectChanges();
login.updateValue('newValue');
fixture.detectChanges();
var input = fixture.debugElement.query(By.css('input'));
expect(input.nativeElement.value).toEqual('newValue');
async.done();
});
}));
it('should mark controls as touched after interacting with the DOM control',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var login = new Control('oldValue');
var form = new ControlGroup({'login': login});
var t = `
`;
tcb.overrideTemplate(MyComp, t).createAsync(MyComp).then((fixture) => {
fixture.debugElement.componentInstance.form = form;
fixture.detectChanges();
var loginEl = fixture.debugElement.query(By.css('input'));
expect(login.touched).toBe(false);
dispatchEvent(loginEl.nativeElement, 'blur');
expect(login.touched).toBe(true);
async.done();
});
}));
describe('different control types', () => {
it('should support ',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var t = `
`;
tcb.overrideTemplate(MyComp, t).createAsync(MyComp).then((fixture) => {
fixture.debugElement.componentInstance.form =
new ControlGroup({'text': new Control('old')});
fixture.detectChanges();
var input = fixture.debugElement.query(By.css('input'));
expect(input.nativeElement.value).toEqual('old');
input.nativeElement.value = 'new';
dispatchEvent(input.nativeElement, 'input');
expect(fixture.debugElement.componentInstance.form.value).toEqual({'text': 'new'});
async.done();
});
}));
it('should support without type',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var t = `
`;
tcb.overrideTemplate(MyComp, t).createAsync(MyComp).then((fixture) => {
fixture.debugElement.componentInstance.form =
new ControlGroup({'text': new Control('old')});
fixture.detectChanges();
var input = fixture.debugElement.query(By.css('input'));
expect(input.nativeElement.value).toEqual('old');
input.nativeElement.value = 'new';
dispatchEvent(input.nativeElement, 'input');
expect(fixture.debugElement.componentInstance.form.value).toEqual({'text': 'new'});
async.done();
});
}));
it('should support