MAGETWO-34477: Backend Menu Accessibility improvements

Author: Dmytro Poperechnyy

app/code/Magento/Backend/Block/Menu.php

@@ -210,16 +210,24 @@ protected function _renderItemCssClass($menuItem, $level)
      */
     protected function _renderAnchor($menuItem, $level)
     {
-        return '<a href="' . $menuItem->getUrl() . '" ' . $this->_renderItemAnchorTitle(
-            $menuItem
-        ) . $this->_renderItemOnclickFunction(
-            $menuItem
-        ) . ' class="' . $this->_renderAnchorCssClass(
-            $menuItem,
-            $level
-        ) . '">' . '<span>' . $this->_getAnchorLabel(
-            $menuItem
-        ) . '</span>' . '</a>';
+        if ($level == 1 && $menuItem->getUrl() == '#') {
+            $output = '<strong class="submenu-group-title" role="presentation">'
+                . '<span>' . $this->_getAnchorLabel($menuItem) . '</span>'
+                . '</strong>';
+        } else {
+            $output = '<a href="' . $menuItem->getUrl() . '" ' . $this->_renderItemAnchorTitle(
+                $menuItem
+            ) . $this->_renderItemOnclickFunction(
+                $menuItem
+            ) . ' class="' . $this->_renderAnchorCssClass(
+                $menuItem,
+                $level
+            ) . '">' . '<span>' . $this->_getAnchorLabel(
+                $menuItem
+            ) . '</span>' . '</a>';
+        }
+
+        return $output;
     }
 
     /**
@@ -397,15 +405,16 @@ protected function _columnBrake($items, $limit)
      * @param \Magento\Backend\Model\Menu\Item $menuItem
      * @param int $level
      * @param int $limit
+     * @param $id int
      * @return string HTML code
      */
-    protected function _addSubMenu($menuItem, $level, $limit)
+    protected function _addSubMenu($menuItem, $level, $limit, $id = null)
     {
         $output = '';
         if (!$menuItem->hasChildren()) {
             return $output;
         }
-        $output .= '<div class="submenu">';
+        $output .= '<div class="submenu"' . ($level == 0 && isset($id) ? ' aria-labelledby="' . $id . '"' : '') . '>';
         $colStops = null;
         if ($level == 0 && $limit) {
             $colStops = $this->_columnBrake($menuItem->getChildren(), $limit);
@@ -440,18 +449,22 @@ public function renderNavigation($menu, $level = 0, $limit = 0, $colBrakes = [])
                 $output .= '</ul></li><li class="column"><ul>';
             }
 
+            $id = uniqid();
             $output .= '<li ' . $this->getUiId(
                 $menuItem->getId()
             ) . ' class="item-' . $itemClass . ' ' . $this->_renderItemCssClass(
                 $menuItem,
                 $level
-            ) . '">' . $this->_renderAnchor(
+            ) . ($level == 0 ? '" id="' . $id . '" aria-haspopup="true' : '')
+                . '">'
+                . $this->_renderAnchor(
                 $menuItem,
                 $level
             ) . $this->_addSubMenu(
                 $menuItem,
                 $level,
-                $limit
+                $limit,
+                $id
             ) . '</li>';
             $itemPosition++;
         }