Test drive v4.0.0-rc1
I am trying to run version 4.0.0-rc1 on a server in my home network. I am using a local domain, and the port is 8080. On this release, the (embedded) console is not displaying at all. I had no error messages in the console during the startup phase.
http://localdomain.com:8080/ui/console -> redirects to
http://localdomain.com:8080/ui/v2/login/login?authRequest=V2_328122283870650372 this url return this JSON
{"code":5,"message":"Not Found"}
I attempted to set up a custom TypeScript login on my development machine, which connected to the backend on the home server. The display I saw was the language dropdown and the theme switch. I examined the browser's console, and an authentication error appeared. The authentication error is understandable because I was using a service user token, which was generated in the old backend (v3.2.2). The issue is that I cannot access the default console on the backend server, and I am unable to deploy a customised TypeScript login because I have not yet created a service user token.
Server Error fetching custom translations: ConnectError: [unauthenticated] Errors.Token.Invalid (AUTH-7fs1e)
6 Replies
Hi @guidolux , thanks for reaching out! To help you troubleshoot this issue, can you share the details of how you installed Zitadel on your server (steps you followed), and your config files?
Also, did you get the error {"code":5,"message":"Not Found"} even before attempting to set up the custom login v2? Please share any other details that you consider relevant. Thank you!
Hi @Matías , I will get back here with some more details and the configuration files soon. I have started testing the v2 API with the Java Sdk with more advanced configurations, so I can give it a new attempt and report my findings here.
I now know how to provision a new Zitadel instance with a service user and generate a PAT during setup. I will configure the TypeScript custom login again with the correct parameters and will post here my findings. I use the Docker Compose example with the configuration files for the secrets and config, and installed v4.0.0-rc1. Thanks for your help!
I have updated the .env.local file with a valid PAT and followed the hosted login README.md instructions to start the environment, up to the pnpm dev command. In the browser web developer tools, I can see that the I18n (getHostedLoginTranslation) load request succeeds after the changes. I made some progress. However, the following error is now reported in Chrome.
Hey @guidolux, thanks for your patience while I looked into this.
From the screenshot you shared, it seems that the server-rendered HTML that came across the wire doesn’t exactly match the HTML React builds in the browser, so React bails out and shows the error overlay.
The specific mismatch is on the
<body> tag. On the client you’re getting two extra attributes:
Those attributes are injected by the Grammarly browser extension (they appear on every page where Grammarly turns itself on). They do not exist in the HTML that was rendered on the server, so React/Next.js rightly complains.
This happens because Next.js (and React 18+) do a byte-for-byte comparison during hydration. When any extension adds or removes attributes/nodes after the server render, you’ll see the error you’re hitting—even though your own code is perfectly fine.
As a quick way to confirm the diagnosis, you can:
1. Open the page in an incognito/private-window with all extensions disabled → the error should disappear.
2. Or temporarily disable Grammarly for your local domain and refresh.
3. If you inspect the live DOM after hydration you’ll see those Grammarly attributes sitting on the <body>.
In other words, there is nothing wrong with your instance or your custom login UI. Once the Grammarly injection is gone you should be able to continue customizing the hosted login page without hydration errors.Excellent, thanks a lot @Matías !
🎉 Looks like you just helped out another community member! Thanks for being so helpful <@1354542547577344093>! You're now one step closer to leveling up—keep up the amazing peer support! 🚀