E2E: Adding globals variables and interpolation format gdev test dashboard and e2e test (#26827)

devenv/dev-dashboards/feature-templating/global-variables-and-interpolation.json

@@ -0,0 +1,110 @@
+{
+  "annotations": {
+    "list": [
+      {
+        "builtIn": 1,
+        "datasource": "-- Grafana --",
+        "enable": true,
+        "hide": true,
+        "iconColor": "rgba(0, 211, 255, 1)",
+        "name": "Annotations & Alerts",
+        "type": "dashboard"
+      }
+    ]
+  },
+  "editable": true,
+  "gnetId": null,
+  "graphTooltip": 0,
+  "iteration": 1596705352582,
+  "links": [],
+  "panels": [
+    {
+      "datasource": null,
+      "fieldConfig": {
+        "defaults": {
+          "custom": {}
+        },
+        "overrides": []
+      },
+      "gridPos": {
+        "h": 16,
+        "w": 24,
+        "x": 0,
+        "y": 0
+      },
+      "id": 11,
+      "options": {
+        "content": "## Global variables\n\n* `__dashboard` = ${__dashboard}\n* `__dashboard.name` = ${__dashboard.name}\n* `__dashboard.uid` = ${__dashboard.uid}\n* `__org.name` = ${__org.name}\n* `__org.id` = ${__org.id}\n* `__user.id` = ${__user.id}\n* `__user.login` = ${__user.login}\n         \n## Formats\n\n* `Server:raw` = ${Server:raw}\n* `Server:regex` = ${Server:regex}\n* `Server:lucene` = ${Server:lucene}\n* `Server:glob` = ${Server:glob}\n* `Server:pipe` = ${Server:pipe}\n* `Server:distributed` = ${Server:distributed}\n* `Server:csv` = ${Server:csv}\n* `Server:html` = ${Server:html}\n* `Server:json` = ${Server:json}\n* `Server:percentencode` = ${Server:percentencode}\n* `Server:singlequote` = ${Server:singlequote}\n* `Server:doublequote` = ${Server:doublequote}\n* `Server:sqlstring` = ${Server:sqlstring}\n* `Server:date` = ${Server:date}\n\n",
+        "mode": "markdown"
+      },
+      "pluginVersion": "7.1.0",
+      "targets": [
+        {
+          "refId": "A",
+          "scenarioId": "random_walk"
+        }
+      ],
+      "timeFrom": null,
+      "timeShift": null,
+      "title": "Variable interpolation",
+      "type": "text"
+    }
+  ],
+  "schemaVersion": 26,
+  "style": "dark",
+  "tags": ["gdev", "templating"],
+  "templating": {
+    "list": [
+      {
+        "allValue": null,
+        "current": {
+          "selected": true,
+          "text": "All",
+          "value": ["$__all"]
+        },
+        "hide": 0,
+        "includeAll": true,
+        "label": null,
+        "multi": true,
+        "name": "Server",
+        "options": [
+          {
+            "selected": true,
+            "text": "All",
+            "value": "$__all"
+          },
+          {
+            "selected": false,
+            "text": "A'A\"A",
+            "value": "A'A\"A"
+          },
+          {
+            "selected": false,
+            "text": "BB\\B",
+            "value": "BB\\B"
+          },
+          {
+            "selected": false,
+            "text": "CCC",
+            "value": "CCC"
+          }
+        ],
+        "query": "A'A\"A,BB\\B,CCC",
+        "queryValue": "",
+        "skipUrlSync": false,
+        "type": "custom"
+      }
+    ]
+  },
+  "time": {
+    "from": "now-6h",
+    "to": "now"
+  },
+  "timepicker": {
+    "refresh_intervals": ["5s", "10s", "30s", "1m", "5m", "15m", "30m", "1h", "2h", "1d"]
+  },
+  "timezone": "",
+  "title": "Global variables and interpolation",
+  "uid": "HYaGDGIMk",
+  "version": 3
+}

e2e/suite1/specs/dashboard-templating.spec.ts

@@ -0,0 +1,50 @@
+import { e2e } from '@grafana/e2e';
+
+e2e.scenario({
+  describeName: 'Dashboard templating',
+  itName: 'Verify variable interpolation works',
+  addScenarioDataSource: false,
+  addScenarioDashBoard: false,
+  skipScenario: false,
+  scenario: () => {
+    // Open dashboard global variables and interpolation
+    e2e.flows.openDashboard({ uid: 'HYaGDGIMk' });
+
+    const items: any = [];
+    const expectedItems: string[] = [
+      '__dashboard = Global variables and interpolation',
+      '__dashboard.name = Global variables and interpolation',
+      '__dashboard.uid = HYaGDGIMk',
+      '__org.name = Main Org.',
+      '__org.id = 1',
+      '__user.id = 1',
+      '__user.login = admin',
+      `Server:raw = A'A"A,BB\\B,CCC`,
+      `Server:regex = (A'A"A|BB\\\\B|CCC)`,
+      `Server:lucene = ("A'A\\"A" OR "BB\\\\B" OR "CCC")`,
+      `Server:glob = {A'A"A,BB\\B,CCC}`,
+      `Server:pipe = A'A"A|BB\\B|CCC`,
+      `Server:distributed = A'A"A,Server=BB\\B,Server=CCC`,
+      `Server:csv = A'A"A,BB\\B,CCC`,
+      `Server:html = A'A"A, BB\\B, CCC`,
+      `Server:json = ["A'A\\"A","BB\\\\B","CCC"]`,
+      `Server:percentencode = %7BA%27A%22A%2CBB%5CB%2CCCC%7D`,
+      `Server:singlequote = 'A\\'A"A','BB\\B','CCC'`,
+      `Server:doublequote = "A'A\\"A","BB\\B","CCC"`,
+      `Server:sqlstring = 'A''A"A','BB\\\B','CCC'`,
+      `Server:date = null`,
+    ];
+
+    e2e()
+      .get('.markdown-html li')
+      .should('have.length', 21)
+      .each(element => {
+        items.push(element.text());
+      })
+      .then(() => {
+        expectedItems.forEach((expected, index) => {
+          expect(items[index]).to.equal(expected);
+        });
+      });
+  },
+});

public/app/features/templating/template_srv.test.ts

@@ -375,6 +375,11 @@ describe('templateSrv', () => {
       const result = _templateSrv.formatValue(['test', "test'value2"], 'sqlstring');
       expect(result).toBe(`'test','test''value2'`);
     });
+
+    it('raw format should leave value intact and do no escaping', () => {
+      const result = _templateSrv.formatValue("'test\n", 'raw');
+      expect(result).toBe("'test\n");
+    });
   });
 
   describe('can check if variable exists', () => {