Some way to find an element labelled by another
- Dominant language
- Elm
- Stars
- 68
- Forks
- 15
- PR merge metrics
- No merged PRs in 30d
Description
Split from https://github.com/eeue56/elm-html-test/issues/32 by request.
some way to find the input that's associated with a label that matched another selector. In this example, find the `input` associated with the "A" label, and not the other `input` (this should also work in cases where the input and the label aren't siblings):
```elm
div []
[ label [ for "input-1" ] [ text "A" ]
, label [ for "input-2" ] [ text "B" ]
, input [ id "input-1" ] []
, input [ id "input-2" ] []
]
```
Possible low-level API: (See also https://github.com/eeue56/elm-html-test/issues/51)
```elm
dom
|> Query.find [ tag "label", text "A" ]
|> Query.getAttribute "for"
|> (\labelFor -> Query.find [ tag "input", id labelFor ] dom)
```
(I guess Query.getAttribute would probably have to return `Result _ String` or even `Result _ (Maybe String)` instead of `String`.)
Possible high-level API:
```elm
Query.find
[ tag "input"
, labelledBy [ tag "label", text "A" ]
]
```
Note that the solution should be usable both for the `for` attribute in `label` elements, and for [`aria-labelledby` attribute](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby_attribute) on all elements.
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.