fix: always strip input value to match step interval (#8421) (#8423)

vaadin · Jan 2, 2025 · 90056f0 · 90056f0
1 parent 9e0098b
commit 90056f0
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 0 deletions.
diff --git a/packages/time-picker/src/vaadin-time-picker.js b/packages/time-picker/src/vaadin-time-picker.js
@@ -766,6 +766,11 @@ class TimePicker extends PatternMixin(InputControlMixin(ThemableMixin(ElementMix
   __updateValue(obj) {
     const timeString = this.__formatISO(this.__validateTime(obj)) || '';
     this.value = timeString;
+
+    // Always strip the input value to match the step interval, even
+    // if the component value hasn't changed. For example, if the step
+    // is 3600 "10:00:50" should become "10:00".
+    this.__updateInputValue(obj);
   }
 
   /** @private */

diff --git a/packages/time-picker/test/value-commit.test.js b/packages/time-picker/test/value-commit.test.js
@@ -463,6 +463,22 @@ describe('value commit', () => {
       expectValueCommit('23:59:59');
     });
 
+    it('should strip milliseconds and commit on Enter', async () => {
+      await sendKeys({ type: '10:00:00.000' });
+      await sendKeys({ press: 'Enter' });
+      expectValueCommit('10:00:00');
+      expect(timePicker.inputElement.value).to.equal('10:00:00');
+    });
+
+    it('should strip milliseconds without commit on Enter if value was unchanged', async () => {
+      timePicker.value = '10:00:00';
+      valueChangedSpy.resetHistory();
+      await sendKeys({ type: '.000' });
+      await sendKeys({ press: 'Enter' });
+      expectNoValueCommit();
+      expect(timePicker.inputElement.value).to.equal('10:00:00');
+    });
+
     describe('with arrow key committed', () => {
       beforeEach(async () => {
         await sendKeys({ press: 'ArrowDown' });