Serve IntersectionObserver to iOS 14

[JakeChampion]

What

There are reports on Twitter that iOS 14 sometimes does not have IntersectionObserver - we should perhaps serve the IntersectionObserver to all iOS 14 users to ensure the feature is always available. We could wrap the polyfill in a feature detect to ensure we don't polyfill over the feature if it is already available.

Details

Reports from Etsy and N26 engineers that sometimes iOS 14 does not have IntersectionObserver enabled
-- https://twitter.com/sangster/status/1424736454882648069

[romainmenke]

tricky issue

Would be interesting to know if this is purely caused by the experimental feature flags in browser settings being turned off.

[JakeChampion]

Tricky indeed. I don't know if we could answer that question unfortunately. Perhaps @salemhilal could help us try and find that answer? 🤞

[salemhilal]

I'm actually going to defer to @mq2thez for that one; he's the one who did the initial research that concluded that it's possible for IntersectionObserver to be disabled in the first place, so he'd likely have more context as to when it might be missing.

[mq2thez]

While it's not impossible that that is the case, I think it's pretty unlikely.

We were seeing error rates for IntersectionObserver being undefined that were high enough that it felt like it had to be something in the OS doing it -- several hundred errors within the first day of the new experiment being enabled, from a broad range of users on iOS >= 12. We also got external error reports about issues, and when interviewing those users couldn't find any kind of obvious pattern (accessibility settings, iOS content blockers, privacy choices, etc). Most of these users weren't technical, though, so it's possible we missed something when talking to them.

Manually disabling it was one way that I was able to replicate this, but I suspect that the OS can do it in other ways as well. I've tried tweeting at a number of different Safari / Webkit folks with no reply, though.

[romainmenke]

Do you have any stats on the percentage of affected visitors?

---

we should perhaps serve the IntersectionObserver to all iOS 14 users to ensure the feature is always available. We could wrap the polyfill in a feature detect to ensure we don't polyfill over the feature if it is already available.

I think that is indeed the best way forward.
If at some point we understand the issue better and decide that it shouldn't be fixed after all, we can revert it.

We use polyfill-library differently (bundled with website code) and ship the IntersectionObserver polyfill wrapped in feature detection to iOS 12 - 13.x. We haven't had any issues with this.

[JakeChampion]

@rowanbeentje do you happen to know some more about the IntersectionObserver issues on iOS? Have you seen this happen on the FT app or website?

[rowanbeentje]

😱 I was not aware of this! I know settings for various features like this can be toggled off in Settings > Safari > Advanced > Experimental Features but I can't imagine there are any users who do that...

On the FT app we ship a polyfill which feature-detects, so we wouldn't notice this; we'd also find it hard to notice other than looking at Sentry, where I can't see any obvious errors 😬

[romainmenke]

@mq2thez Can you share the code for the experiment you ran?

several hundred errors within the first day of the new experiment being enabled

Collecting more data on different sites could be useful.

[mq2thez]

@romainmenke I can't, but our use case is different here. We use a self-hosted service and have a browser perform a request to it, similar to using the public polyfill.io service. Because it does UA detection to serve minimal JS, the IntersectionObserver polyfill is not sent to iOS14 etc users. For now, that's done instead of serving static polyfills to everyone.

[salemhilal]

@mq2thez is there a chance that:

1. we were using document for the root? I'm seeing that that's uniquely unsupported in Safari (and Firefox for Android)
2. this could have been bot traffic? It wouldn't be the first time we've had bots spoofing user agents and missing APIs.

[mq2thez]

@salemhilal The errors were literally IntersectionObserver is undefined, not that specific APIs weren't behaving.

As I mentioned in the original comment, we had to revisit this problem because we got an influx user reports that the homepage was broken when folks were enabling the $.appears -> IntersectionObserver experiment.

Even before that, however, I had verified to my own satisfaction that the original problems were unlikely to be due to bots.