feat(input): support autocapitalize and autocorrect attributes (#858)

angular · Jul 15, 2016 · b2471f2 · b2471f2
1 parent 22254dc
commit b2471f2
Show file tree

Hide file tree

Showing 3 changed files with 44 additions and 0 deletions.
diff --git a/src/components/input/input.html b/src/components/input/input.html
@@ -13,6 +13,8 @@
              [attr.aria-required]="ariaRequired"
              [attr.aria-invalid]="ariaInvalid"
              [attr.autocomplete]="autoComplete"
+             [attr.autocorrect]="autoCorrect"
+             [attr.autocapitalize]="autoCapitalize"
              [autofocus]="autoFocus"
              [disabled]="disabled"
              [id]="inputId"

diff --git a/src/components/input/input.spec.ts b/src/components/input/input.spec.ts
@@ -273,6 +273,46 @@ describe('MdInput', function () {
       });
   }));
 
+  it('supports the autoCorrect attribute', async(() => {
+    var template = '<md-input [autoCorrect]="autoCorrect"></md-input>';
+
+    builder.overrideTemplate(MdInputOptionalAttributeController, template)
+      .createAsync(MdInputOptionalAttributeController)
+      .then(fixture => {
+        fixture.detectChanges();
+
+        let input: MdInput = fixture.debugElement.query(By.directive(MdInput)).componentInstance;
+        let el: HTMLInputElement = fixture.debugElement.query(By.css('input')).nativeElement;
+
+        expect(el).not.toBeNull();
+        expect(el.getAttribute('autocorrect')).toBeNull();
+
+        input.autoCorrect = 'on';
+        fixture.detectChanges();
+        expect(el.getAttribute('autocorrect')).toEqual('on');
+      });
+  }));
+
+  it('supports the autoCapitalize attribute', async(() => {
+    var template = '<md-input [autoCapitalize]="autoCapitalize"></md-input>';
+
+    builder.overrideTemplate(MdInputOptionalAttributeController, template)
+      .createAsync(MdInputOptionalAttributeController)
+      .then(fixture => {
+        fixture.detectChanges();
+
+        let input: MdInput = fixture.debugElement.query(By.directive(MdInput)).componentInstance;
+        let el: HTMLInputElement = fixture.debugElement.query(By.css('input')).nativeElement;
+
+        expect(el).not.toBeNull();
+        expect(el.getAttribute('autocapitalize')).toBeNull();
+
+        input.autoCapitalize = 'on';
+        fixture.detectChanges();
+        expect(el.getAttribute('autocapitalize')).toEqual('on');
+      });
+  }));
+
   it('supports the autoComplete attribute as an unbound attribute', async(() => {
     var template = '<md-input autoComplete></md-input>';
 

diff --git a/src/components/input/input.ts b/src/components/input/input.ts
@@ -144,6 +144,8 @@ export class MdInput implements ControlValueAccessor, AfterContentInit, OnChange
   @Input() hintLabel: string = '';
 
   @Input() autoComplete: string;
+  @Input() autoCorrect: string;
+  @Input() autoCapitalize: string;
   @Input() @BooleanFieldValue() autoFocus: boolean = false;
   @Input() @BooleanFieldValue() disabled: boolean = false;
   @Input() id: string = `md-input-${nextUniqueId++}`;