w3c / IntersectionObserver

Intersection Observer
https://www.w3.org/TR/intersection-observer/
Other
3.62k stars 526 forks source link

Polyfill not working on iOS DOM change display:none -> display:block #347

Closed GameKyuubi closed 2 years ago

GameKyuubi commented 5 years ago

When using code like this, IntersectionObserver will not report the change from display:none to display:block on iOS. In my case I am using lozad.js on both image elements. The thumbnail is loaded properly using lozad.js, but when clicked the lightbox is not. Upon scrolling a bit, the change is detected and the image is loaded. The workaround is to set a polling interval as specified here, but optimally this shouldn't be necessary as the documentation says changes in the DOM are supposed to be detected.

sudhirj commented 5 years ago

Have you already tried setting the POLL_INTERVAL as documented in https://github.com/w3c/IntersectionObserver/tree/master/polyfill#configuring-the-polyfill

display property changes aren't efficiently discoverable in the polyfill, so you'll need to turn on the polling manually.

philipwalton commented 5 years ago

Is this on Safari or iOS WebView? I've heard several reports of bugs on iOS WebView, and I wouldn't be surprised if this isn't one of them.

Also, can you check to see if this is a problem on the latest iOS (which should support IntersectionObserver natively now)?

zavr-1 commented 5 years ago

Yeah I've noticed this issue as well! The images don't come up when their parent element becomes visible on iOS with the polyfill.

miketaylr commented 2 years ago

Is this on Safari or iOS WebView? I've heard several reports of bugs on iOS WebView, and I wouldn't be surprised if this isn't one of them.

Also, can you check to see if this is a problem on the latest iOS (which should support IntersectionObserver natively now)?

Given the lack of activity here, let's close as incomplete.

If others are running into this issue w/ the native implementation provided by iOS (webview or Safari), I would recommend filing a bug against https://bugs.webkit.org/