Web platform incompatibility for Image's src property

[zaygraveyard]

The Image's src instance property is configurable and enumerable in all browsers except Focus for iOS. This incompatibility is causing https://ovl.oceandatalab.com to not load properly.

It's caused by the following code that replaces the src property with a non-configurable and non-enumerable one (which is the default when using Object.defineProperty).

https://github.com/mozilla-mobile/focus-ios/blob/71607d004a71a15b1a7544a89c11f91351ca7620/Blockzilla/Lib/TrackingProtection/Assets/preload.js#L28-L38

This issue can easily fixed by setting both configurable and enumerable to true, like this:

  var originalImageSrc = Object.getOwnPropertyDescriptor(Image.prototype, 'src');
  delete Image.prototype.src;
  Object.defineProperty(Image.prototype, 'src', {
    configurable: true,
    enumerable: true,
    get: function() {
      return originalImageSrc.get.call(this);
    },
    set: function(value) {
      messageHandler.postMessage({ url: value })
      originalImageSrc.set.call(this, value);
    }
  });

I'm open to submitting a PR.

PS: I'm one of the developers of the linked page that is not loading properly.

┆Issue is synchronized with this Jira Task