feat(devtools)!: replace server discovery with the Data Inspector plugin#1034
Conversation
Replace the read-only Nuxt Options Viewer (the DiscoveryJS bundle, nested iframe, serialization RPC, and build step) with a mounted @devframes/plugin-data-inspector member in the Nuxt dock group, backed by a single live `Nuxt Application` source (Nuxt, Nitro, and Vite client/SSR configuration) with four read-only suggested queries. Upgrade the Vite DevTools kit to 0.4.3 and align the whole Devframe family to 0.7.9. BREAKING CHANGE: the Nuxt Options Viewer page and the DiscoveryJS bundle, build scripts, and dependencies are removed. The `getServerData` RPC is kept as a deprecated compatibility shim that emits `NDT_DEP_0009`.
|
Review the following changes in direct dependencies. Learn more about Socket for GitHub.
|
|
Caution Review failedThe pull request is closed. ℹ️ Recent review info⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Plus Run ID: ⛔ Files ignored due to path filters (1)
📒 Files selected for processing (1)
📝 WalkthroughWalkthroughThis change replaces the server discovery page with a Data Inspector integration. It captures live Nitro and Vite configuration in a Estimated code review effort: 4 (Complex) | ~45 minutes 🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✨ Finishing Touches🧪 Generate unit tests (beta)
Warning There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure. 🔧 Checkov (3.3.8)pnpm-workspace.yamlTraceback (most recent call last): Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@packages/devtools/src/integrations/data-inspector.ts`:
- Around line 38-53: Update normalizeViteConfig to derive the sanitized
environments object from config.environments rather than config.env, ensuring
the returned payload removes the original per-environment configuration and does
not repurpose the flat runtime env map. Preserve the existing plugin
sanitization and inlineConfig handling.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 0ee3a9c3-3070-4681-8e71-f4ebc76d9eb6
⛔ Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (16)
docs/content/1.guide/1.features.mddocs/content/2.module/3.migration-v4.mdpackages/devtools-kit/src/_types/rpc.tspackages/devtools-kit/src/diagnostics.tspackages/devtools-kit/test/diagnostics.test.tspackages/devtools/.discoveryrc.cjspackages/devtools/client/composables/utils.tspackages/devtools/client/pages/modules/server-discovery.vuepackages/devtools/package.jsonpackages/devtools/src/integrations/data-inspector.tspackages/devtools/src/module-main.tspackages/devtools/src/server-rpc/index.tspackages/devtools/src/server-rpc/server-data.tspackages/devtools/test/data-inspector.test.tspnpm-workspace.yamltests/e2e/specs/data-inspector.spec.ts
💤 Files with no reviewable changes (3)
- packages/devtools/src/server-rpc/server-data.ts
- packages/devtools/.discoveryrc.cjs
- packages/devtools/client/pages/modules/server-discovery.vue
| function normalizeViteConfig(config: ResolvedConfig): ResolvedConfig { | ||
| return { | ||
| ...config, | ||
| environments: Object.fromEntries( | ||
| Object.entries(config.env ?? {}).map(([key, _]) => { | ||
| return [key, null] | ||
| }), | ||
| ), | ||
| plugins: (config.plugins ?? []).map((i) => { | ||
| const clone = { ...i } | ||
| delete clone.api | ||
| return clone | ||
| }), | ||
| inlineConfig: null, | ||
| } as any as ResolvedConfig | ||
| } |
There was a problem hiding this comment.
🎯 Functional Correctness | 🟠 Major | ⚡ Quick win
🧩 Analysis chain
🌐 Web query:
Vite ResolvedConfig env vs environments fields
💡 Result:
In the Vite ResolvedConfig interface, env and environments serve entirely different purposes related to environment variables and multi-environment architecture, respectively [1][2]. env The env field in ResolvedConfig holds the final, resolved environment variables for the current Vite process [2][3]. - It is a record (key-value pairs) of variables loaded from.env files (filtered by prefixes, typically VITE_) along with other system-level environment variables defined by Vite, such as BASE_URL and MODE [2][3][4]. - This field is populated during the config resolution process by the loadEnv utility [2][3]. environments The environments field is part of Vite's newer Environment API (introduced prominently in Vite 6) [5][1]. - It represents the configuration for multiple independent execution environments (e.g., client, ssr, or custom environments) within a single Vite project [1]. - Unlike the flat, process-level env field, environments contains a record of configured environment options, allowing each environment to have its own specific build and dev configurations (like resolve, define, and build/dev settings) [6][1]. - While the top-level UserConfig allows defining these environments, the ResolvedConfig processes them into a resolved state to manage how different parts of an application are transformed and executed [7][8]. In summary, env is about configuration of variables available to your code at runtime, while environments is about the architectural configuration of the different runtime contexts (like client vs server) in which your code runs [1][2].
Citations:
- 1: https://vite.dev/guide/api-environment
- 2: https://github.com/vitejs/vite/blob/ea6a7a6eb86ebc8ae5cf5aff88446a1b44fecec9/packages/vite/src/node/config.ts
- 3: https://github.com/vitejs/vite/blob/27785f7fcc5b45987b5f0bf308137ddbdd9f79ea/packages/vite/src/node/config.ts
- 4: https://github.com/vitejs/vite/blob/2b7e836f84b56b5f3dc81e0f5f161a9b5f9154c0/packages/vite/src/node/config.ts
- 5: https://vite.dev/guide/api-environment-plugins
- 6: https://github.com/vitejs/vite/blob/v8.0.8/docs/guide/api-environment.md
- 7: https://github.com/vitejs/vite/blob/8e05b61d/packages/vite/src/node/config.ts
- 8: https://github.com/vitejs/vite/blob/130ef31b/packages/vite/src/node/config.ts
🏁 Script executed:
#!/bin/bash
set -euo pipefail
printf '\n== packages/devtools/src/integrations/data-inspector.ts ==\n'
sed -n '1,220p' packages/devtools/src/integrations/data-inspector.ts
printf '\n== search for environments / env handling in relevant files ==\n'
rg -n "config\.environments|config\.env|vite:configResolved|isClient|isServer|normalizeViteConfig" packages/devtools/src -S
printf '\n== package files mentioning shared configuration / Nuxt 5 / Vite 8 ==\n'
rg -n "shared configuration|Nuxt 5|Vite 8|vite:configResolved|vite:extendConfig" packages -SRepository: nuxt/devtools
Length of output: 9103
🏁 Script executed:
#!/bin/bash
set -euo pipefail
# Check the Vite type surface in any vendored docs or lockfile references, without running repo code.
rg -n "interface ResolvedConfig|environments:|env:" . -g '!**/node_modules/**' -g '!**/.git/**' -S | head -n 80Repository: nuxt/devtools
Length of output: 4890
🏁 Script executed:
#!/bin/bash
set -euo pipefail
# Focus on the specific file with line numbers for precise context.
nl -ba packages/devtools/src/integrations/data-inspector.ts | sed -n '30,95p'Repository: nuxt/devtools
Length of output: 191
normalizeViteConfig should strip config.environments, not config.env.
env is Vite's flat runtime env map; environments is the per-environment config branch. As written, the spread keeps the real config.environments intact and replaces the wrong field, so the RPC payload can still carry non-serializable config and the environments key ends up with unrelated env vars.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@packages/devtools/src/integrations/data-inspector.ts` around lines 38 - 53,
Update normalizeViteConfig to derive the sanitized environments object from
config.environments rather than config.env, ensuring the returned payload
removes the original per-environment configuration and does not repurpose the
flat runtime env map. Preserve the existing plugin sanitization and inlineConfig
handling.
The `@vitejs/devtools-kit@0.4.3` release pulls the Devframe family up to
0.7.9, but the Vite DevTools UI client (`@vitejs/devtools`) has no matching
release and stays at 0.4.2, whose prebuilt client speaks the older Devframe
wire protocol. The client/server version skew breaks the DevTools panel: the
dock rail crashes (`undefined.length`) and the Nuxt group + Data Inspector
fail to render and connect ("Failed to get connection meta"). Both 0.7.9 and
0.4.3 are also inside the repo's minimum-release-age window.
Return to the tested Devframe 0.7.7 / kit 0.4.2 baseline. The
`vite:configResolved` capture is retained and verified end-to-end on 0.7.7
(the Data Inspector SPA opens, connects, and shows live nuxt/nitro/vite).
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@pnpm-workspace.yaml`:
- Line 9: Update the `@devframes/plugin-data-inspector` catalog entry to use the
exact version 0.7.7 without a caret or other range prefix, preserving the
intended protocol-compatible dependency pin.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 501751ac-214b-4351-8d10-0f3bf0cd50fd
⛔ Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (2)
packages/devtools/src/integrations/data-inspector.tspnpm-workspace.yaml
🚧 Files skipped from review as they are similar to previous changes (1)
- packages/devtools/src/integrations/data-inspector.ts
| - '@vitejs/devtools-rolldown@0.4.0 || 0.4.1 || 0.4.2' | ||
| - '@vitejs/devtools@0.4.0 || 0.4.1 || 0.4.2' | ||
| - '@devframes/hub@0.6.1 || 0.7.5 || 0.7.7' | ||
| - '@devframes/plugin-data-inspector@0.7.7' |
There was a problem hiding this comment.
🗄️ Data Integrity & Integration | 🟠 Major | ⚡ Quick win
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash
set -euo pipefail
test "$(pnpm --version | cut -d. -f1)" = "11"
pnpm why `@devframes/plugin-data-inspector`
rg -n 'plugin-data-inspector|0\.7\.(7|9)' pnpm-workspace.yaml pnpm-lock.yamlRepository: nuxt/devtools
Length of output: 143
🏁 Script executed:
#!/bin/bash
set -euo pipefail
printf 'pnpm version: '
pnpm --version
printf '\nRelevant workspace lines:\n'
grep -n -A3 -B3 "`@devframes/plugin-data-inspector`" pnpm-workspace.yaml || true
printf '\nLockfile occurrences:\n'
grep -n "`@devframes/plugin-data-inspector`" pnpm-lock.yaml | head -20 || true
printf '\nCatalog entries near line 160:\n'
sed -n '150,175p' pnpm-workspace.yamlRepository: nuxt/devtools
Length of output: 143
🏁 Script executed:
#!/bin/bash
set -euo pipefail
printf 'workspace excerpt:\n'
sed -n '1,40p' pnpm-workspace.yaml
printf '\nplugin-data-inspector references:\n'
grep -n "`@devframes/plugin-data-inspector`" pnpm-workspace.yaml pnpm-lock.yaml || true
printf '\nrelease-age exclusions around line 1-20:\n'
sed -n '1,25p' pnpm-workspace.yamlRepository: nuxt/devtools
Length of output: 2630
Pin @devframes/plugin-data-inspector to 0.7.7
^0.7.7 can drift to later 0.7.x releases once they age in, which reintroduces the protocol incompatibility this change is avoiding. Keep the catalog entry at an exact 0.7.7 pin.
Proposed fix
- '`@devframes/plugin-data-inspector`': ^0.7.7
+ '`@devframes/plugin-data-inspector`': 0.7.7📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| - '@devframes/plugin-data-inspector@0.7.7' | |
| '`@devframes/plugin-data-inspector`': 0.7.7 |
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@pnpm-workspace.yaml` at line 9, Update the `@devframes/plugin-data-inspector`
catalog entry to use the exact version 0.7.7 without a caret or other range
prefix, preserving the intended protocol-compatible dependency pin.
2 participants
Summary
Implements
plans/vite-devtools-integration/04-data-inspector-plugin.md. Replaces the read-only Nuxt Options Viewer (the DiscoveryJS bundle, nested iframe, serialization RPC, and its build step) with a mounted@devframes/plugin-data-inspectormember in theNuxtdock group.The Data Inspector member is always mounted when DevTools is enabled and exposes a single live source,
Nuxt Application, over the current Nuxt / Nitro / Vite configuration:nuxt(options),nitro(options, populated once Nitro is created), andvite(client/ssrenvironment configs);Ecosystem modules add their own sources through the upstream
registerDataSourceAPI — no Nuxt-specific wrapper.Notable decisions
vite:configResolvedhook (per-environmentisClient/isServer). The returned-environment-plugin (applyToEnvironment) path is unreliable under Vite 8 — verified in a browser to leave the configs empty — so this is the only host API that reports both configs semantically.getServerDatakept as a deprecated shim. It is public in@nuxt/devtools-kit's RPC types, so rather than removing it outright it now emitsNDT_DEP_0009and returns the legacyNuxtServerDatashape (vite: { server, client }) with the configs normalized for transport. The live source uses the raw objects.@vitejs/devtools-kit0.4.2 baseline. (An attempt to bump to kit 0.4.3 forced Devframe 0.7.9, but the Vite DevTools UI client@vitejs/devtoolshas no matching release and speaks the older protocol — the resulting client/server skew broke the dock rail; both releases are also within the repo's minimum-release-age window. Reverted.)Nuxtdock group omittedcategory: 'framework'thatnuxt-group.spec.tsalready asserted (the new members rely on it).Removed
Nuxt Options Viewer page,
getServerData's DiscoveryJS backing (server-rpc/server-data.ts), the duplicategetServerConfig,jsonStringifyCircular,.discoveryrc.cjs, thebuild:discovery/dev:discoveryscripts and their invocations, and the@discoveryjs/*deps + catalog entries.getServerConfig(canonical, ingeneral.ts), Runtime Config editing, and Storage editing are unchanged.Verification
pnpm lint,pnpm build,pnpm typecheck, andpnpm test:unit(53 passing, incl. new source-shape / unregister / preset / shim / diagnostic-once tests) pass;pnpm install --frozen-lockfileis clean. Verified end-to-end in a browser: the member mounts undergroupId: nuxt/category: framework, the source picker contains onlyNuxt Application(no example source), the Data Inspector SPA opens and connects, andnuxt/nitro/vitequeries all resolve with live data (vite.client/vite.ssrpopulated). A dev e2e spec is included.This PR was created with the help of an agent.