feat(dev): scope error clears to the recovering request

packages/nuxt-cli/package.json

@@ -75,7 +75,7 @@
     "exsolve": "^1.2.0",
     "fuzzysort": "^4.0.2",
     "get-port-please": "^3.2.0",
-    "my-bad": "^1.0.1",
+    "my-bad": "^1.2.0",
     "obug": "^3.0.0",
     "package-manager-detector": "^1.9.0",
     "pathe": "^2.0.3",

packages/nuxt-cli/src/dev/error-channel.ts

@@ -26,7 +26,7 @@ export const ERROR_BROADCAST_CHANNEL = 'nuxt:dev:error'
 /** Reports the app forwards; anything else on the wire is ignored. */
 export type DevErrorMessage
   = | { type: 'nuxt:dev:error:report', report: ErrorReport, requestId?: string, request?: string }
-    | { type: 'nuxt:dev:error:clear', id?: string }
+    | { type: 'nuxt:dev:error:clear', id?: string, requestId?: string, request?: string }
     | { type: 'nuxt:dev:error:warning', report: ErrorReport }
     | { type: 'nuxt:dev:error:warning:clear', id?: string }
     | { type: 'nuxt:dev:error:log', entry: LogEntry }
@@ -230,10 +230,14 @@ export function isDevErrorMessage(message: unknown): message is DevErrorMessage
     const { source } = message as { source?: unknown }
     return source === undefined || typeof source === 'string'
   }
+  if (type === 'nuxt:dev:error:clear') {
+    const { requestId } = message as { requestId?: unknown }
+    return requestId === undefined || typeof requestId === 'string'
+  }
   if (type === 'nuxt:dev:error:devtools') {
     return typeof (message as { registered?: unknown }).registered === 'boolean'
   }
-  return type === 'nuxt:dev:error:report' || type === 'nuxt:dev:error:clear' || type === 'nuxt:dev:error:warning' || type === 'nuxt:dev:error:warning:clear'
+  return type === 'nuxt:dev:error:report' || type === 'nuxt:dev:error:warning' || type === 'nuxt:dev:error:warning:clear'
 }
 
 const LOG_LEVELS = new Set<string>(['trace', 'debug', 'info', 'log', 'warn', 'error', 'fatal'] satisfies LogLevel[])
@@ -397,7 +401,15 @@ export function openErrorBridge(handlers: ErrorBridgeHandlers = {}, options: Err
           break
         }
         case 'nuxt:dev:error:clear': {
-          instance.clearError(message.id)
+          if (message.requestId !== undefined || message.request !== undefined) {
+            instance.clearError(message.id, {
+              ...(message.requestId !== undefined ? { requestId: message.requestId } : {}),
+              ...(message.request !== undefined ? { request: message.request } : {}),
+            })
+          }
+          else {
+            instance.clearError(message.id)
+          }
           handlers.onClear?.(message.id)
           break
         }

packages/nuxt-cli/test/unit/error-channel.spec.ts

@@ -142,6 +142,10 @@ describe('the forwarding protocol', () => {
     expect(isDevErrorMessage({ type: 'nuxt:dev:error:sync' })).toBe(false)
     expect(isDevErrorMessage({ type: 'nuxt:dev:error:report', report: {}, request: 'GET /ok' })).toBe(true)
     expect(isDevErrorMessage({ type: 'nuxt:dev:error:report', report: {}, request: 7 })).toBe(false)
+    expect(isDevErrorMessage({ type: 'nuxt:dev:error:clear', requestId: 'page-a' })).toBe(true)
+    expect(isDevErrorMessage({ type: 'nuxt:dev:error:clear', request: 'GET /ok' })).toBe(true)
+    expect(isDevErrorMessage({ type: 'nuxt:dev:error:clear', requestId: 7 })).toBe(false)
+    expect(isDevErrorMessage({ type: 'nuxt:dev:error:clear', request: 7 })).toBe(false)
     expect(isDevErrorMessage(undefined)).toBe(false)
   })
 
@@ -420,6 +424,57 @@ describe('the CLI-owned error channel', () => {
     expect(setError).toHaveBeenNthCalledWith(2, buildReport, undefined, undefined)
   })
 
+  it('should retire an error only for the request the app names when clearing', async () => {
+    const instance = await useErrorChannel()
+    const report = compileReport('/app/app.vue', 3, 1)
+    const close = openErrorBridge()
+
+    const app = new BroadcastChannel(ERROR_BROADCAST_CHANNEL)
+    const pageA = createResponse()
+    const pageB = createResponse()
+    await instance.handler(request(`${DEFAULT_ERROR_CHANNEL}/events?requestId=page-a`), pageA.res)
+    await instance.handler(request(`${DEFAULT_ERROR_CHANNEL}/events?requestId=page-b`), pageB.res)
+
+    app.postMessage({ type: 'nuxt:dev:error:report', report, requestId: 'page-a' })
+    app.postMessage({ type: 'nuxt:dev:error:report', report, requestId: 'page-b' })
+    await vi.waitUntil(() => pageA.chunks.join('').includes('event: error:set') && pageB.chunks.join('').includes('event: error:set'))
+
+    app.postMessage({ type: 'nuxt:dev:error:clear', id: report.id, requestId: 'page-a' })
+    await vi.waitUntil(() => pageA.chunks.join('').includes('event: error:clear'))
+    close()
+    app.close()
+
+    expect(pageA.chunks.join('')).toContain('event: error:clear')
+    expect(pageB.chunks.join('')).not.toContain('event: error:clear')
+    expect(pageB.chunks.join('')).toContain(report.id)
+    expect(instance.current?.id).toBe(report.id)
+  })
+
+  it('should retire an error for every request when cleared without a scope', async () => {
+    const instance = await useErrorChannel()
+    const report = compileReport('/app/app.vue', 3, 1)
+    const close = openErrorBridge()
+
+    const app = new BroadcastChannel(ERROR_BROADCAST_CHANNEL)
+    const pageA = createResponse()
+    const pageB = createResponse()
+    await instance.handler(request(`${DEFAULT_ERROR_CHANNEL}/events?requestId=page-a`), pageA.res)
+    await instance.handler(request(`${DEFAULT_ERROR_CHANNEL}/events?requestId=page-b`), pageB.res)
+
+    app.postMessage({ type: 'nuxt:dev:error:report', report, requestId: 'page-a' })
+    app.postMessage({ type: 'nuxt:dev:error:report', report, requestId: 'page-b' })
+    await vi.waitUntil(() => pageA.chunks.join('').includes('event: error:set') && pageB.chunks.join('').includes('event: error:set'))
+
+    app.postMessage({ type: 'nuxt:dev:error:clear', id: report.id })
+    await vi.waitUntil(() => pageA.chunks.join('').includes('event: error:clear') && pageB.chunks.join('').includes('event: error:clear'))
+    close()
+    app.close()
+
+    expect(pageA.chunks.join('')).toContain('event: error:clear')
+    expect(pageB.chunks.join('')).toContain('event: error:clear')
+    expect(instance.current).toBeUndefined()
+  })
+
   it('should publish a log entry the app forwards, without telling the supervisor', async () => {
     createServer()
     const instance = await useErrorChannel()