Form restoration & React hydration

**Do you want to request a *feature* or report a *bug*?** Bug **Reproduction** 1. Open https://codesandbox.io/p/sandbox/form-restoration-react-hydration-cz1xgj?file=%2Fapp%2Fpage.js%3A2%2C1, see the source 2. Open https://cz1xgj-3000.csb.app/ 3. Fill in the input, for example, you can type "foo" 4. Press submit 5. Undo the navigation 6. See how the "input value" is outdated, it doesn’t match what's inside the textbox. https://github.com/facebook/react/assets/3165635/d29dd884-8896-4b59-8a55-16eb5145dfc7 **What is the current behavior?** Let's say you start filling a form input type text or a select element with `foo`. Then you click on a link and press the back button. The browser back-forward cache (or maybe the form restauration logic) will kick in and change the initial value of the form elements. You will get the `foo` value back in the input. However, React doesn't account for it when the component is controlled. For end-users, it means that they will try to submit a form because they see values in the inputs, but it won't work. They need to go back to each field and make a "fake" change so that React registers it. This issue could also be worked around by not controlling the inputs, but I'm not sure how popular form libraries handle this. **What is the expected behavior?** I expect React to trigger an `onChange` event to replicate the actual form value. At the fundamental level, there is a coordination issue between the browser and React. **Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?** - React `@latest` (v18.2.0). - Chrome `@latest` (v112.0) **Details** We have been using the following hack on Material UI: ```js componentDidMount() { // Fix SSR issue with the go back feature of the browsers. // Let's say you start filling the input with "foo", you change the page then after comes back. // The browser will reset the input value to "foo", but we also need to tell React ab…