Skip to content

docs: load the hub-served client script for manual injection - #596

Open
MFA-G wants to merge 1 commit into
vitejs:mainfrom
MFA-G:docs/manual-client-injection
Open

MFA-G wants to merge 1 commit into
vitejs:mainfrom
MFA-G:docs/manual-client-injection

Conversation

@MFA-G

@MFA-G MFA-G commented Oct 1, 2026

Copy link
Copy Markdown

Description

The manual injection docs still tell users to import @vitejs/devtools/client/inject (and the -passive / -hidden variants). #529 removed those exports, so following the guide fails at module resolution.

The client is now served by the dev server at /__devtools/embedded.js. This PR points both pages at it:

  • Guide → Projects without an HTML entry: one dev-only snippet that appends a module script for /__devtools/embedded.js, built from the dev server's origin. The three per-visibility imports are gone. The client reads embeddedVisibility from the server, so one entry covers all three modes.
  • Kit → Client Script & Client Context: the client script description, the "How injection works" paragraph and sequence diagram (inline bootstrap → embedded.js, no virtual module), the iframe note (the [VITE DEVTOOLS] Skipping in iframe log no longer exists), and the troubleshooting fix and symptom.

The URL uses new URL(import.meta.url).origin because a root-relative /__devtools/embedded.js resolves against the page origin. On a backend-rendered page that origin is the backend, not Vite. new URL('/__devtools/…', import.meta.url) doesn't work either, because Vite rewrites it to /@fs/__devtools/embedded.js (404).

Linked Issues

Closes #589

Additional context

I checked the snippet with the published Vite 8.3.1 and this branch's build. The HTML came from a separate plain HTTP server on another port, and main.js was loaded from the Vite dev server (devtools: { enabled: true }). In headless Chrome, <devframes-dock-embedded> mounted and the hub client context was published. This happened with both the default clientAuth and clientAuth: false. The old import still fails with "./client/inject" is not exported.

pnpm exec eslint on the two files and pnpm -C docs run docs:build pass.

The manual injection examples still imported @vitejs/devtools/client/inject*, which vitejs#529 removed. Point them at /__devtools/embedded.js, which the dev server now serves, and update the client-context page to match.

Closes vitejs#589
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.

docs: manual client injection examples reference removed exports

1 participant