[ci] Enable Vercel-prod e2e for tanstack-start#1904
Merged
Conversation
The workbench-tanstack-start-workflow Vercel project is now connected, so re-enable the matrix entry that was commented out when the workbench landed. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Contributor
🦋 Changeset detectedLatest commit: 746ca11 The changes in this PR will be included in the next version bump. This PR includes changesets to release 0 packagesWhen changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
Contributor
🧪 E2E Test Results✅ All tests passed Summary
Details by Category✅ ▲ Vercel Production
✅ 💻 Local Development
✅ 📦 Local Production
✅ 🐘 Local Postgres
✅ 🪟 Windows
✅ 📋 Other
|
Contributor
📊 Benchmark Results
workflow with no steps💻 Local Development
▲ Production (Vercel)
🔍 Observability: Nitro workflow with 1 step💻 Local Development
▲ Production (Vercel)
🔍 Observability: Nitro workflow with 10 sequential steps💻 Local Development
▲ Production (Vercel)
🔍 Observability: Nitro workflow with 25 sequential steps💻 Local Development
▲ Production (Vercel)
🔍 Observability: Nitro workflow with 50 sequential steps💻 Local Development
▲ Production (Vercel)
🔍 Observability: Nitro Promise.all with 10 concurrent steps💻 Local Development
▲ Production (Vercel)
🔍 Observability: Nitro Promise.all with 25 concurrent steps💻 Local Development
▲ Production (Vercel)
🔍 Observability: Nitro Promise.all with 50 concurrent steps💻 Local Development
▲ Production (Vercel)
🔍 Observability: Nitro Promise.race with 10 concurrent steps💻 Local Development
▲ Production (Vercel)
🔍 Observability: Nitro Promise.race with 25 concurrent steps💻 Local Development
▲ Production (Vercel)
🔍 Observability: Nitro Promise.race with 50 concurrent steps💻 Local Development
▲ Production (Vercel)
🔍 Observability: Nitro workflow with 10 sequential data payload steps (10KB)💻 Local Development
▲ Production (Vercel)
🔍 Observability: Nitro workflow with 25 sequential data payload steps (10KB)💻 Local Development
▲ Production (Vercel)
🔍 Observability: Nitro workflow with 50 sequential data payload steps (10KB)💻 Local Development
▲ Production (Vercel)
🔍 Observability: Nitro workflow with 10 concurrent data payload steps (10KB)💻 Local Development
▲ Production (Vercel)
🔍 Observability: Nitro workflow with 25 concurrent data payload steps (10KB)💻 Local Development
▲ Production (Vercel)
🔍 Observability: Nitro workflow with 50 concurrent data payload steps (10KB)💻 Local Development
▲ Production (Vercel)
🔍 Observability: Nitro Stream Benchmarks (includes TTFB metrics)workflow with stream💻 Local Development
▲ Production (Vercel)
🔍 Observability: Nitro stream pipeline with 5 transform steps (1MB)💻 Local Development
▲ Production (Vercel)
🔍 Observability: Nitro 10 parallel streams (1MB each)💻 Local Development
▲ Production (Vercel)
🔍 Observability: Nitro fan-out fan-in 10 streams (1MB each)💻 Local Development
▲ Production (Vercel)
🔍 Observability: Nitro SummaryFastest Framework by WorldWinner determined by most benchmark wins
Fastest World by FrameworkWinner determined by most benchmark wins
Column Definitions
Worlds:
❌ Some benchmark jobs failed:
Check the workflow run for details. |
pranaygp
reviewed
May 4, 2026
Comment on lines
+41
to
+59
| TanStack Start runs on Vite, so the Workflow SDK is wired in via the same `workflow/vite` plugin. Add `workflow()` to your Vite config to enable usage of the `"use workflow"` and `"use step"` directives. | ||
| TanStack Start runs on Vite, so the Workflow SDK is wired in via the same `workflow/vite` plugin. Add `workflow()` to the existing `plugins` array in your Vite config — don't replace the other plugins the scaffold sets up. | ||
|
|
||
| ```typescript title="vite.config.ts" lineNumbers | ||
| import { devtools } from "@tanstack/devtools-vite"; | ||
| import { tanstackStart } from "@tanstack/react-start/plugin/vite"; | ||
| import viteReact from "@vitejs/plugin-react"; | ||
| import tailwindcss from "@tailwindcss/vite"; | ||
| import { nitro } from "nitro/vite"; | ||
| import { defineConfig } from "vite"; | ||
| import { workflow } from "workflow/vite"; | ||
|
|
||
| export default defineConfig({ | ||
| plugins: [ | ||
| workflow(), // [!code highlight] | ||
| devtools(), | ||
| tanstackStart(), | ||
| viteReact(), | ||
| nitro(), | ||
| tailwindcss(), |
Contributor
There was a problem hiding this comment.
this might get outdated quickly as the tanstack start bootstrap code changes, and it make the guide look longer like we need all these things..
perhaps simpligy the guide to just show the detlas and use ... in place for existing stuff. my understanding is we just need workflow, nitro and tanstackStart are the minimal plugins needed here for this code sample
Member
Author
There was a problem hiding this comment.
Done — collapsed to just the workflow() delta with // ... for the rest of the scaffold plugins.
pranaygp
reviewed
May 4, 2026
| ``` | ||
|
|
||
| <Callout> | ||
| Plugin order between `workflow()` and the rest of the TanStack/Vite plugins doesn't matter for this integration; we list `workflow()` first so the `"use workflow"` and `"use step"` transforms run before anything else processes the file. |
Contributor
There was a problem hiding this comment.
seems right from my 1 off agentbut does this sound right to you? 🤔 am kinda surprised by this
Member
Author
There was a problem hiding this comment.
On reflection, no — vite plugins do run in order for transforms, so it is safer to put workflow() first. Dropped the contradictory callout and folded the rationale into the prose.
pranaygp
reviewed
May 4, 2026
|
|
||
| ```typescript title="src/workflows/user-signup.ts" lineNumbers | ||
| import { sleep } from "workflow"; | ||
| import { FatalError, sleep } from "workflow"; |
Contributor
There was a problem hiding this comment.
actually sorry let's revert this back to how it was (fatalerror being imported in the next example). that's what all the other code samples do and it incrementally builds up only importing FatalError when needed for next step
Member
Author
There was a problem hiding this comment.
Reverted — FatalError is back in the second snippet so the guide builds up imports incrementally like the others.
pranaygp
reviewed
May 4, 2026
| npm run dev | ||
| ``` | ||
|
|
||
| The dev server listens on `http://localhost:3000`. If something else is already on `3000`, Vite silently falls through to the next free port (`3001`, `3002`, …) — adjust the URLs below to match. Pin the port by passing `--port 3000` to the dev script if that matters for you. |
Contributor
There was a problem hiding this comment.
honestly unnecessary and self-evident I think. can skip this
pranaygp
approved these changes
May 4, 2026
Contributor
pranaygp
left a comment
pranaygp
left a comment
There was a problem hiding this comment.
left some comments to simplify docs guide :)
…rbo.json Without this declaration, Turbo strips WORKFLOW_PUBLIC_MANIFEST from the env at build time on Vercel even though it is set on the project (and vercel.json#env provides it). The result is that the workflow nitro module sees the env var unset during \`vite build\` and skips registering the manifest handler, so \`/.well-known/workflow/v1/manifest.json\` 404s in prod and every e2e test that calls \`fetchManifest()\` fails before it can reach the workflow under test. Other workbench apps inherit \`env: ["WORKFLOW_PUBLIC_MANIFEST"]\` from the root turbo.json's build task, but that inheritance evidently doesn't satisfy Turbo's per-package env filter when the package's own turbo.json overrides the build task (which all the workbenches do, to set framework-specific \`outputs\`). Declaring env explicitly at the package level fixes the production build and silences the related warning at the same time. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- Show only the workflow() delta in the vite.config.ts snippet (with
ellipses for the existing scaffold plugins) so the guide doesn't drift
every time TanStack changes its bootstrap.
- Drop the plugin-order Callout and fold its rationale into the prose; the
callout was self-contradictory ("doesn't matter, but we put it first").
- Move the FatalError import back into the second code sample so the guide
still incrementally builds up imports as readers go, matching the other
framework guides.
- Drop the dev-server port-3000 paragraph; it's self-evident.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Signed-off-by: Peter Wielander <mittgfu@gmail.com>
Signed-off-by: Peter Wielander <mittgfu@gmail.com>
TooTallNate
approved these changes
May 4, 2026
Member
TooTallNate
left a comment
TooTallNate
left a comment
There was a problem hiding this comment.
Verified each piece of what's actually in the current diff:
CI matrix re-enable. The project ID being uncommented (prj_643jeVugTMq5ivsOFQHcbLG1qcnu) matches the comment-block above; the original "TODO: re-enable" rationale was specifically waiting on the Vercel project connection. Tanstack-start is already covered by the local-dev/local-prod/local-postgres matrices via scripts/create-test-matrix.mjs, so this is purely adding the prod e2e leg. ✓
Docs scaffold command update. Verified that @tanstack/cli is the canonical replacement — pulled the latest (v0.66.0) from npm and npx @tanstack/cli create --help returns the expected tanstack create [options] [project-name] interface. The old @tanstack/create-start package is still on npm at v0.59.29 but is at a much lower version stream than @tanstack/cli, so the new command is clearly the canonical scaffold path. ✓
Vite config snippet rework. Scaffolded a fresh app via the new CLI to verify the rationale: the generated vite.config.ts now has four plugins (devtools(), tailwindcss(), tanstackStart(), viteReact()), not just tanstackStart() like the old docs example showed. Switching to an additive snippet ("the existing tanstackStart(), nitro(), and any other plugins") is more accurate than the old complete-but-incomplete example. ✓
"List it first" advice. Verified against workbench/tanstack-start/vite.config.ts — the workbench's own config has [workflow(), tanstackStart(), nitro(), viteReact()] with workflow first, matching the docs guidance. ✓
Observability port hint. :3456 is the right port for npx workflow web. Trivial improvement. ✓
One thing worth fixing before merge
The PR description still describes a @types/react dedupe fix as one of the two changes, but those package.json/lockfile changes aren't in the current diff — they landed earlier (the workspace already has react@19.2.4 and @types/react@19.1.13 on main). Worth trimming the description so reviewers don't search for a phantom fix.
Tiny nit (non-blocking)
In the new vite.config snippet, // ... after the imports is a little terse — // ... your other imports would make it clearer that the user is supposed to merge their own imports there. Easy to do later, not worth a re-review.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Two changes:
Re-enable the
tanstack-startmatrix entry in thee2e-vercel-prodjob, which was commented out when the workbench app landed in [workbench] Add TanStack Start workbench #1875 because the Vercel project wasn't connected yet. The project is now set up.Fix the
@types/reactmismatch breaking nextjs-turbopack/nextjs-webpack preview builds. When [workbench] Add TanStack Start workbench #1875 added the tanstack-start workbench, its package.json pinned@types/react@19.2.3/@types/react-dom@19.2.3while every other workbench used^19(resolved to19.1.13). With two@types/reactcopies in the workspace, framer-motion'sMotionStyle(computed fromCSSProperties) was built against one copy while the consuming code referenced another, surfacing on Vercel CI as:This started failing on
example-nextjs-workflow-turbopackandexample-nextjs-workflow-webpackexactly at the SHA where [workbench] Add TanStack Start workbench #1875 landed. Pinning tanstack-start to the same versions nextjs-turbopack uses (react@19.2.4,@types/react@19.1.13,@types/react-dom@19.1.9) makes pnpm dedupe to a single copy across the workspace.Test plan
cd workbench/nextjs-turbopack && pnpm buildsucceeds.cd workbench/tanstack-start && pnpm buildsucceeds.pnpm install,grep "@types/react@" pnpm-lock.yamlshows only one version (19.1.13).Vercel – example-nextjs-workflow-turbopackandVercel – example-nextjs-workflow-webpackdeployments succeed.E2E Vercel Prod Tests (tanstack-start)runs against the new project and passes.🤖 Generated with Claude Code