code-forge-io / code-forge-io/remix-hook-form

Form submission triggers client-side navigation when basename is set

Open
#175 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
453
Forks
43
PR merge metrics
No merged PRs in 30d

Description

When using React Router with a basename that ends with a trailing slash, submitting a form managed by remix-hook-form triggers a client-side navigation instead of correctly submitting the form to the action.

Removing the trailing slash from the basename (e.g. /app instead of /app/) resolves the issue, but this has further implications with the way vite handles the basepath. In my case it will break my SPA because vite cannot resolve paths to client build assets anymore.

As a current workaround i have patched this part in the handleSubmit function:
```tsx
const action = e?.currentTarget?.action.replace(
`${window.location.origin}${basename === "/" ? "" : basename}`,
"",
);
```

by replacing the action string with a "/" instead of nothing:

```tsx
const action = e?.currentTarget?.action.replace(
`${window.location.origin}${basename === "/" ? "" : basename}`,
"/",
);
```

I am not sure if this has any implications with the way this library works, so i haven't submitted a PR yet. For now this seems to solve my issue but i'd love to see this being officially fixed in the library.

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.