Pass date as integer params on instantiate new Date in order to avoid time zone inconsistency

3 files changed, 86 insertions, 0 deletions

diff --git a/spec/javascripts/datetime_utility_spec.js.es6 b/spec/javascripts/datetime_utility_spec.js.es6
index 8ece24555c5..756c888cad7 100644
--- a/spec/javascripts/datetime_utility_spec.js.es6
+++ b/spec/javascripts/datetime_utility_spec.js.es6
@@ -2,6 +2,38 @@
 
 (() => {
   describe('Date time utils', () => {
+    describe('create date object', () => {
+      describe('using dashes', () => {
+        it('should instantiate the date object using integer params', () => {
+          spyOn(window, 'Date')
+          gl.utils.createDateObject('2016-11-12');
+          expect(window.Date).toHaveBeenCalledWith(2016, 10, 12);
+        });
+
+        it('should return the right date object ', () => {
+          const date = gl.utils.createDateObject('2016-11-12');
+          expect(date.getDate()).toBe(12);
+          expect(date.getMonth()).toBe(10);
+          expect(date.getFullYear()).toBe(2016);
+        });
+      });
+
+      describe('using slashes', () => {
+        it('should instantiate the date object using integer params', () => {
+          spyOn(window, 'Date')
+          gl.utils.createDateObject('2016/08/02');
+          expect(window.Date).toHaveBeenCalledWith(2016, 7, 2);
+        });
+
+        it('should return the right date object', () => {
+          const date = gl.utils.createDateObject('2016/08/02');
+          expect(date.getDate()).toBe(2);
+          expect(date.getMonth()).toBe(7);
+          expect(date.getFullYear()).toBe(2016);
+        });
+      });
+    });
+
     describe('get day name', () => {
       it('should return Sunday', () => {
         const day = gl.utils.getDayName(new Date('07/17/2016'));
diff --git a/spec/javascripts/due_date_select_spec.js.es6 b/spec/javascripts/due_date_select_spec.js.es6
new file mode 100644
index 00000000000..d491c25b6fe
--- /dev/null
+++ b/spec/javascripts/due_date_select_spec.js.es6
@@ -0,0 +1,25 @@
+/* eslint-disable */
+//= require lib/utils/datetime_utility
+//= require jquery
+/*= require jquery-ui/datepicker */
+/*= require gl_dropdown */
+//= require due_date_select
+(() => {
+  describe('Due Date Select', () => {
+    describe('parseSelectedDate()', () => {
+      it('call create date object', () => {
+        const $dom = $(fixture.preload('due_date_select.html')[0]);
+
+        const dueDateSelect = new gl.DueDateSelect({
+          $context: $dom,
+          $dropdown: $dom.find('.js-due-date-select'),
+          $loading: $dom.find('.block-loading')
+        });
+
+        spyOn(gl.utils, 'createDateObject');
+        dueDateSelect.parseSelectedDate();
+        expect(gl.utils.createDateObject).toHaveBeenCalledWith('2016-11-20');
+      });
+    });
+  });
+})();
diff --git a/spec/javascripts/fixtures/due_date_select.html.haml b/spec/javascripts/fixtures/due_date_select.html.haml
new file mode 100644
index 00000000000..ed7dcb0d658
--- /dev/null
+++ b/spec/javascripts/fixtures/due_date_select.html.haml
@@ -0,0 +1,29 @@
+.block.due_date
+  .sidebar-collapsed-icon
+    %i.fa.fa-calendar
+    %span.js-due-date-sidebar-value
+      Nov 20, 2016
+  .title.hide-collapsed
+    Due date
+    %i.fa.fa-spinner.fa-spin.block-loading
+    %a.edit-link.pull-right{ href: "#"} Edit
+  .value.hide-collapsed
+    %span.value-content
+      %span.bold
+        Nov 20, 2016
+      %span.no-value.js-remove-due-date-holder
+        %a.js-remove-due-date{ href: "#", role: "button" }
+          remove due date
+    .selectbox.hide-collapsed
+      %input{type: "hidden", name: "issue[due_date]", id: "issue[due_date]", value: "2016-11-20"}
+      .dropdown
+        %button.dropdown-menu-toggle.js-due-date-select{ type: 'button', data: { toggle: 'dropdown', field_name: "issue[due_date]", ability_name: "issue", issue_update: "/h5bp/html5-boilerplate/issues/10.json" } }
+          %span.dropdown-toggle-text Due date
+          %i.fa.fa-chevron-down
+        .dropdown-menu.dropdown-menu-due-date
+          .dropdown-title
+            %span Due Date
+            %button.dropdown-title-button.dropdown-menu-close{ type: "button" }
+              %i.fa.fa-times.dropdown-menu-close-icon
+          .dropdown-content
+            .js-due-date-calendar