Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 18 additions & 0 deletions e2e/react-start/server-routes/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
node_modules
package-lock.json
yarn.lock

.DS_Store
.cache
.env
.vercel
.output
/build/
/api/
/server/build
/public/build# Sentry Config File
.env.sentry-build-plugin
/test-results/
/playwright-report/
/blob-report/
/playwright/.cache/
4 changes: 4 additions & 0 deletions e2e/react-start/server-routes/.prettierignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
**/build
**/public
pnpm-lock.yaml
routeTree.gen.ts
40 changes: 40 additions & 0 deletions e2e/react-start/server-routes/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
{
"name": "tanstack-react-start-e2e-server-routes",
"private": true,
"sideEffects": false,
"type": "module",
"scripts": {
"dev": "vite dev --port 3000",
"dev:e2e": "vite dev",
"build": "vite build && tsc --noEmit",
"start": "node .output/server/index.mjs",
"test:e2e": "playwright test --project=chromium"
},
"dependencies": {
"@tanstack/react-router": "workspace:^",
"@tanstack/react-router-devtools": "workspace:^",
"@tanstack/react-start": "workspace:^",
"js-cookie": "^3.0.5",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"redaxios": "^0.5.1",
"tailwind-merge": "^2.6.0",
"vite": "^6.3.5",
"zod": "^3.24.2"
},
"devDependencies": {
"@playwright/test": "^1.50.1",
"@tanstack/router-e2e-utils": "workspace:^",
"@types/js-cookie": "^3.0.6",
"@types/node": "^22.10.2",
"@types/react": "^19.0.8",
"@types/react-dom": "^19.0.3",
"@vitejs/plugin-react": "^4.3.4",
"autoprefixer": "^10.4.20",
"combinate": "^1.1.11",
"postcss": "^8.5.1",
"tailwindcss": "^3.4.17",
"typescript": "^5.7.2",
"vite-tsconfig-paths": "^5.1.4"
}
}
35 changes: 35 additions & 0 deletions e2e/react-start/server-routes/playwright.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
import { defineConfig, devices } from '@playwright/test'
import { derivePort } from '@tanstack/router-e2e-utils'
import packageJson from './package.json' with { type: 'json' }

export const PORT = await derivePort(packageJson.name)
const baseURL = `http://localhost:${PORT}`

/**
* See https://playwright.dev/docs/test-configuration.
*/
export default defineConfig({
testDir: './tests',
workers: 1,

reporter: [['line']],

use: {
/* Base URL to use in actions like `await page.goto('/')`. */
baseURL,
},

webServer: {
command: `VITE_SERVER_PORT=${PORT} pnpm build && PORT=${PORT} VITE_SERVER_PORT=${PORT} pnpm start`,
url: baseURL,
reuseExistingServer: !process.env.CI,
stdout: 'pipe',
},

projects: [
{
name: 'chromium',
use: { ...devices['Desktop Chrome'] },
},
],
})
6 changes: 6 additions & 0 deletions e2e/react-start/server-routes/postcss.config.mjs
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
export default {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
}
Binary file not shown.
Binary file added e2e/react-start/server-routes/public/favicon.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
import {
ErrorComponent,
Link,
rootRouteId,
useMatch,
useRouter,
} from '@tanstack/react-router'
import type { ErrorComponentProps } from '@tanstack/react-router'

export function DefaultCatchBoundary({ error }: ErrorComponentProps) {
const router = useRouter()
const isRoot = useMatch({
strict: false,
select: (state) => state.id === rootRouteId,
})

console.error(error)

return (
<div className="min-w-0 flex-1 p-4 flex flex-col items-center justify-center gap-6">
<ErrorComponent error={error} />
<div className="flex gap-2 items-center flex-wrap">
<button
onClick={() => {
router.invalidate()
}}
className={`px-2 py-1 bg-gray-600 dark:bg-gray-700 rounded text-white uppercase font-extrabold`}
>
Try Again
</button>
{isRoot ? (
<Link
to="/"
className={`px-2 py-1 bg-gray-600 dark:bg-gray-700 rounded text-white uppercase font-extrabold`}
>
Home
</Link>
) : (
<Link
to="/"
className={`px-2 py-1 bg-gray-600 dark:bg-gray-700 rounded text-white uppercase font-extrabold`}
onClick={(e) => {
e.preventDefault()
window.history.back()
}}
>
Go Back
</Link>
)}
</div>
</div>
)
}
25 changes: 25 additions & 0 deletions e2e/react-start/server-routes/src/components/NotFound.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
import { Link } from '@tanstack/react-router'

export function NotFound({ children }: { children?: any }) {
return (
<div className="space-y-2 p-2" data-testid="default-not-found-component">
<div className="text-gray-600 dark:text-gray-400">
{children || <p>The page you are looking for does not exist.</p>}
</div>
<p className="flex items-center gap-2 flex-wrap">
<button
onClick={() => window.history.back()}
className="bg-emerald-500 text-white px-2 py-1 rounded uppercase font-black text-sm"
>
Go back
</button>
<Link
to="/"
className="bg-cyan-600 text-white px-2 py-1 rounded uppercase font-black text-sm"
>
Start Over
</Link>
</p>
</div>
)
}
127 changes: 127 additions & 0 deletions e2e/react-start/server-routes/src/routeTree.gen.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,127 @@
/* eslint-disable */

// @ts-nocheck

// noinspection JSUnusedGlobalSymbols

// This file was automatically generated by TanStack Router.
// You should NOT make any changes in this file as it will be overwritten.
// Additionally, you should also exclude this file from your linter and/or formatter to prevent it from being checked or modified.

import { createServerRootRoute } from '@tanstack/react-start/server'

import { Route as rootRouteImport } from './routes/__root'
import { Route as MergeServerFnMiddlewareContextRouteImport } from './routes/merge-server-fn-middleware-context'
import { Route as IndexRouteImport } from './routes/index'
import { ServerRoute as ApiMiddlewareContextServerRouteImport } from './routes/api/middleware-context'

const rootServerRouteImport = createServerRootRoute()

const MergeServerFnMiddlewareContextRoute =
MergeServerFnMiddlewareContextRouteImport.update({
id: '/merge-server-fn-middleware-context',
path: '/merge-server-fn-middleware-context',
getParentRoute: () => rootRouteImport,
} as any)
const IndexRoute = IndexRouteImport.update({
id: '/',
path: '/',
getParentRoute: () => rootRouteImport,
} as any)
const ApiMiddlewareContextServerRoute =
ApiMiddlewareContextServerRouteImport.update({
id: '/api/middleware-context',
path: '/api/middleware-context',
getParentRoute: () => rootServerRouteImport,
} as any)

export interface FileRoutesByFullPath {
'/': typeof IndexRoute
'/merge-server-fn-middleware-context': typeof MergeServerFnMiddlewareContextRoute
}
export interface FileRoutesByTo {
'/': typeof IndexRoute
'/merge-server-fn-middleware-context': typeof MergeServerFnMiddlewareContextRoute
}
export interface FileRoutesById {
__root__: typeof rootRouteImport
'/': typeof IndexRoute
'/merge-server-fn-middleware-context': typeof MergeServerFnMiddlewareContextRoute
}
export interface FileRouteTypes {
fileRoutesByFullPath: FileRoutesByFullPath
fullPaths: '/' | '/merge-server-fn-middleware-context'
fileRoutesByTo: FileRoutesByTo
to: '/' | '/merge-server-fn-middleware-context'
id: '__root__' | '/' | '/merge-server-fn-middleware-context'
fileRoutesById: FileRoutesById
}
export interface RootRouteChildren {
IndexRoute: typeof IndexRoute
MergeServerFnMiddlewareContextRoute: typeof MergeServerFnMiddlewareContextRoute
}
export interface FileServerRoutesByFullPath {
'/api/middleware-context': typeof ApiMiddlewareContextServerRoute
}
export interface FileServerRoutesByTo {
'/api/middleware-context': typeof ApiMiddlewareContextServerRoute
}
export interface FileServerRoutesById {
__root__: typeof rootServerRouteImport
'/api/middleware-context': typeof ApiMiddlewareContextServerRoute
}
export interface FileServerRouteTypes {
fileServerRoutesByFullPath: FileServerRoutesByFullPath
fullPaths: '/api/middleware-context'
fileServerRoutesByTo: FileServerRoutesByTo
to: '/api/middleware-context'
id: '__root__' | '/api/middleware-context'
fileServerRoutesById: FileServerRoutesById
}
export interface RootServerRouteChildren {
ApiMiddlewareContextServerRoute: typeof ApiMiddlewareContextServerRoute
}

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
parentRoute: typeof rootRouteImport
}
'/': {
id: '/'
path: '/'
fullPath: '/'
preLoaderRoute: typeof IndexRouteImport
parentRoute: typeof rootRouteImport
}
}
}
declare module '@tanstack/react-start/server' {
interface ServerFileRoutesByPath {
'/api/middleware-context': {
id: '/api/middleware-context'
path: '/api/middleware-context'
fullPath: '/api/middleware-context'
preLoaderRoute: typeof ApiMiddlewareContextServerRouteImport
parentRoute: typeof rootServerRouteImport
}
}
}

const rootRouteChildren: RootRouteChildren = {
IndexRoute: IndexRoute,
MergeServerFnMiddlewareContextRoute: MergeServerFnMiddlewareContextRoute,
}
export const routeTree = rootRouteImport
._addFileChildren(rootRouteChildren)
._addFileTypes<FileRouteTypes>()
const rootServerRouteChildren: RootServerRouteChildren = {
ApiMiddlewareContextServerRoute: ApiMiddlewareContextServerRoute,
}
export const serverRouteTree = rootServerRouteImport
._addFileChildren(rootServerRouteChildren)
._addFileTypes<FileServerRouteTypes>()
22 changes: 22 additions & 0 deletions e2e/react-start/server-routes/src/router.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
import { createRouter as createTanStackRouter } from '@tanstack/react-router'
import { routeTree } from './routeTree.gen'
import { DefaultCatchBoundary } from './components/DefaultCatchBoundary'
import { NotFound } from './components/NotFound'

export function createRouter() {
const router = createTanStackRouter({
routeTree,
defaultPreload: 'intent',
defaultErrorComponent: DefaultCatchBoundary,
defaultNotFoundComponent: () => <NotFound />,
scrollRestoration: true,
})

return router
}

declare module '@tanstack/react-router' {
interface Register {
router: ReturnType<typeof createRouter>
}
}
Loading