JedWatson / JedWatson/react-select

Unable to add data-testid to custom components

Open
#5,753 5 comments 11 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

issue/bug-unconfirmed
Dominant language
TypeScript
Stars
28k
Forks
4.1k
PR merge metrics
No merged PRs in 30d

Description

Hi, I am not able to add data-testid for custom components. I don't really know whether it is a bug or feature suggestion, but I feel like this should work out of the box. It feels really weird that ts is not showing any error, but provided data-testid is just not there after all.

Link to sandbox:
https://codesandbox.io/s/react-select-v5-data-test-id-for-custom-components-4m5dnn?file=/SingleSelect.tsx

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the linked CodeSandbox and its SingleSelect.tsx example to reproduce the missing data-testid on a custom component. Trace how custom component props are passed to the rendered element, then verify completion by confirming that data-testid appears in the resulting markup without TypeScript errors.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend, testing
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.