address comments, add tests

Author: Ales Rechtorik

src/lib/input/README.md

@@ -108,11 +108,8 @@ export class MyComponent implements OnInit {
 
 ## Textareas
 
-Supports same attributes as MdInput, except `type`, additionally it support `autosize` attribute
-which enables auto expanding functionality.
-
 ```html
-<md-textarea autosize placeholder="Textarea with autosize"></md-textarea>
+<md-textarea placeholder="Textarea with autosize"></md-textarea>
 ```
 
 ### Example

src/lib/input/input.scss

@@ -95,10 +95,6 @@ md-input, md-textarea {
   }
 }
 
-.md-input-element-textarea {
-  min-height: 60px;
-}
-
 // The placeholder label. This is invisible unless it is. The logic to show it is
 // basically `empty || (float && (!empty || focused))`. Float is dependent on the
 // `floatingPlaceholder` input.

src/lib/input/input.spec.ts

@@ -57,6 +57,7 @@ describe('MdInput', function () {
         MdInputTextTestController,
         MdInputPasswordTestController,
         MdInputNumberTestController,
+        MdTextareaWithBindings,
       ],
     });
 
@@ -619,6 +620,20 @@ describe('MdInput', function () {
 
     expect(inputElement.name).toBe('some-name');
   });
+
+  describe('md-textarea', () => {
+    it('supports the rows, cols, and wrap attributes', () => {
+      let fixture = TestBed.createComponent(MdTextareaWithBindings);
+
+      fixture.detectChanges();
+
+      const textarea: HTMLTextAreaElement = fixture.nativeElement.querySelector('textarea');
+      expect(textarea.rows).toBe(4);
+      expect(textarea.cols).toBe(8);
+      expect(textarea.wrap).toBe('hard');
+    });
+  });
+
 });
 
 @Component({template: `<md-input id="test-id"></md-input>`})
@@ -791,3 +806,11 @@ class MdInputPasswordTestController {
 class MdInputNumberTestController {
   placeholder: string = '';
 }
+
+@Component({template:
+    `<md-textarea [rows]="rows" [cols]="cols" [wrap]="wrap" placeholder="Snacks"></md-textarea>`})
+class MdTextareaWithBindings {
+  rows: number = 4;
+  cols: number = 8;
+  wrap: string = 'hard';
+}

src/lib/input/input.ts

@@ -167,6 +167,11 @@ export class MdInput implements ControlValueAccessor, AfterContentInit, OnChange
   @Input() type: string = 'text';
   @Input() name: string = null;
 
+  // textarea-specific
+  @Input() rows: number = null;
+  @Input() cols: number = null;
+  @Input() wrap: string = null;
+
   private _floatingPlaceholder: boolean = true;
   private _autofocus: boolean = false;
   private _disabled: boolean = false;
@@ -229,9 +234,14 @@ export class MdInput implements ControlValueAccessor, AfterContentInit, OnChange
 
   @ViewChild('input') _inputElement: ElementRef;
 
-  public elementType: 'input' | 'textarea' = undefined;
+  elementType: 'input' | 'textarea';
 
-  constructor(private _elRef: ElementRef) { }
+  constructor(public _elementRef: ElementRef) {
+    // Set the element type depending on normalized selector used(md-input / md-textarea)
+    this.elementType = this._elementRef.nativeElement.nodeName.toLowerCase() === 'md-input' ?
+        'input' :
+        'textarea';
+  }
 
   /** Set focus on input */
   focus() {
@@ -286,13 +296,6 @@ export class MdInput implements ControlValueAccessor, AfterContentInit, OnChange
   ngAfterContentInit() {
     this._validateConstraints();
 
-    // Set the element type depending on normalized selector used(md-input / md-textarea)
-    if (this._elRef.nativeElement.tagName.toLowerCase() === 'md-input') {
-      this.elementType = 'input';
-    } else {
-      this.elementType = 'textarea';
-    }
-
     // Trigger validation when the hint children change.
     this._hintChildren.changes.subscribe(() => {
       this._validateConstraints();