---
title: "Référence d'API — nodefony/debugbar"
source: docs/api/core/debugbar.md
url: https://nodefony.github.io/nodefony-core/docs/api/core/debugbar/
---


[Documentation](../../../) › [Référence d'API](../../) › [`nodefony`](../) › debugbar

> Générée depuis les déclarations de types publiées de `nodefony` **10.0.0-beta.5** : exactement ce que reçoit une application qui l'installe. Cette page n'existe dans aucun dépôt — pour la corriger, on corrige le TSDoc du code.

## `nodefony/debugbar`

`import { … } from "nodefony/debugbar"` — 16 symboles.

### Classes (3)

#### `DebugBar`

```ts
class DebugBar
```

Widget DOM. Lazy : ne construit le Shadow DOM qu'au `mount()`. Idempotent (un seul `#nodefony-debugbar` par page).

- `constructor(opts?: DebugBarOptions)`
- `mount(): this` — Construit le DOM, branche le realtime et ouvre la connexion.
- `unmount(): void` — Détache listeners, ferme la connexion (si propriétaire) et retire le DOM.
- `setVisible(v: boolean): void` — Affiche/masque la barre (pilotable depuis une app via le handle global).
- `setLive(v: boolean): void` — Active/désactive le temps réel (bouton de la barre) + persiste la préférence.

#### `DebugBarModel`

```ts
class DebugBarModel
```

- `get consoleRequestIds(): ReadonlySet<string> | null` — Les requêtes de la console reconnues jusqu'ici, pour écarter AUSSI leurs lignes sans URL (même règle que `consoleRequestIds` du cœur, tenue au fil de l'eau).
- `setState(state: RealtimeState): void`
- `ingestStats(payload: StatsPayload): void` — Mémorise le dernier tick stats + alimente les séries/peaks.
- `ingestSyslog(payload: SyslogPayload): number` — Comptabilise un batch de logs coalescés (compteurs cumulés + feed).
- `get view(): DebugBarView`

#### `NetworkModel`

```ts
class NetworkModel
```

- `ingest(entry: NetEntry): void` — Upsert d'une entrée (pending puis résolue partagent le même `id`).
- `get(id: number): NetEntry` — L'entrée d'id local `id`, si elle est encore gardée.
- `entries(): NetEntry[]` — Entrées récentes (récent → ancien) pour le rendu.
- `get total(): number`
- `get errors(): number`
- `get pending(): number`
- `totalOf(tooling: boolean): number` — Appels observés depuis l'ouverture de la page, l'outillage compris ou non.
- `errorsOf(tooling: boolean): number` — Appels en échec gardés, l'outillage compris ou non.
- `pendingOf(tooling: boolean): number` — Appels en attente de réponse, l'outillage compris ou non.
- `profileState(requestId: string): ProfileState`
- `setProfileState(requestId: string, state: ProfileState): void`
- `clear(): void`

### Fonctions (5)

#### `computeWaterfall`

```ts
function computeWaterfall(phases: ProfilePhase[]): WaterfallBar[]
```

Calcule le layout proportionnel des phases serveur (waterfall). Pur.

#### `default`

```ts
function mountDebugBar(opts?: DebugBarOptions): DebugBar
```

Monte la debug bar sur la page courante. Idempotent (un seul widget par page). No-op hors navigateur (SSR). Branche un `NodefonySocket` sur le WS realtime et rend l'overlay live.

#### `isNetworkError`

```ts
function isError(e: NetEntry): boolean
```

Vrai si une entrée est en erreur : échec réseau, statut ≥ 400, ou WebSocket fermé sur un code anormal (`1006`, `1011`… — règle du cœur, `accessStatusFamily`).

#### `mountDebugBar`

```ts
function mountDebugBar(opts?: DebugBarOptions): DebugBar
```

Monte la debug bar sur la page courante. Idempotent (un seul widget par page). No-op hors navigateur (SSR). Branche un `NodefonySocket` sur le WS realtime et rend l'overlay live.

#### `phaseTier`

```ts
function phaseTier(name: string): string
```

Mappe un nom de phase vers sa classe de couleur (défaut neutre).

### Interfaces (4)

#### `DebugBarOptions`

```ts
interface DebugBarOptions
```

- `url?: string` — URL/chemin du WS realtime.
- `client?: NodefonySocket` — Client realtime injectable (partage / tests).
- `position?: "bottom" | "top"` — Position verticale du widget.
- `open?: boolean` — Ouvre le panneau au montage.
- `frontend?: DebugBarFrontend` — Contexte frontend (active la carte Frontend + la sonde HMR Vite).
- `network?: boolean` — Active le panneau Network (intercepte `fetch`/`XHR`).
- `profilerBase?: string` — Base du data-plane profiler.
- `env?: string` — Environnement du serveur, connu AU RENDU de la page (`development`…).
- `page?: { requestId?: string; }` — La requête qui a rendu la page, quand le serveur la connaît.

#### `DebugBarView`

```ts
interface DebugBarView
```

Vue dénormalisée consommée par le rendu.

- `state: RealtimeState`
- `appName: string` — Métadonnées app (env, branche git, version) — depuis le bloc `app` des stats.
- `appVersion: string`
- `env: string`
- `debug: boolean`
- `branch: string`
- `cpuPercent: number`
- `cpuPeak: number`
- `cpuCount: number`
- `eventLoopMs: number`
- `eventLoopPeak: number`
- `uptime: number`
- `pid: number`
- `instanceId: string`
- `loadavg: number[]`
- `rss: number`
- `heapUsed: number`
- `heapTotal: number`
- `heapLimit: number`
- `external: number`
- `heapPercent: number` — heapUsed / heapLimit en %, 0 si limite inconnue.
- `heapPeak: number`
- `cpuSeries: number[]` — Séries temporelles (anciens → récents) pour les sparklines.
- `heapSeries: number[]`
- `loopSeries: number[]`
- `logTotal: number` — Total de logs reçus depuis le montage.
- `errorCount: number` — Logs de sévérité ≤ 3 (ERROR/CRITIC/ALERT/EMERGENCY).
- `warnCount: number` — Logs de sévérité === 4 (WARNING).
- `dropped: number` — Logs omis par le coalescing serveur (surcharge).
- `feed: FeedLog[]` — Derniers logs (récents en dernier), capés.

#### `NetEntry`

```ts
interface NetEntry
```

Une entrée du panneau Network (1 appel AJAX observé).

- `id: number` — Id local monotone (clé de rendu, ≠ requestId serveur).
- `method: string`
- `url: string`
- `path: string` — Path seul (sans origin/query) pour l'affichage compact.
- `status: number | null`
- `ok: boolean`
- `durationMs: number | null` — Durée client (ms, envoi → réponse), `null` tant que pending.
- `startedAt: number`
- `requestId: string | null` — `X-Request-Id` de la réponse → clé du profil serveur.
- `traceparent: string | null` — `traceparent` W3C (RFC-propre) de la réponse, pour la corrélation distribuée.
- `pending: boolean` — Vrai tant que la réponse n'est pas arrivée.
- `error: string | null` — Message d'erreur réseau (fetch rejeté / XHR error), sinon `null`.
- `stream?: INetStream` — Flux longue durée (WebSocket, flux d'événements) : son cycle.

#### `WaterfallBar`

```ts
interface WaterfallBar
```

Une barre du waterfall (positions en % du span total).

- `name: string`
- `leftPct: number`
- `widthPct: number`
- `durationMs: number`
- `tier: string` — Classe de couleur CSS (cf STYLES `.wf-<tier>`).

### Types (4)

#### `ProfileEntry`

```ts
type ProfileEntry = IProfileEntry
```

#### `ProfilePhase`

```ts
type ProfilePhase = IProfilePhase
```

#### `ProfileQuery`

```ts
type ProfileQuery = IProfileQuery
```

#### `ProfileState`

```ts
type ProfileState = { status: "loading"; } | { status: "ready"; profile: ProfileEntry; } | { status: "missing"; } | { status: "error"; message: string; }
```

État de chargement d'un profil serveur dans le cache.

---

[← Toutes les références d'API](../../)