REGRESSION(r212542): Make TimeSeriesChart.computeTimeGrid stops x-axis grid prematurely
authorrniwa@webkit.org <rniwa@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 24 Feb 2017 03:12:37 +0000 (03:12 +0000)
committerrniwa@webkit.org <rniwa@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 24 Feb 2017 03:12:37 +0000 (03:12 +0000)
https://bugs.webkit.org/show_bug.cgi?id=168812

Reviewed by Joseph Pecoraro.

Add time iterator of two months, three months, and four months with some tests.

Also for one-month time iterator, round the day of month to 1 or 15 whichever is closer.

* browser-tests/time-series-chart-tests.js: Added more tests.
* public/v3/components/time-series-chart.js:
(TimeSeriesChart._timeIterators.next):
(TimeSeriesChart._timeIterators):

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@212935 268f45cc-cd09-0410-ab3c-d52691b4dbfc

Websites/perf.webkit.org/ChangeLog
Websites/perf.webkit.org/browser-tests/time-series-chart-tests.js
Websites/perf.webkit.org/public/v3/components/time-series-chart.js

index d2140aa..8233162 100644 (file)
@@ -1,3 +1,19 @@
+2017-02-23  Ryosuke Niwa  <rniwa@webkit.org>
+
+        REGRESSION(r212542): Make TimeSeriesChart.computeTimeGrid stops x-axis grid prematurely
+        https://bugs.webkit.org/show_bug.cgi?id=168812
+
+        Reviewed by Joseph Pecoraro.
+
+        Add time iterator of two months, three months, and four months with some tests.
+
+        Also for one-month time iterator, round the day of month to 1 or 15 whichever is closer.
+
+        * browser-tests/time-series-chart-tests.js: Added more tests.
+        * public/v3/components/time-series-chart.js:
+        (TimeSeriesChart._timeIterators.next):
+        (TimeSeriesChart._timeIterators):
+
 2017-02-22  Ryosuke Niwa  <rniwa@webkit.org>
 
         Add tests for InteractiveTimeSeriesChart and adopt actions
index 5f221ef..d0f8b66 100644 (file)
@@ -306,6 +306,64 @@ describe('TimeSeriesChart', () => {
                 checkGridItem(labels[1], '1/29', '2017-01-29T00:00:00Z');
             });
         });
+
+        it('should generate seven one-month labels for six and half months interval starting before 15th when maxLabels is 7', () => {
+            return new BrowsingContext().importScripts(scripts, 'TimeSeriesChart').then((TimeSeriesChart) => {
+                const endTime = new Date('2017-01-15T18:53:00Z');
+                const labels = TimeSeriesChart.computeTimeGrid(new Date('2016-07-12T18:53:00Z'), new Date('2017-01-18T08:17:53Z'), 7);
+                expect(labels).to.be.a('array');
+                expect(labels.length).to.be(7);
+                checkGridItem(labels[0], '7/15', '2016-07-15T00:00:00Z');
+                checkGridItem(labels[1], '8/15', '2016-08-15T00:00:00Z');
+                checkGridItem(labels[2], '9/15', '2016-09-15T00:00:00Z');
+                checkGridItem(labels[3], '10/15', '2016-10-15T00:00:00Z');
+                checkGridItem(labels[4], '11/15', '2016-11-15T00:00:00Z');
+                checkGridItem(labels[5], '12/15', '2016-12-15T00:00:00Z');
+                checkGridItem(labels[6], '1/15', '2017-01-15T00:00:00Z');
+            });
+        });
+
+        it('should generate seven one-month labels for six months interval staring after 15th when maxLabels is 7', () => {
+            return new BrowsingContext().importScripts(scripts, 'TimeSeriesChart').then((TimeSeriesChart) => {
+                const endTime = new Date('2017-01-15T18:53:00Z');
+                const labels = TimeSeriesChart.computeTimeGrid(new Date('2016-07-18T18:53:00Z'), new Date('2017-01-18T08:17:53Z'), 7);
+                expect(labels).to.be.a('array');
+                expect(labels.length).to.be(6);
+                checkGridItem(labels[0], '8/1', '2016-08-01T00:00:00Z');
+                checkGridItem(labels[1], '9/1', '2016-09-01T00:00:00Z');
+                checkGridItem(labels[2], '10/1', '2016-10-01T00:00:00Z');
+                checkGridItem(labels[3], '11/1', '2016-11-01T00:00:00Z');
+                checkGridItem(labels[4], '12/1', '2016-12-01T00:00:00Z');
+            });
+        });
+
+        it('should generate six two-months labels for one year interval when maxLabels is 7', () => {
+            return new BrowsingContext().importScripts(scripts, 'TimeSeriesChart').then((TimeSeriesChart) => {
+                const endTime = new Date('2017-01-15T18:53:00Z');
+                const labels = TimeSeriesChart.computeTimeGrid(new Date('2016-07-11T18:53:00Z'), new Date('2017-07-27T08:17:53Z'), 7);
+                expect(labels).to.be.a('array');
+                expect(labels.length).to.be(6);
+                checkGridItem(labels[0], '9/1', '2016-09-01T00:00:00Z');
+                checkGridItem(labels[1], '11/1', '2016-11-01T00:00:00Z');
+                checkGridItem(labels[2], '1/1', '2017-01-01T00:00:00Z');
+                checkGridItem(labels[3], '3/1', '2017-03-01T00:00:00Z');
+                checkGridItem(labels[4], '5/1', '2017-05-01T00:00:00Z');
+                checkGridItem(labels[5], '7/1', '2017-07-01T00:00:00Z');
+            });
+        });
+
+        it('should generate four three-months labels for one year interval when maxLabels is 5', () => {
+            return new BrowsingContext().importScripts(scripts, 'TimeSeriesChart').then((TimeSeriesChart) => {
+                const endTime = new Date('2017-01-15T18:53:00Z');
+                const labels = TimeSeriesChart.computeTimeGrid(new Date('2016-07-11T18:53:00Z'), new Date('2017-07-27T08:17:53Z'), 5);
+                expect(labels).to.be.a('array');
+                expect(labels.length).to.be(4);
+                checkGridItem(labels[0], '10/1', '2016-10-01T00:00:00Z');
+                checkGridItem(labels[1], '1/1', '2017-01-01T00:00:00Z');
+                checkGridItem(labels[2], '4/1', '2017-04-01T00:00:00Z');
+                checkGridItem(labels[3], '7/1', '2017-07-01T00:00:00Z');
+            });
+        });
     });
 
     describe('computeValueGrid', () => {
index f1569e3..80374fe 100644 (file)
@@ -619,7 +619,7 @@ class TimeSeriesChart extends ComponentBase {
 
         let previousDate = null;
         let previousMonth = null;
-        while (currentTime <= max && result.length < maxLabels) {
+        while (currentTime <= max) {
             const time = new Date(currentTime);
             const month = time.getUTCMonth() + 1;
             const date = time.getUTCDate();
@@ -713,7 +713,38 @@ class TimeSeriesChart extends ComponentBase {
                 diff: 31 * DAY,
                 next: function (date) {
                     date.setUTCHours(0);
-                    date.setUTCMonth(date.getUTCMonth() + 1);
+                    const dayOfMonth = date.getUTCDate();
+                    if (dayOfMonth > 1 && dayOfMonth < 15)
+                        date.setUTCDate(15);
+                    else {
+                        if (dayOfMonth != 15)
+                            date.setUTCDate(1);
+                        date.setUTCMonth(date.getUTCMonth() + 1);
+                    }
+                }
+            },
+            {
+                diff: 60 * DAY,
+                next: function (date) {
+                    date.setUTCHours(0);
+                    date.setUTCDate(1);
+                    date.setUTCMonth(date.getUTCMonth() + 2);
+                }
+            },
+            {
+                diff: 90 * DAY,
+                next: function (date) {
+                    date.setUTCHours(0);
+                    date.setUTCDate(1);
+                    date.setUTCMonth(date.getUTCMonth() + 3);
+                }
+            },
+            {
+                diff: 120 * DAY,
+                next: function (date) {
+                    date.setUTCHours(0);
+                    date.setUTCDate(1);
+                    date.setUTCMonth(date.getUTCMonth() + 4);
                 }
             },
         ];