{"record":{"id":"bbf5177fd1b19b55","repo":"remix-run/react-router","slug":"cannot-submit-element-that-is-not-form-button","errorCode":null,"errorMessage":"Cannot submit element that is not <form>, <button>, or <input type=\"submit|image\">","messagePattern":"Cannot submit element that is not <form>, <button>, or <input type=\"submit\\|image\">","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"packages/react-router/lib/dom/dom.ts","lineNumber":340,"sourceCode":"    // Build a FormData object populated from a form and submitter\n    formData = new FormData(form, target);\n\n    // If this browser doesn't support the `FormData(el, submitter)` format,\n    // then tack on the submitter value at the end.  This is a lightweight\n    // solution that is not 100% spec compliant.  For complete support in older\n    // browsers, consider using the `formdata-submitter-polyfill` package\n    if (!isFormDataSubmitterSupported()) {\n      let { name, type, value } = target;\n      if (type === \"image\") {\n        let prefix = name ? `${name}.` : \"\";\n        formData.append(`${prefix}x`, \"0\");\n        formData.append(`${prefix}y`, \"0\");\n      } else if (name) {\n        formData.append(name, value);\n      }\n    }\n  } else if (isHtmlElement(target)) {\n    throw new Error(\n      `Cannot submit element that is not <form>, <button>, or ` +\n        `<input type=\"submit|image\">`,\n    );\n  } else {\n    method = defaultMethod;\n    action = null;\n    encType = defaultEncType;\n    body = target;\n  }\n\n  // Send body for <Form encType=\"text/plain\" so we encode it into text\n  if (formData && encType === \"text/plain\") {\n    body = formData;\n    formData = undefined;\n  }\n\n  return { action, method: method.toLowerCase(), encType, formData, body };\n}","sourceCodeStart":322,"sourceCodeEnd":358,"githubUrl":"https://github.com/remix-run/react-router/blob/1fd704a7dabcbe3ae09d7387b460e6acaba30ec1/packages/react-router/lib/dom/dom.ts#L322-L358","documentation":"`getFormSubmissionInfo` was passed an `HTMLElement` that is not a `<form>`, `<button>`, or `<input type=submit|image>`. The DOM submit target is of an unsupported type.","triggerScenarios":"Calling `useSubmit()`/`submit()` with an arbitrary DOM node (a `<div>`, `<a>`, etc.) as the target; passing a submitter element from an event whose `currentTarget` is not one of the supported elements.","commonSituations":"Programmatic submission where the developer passes `event.currentTarget` from a non-form element; refactoring that switched a `<button>` to a `<div role=\"button\">` without updating the submit call; an `onClick` on a non-submit element calling `submit(element)`.","solutions":["Pass a supported target: a `<form>`, a `<button type=\"submit\">`, or an `<input type=\"submit|image\">`.","If you have raw values, pass a `FormData` or plain object via the `submit(data, opts)` overload instead of a DOM node.","Type the submit target in your handler so TypeScript rejects unsupported nodes."],"exampleFix":"// before\nsubmit(divRef.current); // <div>\n\n// after\nsubmit(formRef.current); // <form>","handlingStrategy":"type-guard","validationCode":"function isSubmitTarget(t: unknown): t is HTMLFormElement | HTMLButtonElement | HTMLInputElement {\n  if (t instanceof HTMLFormElement) return true;\n  if (t instanceof HTMLButtonElement) return true;\n  return t instanceof HTMLInputElement && (t.type === 'submit' || t.type === 'image');\n}\nif (!isSubmitTarget(node)) throw new Error('Unsupported submit target');","typeGuard":"function isFormSubmitTarget(t: unknown): t is HTMLFormElement | HTMLButtonElement | HTMLInputElement {\n  return (\n    t instanceof HTMLFormElement ||\n    t instanceof HTMLButtonElement ||\n    (t instanceof HTMLInputElement && (t.type === 'submit' || t.type === 'image'))\n  );\n}","tryCatchPattern":null,"preventionTips":["Always pass a `<form>` element or a FormData/object payload to `submit()`.","Type submit handlers so non-submit elements can't be passed."],"tags":["forms","dom","submission","type-guard"],"backgroundTag":null,"analyzedSha":"1fd704a7dabcbe3ae09d7387b460e6acaba30ec1","analyzedAt":"2026-08-12T13:54:57.804Z","schemaVersion":2},"datasetVersion":"2026-08-12T18:17:37.767Z"}