second commit

node_modules/flowbite-datepicker/test/Datepicker/Datepicker-object.js

@@ -0,0 +1,236 @@
+describe('Datepicker', function () {
+  let input;
+
+  before(function () {
+    input = document.createElement('input');
+    testContainer.appendChild(input);
+  });
+
+  after(function () {
+    testContainer.removeChild(input);
+  });
+
+  it('input element\'s value is used for the initial date', function () {
+    input.value = '04/22/2020';
+
+    const dp = new Datepicker(input);
+    expect(dp.dates, 'to equal', [dateValue(2020, 3, 22)]);
+
+    dp.destroy();
+    input.value = '';
+  });
+
+  it('the picker is hidden at start', function () {
+    const dp = new Datepicker(input);
+    expect(isVisible(document.querySelector('.datepicker')), 'to be false');
+    expect(dp.active, 'to be false');
+    dp.destroy();
+  });
+
+  it('the picker becomes visible when the input element get focused', function () {
+    const dp = new Datepicker(input);
+    input.focus();
+
+    expect(isVisible(document.querySelector('.datepicker')), 'to be true');
+    expect(dp.active, 'to be true');
+    dp.destroy();
+  });
+
+  describe('hide()', function () {
+    it('makes the picker invisible', function () {
+      const dp = new Datepicker(input);
+      input.focus();
+      dp.hide();
+
+      expect(isVisible(document.querySelector('.datepicker')), 'to be false');
+      expect(dp.active, 'to be false');
+
+      dp.destroy();
+    });
+  });
+
+  describe('show()', function () {
+    it('makes the picker visible', function () {
+      const dp = new Datepicker(input);
+      dp.show();
+
+      expect(isVisible(document.querySelector('.datepicker')), 'to be true');
+      expect(dp.active, 'to be true');
+
+      dp.destroy();
+    });
+
+    it('moves the focus onto the input field', function () {
+      // related to issue #52
+      const dp = new Datepicker(input);
+      const spyShow = sinon.spy(dp, 'show');
+      input.blur();
+      dp.show();
+
+      expect(document.activeElement, 'to be', input);
+      // the focus listener's calling show() is prevented
+      expect(spyShow.calledOnce, 'to be true');
+
+      spyShow.restore();
+      dp.destroy();
+    });
+
+    it('adds or removes dir attribute to/from the picker if picker\'s text direction != input\'s', function (done) {
+      testContainer.dir = 'rtl';
+
+      const {dp, picker} = createDP(input);
+      dp.show();
+      expect(picker.dir, 'to be', 'rtl');
+
+      dp.hide();
+      testContainer.removeAttribute('dir');
+
+      dp.show();
+      expect(picker.hasAttribute('dir'), 'to be false');
+
+      dp.hide();
+
+      const htmlElem = document.querySelector('html');
+      htmlElem.dir = 'rtl';
+      input.style.direction = 'ltr';
+
+      dp.show();
+      expect(picker.dir, 'to be', 'ltr');
+
+      dp.hide();
+      input.removeAttribute('style');
+
+      dp.show();
+      expect(picker.hasAttribute('dir'), 'to be false');
+
+      dp.destroy();
+      htmlElem.removeAttribute('dir');
+      htmlElem.style.direction = 'ltr';
+
+      const checkDirChange = () => {
+        if (window.getComputedStyle(htmlElem).direction === 'ltr') {
+          htmlElem.removeAttribute('style');
+          done();
+        } else {
+          setTimeout(checkDirChange, 10);
+        }
+      };
+      checkDirChange();
+    });
+  });
+
+  describe('picker', function () {
+    it('displays current month with current date as focued date if no initial date is provided', function () {
+      let clock = sinon.useFakeTimers({now: new Date(2020, 1, 14)});
+
+      const {dp, picker} = createDP(input);
+      const days = Array.from(picker.querySelector('.datepicker-grid').children);
+      dp.show();
+
+      expect(getViewSwitch(picker).textContent, 'to be', 'February 2020');
+
+      expect(days, 'to have length', 42);
+      expect(filterCells(days, '.datepicker-cell'), 'to have length', 42);
+      expect(days[0].textContent, 'to be', '26');
+      expect(days[0].classList.contains('prev'), 'to be true');
+      expect(days[0].classList.contains('next'), 'to be false');
+      expect(days[5].textContent, 'to be', '31');
+      expect(days[5].classList.contains('prev'), 'to be true');
+      expect(days[5].classList.contains('next'), 'to be false');
+      expect(days[6].textContent, 'to be', '1');
+      expect(days[6].classList.contains('prev'), 'to be false');
+      expect(days[6].classList.contains('next'), 'to be false');
+      expect(days[34].textContent, 'to be', '29');
+      expect(days[34].classList.contains('prev'), 'to be false');
+      expect(days[34].classList.contains('next'), 'to be false');
+      expect(days[35].textContent, 'to be', '1');
+      expect(days[35].classList.contains('prev'), 'to be false');
+      expect(days[35].classList.contains('next'), 'to be true');
+      expect(days[41].textContent, 'to be', '7');
+      expect(days[41].classList.contains('prev'), 'to be false');
+      expect(days[41].classList.contains('next'), 'to be true');
+
+      expect(filterCells(days, '.focused'), 'to equal', [days[19]]);
+      expect(filterCells(days, '.selected'), 'to be empty');
+      expect(days[19].textContent, 'to be', '14');
+
+      dp.destroy();
+      clock.restore();
+    });
+
+    it('displays iniial date\'s month with the date as selected and focued date', function () {
+      input.value = '04/22/2020';
+
+      const {dp, picker} = createDP(input);
+      const days = Array.from(picker.querySelector('.datepicker-grid').children);
+      dp.show();
+
+      expect(getViewSwitch(picker).textContent, 'to be', 'April 2020');
+
+      expect(days, 'to have length', 42);
+      expect(filterCells(days, '.datepicker-cell'), 'to have length', 42);
+      expect(days[0].textContent, 'to be', '29');
+      expect(days[0].classList.contains('prev'), 'to be true');
+      expect(days[0].classList.contains('next'), 'to be false');
+      expect(days[2].textContent, 'to be', '31');
+      expect(days[2].classList.contains('prev'), 'to be true');
+      expect(days[2].classList.contains('next'), 'to be false');
+      expect(days[3].textContent, 'to be', '1');
+      expect(days[3].classList.contains('prev'), 'to be false');
+      expect(days[3].classList.contains('next'), 'to be false');
+      expect(days[32].textContent, 'to be', '30');
+      expect(days[32].classList.contains('prev'), 'to be false');
+      expect(days[32].classList.contains('next'), 'to be false');
+      expect(days[33].textContent, 'to be', '1');
+      expect(days[33].classList.contains('prev'), 'to be false');
+      expect(days[33].classList.contains('next'), 'to be true');
+      expect(days[41].textContent, 'to be', '9');
+      expect(days[41].classList.contains('prev'), 'to be false');
+      expect(days[41].classList.contains('next'), 'to be true');
+
+      expect(filterCells(days, '.focused'), 'to equal', [days[24]]);
+      expect(filterCells(days, '.selected'), 'to equal', [days[24]]);
+      expect(days[24].textContent, 'to be', '22');
+
+      dp.destroy();
+      input.value = '';
+    });
+
+    it('displays day names of week by default', function () {
+      const {dp, picker} = createDP(input);
+      const daysOfWeek = picker.querySelector('.days-of-week');
+      const days = Array.from(daysOfWeek.children).map(el => el.textContent);
+
+      expect(days, 'to equal', ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa']);
+
+      dp.destroy();
+    });
+
+    it('does not display calendar weeks by default', function () {
+      const {dp, picker} = createDP(input);
+
+      expect(picker.querySelectorAll('.calendar-weeks').length, 'to be', 0);
+
+      dp.destroy();
+    });
+
+    it('uses "button" for the main class of button element', function () {
+      const {dp, picker} = createDP(input);
+      const [viewSwitch, prevBtn, nextBtn, todayBtn, clearBtn] = getParts(picker, [
+        '.view-switch',
+        '.prev-btn',
+        '.next-btn',
+        '.today-btn',
+        '.clear-btn',
+      ]);
+
+      expect(viewSwitch.className, 'to be', 'button view-switch');
+      expect(prevBtn.className, 'to be', 'button prev-btn');
+      expect(nextBtn.className, 'to be', 'button next-btn');
+      expect(todayBtn.className, 'to be', 'button today-btn');
+      expect(clearBtn.className, 'to be', 'button clear-btn');
+
+      dp.destroy();
+    });
+  });
+});