updates for the suggestion (npm#297)

makhmudjon-inadullaev · Makhmudjon Inadullaev · web-flow · commit efc48c543191 · 2022-11-01T11:47:04.000+05:00
Co-authored-by: Makhmudjon Inadullaev &lt;makhmudjon@Makhmudjons-MacBook-Pro-2.local&gt;
diff --git a/theme/src/components/variant-select.js b/theme/src/components/variant-select.js
@@ -42,7 +42,7 @@ function VariantSelect(props) {
   const variantPages = NavHierarchy.getVariantsForPage(props.root, vp.page);
   const items = [];
   let selectedItem = variantPages[0];
-
+  
   if (variantPages.length === 0) {
       return null;
   }
@@ -73,6 +73,7 @@ function VariantSelect(props) {
       }
       items.push(
         <a
+          id={match.variant.shortName}
           style={{ textDecoration: 'none' }}
           tabIndex={0}
           key={match.variant.title}
@@ -99,8 +100,9 @@ function VariantSelect(props) {
   }
 
   return (
-    <div ref={wrapper}>
-      <Dropdown onKeyDown={onDropDownKeyDown} overlay={props.overlay}>
+    <div style={{ display: 'flex', flexDirection: 'column' }} ref={wrapper}>
+      <label id="label-versions-list-item" htmlFor='variant-select'>Select CLI Version:</label>
+      <Dropdown id="versions-list-item" aria-labelledby={selectedItem?.variant?.shortName} onKeyDown={onDropDownKeyDown} overlay={props.overlay}>
           <VariantSelect.Button aria-label='Version release'>{selectedItem.variant.title}</VariantSelect.Button>
           <VariantSelect.Menu direction={props.direction} width={props.menuWidth}>
               {items}
