<!-- Please provide a clear and concise description of what the bug is. Include screenshots if needed. Please test using the latest version of the relevant React packages to make sure your issue has not already been fixed. --> React version: 18.0.0-beta-4ff5f5719-20211115 ## Steps To Reproduce 1. Render empty string `ReactDOMServer.renderToString("")` Link to code example: https://codesandbox.io/s/react-18-emptry-string-hydration-mismatch-xz4w9 Original issue: [`f9d729e` (#1541)](https://github.com/OperationCode/front-end/pull/1541/commits/f9d729e4070ce5ae178d1746fe470646652eaf3f#diff-887fe6affa5f7a2804ac12d95865452237617ee98d7342f1df8352cf641a70d4L90-R93) Did some spelunking in the codebase and it seems to me that the reconciler is looking for a hydrateable instance (https://github.com/facebook/react/blob/00ced1e2b7610543a519329a76ad0bfd12cd1c32/packages/react-reconciler/src/ReactFiberBeginWork.new.js#L1413-L1415). But since an empty string won't appear as a text node (if we just set `innerHTML = string`), the reconciler thinks there's a mismatch. In legacy roots we didn't throw but warn **unless we had an empty string**: https://github.com/facebook/react/blob/75f3ddebfa0d9885ce8df42571cf0c09ad6c0a3b/packages/react-dom/src/client/ReactDOMComponent.js#L1202-L1208 ## The current behavior Console error is logged with "An error occurred during hydration. The server HTML was replaced with client content" ## The expected behavior No hydration mismatch just like in React 17: https://codesandbox.io/s/react-17-emptry-string-no-hydration-mismatch-forked-5tgmw
React version: 18.0.0-beta-4ff5f5719-20211115
Steps To Reproduce
ReactDOMServer.renderToString("")Link to code example: https://codesandbox.io/s/react-18-emptry-string-hydration-mismatch-xz4w9
Original issue:
f9d729e(#1541)Did some spelunking in the codebase and it seems to me that the reconciler is looking for a hydrateable instance (https://github.com/facebook/react/blob/00ced1e2b7610543a519329a76ad0bfd12cd1c32/packages/react-reconciler/src/ReactFiberBeginWork.new.js#L1413-L1415). But since an empty string won't appear as a text node (if we just set
innerHTML = string), the reconciler thinks there's a mismatch. In legacy roots we didn't throw but warn unless we had an empty string: https://github.com/facebook/react/blob/75f3ddebfa0d9885ce8df42571cf0c09ad6c0a3b/packages/react-dom/src/client/ReactDOMComponent.js#L1202-L1208The current behavior
Console error is logged with "An error occurred during hydration. The server HTML was replaced with client content"
The expected behavior
No hydration mismatch just like in React 17: https://codesandbox.io/s/react-17-emptry-string-no-hydration-mismatch-forked-5tgmw