Internal issue 3075 - IC Dialog focusing issue
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 53
- Forks
- 63
- Avg merge
- 2d 4h
- Merged PRs (30d)
- 15
Description
We place a custom web-component within the content-area of the ic-dialog. The means we have nested shadow doms unfortunately. Due to the way that the [getInteractiveElements|https://github.com/mi6/ic-ui-kit/blob/%40ukic/web-components%402.38.1/packages/web-components/src/components/ic-dialog/ic-dialog.tsx#L435] call works, the list of interactive elements that is tracked for tabbing through the dialog does not get visibility of any elements within these shadow doms thereby breaking our tab ordering. The elements simply cannot be navigated to. [Here is a stackblitz that highlights this issue|https://stackblitz.com/edit/knmmca7s?file=index.html]. Any help much appreciated.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with getInteractiveElements in packages/web-components/src/components/ic-dialog/ic-dialog.tsx around line 435, then reproduce the nested shadow DOM case using the linked StackBlitz. The issue is done when interactive elements inside nested shadow DOMs can be reached in the dialog's tab order.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- accessibility, frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100