Re-export computeAccessibleName and computeAccessibleDescription for UMD uses

[dantman]

trafficstars

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 from dom-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 in dist/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.

[zinckiwi]

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([ ... ])

[MatanBobi]

@eps1lon I don't mind doing this but I'd love to hear your take on it.