Role Attributes

These `div`s have valid `role` attributes

This is a div with the role of heading.

This is a div with the role of region.

This is a div with the role of main.

This is a div with the role of secondary.

This is a div with the role of definition.

This is a div with the role of note.

This is a div with the role of seealso.

Valid roles that the Extension Headings dialog box displays include 'heading', 'region', 'main', 'secondary', 'navigation', 'banner', 'contentinfo', 'definition', 'note', 'seealso', and 'search'.

These `div`s have invalid `role` attributes

invalid `role` types

This is a div with the role of button.

This is a div with the role of description.

none-sensical `role` type

This is a div with the role of desc, which is a nonsense. What will happen?

`wairole` test

This is a p with "wairole:" before the role content of heading.

labelledby test

h3: correct id

divdescription2_title1: no role and correct id

divdescription2_title2: role of heading and correct id

This is a second div with the role of description. This div is labelled by the elements with id of divdescription2_title1 and divdescription2_title2. This div itself and divdescription2_title1 will not be displayed in the Headings dialog box, but the divdescripiton2_title2 should be displayed.

This div is also headed by h3 element above, which has the id of divdescription2_title3, which is included in aria-labelledby content of this div.

Back to index page

Role Attributes

These divs have valid role attributes

These divs have invalid role attributes

invalid role types

none-sensical role type