TimeRange: Fixes issue when zooming out on a timerange with timespan 0 (#49622)

public/app/core/utils/timePicker.test.ts

@@ -73,6 +73,26 @@ describe('getZoomedTimeRange', () => {
 
       const result = getZoomedTimeRange(range, 2);
 
+      expect(result).toEqual(expectedRange);
+    });
+  });
+  describe('when called with a timespan of 0', () => {
+    it('then it should return a timespan of 30s', () => {
+      const range = {
+        from: toUtc('2019-01-01 10:00:00'),
+        to: toUtc('2019-01-01 10:00:00'),
+        raw: {
+          from: 'now',
+          to: 'now',
+        },
+      };
+      const expectedRange: AbsoluteTimeRange = {
+        from: toUtc('2019-01-01 09:59:45').valueOf(),
+        to: toUtc('2019-01-01 10:00:15').valueOf(),
+      };
+
+      const result = getZoomedTimeRange(range, 2);
+
       expect(result).toEqual(expectedRange);
     });
   });

public/app/core/utils/timePicker.ts

@@ -30,9 +30,11 @@ export const getShiftedTimeRange = (direction: number, origRange: TimeRange): Ab
 export const getZoomedTimeRange = (range: TimeRange, factor: number): AbsoluteTimeRange => {
   const timespan = range.to.valueOf() - range.from.valueOf();
   const center = range.to.valueOf() - timespan / 2;
+  // If the timepsan is 0, zooming out would do nothing, so we force a zoom out to 30s
+  const newTimespan = timespan === 0 ? 30000 : timespan * factor;
 
-  const to = center + (timespan * factor) / 2;
-  const from = center - (timespan * factor) / 2;
+  const to = center + newTimespan / 2;
+  const from = center - newTimespan / 2;
 
   return { from, to };
 };