diff --git a/packages/mui-material/src/InputBase/InputBase.js b/packages/mui-material/src/InputBase/InputBase.js index 6f948212ec8afc..90d0b3a40851ea 100644 --- a/packages/mui-material/src/InputBase/InputBase.js +++ b/packages/mui-material/src/InputBase/InputBase.js @@ -440,7 +440,8 @@ const InputBase = React.forwardRef(function InputBase(inProps, ref) { if (inputRef.current && event.currentTarget === event.target) { inputRef.current.focus(); } - if (onClick && !fcs.disabled) { + + if (onClick) { onClick(event); } }; diff --git a/packages/mui-material/src/InputBase/InputBase.test.js b/packages/mui-material/src/InputBase/InputBase.test.js index f2433ae573f7af..789df2c66cf233 100644 --- a/packages/mui-material/src/InputBase/InputBase.test.js +++ b/packages/mui-material/src/InputBase/InputBase.test.js @@ -129,6 +129,14 @@ describe('', () => { }); expect(handleFocus.called).to.equal(false); }); + + it('fires the click event when the is disabled', () => { + const handleClick = spy(); + const { getByRole } = render(); + const input = getByRole('textbox'); + fireEvent.click(input); + expect(handleClick.callCount).to.equal(1); + }); }); describe('prop: readonly', () => { diff --git a/packages/mui-material/src/TextField/TextField.d.ts b/packages/mui-material/src/TextField/TextField.d.ts index 468affd862e276..33b83fb1c04450 100644 --- a/packages/mui-material/src/TextField/TextField.d.ts +++ b/packages/mui-material/src/TextField/TextField.d.ts @@ -111,10 +111,6 @@ export interface BaseTextFieldProps name?: string; onBlur?: InputBaseProps['onBlur']; onFocus?: StandardInputProps['onFocus']; - /** - * @ignore - */ - onClick?: InputBaseProps['onClick']; /** * The short hint displayed in the `input` before the user enters a value. */ diff --git a/packages/mui-material/src/TextField/TextField.js b/packages/mui-material/src/TextField/TextField.js index 2448ce22274d89..df210682e3412c 100644 --- a/packages/mui-material/src/TextField/TextField.js +++ b/packages/mui-material/src/TextField/TextField.js @@ -95,7 +95,6 @@ const TextField = React.forwardRef(function TextField(inProps, ref) { name, onBlur, onChange, - onClick, onFocus, placeholder, required = false, @@ -147,15 +146,6 @@ const TextField = React.forwardRef(function TextField(inProps, ref) { InputMore['aria-describedby'] = undefined; } - const handleClick = (event) => { - if (!disabled && onClick) { - // The `onClick` is registered both on the root and the input elements. - // Without stopping the propagation, the event could be triggered twice. - event.stopPropagation(); - onClick(event); - } - }; - const id = useId(idOverride); const helperTextId = helperText && id ? `${id}-helper-text` : undefined; const inputLabelId = label && id ? `${id}-label` : undefined; @@ -179,7 +169,6 @@ const TextField = React.forwardRef(function TextField(inProps, ref) { onBlur={onBlur} onChange={onChange} onFocus={onFocus} - onClick={handleClick} placeholder={placeholder} inputProps={inputProps} {...InputMore} @@ -198,7 +187,6 @@ const TextField = React.forwardRef(function TextField(inProps, ref) { color={color} variant={variant} ownerState={ownerState} - onClick={handleClick} {...other} > {label != null && label !== '' && ( @@ -358,10 +346,6 @@ TextField.propTypes /* remove-proptypes */ = { * You can pull out the new value by accessing `event.target.value` (string). */ onChange: PropTypes.func, - /** - * @ignore - */ - onClick: PropTypes.func, /** * @ignore */ diff --git a/packages/mui-material/src/TextField/TextField.test.js b/packages/mui-material/src/TextField/TextField.test.js index 18b3b0e5d61829..b793e8f0b01f2d 100644 --- a/packages/mui-material/src/TextField/TextField.test.js +++ b/packages/mui-material/src/TextField/TextField.test.js @@ -155,22 +155,6 @@ describe('', () => { }); }); - describe('prop: disabled', () => { - it('should not run click event when disabled', () => { - const handleClick = spy(); - const { getByRole } = render(); - fireEvent.click(getByRole('textbox')); - expect(handleClick.callCount).to.equal(0); - }); - - it('should not run click event when disabled and when onClick prop is set through InputProps', () => { - const handleClick = spy(); - const { getByRole } = render(); - fireEvent.click(getByRole('textbox')); - expect(handleClick.callCount).to.equal(0); - }); - }); - describe('prop: select', () => { it('can render a