Custom data attribute not working with Material UI 5 using textfield select prop

Question

Previously I was using Material UI v4 using the Textfield select prop and was able to retrieve my custom data attribute via event.currentTarget.dataset. However, now I'm using Material UI v5 it logs out null in my onchange handler.

Anyone else experienced this? Any help would be much appreciated.

        const handleChange = (e) => {
        /** ID FROM INPUT FIELD */
        console.log(e.currentTarget.dataset); ---> logs out null

        <Grid item>
         <TextField
           select
           name='rpe'
           inputProps={{
            'data-setid': `${localSetId.current}`,
            'data-exerciseid': `${localExerciseId.current}`
           }}
           style={isMatched ? { width: 69 } : { minWidth: 200 }}
           variant='outlined'
           size={isMatched ? 'small' : 'medium'}
           label='rpe'
           onChange={handleChange}
           defaultValue=''
         >
          {rpeList.map((option) => (
            <MenuItem key={option.value} value={option.value}>
              {option.label}
            </MenuItem>
          ))}
       </TextField>
      </Grid>

Answer 1

I don't think the MUI select functionality supports data-attributes, but an alternative solution is to pass an object as a second argument for the handleChange function

const handleChange = (e, dataset) => {
        /** ID FROM INPUT FIELD */
        console.log(e, dataset); // now it will print both event and the new data object
}
        <Grid item>
         <TextField
           select
           name='rpe'
           style={isMatched ? { width: 69 } : { minWidth: 200 }}
           variant='outlined'
           size={isMatched ? 'small' : 'medium'}
           label='rpe'
           onChange={(e) => handleChange(e, {setId:1, exerciseId: 2})}
           defaultValue=''
         >
          {rpeList.map((option) => (
            <MenuItem key={option.value} value={option.value}>
              {option.label}
            </MenuItem>
          ))}
       </TextField>
      </Grid>