fix: remove obsolete textarea validation workaround

packages/@react-aria/textfield/src/useTextField.ts

@@ -12,14 +12,13 @@
 
 import {AriaTextFieldProps} from '@react-types/textfield';
 import {DOMAttributes, ValidationResult} from '@react-types/shared';
-import {filterDOMProps, getOwnerWindow, mergeProps, useFormReset} from '@react-aria/utils';
+import {filterDOMProps, mergeProps, useFormReset} from '@react-aria/utils';
 import React, {
   ChangeEvent,
   HTMLAttributes,
   type JSX,
   LabelHTMLAttributes,
   RefObject,
-  useEffect,
   useState
 } from 'react';
 import {useControlledState} from '@react-stately/utils';
@@ -147,24 +146,6 @@ export function useTextField<T extends TextFieldIntrinsicElements = DefaultEleme
   useFormReset(ref, props.defaultValue ?? initialValue, setValue);
   useFormValidation(props, validationState, ref);
 
-  useEffect(() => {
-    // This works around a React/Chrome bug that prevents textarea elements from validating when controlled.
-    // We prevent React from updating defaultValue (i.e. children) of textarea when `value` changes,
-    // which causes Chrome to skip validation. Only updating `value` is ok in our case since our
-    // textareas are always controlled. React is planning on removing this synchronization in a
-    // future major version.
-    // https://github.com/facebook/react/issues/19474
-    // https://github.com/facebook/react/issues/11896
-    if (ref.current instanceof getOwnerWindow(ref.current).HTMLTextAreaElement) {
-      let input = ref.current;
-      Object.defineProperty(input, 'defaultValue', {
-        get: () => input.value,
-        set: () => {},
-        configurable: true
-      });
-    }
-  }, [ref]);
-
   return {
     labelProps,
     inputProps: mergeProps(

packages/react-aria-components/test/TextField.test.js

@@ -266,5 +266,35 @@ describe('TextField', () => {
       let input = getByRole('textbox');
       expect(input).toHaveAttribute('form', 'test');
     });
+
+    if (parseInt(React.version, 10) >= 19) {
+      it('resets to defaultValue when submitting form action', async () => {
+        const Component = component;
+        function Test() {
+          const [value, formAction] = React.useActionState((_, formData) => formData.get('value'), 'initial');
+
+          return (
+            <form action={formAction}>
+              <TextField defaultValue={value} name="value">
+                <Label>Value</Label>
+                <Component data-testid="input" />
+              </TextField>
+              <input data-testid="submit" type="submit" />
+            </form>
+          );
+        }
+
+        const {getByTestId} = render(<Test />);
+        const input = getByTestId('input');
+        expect(input).toHaveValue('initial');
+
+        await user.tab();
+        await user.keyboard('Devon');
+
+        const button = getByTestId('submit');
+        await user.click(button);
+        expect(input).toHaveValue('Devon');
+      });
+    }
   });
 });