Take into account events created before milestone start

- Also update test case to align with backend burndown specs

ee/app/assets/javascripts/burndown_chart/burndown_chart_data.js

@@ -3,9 +3,9 @@ import dateFormat from 'dateformat';
 export default class BurndownChartData {
   constructor(burndownEvents, startDate, dueDate) {
     this.dateFormatMask = 'yyyy-mm-dd';
-    this.burndownEvents = this.convertEventsToLocalTimezone(burndownEvents);
     this.startDate = startDate;
     this.dueDate = dueDate;
+    this.burndownEvents = this.processRawEvents(burndownEvents);
 
     // determine when to stop burndown chart
     const today = dateFormat(new Date(), this.dateFormatMask);
@@ -44,10 +44,16 @@ export default class BurndownChartData {
     return chartData;
   }
 
-  convertEventsToLocalTimezone(events) {
+  // Process raw milestone events:
+  // 1. Set event creation date to milestone start date if created before milestone start
+  // 2. Convert event creation date to local timezone
+  processRawEvents(events) {
     return events.map(event => ({
       ...event,
-      created_at: dateFormat(event.created_at, this.dateFormatMask),
+      created_at: dateFormat(
+        new Date(event.created_at) < new Date(this.startDate) ? this.startDate : event.created_at,
+        this.dateFormatMask,
+      ),
     }));
   }
 

ee/changelogs/unreleased/weimeng-burndown-chart-fix.yml

+---
+title: Take into account events created before milestone start
+merge_request: 14184
+author:
+type: fixed

ee/spec/frontend/burndown_chart/burndown_chart_data_spec.js

@@ -2,24 +2,18 @@ import dateFormat from 'dateformat';
 import BurndownChartData from 'ee/burndown_chart/burndown_chart_data';
 
 describe('BurndownChartData', () => {
+  const startDate = '2017-03-01';
+  const dueDate = '2017-03-03';
+
   const milestoneEvents = [
     { created_at: '2017-03-01T00:00:00.000Z', weight: 2, action: 'created' },
     { created_at: '2017-03-01T00:00:00.000Z', weight: 2, action: 'created' },
-    { created_at: '2017-03-01T00:00:00.000Z', weight: 2, action: 'created' },
-    { created_at: '2017-03-01T00:00:00.000Z', weight: 2, action: 'created' },
-    { created_at: '2017-03-01T00:00:00.000Z', weight: 2, action: 'created' },
-    { created_at: '2017-03-01T00:00:00.190Z', weight: 2, action: 'closed' },
-    { created_at: '2017-03-01T00:00:00.478Z', weight: 2, action: 'reopened' },
-    { created_at: '2017-03-01T00:00:00.597Z', weight: 2, action: 'closed' },
-    { created_at: '2017-03-01T00:00:00.767Z', weight: 2, action: 'reopened' },
-    { created_at: '2017-03-03T00:00:00.260Z', weight: 2, action: 'closed' },
-    { created_at: '2017-03-03T00:00:00.152Z', weight: 2, action: 'closed' },
-    { created_at: '2017-03-03T00:00:00.572Z', weight: 2, action: 'reopened' },
-    { created_at: '2017-03-03T00:00:00.450Z', weight: 2, action: 'closed' },
-    { created_at: '2017-03-03T00:00:00.352Z', weight: 2, action: 'reopened' },
+    { created_at: '2017-03-02T00:00:00.000Z', weight: 2, action: 'created' },
+    { created_at: '2017-03-02T00:00:00.000Z', weight: 2, action: 'closed' },
+    { created_at: '2017-03-02T00:00:00.000Z', weight: 2, action: 'closed' },
+    { created_at: '2017-03-03T00:00:00.000Z', weight: 2, action: 'created' },
+    { created_at: '2017-03-03T00:00:00.000Z', weight: 2, action: 'reopened' },
   ];
-  const startDate = '2017-03-01';
-  const dueDate = '2017-03-03';
 
   let burndownChartData;
 
@@ -30,12 +24,30 @@ describe('BurndownChartData', () => {
   describe('generate', () => {
     it('generates an array of arrays with date, issue count and weight', () => {
       expect(burndownChartData.generate()).toEqual([
-        ['2017-03-01', 5, 10],
-        ['2017-03-02', 5, 10],
-        ['2017-03-03', 4, 8],
+        ['2017-03-01', 2, 4],
+        ['2017-03-02', 1, 2],
+        ['2017-03-03', 3, 6],
       ]);
     });
 
+    describe('when issues are created before start date', () => {
+      beforeAll(() => {
+        milestoneEvents.push({
+          created_at: '2017-02-28T00:00:00.000Z',
+          weight: 2,
+          action: 'created',
+        });
+      });
+
+      it('generates an array of arrays with date, issue count and weight', () => {
+        expect(burndownChartData.generate()).toEqual([
+          ['2017-03-01', 3, 6],
+          ['2017-03-02', 2, 4],
+          ['2017-03-03', 4, 8],
+        ]);
+      });
+    });
+
     describe('when viewing before due date', () => {
       beforeAll(() => {
         const today = new Date(2017, 2, 2);