케이스 ce-0581-ko · 시나리오 scenario-ime-interaction-patterns

안드로이드 Chrome: 이모지 삽입 시 조합 중인 텍스트 증발 현상

OS: Android 14.0 / 15.0 기기: 스마트폰 Any 브라우저: Chrome 131.0+ 키보드: Gboard (이모지 키보드) 확인됨
androidchrome-131emojicompositiondata-loss

현상

안드로이드용 최신 Chromium(131+) 버전에서 복잡한 IME 조합과 이모지 입력을 혼용할 때 데이터 손실 버그가 발생하고 있습니다. 사용자가 글자를 입력하는 도중에(특히 한중일 언어 또는 태국어) 이모지 키보드로 전환하여 아이콘을 선택하면, 브라우저가 data: "" 또는 null 값을 가진 compositionend 이벤트를 트리거합니다. 이는 현재 조합 중인 글자를 확정하지 않고 그대로 지워버리는 결과를 초래합니다.

재현 단계

  1. 안드로이드 기기에서 contenteditable 에디터를 엽니다.
  2. 한국어 Gboard 등 CJK IME를 사용합니다.
  3. 밑줄이 보이는 상태(활성 조합 상태)로 글자 하나를 입력합니다.
  4. 공백이나 엔터를 누르지 않은 상태에서 즉시 이모지 메뉴를 열고 이모지를 선택합니다.
  5. DOM에 조합 중이던 글자가 남아 있는지 확인합니다.

관찰된 동작

  • 버퍼 증발: compositionupdate로 보여지던 텍스트가 DOM에서 사라집니다.
  • 이벤트 누락: 브라우저가 유령 글자에 대해 insertReplacementTextinsertText 이벤트를 보내지 않습니다.
  • 불완전한 beforeinput: 이모지에 대한 beforeinput은 발생하지만, 이전 세션을 “정리”하는 이벤트는 발생하지 않습니다.

영향

  • 정보 손실: 문장 끝에 이모지로 마침표를 찍으려던 사용자는 마지막 음절을 잃게 됩니다.
  • 사용자 경험 저하: 사용자는 다시 키보드를 전환하여 사라진 글자를 입력한 후, 다시 이모지를 추가해야 하는 번거로움을 겪습니다.

브라우저 비교

  • 안드로이드용 Chrome (131+): 회귀 버그 확인됨.
  • iOS Safari: 이모지 삽입 전 조합 버퍼를 정확히 밀어내어 확정시킵니다.
  • 안드로이드용 Firefox: 대체로 안정적이며 키보드 전환을 올바르게 처리합니다.

참고 및 해결 방법

해결책: 수동 플러시(Manual Flush)

개발자는 키보드 타입 변경(감지 가능한 경우)을 모니터링하거나 마지막 compositionupdate 값을 수동으로 캐싱해야 합니다. isComposing이 true인 상태에서 포커스 변동이나 입력 모드 변경이 발생하면 캐싱된 텍스트를 강제로 삽입하는 로직이 필요합니다.

이 시나리오의 변형

케이스 OS 브라우저 상태
ce-0002-ime-enter-breaks-ko Windows 11 Chrome 120.0 초안
ce-0004-ime-backspace-removes-whole-syllable-ko WindowsmacOSAndroidiOSLinux Any ChromeEdgeSafariFirefox Latest 확인됨
ce-0022-ime-enter-breaks-firefox-ko Windows 11 Firefox 120.0 초안
ce-0030-backspace-composition-chrome-ko macOS Ubuntu 22.04 Chrome 120.0 초안
ce-0035-backspace-deletes-whole-word-ko macOS Ubuntu 22.04 Safari 120.0 초안
ce-0042-input-events-duplicate-ko Windows 11 Edge 120.0 초안
ce-0058-contenteditable-with-autocomplete-ko macOS Ubuntu 22.04 Chrome 120.0 초안
ce-0070-contenteditable-with-autocapitalize-ko iOS 17.0 Safari 17.0 초안
ce-0071-contenteditable-with-autocorrect-ko iOS 17.0 Safari 17.0 초안
ce-0181-japanese-ime-enter-breaks-chrome-ko Windows 11 Chrome 120.0 초안
ce-0182-chinese-ime-enter-breaks-safari-ko macOS 14.0 Safari 17.0 초안
ce-0185-japanese-ime-backspace-granularity-chrome-ko Windows 11 Chrome 120.0 초안
ce-0186-chinese-ime-backspace-granularity-safari-ko macOS 14.0 Safari 17.0 초안
ce-0195-thai-ime-enter-breaks-chrome-ko Windows 11 Chrome 120.0 초안
ce-0196-vietnamese-ime-enter-breaks-edge-ko Windows 11 Edge 120.0 초안
ce-0199-thai-ime-backspace-granularity-chrome-ko Windows 11 Chrome 120.0 초안
ce-0200-vietnamese-ime-backspace-granularity-edge-ko Windows 11 Edge 120.0 초안
ce-0217-keyboard-handlers-iscomposing-false-ios-safari-korean-ko iOS 17.0+ Safari 17.0+ 초안
ce-0565-chrome-121-oninput-offset-0-ko Windows 11 Chrome 121.0.6167.86 확인됨
ce-0579-ko macOS 15.0 (Sequoia) 모든 브라우저 (ProseMirror 문맥) 최신 (2025년 11월) 확인됨
ce-0581-ko Android 14.0 / 15.0 Chrome 131.0+ 확인됨

Playground for this case

Use the reported environment as a reference and record what happens in your environment while interacting with the editable area.

Reported environment
OS: Android 14.0 / 15.0
Device: 스마트폰 Any
Browser: Chrome 131.0+
Keyboard: Gboard (이모지 키보드)
Your environment
Sample HTML:
Event log
Use this log together with the case description when filing or updating an issue.
0 events
Interact with the editable area to see events here.