Added tests for reset form action when default action is prevented

Author: Biki-das

packages/react-dom/src/__tests__/ReactDOMEventListener-test.js

@@ -16,11 +16,25 @@ describe('ReactDOMEventListener', () => {
   let ReactDOMServer;
   let act;
   let simulateEventDispatch;
+  let setUntrackedValue;
+  let setUntrackedChecked;
+
+  function dispatchEventOnNode(node, type) {
+    node.dispatchEvent(new Event(type, {bubbles: true, cancelable: true}));
+  }
 
   beforeEach(() => {
     jest.resetModules();
     React = require('react');
     ReactDOM = require('react-dom');
+    setUntrackedValue = Object.getOwnPropertyDescriptor(
+      HTMLInputElement.prototype,
+      'value',
+    ).set;
+    setUntrackedChecked = Object.getOwnPropertyDescriptor(
+      HTMLInputElement.prototype,
+      'checked',
+    ).set;
     ReactDOMClient = require('react-dom/client');
     ReactDOMServer = require('react-dom/server');
     act = require('internal-test-utils').act;
@@ -443,6 +457,74 @@ describe('ReactDOMEventListener', () => {
     }
   });
 
+  describe('form resetting', () => {
+    it('should not reset form if is prevented', async () => {
+      const container = document.createElement('div');
+      document.body.appendChild(container);
+
+      try {
+        const textRef = React.createRef();
+        const buttonRef = React.createRef();
+
+        const handleChangeTextBox = jest.fn();
+
+        class Form extends React.Component {
+          state = {text: 'test'};
+
+          render() {
+            return (
+              <form>
+                <input
+                  ref={textRef}
+                  defaultValue="test"
+                  onChange={event => {
+                    this.setState({text: event.target.value});
+                    handleChangeTextBox(event);
+                  }}
+                />
+                <button
+                  onClick={event => {
+                    event.preventDefault();
+                  }}
+                  ref={buttonRef}
+                  type="reset">
+                  reset
+                </button>
+              </form>
+            );
+          }
+        }
+
+        const root = ReactDOMClient.createRoot(container);
+        await act(() => {
+          root.render(<Form />);
+        });
+
+        await act(() => {
+          setUntrackedValue.call(textRef.current, 'test1');
+          dispatchEventOnNode(textRef.current, 'input');
+        });
+
+        expect(handleChangeTextBox).toHaveBeenCalledTimes(1);
+
+        await act(() => {
+          buttonRef.current.click();
+        });
+
+        expect(textRef.current.value).toEqual('test1');
+
+        await act(() => {
+          setUntrackedValue.call(textRef.current, 'test1');
+          dispatchEventOnNode(textRef.current, 'input');
+        });
+
+        expect(handleChangeTextBox).toHaveBeenCalledTimes(1);
+      } finally {
+        document.body.removeChild(container);
+      }
+    });
+  });
+
   it('should dispatch loadstart only for media elements', async () => {
     const container = document.createElement('div');
     document.body.appendChild(container);