addressed some comments

Author: mmalerba

src/lib/input/index.ts

@@ -1,3 +1,4 @@
 export * from './autosize'
 export * from './input';
 export * from './input-wrapper';
+export * from './input-wrapper-errors';

src/lib/input/input-wrapper-errors.ts

@@ -0,0 +1,22 @@
+import {MdError} from '../core/errors/error';
+
+
+export class MdInputWrapperPlaceholderConflictError extends MdError {
+  constructor() {
+    super('Placeholder attribute and child element were both specified.');
+  }
+}
+
+
+export class MdInputWrapperUnsupportedTypeError extends MdError {
+  constructor(type: string) {
+    super(`Input type "${type}" isn't supported by md-input-wrapper.`);
+  }
+}
+
+
+export class MdInputWrapperDuplicatedHintError extends MdError {
+  constructor(align: string) {
+    super(`A hint was already declared for 'align="${align}"'.`);
+  }
+}

src/lib/input/input-wrapper.spec.ts

@@ -1,4 +1,4 @@
-import {async, TestBed, ComponentFixture, inject} from '@angular/core/testing';
+import {async, TestBed, inject} from '@angular/core/testing';
 import {Component} from '@angular/core';
 import {FormsModule, ReactiveFormsModule} from '@angular/forms';
 import {By} from '@angular/platform-browser';
@@ -218,12 +218,10 @@ describe('MdInputWrapper', function () {
     fixture.componentInstance.placeholder = 'Other placeholder';
     fixture.detectChanges();
 
-    waitForMutationObserver(fixture, () => {
-      el = fixture.debugElement.query(By.css('label'));
-      expect(el).not.toBeNull();
-      expect(el.nativeElement.textContent).toMatch('Other placeholder');
-      expect(el.nativeElement.textContent).not.toMatch(/\*/g);
-    });
+    el = fixture.debugElement.query(By.css('label'));
+    expect(el).not.toBeNull();
+    expect(el.nativeElement.textContent).toMatch('Other placeholder');
+    expect(el.nativeElement.textContent).not.toMatch(/\*/g);
   }));
 
   it('supports placeholder element', async(() => {
@@ -237,12 +235,10 @@ describe('MdInputWrapper', function () {
     fixture.componentInstance.placeholder = 'Other placeholder';
     fixture.detectChanges();
 
-    waitForMutationObserver(fixture, () => {
-      el = fixture.debugElement.query(By.css('label'));
-      expect(el).not.toBeNull();
-      expect(el.nativeElement.textContent).toMatch('Other placeholder');
-      expect(el.nativeElement.textContent).not.toMatch(/\*/g);
-    });
+    el = fixture.debugElement.query(By.css('label'));
+    expect(el).not.toBeNull();
+    expect(el.nativeElement.textContent).toMatch('Other placeholder');
+    expect(el.nativeElement.textContent).not.toMatch(/\*/g);
   }));
 
   it('supports placeholder required star', () => {
@@ -263,9 +259,7 @@ describe('MdInputWrapper', function () {
 
     fixture.componentInstance.disabled = true;
     fixture.detectChanges();
-    waitForMutationObserver(fixture, () => {
-      expect(underlineEl.classList.contains('md-disabled')).toBe(true, 'should be disabled');
-    });
+    expect(underlineEl.classList.contains('md-disabled')).toBe(true, 'should be disabled');
   }));
 
   it('supports textarea', () => {
@@ -409,10 +403,3 @@ class MdTextareaWithBindings {
   cols: number = 8;
   wrap: string = 'hard';
 }
-
-function waitForMutationObserver<T>(fixture: ComponentFixture<T>, f: () => void) {
-  setTimeout(() => {
-    fixture.detectChanges();
-    f();
-  }, 0);
-}

src/lib/input/input-wrapper.ts

@@ -10,11 +10,17 @@ import {
   ViewEncapsulation,
   Optional,
   Output,
-  EventEmitter
+  EventEmitter,
+  Renderer
 } from '@angular/core';
-import {MdError, coerceBooleanProperty} from '../core';
+import {coerceBooleanProperty} from '../core';
 import {NgModel} from '@angular/forms';
 import {MdFeatureDetector} from '../core/platform/feature-detector';
+import {
+  MdInputWrapperUnsupportedTypeError,
+  MdInputWrapperPlaceholderConflictError,
+  MdInputWrapperDuplicatedHintError
+} from './input-wrapper-errors';
 
 
 // Invalid input type. Using one of these will throw an MdInputWrapperUnsupportedTypeError.
@@ -35,27 +41,6 @@ const MD_INPUT_INVALID_TYPES = [
 let nextUniqueId = 0;
 
 
-export class MdInputWrapperPlaceholderConflictError extends MdError {
-  constructor() {
-    super('Placeholder attribute and child element were both specified.');
-  }
-}
-
-
-export class MdInputWrapperUnsupportedTypeError extends MdError {
-  constructor(type: string) {
-    super(`Input type "${type}" isn't supported by md-input-wrapper.`);
-  }
-}
-
-
-export class MdInputWrapperDuplicatedHintError extends MdError {
-  constructor(align: string) {
-    super(`A hint was already declared for 'align="${align}"'.`);
-  }
-}
-
-
 /**
  * The placeholder directive. The content can declare this to implement more
  * complex placeholders.
@@ -107,7 +92,7 @@ export class MdInputDirective implements AfterContentInit {
   set placeholder(value: string) {
     if (this._placeholder != value) {
       this._placeholder = value;
-      this.placeholderChange.emit(this._placeholder);
+      this._placeholderChange.emit(this._placeholder);
     }
   }
   private _placeholder = '';
@@ -125,10 +110,10 @@ export class MdInputDirective implements AfterContentInit {
   }
   private _type = 'text';
 
-  @Input()
   value: any;
 
-  @Output() placeholderChange = new EventEmitter<string>();
+  /** Emits an event when the placeholder changes so that the `md-input-wrapper` can re-validate. */
+  @Output() _placeholderChange = new EventEmitter<string>();
 
   get empty() { return (this.value == null || this.value == '') && !this._isNeverEmpty(); }
 
@@ -148,6 +133,7 @@ export class MdInputDirective implements AfterContentInit {
 
   constructor(private _featureDetector: MdFeatureDetector,
               private _elementRef: ElementRef,
+              private _renderer: Renderer,
               @Optional() private _ngModel: NgModel) {
     // Force setter to be called in case id was not specified.
     this.id = this.id;
@@ -164,7 +150,7 @@ export class MdInputDirective implements AfterContentInit {
   }
 
   /** Focus the input element. */
-  focus() { this._elementRef.nativeElement.focus(); }
+  focus() { this._renderer.invokeElementMethod(this._elementRef.nativeElement, 'focus'); }
 
   /** Make sure the input is a supported type. */
   private _validateType() {
@@ -231,7 +217,7 @@ export class MdInputWrapper implements AfterContentInit {
     this._hintChildren.changes.subscribe(() => {
       this._validateHints();
     });
-    this._mdInputChild.placeholderChange.subscribe(() => {
+    this._mdInputChild._placeholderChange.subscribe(() => {
       this._validatePlaceholders();
     });
   }