sygnal 5.4.0 → 6.0.0

package/src/extra/diagnostics/checks/fetch.ts

@@ -0,0 +1,135 @@
+/**
+ * makeFetchDriver requests (PLAN-3 5-3: the query cache, D79/D80; G-175). Dev-entry codes
+ * (DEV_CODE_SEVERITY):
+ *
+ * SYG630 — a cached request that is not idempotent: `cache: true` or `staleTime` on a
+ *          POST/PUT/PATCH/DELETE (a request with a body defaults to POST) (warn)
+ * SYG631 — `validate` is not a Standard Schema (no `~standard.validate`): the request
+ *          fails (error)
+ * SYG632 — `{ invalidate }` matched no cache entry and no mounted resource (info)
+ * SYG633 — `{ abort: 'X' }` cancels the lane 'X', but this instance sends its `ok: 'X'`
+ *          requests under another `key`, so nothing is cancelled (warn)
+ * SYG635 — `cache: true` / `staleTime` / `{ prefetch }` sent to a driver without a
+ *          `queryCache()` (D88): nothing is cached (warn). The source's `__inspect().cache`
+ *          is undefined without one
+ *
+ * Mechanism: onModel wraps the component's own model stream for every sink whose source
+ * takes the `resources` static (makeFetchDriver and renderComponent's HTTP fake) and checks
+ * each value as it is sent: requests, and each entry of a `{ resources }` declaration.
+ * SYG632 asks the source how many entries/resources the value matches (`__matches`).
+ * Each is reported once per component name and request URL / name.
+ */
+import type {DiagnosticCheck} from '../index'
+import {devReport, once, nameOf} from './shared'
+import {isStandardSchema} from '../../standardSchema'
+
+const IDEMPOTENT = /^(GET|HEAD)$/i
+
+/** instance → reply key lanes it has sent, and ok name → the other key it was sent under */
+const lanes = new WeakMap<object, {used: Set<string>; keyed: Map<string, string>}>()
+
+const fetchSink = (component: any, name: string) => component?.sources?.[name]?.__sygnalStatic === 'resources'
+/** 5-5: the sink's driver has no queryCache() */
+const noCache = (component: any, sink: string) => {
+  const i = component?.sources?.[sink]?.__inspect?.()
+  return !!i && i.cache === undefined
+}
+const reportNoCache = (component: any, sink: string, what: string, url: string) => {
+  if (!noCache(component, sink) || !once(`SYG635:${nameOf(component)}:${what}:${url}`)) return
+  devReport('SYG635', {
+    component,
+    message: `${sink} ${url ? url + ' ' : ''}uses ${what}, but the ${sink} driver has no queryCache(), so nothing is cached`,
+    fix: `Give the driver a cache: makeFetchDriver({ cache: queryCache({ staleTime: 30000 }) }) (import { queryCache } from 'sygnal'); in tests renderComponent(C, { http: { cache: queryCache() } }). Or remove ${what}`,
+    data: {sink, url, what},
+  })
+}
+
+function checkOne(component: any, sink: string, req: any, where: string) {
+  if (!req || typeof req !== 'object') return
+  const name = nameOf(component)
+  const url = typeof req.url === 'string' ? req.url : ''
+  const method = String(req.method || (req.json !== undefined || req.body !== undefined ? 'POST' : 'GET')).toUpperCase()
+  if ((req.cache === true || req.staleTime != null) && !IDEMPOTENT.test(method) && once(`SYG630:${name}:${method}:${url}`)) {
+    devReport('SYG630', {
+      component,
+      message: `${where} ${method} ${url} sets ${req.cache === true ? 'cache: true' : 'staleTime'}, so a cached reply answers it instead of sending it again`,
+      fix: `Cache reads only: remove ${req.cache === true ? 'cache' : 'staleTime'} from the ${method}, and refresh the cached reads after it succeeds with invalidates: ['tag']`,
+      data: {sink, method, url},
+    })
+  }
+  if (req.cache === true || req.staleTime != null) reportNoCache(component, sink, req.cache === true ? 'cache: true' : 'staleTime', url)
+  if ('validate' in req && !isStandardSchema(req.validate) && once(`SYG631:${name}:${url}`)) {
+    devReport('SYG631', {
+      component,
+      message: `${where} ${url} has validate: ${typeof req.validate}, which is not a Standard Schema, so the request fails`,
+      fix: "Pass a Standard Schema object (zod, valibot, arktype, ...: anything with a '~standard'.validate function), e.g. validate: QuoteSchema",
+      data: {sink, url},
+    })
+  }
+}
+
+export function check(component: any, sink: string, req: any) {
+  if (!req || typeof req !== 'object') return
+  const name = nameOf(component)
+  const res = req.resources
+  if (res && typeof res === 'object') {
+    for (const k of Object.keys(res)) checkOne(component, sink, typeof res[k] === 'string' ? {url: res[k]} : res[k], `${name}.resources.${k}:`)
+    return
+  }
+  if (req.prefetch) {
+    const p = req.prefetch
+    reportNoCache(component, sink, '{ prefetch }', typeof p === 'string' ? p : String(p?.url ?? ''))
+    return
+  }
+  if ('invalidate' in req) {
+    const count = component.sources[sink]?.__matches?.(req.invalidate)
+    const what = typeof req.invalidate === 'function' ? 'the predicate' : JSON.stringify(req.invalidate)
+    if (count === 0 && once(`SYG632:${name}:${what}`)) {
+      devReport('SYG632', {
+        component,
+        message: `${sink} { invalidate: ${what} } matched no cache entry and no mounted resource`,
+        fix: "Give the resources (or cached requests) to refresh tags: ['quotes'] and invalidate that tag, or a URL prefix starting with '/' ('/api/quotes')",
+        data: {sink, invalidate: what},
+      })
+    }
+    return
+  }
+  let l = lanes.get(component)
+  if (!l) lanes.set(component, (l = {used: new Set(), keyed: new Map()}))
+  const {ok, error, key, abort} = req
+  if (typeof abort === 'string' && key === undefined) {
+    const other = l.keyed.get(abort)
+    if (other !== undefined && !l.used.has(abort) && once(`SYG633:${name}:${abort}`)) {
+      devReport('SYG633', {
+        component,
+        message: `${sink} { abort: '${abort}' } cancels the requests with key '${abort}', but ${name} sends its ok: '${abort}' requests with key: '${other}', so nothing is cancelled`,
+        fix: `Cancel by that key: { abort: true, key: '${other}' } (or drop the key, so the lane is the ok action)`,
+        data: {sink, abort, key: other},
+      })
+    }
+    return
+  }
+  if (typeof ok === 'string' || typeof error === 'string') {
+    const lane = key ?? ok ?? error
+    l.used.add(lane)
+    if (typeof ok === 'string' && key !== undefined && key !== ok) l.keyed.set(ok, String(key))
+  }
+  checkOne(component, sink, req, `A ${sink} request`)
+}
+
+export const fetchCheck: DiagnosticCheck = {
+  id: 'fetch',
+
+  onModel(component) {
+    const model$ = component?.model$
+    if (!model$ || typeof model$ !== 'object') return
+    for (const sink of Object.keys(model$)) {
+      const s$ = model$[sink]
+      if (!fetchSink(component, sink) || !s$ || typeof s$.map !== 'function') continue
+      model$[sink] = s$.map((req: any) => {
+        try { check(component, sink, req) } catch (_) {}
+        return req
+      })
+    }
+  },
+}

package/src/extra/diagnostics/checks/forms.ts

@@ -0,0 +1,163 @@
+/**
+ * PLAN-5 F-1: `form` behavior diagnostics (dev entry; src/extra/form.ts carries no text).
+ *
+ * The form module calls `__SYGNAL_DIAGNOSTICS__.form(code, ...args)`:
+ *   231  form(schema) with a schema that isn't a Standard Schema: throws the SYG231 Error (in
+ *        production the first validation throws a plain TypeError)
+ *   230  (name, values) an input / focusout from a named field whose name isn't in `values`:
+ *        SYG230 (warn, once per name); the event is ignored
+ *   232  (slice) a submit while submitting or while a queued submit waits for a check: SYG232
+ *        (info, every time); the submit is dropped
+ *   233  (values, output) a valid submit: each top-level `values` key missing from the schema's
+ *        output, SYG233 (warn, once per key): the schema strips it (zod's z.object does). G-377:
+ *        only when every output key is a values key (an output with other keys reshapes: a rename)
+ *   235  (field, request) a check's request with `ok` / `error` / `latest` keys, which the form
+ *        overwrites: SYG235 (warn, once per field)
+ *   234  (submit, key) G-577: a valid submit whose `submit` names one of the form's own actions,
+ *        so it dispatched '<key>.<submit>' instead of the host's action: SYG234 (warn, once per
+ *        key and name), at the submit (the form's own action then often throws: SYG214 / SYG216)
+ * Host checks (onModel, once per component name), for each `uses` entry made by form():
+ *   SYG234 (warn) `submit` missing, not a host model entry, or one of the form's own action names
+ *          (G-577: every action in that form's model, CHECKED_<field> included)
+ *   SYG235 (warn) a `check` key that isn't a field of `values`
+ *   SYG236 (warn) an array of objects in `values` with a row without an `id`
+ *   SYG237 (warn) two form uses of one host with the same form selector (G-374)
+ */
+import type {DiagnosticCheck} from '../index'
+import {devReport, once, nameOf} from './shared'
+import {docsUrlFor} from '../codes'
+import {hasField} from '../../formHelpers'
+
+// the form's own action names (G-577: read from the form's model, so CHECKED_<field> counts)
+const ownActions = (b: any): string[] => Object.keys(b?.model || {})
+const SUBMIT_FIX = (key: string, a: string, own: string[]) =>
+  `Name the submit after a host action the form doesn't define (not ${own.join(', ')}): submit: 'SAVE', and rename the model entry '${a}' to SAVE: { HTTP: (state, values) => ({ url, json: values, ok: '${key}.DONE', error: '${key}.ERRORS' }) }`
+const RESERVED = ['ok', 'error', 'latest']
+
+const what = (v: any): string =>
+  v === null || v === undefined ? String(v)
+  : typeof v == 'function' ? 'a function'
+  : Array.isArray(v) ? 'an array'
+  : typeof v == 'object' ? `an object without ~standard.validate${typeof v.parse == 'function' ? ' (a validator from before Standard Schema?)' : ''}`
+  : `a ${typeof v}`
+
+export function reportForm(code: number, a?: any, b?: any, c?: any): any {
+  if (code == 231) {
+    const err: any = new TypeError(`[Sygnal SYG231] form(schema, options): the schema is ${what(a)}, not a Standard Schema. ` +
+      `Pass a Standard Schema object: a zod, valibot or arktype schema, or an object with '~standard': { version: 1, vendor, validate }. ${docsUrlFor('SYG231')}`)
+    err.code = 'SYG231'
+    throw err
+  }
+  if (code == 230) {
+    if (!once(`SYG230:${a}`)) return
+    devReport('SYG230', {
+      component: 'form',
+      message: `form: a field named '${a}' changed, but '${a}' isn't a field of the form's values (${Object.keys(b || {}).join(', ') || 'none'}); the change is ignored`,
+      fix: `Name the input after a path in values (name="email", name="addresses.<row id>.city"), add '${a}' to values, or move the input out of the form element`,
+      data: {name: a},
+    })
+  } else if (code == 232) {
+    devReport('SYG232', {
+      component: 'form',
+      message: `form: a submit was dropped: ${a?.submitting ? 'the previous submit is still being sent (no form.DONE / form.ERRORS yet)' : 'a submit is already queued, waiting for an async check or an async schema'}`,
+      fix: `Disable the submit button while state.form.submitting (or queued) is true; answer the submit with ok: 'form.DONE', error: 'form.ERRORS'`,
+    })
+  } else if (code == 233) {
+    if (!b || typeof b != 'object' || Object.keys(b).some(k => !(k in (a || {})))) return
+    for (const k of Object.keys(a || {})) {
+      if (!(k in b) && once(`SYG233:${k}`)) devReport('SYG233', {
+        component: 'form',
+        message: `form: values.${k} is not in the schema's output (stripped or renamed), so the submit action doesn't get it under that name (a schema strips keys it doesn't declare)`,
+        fix: `Declare '${k}' in the schema (or make the schema keep unknown keys), or remove it from values; if the schema renames it on purpose, ignore this`,
+        data: {key: k},
+      })
+    }
+  } else if (code == 234) {
+    if (!once(`SYG234:run:${b}:${a}`)) return
+    devReport('SYG234', {
+      component: 'form',
+      message: `form '${b}': a valid submit dispatched '${b}.${a}' (the form's own ${a} action), not the host's '${a}': submit: '${a}' names one of the form's own actions, which next() prefers`,
+      fix: SUBMIT_FIX(b, a, ownActions(c)),
+      data: {key: b, submit: a},
+    })
+  } else if (code == 235) {
+    const set = RESERVED.filter(k => b && k in b)
+    if (set.length && once(`SYG235:req:${a}`)) devReport('SYG235', {
+      component: 'form',
+      message: `form: the check for '${a}' returns a request with ${set.map(k => `'${k}'`).join(', ')}; the form sets them itself (its reply action and latest: true), so they are replaced`,
+      fix: `Return only the request: check: { ${a}: { request: (v) => ({ url, query }), error: (body) => message } }`,
+      data: {field: a, keys: set},
+    })
+  }
+}
+
+/** row ids missing in `values`: the names of the arrays of objects that have a row without an id */
+const missingIds = (v: any, at = '', out: string[] = []): string[] => {
+  if (v && typeof v == 'object') {
+    if (Array.isArray(v) && v.some(r => r && typeof r == 'object' && !Array.isArray(r) && r.id == null)) out.push(at)
+    for (const k in v) missingIds(v[k], at ? `${at}.${k}` : k, out)
+  }
+  return out
+}
+
+export const formsCheck: DiagnosticCheck = {
+  id: 'forms',
+
+  onModel(component) {
+    const view = component?.view, uses = view?.uses
+    if (!uses || typeof uses != 'object') return
+    const name = nameOf(component), sels: Record<string, string> = {}
+    for (const key of Object.keys(uses)) {
+      const b = uses[key]
+      if (!b?.form) continue
+      // G-374: each form listens on its selector inside the host, so two with one selector hear
+      // each other's fields and submits
+      const sel = b.options?.form || 'form'
+      if (sel in sels) {
+        if (once(`SYG237:${name}:${sel}`)) devReport('SYG237', {
+          component,
+          message: `${name}'s forms '${sels[sel]}' and '${key}' both listen on '${sel}', so each hears the other's fields and submits`,
+          fix: `Give each form element its own class and pass it: ${sels[sel]}: form(schema, { ..., form: '.${sels[sel]}' }), ${key}: form(schema, { ..., form: '.${key}' })`,
+          data: {keys: [sels[sel], key], form: sel},
+        })
+      } else sels[sel] = key
+      if (!once(`SYG23x:${name}:${key}`)) continue
+      const o = b.options || {}, values = o.values || {}
+      const model = Object.keys(view.model || {}).map(a => a.split('|')[0].trim()), own = ownActions(b)
+      const clash = own.includes(o.submit)
+      if (typeof o.submit != 'string' || !model.includes(o.submit) || clash) {
+        devReport('SYG234', {
+          component,
+          message: typeof o.submit != 'string' ? `${name}'s form '${key}' has no submit action, so a valid submit dispatches nothing`
+            : clash ? `${name}'s form '${key}' names submit: '${o.submit}', one of the form's own actions; a valid submit dispatches the form's '${key}.${o.submit}'${model.includes(o.submit) ? `, never ${name}'s '${o.submit}' entry` : ''}`
+            : `${name}'s form '${key}' dispatches '${o.submit}' on a valid submit, but ${name} has no model entry '${o.submit}'`,
+          fix: clash ? SUBMIT_FIX(key, o.submit, own)
+            : `Name a host action and add it to the model: submit: 'SIGN_UP', model: { SIGN_UP: { HTTP: (state, values) => ({ url, json: values, ok: '${key}.DONE', error: '${key}.ERRORS' }) } }`,
+          data: {key, submit: o.submit},
+        })
+      }
+      for (const f of Object.keys(o.check || {})) {
+        if (!hasField(values, f)) devReport('SYG235', {
+          component,
+          message: `${name}'s form '${key}' has a check for '${f}', which isn't a field of its values; it never runs`,
+          fix: `Use a field name from values (${Object.keys(values).join(', ')})`,
+          data: {key, field: f},
+        })
+      }
+      for (const at of missingIds(values)) devReport('SYG236', {
+        component,
+        message: `${name}'s form '${key}': values.${at} has rows without an id, so its fields are named by index and errors, touched state and focus don't follow a row when another is removed`,
+        fix: `Give each row a unique id: ${at}: [{ id: 1, ... }] (form.ADD numbers new rows itself)`,
+        data: {key, field: at},
+      })
+    }
+  },
+}
+
+/** Install the `form` hook on the core bridge (form.ts calls it). */
+export function installFormHooks(): () => void {
+  const c = (globalThis as any).__SYGNAL_DIAGNOSTICS__
+  if (!c) return () => {}
+  c.form = reportForm
+  return () => { if (c.form === reportForm) c.form = undefined }
+}

package/src/extra/diagnostics/checks/index.ts

@@ -17,15 +17,56 @@
  * | SYG104 | intent selector only matches inside a child component  | dom.ts         |
  * | SYG105 | EVENTS type emitted-not-selected / selected-not-emitted| events.ts      |
  * | SYG106 | parent prop overwritten by a reserved view argument    | props.ts       |
+ * | SYG112 | reply action has no model entry                        | replies.ts     |
+ * | SYG630 | cached request that isn't idempotent (POST + cache)    | fetch.ts       |
+ * | SYG631 | validate is not a Standard Schema                      | fetch.ts       |
+ * | SYG632 | invalidate matched nothing (info)                      | fetch.ts       |
+ * | SYG633 | abort names a lane its requests don't use              | fetch.ts       |
+ * | SYG635 | cache: true / staleTime / prefetch without queryCache() | fetch.ts       |
+ * | SYG115 | unknown DOM event shorthand (DOM.key(...))             | shorthand.ts   |
+ * | SYG124 | component where a control or selector is expected      | controls.ts    |
+ * | SYG140 | widget emitted an event it doesn't declare             | widgets.ts     |
+ * | SYG142 | widget command not declared (also a reserved name)     | elementCommands.ts, widgets.ts |
+ * | SYG143 | widget tag used as a selector                          | widgets.ts     |
+ * | SYG144 | declared widget event the host also fires (info)       | widgets.ts     |
+ * | SYG660 | widget mount / update / unmount threw (660/661/662)    | widgets.ts     |
+ * | SYG430 | VirtualCollection: no bounded height; SYG431 items without ids; SYG432 item not one element; SYG433 scroll target not in the list; SYG434 bad estimateSize / overscan | virtual.ts |
+ * | SYG125 | control given component statics / bad spec vnode()     | controls.ts    |
+ * | SYG127 | behavior key in initialState / unresolvable uses entry | behaviors.ts   |
+ * | SYG230 | form: field name not in values; SYG231 not a Standard Schema; SYG232 submit dropped (info); SYG233 value missing from the schema output | forms.ts |
+ * | SYG234 | form submit action has no model entry; SYG235 check names an unknown field / sets reply fields; SYG236 rows without an id | forms.ts |
+ * | SYG145 | sortable: item without its id attribute; SYG146 item / handle selector matches nothing; SYG147 from is not an array | sortable.ts |
+ * | SYG116 | EVENTS value with no string type (a function)          | events.ts      |
+ * | SYG130 | href() names no route / leaves out a param             | router.ts      |
+ * | SYG131 | route params the pattern doesn't use                   | router.ts      |
+ * | SYG132 | declaration static never sent: a root without initialState    | router.ts      |
+ * | SYG133 | SPA router inside a Vike app                           | router.ts      |
+ * | SYG422 | timer spec makeTimerDriver() can't run                 | timers.ts      |
+ * | SYG643 | timers/connections/resources/browser with no driver    | timers.ts      |
+ * | SYG663 | browser entry / BROWSER command that can't run         | browserSources.ts |
+ * | SYG664 | browser source the driver wasn't made with             | browserSources.ts |
+ * | SYG665 | browser source failed with no error action             | browserSources.ts |
+ * | SYG668 | intersection / resize with no element to observe       | browserSources.ts |
+ * | SYG238 | a root with a model but no initialState: renders nothing | state.ts       |
+ * | SYG223 | persist pick/omit key not in initialState              | persist.ts     |
+ * | SYG224 | persist on a component that isn't the root             | persist.ts     |
+ * | SYG645 | viewTransitions without makeViewTransitionDOMDriver(), or not an array | viewTransitions.ts |
  * | SYG201 | STATE reducer dropped keys                             | state.ts       |
  * | SYG202 | STATE reducer returned undefined                       | state.ts       |
+ * | SYG221 | set() called with a string                             | state.ts       |
+ * | SYG222 | same object returned after an in-place mutation        | state.ts       |
  * | SYG301 | RxJS operator used on an xstream stream                | rxjsHints.ts   |
  * | SYG401 | Collection `from` missing or not an array              | collections.ts |
- * | SYG501 | strict: view uses positional (props, state, ...) args  | strict.ts      |
- * | SYG502 | strict: STATE reducer returned the unchanged state     | strict.ts      |
- * | SYG504 | strict: 'ACTION | SINK' shorthand model key           | strict.ts      |
+ * | SYG421 | invalid data (dataset) key in a view                   | dataset.ts     |
+ * | SYG612 | a form 6.0 removed (also SYG501/504 statically)        | next.ts        |
+ * | SYG502 | retired in 6.0 (never reported; GS-4)                  | —              |
+ * | SYG508 | strict: select()/errors() round trip on a reply source | replies.ts    |
+ * | —      | D152: shared statics frozen (initialState deep)        | statics.ts     |
  * | —      | inspect(): the runtime app graph (2B)                  | inspect.ts     |
  *
+ * SYG112, SYG130-133 (PLAN-3), SYG115/116/221/421 (G-143) SYG124/125 (PLAN-4 CT-1) and SYG127 (GS-1) are dev-entry-only codes: their severities live in
+ * DEV_CODE_SEVERITY (codes.ts), registered by ./shared, not in the main bundle.
+ *
  * Strict checks (SYG5xx) only report after configureStrict(true) (or
  * renderComponent(C, { strict: true }), or globalThis.__SYGNAL_STRICT__).
  */
@@ -38,16 +79,34 @@ import {eventsCheck} from './events'
 import {propsCheck} from './props'
 import {collectionsCheck} from './collections'
 import {domCheck} from './dom'
+import {shorthandCheck} from './shorthand'
+import {controlsCheck, installControlHooks} from './controls'
+import {elementCommandsCheck, installElementCommandHooks} from './elementCommands'
+import {installWidgetHooks} from './widgets'
+import {installVirtualHooks} from './virtual'
+import {behaviorsCheck} from './behaviors'
+import {formsCheck, installFormHooks} from './forms'
+import {installSortableHooks} from './sortable'
+import {datasetCheck} from './dataset'
 import {strictCheck} from './strict'
+import {repliesCheck} from './replies'
+import {routerCheck, installRouterHooks} from './router'
+import {fetchCheck} from './fetch'
+import {timersCheck, installTimerHooks} from './timers'
+import {installBrowserSourceHooks} from './browserSources'
+import {persistCheck} from './persist'
+import {viewTransitionsCheck} from './viewTransitions'
+import {staticsCheck} from './statics'
 import {installRxjsHints} from './rxjsHints'
 import {inspectCheck, installInspect} from './inspect'
+import {nextHooks} from './next'
 
 export {checkEventBus} from './events'
 export {configureStrict, isStrictEnabled} from './strict'
 export type {EventBusSummary} from './events'
 export {RXJS_HINTS} from './rxjsHints'
 export {inspect} from './inspect'
-export type {InspectGraph, InspectComponent, InspectAction, InspectActionTrigger, InspectChild, InspectSelector, InspectDiagnostic, InspectOptions} from './public'
+export type {InspectResource, InspectCacheEntry, InspectGraph, InspectComponent, InspectAction, InspectActionTrigger, InspectChild, InspectSelector, InspectControl, InspectDiagnostic, InspectOptions, InspectRecentAction} from './public'
 export {listCodes, getCodeInfo} from '../codes'
 export type {DiagnosticCodeInfo} from '../codes'
 
@@ -59,7 +118,20 @@ export const checks: DiagnosticCheck[] = [
   propsCheck,
   collectionsCheck,
   domCheck,
+  shorthandCheck,
+  controlsCheck,
+  elementCommandsCheck,
+  behaviorsCheck,
+  formsCheck,
+  datasetCheck,
   strictCheck,
+  repliesCheck,
+  routerCheck,
+  fetchCheck,
+  timersCheck,
+  persistCheck,
+  viewTransitionsCheck,
+  staticsCheck,
   inspectCheck,
 ]
 
@@ -75,10 +147,31 @@ export function installChecks(): () => void {
   const unregister = checks.map(check => core.registerCheck(check))
   const uninstallHints = installRxjsHints(Stream && Stream.prototype)
   const uninstallInspect = installInspect()
+  const uninstallRouter = installRouterHooks()
+  const uninstallControls = installControlHooks()
+  const uninstallTimers = installTimerHooks()
+  const uninstallBrowser = installBrowserSourceHooks()
+  const uninstallElementCommands = installElementCommandHooks()
+  const uninstallWidgets = installWidgetHooks()
+  const uninstallVirtual = installVirtualHooks()
+  const uninstallForms = installFormHooks()
+  const uninstallSortable = installSortableHooks()
+  // PLAN-4.6 R4: the core reads its hooks from the bridge once per app (checks/next.ts)
+  ;(core.layers ||= new Set()).add(nextHooks)
   const uninstall = () => {
+    core.layers?.delete(nextHooks)
     unregister.forEach(fn => fn())
     uninstallHints()
     uninstallInspect()
+    uninstallRouter()
+    uninstallControls()
+    uninstallTimers()
+    uninstallBrowser()
+    uninstallElementCommands()
+    uninstallWidgets()
+    uninstallVirtual()
+    uninstallForms()
+    uninstallSortable()
     if (core.__uninstallChecks === uninstall) core.__uninstallChecks = undefined
   }
   core.__uninstallChecks = uninstall