fix(textfield): Should not be in both disabled and invalid state (#1568)

material-components · Nov 13, 2017 · 874a17e · 874a17e
1 parent 1a5acee
commit 874a17e
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 11 deletions.
diff --git a/packages/mdc-textfield/foundation.js b/packages/mdc-textfield/foundation.js
@@ -299,10 +299,11 @@ class MDCTextFieldFoundation extends MDCFoundation {
    * @param {boolean} disabled Sets the text-field disabled or enabled.
    */
   setDisabled(disabled) {
-    const {DISABLED} = MDCTextFieldFoundation.cssClasses;
+    const {DISABLED, INVALID} = MDCTextFieldFoundation.cssClasses;
     this.getNativeInput_().disabled = disabled;
     if (disabled) {
       this.adapter_.addClass(DISABLED);
+      this.adapter_.removeClass(INVALID);
       this.adapter_.setIconAttr('tabindex', '-1');
     } else {
       this.adapter_.removeClass(DISABLED);

diff --git a/packages/mdc-textfield/mdc-text-field.scss b/packages/mdc-textfield/mdc-text-field.scss
@@ -434,16 +434,6 @@
   }
 }
 
-.mdc-text-field--invalid.mdc-text-field--disabled {
-  .mdc-text-field__label {
-    @include mdc-theme-prop(color, text-disabled-on-light);
-
-    @include mdc-theme-dark(".mdc-text-field") {
-      @include mdc-theme-prop(color, text-disabled-on-dark);
-    }
-  }
-}
-
 .mdc-text-field__input:required + .mdc-text-field__label::after {
   margin-left: 1px;
   content: "*";

diff --git a/test/unit/mdc-textfield/foundation.test.js b/test/unit/mdc-textfield/foundation.test.js
@@ -87,6 +87,12 @@ test('#setDisabled adds mdc-text-field--disabled when set to true', () => {
   td.verify(mockAdapter.addClass(cssClasses.DISABLED));
 });
 
+test('#setDisabled removes mdc-text-field--invalid when set to true', () => {
+  const {foundation, mockAdapter} = setupTest();
+  foundation.setDisabled(true);
+  td.verify(mockAdapter.removeClass(cssClasses.INVALID));
+});
+
 test('#setDisabled removes mdc-text-field--disabled when set to false', () => {
   const {foundation, mockAdapter} = setupTest();
   foundation.setDisabled(false);