[TextField] Fix unstable height of memoized multiline TextField compo…

…nent (mui#37135)

packages/mui-base/src/TextareaAutosize/TextareaAutosize.tsx

@@ -186,7 +186,18 @@ const TextareaAutosize = React.forwardRef(function TextareaAutosize(
   };
 
   React.useEffect(() => {
-    const handleResize = debounce(() => {
+    const handleResize = () => {
+      renders.current = 0;
+
+      // If the TextareaAutosize component is replaced by Suspense with a fallback, the last
+      // ResizeObserver's handler that runs because of the change in the layout is trying to
+      // access a dom node that is no longer there (as the fallback component is being shown instead).
+      // See https://github.com/mui/material-ui/issues/32640
+      if (inputRef.current) {
+        syncHeightWithFlushSync();
+      }
+    };
+    const handleResizeWindow = debounce(() => {
       renders.current = 0;
 
       // If the TextareaAutosize component is replaced by Suspense with a fallback, the last
@@ -202,16 +213,16 @@ const TextareaAutosize = React.forwardRef(function TextareaAutosize(
     const input = inputRef.current!;
     const containerWindow = ownerWindow(input);
 
-    containerWindow.addEventListener('resize', handleResize);
+    containerWindow.addEventListener('resize', handleResizeWindow);
 
     if (typeof ResizeObserver !== 'undefined') {
       resizeObserver = new ResizeObserver(handleResize);
       resizeObserver.observe(input);
     }
 
     return () => {
-      handleResize.clear();
-      containerWindow.removeEventListener('resize', handleResize);
+      handleResizeWindow.clear();
+      containerWindow.removeEventListener('resize', handleResizeWindow);
       if (resizeObserver) {
         resizeObserver.disconnect();
       }