Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug]: Basename is duplicated when calling setSearchParams #10431

Closed
ms-tng opened this issue May 2, 2023 · 5 comments · Fixed by #10433
Closed

[Bug]: Basename is duplicated when calling setSearchParams #10431

ms-tng opened this issue May 2, 2023 · 5 comments · Fixed by #10433
Labels

Comments

@ms-tng
Copy link

ms-tng commented May 2, 2023

What version of React Router are you using?

6.11.0

Steps to Reproduce

  1. Start a React app using this code:
import { useEffect } from "react";
import ReactDOM from "react-dom/client";
import { Route, RouterProvider, createBrowserRouter, createRoutesFromElements, useSearchParams } from "react-router-dom";

const Foo = () => {
  const [_, setSearchParams] = useSearchParams();

  useEffect(() => {
    setSearchParams({
      bar: "baz",
    });
  }, [setSearchParams]);

  return null;
};

const router = createBrowserRouter(
  createRoutesFromElements(<Route path="/foo" element={<Foo />} />),
  { basename: "/base" }
);

ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
  <RouterProvider router={router} />
);
  1. Configure your server to serve the app from /base, e.g. with this Vite config:
import react from "@vitejs/plugin-react";
import { defineConfig } from "vite";

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [react()],
  server: {
    base: "/base",
  },
});
  1. Open /base/foo in your browser, e.g. with the default Vite port: http://127.0.0.1:5173/base/foo

Expected Behavior

The app should redirect to http://127.0.0.1:5173/base/foo?bar=baz

This is what happens with [email protected].

Actual Behavior

The app redirects to http://127.0.0.1:5173/base/base/foo?bar=baz

I.e. the /base part is duplicated. In React's strict mode, when everything is rendered twice in development, it even redirects to http://127.0.0.1:5173/base/base/base/foo?bar=baz

@brophdawg11
Copy link
Contributor

Thanks for the reproduction @ms-tng! Looks like we missed a stripBasename call when we moved the relative routing/basename handling inside the @remix-run/router

@brophdawg11 brophdawg11 added the awaiting release This issue have been fixed and will be released soon label May 2, 2023
@brophdawg11 brophdawg11 removed their assignment May 2, 2023
@brophdawg11
Copy link
Contributor

This is fixed by #10433 and should be available once 6.11.1 is released

@github-actions
Copy link
Contributor

github-actions bot commented May 2, 2023

🤖 Hello there,

We just published version 6.11.1-pre.0 which involves this issue. If you'd like to take it for a test run please try it out and let us know what you think!

Thanks!

@github-actions
Copy link
Contributor

github-actions bot commented May 3, 2023

🤖 Hello there,

We just published version 6.11.1 which involves this issue. If you'd like to take it for a test run please try it out and let us know what you think!

Thanks!

@ms-tng
Copy link
Author

ms-tng commented May 4, 2023

Works perfectly, thank you for the quick fix! 👍

@brophdawg11 brophdawg11 removed the awaiting release This issue have been fixed and will be released soon label Jun 6, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants