Netlify Form detection fails with remix and react-router-dom #6955
Description
Describe the bug
When we use data-netlify="true" for enabling netlify forms during deployment. The detaction fails, given that it's not an issue on the detection side. It's more of how the packages like @remix-run/react and react-router-dom handles these.
For example, lets say you are using a simple Form that is exported from @remix-run/react
import { Form } from "@remix-run/react";
<Form method="post" data-netlify="true">
<input type="text" name="username" placeholder="username" />
<button type="submit">Submit</button>
</Form>@remix-run/react uses react-router-dom in return to render these elements.
And react-router-dom appends a form action by default if there is no action specified by the users.
https://github.com/remix-run/react-router/blob/a6353f8f1951184cbc75ec7e5fa9431a207e0742/packages/react-router/lib/dom/lib.tsx#L1070
let formAction = useFormAction(action, { relative });Remix explains about this behaviour here in the documentation too
If undefined, this defaults to the closest route in context. If a parent route renders a
but the URL matches deeper child routes, the form will post to the parent route. Likewise, a form inside the child route will post to the child route. This differs from a native that will always point to the full URL.
https://remix.run/docs/en/main/components/form#action
That basically makes netlify form detection break because post build files assume that users already appended action to thier form element. But in fact it's the default behaviour of the framework. Are there any plans to support such edge cases ?
Steps to reproduce
You can use the codesandbox link here to check the behaviour
https://codesandbox.io/p/devbox/netlify-forms-bug-8n85j6?file=%2Fapp%2Froutes%2F_index.tsx%3A2%2C1-2%2C41
Environment
System:
OS: macOS 15.1.1
CPU: (8) arm64 Apple M1 Pro
Memory: 1.05 GB / 16.00 GB
Shell: 5.9 - /bin/zsh
Binaries:
Node: 20.16.0 - ~/.nvm/versions/node/v20.16.0/bin/node
Yarn: 1.22.22 - ~/.nvm/versions/node/v20.16.0/bin/yarn
npm: 10.8.1 - ~/.nvm/versions/node/v20.16.0/bin/npm
pnpm: 9.14.2 - ~/Library/pnpm/pnpm
npmGlobalPackages:
netlify-cli: 17.38.0