Accessibility/WebAccessibilityAPI: Difference between revisions

   readonly attribute AccesibleElement? lastSibling;

The accessible element can be requested from a DOM node if the DOM node is accessible, i.e. it expresses semantics meaningful to the assistive technology.

   A11eElement? a11ement; // nicer and shorter verison?

::Returns accessible role as string. Examples: "button", "menu", "textfield".

::Returns a [[#States|StateSet]] live object for all accessible states on the accessible element.

The accessible states on the accessible element are presented by <code>StateSet</code> object. It is a live object, i.e. if the states on the accessible element are changed then the object reflects that. Implementation is not required to compute any state until requested.

::Return true if any of the given states is presented on the accessible element.

::Return true if all given states are presented on the accessible element.

Example of a script announcing states on the accessible element.

var accElm = document.getElementById("foo").accessibleElement;

   say(state);

The accessible element may support a number of attributes to express the semantics that cannot be described by base properties of accessible element.

::Returns a [[#AttributeMap|AttributeMap]] live object for all object attributes exposed on the accessible element. If attributes on the accessible element are changed then the object reflects the actual state of attributes. The implementation is not required to precompute any of the attributes.

   boolean hasAnyOf(Object map);

   boolean hasAllOf(Object map);

::Return true if any of the given object property and its non null value matches a { name, value } pair from the map. If a null value property value matches a map name then value is ignored and is not part of the match.

Set of exposed attributes depends on semantics of the element. As example typical attributes are:

A pattern is a collection of attributes or methods expressing the accessible element semantics other than AccessibleElement interface provides. The patterns concept is quite similar to attributes but tends to be more powerful. Basically it's alternative implementation of queryInterface.

::Returns an object for the pattern of given type if supported by the accessible element.

::Returns related accessible element of the given relation type. If related accessible is not sole then the first one is returned.

::Returns the map of related accessible elements and relation types.

This is a typical list of relation types that may be exposed by the accessible element. Note, the accessible element may support custom relations as well.

Announcement of all headers of the grid cell and name of the grid itself.

   for (let header of headers)

     say(header.role +", " + header.name);

   say(grid.name);

The accessible element may support actions that can be invoked on it. For example, <code>jump</code> on a link or <code>press</code> on a button, or it can be generic propose actions like <code>scroll</code> or <code>focus</code>. Certain accessible actions may take extra parameters.

::Exposed on accessible elements that may be activated. Accessible elements may use other names for this action to emphasise the semantics they expose. For example, ''jump'' on links, ''press'' on buttons, ''check'' and ''uncheck'' on checkboxes. Accessible element may provide more than one activation actions. For example, tree item can provide ''select''/''unselect'' as its primary action and ''expand''/''collapse'' as secondary. Tree column may implement ''sort'' action.

::Focus the accessible element. May be different from "activate" action, for example, in case of buttons where "activate" means press.

::Scrolls the accessible element into view, optionally takes coordinates relative the element to scroll the view to

::Used to start dragging and dropping the content related to the accessible element the action is invoked for.

<code>ScrollDelta</code> structure describes a scroll change within the accessible element, the scroll change can expressed in different units, for example, it can be in pixels or in pages. The accessible element may provide its custom set of supported modes which has to be described in [[#Taxonomy|taxonomy]].

A widget may support actions that can be invoked through variety of devices or by AT like screen readers. The way the action is triggered by the user is described by interaction. Examples of user interactions are <code>swipe</code>, a mouse gesture to toggle a switch control; <code>space</code>, a key to toggle a checkbox. Access keys (<code>alt+letter</code>) and keyboard shortcuts (<code>ctrl+shift+letter</code>) used to activate the widgets are also examples of interactions. Complex widgets like grid control may support several actions, for example <code>ctrl+A</code> for <code>selectall</code> action, <code>ArrowDown/ArrowUp</code> keys for <code>movedown/moveup</code> actions, <code>ArrowRight/ArrowLeft</code> keys for <code>movenext/moveprev</code> actions.

::Return an ''InteractionSet'' object describing all interactions that can be performed on the accessible element.

::Return true if all given interaction are in use by the widget.

::Return a list of all interactions on the accessible element as ''InteractionSet'' used to invoke the given action on the given device.

                             set.forEach(item => say(interaction.description));

The accessible element can be created for different kinds of sources. Most of the accessible elements are created for a DOM element to expose its semantics to the assistive technology. In some cases the browser may not have underlying DOM node for the content. In this case the accessible object having no associated DOM node is created. In some cases the web author may need to change the semantics for existing element or add new semantics or even may need a whole new accessible subtree to make the content accessible. In this case the author needs to describe desired semantics in JavaScript. See [[#JSSource|Making the content accessible in JavaScript]] for details.

::Returns the DOM node associated with the accessible element if any. The accessible element does not have a DOM node, either when it has been unattached from the DOM node or it's not DOM node based. The first case happens when the JavaScript holds reference to the object longer than the object life cycle. The second case happens because of browser-specific implementation or in JavaScript created trees.

::Returns [[#AccessibleSource|AccessibleSource]] associated with the accessible element if any. Also used to provide an accessible source to override accessible properties of the element.