[sarankumar1325]

Issue number: resolves #31639

---

What is the current behavior?

Pressing Backspace in an empty ion-input-otp box only calls focusPrevious() and leaves the delete to the browser's default action. Desktop browsers apply that delete to the newly focused box, but the iOS keyboard applies it to the box that had focus when the key was pressed, which is empty. So on iOS the previous box keeps its value, and the next character lands in a filled box (for example 789, Backspace, 6 gives 7869 instead of 786).

What is the new behavior?

• In an empty box, Backspace now clears the previous box itself (input value, inputValues, previousInputValues), emits ionInput through updateValue(), moves focus back, and calls preventDefault(). This matches the documented keyboard interaction ("In an empty box: moves focus back one box and clears its value") on every platform, without depending on where the browser applies the default delete.
• Backspace in the first box when it is empty still does nothing.
• Added input-otp.spec.ts. The spec environment doesn't apply the browser's default Backspace action, like the iOS keyboard, so the first test fails on main (box 3 still holds 9) and passes with this change.

Does this introduce a breaking change?

• Yes
• No

Other information

The insert-and-shift behaviour in a filled box is unchanged, since it is intended (as noted on the issue).

Tests: npx stencil test --spec -- src/components/input-otp (2 passed; the first fails on main), eslint and prettier on the changed files.

This change was prepared with the help of an AI coding assistant; I reviewed it and ran the tests above.

[vercel]

@sarankumar1325 is attempting to deploy a commit to the Ionic Team on Vercel.

A member of the Team first needs to authorize it.