fix: keep onChange target mounted when value is unchanged

Author: Ed Stead

src/utils/commonUtils.ts

@@ -45,6 +45,16 @@ function cloneEvent<
   return newEvent;
 }
 
+function cloneEventWithTarget<
+  EventType extends React.SyntheticEvent<any, any>,
+  Element extends HTMLInputElement | HTMLTextAreaElement,
+>(event: EventType, target: Element): EventType {
+  return Object.create(event, {
+    target: { value: target },
+    currentTarget: { value: target },
+  });
+}
+
 export function resolveOnChange<
   E extends HTMLInputElement | HTMLTextAreaElement,
 >(
@@ -84,8 +94,13 @@ export function resolveOnChange<
   // https://github.com/ant-design/ant-design/issues/45737
   // https://github.com/ant-design/ant-design/issues/46598
   if (target.type !== 'file' && targetValue !== undefined) {
-    event = cloneEvent(e, target, targetValue);
-    onChange(event as React.ChangeEvent<E>);
+    if (target.value !== targetValue) {
+      event = cloneEvent(e, target, targetValue);
+      onChange(event as React.ChangeEvent<E>);
+      return;
+    }
+
+    onChange(cloneEventWithTarget(e, target) as React.ChangeEvent<E>);
     return;
   }
   onChange(event as React.ChangeEvent<E>);

tests/index.test.tsx

@@ -439,6 +439,19 @@ describe('Input ref', () => {
       expect(spySetSelectionRange).toHaveBeenCalledWith(1, 2);
     });
 
+    it('onChange target should be the mounted input when value is unchanged by formatter', () => {
+      const onChange = jest.fn();
+      const { container } = render(<Input onChange={onChange} />);
+      const inputEl = container.querySelector('input')!;
+
+      fireEvent.change(inputEl, { target: { value: 'test' } });
+
+      const event = onChange.mock.calls[0][0];
+      expect(event.target).toBe(inputEl);
+      expect(event.currentTarget).toBe(inputEl);
+      expect(document.contains(event.target)).toBe(true);
+    });
+
     it('email type not support selection', () => {
       const onChange = jest.fn();
       const { container } = render(<Input type="email" onChange={onChange} />);