diff --git a/scripts/extract-diagnostics.mjs b/scripts/extract-diagnostics.mjs index be26d4d92..489046a6b 100644 --- a/scripts/extract-diagnostics.mjs +++ b/scripts/extract-diagnostics.mjs @@ -70,7 +70,6 @@ const STANDALONE_REWRITES = [ // error, so the map tracks the skill. const FIX_STARTS = { ACTION_CALLED_IN_OWNED_SCOPE: "Actions are imperative entry points", - BINDING_SLOT_POSITION: "The rule: a slot property is a JSX attribute value", CLEANUP_IN_FORBIDDEN_SCOPE: "return a cleanup function from the callback", EFFECT_WRITES_OWN_SOURCE: "The written value is a function of what the effect reads", @@ -79,7 +78,7 @@ const FIX_STARTS = { LAZY_ASSET_UNMAPPED: "This is bundler-plugin configuration", PENDING_ASYNC_UNTRACKED_READ: "Async values must be read where tracking", RUN_WITH_DISPOSED_OWNER: "This usually means a stale owner", - SSR_BOUNDARY_WATERFALL: "the same repairs apply, in the same order", + SSR_BOUNDARY_WATERFALL: "The same repairs apply, in the same order", SSR_RENDER_ERROR_CONTAINED: "In every case the repair is", SSR_STREAM_ABANDONED: "At volume it is the cost", UNRECOGNIZED_INSERT_VALUE: "Usually a component function inserted", diff --git a/src/routes/(5)guides/(14)testing.mdx b/src/routes/(5)guides/(14)testing.mdx index 0ebd31efb..702f9ecc3 100644 --- a/src/routes/(5)guides/(14)testing.mdx +++ b/src/routes/(5)guides/(14)testing.mdx @@ -146,15 +146,10 @@ The configuration above sets `globals: false`, so the explicit `afterEach(cleanu Choose browser mode when jsdom cannot provide the behavior that the test needs. The maintained browser-mode template uses the Playwright provider with headless Chromium. -:::note[Browser mode still needs jsdom installed] -When `test.environment` is unset, `@solidjs/vite-plugin` supplies a jsdom environment and Vitest resolves that dependency before it starts the browser pool. -Without jsdom, the Chromium test can pass while the Vitest command exits with a missing-dependency error. -::: - For a new test setup, install the complete dependency set: ```sh -pnpm add -D vitest jsdom @solidjs/testing-library @testing-library/jest-dom @vitest/browser-playwright playwright +pnpm add -D vitest @solidjs/testing-library @testing-library/jest-dom @vitest/browser-playwright playwright pnpm exec playwright install chromium ``` @@ -380,11 +375,11 @@ The write is staged and the batch has not landed when the next line runs. Call `flush()` after the event and before the assertion. For an async source, `flush()` does not help; await `resolve(() => value())` or use an asynchronous query. -### The Chromium test passes but Vitest exits with a missing-dependency error +### A component test fails with `document is not defined` -jsdom is not installed. -`@solidjs/vite-plugin` supplies a jsdom environment when `test.environment` is unset, and Vitest resolves that dependency before starting the browser pool. -Keep `jsdom` in the development dependencies alongside the browser provider. +The `test` block does not set `environment`, so Vitest runs the file in Node. +`@solidjs/vite-plugin` does not choose a test environment. +Set `environment: "jsdom"` (or `"happy-dom"`) for component tests, or enable browser mode. ### A server test runs under jsdom diff --git a/src/routes/(6)migration/(0)from-solid-1.mdx b/src/routes/(6)migration/(0)from-solid-1.mdx index 246c07306..ebc706fcb 100644 --- a/src/routes/(6)migration/(0)from-solid-1.mdx +++ b/src/routes/(6)migration/(0)from-solid-1.mdx @@ -397,6 +397,8 @@ Treat those imports as host-integration work and confirm them against the owning ## Update tests Update test compilation to use the renderer's JSX runtime. +The Vite plugin no longer sets `test.environment`. +Set `environment: "jsdom"` (or `"happy-dom"`) in the Vitest configuration for component tests; without it, Vitest runs them in Node. For web component tests, resolve the browser and development package conditions so tests exercise `@solidjs/web` rather than the server entry. Keep Testing Library cleanup or call render disposers explicitly. diff --git a/src/routes/reference/(1)solid-js/(8)diagnostics/(0)index.mdx b/src/routes/reference/(1)solid-js/(8)diagnostics/(0)index.mdx index ebf4bd555..b2d1dba42 100644 --- a/src/routes/reference/(1)solid-js/(8)diagnostics/(0)index.mdx +++ b/src/routes/reference/(1)solid-js/(8)diagnostics/(0)index.mdx @@ -54,7 +54,6 @@ Naming your memos and effects (`{ name }`) turns the trailing `effect` in the `i | [`ASYNC_OUTSIDE_LOADING_BOUNDARY`](/reference/solid-js/diagnostics/async-outside-loading-boundary) | `async` | `warn` | Async computation outside Loading boundary (non-halting; root mount is deferred) | | [`ASYNC_STORE_SETTER`](/reference/solid-js/diagnostics/async-store-setter) | `write` | `error` | Store setter callback returned a Promise (setters are synchronous transactions) | | [`ASYNC_WATERFALL`](/reference/solid-js/diagnostics/async-waterfall) | `perf` | `info`, `warn` | 2+/3+ sequential async flights, origin-proven (attribution enabled) | -| [`BINDING_SLOT_POSITION`](/reference/solid-js/diagnostics/binding-slot-position) | `ssr`, `render` | `warn`, `error` | Binding-slot value where it cannot bind; `data.reason` names the position (spread is an error and throws), client reasons `orphan`/`fill-shape` | | [`CLEANUP_IN_FORBIDDEN_SCOPE`](/reference/solid-js/diagnostics/cleanup-in-forbidden-scope) | `lifecycle` | `error` | `onCleanup` inside trackedEffect/onSettled | | [`DYNAMIC_ASYNC_COMPONENT`](/reference/solid-js/diagnostics/dynamic-async-component) | `ssr` | `error` | An async `dynamic()` source landed on a client component function, which cannot serialize for adoption; the memo rejects (observe + dev; rejects in every tier) | | [`EFFECT_RELAY_TEAR`](/reference/solid-js/diagnostics/effect-relay-tear) | `perf` | `info`, `warn` | Reader ran twice for one root change because an effect relayed it; `warn` when derivable or repeated (attribution enabled) | @@ -105,8 +104,10 @@ Naming your memos and effects (`{ name }`) turns the trailing `effect` in the `i | [`SSR_SUBTREE_ABANDONED`](/reference/solid-js/diagnostics/ssr-subtree-abandoned) | `ssr` | `warn` | A failed fragment's pending descendants were discarded (observe + dev) | | [`SSR_UNDECLARED_LIVE_SOURCE`](/reference/solid-js/diagnostics/ssr-undeclared-live-source) | `ssr` | `warn` | A document render is still pumping an async iterable in server-component scope 5s in — declare the function `live(...)` or bound the source (dev) | | [`STACKED_HOLDS`](/reference/solid-js/diagnostics/stacked-holds) | `responsiveness` | `warn` | 3+ interactions were waiting in one hold when it committed — repeats piled behind the same source (attribution enabled) | +| [`STORE_WRITE_OUTSIDE_SETTER`](/reference/solid-js/diagnostics/store-write-outside-setter) | `write` | `warn` | Store proxy written, deleted from, or defined on outside its setter; the write is ignored (once per store object and key) | | [`STRICT_READ_UNTRACKED`](/reference/solid-js/diagnostics/strict-read-untracked) | `strict-read` | `warn` | Untracked reactive read in component/effect body | | [`SYNC_NODE_RECEIVED_ASYNC`](/reference/solid-js/diagnostics/sync-node-received-async) | `lifecycle` | `error` | `sync: true` computation returned a Promise / AsyncIterable | +| [`UNCOMMITTED_INPUT_OVERWRITTEN`](/reference/solid-js/diagnostics/uncommitted-input-overwritten) | `render` | `warn` | A stateful property binding (`value`/`checked`/…) re-wrote an unchanged value over an edit the user never committed to the signal (dev; client) | | [`UNRECOGNIZED_INSERT_VALUE`](/reference/solid-js/diagnostics/unrecognized-insert-value) | `render` | `warn` | Value at an insert position the renderer cannot render; skipped (dev; server and client) | | [`UNSCOPED_HOLE_ALLOCATED_IDS`](/reference/solid-js/diagnostics/unscoped-hole-allocated-ids) | `render` | `warn` | Unscoped hole was handed a function whose content took ids at a position the other side does not share; keys permute (dev) | | [`UNSTABLE_LIST_IDENTITY`](/reference/solid-js/diagnostics/unstable-list-identity) | `perf` | `warn` | `mapArray`/`For` recreated rows for equivalent items (attribution enabled) | diff --git a/src/routes/reference/(1)solid-js/(8)diagnostics/binding-slot-position.mdx b/src/routes/reference/(1)solid-js/(8)diagnostics/binding-slot-position.mdx deleted file mode 100644 index 21c67ee4c..000000000 --- a/src/routes/reference/(1)solid-js/(8)diagnostics/binding-slot-position.mdx +++ /dev/null @@ -1,62 +0,0 @@ ---- -title: "BINDING_SLOT_POSITION" -category: "Diagnostics" -use_cases: "binding_slot_position diagnostic, console warning repair, diagnostics assertion" -tags: - - "diagnostics" - - "ssr" - - "render" - - "warn" - - "error" - - "reference" - - "v2" -version: "2.0" -description: "BINDING_SLOT_POSITION: Binding-slot value where it cannot bind; `data.reason` names the position (spread is an error and throws), client reasons `orphan`/`fill-shape`." -source_repo: "solidjs/solid" -source_ref: "next" -source_path: "packages/solid/skills/reactivity-diagnostics/SKILL.md" ---- - -{/* Generated by scripts/extract-diagnostics.mjs from packages/solid/skills/reactivity-diagnostics/SKILL.md and packages/solid/diagnostics.json in solidjs/solid. Edit the skill, then regenerate. */} - -Binding-slot value where it cannot bind; `data.reason` names the position (spread is an error and throws), client reasons `orphan`/`fill-shape`. - -## What you saw - -- **Kind:** `ssr`, `render` -- **Severity:** `warn` (code that works but is structurally wrong or expensive) or `error` (broken behavior) - -The console report opens with `[BINDING_SLOT_POSITION]` and the message, then an `in` line naming the owners that enclose the subject, root first, and an `at` line with the source location when the code was compiled with one. -In a captured artifact the same finding is an event with `code: "BINDING_SLOT_POSITION"`, `ownerPath`, and `loc`. -[Diagnostics](/reference/solid-js/diagnostics#read-a-report) explains each line. - -## Why it fires - -A binding slot's property (`const row = props.row(args); row.done`) landed where the server template cannot bind it. - -:::note[Server rendering] -The server runtime reports on the same channel, with the same `in › ` line. -Two groups. -**Findings** ([`SSR_RENDER_ERROR_CONTAINED`](/reference/solid-js/diagnostics/ssr-render-error-contained), [`SSR_SUBTREE_ABANDONED`](/reference/solid-js/diagnostics/ssr-subtree-abandoned), [`SSR_STREAM_ABANDONED`](/reference/solid-js/diagnostics/ssr-stream-abandoned), [`LATE_HEADER_WRITE`](/reference/solid-js/diagnostics/late-header-write), [`DYNAMIC_ASYNC_COMPONENT`](/reference/solid-js/diagnostics/dynamic-async-component), [`SERVER_ERROR_SANITIZED`](/reference/solid-js/diagnostics/server-error-sanitized), [`FRAME_MARKER_CORRUPTED`](/reference/solid-js/diagnostics/frame-marker-corrupted)) are facts about a render that exist in observe builds too — an APM sees them in production; in dev they print. -**Checks** (the rest, [`SSR_BOUNDARY_WATERFALL`](/reference/solid-js/diagnostics/ssr-boundary-waterfall) and [`SSR_CLIENT_CONTENT_MASKED`](/reference/solid-js/diagnostics/ssr-client-content-masked) included) are dev-only guidance. -A captured artifact from a server render carries both. -::: - -## How to fix it - -The rule: a slot property is a JSX attribute value, whole, and nothing else. -`data.reason`: `"spread"` (throws — the slot's whole return spread onto an element; name each position instead), `"stringified"` (coerced into a string — a template literal, a concatenation), `"coerced"` (used in an expression — a comparison, arithmetic, a branch on its result; the server has no value to compute with, so decide in the client fill and return the decided value), `"inline"` (reached `class`/`style` inside template quotes — the element was compiled without the `serverComponents` compiler option), `"text"` (placed as text, not a bindable position yet), `"markup"` (read off a slot whose client fill returned content, not an object), `"server-local"` (a `ref`/`on*` position got a plain server function — bind a slot property or an `action=`), `"tuple"` (an `on*` position got an array — return the `[handler, data]` tuple from the fill instead), `"reserved-key"` (the fill's object used a key the slot's range occupies), `"orphan"` (client, kind `render`: an element carries markers for an occurrence that can never bind — `data.why` `"fill"`, no client fill for the prop; `"record"`, a called occurrence with no args record once none can arrive, which is the protocol out of step — client and server from different builds — not a fill mistake). -For `stringified`/`coerced`/`inline`/`text` NOTHING renders at the position on either face, so the misuse shows on the first render, not the first refetch. -Truthiness (`if (row.done)`) has no hook and is the one misuse only the rule catches — a stand-in is always truthy. -The fuller guide is `@solidjs/web`'s `skills/server-components/SKILL.md`. - -## In tests - -`captureArtifact` from `@solidjs/diagnostics` runs a scenario with the diagnostics channel open and returns the events it saw. -`expectNoDiagnostics(artifact)` fails while `BINDING_SLOT_POSITION` is among them, with the events as evidence; after the fix, the code is gone from `artifact.diagnostics`. -[Check for regressions in tests](/guides/debugging-reactivity#check-for-regressions-in-tests) shows the loop and the Vitest matcher form. - -## Learn more - -- [Diagnostics](/reference/solid-js/diagnostics): every code, with its kind, severity, and trigger. -- [Debugging reactivity](/guides/debugging-reactivity): how to read a report and what each group of codes points at. diff --git a/src/routes/reference/(1)solid-js/(8)diagnostics/effect-relay-tear.mdx b/src/routes/reference/(1)solid-js/(8)diagnostics/effect-relay-tear.mdx index 5308a9a5f..8c3fed92b 100644 --- a/src/routes/reference/(1)solid-js/(8)diagnostics/effect-relay-tear.mdx +++ b/src/routes/reference/(1)solid-js/(8)diagnostics/effect-relay-tear.mdx @@ -35,6 +35,15 @@ Derived state kept in sync by an effect: `createEffect(() => f(a()), v => setS(v The message names a reader that ran twice for ONE write of `a` — once in the flush where `a` changed (against the stale `S`), once after the effect's write landed — so its first frame was inconsistent. That double run is proven from the cause chain; the rest of the message is confidence: +- "The written value is the effect's compute output" — by Solid's contract the compute half is a pure function of its tracked reads, so the value is derivable. Repair: `const s = createMemo(() => f(a()))`, delete the effect and the signal. This form warns on its own once it has repeated (`data.copy: true`), even with no double-running reader — everything reading the copy paints a flush behind everything reading the source. +- "The written value is `a` itself" (`data.passthrough`) — the prop-to-state port. Repair: read `a` where `S` was read; a memo only if a stable derivation is genuinely needed. +- "Nothing else writes `S`" (`data.soleWriter`, `copy` false) — derived state if the value is computed from what the effect reads: same memo repair. If the effect measures (layout, `Date.now()`, a ref), the tear is the cost of measuring. +- "`S` has other writers — editable state reset from a source" (`copy` true, `soleWriter` false; `info` until it repeats) — the controlled-input shape. If resetting local editable state when the source changes is the intent, the tear is its cost; if `S` only ever mirrors the source, drop the copy. +- Neither — the written value is not the compute output and the signal has other writers. If the effect reads something outside the graph, the tear is the cost of measuring and the finding is a fact to accept; if the value is computed from what the effect reads, it is still a memo. + +An effect whose apply half takes no argument (`createEffect(open, () => setFlipped(measure()))`) is reading something other than its compute output, so a matching write is never taken as a copy and its tears stay `info` however often they repeat: the cost of measuring. +One that takes the value (`v => setS(v)`, `v => setLabel(v ? "Close" : "Open")`) is judged as above and warns once it has repeated, a measurement included (`i => setLeft(offsets[i])` with stable layout): drop the parameter if the write does not use it. + :::note[Performance pathologies (from the attribution engine)] These fire only while attribution is enabled and describe cost, not incorrect behavior. The numbers in the message are measurements, not guesses. @@ -42,11 +51,7 @@ The numbers in the message are measurements, not guesses. ## How to fix it -- "The written value is the effect's compute output" — by Solid's contract the compute half is a pure function of its tracked reads, so the value is derivable. Repair: `const s = createMemo(() => f(a()))`, delete the effect and the signal. This form warns on its own once it has repeated (`data.copy: true`), even with no double-running reader — everything reading the copy paints a flush behind everything reading the source. -- "The written value is `a` itself" (`data.passthrough`) — the prop-to-state port. Repair: read `a` where `S` was read; a memo only if a stable derivation is genuinely needed. -- "Nothing else writes `S`" (`data.soleWriter`) — derived state without the identity proof; same memo repair. -- "`S` has other writers — editable state reset from a source" (`copy` true, `soleWriter` false; `info` until it repeats) — the controlled-input shape. If resetting local editable state when the source changes is the intent, the tear is its cost; if `S` only ever mirrors the source, drop the copy. -- Neither (`info` until it repeats) — the written value is not the compute output and the signal has other writers. If the effect reads something outside the graph (layout, `Date.now()`, a ref), the tear is the cost of measuring and the finding is a fact to accept; if the value is computed from what the effect reads, it is still a memo. +Do not defer the write to a microtask to quiet it; that only hides the cause chain. ## In tests diff --git a/src/routes/reference/(1)solid-js/(8)diagnostics/lowercase-event-attribute.mdx b/src/routes/reference/(1)solid-js/(8)diagnostics/lowercase-event-attribute.mdx index d95a79e78..a154dacba 100644 --- a/src/routes/reference/(1)solid-js/(8)diagnostics/lowercase-event-attribute.mdx +++ b/src/routes/reference/(1)solid-js/(8)diagnostics/lowercase-event-attribute.mdx @@ -30,7 +30,7 @@ In a captured artifact the same finding is an event with `code: "LOWERCASE_EVENT ## Why it fires -A function was set on an attribute whose name starts with `on` but is not an event handler (`data.name`): a lowercase `onclick`, or a leftover 1.x `on:click`. +A function was set on an attribute whose name starts with `on` but is not an event handler (`data.name`): a lowercase `onclick`, or a leftover 1.x `on:click` passed through a spread (on a native element it is a compile error). In 2.0 only `on` + an uppercase letter binds an event; anything else is a plain attribute, so the function was stringified into it and never runs. Once per attribute name. diff --git a/src/routes/reference/(1)solid-js/(8)diagnostics/reactivity-halted.mdx b/src/routes/reference/(1)solid-js/(8)diagnostics/reactivity-halted.mdx index 16a6ba337..a46f8f6d1 100644 --- a/src/routes/reference/(1)solid-js/(8)diagnostics/reactivity-halted.mdx +++ b/src/routes/reference/(1)solid-js/(8)diagnostics/reactivity-halted.mdx @@ -35,6 +35,7 @@ An earlier uncaught error halted the reactive system; subsequent updates are ign ## How to fix it Do not treat this code as the bug — find the original error above it (or add an error boundary with ``) and fix that. +The `in › …` line under the message (repeated on the "Update ignored" notice) is the owner path of the computation the error escaped from: start there. ## In tests diff --git a/src/routes/reference/(1)solid-js/(8)diagnostics/settled-cleanup-unowned.mdx b/src/routes/reference/(1)solid-js/(8)diagnostics/settled-cleanup-unowned.mdx index 5a8001ecf..5d7f1c079 100644 --- a/src/routes/reference/(1)solid-js/(8)diagnostics/settled-cleanup-unowned.mdx +++ b/src/routes/reference/(1)solid-js/(8)diagnostics/settled-cleanup-unowned.mdx @@ -31,6 +31,7 @@ In a captured artifact the same finding is an event with `code: "SETTLED_CLEANUP ## Why it fires `onSettled` returned a cleanup while running in an unowned scope, so the cleanup cannot be honored. +Throws in dev; in production the cleanup is dropped. ## How to fix it diff --git a/src/routes/reference/(1)solid-js/(8)diagnostics/ssr-boundary-waterfall.mdx b/src/routes/reference/(1)solid-js/(8)diagnostics/ssr-boundary-waterfall.mdx index 3cbb0db6b..c930b3a5c 100644 --- a/src/routes/reference/(1)solid-js/(8)diagnostics/ssr-boundary-waterfall.mdx +++ b/src/routes/reference/(1)solid-js/(8)diagnostics/ssr-boundary-waterfall.mdx @@ -32,7 +32,10 @@ In a captured artifact the same finding is an event with `code: "SSR_BOUNDARY_WA ## Why it fires A `` boundary rendered in `data.passes` passes — discovery, then one per wait — and each pass past the first is a read that could only start once the previous pass's async answered: `passes - 1` sequential waits, `data.sequentialMs` end to end. -Unlike the client's [`ASYNC_WATERFALL`](/reference/solid-js/diagnostics/async-waterfall) this proof is exact (the pass structure IS the chain), so there is no `markFlight` false positive to rule out. +It applies the client's origin rule: a wait whose work had all started before the previous wait landed is parallel, not a link, and is left out (`data.parallelWaits`). +That is how nested route levels read: the router starts every matched level's `lazy()` import and preload together, and the boundary only meets each level a pass later. +The start comes from a `markFlight` stamp (`lazy()` stamps its import, Solid Router's `query()` its fetches); an unstamped promise counts as starting when the boundary meets it. +As on the client, a layer that hands out work it started earlier without stamping it (a request cache's wrapper promise) can still read as a chain; it should call `OBSERVE.attribution.markFlight` on what it hands out. :::note[Server rendering] The server runtime reports on the same channel, with the same `in › ` line. diff --git a/src/routes/reference/(1)solid-js/(8)diagnostics/ssr-live-hole-latched.mdx b/src/routes/reference/(1)solid-js/(8)diagnostics/ssr-live-hole-latched.mdx index 25295a20d..3f6b73c1c 100644 --- a/src/routes/reference/(1)solid-js/(8)diagnostics/ssr-live-hole-latched.mdx +++ b/src/routes/reference/(1)solid-js/(8)diagnostics/ssr-live-hole-latched.mdx @@ -30,8 +30,8 @@ In a captured artifact the same finding is an event with `code: "SSR_LIVE_HOLE_L ## Why it fires -A live markup hole (or attribute) in a server component shipped its markers and then stopped updating: re-running it created a reactive scope still waiting on async work (`data.cause: "owners"`) or emitted slot records (`"records"`), so the runtime closed it and the client keeps the markup it last received. -Scopes that finish synchronously (a nested ``, a condition memo such as `{m.usage && …}`, a component) are fine: each re-run gets a throwaway scope. +A live markup hole (or attribute) in a server component shipped its markers and then stopped updating: re-running it created a reactive scope still waiting on async work (`data.cause: "owners"`), so the runtime closed it and the client keeps the markup it last received. +Scopes that finish synchronously (a nested ``, a condition memo such as `{m.usage && …}`, a component) are fine: each re-run gets a throwaway scope, and slot calls (client components placed in the markup) re-run with the hole. The usual cause is a memo over a fetch or a stream created inside the markup that re-renders, which would restart on every re-run. :::note[Server rendering] @@ -45,6 +45,7 @@ A captured artifact from a server render carries both. ## How to fix it Create the async source in the component body instead. +An attribute whose expression calls a slot closes too (`"records"`): a slot places a client component in content, not in a tag. The finding is located by the component the hole is in. ## In tests diff --git a/src/routes/reference/(1)solid-js/(8)diagnostics/store-write-outside-setter.mdx b/src/routes/reference/(1)solid-js/(8)diagnostics/store-write-outside-setter.mdx new file mode 100644 index 000000000..f48dbff39 --- /dev/null +++ b/src/routes/reference/(1)solid-js/(8)diagnostics/store-write-outside-setter.mdx @@ -0,0 +1,50 @@ +--- +title: "STORE_WRITE_OUTSIDE_SETTER" +category: "Diagnostics" +use_cases: "store_write_outside_setter diagnostic, console warning repair, diagnostics assertion" +tags: + - "diagnostics" + - "write" + - "warn" + - "reference" + - "v2" +version: "2.0" +description: "STORE_WRITE_OUTSIDE_SETTER: Store proxy written, deleted from, or defined on outside its setter; the write is ignored (once per store object and key)." +source_repo: "solidjs/solid" +source_ref: "next" +source_path: "packages/solid/skills/reactivity-diagnostics/SKILL.md" +--- + +{/* Generated by scripts/extract-diagnostics.mjs from packages/solid/skills/reactivity-diagnostics/SKILL.md and packages/solid/diagnostics.json in solidjs/solid. Edit the skill, then regenerate. */} + +Store proxy written, deleted from, or defined on outside its setter; the write is ignored (once per store object and key). + +## What you saw + +- **Kind:** `write` +- **Severity:** `warn` (code that works but is structurally wrong or expensive) + +The console report opens with `[STORE_WRITE_OUTSIDE_SETTER]` and the message, then an `in` line naming the owners that enclose the subject, root first, and an `at` line with the source location when the code was compiled with one. +In a captured artifact the same finding is an event with `code: "STORE_WRITE_OUTSIDE_SETTER"`, `ownerPath`, and `loc`. +[Diagnostics](/reference/solid-js/diagnostics#read-a-report) explains each line. + +## Why it fires + +A store proxy was written, deleted from, or had a property defined on it outside its setter — `store.n = 5`, `store.items.push(x)`, `delete store.user` — and the write was ignored. +Stores are read-only outside the setter's draft; nothing changed and nothing re-ran. + +## How to fix it + +Repair: make the write inside the setter, `setStore(s => { s.n = 5 })` (nested paths and array methods work on the draft: `s.items.push(x)`, `delete s.user`). +Once per store object and key; `data.operation` is `set`, `defineProperty` or `deleteProperty`. + +## In tests + +`captureArtifact` from `@solidjs/diagnostics` runs a scenario with the diagnostics channel open and returns the events it saw. +`expectNoDiagnostics(artifact)` fails while `STORE_WRITE_OUTSIDE_SETTER` is among them, with the events as evidence; after the fix, the code is gone from `artifact.diagnostics`. +[Check for regressions in tests](/guides/debugging-reactivity#check-for-regressions-in-tests) shows the loop and the Vitest matcher form. + +## Learn more + +- [Diagnostics](/reference/solid-js/diagnostics): every code, with its kind, severity, and trigger. +- [Debugging reactivity](/guides/debugging-reactivity): how to read a report and what each group of codes points at. diff --git a/src/routes/reference/(1)solid-js/(8)diagnostics/uncommitted-input-overwritten.mdx b/src/routes/reference/(1)solid-js/(8)diagnostics/uncommitted-input-overwritten.mdx new file mode 100644 index 000000000..6561b9ebf --- /dev/null +++ b/src/routes/reference/(1)solid-js/(8)diagnostics/uncommitted-input-overwritten.mdx @@ -0,0 +1,59 @@ +--- +title: "UNCOMMITTED_INPUT_OVERWRITTEN" +category: "Diagnostics" +use_cases: "uncommitted_input_overwritten diagnostic, console warning repair, diagnostics assertion" +tags: + - "diagnostics" + - "render" + - "warn" + - "reference" + - "v2" +version: "2.0" +description: "UNCOMMITTED_INPUT_OVERWRITTEN: A stateful property binding (`value`/`checked`/…) re-wrote an unchanged value over an edit the user never committed to the signal (dev; client)." +source_repo: "solidjs/solid" +source_ref: "next" +source_path: "packages/solid/skills/reactivity-diagnostics/SKILL.md" +--- + +{/* Generated by scripts/extract-diagnostics.mjs from packages/solid/skills/reactivity-diagnostics/SKILL.md and packages/solid/diagnostics.json in solidjs/solid. Edit the skill, then regenerate. */} + +A stateful property binding (`value`/`checked`/…) re-wrote an unchanged value over an edit the user never committed to the signal (dev; client). + +## What you saw + +- **Kind:** `render` +- **Severity:** `warn` (code that works but is structurally wrong or expensive) + +The console report opens with `[UNCOMMITTED_INPUT_OVERWRITTEN]` and the message, then an `in` line naming the owners that enclose the subject, root first, and an `at` line with the source location when the code was compiled with one. +In a captured artifact the same finding is an event with `code: "UNCOMMITTED_INPUT_OVERWRITTEN"`, `ownerPath`, and `loc`. +[Diagnostics](/reference/solid-js/diagnostics#read-a-report) explains each line. + +## Why it fires + +A stateful property binding (`value`/`checked` on an input, `value` on a textarea, `selected` on an option, `muted` on media) re-wrote the value it wrote last time over an edit the user made and never committed to the bound signal — the typed text (or toggled box) is lost. +The binding shares its template's grouped effect, so any other dynamic attribute in the same template changing re-runs it; so does a spread re-run or an `equals: false` source firing an equal value. +Typical cause: `value={props.name} onChange={commit}` with no draft signal. +Once per element and property; the write still happens. + +:::note[Server rendering] +The server runtime reports on the same channel, with the same `in › ` line. +Two groups. +**Findings** ([`SSR_RENDER_ERROR_CONTAINED`](/reference/solid-js/diagnostics/ssr-render-error-contained), [`SSR_SUBTREE_ABANDONED`](/reference/solid-js/diagnostics/ssr-subtree-abandoned), [`SSR_STREAM_ABANDONED`](/reference/solid-js/diagnostics/ssr-stream-abandoned), [`LATE_HEADER_WRITE`](/reference/solid-js/diagnostics/late-header-write), [`DYNAMIC_ASYNC_COMPONENT`](/reference/solid-js/diagnostics/dynamic-async-component), [`SERVER_ERROR_SANITIZED`](/reference/solid-js/diagnostics/server-error-sanitized), [`FRAME_MARKER_CORRUPTED`](/reference/solid-js/diagnostics/frame-marker-corrupted)) are facts about a render that exist in observe builds too — an APM sees them in production; in dev they print. +**Checks** (the rest, [`SSR_BOUNDARY_WATERFALL`](/reference/solid-js/diagnostics/ssr-boundary-waterfall) and [`SSR_CLIENT_CONTENT_MASKED`](/reference/solid-js/diagnostics/ssr-client-content-masked) included) are dev-only guidance. +A captured artifact from a server render carries both. +::: + +## How to fix it + +Fix: write the signal on every edit (`onInput={e => setDraft(e.currentTarget.value)}`, commit the draft separately), use `defaultValue`/`defaultChecked` for an uncontrolled element, or reject an edit by writing the accepted value back in the handler (`e.currentTarget.value = next`) instead of re-asserting an equal value through the signal. + +## In tests + +`captureArtifact` from `@solidjs/diagnostics` runs a scenario with the diagnostics channel open and returns the events it saw. +`expectNoDiagnostics(artifact)` fails while `UNCOMMITTED_INPUT_OVERWRITTEN` is among them, with the events as evidence; after the fix, the code is gone from `artifact.diagnostics`. +[Check for regressions in tests](/guides/debugging-reactivity#check-for-regressions-in-tests) shows the loop and the Vitest matcher form. + +## Learn more + +- [Diagnostics](/reference/solid-js/diagnostics): every code, with its kind, severity, and trigger. +- [Debugging reactivity](/guides/debugging-reactivity): how to read a report and what each group of codes points at. diff --git a/src/routes/reference/(5)vite-plugin-solid/(1)options.mdx b/src/routes/reference/(5)vite-plugin-solid/(1)options.mdx index c5f67c252..0ca5cf66e 100644 --- a/src/routes/reference/(5)vite-plugin-solid/(1)options.mdx +++ b/src/routes/reference/(5)vite-plugin-solid/(1)options.mdx @@ -243,7 +243,8 @@ See [`ServerFunctionsOptions`](/reference/vite-plugin-solid/server-functions). - `ssr: true` uses hydratable DOM output for client transforms and hydratable SSR output for server transforms. - Client start mode keeps application code non-hydratable. Only the document shell receives an SSR transform. -- Vitest defaults to client conditions, DOM output, and `jsdom`. +- Vitest defaults to client conditions and DOM output. + The plugin does not set `test.environment`; set `"jsdom"` or `"happy-dom"` for component tests, since Vitest's own default is `"node"`. A project with `test.environment: "node"` or `"edge-runtime"` receives server conditions and SSR output. The plugin always installs the `server-only` and `client-only` boundary resolvers.