MDL-70846 accessibility: update tree attributes to pass a11y check

- Move aria-* atrributes from <p> to <li>
- Move "role" attribute from <p> to <li>
- Update behat tests

Based on reference implementation from:
- https://www.w3.org/TR/wai-aria-practices-1.1/examples/treeview/treeview-2/treeview-2a.html
- https://www.w3.org/WAI/GL/wiki/Using_ARIA_trees
This commit is contained in:
Dongsheng Cai 2021-05-25 20:38:51 +10:00
parent 30b8ad51f4
commit e3690a392d
14 changed files with 67 additions and 66 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View file

@ -269,7 +269,8 @@ define(['jquery'], function($) {
var moduleName = item.closest('[data-ajax-loader]').attr('data-ajax-loader');
var thisTree = this;
// Flag this node as loading.
item.addClass('loading');
const p = item.find('p');
p.addClass('loading');
// Require the ajax module (must be AMD) and try to load the items.
require([moduleName], function(loader) {
// All ajax module must implement a "load" method.
@ -280,7 +281,7 @@ define(['jquery'], function($) {
thisTree.initialiseNodes(item);
thisTree.finishExpandingGroup(item);
// Make sure no child elements of the item we just loaded are tabbable.
item.removeClass('loading');
p.removeClass('loading');
promise.resolve();
});
});