feat(devtools): unify Data Inspector Vite instance and refresh builtin queries (#1047)

Author: antfubot

packages/devtools/src/integrations/data-inspector.ts

@@ -1,6 +1,6 @@
 importtype{Nitro}from'nitropack'
 importtype{Nuxt}from'nuxt/schema'
-importtype{ResolvedConfig}from'vite'
+importtype{ResolvedConfig,ViteDevServer}from'vite'
 importtype{NuxtDevtoolsServerContext,NuxtServerData}from'../types'
 import{createDataInspectorDevframe,registerDataSource}from'@devframes/plugin-data-inspector'
 import{deprecate,NUXT_DEVTOOLS_GROUP_ID,onDevtoolsReady}from'@nuxt/devtools-kit'
@@ -19,8 +19,7 @@ import { mountDevframe } from '@vitejs/devtools-kit/node'
  */
 interfaceCapturedServerData{
 nitro?: Nitro
-viteClient?: ResolvedConfig
-viteSsr?: ResolvedConfig
+vite?: ViteDevServer
 }
 
 constcaptured: CapturedServerData={}
@@ -70,18 +69,14 @@ export function setup(ctx: NuxtDevtoolsServerContext): void {
 captured.nitro=nitro
 })
 
-// Capture the raw resolved Vite config for each environment. Nuxt fires
-// `vite:configResolved` once with `isClient` and once with `isServer`, for
-// both serial Vite servers and Environment API projections, so the source
-// contract stays exactly `vite: { client, ssr }`. Nuxt marks this hook
-// deprecated, but it is the only current host API that reports both configs
-// semantically; the returned-environment-plugin path is unreliable in Vite 8
-// (Vite resolves those plugins after top-level `configResolved`).
-nuxt.hook('vite:configResolved',(config,env)=>{
-if(env.isClient)
-captured.viteClient=configasunknownasResolvedConfig
-if(env.isServer)
-captured.viteSsr=configasunknownasResolvedConfig
+// Capture the live Vite dev server instance. Nuxt 5 unified the former client
+// and SSR Vite servers into a single dev server, so there is exactly one
+// instance to capture. The server carries far more than the resolved config
+// (which lives at `server.config`): its runtime `environments` (client/ssr),
+// module graph, plugin containers, watcher, and websocket. The Data Inspector
+// engine handles the deep/circular/function-valued branches.
+nuxt.hook('vite:serverCreated',(server)=>{
+captured.vite=serverasunknownasViteDevServer
 })
 
 // Register the single live source early with a non-static factory, so Nuxt
@@ -97,25 +92,23 @@ export function setup(ctx: NuxtDevtoolsServerContext): void {
 data: ()=>({
 nuxt: nuxt.options,
 nitro: captured.nitro?.options,
-vite: {
-client: captured.viteClient,
-ssr: captured.viteSsr,
-},
+vite: captured.vite,
 }),
 queries: [
 {title: 'Overview',query: '',excludeFunctions: true},
-{title: 'Nuxt options',query: 'nuxt',excludeFunctions: true},
-{title: 'Nitro options',query: 'nitro',excludeFunctions: true},
-{title: 'Vite configs',query: 'vite',excludeFunctions: true},
+{title: 'Nuxt modules',query: 'nuxt.modules',excludeFunctions: true},
+{title: 'Vite plugins',query: 'vite.config.plugins',excludeFunctions: true},
+{title: 'Vite config',query: 'vite.config',excludeFunctions: true},
+{title: 'Vite environments',query: 'vite.environments',excludeFunctions: true},
+{title: 'Nitro routes',query: 'nitro.handlers',excludeFunctions: true},
 ],
 })
 
 // Avoid leaking a process-global source (e.g. across test fixtures).
 nuxt.hook('close',()=>{
 unregister()
 captured.nitro=undefined
-captured.viteClient=undefined
-captured.viteSsr=undefined
+captured.vite=undefined
 })
 
 // Mount the Data Inspector's bundled SPA as a member of the Nuxt group. The
@@ -141,20 +134,26 @@ export function setup(ctx: NuxtDevtoolsServerContext): void {
  * use; it will be removed in a future major.
  *
  * Unlike the live source, this returns the legacy `NuxtServerData` shape
- * (`vite: { server, client }`) with the Vite configs normalized for RPC
- * transport.
+ * (`vite: { server, client }`) with the resolved Vite config normalized for RPC
+ * transport. Nuxt 5 unified the former client and SSR Vite servers into a
+ * single dev server instance, but the legacy shape predates that; this shim
+ * keeps the old contract alive independently by reading the one dev server's
+ * resolved config (`server.config`) and projecting it onto both `server` and
+ * `client` (each normalized separately, so consumers that mutate one field
+ * don't affect the other).
  */
 exportfunctiongetServerData(nuxt: Nuxt): NuxtServerData{
 deprecate(nuxt,'NDT_DEP_0009',{
 api: 'getServerData()',
 replacement: 'the Nuxt Application source in the Data Inspector panel',
 })
+constconfig=captured.vite?.config
 return{
 nuxt: nuxt.options,
 nitro: captured.nitro?.options,
 vite: {
-server: captured.viteSsr ? normalizeViteConfig(captured.viteSsr) : undefined,
-client: captured.viteClient ? normalizeViteConfig(captured.viteClient) : undefined,
+server: config ? normalizeViteConfig(config) : undefined,
+client: config ? normalizeViteConfig(config) : undefined,
 },
 // `nuxt.options` is `@nuxt/schema`'s `NuxtOptions` while `NuxtServerData`
 // pins the structurally-identical `nuxt/schema` one; bridge the two.
@@ -166,6 +165,5 @@ export function getServerData(nuxt: Nuxt): NuxtServerData {
  */
 exportfunctionresetCapturedServerData(): void{
 captured.nitro=undefined
-captured.viteClient=undefined
-captured.viteSsr=undefined
+captured.vite=undefined
 }

packages/devtools/test/data-inspector.test.ts

@@ -1,5 +1,5 @@
 importtype{Nuxt}from'nuxt/schema'
-importtype{ResolvedConfig}from'vite'
+importtype{ResolvedConfig,ViteDevServer}from'vite'
 import{
 getDataSource,
 resetDataSources,
@@ -50,12 +50,23 @@ function fakeViteConfig(overrides: Partial<ResolvedConfig> = {}): ResolvedConfig
 }asunknownasResolvedConfig
 }
 
-/** Drive Nuxt's `vite:configResolved` hook for one environment. */
-asyncfunctioncaptureViteEnv(fake: FakeNuxt,envName: 'client'|'ssr',config: ResolvedConfig){
-awaitfake.callHook('vite:configResolved',config,{
-isClient: envName==='client',
-isServer: envName==='ssr',
-})
+/**
+ * Minimal Vite dev server stub. The resolved config lives at `.config`, and the
+ * runtime environments at `.environments`, mirroring `ViteDevServer`.
+ */
+functionfakeViteServer(config: ResolvedConfig=fakeViteConfig()): ViteDevServer{
+return{
+ config,
+environments: {client: {name: 'client'},ssr: {name: 'ssr'}},
+}asunknownasViteDevServer
+}
+
+/**
+ * Drive Nuxt's `vite:serverCreated` hook. Nuxt 5 unified the client and SSR
+ * Vite servers into a single instance, so this fires once with one dev server.
+ */
+asyncfunctioncaptureVite(fake: FakeNuxt,server: ViteDevServer){
+awaitfake.callHook('vite:serverCreated',server)
 }
 
 beforeEach(()=>{
@@ -77,16 +88,18 @@ describe('data-inspector source registration', () => {
 expect(typeofentry!.data).toBe('function')
 })
 
-it('exposes the four read-only suggested queries with function exclusion',()=>{
+it('exposes the read-only suggested queries with function exclusion',()=>{
 const{ nuxt }=fakeNuxt()
 setup({ nuxt }asany)
 
 constqueries=getDataSource('nuxt:application')!.queries!
 expect(queries).toEqual([
 {title: 'Overview',query: '',excludeFunctions: true},
-{title: 'Nuxt options',query: 'nuxt',excludeFunctions: true},
-{title: 'Nitro options',query: 'nitro',excludeFunctions: true},
-{title: 'Vite configs',query: 'vite',excludeFunctions: true},
+{title: 'Nuxt modules',query: 'nuxt.modules',excludeFunctions: true},
+{title: 'Vite plugins',query: 'vite.config.plugins',excludeFunctions: true},
+{title: 'Vite config',query: 'vite.config',excludeFunctions: true},
+{title: 'Vite environments',query: 'vite.environments',excludeFunctions: true},
+{title: 'Nitro routes',query: 'nitro.handlers',excludeFunctions: true},
 ])
 })
 
@@ -98,26 +111,25 @@ describe('data-inspector source registration', () => {
 constdata=awaitresolveSourceData(getDataSource('nuxt:application')!)asany
 expect(data.nuxt).toBe(options)
 expect(data.nitro).toBeUndefined()
-expect(data.vite).toEqual({client: undefined,ssr: undefined})
+expect(data.vite).toBeUndefined()
 })
 
-it('populates Nitro and raw Vite configs after the hooks fire',async()=>{
+it('populates Nitro and the raw unified Vite dev server after the hooks fire',async()=>{
 constfake=fakeNuxt()
 setup({nuxt: fake.nuxt}asany)
 
 constnitro={options: {preset: 'node'}}
 awaitfake.callHook('nitro:build:before',nitro)
 
-constclient=fakeViteConfig({marker: 'client'}asany)
-constssr=fakeViteConfig({marker: 'ssr'}asany)
-awaitcaptureViteEnv(fake,'client',client)
-awaitcaptureViteEnv(fake,'ssr',ssr)
+constserver=fakeViteServer(fakeViteConfig({marker: 'vite'}asany))
+awaitcaptureVite(fake,server)
 
 constdata=awaitresolveSourceData(getDataSource('nuxt:application')!)asany
 expect(data.nitro).toBe(nitro.options)
-// The live source hands the RAW config objects to the Data Inspector engine.
-expect(data.vite.client).toBe(client)
-expect(data.vite.ssr).toBe(ssr)
+// The live source hands the RAW dev server instance to the Data Inspector
+// engine; the resolved config is reachable at `vite.config`.
+expect(data.vite).toBe(server)
+expect(data.vite.config).toBe(server.config)
 })
 
 it('unregisters the source on the Nuxt `close` hook',async()=>{
@@ -131,28 +143,32 @@ describe('data-inspector source registration', () => {
 })
 
 describe('getServerData deprecated shim',()=>{
-it('returns the legacy `vite: { server, client }` shape with normalized configs',async()=>{
+it('projects the unified config onto the legacy `vite: { server, client }` shape, normalized',async()=>{
 constoptions={appId: 'app'}
 constfake=fakeNuxt(options)
 setup({nuxt: fake.nuxt}asany)
 
 constnitro={options: {preset: 'node'}}
 awaitfake.callHook('nitro:build:before',nitro)
-awaitcaptureViteEnv(fake,'client',fakeViteConfig())
-awaitcaptureViteEnv(fake,'ssr',fakeViteConfig())
+awaitcaptureVite(fake,fakeViteServer())
 
 constwarn=vi.spyOn(console,'warn').mockImplementation(()=>{})
 constdata=getServerData(fake.nuxt)
 warn.mockRestore()
 
 expect(data.nuxt).toBe(options)
 expect(data.nitro).toBe(nitro.options)
-// Legacy field naming: `ssr` capture maps to `vite.server`.
+// Nuxt 5 has one Vite dev server; the shim reads its resolved config
+// (`server.config`) and projects it onto both fields.
 expect(data.vite).toHaveProperty('server')
 expect(data.vite).toHaveProperty('client')
+// Each field is normalized independently (separate object identities).
+expect(data.vite.server).not.toBe(data.vite.client)
 // Normalization strips the live Vite branches for RPC transport.
 expect(data.vite.server!.inlineConfig).toBeNull()
 expect((data.vite.server!.plugins[0]asany).api).toBeUndefined()
+expect(data.vite.client!.inlineConfig).toBeNull()
+expect((data.vite.client!.plugins[0]asany).api).toBeUndefined()
 })
 
 it('emits the NDT_DEP_0009 deprecation once per process',()=>{