From a5a628ef7efa48b05ce5671b1ceb0664652e8183 Mon Sep 17 00:00:00 2001 From: Maria Hutt Date: Fri, 17 Oct 2025 12:01:56 -0700 Subject: [PATCH 01/13] fix(checkbox): fire ionFocus and ionBlur --- core/src/components/checkbox/checkbox.tsx | 12 +- .../checkbox/test/basic/checkbox.e2e.ts | 175 +++++++++++++++++- .../components/checkbox/test/basic/index.html | 14 ++ .../components/checkbox/test/item/index.html | 14 ++ .../playwright/page/utils/spy-on-event.ts | 37 ++++ 5 files changed, 243 insertions(+), 9 deletions(-) diff --git a/core/src/components/checkbox/checkbox.tsx b/core/src/components/checkbox/checkbox.tsx index 00a9de5c7cf..b65b89d43b3 100644 --- a/core/src/components/checkbox/checkbox.tsx +++ b/core/src/components/checkbox/checkbox.tsx @@ -147,9 +147,7 @@ export class Checkbox implements ComponentInterface { /** @internal */ @Method() async setFocus() { - if (this.focusEl) { - this.focusEl.focus(); - } + this.el.focus(); } /** @@ -169,7 +167,6 @@ export class Checkbox implements ComponentInterface { private toggleChecked = (ev: Event) => { ev.preventDefault(); - this.setFocus(); this.setChecked(!this.checked); this.indeterminate = false; }; @@ -285,6 +282,9 @@ export class Checkbox implements ComponentInterface { aria-disabled={disabled ? 'true' : null} tabindex={disabled ? undefined : 0} onKeyDown={this.onKeyDown} + onFocus={() => this.onFocus()} + onBlur={() => this.onBlur()} + onClick={this.onClick} class={createColorClasses(color, { [mode]: true, 'in-item': hostContext('ion-item', el), @@ -296,7 +296,6 @@ export class Checkbox implements ComponentInterface { [`checkbox-alignment-${alignment}`]: alignment !== undefined, [`checkbox-label-placement-${labelPlacement}`]: true, })} - onClick={this.onClick} >