[JoyUI][Textfield] input components like TextField are missing inputProps prop

[ninoman]

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Summary 💡

Currently there is no way to add a data-testid on the inner input elements for JoyUI input components. in MUi there is a inputProps which you can use, which is missing in JoyUI, I think this is critical to have an ability attach testids to the input elements

Examples 🌈

here are the props for the TextFields, BTW there is no API documentation for JoyUI

https://mui.com/material-ui/api/text-field/#props

Motivation 🔦

No response

[siriwatknp]

Thanks for the feedback. I suggest that you should convert the TextField to:

<FormControl>
  <FormLabel>...</FormLabel>
  <Input />
</FormControl>

We are waiting for the final decision to remove the TextField from Joy UI #34176

[BSoDium]

Hi, I haven't found a way to integrate the inputProps prop in the <Input /> component, am I missing something?

[siriwatknp]

@BSoDium You can do it via the slotProps={{ input: { 'data-testid': '...' } }}. The slotProps also apply to other Joy UI components that contain multiple slots.

<Input slotProps={{
  input: {
    // ...html input props
  }
}} />

https://mui.com/joy-ui/react-input/#inner-html-input

[BSoDium]

Thank you @siriwatknp