Excessibility.LiveViewRules.Rules.DebounceWithoutLiveRegion (Excessibility v0.14.0)

View Source

Flags <input phx-debounce> when the snapshot has no ARIA live region anywhere.

LiveView search-style inputs with phx-debounce push updates silently; screen-reader users typing a search term have no idea that results appeared or changed. At minimum, the page should contain an aria-live region (or role="status" | "alert" | "log") somewhere the updated results can land.

Detection

This rule is conservative: it only flags a debounced input when the entire snapshot has zero ARIA live regions. If any live region exists, we assume the app is announcing changes correctly. This minimizes false positives at the cost of missing cases where a live region exists but isn't where the results actually render.

Fix

<!-- Bad -->
<input type="search" name="q" phx-debounce="200" />
<table><tbody>...results...</tbody></table>

<!-- Good -->
<input type="search" name="q" phx-debounce="200" />
<div aria-live="polite">
  <table><tbody>...results...</tbody></table>
</div>