Bug 255857 – User gets stuck composing text when HTMLInputElement value is updated during composition

• Status: NEW
• Component: HTML Editing

[Jamie Birch]

Created attachment 466062 [details]
MWE of composition trapping bug

# Summary

Users can get 'stuck' composing text in an HTMLInputElement if the element's value updates during composition. The bug affects iOS Safari, but not macOS Safari.


# STR

1: Open the attached HTML file on iOS Safari.

2. Press the button titled "Set value to 'x' in 5 seconds".

3. Focus the text input and, using a Japanese or Chinese IME via the onscreen virtual keyboard, compose some text into the input field before the timer expires.

4. Wait for the timer to expire (as indicated by the "Updated input to 'x'" log message).


# Results

## Expected

The input value should become 'x', composition should be cancelled, and the user should be able to continue typing.

## Actual

The exact failure depends on whether the text you composed matched the incoming input value ('x') or not:

- Composing matching text, 'x':

The input value remains as 'x', but composition continues, incorporating the 'x'. The user is able to continue typing.

- Composing non-matching text, i.e. that other than 'x':

The input value does become 'x', but composition breaks—although the IME continues to update its suggestions, the DOM no longer reflects the composed text, even if a suggestion is committed. The text cursor disappears, and the user must blur and refocus the input to resume typing.


# Browser comparison

macOS Safari, macOS Firefox, macOS Chrome, Android Firefox, and Android Chrome all produce the expected results.


# Other

For easier testing, you can replace the button's onclick event listener (that starts a 5-second timer) with an onmousedown or onpointerdown event listener that calls mouseEvent.preventDefault() (to prevent a focus change) before calling `input.value = 'x'`.

[Radar WebKit Bug Importer]

<rdar://problem/108727600>