Skip to content

Fix form action replay when a field is named "action" - #37880

Open
Fire162 wants to merge 1 commit into
react:mainfrom
Fire162:fix-form-replay-action-name
Open

Fire162 wants to merge 1 commit into
react:mainfrom
Fire162:fix-form-replay-action-name

Conversation

@Fire162

@Fire162 Fire162 commented Oct 17, 2026

Copy link
Copy Markdown

Summary

Fixes #37837

In HTML forms, form controls with name="action" (such as <button name="action"> or <input name="action">) shadow the form.action DOM property via named element getters on HTMLFormElement.

In listenToFormSubmissionsForReplaying (ReactDOMFizzInstructionSetShared.js), let action = form.action caused action to evaluate to the shadowing element instead of the form's action URL string. As a result:

  • The check action !== EXPECTED_FORM_ACTION_URL evaluated to true.
  • event.preventDefault() was never called.
  • The submit event was not queued into root['$$reactFormReplay'].
  • In browsers, the form navigated to the javascript: placeholder URL, throwing Uncaught Error: React form unexpectedly submitted.

This PR updates listenToFormSubmissionsForReplaying to read form.getAttribute('action') instead of form.action. This matches how submitter.getAttribute('formAction') is already handled and avoids named property shadowing.

The compiled instruction string in ReactDOMFizzInstructionSetInlineCodeStrings.js was updated via yarn generate-inline-fizz-runtime.

How did you test this change?

  1. Added two regression tests in packages/react-dom/src/__tests__/ReactDOMFizzForm-test.js:
    • should replay a form action after hydration when a field is named "action"
    • should replay a form action after hydration when a button is named "action"
  2. Verified that without the fix, both tests fail with Navigate to: [object HTMLButtonElement] / [object HTMLInputElement], and with the fix, all 17 tests in ReactDOMFizzForm-test.js pass in both development and production (yarn test --prod ReactDOMFizzForm-test.js).
  3. Ran yarn test packages/react-dom/src/__tests__/ReactDOMForm-test.js (45 passed).
  4. Ran yarn linc (0 errors).

In HTML forms, form controls with name="action" (such as <button name="action">
or <input name="action">) shadow the form.action DOM property via named
element getters on HTMLFormElement.

In listenToFormSubmissionsForReplaying, checking `let action = form.action`
caused `action` to evaluate to the shadowing element instead of the form's
action URL string. Consequently, the check against EXPECTED_FORM_ACTION_URL
failed, event.preventDefault() was never called, and the submission was not
queued in $$reactFormReplay.

Fix this by reading `form.getAttribute('action')` instead of `form.action`,
matching how `submitter.getAttribute('formAction')` is already read.
@meta-cla meta-cla Bot added the CLA Signed label Oct 17, 2026
@github-actions

Copy link
Copy Markdown

A size report will appear here when the build finishes.

Generated by sizebot against 5129a05

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Bug: Submitting a form before hydration fails when a field is named "action"

1 participant