Merge pull request #12681 from simPod/fix-variable-array-display

Fix array display from url

public/app/features/templating/specs/variable_srv_init.test.ts

@@ -77,8 +77,8 @@ describe('VariableSrv init', function(this: any) {
           {
           {
             name: 'apps',
             name: 'apps',
             type: type,
             type: type,
-            current: { text: 'test', value: 'test' },
-            options: [{ text: 'test', value: 'test' }],
+            current: { text: 'Test', value: 'test' },
+            options: [{ text: 'Test', value: 'test' }],
           },
           },
         ];
         ];
         scenario.urlParams['var-apps'] = 'new';
         scenario.urlParams['var-apps'] = 'new';
@@ -161,11 +161,11 @@ describe('VariableSrv init', function(this: any) {
           name: 'apps',
           name: 'apps',
           type: 'query',
           type: 'query',
           multi: true,
           multi: true,
-          current: { text: 'val1', value: 'val1' },
+          current: { text: 'Val1', value: 'val1' },
           options: [
           options: [
-            { text: 'val1', value: 'val1' },
-            { text: 'val2', value: 'val2' },
-            { text: 'val3', value: 'val3', selected: true },
+            { text: 'Val1', value: 'val1' },
+            { text: 'Val2', value: 'val2' },
+            { text: 'Val3', value: 'val3', selected: true },
           ],
           ],
         },
         },
       ];
       ];
@@ -177,7 +177,7 @@ describe('VariableSrv init', function(this: any) {
       expect(variable.current.value.length).toBe(2);
       expect(variable.current.value.length).toBe(2);
       expect(variable.current.value[0]).toBe('val2');
       expect(variable.current.value[0]).toBe('val2');
       expect(variable.current.value[1]).toBe('val1');
       expect(variable.current.value[1]).toBe('val1');
-      expect(variable.current.text).toBe('val2 + val1');
+      expect(variable.current.text).toBe('Val2 + Val1');
       expect(variable.options[0].selected).toBe(true);
       expect(variable.options[0].selected).toBe(true);
       expect(variable.options[1].selected).toBe(true);
       expect(variable.options[1].selected).toBe(true);
     });
     });
@@ -188,6 +188,30 @@ describe('VariableSrv init', function(this: any) {
     });
     });
   });
   });
 
 
+  describeInitScenario(
+    'when template variable is present in url multiple times and variables have no text',
+    scenario => {
+      scenario.setup(() => {
+        scenario.variables = [
+          {
+            name: 'apps',
+            type: 'query',
+            multi: true,
+          },
+        ];
+        scenario.urlParams['var-apps'] = ['val1', 'val2'];
+      });
+
+      it('should display concatenated values in text', () => {
+        const variable = ctx.variableSrv.variables[0];
+        expect(variable.current.value.length).toBe(2);
+        expect(variable.current.value[0]).toBe('val1');
+        expect(variable.current.value[1]).toBe('val2');
+        expect(variable.current.text).toBe('val1 + val2');
+      });
+    }
+  );
+
   describeInitScenario('when template variable is present in url multiple times using key/values', scenario => {
   describeInitScenario('when template variable is present in url multiple times using key/values', scenario => {
     scenario.setup(() => {
     scenario.setup(() => {
       scenario.variables = [
       scenario.variables = [

public/app/features/templating/variable_srv.ts

@@ -237,8 +237,10 @@ export class VariableSrv {
   setOptionAsCurrent(variable, option) {
   setOptionAsCurrent(variable, option) {
     variable.current = _.cloneDeep(option);
     variable.current = _.cloneDeep(option);
 
 
-    if (_.isArray(variable.current.text)) {
+    if (_.isArray(variable.current.text) && variable.current.text.length > 0) {
       variable.current.text = variable.current.text.join(' + ');
       variable.current.text = variable.current.text.join(' + ');
+    } else if (_.isArray(variable.current.value) && variable.current.value[0] !== '$__all') {
+      variable.current.text = variable.current.value.join(' + ');
     }
     }
 
 
     this.selectOptionsForCurrentValue(variable);
     this.selectOptionsForCurrentValue(variable);