From c052abed8728fe8187bba50e2f285e8c368d4aa0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Hugo=20H=C3=A4ggmark?= <hugo.haggmark@grafana.com>
Date: Fri, 9 Oct 2020 06:31:45 +0200
Subject: [PATCH] Variables: hides dropdown before refreshing starts (#28112)

---
 .../variables/pickers/OptionsPicker/actions.test.ts  | 12 ++++++------
 .../variables/pickers/OptionsPicker/actions.ts       |  5 +++--
 2 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/public/app/features/variables/pickers/OptionsPicker/actions.test.ts b/public/app/features/variables/pickers/OptionsPicker/actions.test.ts
index 6172b34174e..70b27d870fc 100644
--- a/public/app/features/variables/pickers/OptionsPicker/actions.test.ts
+++ b/public/app/features/variables/pickers/OptionsPicker/actions.test.ts
@@ -192,9 +192,9 @@ describe('options picker actions', () => {
         toggleOption({ option: options[1], forceSelect: true, clearOthers }),
         setCurrentVariableValue(toVariablePayload(variable, { option })),
         changeVariableProp(toVariablePayload(variable, { propName: 'queryValue', propValue: '' })),
+        hideOptions(),
         setCurrentVariableValue(toVariablePayload(variable, { option })),
-        updateLocation({ query: { 'var-Constant': ['B'] } }),
-        hideOptions()
+        updateLocation({ query: { 'var-Constant': ['B'] } })
       );
     });
   });
@@ -265,9 +265,9 @@ describe('options picker actions', () => {
       tester.thenDispatchedActionsShouldEqual(
         setCurrentVariableValue(toVariablePayload(variable, { option })),
         changeVariableProp(toVariablePayload(variable, { propName: 'queryValue', propValue: '' })),
+        hideOptions(),
         setCurrentVariableValue(toVariablePayload(variable, { option })),
-        updateLocation({ query: { 'var-Constant': [] } }),
-        hideOptions()
+        updateLocation({ query: { 'var-Constant': [] } })
       );
     });
   });
@@ -297,9 +297,9 @@ describe('options picker actions', () => {
       tester.thenDispatchedActionsShouldEqual(
         setCurrentVariableValue(toVariablePayload(variable, { option })),
         changeVariableProp(toVariablePayload(variable, { propName: 'queryValue', propValue: 'C' })),
+        hideOptions(),
         setCurrentVariableValue(toVariablePayload(variable, { option })),
-        updateLocation({ query: { 'var-Constant': [] } }),
-        hideOptions()
+        updateLocation({ query: { 'var-Constant': [] } })
       );
     });
   });
diff --git a/public/app/features/variables/pickers/OptionsPicker/actions.ts b/public/app/features/variables/pickers/OptionsPicker/actions.ts
index 657e1fd6081..e10f9c79331 100644
--- a/public/app/features/variables/pickers/OptionsPicker/actions.ts
+++ b/public/app/features/variables/pickers/OptionsPicker/actions.ts
@@ -82,14 +82,15 @@ export const commitChangesToVariable = (): ThunkResult<void> => {
     dispatch(setCurrentVariableValue(toVariablePayload(existing, currentPayload)));
     dispatch(changeVariableProp(toVariablePayload(existing, searchQueryPayload)));
     const updated = getVariable<VariableWithMultiSupport>(picker.id, getState());
+    dispatch(hideOptions());
 
     if (getCurrentText(existing) === getCurrentText(updated)) {
-      return dispatch(hideOptions());
+      return;
     }
 
     const adapter = variableAdapters.get(updated.type);
     await adapter.setValue(updated, updated.current, true);
-    return dispatch(hideOptions());
+    return;
   };
 };