Esri / calcite-design-system

A monorepo containing the packages for Esri's Calcite Design System
https://developers.arcgis.com/calcite-design-system/
Other
282 stars 76 forks source link

Keyboard navigation issue in calcite-list #7254

Closed nid13240 closed 1 year ago

nid13240 commented 1 year ago

Check existing issues

Actual Behavior

When using custom logic to enable/disable items in the calcite-list, items which were previously disabled and reenabled get skipped during keyboard navigation.

Expected Behavior

I would expect to be able to tab through all the items, even if they were previously disabled and reenabled.

Reproduction Sample

https://codepen.io/nid13240/pen/VwVmzpx

Reproduction Steps

  1. open the codepen above - the logic to enable/disable items is there to mimc some logic we have in the Map Viewer
  2. select the first item in the list with your keyboard (the next 2 items should become disabled)
  3. deselect the first item in the list (those items should become reenabled)
  4. try to tab through the rest of the list
  5. notice the tab skips those 2 items which were previously disabled

Reproduction Version

1.4.3

Relevant Info

No response

Regression?

No response

Priority impact

p3 - want for upcoming milestone

Impact

No response

Calcite package

Esri team

ArcGIS Map Viewer

github-actions[bot] commented 1 year ago

Installed and assigned for verification.

geospatialem commented 1 year ago

It looks like this one is mitigated when using the arrow keys. 👍🏻

However, keyboard a11y is not mitigated with the tab or tab + shift keys for navigating, where list-item slotted actions are still skipped with https://codepen.io/geospatialem/pen/XWyzpXX. @driskull Is the expectation to also account for tab and shift + tab? If not, I can update the doc.

verify-list-keyboard-a11y

driskull commented 1 year ago

@geospatialem this might actually be unrelated. Its something that the interactive helper is doing. Can we get a separate issue for @jcfranco?

The issue is that the tabindex is being set to -1 but not being removed. @jcfranco I don't think the tabindex should be set at all since this component is set to "managed".

geospatialem commented 1 year ago

New issue created via #7335, closing the above out.