Merge pull request sagalbot#607 from beattyml1/master

sagalbot · web-flow · commit af4e55cc9324 · 2018-08-02T21:20:47.000-07:00
Added combobox, listbox, and option roles, Closes sagalbot#606
diff --git a/src/components/Select.vue b/src/components/Select.vue
@@ -355,6 +355,8 @@
               :tabindex="tabindex"
               :readonly="!searchable"
               :id="inputId"
+              role="combobox"
+              :aria-expanded="dropdownOpen"
               aria-label="Search for option"
       >
 
@@ -377,8 +379,8 @@
     </div>
 
     <transition :name="transition">
-      <ul ref="dropdownMenu" v-if="dropdownOpen" class="dropdown-menu" :style="{ 'max-height': maxHeight }">
-        <li v-for="(option, index) in filteredOptions" v-bind:key="index" :class="{ active: isOptionSelected(option), highlight: index === typeAheadPointer }" @mouseover="typeAheadPointer = index">
+      <ul ref="dropdownMenu" v-if="dropdownOpen" class="dropdown-menu" :style="{ 'max-height': maxHeight }" role="listbox">
+        <li role="option" v-for="(option, index) in filteredOptions" v-bind:key="index" :class="{ active: isOptionSelected(option), highlight: index === typeAheadPointer }" @mouseover="typeAheadPointer = index">
           <a @mousedown.prevent="select(option)">
           <slot name="option" v-bind="(typeof option === 'object')?option:{[label]: option}">
             {{ getOptionLabel(option) }}
