MemberJunction / MemberJunction/MJ
Adopt the mj-dropdown accessible-name inputs across the ~94 call sites (no screen improved when #3860's API landed)
- Dominant language
- TSQL
- Stars
- 29
- Forks
- 6
- Avg merge
- 2d 1h
- Merged PRs (30d)
- 323
Description
Follow-up from #3863, which added `AriaLabel` / `AriaLabelledBy` / `AriaDescribedBy` / `InputId` to `mj-dropdown`.
**None of the ~94 `` element that cannot name a `div[role=combobox]`. `[AriaLabel]="field.label"` is a one-liner.
## Worked example for the sweep — and a hazard to avoid
`create-prompt-dialog.component.html` (lines 47, 71, 86) already pairs `` with `id="x"` on the `mj-dropdown` **host element**. That association is dead today.
Pattern-matched adoption here goes wrong in a specific way: adding `InputId="x"` *without removing the host id* creates duplicate ids and still produces no name, because `label[for]` cannot name a div. The correct migration is:
- move the id onto the **label** element,
- pass it as `AriaLabelledBy`,
- drop the id from the `mj-dropdown` host.
Worth doing these three first as the reference example.
## Preference
`AriaLabelledBy` wherever a visible label exists — roughly 52 of the ~94 sites — so the accessible name cannot drift from the visible text on rename. `AriaLabel` only where nothing is on screen.
Contributor guide
Research direction
Start with packages/Angular/Generic/ui-components/src/lib/filter-panel/filter-panel.component.ts:86 and the three create-prompt-dialog.component.html dropdowns at lines 47, 71, and 86. Use those as the reference migration, then inspect the remaining roughly 94 mj-dropdown call sites. Done means visible labels use AriaLabelledBy, unlabeled controls use AriaLabel, and host ids are not duplicated.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- angular, typescript
- Domain
- accessibility, frontend
- Issue type
- Feature
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Active
- Clarity
- Clearly specified
- Newbie friendliness
- 65/100