Available since v0.1.0

fs-trigger="click"

Stable

Starts an assertion when the user clicks the instrumented element. By far the most common trigger — use it for buttons, links, and any clickable UI.

Syntax

<button fs-assert="feature/action" fs-trigger="click" fs-assert-added=".result">
  Do the thing
</button>

When to use it

Buttons that trigger an action
Anchor links, including in-app navigation
Any div, span, or custom element that has a click handler
Submit buttons inside forms (either click on the button or submit on the form — either works)

Example

<button
  fs-assert="todos/add-item"
  fs-trigger="click"
  fs-assert-added=".todo-item">
  Add
</button>

Passes when a new .todo-item appears in the DOM after the click.

Descendant clicks work

The agent walks up from event.target to the nearest fs-trigger ancestor via closest(). You can put the instrumentation on a <button> and not worry about clicks landing on nested icons, spans, or text — they all resolve to the button.

<button
  fs-assert="cart/add-item"
  fs-trigger="click"
  fs-assert-updated="#cart-count">
  <svg class="cart-icon">…</svg>
  Add to cart
</button>

Clicks on the SVG icon still fire the assertion. No pointer-events: none hack needed.

Pairs well with

fs-assert-added — the most common pairing (clicked the button, new element appeared)
fs-assert-updated — clicked the button, existing element content changed
fs-assert-removed — clicked the button, element is gone
fs-assert-emitted — clicked the button, custom event fired (use async dispatch)
Conditional assertions — added-success / added-error for branch outcomes
fs-assert-mutex — group cross-type conditionals together

Gotchas

Placing fs-trigger="click" on a container <div> that wraps multiple unrelated children. It fires for ANY click inside, producing noisy assertions. Put the trigger on the specific element the user is meant to interact with.
HTMX form submit buttons also fire click. HTMX calls preventDefault() on submit AFTER listeners have run, so both fs-trigger="click" on the button and fs-trigger="submit" on the form work. Pick one.
Synchronous dispatchEvent in the click handler fires before an emitted assertion listener is registered. Use async dispatch (setTimeout, queueMicrotask, or an HTMX HX-Trigger response header).