Skip to content

fix(onboard): serve embedded.js through Nuxt's Vite dev handler - #1130

Merged
antfu merged 1 commit into
mainfrom
fix/onboard-embedded-script
Oct 20, 2026
Merged

antfu merged 1 commit into
mainfrom
fix/onboard-embedded-script

Conversation

@antfubot

Copy link
Copy Markdown
Collaborator

Summary

When @nuxt/devtools is not installed, nuxt dev answers /__devtools/embedded.js with the app's HTML page (content-type: text/html). The browser then rejects the module script, so the onboarding button never shows up. This affects @nuxt/devtools-onboard@4.0.0-beta.6.

The onboarding middleware was mounted at the root of the client Vite server. Nuxt's Vite dev handler only passes a request to Vite when some middleware is mounted on a path longer than /. Otherwise it rewrites the URL to /__skip_vite/..., the middleware's base check fails, and the request falls through to the Nuxt renderer.

The middleware is now mounted on /__devtools, taken from the same base passed to createOnboarding. Connect strips the mount path, so the wrapper puts req.originalUrl back before calling the onboarding middleware.

The module test used a fake middlewares.use(fn) that skipped connect's routing, so it could not catch this. It now mounts the module on a real Vite server in middleware mode. It also checks that Nuxt's routing rule (route.length > 1 && url.startsWith(route)) sends /__devtools/embedded.js to Vite and that the script comes back as JavaScript. This adds vite as a devDependency of the package.

Verification

  • pnpm vitest run packages/devtools-onboard: the new assertions pass. With the old mount restored, offers to install @nuxt/devtools when it is missing fails as expected.
  • loads @nuxt/devtools when it is installed fails on main too, with or without this change. It likely needs @nuxt/devtools built first; not confirmed.
  • pnpm eslint packages/devtools-onboard pnpm-workspace.yaml: clean.
  • Not verified: the curl -i localhost:3000/__devtools/embedded.js repro against nuxt dev in the playground.

This PR was created with the help of an agent.

@cloudflare-workers-and-pages

Copy link
Copy Markdown

Deploying nuxt-devtools with  Cloudflare Pages  Cloudflare Pages

Latest commit: daf70a6
Status: ✅  Deploy successful!
Preview URL: https://0af6aeef.nuxt-devtools.pages.dev
Branch Preview URL: https://fix-onboard-embedded-script.nuxt-devtools.pages.dev

View logs

@antfu
antfu merged commit 745fa41 into main Oct 20, 2026
8 of 9 checks passed
@antfu
antfu deleted the fix/onboard-embedded-script branch October 20, 2026 06:07
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants