Unable to Add data-testid Attribute to ReactSelect Component

Unable to Add data-testid Attribute to ReactSelect Component
Hi team,

I'm trying to add the data-testid attribute to the Select component from react-select for testing purposes, but it doesn't seem to be rendered in the DOM.

Here is the code I'm using:

<Select data-testid='dashboard-supplier-widgets-date-filter-select' isMulti={false} required id='dateFilterDropdown' options={WidgetsDateFilterOptions} value={{ value: props.dateFilter, label: WidgetsDateFilterOptions.find((option) => option.value === props.dateFilter)?.label, }} onChange={(selectedOption) => props.onDateFilterChange(selectedOption.value)} placeholder={t('widget_filter_text')} formatOptionLabel={formatWidgetsOptionLabel} isSearchable={false} menuPortalTarget={document.body} menuPlacement='auto' />

Even though the data-testid is passed as a prop, I don't see it applied in the rendered HTML. Is there a recommended way to add custom attributes like data-testid to the Select component?

Any guidance would be greatly appreciated.

Thanks!

Start with the Select component and the provided reproduction, then inspect how the data-testid prop is handled versus the rendered DOM. Confirm the supported way to expose this attribute and verify that the expected custom attribute appears in the rendered HTML.