케이스 ce-0038-mobile-zoom-on-focus-ko · 시나리오 scenario-mobile-touch-behavior

모바일에서 contenteditable 포커스 시 페이지가 확대됨

OS: iOS Ubuntu 22.04 기기: Mobile Any 브라우저: Safari 120.0 키보드: System virtual keyboard 초안
mobilezoomfocusios

현상

iOS Safari에서 contenteditable 영역이 포커스를 받을 때 페이지가 자동으로 확대될 수 있습니다. 이는 혼란을 줄 수 있으며 레이아웃 문제를 일으킬 수 있습니다.

재현 예시

  1. iOS Safari에서 contenteditable 영역이 있는 페이지를 엽니다.
  2. 뷰포트 메타 태그에 user-scalable=no 또는 고정된 width가 있는지 확인합니다.
  3. contenteditable 영역을 탭하여 포커스합니다.
  4. 페이지가 확대되는지 관찰합니다.

관찰된 동작

  • iOS Safari에서 contenteditable에 포커스하면 자동 확대가 트리거될 수 있습니다.
  • 확대 수준이 예상치 못하거나 부적절할 수 있습니다.
  • contenteditable이 포커스를 잃은 후에도 확대가 지속될 수 있습니다.

예상 동작

  • contenteditable에 포커스해도 자동 확대가 트리거되지 않아야 합니다.
  • 또는 CSS 또는 메타 태그를 통해 확대 동작을 제어할 수 있어야 합니다.
  • 포커스 변경 중 뷰포트가 안정적으로 유지되어야 합니다.

이 시나리오의 변형

케이스 OS 브라우저 상태
ce-0028-mobile-touch-focus-ko iOS Ubuntu 22.04 Safari 120.0 초안
ce-0038-mobile-zoom-on-focus-ko iOS Ubuntu 22.04 Safari 120.0 초안
ce-0046-mobile-double-tap-zoom-ko iOS Ubuntu 22.04 Safari 120.0 초안
ce-0053-mobile-selection-handles-overlap-ko Android Ubuntu 22.04 Chrome 120.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: iOS Ubuntu 22.04
Device: Mobile Any
Browser: Safari 120.0
Keyboard: System virtual keyboard
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.