Allow empty string to be passed to formAction

facebook · Mar 13, 2023 · c3be129 · c3be129
1 parent ef8bdbe
commit c3be129
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 21 deletions.
diff --git a/packages/react-dom-bindings/src/shared/DOMProperty.js b/packages/react-dom-bindings/src/shared/DOMProperty.js
@@ -636,7 +636,18 @@ properties[xlinkHref] = new PropertyInfoRecord(
   false, // removeEmptyString
 );
 
-['src', 'href', 'action', 'formAction'].forEach(attributeName => {
+// $FlowFixMe[invalid-constructor] Flow no longer supports calling new on functions
+properties['formAction'] = new PropertyInfoRecord(
+  'formAction',
+  STRING,
+  false, // mustUseProperty
+  'formaction', // attributeName
+  null, // attributeNamespace
+  true, // sanitizeURL
+  false, // removeEmptyString
+);
+
+['src', 'href', 'action'].forEach(attributeName => {
   // $FlowFixMe[invalid-constructor] Flow no longer supports calling new on functions
   properties[attributeName] = new PropertyInfoRecord(
     attributeName,

diff --git a/packages/react-dom/src/__tests__/ReactDOMComponent-test.js b/packages/react-dom/src/__tests__/ReactDOMComponent-test.js
@@ -533,29 +533,17 @@ describe('ReactDOMComponent', () => {
         expect(node.hasAttribute('action')).toBe(false);
       });
 
-      it('should not add an empty formAction attribute', () => {
+      it('allows empty string of a formAction to override the default of a parent', () => {
         const container = document.createElement('div');
-        expect(() =>
-          ReactDOM.render(<button formAction="" />, container),
-        ).toErrorDev(
-          'An empty string ("") was passed to the formAction attribute. ' +
-            'To fix this, either do not render the element at all ' +
-            'or pass null to formAction instead of an empty string.',
+        ReactDOM.render(
+          <form action="hello">
+            <button formAction="" />,
+          </form>,
+          container,
         );
         const node = container.firstChild;
-        expect(node.hasAttribute('formAction')).toBe(false);
-
-        ReactDOM.render(<button formAction="abc" />, container);
-        expect(node.hasAttribute('formAction')).toBe(true);
-
-        expect(() =>
-          ReactDOM.render(<button formAction="" />, container),
-        ).toErrorDev(
-          'An empty string ("") was passed to the formAction attribute. ' +
-            'To fix this, either do not render the element at all ' +
-            'or pass null to formAction instead of an empty string.',
-        );
-        expect(node.hasAttribute('formAction')).toBe(false);
+        expect(node.hasAttribute('formaction')).toBe(true);
+        expect(node.getAttribute('formaction')).toBe('');
       });
 
       it('should not filter attributes for custom elements', () => {