Describe the bug
App Bridge version: latest from https://cdn.shopify.com/shopifycloud/app-bridge.js (no version pin)
Browser: Chrome, Safari, Firefox
The event sequence for textarea:
If textarea has prefilled value value, such as
<textarea name="text_area_1">example text</textarea>
when we highlight the text and press delete, it doesn't work. It moves the cursor to the front of the text
we finally figured out how to fix it by injecting code that listens to keydown event with AI's help.
Here's their notes:
- issue: keydown "Backspace" → beforeinput (deleteContentBackward) → selectionchange (cursor resets to 0-0) → focusout (relatedTarget=null)
- No input event fires — deletion is cancelled by the browser because focus is stolen
- Key facts: no JS .focus() or .blur() call is made; focus leaves at the native browser level; bug is specific to pages with app-bridge.js loaded; removing and does not fix it
- Workaround: intercepting keydown and calling e.preventDefault() + setRangeText bypasses the issue
Describe the bug
App Bridge version: latest from https://cdn.shopify.com/shopifycloud/app-bridge.js (no version pin)
Browser: Chrome, Safari, Firefox
The event sequence for textarea:
If textarea has prefilled value value, such as
<textarea name="text_area_1">example text</textarea>when we highlight the text and press delete, it doesn't work. It moves the cursor to the front of the text
we finally figured out how to fix it by injecting code that listens to
keydownevent with AI's help.Here's their notes: