Accessibility: "Save and publish" has a drop down that can't be acces…

…sed via keyboard (#5884)

src/Umbraco.Web.UI.Client/src/common/directives/components/buttons/umbbuttongroup.directive.js

@@ -127,7 +127,9 @@ Use this directive to render a button with a dropdown of alternative actions.
                 float: "@?",
                 buttonStyle: "@?",
                 size: "@?",
-                icon: "@?"
+                icon: "@?",
+                label: "@?",
+                labelKey: "@?"
             },
             link: link
         };

src/Umbraco.Web.UI.Client/src/views/components/buttons/umb-button-group.html

@@ -1,5 +1,5 @@
 <div class="btn-group umb-button-group" ng-class="{'dropup': direction === 'up'}">
-    
+
    <umb-button
       ng-if="defaultButton"
       alias="{{defaultButton.alias ? defaultButton.alias : 'groupPrimary' }}"
@@ -16,21 +16,32 @@
       add-ellipsis={{defaultButton.addEllipsis}}>
    </umb-button>
 
-   <a data-element="button-group-toggle"
-      href="#"
+   <button data-element="button-group-toggle"
+      type="button"
       prevent-default
-      class="btn btn-{{buttonStyle}} dropdown-toggle umb-button-group__toggle umb-button--{{size}}" 
+      class="btn btn-{{buttonStyle}} dropdown-toggle umb-button-group__toggle umb-button--{{size}}"
       ng-if="subButtons.length > 0"
-      ng-click="toggleDropdown()">
-      <span class="caret"></span>
-   </a>
+      ng-click="toggleDropdown()"
+      aria-haspopup="true"
+      aria-expanded="{{dropdown.isOpen}}">
+         <span class="caret">
+            <span class="sr-only">
+               <localize key="{{labelKey}}">{{label}}</localize>
+            </span>
+         </span>
+   </button>
 
    <umb-dropdown ng-show="subButtons.length > 0 && dropdown.isOpen" class="umb-button-group__sub-buttons" on-close="closeDropdown()" ng-class="{'-align-right': float === 'right'}">
       <umb-dropdown-item ng-repeat="subButton in subButtons">
-         <a data-element="{{subButton.alias ? 'button-' + subButton.alias : 'button-group-secondary-' + $index }}" href="#" ng-click="executeMenuItem(subButton)" hotkey="{{subButton.hotKey}}" hotkey-when-hidden="{{subButton.hotKeyWhenHidden}}" prevent-default>
-            <localize key="{{subButton.labelKey}}">{{subButton.labelKey}}</localize>
-            <span ng-if="subButton.addEllipsis === 'true'">...</span>
-         </a>
+         <button
+            data-element="{{subButton.alias ? 'button-' + subButton.alias : 'button-group-secondary-' + $index }}"
+            type="button" ng-click="executeMenuItem(subButton)"
+            hotkey="{{subButton.hotKey}}"
+            hotkey-when-hidden="{{subButton.hotKeyWhenHidden}}"
+            prevent-default>
+               <localize key="{{subButton.labelKey}}">{{subButton.labelKey}}</localize>
+               <span ng-if="subButton.addEllipsis === 'true'" aria-hidden="true">...</span>
+         </button>
       </umb-dropdown-item>
    </umb-dropdown>
 

src/Umbraco.Web.UI.Client/src/views/components/content/edit.html

@@ -68,7 +68,9 @@
                         sub-buttons="subButtons"
                         state="page.buttonGroupState"
                         direction="up"
-                        float="right">
+                        float="right"
+                        label-key="buttons_morePublishingOptions"
+                        label="More publishing options">
                     </umb-button-group>
 
                     <umb-button

src/Umbraco.Web.UI.Client/src/views/components/umb-dropdown-item.html

@@ -1 +1 @@
-<li ng-transclude></li>
+<li role="menuitem" ng-transclude></li>

src/Umbraco.Web.UI.Client/src/views/components/umb-dropdown.html

@@ -1 +1 @@
-<ul class="dropdown-menu" on-outside-click="close()" ng-transclude></ul>
+<ul class="dropdown-menu" role="menu" on-outside-click="close()" ng-transclude></ul>

src/Umbraco.Web.UI/Umbraco/config/lang/da.xml

@@ -146,6 +146,7 @@
     <key alias="deleteTag">Slet tag</key>
     <key alias="confirmActionCancel">Fortryd</key>
     <key alias="confirmActionConfirm">Bekræft</key>
+	<key alias="morePublishingOptions">Flere publiseringsmuligheder</key>
   </area>
   <area alias="auditTrails">
     <key alias="atViewingFor">For</key>

src/Umbraco.Web.UI/Umbraco/config/lang/en.xml

@@ -150,6 +150,7 @@
     <key alias="deleteTag">Delete tag</key>
     <key alias="confirmActionCancel">Cancel</key>
     <key alias="confirmActionConfirm">Confirm</key>
+	<key alias="morePublishingOptions">More publishing options</key>
   </area>
   <area alias="auditTrails">
     <key alias="atViewingFor">Viewing for</key>

src/Umbraco.Web.UI/Umbraco/config/lang/en_us.xml

@@ -150,6 +150,7 @@
     <key alias="deleteTag">Delete tag</key>
     <key alias="confirmActionCancel">Cancel</key>
     <key alias="confirmActionConfirm">Confirm</key>
+	<key alias="morePublishingOptions">More publishing options</key>
   </area>
   <area alias="auditTrails">
     <key alias="atViewingFor">Viewing for</key>