Fix poll interaction

src/components/poll/poll.js

@@ -12,7 +12,8 @@ export default {
   data () {
     return {
       loading: false,
-      choices: []
+      choices: [],
+      randomSeed: `${Math.random()}`.replace('.', '-')
     }
   },
   created () {

src/components/poll/poll.vue

@@ -2,6 +2,9 @@
   <div
     class="poll"
     :class="containerClass"
+  >
+    <div
+      :role="showResults ? 'section' : (poll.multiple ? 'group' : 'radiogroup')"
     >
       <div
         v-for="(option, index) in options"
@@ -30,11 +33,16 @@
         </div>
         <div
           v-else
+          tabindex="0"
+          :role="poll.multiple ? 'checkbox' : 'radio'"
+          :aria-labelledby="`option-vote-${randomSeed}-${index}`"
+          :aria-checked="choices[index]"
           @click="activateOption(index)"
         >
           <input
             v-if="poll.multiple"
             type="checkbox"
+            class="poll-checkbox"
             :disabled="loading"
             :value="index"
           >
@@ -46,6 +54,7 @@
           >
           <label class="option-vote">
             <RichContent
+              :id="`option-vote-${randomSeed}-${index}`"
               :html="option.title_html"
               :handle-links="false"
               :emoji="emoji"
@@ -53,6 +62,7 @@
           </label>
         </div>
       </div>
+    </div>
     <div class="footer faint">
       <button
         v-if="!showResults"
@@ -161,5 +171,9 @@
     padding: 0 0.5em;
     margin-right: 0.5em;
   }
+
+  .poll-checkbox {
+    display: none;
+  }
 }
 </style>