케이스 ce-0575-prosemirror-safari-empty-table-leak-ko · 시나리오 scenario-table-composition-leaks

ProseMirror: Safari의 빈 테이블 셀에서 텍스트가 밖으로 이동

OS: macOS 15.2 기기: Desktop Any 브라우저: Safari 18.2 키보드: Japanese IME 확인됨
prosemirrorsafaritablecompositionregression

현상

2025년 말(v1.41.5 이전의 prosemirror-view에 영향), Safari 18의 개선되었으나 여전히 불안정한 조합 엔진과의 상호작용에서 문제가 확인되었습니다. 완전히 비어 있는 <td>에서 일어난 CJK IME 조합이 확정될 때, 텍스트가 부모 컨테이너로 “유출”됩니다. 이는 임시 조합 노드가 제거된 후 WebKit의 선택 영역 매핑이 빈 셀 내에서 안정적인 앵커(anchor)를 찾지 못하기 때문입니다.

재현 단계

  1. ProseMirror-view 1.41.5 미만 버전을 사용합니다.
  2. 빈 테이블 셀이 포함된 문서를 작성합니다.
  3. Safari 18.2+ 버전에서 엽니다.
  4. 셀을 클릭하고 CJK IME를 사용해 타이핑합니다.
  5. Enter를 눌러 확정합니다.

관찰된 동작

  • DOM 유출: 텍스트가 테이블 밖, 문서 레벨에 나타납니다.
  • 상태 불일치: ProseMirror의 EditorState는 여전히 커서가 셀 안에 있다고 생각하거나, 관리되지 않는 영역에서 변이가 발생하여 크래시가 날 수 있습니다.

예상 동작

텍스트는 반드시 <td> 경계 내에 유지되어야 합니다.

브라우저 비교

  • Safari 18.2: 재현율 높음.
  • Chrome/Firefox: 정상 동작.

참고 및 해결 방법

해결책: “보이지 않는 콘텐츠” 트릭

ProseMirror는 v1.41.5에서 빈 테이블 셀이 선택 시점에 항상 최소한 하나의 <br>이나 제로 너비 공백을 포함하도록 보장하여 WebKit 엔진을 고정(anchor)시키는 방식으로 이를 해결했습니다.

/* ProseMirror-view 내부 해결 로직 예시 */
function fixEmptyCell(dom) {
  if (isSafari && dom.nodeName === 'TD' && !dom.firstChild) {
    dom.appendChild(document.createElement('br'));
  }
}

이 시나리오의 변형

케이스 OS 브라우저 상태
ce-0566-safari-table-cell-composition-leak-ko macOS 14.4 Safari 17.4 확인됨
ce-0575-prosemirror-safari-empty-table-leak-ko macOS 15.2 Safari 18.2 확인됨

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: macOS 15.2
Device: Desktop Any
Browser: Safari 18.2
Keyboard: Japanese IME
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.