Merge pull request #14428 from grafana/14425_time_regions

Fix time regions bugs

public/app/plugins/panel/graph/specs/time_region_manager.test.ts

@@ -238,6 +238,42 @@ describe('TimeRegionManager', () => {
       });
       });
     });
     });
 
 
+    plotOptionsScenario('for day of week from/to time region', ctx => {
+      const regions = [{ fromDayOfWeek: 7, from: '23:00', toDayOfWeek: 1, to: '01:40', fill: true, colorMode: 'red' }];
+      const from = moment('2018-12-07T12:51:19+01:00');
+      const to = moment('2018-12-10T13:51:29+01:00');
+      ctx.setup(regions, from, to);
+
+      it('should add 1 marking', () => {
+        expect(ctx.options.grid.markings.length).toBe(1);
+      });
+
+      it('should add one fill between sunday 23:00 and monday 01:40', () => {
+        const markings = ctx.options.grid.markings;
+
+        expect(moment(markings[0].xaxis.from).format()).toBe(moment('2018-12-10T00:00:00+01:00').format());
+        expect(moment(markings[0].xaxis.to).format()).toBe(moment('2018-12-10T02:40:00+01:00').format());
+      });
+    });
+
+    plotOptionsScenario('for day of week from/to time region', ctx => {
+      const regions = [{ fromDayOfWeek: 6, from: '03:00', toDayOfWeek: 7, to: '02:00', fill: true, colorMode: 'red' }];
+      const from = moment('2018-12-07T12:51:19+01:00');
+      const to = moment('2018-12-10T13:51:29+01:00');
+      ctx.setup(regions, from, to);
+
+      it('should add 1 marking', () => {
+        expect(ctx.options.grid.markings.length).toBe(1);
+      });
+
+      it('should add one fill between saturday 03:00 and sunday 02:00', () => {
+        const markings = ctx.options.grid.markings;
+
+        expect(moment(markings[0].xaxis.from).format()).toBe(moment('2018-12-08T04:00:00+01:00').format());
+        expect(moment(markings[0].xaxis.to).format()).toBe(moment('2018-12-09T03:00:00+01:00').format());
+      });
+    });
+
     plotOptionsScenario('for day of week from/to time region with daylight saving time', ctx => {
     plotOptionsScenario('for day of week from/to time region with daylight saving time', ctx => {
       const regions = [{ fromDayOfWeek: 7, from: '20:00', toDayOfWeek: 7, to: '23:00', fill: true, colorMode: 'red' }];
       const regions = [{ fromDayOfWeek: 7, from: '20:00', toDayOfWeek: 7, to: '23:00', fill: true, colorMode: 'red' }];
       const from = moment('2018-03-17T06:00:00+01:00');
       const from = moment('2018-03-17T06:00:00+01:00');

public/app/plugins/panel/graph/time_region_manager.ts

@@ -169,8 +169,16 @@ export class TimeRegionManager {
             fromEnd.add(hRange.to.h - hRange.from.h, 'hours');
             fromEnd.add(hRange.to.h - hRange.from.h, 'hours');
           } else if (hRange.from.h + hRange.to.h < 23) {
           } else if (hRange.from.h + hRange.to.h < 23) {
             fromEnd.add(hRange.to.h, 'hours');
             fromEnd.add(hRange.to.h, 'hours');
+
+            while (fromEnd.hour() !== hRange.to.h) {
+              fromEnd.add(-1, 'hours');
+            }
           } else {
           } else {
             fromEnd.add(24 - hRange.from.h, 'hours');
             fromEnd.add(24 - hRange.from.h, 'hours');
+
+            while (fromEnd.hour() !== hRange.to.h) {
+              fromEnd.add(1, 'hours');
+            }
           }
           }
 
 
           fromEnd.set('minute', hRange.to.m);
           fromEnd.set('minute', hRange.to.m);