왼손잡이 사용자에게만 영향을 준 WordPress 버그

1 hour ago 1
  • 모바일에서 스크롤 중 댓글 답글 상자가 갑자기 열리는 문제가 있었고, 오른손 엄지로 스크롤하던 사이트 운영자는 재현하지 못했음
  • 원인은 페이지 왼쪽의 reply 링크와 WordPress의 touchstart 처리였으며, 왼손 엄지 스크롤이 의도치 않은 링크 터치로 이어질 수 있었음
  • 이 버그는 7년 전 WordPress Trac에 이미 보고됐고, 관련 코드는 2017년에 WordPress 개발 저장소에 추가됐음
  • 과거에는 터치와 더블탭 줌을 구분하기 위한 300ms 지연 회피가 필요했지만, 2013년 Chrome 글과 2015년 FastClick 자료 기준으로 이미 오래된 문제였음
  • 수정은 WordPress 코드에서 몇 줄을 삭제하는 방식이며, 모바일 스크롤 중 원치 않는 댓글 답글 동작을 줄이는 데 초점이 있음

블로그 최적화와 댓글 JavaScript

  • WordPress 기본 설치 위에 여러 커스텀 수정을 적용해 블로그를 최대한 최적화함
  • JavaScript 사용량을 최소한으로 줄였고, JavaScript 없이도 기능이 동작하도록 구성함
  • 다만 일부 기능에는 JavaScript가 도움을 주며, 가장 눈에 띄는 예가 댓글 기능

왼손 스크롤에서만 드러난 문제

  • 독자가 사이트 버그를 알려왔고, 페이지를 스크롤하는 중 댓글 상자가 갑자기 나타나 탐색을 방해했음
  • 사이트 운영자는 자주 스크롤했지만 오른손 엄지를 사용했기 때문에 같은 문제를 발견하지 못함
  • 버그를 보고한 사용자는 왼손으로 스크롤했고, 문제가 된 reply 링크는 페이지 왼쪽에 있었음
  • 오른손 엄지 스크롤에서는 잘 드러나지 않던 터치 이벤트가 왼손 엄지 스크롤에서는 원치 않게 발생할 수 있었음

WordPress의 touchstart 처리

  • 이 문제는 WordPress Trac에서 7년 전 보고된 적이 있음
  • 2017년에 WordPress 개발자가 링크 클릭에 touchstart 리스너를 추가
  • 과거 브라우저는 터치 이벤트가 클릭의 시작인지, 더블탭 줌의 시작인지 확실히 구분하지 못했음
  • 링크에서 터치가 발생했을 때 이벤트를 먼저 발생시키는 방식은 당시 300ms 지연을 피하기 위한 처리로 볼 수 있었음

이미 사라진 300ms 지연 문제

  • 300ms 탭 지연은 오래전부터 같은 방식의 문제가 아니었음
  • 2013년 Chrome 개발자 블로그 글은 해당 지연 문제가 사라졌다는 점을 다룸
  • 2015년 FastClick 자료 기준으로도 이 문제는 더 이상 해결해야 할 주요 이슈가 아니었음
  • 따라서 2017년에 왼손 스크롤 사용자를 괴롭히는 형태의 코드가 왜 추가됐는지는 분명하지 않음

수정 방식과 기대 효과

  • 버그 보고 후 7년이 지나 WordPress 수정 PR이 커밋됨
  • 수정은 복잡한 변경이 아니라 WordPress 코드에서 몇 줄을 삭제하는 방식임
  • 이 변경으로 모바일 스크롤 중 reply 링크가 의도치 않게 작동해 댓글 답글 상자가 열리는 문제가 줄어들 수 있음
  • <meta handed="right"> 같은 손잡이별 접근 제한 기능은 존재하지 않으며, 이번 변경은 원치 않는 터치 이벤트를 막는 데 초점이 있음
Read Entire Article