Bug Report: Paraglide i18n Broken Since v1.141.2

[vzdev2124]

Which project does this relate to?

Start

Describe the bug

Paraglide internationalization stopped working starting from TanStack Start v1.141.2
The issue also occurs when cloning the official example directly from this directory: https://github.com/TanStack/router/tree/main/examples/react/start-i18n-paraglide

Your Example Website or App

https://github.com/TanStack/router/tree/main/examples/react/start-i18n-paraglide

Steps to Reproduce the Bug or Issue

1. clone example: https://github.com/TanStack/router/tree/main/examples/react/start-i18n-paraglide
2. npm install
3. npm run dev

Expected behavior

Starting from v1.141.2: Dev server crashes "ERR_TOO_MANY_REDIRECT"

Screenshots or Videos

Platform

• Router / Start Version: v1.141.2 - v1.141.3
• OS: Debian
• Browser: Brave, chrome, firefox

Additional context

Works on earlier versions of TanStack Start.
Regression begins at v1.141.2
Breakage also affects a freshly cloned example with no modifications.

[coderabbitai]

📝 CodeRabbit Plan Mode

Generate an implementation plan and prompts that you can use with your favorite coding agent.

• Create Plan

Examples

• Example 1
• Example 2

🔗 Similar Issues

Possible Duplicates

• Bug Report: Paraglide i18n Broken Since v1.139.4 #5974

🔗 Related PRs

#5317 - fix: prevent HMR to throw error about entrypoints [merged]
#5344 - examples: fix paraglide start example [merged]
#5487 - examples: fix paraglide start link example [merged]
#5647 - test(solid-start): fix dev server for suspense transition [merged]
#5844 - docs(solid-router): i18n paraglide example [merged]

👤 Suggested Assignees

• juliomuhlbauer
• birkskyum
• vzdev2124
• schiller-manuel

---

🧪 Issue enrichment is currently in early access.

To disable automatic issue enrichment, add the following to your .coderabbit.yaml:

issue_enrichment:
  auto_enrich:
    enabled: false

[mustafa-barakat]

This happens after build too with nitro.

When not using urlPatterns config and cookie strategy, it works only with baseLocale, otherwise many redirects too with any language.

I think this is related to #6072

[EthanShoeDev]

Also seeing this issue. Seems like if the incoming request has an empty query param like ?utm_content=&utm_source=something then we get the infinite redirect.

Does not happen with local dev server or with local node js preview build.

It only fails with deployed nitro lambda build.

[MathieuDoyon]

Removing the url strategy stop making the crash. but now I'm losing the language defined in the url first path segment when the cookie is missing

strategy: ["url", "cookie", "preferredLanguage", "baseLocale"],
// to ->
strategy: ["cookie", "preferredLanguage", "baseLocale"],

with url strategy, my error is

TypeError: Cannot read private member #state from an object whose class did not declare it
    at get referrer (node:internal/deps/undici/undici:10694:18)
    at Object.RequestInit (node:internal/deps/undici/undici:4568:35)
    at new Request (node:internal/deps/undici/undici:10404:34)
    at new Request$1 (file:///.../start-i18n-paraglide/node_modules/h3-v2/node_modules/srvx/dist/adapters/node.mjs:112:4)
    at paraglideMiddleware (/.../start-i18n-paraglide/src/paraglide/server.js:105:11)
    at async file:///.../start-i18n-paraglide/node_modules/@tanstack/start-plugin-core/dist/esm/dev-server-plugin/plugin.js:64:30

[mustafa-barakat]

With these packages

  "@inlang/paraglide-js": "2.7.0",
  "@tanstack/react-router": "1.141.6",
  "@tanstack/react-start": "1.141.7",

Strategies
strategy: ["url", "cookie", "preferredLanguage", "baseLocale"]

Switching the server.ts to

import handler from "@tanstack/react-start/server-entry";
import { paraglideMiddleware } from "./paraglide/server";

export default {
  fetch(req: Request): Promise<Response> {
    return paraglideMiddleware(req, () => handler.fetch(req));
  },
};

Seems to fix the issue but may introduce other problems.

[samuelstroschein]

Paraglide JS maintainer here.

I ran PR #6072 through Codex with access to Paraglide's source code.

The most likely regression is in Paraglide’s server middleware
request cloning: it currently (pre-fix) constructs the “next”
request with new Request(url, request) (i.e. passing a Request
object as RequestInit). In runtimes that mix multiple Request
implementations (notably undici + h3/srvx/nitro wrappers),
undici will try to read private fields from that “init” object
and crash with errors like Cannot read private member #state… —
and depending on how the framework handles that failure, it can
surface as redirect loops / ERR_TOO_MANY_REDIRECT.

This is the line of code in the server middleware.

	? new Request(runtime.deLocalizeUrl(request.url), request)
		: // need to create a new request object because some metaframeworks (nextjs!) throw otherwise
			// https://github.com/opral/inlang-paraglide-js/issues/411
			new Request(request);

Given that new Request(input, options) is plain JS, undici should support it https://developer.mozilla.org/en-US/docs/Web/API/Request/Request.

Can someone try to add a try catch around the paraglide middleware/tanstack's server middleware to see if Codex assumption that ERR_TOO_MANY_REDIRECT is caused by an internal throw that isn't surfaced is true?

[mustafa-barakat]

@samuelstroschein

Both requests are of the same type but paraglide requests results to redirect to / which was already redirected to /en before, so it goes in a loop.

@MathieuDoyon How did you get your error?

Please Notice this my router.tsx

import { createRouter } from "@tanstack/react-router";
import { deLocalizeUrl, localizeUrl } from "./paraglide/runtime.js";
// Import the generated route tree
import { routeTree } from "./routeTree.gen";
// Create a new router instance
export const getRouter = () => {
  const router = createRouter({
    routeTree,
    scrollRestoration: true,
    defaultPreloadStaleTime: 0,
    rewrite: {
      input: ({ url }) => deLocalizeUrl(url),
      output: ({ url }) => localizeUrl(url),
    },
  });

  return router;
};

Original Incoming Request

{
  method: 'GET',
  url: 'http://localhost:3888/en/',
  headers: Headers {
    host: 'localhost:3888',
    connection: 'keep-alive',
    'cache-control': 'max-age=0',
    'sec-ch-ua': '"Not(A:Brand";v="8", "Chromium";v="144", "Microsoft Edge";v="144"',
    'sec-ch-ua-mobile': '?0',
    'sec-ch-ua-platform': '"Windows"',
    'upgrade-insecure-requests': '1',
    'user-agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/144.0.0.0 Safari/537.36 Edg/144.0.0.0',
    accept: 'text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.7',
    'sec-fetch-site': 'same-origin',
    'sec-fetch-mode': 'cors',
    'sec-fetch-dest': 'document',
    referer: 'http://localhost:3888/en/',
    'accept-encoding': 'gzip, deflate, br, zstd',
    'accept-language': 'en-US,en;q=0.9,en-GB;q=0.8',
    cookie: 'PARAGLIDE_LOCALE=en'
  },
  destination: '',
  referrer: 'about:client',
  referrerPolicy: '',
  mode: 'cors',
  credentials: 'same-origin',
  cache: 'default',
  redirect: 'follow',
  integrity: '',
  keepalive: false,
  isReloadNavigation: false,
  isHistoryNavigation: false,
  signal: AbortSignal { aborted: false 
}

Paraglide Request Result

{
method: 'GET',
url: 'http://localhost:3888/',
headers: Headers {
  host: 'localhost:3888',
  connection: 'keep-alive',
  'cache-control': 'max-age=0',
  'sec-ch-ua': '"Not(A:Brand";v="8", "Chromium";v="144", "Microsoft Edge";v="144"',
  'sec-ch-ua-mobile': '?0',
  'sec-ch-ua-platform': '"Windows"',
  'upgrade-insecure-requests': '1',
  'user-agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/144.0.0.0 Safari/537.36 Edg/144.0.0.0',
  accept: 'text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.7',
  'sec-fetch-site': 'same-origin',
  'sec-fetch-mode': 'cors',
  'sec-fetch-dest': 'document',
  referer: 'http://localhost:3888/en/',
  'accept-encoding': 'gzip, deflate, br, zstd',
  'accept-language': 'en-US,en;q=0.9,en-GB;q=0.8',
  cookie: 'PARAGLIDE_LOCALE=en'
},
destination: '',
referrer: 'about:client',
referrerPolicy: '',
mode: 'cors',
credentials: 'same-origin',
cache: 'default',
redirect: 'follow',
integrity: '',
keepalive: false,
isReloadNavigation: false,
isHistoryNavigation: false,
signal: AbortSignal { aborted: false }
}

This is the same behavior from Paraglide in both versions of Tanstack start.
In older versions the server handler.fetch didn't redirect so many redirects didn't occur

[DennisJosefsson]

For what it's worth, I'm getting a similar error after updating to the latest versions of Tanstack Start and Router, and I'm not using Paragilde. For me it's the clerkMiddleware, when it calls new Request, undici throws. I can't even console.log the args.request in the clerkMiddleware function without undici complaining.

[EthanShoeDev]

@DennisJosefsson I also hit this on the newest versions. I am also not using paraglide

[schiller-manuel]

@EthanShoeDev what are you using? also clerk?

[DennisJosefsson]

I was able to reproduce my error by starting a new Tanstack Start project and adding this start.ts-file, with the start and router libraries set at 1.141.8. Another project with the same files, but with the very latest versions (1.142.7) instead, works. And from what I can see my main project also works after updating to 1.142.7.

const testMiddleWare = createMiddleware({ type: 'request' }).server(
  async (args) => {
    const request = new Request(args.request.url, {
      headers: args.request.headers,
      method: args.request.method,
      redirect: args.request.redirect,
      cache: args.request.cache,
      signal: args.request.signal,
    })

    console.log(request)

    return await args.next()
  },
)

export const startInstance = createStart(() => {
  return {
    requestMiddleware: [testMiddleWare],
  }
})