From 30880e6e18cec1f0469516da0d497e126d281754 Mon Sep 17 00:00:00 2001
From: Dominik Prokop <dominik.prokop@grafana.com>
Date: Wed, 25 May 2022 12:22:28 +0200
Subject: [PATCH] Old Graph migration: Preserve null values settings (#49493)

* Graph migration: Preserve null values settings

* Review
---
 .../__snapshots__/migrations.test.ts.snap     | 16 ++++++-------
 .../panel/timeseries/migrations.test.ts       | 23 +++++++++++++++++++
 .../plugins/panel/timeseries/migrations.ts    |  2 +-
 3 files changed, 32 insertions(+), 9 deletions(-)

diff --git a/public/app/plugins/panel/timeseries/__snapshots__/migrations.test.ts.snap b/public/app/plugins/panel/timeseries/__snapshots__/migrations.test.ts.snap
index 54174fbd013..60fb6a03a78 100644
--- a/public/app/plugins/panel/timeseries/__snapshots__/migrations.test.ts.snap
+++ b/public/app/plugins/panel/timeseries/__snapshots__/migrations.test.ts.snap
@@ -12,7 +12,7 @@ Object {
         "lineInterpolation": "stepAfter",
         "lineWidth": 5,
         "showPoints": "never",
-        "spanNulls": true,
+        "spanNulls": false,
       },
       "nullValueMode": "null",
       "unit": "short",
@@ -120,7 +120,7 @@ Object {
         "lineInterpolation": "stepAfter",
         "lineWidth": 1,
         "showPoints": "never",
-        "spanNulls": true,
+        "spanNulls": false,
       },
       "nullValueMode": "null",
       "unit": "short",
@@ -176,7 +176,7 @@ Object {
         "lineInterpolation": "stepAfter",
         "lineWidth": 1,
         "showPoints": "never",
-        "spanNulls": true,
+        "spanNulls": false,
       },
       "nullValueMode": "null",
       "unit": "short",
@@ -259,7 +259,7 @@ Object {
         "lineInterpolation": "stepAfter",
         "lineWidth": 5,
         "showPoints": "never",
-        "spanNulls": true,
+        "spanNulls": false,
         "stacking": Object {
           "group": "A",
           "mode": "normal",
@@ -346,7 +346,7 @@ Object {
         "lineInterpolation": "stepAfter",
         "lineWidth": 5,
         "showPoints": "never",
-        "spanNulls": true,
+        "spanNulls": false,
         "stacking": Object {
           "group": "A",
           "mode": "normal",
@@ -404,7 +404,7 @@ Object {
         "lineInterpolation": "stepAfter",
         "lineWidth": 1,
         "showPoints": "never",
-        "spanNulls": true,
+        "spanNulls": false,
       },
       "displayName": "DISPLAY NAME",
       "nullValueMode": "null",
@@ -444,7 +444,7 @@ Object {
         "lineInterpolation": "stepAfter",
         "lineWidth": 5,
         "showPoints": "never",
-        "spanNulls": true,
+        "spanNulls": false,
       },
       "nullValueMode": "null",
       "unit": "short",
@@ -554,7 +554,7 @@ Object {
           "type": "log",
         },
         "showPoints": "never",
-        "spanNulls": true,
+        "spanNulls": false,
       },
       "decimals": 3,
       "max": 1000,
diff --git a/public/app/plugins/panel/timeseries/migrations.test.ts b/public/app/plugins/panel/timeseries/migrations.test.ts
index 767c528464a..1d4a553c40c 100644
--- a/public/app/plugins/panel/timeseries/migrations.test.ts
+++ b/public/app/plugins/panel/timeseries/migrations.test.ts
@@ -426,6 +426,29 @@ describe('Graph Migrations', () => {
       expect(panel.fieldConfig).toMatchSnapshot();
     });
   });
+
+  describe('null values', () => {
+    test('nullPointMode = null', () => {
+      const old: any = {
+        angular: {
+          nullPointMode: 'null',
+        },
+      };
+      const panel = {} as PanelModel;
+      panel.options = graphPanelChangedHandler(panel, 'graph', old, prevFieldConfig);
+      expect(panel.fieldConfig.defaults.custom.spanNulls).toBeFalsy();
+    });
+    test('nullPointMode = connected', () => {
+      const old: any = {
+        angular: {
+          nullPointMode: 'connected',
+        },
+      };
+      const panel = {} as PanelModel;
+      panel.options = graphPanelChangedHandler(panel, 'graph', old, prevFieldConfig);
+      expect(panel.fieldConfig.defaults.custom.spanNulls).toBeTruthy();
+    });
+  });
 });
 
 const customColor = {
diff --git a/public/app/plugins/panel/timeseries/migrations.ts b/public/app/plugins/panel/timeseries/migrations.ts
index 56beb024450..a19e7017cdb 100644
--- a/public/app/plugins/panel/timeseries/migrations.ts
+++ b/public/app/plugins/panel/timeseries/migrations.ts
@@ -296,7 +296,7 @@ export function flotToGraphOptions(angular: any): { fieldConfig: FieldConfigSour
     graph.fillOpacity = angular.fillGradient * 10; // fill is 0-10
   }
 
-  graph.spanNulls = angular.nullPointMode === NullValueMode.Null;
+  graph.spanNulls = angular.nullPointMode === NullValueMode.Ignore;
 
   if (angular.steppedLine) {
     graph.lineInterpolation = LineInterpolation.StepAfter;