fix: various fixes (#5593)

Author: schiller-manuel

e2e/react-start/server-functions/tests/server-functions.spec.ts

@@ -450,6 +450,8 @@ test('primitives', async ({ page }) => {
   const testCases = await page
     .locator('[data-testid^="expected-"]')
     .elementHandles()
+  expect(testCases.length).not.toBe(0)
+
   for (const testCase of testCases) {
     const testId = await testCase.getAttribute('data-testid')
 

e2e/react-start/server-routes/package.json

@@ -11,8 +11,10 @@
     "test:e2e": "playwright test --project=chromium"
   },
   "dependencies": {
+    "@tanstack/react-query": "5.66.0",
     "@tanstack/react-router": "workspace:^",
     "@tanstack/react-router-devtools": "workspace:^",
+    "@tanstack/react-router-ssr-query": "workspace:^",
     "@tanstack/react-start": "workspace:^",
     "js-cookie": "^3.0.5",
     "react": "^19.0.0",

e2e/react-start/server-routes/src/routeTree.gen.ts

@@ -9,23 +9,46 @@
 // Additionally, you should also exclude this file from your linter and/or formatter to prevent it from being checked or modified.
 
 import { Route as rootRouteImport } from './routes/__root'
-import { Route as MergeServerFnMiddlewareContextRouteImport } from './routes/merge-server-fn-middleware-context'
+import { Route as MergeMiddlewareContextRouteImport } from './routes/merge-middleware-context'
+import { Route as MethodsRouteRouteImport } from './routes/methods/route'
 import { Route as IndexRouteImport } from './routes/index'
+import { Route as MethodsIndexRouteImport } from './routes/methods/index'
+import { Route as MethodsOnlyAnyRouteImport } from './routes/methods/only-any'
+import { Route as ApiOnlyAnyRouteImport } from './routes/api/only-any'
 import { Route as ApiMiddlewareContextRouteImport } from './routes/api/middleware-context'
 import { Route as ApiParamsFooRouteRouteImport } from './routes/api/params/$foo/route'
 import { Route as ApiParamsFooBarRouteImport } from './routes/api/params/$foo/$bar'
 
-const MergeServerFnMiddlewareContextRoute =
-  MergeServerFnMiddlewareContextRouteImport.update({
-    id: '/merge-server-fn-middleware-context',
-    path: '/merge-server-fn-middleware-context',
-    getParentRoute: () => rootRouteImport,
-  } as any)
+const MergeMiddlewareContextRoute = MergeMiddlewareContextRouteImport.update({
+  id: '/merge-middleware-context',
+  path: '/merge-middleware-context',
+  getParentRoute: () => rootRouteImport,
+} as any)
+const MethodsRouteRoute = MethodsRouteRouteImport.update({
+  id: '/methods',
+  path: '/methods',
+  getParentRoute: () => rootRouteImport,
+} as any)
 const IndexRoute = IndexRouteImport.update({
   id: '/',
   path: '/',
   getParentRoute: () => rootRouteImport,
 } as any)
+const MethodsIndexRoute = MethodsIndexRouteImport.update({
+  id: '/',
+  path: '/',
+  getParentRoute: () => MethodsRouteRoute,
+} as any)
+const MethodsOnlyAnyRoute = MethodsOnlyAnyRouteImport.update({
+  id: '/only-any',
+  path: '/only-any',
+  getParentRoute: () => MethodsRouteRoute,
+} as any)
+const ApiOnlyAnyRoute = ApiOnlyAnyRouteImport.update({
+  id: '/api/only-any',
+  path: '/api/only-any',
+  getParentRoute: () => rootRouteImport,
+} as any)
 const ApiMiddlewareContextRoute = ApiMiddlewareContextRouteImport.update({
   id: '/api/middleware-context',
   path: '/api/middleware-context',
@@ -44,64 +67,95 @@ const ApiParamsFooBarRoute = ApiParamsFooBarRouteImport.update({
 
 export interface FileRoutesByFullPath {
   '/': typeof IndexRoute
-  '/merge-server-fn-middleware-context': typeof MergeServerFnMiddlewareContextRoute
+  '/methods': typeof MethodsRouteRouteWithChildren
+  '/merge-middleware-context': typeof MergeMiddlewareContextRoute
   '/api/middleware-context': typeof ApiMiddlewareContextRoute
+  '/api/only-any': typeof ApiOnlyAnyRoute
+  '/methods/only-any': typeof MethodsOnlyAnyRoute
+  '/methods/': typeof MethodsIndexRoute
   '/api/params/$foo': typeof ApiParamsFooRouteRouteWithChildren
   '/api/params/$foo/$bar': typeof ApiParamsFooBarRoute
 }
 export interface FileRoutesByTo {
   '/': typeof IndexRoute
-  '/merge-server-fn-middleware-context': typeof MergeServerFnMiddlewareContextRoute
+  '/merge-middleware-context': typeof MergeMiddlewareContextRoute
   '/api/middleware-context': typeof ApiMiddlewareContextRoute
+  '/api/only-any': typeof ApiOnlyAnyRoute
+  '/methods/only-any': typeof MethodsOnlyAnyRoute
+  '/methods': typeof MethodsIndexRoute
   '/api/params/$foo': typeof ApiParamsFooRouteRouteWithChildren
   '/api/params/$foo/$bar': typeof ApiParamsFooBarRoute
 }
 export interface FileRoutesById {
   __root__: typeof rootRouteImport
   '/': typeof IndexRoute
-  '/merge-server-fn-middleware-context': typeof MergeServerFnMiddlewareContextRoute
+  '/methods': typeof MethodsRouteRouteWithChildren
+  '/merge-middleware-context': typeof MergeMiddlewareContextRoute
   '/api/middleware-context': typeof ApiMiddlewareContextRoute
+  '/api/only-any': typeof ApiOnlyAnyRoute
+  '/methods/only-any': typeof MethodsOnlyAnyRoute
+  '/methods/': typeof MethodsIndexRoute
   '/api/params/$foo': typeof ApiParamsFooRouteRouteWithChildren
   '/api/params/$foo/$bar': typeof ApiParamsFooBarRoute
 }
 export interface FileRouteTypes {
   fileRoutesByFullPath: FileRoutesByFullPath
   fullPaths:
     | '/'
-    | '/merge-server-fn-middleware-context'
+    | '/methods'
+    | '/merge-middleware-context'
     | '/api/middleware-context'
+    | '/api/only-any'
+    | '/methods/only-any'
+    | '/methods/'
     | '/api/params/$foo'
     | '/api/params/$foo/$bar'
   fileRoutesByTo: FileRoutesByTo
   to:
     | '/'
-    | '/merge-server-fn-middleware-context'
+    | '/merge-middleware-context'
     | '/api/middleware-context'
+    | '/api/only-any'
+    | '/methods/only-any'
+    | '/methods'
     | '/api/params/$foo'
     | '/api/params/$foo/$bar'
   id:
     | '__root__'
     | '/'
-    | '/merge-server-fn-middleware-context'
+    | '/methods'
+    | '/merge-middleware-context'
     | '/api/middleware-context'
+    | '/api/only-any'
+    | '/methods/only-any'
+    | '/methods/'
     | '/api/params/$foo'
     | '/api/params/$foo/$bar'
   fileRoutesById: FileRoutesById
 }
 export interface RootRouteChildren {
   IndexRoute: typeof IndexRoute
-  MergeServerFnMiddlewareContextRoute: typeof MergeServerFnMiddlewareContextRoute
+  MethodsRouteRoute: typeof MethodsRouteRouteWithChildren
+  MergeMiddlewareContextRoute: typeof MergeMiddlewareContextRoute
   ApiMiddlewareContextRoute: typeof ApiMiddlewareContextRoute
+  ApiOnlyAnyRoute: typeof ApiOnlyAnyRoute
   ApiParamsFooRouteRoute: typeof ApiParamsFooRouteRouteWithChildren
 }
 
 declare module '@tanstack/react-router' {
   interface FileRoutesByPath {
-    '/merge-server-fn-middleware-context': {
-      id: '/merge-server-fn-middleware-context'
-      path: '/merge-server-fn-middleware-context'
-      fullPath: '/merge-server-fn-middleware-context'
-      preLoaderRoute: typeof MergeServerFnMiddlewareContextRouteImport
+    '/merge-middleware-context': {
+      id: '/merge-middleware-context'
+      path: '/merge-middleware-context'
+      fullPath: '/merge-middleware-context'
+      preLoaderRoute: typeof MergeMiddlewareContextRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/methods': {
+      id: '/methods'
+      path: '/methods'
+      fullPath: '/methods'
+      preLoaderRoute: typeof MethodsRouteRouteImport
       parentRoute: typeof rootRouteImport
     }
     '/': {
@@ -111,6 +165,27 @@ declare module '@tanstack/react-router' {
       preLoaderRoute: typeof IndexRouteImport
       parentRoute: typeof rootRouteImport
     }
+    '/methods/': {
+      id: '/methods/'
+      path: '/'
+      fullPath: '/methods/'
+      preLoaderRoute: typeof MethodsIndexRouteImport
+      parentRoute: typeof MethodsRouteRoute
+    }
+    '/methods/only-any': {
+      id: '/methods/only-any'
+      path: '/only-any'
+      fullPath: '/methods/only-any'
+      preLoaderRoute: typeof MethodsOnlyAnyRouteImport
+      parentRoute: typeof MethodsRouteRoute
+    }
+    '/api/only-any': {
+      id: '/api/only-any'
+      path: '/api/only-any'
+      fullPath: '/api/only-any'
+      preLoaderRoute: typeof ApiOnlyAnyRouteImport
+      parentRoute: typeof rootRouteImport
+    }
     '/api/middleware-context': {
       id: '/api/middleware-context'
       path: '/api/middleware-context'
@@ -135,6 +210,20 @@ declare module '@tanstack/react-router' {
   }
 }
 
+interface MethodsRouteRouteChildren {
+  MethodsOnlyAnyRoute: typeof MethodsOnlyAnyRoute
+  MethodsIndexRoute: typeof MethodsIndexRoute
+}
+
+const MethodsRouteRouteChildren: MethodsRouteRouteChildren = {
+  MethodsOnlyAnyRoute: MethodsOnlyAnyRoute,
+  MethodsIndexRoute: MethodsIndexRoute,
+}
+
+const MethodsRouteRouteWithChildren = MethodsRouteRoute._addFileChildren(
+  MethodsRouteRouteChildren,
+)
+
 interface ApiParamsFooRouteRouteChildren {
   ApiParamsFooBarRoute: typeof ApiParamsFooBarRoute
 }
@@ -148,8 +237,10 @@ const ApiParamsFooRouteRouteWithChildren =
 
 const rootRouteChildren: RootRouteChildren = {
   IndexRoute: IndexRoute,
-  MergeServerFnMiddlewareContextRoute: MergeServerFnMiddlewareContextRoute,
+  MethodsRouteRoute: MethodsRouteRouteWithChildren,
+  MergeMiddlewareContextRoute: MergeMiddlewareContextRoute,
   ApiMiddlewareContextRoute: ApiMiddlewareContextRoute,
+  ApiOnlyAnyRoute: ApiOnlyAnyRoute,
   ApiParamsFooRouteRoute: ApiParamsFooRouteRouteWithChildren,
 }
 export const routeTree = rootRouteImport

e2e/react-start/server-routes/src/router.tsx

@@ -1,16 +1,20 @@
 import { createRouter } from '@tanstack/react-router'
+import { setupRouterSsrQueryIntegration } from '@tanstack/react-router-ssr-query'
+import { QueryClient } from '@tanstack/react-query'
 import { routeTree } from './routeTree.gen'
 import { DefaultCatchBoundary } from './components/DefaultCatchBoundary'
 import { NotFound } from './components/NotFound'
 
 export function getRouter() {
+  const queryClient = new QueryClient()
   const router = createRouter({
     routeTree,
     defaultPreload: 'intent',
     defaultErrorComponent: DefaultCatchBoundary,
     defaultNotFoundComponent: () => <NotFound />,
     scrollRestoration: true,
   })
+  setupRouterSsrQueryIntegration({ router, queryClient })
 
   return router
 }

e2e/react-start/server-routes/src/routes/api/only-any.ts

@@ -0,0 +1,18 @@
+import { createFileRoute } from '@tanstack/react-router'
+import { json } from '@tanstack/react-start'
+
+export const Route = createFileRoute('/api/only-any')({
+  server: {
+    handlers: {
+      ANY: ({ request }) => {
+        return json(
+          {
+            handler: 'ANY',
+            method: request.method,
+          },
+          { headers: { 'X-HANDLER': 'ANY', 'X-METHOD': request.method } },
+        )
+      },
+    },
+  },
+})

e2e/react-start/server-routes/src/routes/index.tsx

@@ -1,4 +1,4 @@
-import { Link, createFileRoute } from '@tanstack/react-router'
+import { createFileRoute } from '@tanstack/react-router'
 
 export const Route = createFileRoute('/')({
   component: Home,
@@ -10,9 +10,12 @@ function Home() {
       <h1 className="font-bold text-lg">Server Routes E2E tests</h1>
       <ul className="list-disc p-4">
         <li>
-          <Link to="/merge-server-fn-middleware-context">
-            server function middleware context is merged correctly
-          </Link>
+          <Route.Link to="./merge-middleware-context">
+            server route middleware context is merged correctly
+          </Route.Link>
+        </li>
+        <li>
+          <Route.Link to="./methods">server route methods</Route.Link>
         </li>
       </ul>
     </div>

e2e/react-start/server-routes/src/routes/merge-server-fn-middleware-context.tsx renamed to e2e/react-start/server-routes/src/routes/merge-middleware-context.tsx

@@ -1,11 +1,11 @@
 import { createFileRoute } from '@tanstack/react-router'
 import * as React from 'react'
 
-export const Route = createFileRoute('/merge-server-fn-middleware-context')({
-  component: () => <MergeServerFnMiddlewareContext />,
+export const Route = createFileRoute('/merge-middleware-context')({
+  component: MergeMiddlewareContext,
 })
 
-function MergeServerFnMiddlewareContext() {
+function MergeMiddlewareContext() {
   const [apiResponse, setApiResponse] = React.useState<any>(null)
 
   const fetchMiddlewareContext = async () => {
@@ -21,7 +21,7 @@ function MergeServerFnMiddlewareContext() {
 
   return (
     <div className="p-2 m-2 grid gap-2">
-      <h3>Merge Server Function Middleware Context Test</h3>
+      <h3>Merge Server Route Middleware Context Test</h3>
       <div className="flex flex-col gap-2">
         <button
           type="button"

e2e/react-start/server-routes/src/routes/methods/index.tsx

@@ -0,0 +1,19 @@
+import { createFileRoute } from '@tanstack/react-router'
+
+export const Route = createFileRoute('/methods/')({
+  component: RouteComponent,
+})
+
+function RouteComponent() {
+  return (
+    <div className="p-8">
+      <ul className="list-disc p-4">
+        <li>
+          <Route.Link to="./only-any">
+            Server Route only has ANY handler
+          </Route.Link>
+        </li>
+      </ul>
+    </div>
+  )
+}