test: ensure _hasInputValue is reset on clear button interaction (#623)

mukherjeesudebi · web-flow · commit 7a10e2e2de23 · 2023-05-04T15:56:25.000+03:00
diff --git a/test/email-field-events.html b/test/email-field-events.html
@@ -8,6 +8,7 @@
   <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
   <link rel="import" href="../vaadin-email-field.html">
   <link rel="import" href="../../test-fixture/test-fixture.html">
+  <script src="../../iron-test-helpers/mock-interactions.js"></script>
 </head>
 
 <body>
@@ -71,6 +72,34 @@
             expect(hasInputValueChangedSpy.calledBefore(valueChangedSpy)).to.be.true;
           });
         });
+
+        describe('with clear button', () => {
+          beforeEach(async() => {
+            emailField.clearButtonVisible = true;
+          });
+    
+          describe('with user input', () => {
+            beforeEach(async() => {
+              input.value = 'foo';
+              input.dispatchEvent(new CustomEvent('input'));
+              hasInputValueChangedSpy.reset();
+              valueChangedSpy.reset();
+            });
+    
+            it('should fire the event on clear button click', async() => {
+              emailField.$.clearButton.click();
+              expect(hasInputValueChangedSpy.calledOnce).to.be.true;
+              expect(hasInputValueChangedSpy.calledBefore(valueChangedSpy)).to.be.true;
+            });
+    
+            it('should fire the event on Esc', async() => {
+              input.focus();
+              MockInteractions.keyDownOn(input, 27, null, 'Escape');
+              expect(hasInputValueChangedSpy.calledOnce).to.be.true;
+              expect(hasInputValueChangedSpy.calledBefore(valueChangedSpy)).to.be.true;
+            });
+          });
+        });
       });
     });
   </script>
diff --git a/test/integer-field-events.html b/test/integer-field-events.html
@@ -8,6 +8,7 @@
   <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
   <link rel="import" href="../vaadin-integer-field.html">
   <link rel="import" href="../../test-fixture/test-fixture.html">
+  <script src="../../iron-test-helpers/mock-interactions.js"></script>
 </head>
 
 <body>
@@ -71,6 +72,34 @@
             expect(hasInputValueChangedSpy.calledBefore(valueChangedSpy)).to.be.true;
           });
         });
+
+        describe('with clear button', () => {
+          beforeEach(async() => {
+            integerField.clearButtonVisible = true;
+          });
+    
+          describe('with user input', () => {
+            beforeEach(async() => {
+              input.value = '5';
+              input.dispatchEvent(new CustomEvent('input'));
+              hasInputValueChangedSpy.reset();
+              valueChangedSpy.reset();
+            });
+    
+            it('should fire the event on clear button click', async() => {
+              integerField.$.clearButton.click();
+              expect(hasInputValueChangedSpy.calledOnce).to.be.true;
+              expect(hasInputValueChangedSpy.calledBefore(valueChangedSpy)).to.be.true;
+            });
+    
+            it('should fire the event on Esc', async() => {
+              input.focus();
+              MockInteractions.keyDownOn(input, 27, null, 'Escape');
+              expect(hasInputValueChangedSpy.calledOnce).to.be.true;
+              expect(hasInputValueChangedSpy.calledBefore(valueChangedSpy)).to.be.true;
+            });
+          });
+        });
       });
     });
   </script>
diff --git a/test/number-field-events.html b/test/number-field-events.html
@@ -8,6 +8,7 @@
   <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
   <link rel="import" href="../vaadin-number-field.html">
   <link rel="import" href="../../test-fixture/test-fixture.html">
+  <script src="../../iron-test-helpers/mock-interactions.js"></script>
 </head>
 
 <body>
@@ -71,6 +72,34 @@
             expect(hasInputValueChangedSpy.calledBefore(valueChangedSpy)).to.be.true;
           });
         });
+
+        describe('with clear button', () => {
+          beforeEach(async() => {
+            numberField.clearButtonVisible = true;
+          });
+    
+          describe('with user input', () => {
+            beforeEach(async() => {
+              input.value = '5';
+              input.dispatchEvent(new CustomEvent('input'));
+              hasInputValueChangedSpy.reset();
+              valueChangedSpy.reset();
+            });
+    
+            it('should fire the event on clear button click', async() => {
+              numberField.$.clearButton.click();
+              expect(hasInputValueChangedSpy.calledOnce).to.be.true;
+              expect(hasInputValueChangedSpy.calledBefore(valueChangedSpy)).to.be.true;
+            });
+    
+            it('should fire the event on Esc', async() => {
+              input.focus();
+              MockInteractions.keyDownOn(input, 27, null, 'Escape');
+              expect(hasInputValueChangedSpy.calledOnce).to.be.true;
+              expect(hasInputValueChangedSpy.calledBefore(valueChangedSpy)).to.be.true;
+            });
+          });
+        });
       });
     });
   </script>
diff --git a/test/password-field-events.html b/test/password-field-events.html
@@ -8,6 +8,7 @@
   <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
   <link rel="import" href="../vaadin-password-field.html">
   <link rel="import" href="../../test-fixture/test-fixture.html">
+  <script src="../../iron-test-helpers/mock-interactions.js"></script>
 </head>
 
 <body>
@@ -71,6 +72,34 @@
             expect(hasInputValueChangedSpy.calledBefore(valueChangedSpy)).to.be.true;
           });
         });
+
+        describe('with clear button', () => {
+          beforeEach(async() => {
+            passwordField.clearButtonVisible = true;
+          });
+    
+          describe('with user input', () => {
+            beforeEach(async() => {
+              input.value = 'foo';
+              input.dispatchEvent(new CustomEvent('input'));
+              hasInputValueChangedSpy.reset();
+              valueChangedSpy.reset();
+            });
+    
+            it('should fire the event on clear button click', async() => {
+              passwordField.$.clearButton.click();
+              expect(hasInputValueChangedSpy.calledOnce).to.be.true;
+              expect(hasInputValueChangedSpy.calledBefore(valueChangedSpy)).to.be.true;
+            });
+    
+            it('should fire the event on Esc', async() => {
+              input.focus();
+              MockInteractions.keyDownOn(input, 27, null, 'Escape');
+              expect(hasInputValueChangedSpy.calledOnce).to.be.true;
+              expect(hasInputValueChangedSpy.calledBefore(valueChangedSpy)).to.be.true;
+            });
+          });
+        });
       });
     });
   </script>
diff --git a/test/text-area-events.html b/test/text-area-events.html
@@ -8,6 +8,7 @@
   <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
   <link rel="import" href="../vaadin-text-area.html">
   <link rel="import" href="../../test-fixture/test-fixture.html">
+  <script src="../../iron-test-helpers/mock-interactions.js"></script>
 </head>
 
 <body>
@@ -71,6 +72,34 @@
             expect(hasInputValueChangedSpy.calledBefore(valueChangedSpy)).to.be.true;
           });
         });
+
+        describe('with clear button', () => {
+          beforeEach(async() => {
+            textArea.clearButtonVisible = true;
+          });
+    
+          describe('with user input', () => {
+            beforeEach(async() => {
+              input.value = 'foo';
+              input.dispatchEvent(new CustomEvent('input'));
+              hasInputValueChangedSpy.reset();
+              valueChangedSpy.reset();
+            });
+    
+            it('should fire the event on clear button click', async() => {
+              textArea.$.clearButton.click();
+              expect(hasInputValueChangedSpy.calledOnce).to.be.true;
+              expect(hasInputValueChangedSpy.calledBefore(valueChangedSpy)).to.be.true;
+            });
+    
+            it('should fire the event on Esc', async() => {
+              input.focus();
+              MockInteractions.keyDownOn(input, 27, null, 'Escape');
+              expect(hasInputValueChangedSpy.calledOnce).to.be.true;
+              expect(hasInputValueChangedSpy.calledBefore(valueChangedSpy)).to.be.true;
+            });
+          });
+        });
       });
     });
   </script>
diff --git a/test/text-field-events.html b/test/text-field-events.html
@@ -8,6 +8,7 @@
   <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
   <link rel="import" href="../vaadin-text-field.html">
   <link rel="import" href="../../test-fixture/test-fixture.html">
+  <script src="../../iron-test-helpers/mock-interactions.js"></script>
 </head>
 
 <body>
@@ -71,6 +72,34 @@
             expect(hasInputValueChangedSpy.calledBefore(valueChangedSpy)).to.be.true;
           });
         });
+
+        describe('with clear button', () => {
+          beforeEach(async() => {
+            textField.clearButtonVisible = true;
+          });
+    
+          describe('with user input', () => {
+            beforeEach(async() => {
+              input.value = 'foo';
+              input.dispatchEvent(new CustomEvent('input'));
+              hasInputValueChangedSpy.reset();
+              valueChangedSpy.reset();
+            });
+    
+            it('should fire the event on clear button click', async() => {
+              textField.$.clearButton.click();
+              expect(hasInputValueChangedSpy.calledOnce).to.be.true;
+              expect(hasInputValueChangedSpy.calledBefore(valueChangedSpy)).to.be.true;
+            });
+    
+            it('should fire the event on Esc', async() => {
+              input.focus();
+              MockInteractions.keyDownOn(input, 27, null, 'Escape');
+              expect(hasInputValueChangedSpy.calledOnce).to.be.true;
+              expect(hasInputValueChangedSpy.calledBefore(valueChangedSpy)).to.be.true;
+            });
+          });
+        });
       });
     });
   </script>
