From a18e88daa2928525ef0c83a1e80cfe99ff97ede0 Mon Sep 17 00:00:00 2001
From: Rafael Wendel <rafawendel2010@gmail.com>
Date: Mon, 1 Feb 2021 18:51:03 -0300
Subject: [PATCH] Improved aria labels in query control dropdown

---
 .../EditVisualizationButton/QueryControlDropdown.jsx      | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/client/app/components/EditVisualizationButton/QueryControlDropdown.jsx b/client/app/components/EditVisualizationButton/QueryControlDropdown.jsx
index 813a922e8..563c08e74 100644
--- a/client/app/components/EditVisualizationButton/QueryControlDropdown.jsx
+++ b/client/app/components/EditVisualizationButton/QueryControlDropdown.jsx
@@ -41,6 +41,8 @@ export default function QueryControlDropdown(props) {
       <Menu.Item>
         <QueryResultsLink
           fileType="csv"
+          role="menuitem"
+          tabIndex={0}
           disabled={props.queryExecuting || !props.queryResult.getData || !props.queryResult.getData()}
           query={props.query}
           queryResult={props.queryResult}
@@ -52,6 +54,8 @@ export default function QueryControlDropdown(props) {
       <Menu.Item>
         <QueryResultsLink
           fileType="tsv"
+          role="menuitem"
+          tabIndex={0}
           disabled={props.queryExecuting || !props.queryResult.getData || !props.queryResult.getData()}
           query={props.query}
           queryResult={props.queryResult}
@@ -63,6 +67,8 @@ export default function QueryControlDropdown(props) {
       <Menu.Item>
         <QueryResultsLink
           fileType="xlsx"
+          role="menuitem"
+          tabIndex={0}
           disabled={props.queryExecuting || !props.queryResult.getData || !props.queryResult.getData()}
           query={props.query}
           queryResult={props.queryResult}
@@ -75,7 +81,7 @@ export default function QueryControlDropdown(props) {
   );
 
   return (
-    <Dropdown trigger={["click"]} overlay={menu} overlayClassName="query-control-dropdown-overlay">
+    <Dropdown trigger={["click"]} overlay={menu} role="menu" overlayClassName="query-control-dropdown-overlay">
       <Button data-test="QueryControlDropdownButton">
         <EllipsisOutlinedIcon rotate={90} />
       </Button>