search

testing-library / dom-testing-library

🐙 Simple and complete DOM testing utilities that encourage good testing practices.
https://testing-library.com/dom
MIT License
3.25k stars 460 forks source link

Queries having multiple types #1305

Open JohnMarsden24 opened 2 months ago

JohnMarsden24 commented 2 months ago

Describe the feature you'd like:

Happy to have a go at this!

When looking into this issue I opened with the React testing library I took a peek at the source code here to see if it could be fixed here. I noticed that some of the queries have the wrong types locally but are fine when published. For example in the below screenshot the queryByRole has three possible types, which include those of queryAllByRole and findByRole, which are the wrong types:

VSCode screenshot of queries with wrong types

It looks like the type is only correct in the published packaged because the return type is explicitly defined here. I then found this todo (from 3 years ago!) when looking for the function implementation.

Suggested implementation:

Unsure yet, maybe adding an explicit return tuple type to buildQueries? I don't know the knock on effect this would have but it seems like a quick fix, screenshots below (only did return types for queryByRole and findByRole for brevity):

VSCode screenshot of explicit return tuple types VSCode screenshot of using return types

However I think the problem is bigger as the function implementation type deviates from the published type and could lead to unexpected behaviour. IMHO it would be better for the function implementation to create the type, not overwrite it.

Describe alternatives you've considered:

Open to suggestions

Teachability, Documentation, Adoption, Migration Strategy:

Would improve DX for maintainers and contributors.

github-actions[bot] commented 2 months ago

Uh oh! @JohnMarsden24, the image you shared is missing helpful alt text. Check your issue body.

Alt text is an invisible description that helps screen readers describe images to blind or low-vision users. If you are using markdown to display images, add your alt text inside the brackets of the markdown image.

Learn more about alt text at Basic writing and formatting syntax: images on GitHub Docs.