Tengo el cuadro de selección de reacción de MUI como se muestra a continuación.
<MenuItem key={`${option.label}-${option.value}-${i}`} value={option.value}> {option.labelName}{option.labelDescription} </MenuItem>que he actualizado como se muestra a continuación para agregar una clase para el estilo CSS
<MenuItem key={`${option.label}-${option.value}-${i}`} value={option.value}> <span className={`${classes.name}`} data-testid="select-name">{option.labelName}</span> <span className={`${classes.description}`} data-testid="description">{option.labelDescription}</span> </MenuItem> Tengo los casos de prueba de unidad que fallan después de agregar el span
const nameOption = await findByText("John"); expect(nameOption).toBeInTheDocument(); await act(async () => { fireEvent.click(nameOption); }); expect(nameOption).toHaveAttribute("aria-selected", "true"); Recibo el siguiente error después de agregar el span
'Expected the element to have attribute: aria-selected="true" Received:null'¿Alguien puede ayudarme a solucionar este problema?