iOS 13 이상에서 WKWebView 스크롤이 먹통되는 오류 해결하기

iOS 13 이상에서 WKWebView로 웹을 띄우고 나서 스크롤을 하다보면 스크롤이 먹통이 되는 이슈가 가끔씩 발견된다.

나는 이게 앱의 문제인줄 알았는데 웹의 문제였다.. 출처

답변으로 되어있는 JavaScript 코드는 실제 앱에 주입하면 안된다.. 모든 객체가 overflow: scroll 스타일이 적용되기때문에 지도와 같은 스크롤이 필요한 서비스가 안보여질 수 있다..

내가 겪은 상황은 현재 두가지 정도있다. 아래와 같은 사항에 해당되는지 한번 확인해보자

• 스크롤 되는 body 태그 안에 스크롤되는 객체가 여러개 있으며 스크롤되는 객체는 overflow: hidden 이 적용되어 있다.
• html 태그와 body 태그 동시에 overflow: hidden 이 적용되어 있다.

첫번째의 경우엔 body 태그안에 스크롤되는 객체가 있어 스크롤 터치가 body가 아닌 다른 객체로 강제 이동(?) 되어지는 경우이다. 해결 방법은 스크롤 되는 객체의 overflow 속성을 제거해준다.

두번째의 경우에는 좀 특이한 상황인데, 정확한 원인을 모르겠다. 나 같은 경우에는 body태그에 있는 overflow 속성을 제거해주었더니 정상 작동했다.

모바일의 Safari의 경우에는 스크롤이 멈추는 증상이 발생되진 않았지만 앱 내에서의 WKWebView 에서만 발생하는 이슈였다.