Fix TZ dependent flaky VSA test

ee/app/assets/javascripts/analytics/shared/utils.js

@@ -70,6 +70,22 @@ export const buildProjectFromDataset = (dataset) => {
   return null;
 };
 
+/**
+ * Creates a new date object without time zone conversion.
+ *
+ * We use this method instead of `new Date(date)`.
+ * `new Date(date) will assume that the date string is UTC and it
+ * ant return different date depending on the user's time zone.
+ *
+ * @param {String} date - Date string.
+ * @returns {Date} - Date object.
+ */
+export const toLocalDate = (date) => {
+  const dateParts = date.split('-');
+
+  return new Date(dateParts[0], dateParts[1] - 1, dateParts[2]);
+};
+
 /**
  * Creates an array of project objects from a json string. Returns null if no projects are present.
  *
@@ -117,8 +133,8 @@ export const buildCycleAnalyticsInitialData = ({
         }),
       )
     : null,
-  createdBefore: createdBefore ? new Date(createdBefore) : null,
-  createdAfter: createdAfter ? new Date(createdAfter) : null,
+  createdBefore: createdBefore ? toLocalDate(createdBefore) : null,
+  createdAfter: createdAfter ? toLocalDate(createdAfter) : null,
   selectedProjects: projects
     ? buildProjectsFromJSON(projects).map(convertObjectPropsToCamelCase)
     : null,

ee/spec/features/groups/analytics/cycle_analytics/filters_and_data_spec.rb

@@ -243,17 +243,21 @@ RSpec.describe 'Group value stream analytics filters and data', :js do
         end
 
         context 'with created_before and created_after set' do
+          let(:created_after) { '2019-11-01' }
+          let(:created_before) { '2019-12-31' }
+
           date_range = '.js-daterange-picker'
 
           before do
-            visit "#{group_analytics_cycle_analytics_path(group)}?created_before=2019-12-31&created_after=2019-11-01"
+            visit "#{group_analytics_cycle_analytics_path(group)}?created_before=#{created_before}&created_after=#{created_after}"
           end
 
           it 'has the date range prepopulated' do
             element = page.find(date_range)
 
-            expect(element.find('.js-daterange-picker-from input').value).to eq '2019-11-01'
-            expect(element.find('.js-daterange-picker-to input').value).to eq '2019-12-31'
+            expect(element.find('.js-daterange-picker-from input').value).to eq created_after
+            expect(element.find('.js-daterange-picker-to input').value).to eq created_before
+
             expect(page.find('.js-tasks-by-type-chart')).to have_text(_("Showing data for group '%{group_name}' from Nov 1, 2019 to Dec 31, 2019") % { group_name: group.name })
           end
         end

ee/spec/frontend/analytics/shared/utils_spec.js

@@ -2,6 +2,7 @@ import {
   buildGroupFromDataset,
   buildProjectFromDataset,
   buildCycleAnalyticsInitialData,
+  toLocalDate,
 } from 'ee/analytics/shared/utils';
 
 const rawValueStream = `{
@@ -80,6 +81,14 @@ describe('buildProjectFromDataset', () => {
   });
 });
 
+describe('toLocalDate', () => {
+  it('returns a Date object', () => {
+    const expectedDate = new Date(2022, 1, 10); // month is zero-based
+
+    expect(toLocalDate('2022-02-10')).toEqual(expectedDate);
+  });
+});
+
 describe('buildCycleAnalyticsInitialData', () => {
   it.each`
     field                 | value