Errors

When something goes wrong, start with the error message: it points back to the HTML or JavaScript that needs attention.

Find the failing expression

Brio errors say where they happened. Expression failures name the expression, the directive, the element (tag, id, and up to two classes), the nearest enclosing custom element, and the original error:

Brio expression failed: "$data.user.name" in b-text on <span.name> inside <user-card>: TypeError: Cannot read properties of undefined (reading 'name')

Inspect the error details

Property	Contains
error.cause	Original expression error.
error.directive	Attribute name.
error.element	Element to inspect in devtools.

Structural errors and effect failures

• Brio’s own structural errors gain the element being hydrated or updated, e.g. b-ref requires a nonempty literal name. (at <p.note>).
• Effects that fail when state changes are reported together from the write: One or more reactive effects failed. lists every failure on its own line and keeps them in error.errors.
• Errors thrown by your own code (component setup, store methods, computed getters) are not rewritten; Brio wraps them only when they surface through a template expression, keeping the original as cause.