TanStack / TanStack/router

Manually calling server route handlers in tests results either in errors or 404

Open
#4,602 2 comments 5 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
15.1k
Forks
1.9k
Avg merge
1d 20h
Merged PRs (30d)
143

Description

Which project does this relate to?

Start

Describe the bug

No way to test the Server Routes. Calling the start handler manually results in various errors.

I think it's an absolute must to be able to write efficient integrational tests for Tanstack. E2E can't cover every use case: mine for instance is integrating my own API router with Tanstack Start, I need to be able to make sure my wrapper is compatible with the current version of Tanstack Start.

Your Example Website or App

not applicable

Steps to Reproduce the Bug or Issue
   const handler = createStartHandler({
      createRouter: () => createRouter({routeTree}),
    })(defaultStreamHandler);
    //process.env.TSS_SERVER_FN_BASE = '/_serverFn';
    const request = new Request('http://localhost:3000/api/auth/login', {
      method: 'POST',
    });

    const res = await handler({request});
    expect(res.status).toBe(200);

This code results in:

"Error: tanstack/start-server-core: TSS_SERVER_FN_BASE must be defined in your environment for createStartHandler()"

If the line is uncommented it results in:
"Error: Only URLs with a scheme in: file, data, and node are supported by the default ESM loader. Received protocol 'tanstack-start-route-tree:'"

    const request = new Request('http://localhost:3000/api/auth/login', {
      method: 'POST',
    });
    const handler = createRequestHandler({
      createRouter: () => createRouter({
        routeTree: serverRouteTree,
        defaultPreload: false,
      }),
      request: request,
    });
    const res = await handler(defaultStreamHandler);
    expect(res.status).toBe(200);

I also came up with this, but it always results in 404 for server routes, which is no surprise of course.

Expected behavior

It returns a Response object as it supposed to.

Ideally I should be able to pass the serverRouteTree into createStartHandler() or createRouter(), at the moment the way serverRouteTree handled is not transparent enough.

It's also fine to use createRequestHandler() for the same purpose, but it simply doesn't work with serverRouteTree...

I don't think it's normal not to be able to test API routes, is it?

Screenshots or Videos

No response

Platform
  • Router / Start Version: 1.125.6
  • OS: Mac but it's irrelevant
  • Browser: irrelevant
  • Browser Version: irrelevant
  • Bundler: none? vitest?
  • Bundler Version: irrelevant
Additional context

No response

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reproducing the issue through createStartHandler() and createRequestHandler() with serverRouteTree, using the Vitest-style test shown in the report. Trace the TSS_SERVER_FN_BASE requirement and the tanstack-start-route-tree loader error. Done means manually invoking a server route returns a Response instead of an error or 404.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
api, backend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Quiet
Clarity
Needs clarification
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.