instagram not works with es6-shim.js v0.35.3

[PhonyWelder]

Opera 12.15, es6-shim.js instaled as UserScript; https://www.instagram.com/artofprolificpen/

It's just blank page because span id="react-root" don't have any content: http://s01.geekpic.net/di-QYZ495.png After disabling es6-shim.js that span have proper content: http://s01.geekpic.net/di-YEUSQU.png

No JS errors in console.

[ljharb]

UserScripts aren't really a supported use case; a site not designed to work with the shims is very likely to break.

Separately, for react to work, you'd have to have installed the ES5 shim first, then the es6 shim, and then run all the JS on the page.

[PhonyWelder]

Opera executing UserScripts on very beginning (even document.body not exist at this time) - any page scripts executes after polyfills from es6-shim.js.

es5-shim.js and es5-sham.js don't affects, Opera 12.15 supports most ES5 features (tried tests from https://github.com/es-shims/es5-shim/ with commented es5-shim.js and es5-sham.js)

Instagram worked a month or two ago.

[ljharb]

That suggests Instagram changed their site; es6-shim hasn't had a release in about 10 months.

[PhonyWelder]

That incompatibility doesn't concern you?

[ljharb]

@PhonyWelder It would concern me if es6-shim users were experiencing brokenness on their site; however, React itself doesn't really support Opera 12 with or without any shims, so I think using such an obsolete browser just kind of means you can't use many sites :-/

In other words, I fully support (and would fix) any breakage caused by the author of a site including the es6 shim and experiencing issues - but if you, not the author of the site, use a userscript, that's just not a supported scenario.

All that said - if you can provide any more pointers than a screenshot of an empty div, I'd still be happy to fix it! I just can't devote time and energy to investigating it.

[PhonyWelder]

I'm using es6-shim.js as UserScript for all sites (with currently single exception), even if their owners don't care for obsolete browsers.

Problem with Array.from shim: after appending Array.from = undefined; to es6-shim.js instagram uses its own polyfill (get it with javascript:alert(Array.from)):

function(t) {
    if (null == t) throw new TypeError("Object is null or undefined");
    var n, r, e = arguments[1],
        o = arguments[2],
        i = this,
        u = Object(t),
        c = "function" == typeof Symbol ? Symbol.iterator : "@@iterator",
        f = "function" == typeof e,
        a = 0;
    if ("function" == typeof u[c]) {
        n = "function" == typeof i ? new i : [];
        for (var s, l = u[c](); !(s = l.next()).done;) r = s.value, f && (r = e.call(o, r, a)), n[a] = r, a += 1;
        return n.length = a, n
    }
    var p = u.length;
    for ((isNaN(p) || p < 0) && (p = 0), n = "function" == typeof i ? new i(p) : new Array(p); a < p;) r = u[a], f && (r = e.call(o, r, a)), n[a] = r, a += 1;
    return n.length = a, n
}

I inserted console.log('items='+items+'\nmapping = '+ mapping +'\nusingIterator='+usingIterator+'\nresult='+result+'\nresult.length='+result.length); into es6-shim ArrayShims.from before return result; to see what's going on: https://pastebin.ca/3939459