Merge branch 'tusooa/react-more-actions-fix' into 'develop'

Accessibility for react & extra buttons

See merge request pleroma/pleroma-fe!1869

(cherry picked from commit 18c0cf1845)

0026b35f Add alt text for react and extra-buttons popup
82063f34 Add aria-controls to extra-buttons trigger
5ff14837 Add changelog

src/components/extra_buttons/extra_buttons.vue

@@ -2,6 +2,7 @@
   <Popover
     class="ExtraButtons"
     trigger="click"
+    :trigger-attrs="triggerAttrs"
     placement="top"
     :offset="{ y: 5 }"
     :bound-to="{ x: 'container' }"
@@ -10,10 +11,15 @@
     @close="onClose"
   >
     <template #content="{close}">
-      <div class="dropdown-menu">
+      <div
+        class="dropdown-menu"
+        role="menu"
+        :id="`popup-menu-${randomSeed}`"
+      >
         <button
           v-if="canMute && !status.thread_muted"
           class="button-default dropdown-item dropdown-item-icon"
+          role="menuitem"
           @click.prevent="muteConversation"
         >
           <FAIcon
@@ -24,6 +30,7 @@
         <button
           v-if="canMute && status.thread_muted"
           class="button-default dropdown-item dropdown-item-icon"
+          role="menuitem"
           @click.prevent="unmuteConversation"
         >
           <FAIcon
@@ -34,6 +41,7 @@
         <button
           v-if="!status.pinned && canPin"
           class="button-default dropdown-item dropdown-item-icon"
+          role="menuitem"
           @click.prevent="pinStatus"
           @click="close"
         >
@@ -45,6 +53,7 @@
         <button
           v-if="status.pinned && canPin"
           class="button-default dropdown-item dropdown-item-icon"
+          role="menuitem"
           @click.prevent="unpinStatus"
           @click="close"
         >
@@ -57,6 +66,7 @@
           <button
             v-if="!status.bookmarked"
             class="button-default dropdown-item dropdown-item-icon"
+            role="menuitem"
             @click.prevent="bookmarkStatus"
             @click="close"
           >
@@ -68,6 +78,7 @@
           <button
             v-if="status.bookmarked"
             class="button-default dropdown-item dropdown-item-icon"
+            role="menuitem"
             @click.prevent="unbookmarkStatus"
             @click="close"
           >
@@ -80,6 +91,7 @@
         <button
           v-if="ownStatus && editingAvailable"
           class="button-default dropdown-item dropdown-item-icon"
+          role="menuitem"
           @click.prevent="editStatus"
           @click="close"
         >
@@ -91,6 +103,7 @@
         <button
           v-if="isEdited && editingAvailable"
           class="button-default dropdown-item dropdown-item-icon"
+          role="menuitem"
           @click.prevent="showStatusHistory"
           @click="close"
         >
@@ -102,6 +115,7 @@
         <button
           v-if="canDelete"
           class="button-default dropdown-item dropdown-item-icon"
+          role="menuitem"
           @click.prevent="deleteStatus"
           @click="close"
         >
@@ -112,6 +126,7 @@
         </button>
         <button
           class="button-default dropdown-item dropdown-item-icon"
+          role="menuitem"
           @click.prevent="copyLink"
           @click="close"
         >
@@ -123,6 +138,7 @@
         <a
           v-if="!status.is_local"
           class="button-default dropdown-item dropdown-item-icon"
+          role="menuitem"
           title="Source"
           :href="status.external_url"
           target="_blank"
@@ -134,6 +150,7 @@
         </a>
         <button
           class="button-default dropdown-item dropdown-item-icon"
+          role="menuitem"
           @click.prevent="reportStatus"
           @click="close"
         >