dom-testing-library
dom-testing-library copied to clipboard
Re-export computeAccessibleName and computeAccessibleDescription for UMD uses
Describe the feature you'd like:
I would like it if @testing-library/dom
would re-export the computeAccessibleName
and computeAccessibleDescription
functions from dom-accessibility-api
. At least as part of the dist/dom.umd.js
bundle.
computeAccessibleName
is what findByRole
uses for the name
option. In the UMD bundle dom-accessibility-api
is bundled together with @testing-library/dom
's code, but in a way it cannot be used outside the library.
I was using @testing-library/testcafe
and had a use case where instead of finding an element by it's accessible name I wanted to assert the accessible text of an element.
Unfortunately while investigating I found that:
-
computeAccessibleName
fromdom-accessibility-api
is the function that would match findByRole's behaviour -
@testing-library/testcafe
injects the@testing-library/dom/dist/dom.umd.js
bundle into the client - The
computeAccessibleName
defined indist/dom.umd.js
is not accessible outside of the bundle -
dom-accessibility-api
itself does not export a UMD or any other format that
Suggested implementation:
computeAccessibleName
and computeAccessibleDescription
could be included as part of the dom-testing-library API, perhaps under names like getAccessibleName
and getAccessibleDescription
to match getNodeText
.
Not part of this issue, but perhaps @testing-library/testcafe
could also include a custom selector property for these.
Describe alternatives you've considered:
I considered using dom-accessibility-api
directly. However dom-accessibility-api
does not include a UMD build and TestCafe will not accept any of the formats that dom-accessibility-api
does include in its dist folder.
The only option I seem to have right now would be to build my own UMD bundle of dom-accessibility-api
just to inject a duplicate definition of code that @testing-library/dom
's bundle has already included in the page, but kept hidden.
Teachability, Documentation, Adoption, Migration Strategy:
The functions should be documented on https://testing-library.com/docs/dom-testing-library/api-custom-queries/ along with getNodeText
.
getAccessibilityName
should be documented as returning the same accessibility name that getByRole
's name
option matches, documented on https://testing-library.com/docs/queries/about.
Would be very handy. Just came across this issue after being a similar situation to yours. I want to assert that a collection of buttons and links exactly corresponds to a list of aria-accessible strings, e.g.:
expect(
screen
.getAllByRole(/^button|link$/)
.map(getAccessibleName)
).toEqual([ ... ])
@eps1lon I don't mind doing this but I'd love to hear your take on it.