Fix problems with disabled inputs, fixes 18

Unit tests for disabled inputs were written incorrectly
kristerkari · Jun 9, 2015 · 553487d · 553487d
1 parent d998035
commit 553487d
Show file tree

Hide file tree

Showing 6 changed files with 63 additions and 4 deletions.
diff --git a/src/main.js b/src/main.js
@@ -78,7 +78,12 @@
       if (elems.hasPasswordClone(element)) {
         clone = elems.getPasswordClone(element);
         if (element.disabled !== clone.disabled) {
-          clone.disabled = element.disabled;
+          if (clone.style.display === "block") {
+            element.disabled = clone.disabled;
+          }
+          if (element.style.display === "block") {
+            clone.disabled = element.disabled;
+          }
         }
       }
 

diff --git a/test/manual/default/index.html b/test/manual/default/index.html
@@ -71,6 +71,12 @@
     <!-- Polyfill should handle disabled password input that gets enabled after 1s -->
     <input id="d2" type="password" placeholder="Enabled password input" disabled>
 
+    <!-- Polyfill should handle enabled text input that gets disabled after 1s -->
+    <input id="e1" type="text" placeholder="Disabled text input">
+
+    <!-- Polyfill should handle enabled password input that gets disabled after 1s -->
+    <input id="e2" type="password" placeholder="Disabled password input">
+
     <!-- Polyfill should handle text inputs with labels -->
     <label for="l1">Label for text input</label><br>
     <input id="l1" type="text" placeholder="Text input with label">

diff --git a/test/manual/default/tests.js b/test/manual/default/tests.js
@@ -33,6 +33,9 @@ setTimeout(function() {
   document.getElementById("d1").disabled = false;
   document.getElementById("d2").disabled = false;
 
+  document.getElementById("e1").disabled = true;
+  document.getElementById("e2").disabled = true;
+
 }, 1000);
 
 // Bind a submit event handler to the test form

diff --git a/test/manual/input/index.html b/test/manual/input/index.html
@@ -65,6 +65,12 @@
     <!-- Polyfill should handle disabled password input that gets enabled after 1s -->
     <input id="d2" type="password" placeholder="Enabled password input" disabled>
 
+    <!-- Polyfill should handle enabled text input that gets disabled after 1s -->
+    <input id="e1" type="text" placeholder="Disabled text input">
+
+    <!-- Polyfill should handle enabled password input that gets disabled after 1s -->
+    <input id="e2" type="password" placeholder="Disabled password input">
+
     <!-- Polyfill should handle text inputs with labels -->
     <label for="l1">Label for text input</label><br>
     <input id="l1" type="text" placeholder="Text input with label">

diff --git a/test/manual/input/tests.js b/test/manual/input/tests.js
@@ -18,6 +18,9 @@ setTimeout(function() {
   document.getElementById("d1").disabled = false;
   document.getElementById("d2").disabled = false;
 
+  document.getElementById("e1").disabled = true;
+  document.getElementById("e2").disabled = true;
+
   // Test input type changing after page load
   try {
     document.getElementById("handle3").type = "password";

diff --git a/test/unit/password.spec.js b/test/unit/password.spec.js
@@ -95,10 +95,28 @@ describe("password inputs", function() {
       expect(clone.disabled).toEqual(true);
     });
 
-    describe("and when input is enabled", function() {
+    describe("and when input is enabled with prop", function() {
 
       beforeEach(function(done) {
-        element.removeAttribute("disabled");
+        clone.disabled = false;
+        placekeeper.priv.__setupPlaceholders();
+        setTimeout(done, helpers.loopDurationForTests);
+      });
+
+      it("should have element enabled", function() {
+        expect(element.disabled).toEqual(false);
+      });
+
+      it("should have clone enabled", function() {
+        expect(clone.disabled).toEqual(false);
+      });
+
+    });
+
+    describe("and when input is enabled with attribute", function() {
+
+      beforeEach(function(done) {
+        clone.removeAttribute("disabled");
         placekeeper.priv.__setupPlaceholders();
         setTimeout(done, helpers.loopDurationForTests);
       });
@@ -151,6 +169,24 @@ describe("password inputs", function() {
           expect(placekeeper.polyfill.hidePlaceholder).toHaveBeenCalledWith(clone);
         });
 
+        describe("and when input is disabled", function() {
+
+          beforeEach(function(done) {
+            element.disabled = true;
+            placekeeper.priv.__setupPlaceholders();
+            setTimeout(done, helpers.loopDurationForTests);
+          });
+
+          it("should have element disabled", function() {
+            expect(element.disabled).toEqual(true);
+          });
+
+          it("should have clone disabled", function() {
+            expect(clone.disabled).toEqual(true);
+          });
+
+        });
+
         describe("and when there is a value and input is blurred", function() {
 
           beforeEach(function(done) {
@@ -232,7 +268,7 @@ describe("password inputs", function() {
       describe("and when input is disabled again", function() {
 
         beforeEach(function(done) {
-          element.disabled = true;
+          clone.disabled = true;
           placekeeper.priv.__setupPlaceholders();
           setTimeout(done, helpers.loopDurationForTests);
         });