From 94a3661bc81cca8792ad3f566e778264f6fafd07 Mon Sep 17 00:00:00 2001
From: Geert Selderslaghs <geert@codemindit.com>
Date: Fri, 13 Dec 2024 13:18:32 +0100
Subject: [PATCH] e nhancement(Datepicker) implemented additional test on user
 input change modal se lected option input validation

---
 spec/tests/datepicker/datepickerSpec.js | 27 +++++++++++++++++++++++++
 1 file changed, 27 insertions(+)

diff --git a/spec/tests/datepicker/datepickerSpec.js b/spec/tests/datepicker/datepickerSpec.js
index 5bce48c24a..18bdc0dffd 100644
--- a/spec/tests/datepicker/datepickerSpec.js
+++ b/spec/tests/datepicker/datepickerSpec.js
@@ -77,5 +77,32 @@ describe('Datepicker Plugin', () => {
         }, 400);
       }, 400);
     });
+
+    it('can change the calendar modal selected date by input', (done) => {
+      const input = document.querySelector('#datepickerInput');
+      M.Datepicker.init(input, { format: 'mm/dd/yyyy' });
+      const today = new Date();
+      let month = today.getMonth();
+      const year = today.getFullYear() - 44;
+      const day = 11;
+      input.value = `${month < 10 ? `0${month}` : month}/${day}/${year}`;
+      input.dispatchEvent(
+        new Event('change', { bubbles: true, cancelable: true })
+      );
+      keydown(input, 13);
+      setTimeout(() => {
+        expect(document.querySelector('.datepicker-modal')).toHaveClass(
+          'open',
+          'modal should be shown after input is submitted.'
+        );
+        const selectMonthElem = document.querySelector('.datepicker-select.orig-select-month');
+        const selectYearElem = document.querySelector('.datepicker-select.orig-select-year');
+        const selectedDayElem = document.querySelector(`.datepicker-row td[data-day="${day}"]`);
+        expect(selectMonthElem.querySelector('option[selected="selected"]').value === (month -1).toString()).toEqual(true, `selected month should be ${month}, given value ${selectMonthElem.querySelector('option[selected="selected"]').value}`)
+        expect(selectYearElem.querySelector('option[selected="selected"]').value === year.toString()).toEqual(true, `selected year should be ${year}, given value ${selectYearElem.querySelector('option[selected="selected"]').value}`)
+        expect(selectedDayElem.classList.contains('is-selected')).toEqual(true, `selected day should be ${day}, given value ${selectedDayElem.classList}`);
+        done();
+      }, 10);
+    });
   });
 });