Apply reviewer suggestions

Fix capitalization for test case name.

Use test inputs that resemble the actual use cases.

Use parameterization on 'it' blocks.

ee/spec/frontend/roadmap/utils/roadmap_item_utils_spec.js

@@ -5,11 +5,40 @@ import { dateFromString, parsePikadayDate } from '~/lib/utils/datetime_utility';
 
 import { rawEpics, mockGroupMilestonesQueryResponse } from '../mock_data';
 
+const mockQuarterlyTimeframe = [
+  {
+    range: [
+      dateFromString('Jan 1 2020'),
+      dateFromString('Feb 1 2020'),
+      dateFromString('Mar 1 2020'),
+    ],
+  },
+  {
+    range: [
+      dateFromString('Apr 1 2020'),
+      dateFromString('May 1 2020'),
+      dateFromString('Jun 1 2020'),
+    ],
+  },
+];
+
+const mockMonthlyTimeframe = [
+  dateFromString('Jan 1 2020'),
+  dateFromString('Feb 1 2020'),
+  dateFromString('Mar 1 2020'),
+];
+
+const mockWeeklyTimeframe = [
+  dateFromString('Dec 6 2020'),
+  dateFromString('Dec 13 2020'),
+  dateFromString('Dec 20 2020'),
+];
+
 describe('processRoadmapItemDates', () => {
   const timeframeStartDate = new Date(2017, 0, 1);
   const timeframeEndDate = new Date(2017, 11, 31);
 
-  it('Should set `startDateOutOfRange`/`endDateOutOfRange` as true and `startDate` and `endDate` to dates of timeframe range when epic dates are outside timeframe range', () => {
+  it('should set `startDateOutOfRange`/`endDateOutOfRange` as true and `startDate` and `endDate` to dates of timeframe range when epic dates are outside timeframe range', () => {
     const mockEpic = {
       originalStartDate: new Date(2016, 11, 15),
       originalEndDate: new Date(2018, 0, 1),
@@ -27,7 +56,7 @@ describe('processRoadmapItemDates', () => {
     expect(updatedEpic.endDate.getTime()).toBe(timeframeEndDate.getTime());
   });
 
-  it('Should set `startDateOutOfRange`/`endDateOutOfRange` as false and `startDate` and `endDate` to actual epic dates when they are within timeframe range', () => {
+  it('should set `startDateOutOfRange`/`endDateOutOfRange` as false and `startDate` and `endDate` to actual epic dates when they are within timeframe range', () => {
     const mockEpic = {
       originalStartDate: new Date(2017, 2, 10),
       originalEndDate: new Date(2017, 6, 22),
@@ -45,7 +74,7 @@ describe('processRoadmapItemDates', () => {
     expect(updatedEpic.endDate.getTime()).toBe(mockEpic.originalEndDate.getTime());
   });
 
-  it('Should set `startDate` and `endDate` to timeframe start and end dates when epic dates are undefined', () => {
+  it('should set `startDate` and `endDate` to timeframe start and end dates when epic dates are undefined', () => {
     const mockEpic = {
       startDateUndefined: true,
       endDateUndefined: true,
@@ -80,7 +109,7 @@ describe('formatRoadmapItemDetails', () => {
     expect(epic.groupName).toBe(rawEpic.group_name);
   });
 
-  it('Should return formatted Epic object with `startDate`/`endDate` and `originalStartDate`/originalEndDate` initialized when dates are present', () => {
+  it('should return formatted Epic object with `startDate`/`endDate` and `originalStartDate`/originalEndDate` initialized when dates are present', () => {
     const mockRawEpic = {
       start_date: '2017-2-15',
       end_date: '2017-7-22',
@@ -101,7 +130,7 @@ describe('formatRoadmapItemDetails', () => {
     expect(epic.originalEndDate.getTime()).toBe(endDate.getTime());
   });
 
-  it('Should return formatted Epic object with `startDateUndefined`/startDateUndefined` set to true when dates are null/undefined', () => {
+  it('should return formatted Epic object with `startDateUndefined`/startDateUndefined` set to true when dates are null/undefined', () => {
     const epic = roadmapItemUtils.formatRoadmapItemDetails(
       {},
       timeframeStartDate,
@@ -130,45 +159,42 @@ describe('extractGroupMilestones', () => {
 });
 
 describe('lastTimeframeIndex', () => {
-  it('Should return last index of the timeframe array', () => {
+  it('should return last index of the timeframe array', () => {
     const timeframe = [1, 2, 3, 4];
 
     expect(roadmapItemUtils.lastTimeframeIndex(timeframe)).toBe(3);
   });
 });
 
-describe.each`
-  presetType               | timeframe
-  ${PRESET_TYPES.QUARTERS} | ${[{ range: ['foo', 'bar', 'baz'] }, { range: ['abc', 'cde', 'efg'] }]}
-  ${PRESET_TYPES.MONTHS}   | ${['foo', 'bar', 'baz']}
-  ${PRESET_TYPES.WEEKS}    | ${['foo', 'bar', 'baz']}
-`('timeframeStartDate', ({ presetType, timeframe }) => {
-  it(`Should return first item of the timeframe range array when preset type is ${presetType}`, () => {
-    expect(roadmapItemUtils.timeframeStartDate(presetType, timeframe)).toBe('foo');
-  });
+describe('timeframeStartDate', () => {
+  it.each`
+    presetType               | firstItem                       | timeframe
+    ${PRESET_TYPES.QUARTERS} | ${dateFromString('Jan 1 2020')} | ${mockQuarterlyTimeframe}
+    ${PRESET_TYPES.MONTHS}   | ${dateFromString('Jan 1 2020')} | ${mockMonthlyTimeframe}
+    ${PRESET_TYPES.WEEKS}    | ${dateFromString('Dec 6 2020')} | ${mockWeeklyTimeframe}
+  `(
+    `should return first item of the timeframe range array when preset type is $presetType`,
+    ({ presetType, firstItem, timeframe }) => {
+      expect(roadmapItemUtils.timeframeStartDate(presetType, timeframe)).toEqual(firstItem);
+    },
+  );
 });
 
 describe('timeframeEndDate', () => {
+  /*
+    Note that for a weekly timeframe, lastItem should point to the ending date of a week.
+    For example, if in mockWeeklyTimeframe, 'Dec 20 2020' is the last item.
+    However, the ending date for that week is 'Dec 27 2020'.
+   */
   it.each`
-    presetType               | lastItem | timeframe
-    ${PRESET_TYPES.QUARTERS} | ${'efg'} | ${[{ range: ['foo', 'bar', 'baz'] }, { range: ['abc', 'cde', 'efg'] }]}
-    ${PRESET_TYPES.MONTHS}   | ${'baz'} | ${['foo', 'bar', 'baz']}
+    presetType               | lastItem                         | timeframe
+    ${PRESET_TYPES.QUARTERS} | ${dateFromString('Jun 1 2020')}  | ${mockQuarterlyTimeframe}
+    ${PRESET_TYPES.MONTHS}   | ${dateFromString('Mar 1 2020')}  | ${mockMonthlyTimeframe}
+    ${PRESET_TYPES.WEEKS}    | ${dateFromString('Dec 27 2020')} | ${mockWeeklyTimeframe}
   `(
-    `Should return last item of the timeframe range array when preset type is $presetType`,
+    `should return last item of the timeframe range array when preset type is $presetType`,
     ({ presetType, lastItem, timeframe }) => {
-      expect(roadmapItemUtils.timeframeEndDate(presetType, timeframe)).toBe(lastItem);
+      expect(roadmapItemUtils.timeframeEndDate(presetType, timeframe)).toEqual(lastItem);
     },
   );
-
-  it('Should return last item of the timeframe array from the state when preset type is WEEKS', () => {
-    const timeframe = [
-      dateFromString('Dec 23 2018'),
-      dateFromString('Dec 30 2018'),
-      dateFromString('Jan 6 2019'),
-    ];
-
-    expect(roadmapItemUtils.timeframeEndDate(PRESET_TYPES.WEEKS, timeframe).getTime()).toBe(
-      dateFromString('Jan 13 2019').getTime(),
-    );
-  });
 });