💼 This rule is enabled in the 📋 template-lint-migration config.
Disallows pointer down event bindings (mousedown, pointerdown).
Pointer down events fire before the user releases the pointer, which can cause accessibility issues — actions triggered on down events don't allow users to cancel by moving the pointer away before releasing. Bind to the corresponding pointer up event instead.
This rule disallows the use of mousedown, onmousedown, pointerdown, and onpointerdown events in templates, whether via {{on}}, {{action on=...}}, or HTML attributes.
Examples of incorrect code for this rule:
<template>
<button {{on "mousedown" this.handleMouseDown}}>Click</button>
</template><template>
<div {{on "pointerdown" this.handlePointerDown}}>Content</div>
</template><template>
<div onmousedown={{this.handleMouseDown}}>Content</div>
</template><template>
<div {{action this.handler on="mousedown"}}></div>
</template>Examples of correct code for this rule:
<template>
<button {{on "mouseup" this.handleMouseUp}}>Click</button>
</template><template>
<div {{on "pointerup" this.handlePointerUp}}>Content</div>
</template><template>
<button {{on "click" this.handleClick}}>Click</button>
</template>Replace:
<button {{on "mousedown" this.action}}>With:
<button {{on "mouseup" this.action}}>Or use the more modern pointer event:
<button {{on "pointerup" this.action}}>