Addepar / Addepar/ember-table

Set aria-* attributes to help screen readers when using occlusion

Open
#882 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
JavaScript
Stars
1.7k
Forks
351
Avg merge
1d 22h
Merged PRs (30d)
1

Description

When ember-table occludes table rows, screen readers can have difficulty understanding the table since all the rows are not present in the DOM.

We can help them out by providing a few aria attributes:

  • Adding aria-rowcount to the <table> element
  • Adding aria-rowindex to each <tr>

This helps the screenreader understand the total row count and which rows are currently visible.

There's some info about this in https://sarahmhigley.com/writing/grids-part2/#lazy-loading-rows-or-columns


The vertical-collection addon used to do the occlusion looks like it provides the item index so I don't think this would be too difficult to add.

I started to implement a WIP of this but then I realized that I'm not sure how this needs to work to support the tree features So I need to look a little bit more into that.

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reviewing ember-table's occlusion behavior and the linked tree features documentation, then inspect how the vertical-collection addon exposes item indexes. Confirm how row indexes should work for both regular and tree rows. Done means the table exposes the total row count and each rendered row exposes its correct index without breaking tree behavior.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
accessibility, frontend
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.