fix(input): issue where undefined values would be displayed

 - add behavior test to verify

ng2-material/components/input/input.ts

@@ -10,6 +10,7 @@ import {Input,Output} from 'angular2/core';
 import {isPresent} from 'angular2/src/facade/lang';
 import {DOM} from "angular2/src/platform/dom/dom_adapter";
 import {TimerWrapper} from "angular2/src/facade/async";
+import {isBlank} from "angular2/src/facade/lang";
 
 // TODO(jd): <select> hasFocus/hasValue classes
 // TODO(jd): input container validation styles.
@@ -33,12 +34,12 @@ export class MdInput {
   _value: string;
 
   set value(value: string) {
-    this._value = isPresent(value) ? value : '';
+    this._value = value;
     ObservableWrapper.callEmit(this.mdChange, this.value);
   }
 
   get value(): string {
-    return this._value;
+    return !isBlank(this._value) ? this._value : '';
   }
 
   @Input()
@@ -50,7 +51,7 @@ export class MdInput {
 
   constructor(@Attribute('value') value: string,
               @Attribute('id') id: string) {
-    if (isPresent(value)) {
+    if (!isBlank(value)) {
       this.value = value;
     }
   }
@@ -91,7 +92,7 @@ export class MdInputContainer implements AfterContentInit, OnChanges {
   }
 
   ngOnChanges(_) {
-    this.inputHasValue = this._input.value != '';
+    this.inputHasValue = !isBlank(this._input.value);
 
     // TODO(jd): Is there something like @ContentChild that accepts a selector? I would prefer not to
     // use a directive for label elements because I cannot use a parent->child selector to make them
@@ -114,7 +115,7 @@ export class MdInputContainer implements AfterContentInit, OnChanges {
     // Listen to input changes and focus events so that we can apply the appropriate CSS
     // classes based on the input state.
     ObservableWrapper.subscribe(this._input.mdChange, (value) => {
-      this.inputHasValue = value != '';
+      this.inputHasValue = !isBlank(value);
     });
 
     ObservableWrapper.subscribe<boolean>(this._input.mdFocusChange, (hasFocus: boolean) => {

test/components/input/input_spec.ts

@@ -1,8 +1,88 @@
 import {componentSanityCheck} from "../../util";
+import {
+  AsyncTestCompleter,
+  TestComponentBuilder,
+  beforeEach,
+  beforeEachProviders,
+  describe,
+  expect,
+  inject,
+  it,
+} from 'angular2/testing_internal';
+import {DebugElement} from 'angular2/src/core/debug/debug_element';
+import {Component, View, provide} from 'angular2/core';
+import {UrlResolver} from 'angular2/compiler';
+import {TestUrlResolver} from '../../test_url_resolver';
+import {MATERIAL_PROVIDERS} from '../../../ng2-material/all';
+import {ComponentFixture} from "angular2/testing";
+import {findChildByTag} from "../../util";
+import {findChildById} from "../../util";
+import {MdInput,MdInputContainer} from "../../../ng2-material/components/input/input";
+import {TimerWrapper} from "angular2/src/facade/async";
+import {findChildByAttribute} from "../../util";
+
 
 export function main() {
+
   let template = `<md-input-container><input md-input type="text"></md-input-container>`;
   componentSanityCheck('Input Container', 'md-input-container', template);
-  componentSanityCheck('Input', 'input[md-input]', template);
+
+  interface IInputFixture {
+    fixture:ComponentFixture;
+    input:MdInput;
+    container:MdInputContainer;
+    inputDebug:DebugElement;
+    containerDebug:DebugElement;
+  }
+
+  @Component({selector: 'test-app'})
+  @View({
+    directives: [MdInput, MdInputContainer],
+    template: template
+  })
+  class TestComponent {
+  }
+
+  describe('Input', () => {
+    let builder: TestComponentBuilder;
+
+    function setup(template: string = null): Promise<IInputFixture> {
+      let prep = template === null ?
+        builder.createAsync(TestComponent) :
+        builder.overrideTemplate(TestComponent, template).createAsync(TestComponent);
+      return prep.then((fixture: ComponentFixture) => {
+        fixture.detectChanges();
+        let input = findChildByAttribute(fixture.debugElement, 'md-input');
+        let container = findChildByTag(fixture.debugElement, 'md-input-container');
+        return {
+          fixture: fixture,
+          input: input.componentInstance,
+          container: container.componentInstance,
+          inputDebug: input,
+          containerDebug: container,
+        };
+      }).catch(console.error.bind(console));
+    }
+
+    beforeEachProviders(() => [
+      MATERIAL_PROVIDERS,
+      provide(UrlResolver, {useValue: new TestUrlResolver()}),
+    ]);
+    beforeEach(inject([TestComponentBuilder], (tcb) => {
+      builder = tcb;
+    }));
+
+    describe('input[md-input]', () => {
+      it('should initialize with empty string value', inject([AsyncTestCompleter], (async) => {
+        setup().then((api: IInputFixture) => {
+          api.fixture.destroy();
+          expect(api.input.value).toBe('');
+          async.done();
+        });
+      }));
+    });
+  });
+
+
 }