fritz2 icon indicating copy to clipboard operation
fritz2 copied to clipboard

Rethink Default ARIA Roles for Headless DataCollection

Open Lysander opened this issue 1 year ago • 0 comments

Currently some default ARIA-Roles are set inside the headless datatable bricks:

  • dataCollectionItems -> list
  • dataCollectionItem -> listitem

This design has different problems: The ARIA Role for the main collection type might be suited at the wrong DOM-level: If you want to create some Datatable alike component, dataCollectionItems is located beneath some potential table-Tag. But the latter defines implicitly the ARIA role. In order to achieve this, you are forced to write some "reset" alike statement:

// inside some render-Code:
dataCollection(
        tag = RenderContext::table // this already defines the `table` role!
    ) {
    dataCollectionItems(...) {
        attr("role", "")  // reset default headless role one level beneath and without any obvious relation to the tag above!
        items.renderEach(...) { item ->
            dataCollectionItem(item, tag = RenderContext::tr) {
                attr("role", "") // same again, besides this is the correct DOM level
            }
    }
}

This arises the fundamental questions:

  • Should we drop default ARIA-roles for this component?
  • Should we find a better way to support the two main collection types ( list and table) in a better way?

Lysander avatar Dec 12 '23 09:12 Lysander