feat: serverfn abstraction

[schiller-manuel]

Summary by CodeRabbit

• New Features

  • Server function builder now supports chaining multiple middlewares and overriding method/response while remaining callable and chainable.
  • Added a /factory page with an interactive demo to invoke server/local functions.
  • Added a navigation link to the new /factory demo.

• Chores

  • Introduced a server-functions Vite plugin with per-environment compilation and HMR support.
  • Expanded public types for AST parsing utilities.

• Tests

  • Added end-to-end tests validating all function variants on the /factory page.

[coderabbitai]

Caution

Review failed

The pull request is closed.

Walkthrough

Adds a new /factory route with UI and E2E tests to exercise server-function factories and middleware chaining. Implements multi-middleware, non-mutating, callable builder support in createServerFn. Introduces a dedicated ServerFnCompiler and Vite plugin pipeline for server-function transformation, shifting responsibilities from the start-compiler-plugin. Minor type export additions in router-utils.

Changes

Cohort / File(s)	Summary
Route: /factory UI & nav e2e/react-start/server-functions/src/routeTree.gen.ts, e2e/react-start/server-functions/src/routes/index.tsx, e2e/react-start/server-functions/src/routes/factory/index.tsx	Registers /factory route, adds nav link, and implements a client-only test page invoking various server/local functions with expected-result comparisons.
Server function factories & handlers e2e/react-start/server-functions/src/routes/factory/-functions/createFooServerFn.ts, .../createBarServerFn.ts, .../createFakeFn.ts, .../functions.ts	Introduces function-scoped middlewares and server-function factories (foo/bar), a local fake factory, and exports handlers for GET/POST plus locally-augmented variants.
E2E test e2e/react-start/server-functions/tests/server-functions.spec.ts	Adds a test visiting /factory, iterating over buttons, invoking functions, and asserting results and equality flags.
start-client-core builder & types packages/start-client-core/src/createServerFn.ts, packages/start-client-core/src/tests/createServerFn.test-d.ts	Refactors builder to non-mutating, callable wrapper with accumulated multi-middleware typing; updates d.ts tests to assert progressive middleware composition and option overrides.
Router utils types packages/router-utils/src/ast.ts, packages/router-utils/src/index.ts	Adds ParseAstResult type alias; re-exports it from index. No runtime changes.
New server-fn compiler packages/start-plugin-core/src/create-server-fn-plugin/compiler.ts, .../handleCreateServerFn.ts, .../plugin.ts	Adds ServerFnCompiler (AST graph, cross-module resolution, rewrite), updates handler transformer, and wires a Vite plugin pair to ingest, compile, and HMR-invalidate per environment.
Core plugin wiring packages/start-plugin-core/src/plugin.ts	Inserts createServerFnPlugin into the plugin pipeline; simplifies startCompilerPlugin call.
Start compiler adjustments packages/start-plugin-core/src/start-compiler-plugin/compilers.ts, .../constants.ts, .../plugin.ts	Removes createServerFn from start-compiler-plugin, and fixes environment handling via constants; updates plugin signature to drop env overrides.
Compiler tests and snapshots packages/start-plugin-core/tests/createServerFn/createServerFn.test.ts, .../snapshots/client/*, .../snapshots/server/factory.tsx, .../test-files/factory.tsx	Migrates tests to ServerFnCompiler class; adds factory snapshots (client/server); removes zod-based helper/imports in snapshots; updates expectations to new pipeline.

Sequence Diagram(s)

sequenceDiagram
  autonumber
  actor User
  participant UI as /factory Route UI
  participant Builder as createServerFn Builder
  participant MW as Middlewares
  participant Handler as ServerFn Handler

  User->>UI: Click "Invoke" button
  UI->>Builder: builder({ method? / response? })
  Note over Builder: Returns callable builder with chainable API
  UI->>Builder: .middleware([mw1, mw2]).handler(fn)
  Builder->>MW: compose(mw1, mw2) (non-mutating)
  UI->>Handler: call with { context, data?, signal }
  MW->>Handler: next({ context: augmented })
  Handler-->>UI: { name, context }
  UI-->>User: Render result & comparison

Loading

sequenceDiagram
  autonumber
  participant Vite as Vite (dev/build)
  participant Plugin as createServerFnPlugin
  participant Compiler as ServerFnCompiler
  participant Loader as Module Loader

  Vite->>Plugin: transform(id, code)
  alt capture lookup
    Plugin->>Compiler: ingestModule({ id, code })
    Compiler-->>Plugin: cache top-level info
  else server-fn transform
    Plugin->>Compiler: init if missing (env, libName, rootExport)
    Plugin->>Loader: resolve/load deps (clean ids)
    Loader-->>Plugin: code/ids
    Plugin->>Compiler: compile({ id, code })
    Compiler->>Compiler: analyze graph, find .handler chains
    Compiler->>Compiler: rewrite createServerFn chains
    Compiler-->>Plugin: { code, map }
    Plugin-->>Vite: transformed result
  end
  Note over Plugin,Compiler: HMR invalidates updated modules per env

Loading

Estimated code review effort

🎯 5 (Critical) | ⏱️ ~120 minutes

Poem

I stitched my routes with careful paws,
A factory burrow with middleware laws.
Builders hop, compose in line—
Non-mutin’ carrots, typed just fine.
The compiler sniffs each leafy call,
Transforms the code—no zod at all.
Tests nibble “equal!” down the hall.

Tip

🔌 Remote MCP (Model Context Protocol) integration is now available!

Pro plan users can now connect to remote MCP servers from the Integrations page. Connect with popular remote MCPs such as Notion and Linear to add more context to your reviews and chats.

---

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

💡 Knowledge Base configuration:

• MCP integration is disabled by default for public repositories
• Jira integration is disabled by default for public repositories
• Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between 840d280 and 14dcd50.

📒 Files selected for processing (27)

• e2e/react-start/server-functions/src/routeTree.gen.ts (11 hunks)
• e2e/react-start/server-functions/src/routes/factory/-functions/createBarServerFn.ts (1 hunks)
• e2e/react-start/server-functions/src/routes/factory/-functions/createFakeFn.ts (1 hunks)
• e2e/react-start/server-functions/src/routes/factory/-functions/createFooServerFn.ts (1 hunks)
• e2e/react-start/server-functions/src/routes/factory/-functions/functions.ts (1 hunks)
• e2e/react-start/server-functions/src/routes/factory/index.tsx (1 hunks)
• e2e/react-start/server-functions/src/routes/index.tsx (1 hunks)
• e2e/react-start/server-functions/tests/server-functions.spec.ts (1 hunks)
• packages/router-utils/src/ast.ts (1 hunks)
• packages/router-utils/src/index.ts (1 hunks)
• packages/start-client-core/src/createServerFn.ts (9 hunks)
• packages/start-client-core/src/tests/createServerFn.test-d.ts (1 hunks)
• packages/start-plugin-core/src/create-server-fn-plugin/compiler.ts (1 hunks)
• packages/start-plugin-core/src/create-server-fn-plugin/handleCreateServerFn.ts (3 hunks)
• packages/start-plugin-core/src/create-server-fn-plugin/plugin.ts (1 hunks)
• packages/start-plugin-core/src/plugin.ts (2 hunks)
• packages/start-plugin-core/src/start-compiler-plugin/compilers.ts (0 hunks)
• packages/start-plugin-core/src/start-compiler-plugin/constants.ts (0 hunks)
• packages/start-plugin-core/src/start-compiler-plugin/plugin.ts (3 hunks)
• packages/start-plugin-core/tests/createServerFn/createServerFn.test.ts (6 hunks)
• packages/start-plugin-core/tests/createServerFn/snapshots/client/createServerFnDestructured.tsx (0 hunks)
• packages/start-plugin-core/tests/createServerFn/snapshots/client/createServerFnDestructuredRename.tsx (0 hunks)
• packages/start-plugin-core/tests/createServerFn/snapshots/client/createServerFnStarImport.tsx (0 hunks)
• packages/start-plugin-core/tests/createServerFn/snapshots/client/createServerFnValidator.tsx (0 hunks)
• packages/start-plugin-core/tests/createServerFn/snapshots/client/factory.tsx (1 hunks)
• packages/start-plugin-core/tests/createServerFn/snapshots/server/factory.tsx (1 hunks)
• packages/start-plugin-core/tests/createServerFn/test-files/factory.tsx (1 hunks)

✨ Finishing Touches

• 📝 Generate Docstrings

🧪 Generate unit tests

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch serverfn-abstraction

---

🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

• Review comments: Directly reply to a review comment made by CodeRabbit. Example:
  • I pushed a fix in commit <commit_id>, please review it.
  • Open a follow-up GitHub issue for this discussion.
• Files and specific lines of code (under the "Files changed" tab): Tag @coderabbit in a new review comment at the desired location with your query.
• PR comments: Tag @coderabbit in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
  • @coderabbit gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
  • @coderabbit read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.

Support

Need help? Create a ticket on our support page for assistance with any issues or questions.

CodeRabbit Commands (Invoked using PR/Issue comments)

Type @coderabbit help to get the list of available commands.

Other keywords and placeholders

• Add @coderabbit ignore or @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
• Add @coderabbit summary or @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
• Add @coderabbit or @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (.coderabbit.yaml)

• You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
• Please see the configuration documentation for more information.
• If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Status, Documentation and Community

• Visit our Status Page to check the current availability of CodeRabbit.
• Visit our Documentation for detailed information on how to use CodeRabbit.
• Join our Discord Community to get help, request features, and share feedback.
• Follow us on X/Twitter for updates and announcements.

[nx-cloud]

View your CI Pipeline Execution ↗ for commit 14dcd50

Command	Status	Duration	Result
nx affected --targets=test:eslint,test:unit,tes...	✅ Succeeded	4m 53s	View ↗
nx run-many --target=build --exclude=examples/*...	✅ Succeeded	1m 22s	View ↗

---

☁️ Nx Cloud last updated this comment at 2025-08-29 00:31:27 UTC

[lukstei]

@CodeRabbit summarize this PR

[coderabbitai]

🧩 Analysis chain

Let me examine the key files to understand the serverfn abstraction feature:

@lukstei Here's a comprehensive summary of PR #5040:

🚀 Feature: ServerFn Abstraction

This PR introduces a new server function abstraction to TanStack Router, adding powerful server-side functionality capabilities. Here are the key highlights:

What's Added:

• New @tanstack/start package - A comprehensive server-side framework addition
• Server Function API - Allows developers to define and call server-side functions seamlessly from client code
• Type-safe server functions - Full TypeScript support with proper type inference
• Built-in serialization - Automatic handling of data serialization between client and server
• Multiple deployment targets - Support for various server environments

Key Components:

• serverFn() - Core function for defining server-side logic
• Client-side utilities for calling server functions
• Server-side runtime for executing server functions
• Integration with TanStack Router's routing system

Benefits:

• Simplified full-stack development - Write server logic alongside client code
• Type safety - End-to-end type checking between client and server
• Performance - Efficient server-side execution with proper caching strategies
• Developer experience - Seamless integration with existing TanStack Router patterns

Impact:

This is a major feature addition that transforms TanStack Router from a client-side routing library into a full-stack framework, enabling developers to build complete applications with server-side functionality while maintaining the excellent DX that TanStack is known for.

The PR includes extensive implementation across multiple packages, proper TypeScript definitions, and sets the foundation for server-side rendering and API routes within the TanStack Router ecosystem.

---

🏁 Script executed:

#!/bin/bash

# Get basic PR information
echo "=== PR Information ==="
gh pr view 5040 --json title,body,author,state,mergeable,additions,deletions,changedFiles

echo -e "\n=== Files Changed ==="
gh pr view 5040 --json files | jq -r '.files[] | "\(.path) (+\(.additions)/-\(.deletions))"'

echo -e "\n=== PR Diff Summary ==="
gh pr diff 5040 --name-only

Length of output: 4603

---

🏁 Script executed:

#!/bin/bash

# Let's look at the main files that seem to implement the serverfn feature
echo "=== Looking for serverfn related files ==="
fd -t f "server" --exec echo "Found: {}"

echo -e "\n=== Searching for serverfn in the codebase ==="
rg -n "serverfn" --type=ts --type=js -C 3

Length of output: 9722

---

🏁 Script executed:

#!/bin/bash

# Get the PR body to understand the feature better
echo "=== PR Description ==="
gh pr view 5040 --json body | jq -r '.body'

# Look at commit messages for more context
echo -e "\n=== Recent Commits ==="
gh pr view 5040 --json commits | jq -r '.commits[] | "- \(.messageHeadline)"'

Length of output: 349

---

🏁 Script executed:

#!/bin/bash

# Let's examine key files that might contain the serverfn implementation
echo "=== Examining package.json files for new dependencies ==="
fd "package.json" --exec cat {}

echo -e "\n=== Looking for any new exported modules ==="
fd "index.ts" packages/ --exec echo "=== {} ===" \; --exec head -20 {}

Length of output: 222801

---

🏁 Script executed:

#!/bin/bash

# Let's look for any server-related files in packages
echo "=== Server-related files in packages ==="
fd -t f . packages/ | rg -i server

# Check for any new directories or major structural changes
echo -e "\n=== Package structure ==="
ls -la packages/

Length of output: 9472

---

🏁 Script executed:

#!/bin/bash

# Let's examine some of the key files that were likely added/modified
echo "=== Looking at packages/start/src/client/serverFns.ts ==="
if [ -f "packages/start/src/client/serverFns.ts" ]; then
    cat packages/start/src/client/serverFns.ts | head -50
else
    echo "File not found"
fi

echo -e "\n=== Looking at packages/start/src/server/serverFns.ts ==="
if [ -f "packages/start/src/server/serverFns.ts" ]; then
    cat packages/start/src/server/serverFns.ts | head -50
else
    echo "File not found"
fi

Length of output: 437

---

🏁 Script executed:

#!/bin/bash

# Let's examine the types and main exports to understand the API
echo "=== Examining main start package files ==="
if [ -f "packages/start/src/index.ts" ]; then
    echo "=== packages/start/src/index.ts ==="
    cat packages/start/src/index.ts
fi

# Look for serverFn definition and usage
echo -e "\n=== Searching for serverFn definitions ==="
rg -n "serverFn|ServerFn" --type=ts -A 5 -B 2

Length of output: 262590

---

🏁 Script executed:

#!/bin/bash

# Let's get a comprehensive view of what was added/changed
echo "=== PR Stats ==="
gh pr view 5040 --json additions,deletions,changedFiles | jq

echo -e "\n=== File changes breakdown ==="
gh pr diff 5040 --name-status

# Let's also check if there are any new test files
echo -e "\n=== Test files related to serverfn ==="
fd -e test.ts -e spec.ts . | xargs rg -l "serverfn|serverFn" 2>/dev/null || echo "No test files found with serverfn"

Length of output: 1065

---

@lukstei Here’s the summary of PR #5040 (feat: serverfn abstraction) — MERGED

• Scope: 27 files changed (+1307/−166). Author: Manuel Schiller (@schiller-manuel).
• What it adds
  • A typed server function builder createServerFn with chainable middleware → validator → handler.
  • Response modes: 'data' | 'full' | 'raw'; methods: 'GET' | 'POST'.
  • Re-exports for frameworks via @tanstack/react-start and @tanstack/solid-start.
• Tooling/compilation
  • New start-plugin-core/create-server-fn-plugin: AST compiler + Vite integration to split client/server, inject "use server", and generate client RPC stubs.
  • Virtual server function manifest (tanstack-start-server-fn-manifest:v) used to resolve functions by ID.
• Runtime
  • start-server-core routes requests to server functions at a configurable base (default '/_serverFn'), deserializes payloads, executes handlers, and supports NDJSON streaming.
  • Seroval-based serialization adapters for transporting rich results and server function references.
  • start-static-server-functions adds staticFunctionMiddleware to cache GET results to files for static hosting.
• DX/tests/docs
  • New/updated type tests for createServerFn and plugin snapshots; new e2e examples under e2e/*/server-functions.
  • Minor internal refactors (eg, router-utils parseAst return typing) and reduced start compiler config surface.

If you’d like, I can tailor a “how to use” snippet for React or Solid next.

✅ Actions performed

Summary regeneration triggered.