var str = 'class ಠ_ಠ extends Array {constructor(j = "a", ...c) {const q = (({u: e}) => {return { [`s${c}`]: Symbol(j) };})({});super(j, q, ...c);}}' + | |
'new Promise((f) => {const a = function* (){return "\u{20BB7}".match(/./u)[0].length === 2 || true;};for (let vre of a()) {' + | |
'const [uw, as, he, re] = [new Set(), new WeakSet(), new Map(), new WeakMap()];break;}f(new Proxy({}, {get: (han, h) => h in han ? han[h] ' + | |
': "42".repeat(0o10)}));}).then(bi => new ಠ_ಠ(bi.rd));'; | |
try { | |
eval(str); | |
} catch(e) { | |
alert('Your browser does not support ES6!') | |
} | |
/* | |
* All credits to Netflix for providing this approach to ES6 feature detection. Although this could be written in many different ways | |
* this proved to be the most direct and elegant approach for me. | |
* License: MIT | |
*/ |
This comment has been minimized.
This comment has been minimized.
Love it! |
This comment has been minimized.
This comment has been minimized.
formatted: class ಠ_ಠ extends Array {
constructor(j = "a", ...c) {
const q = (({u: e}) => {
return { [`s${c}`]: Symbol(j) }
})({})
super(j, q, ...c)
}
}
new Promise((f) => {
const a = function* () {
return "\u{20BB7}".match(/./u)[0].length === 2 || true
}
for (let vre of a()) {
const [uw, as, he, re] = [new Set(), new WeakSet(), new Map(), new WeakMap()]
break
}
f(new Proxy({}, {
get: (han, h) => h in han ? han[h] : "42".repeat(0o10)
}))
}).then(bi => new ಠ_ಠ(bi.rd)) |
This comment has been minimized.
This comment has been minimized.
Glad it's helping! My slides are here: https://speakerdeck.com/betaorbust/progressive-transpilation-at-netflix-and-the-road-to-running-native-es2015-in-production And a recording of the talk Jem and I gave is here: https://youtu.be/M1qm-AWWu-M |
This comment has been minimized.
This comment has been minimized.
Made it into a package: class ಠ extends Array{constructor(j=`a`,...c){const q=(({u: e})=>{return {[`${c}`]:Symbol(j)};})({});super(j,q,...c)}}new Promise(f=>{const a=function*(){return "\u{20BB7}".match(/./u)[0].length===2||!0};for (let z of a()){const [x,y,w,k]=[new Set(),new WeakSet(),new Map(), new WeakMap()];break}f(new Proxy({},{get:(h,i) =>i in h ?h[i]:"j".repeat(0o2)}))}).then(t => new ಠ(t.d)) |
This comment has been minimized.
This comment has been minimized.
Cool ! |
This comment has been minimized.
This comment has been minimized.
does anyone know why nothing but transpilers support import/export? It's not not even in this list yet mdn lists it as a feature... |
This comment has been minimized.
This comment has been minimized.
@mgenev The |
This comment has been minimized.
This comment has been minimized.
@mgenev here's the short response from #node.js:
|
This comment has been minimized.
This comment has been minimized.
Actually, it works in Safari TP. |
This comment has been minimized.
This comment has been minimized.
If you've got a decent CSP then |
This comment has been minimized.
This comment has been minimized.
There is another way also, using 2 script tags |
This comment has been minimized.
This comment has been minimized.
Maybe usefulHere's something i put together for "good-enough" client-side feature detection using OP's pattern and comments in this gist.
.. (but wait there's more) :D
function playsNice(cb)
{
var x='(function(){class ಠ extends Array{constructor(j=`a`,...c){const q=(({u:e})=>{return {[`${c}`]:Symbol(j)};})({});'+
'super(j,q,...c)}}new Promise(f=>{const a=function*(){return "\u{20BB7}".match(/./u)[0].length===2||!0};for (let z of a())'+
'{const [x,y,w,k]=[new Set(),new WeakSet(),new Map(),new WeakMap()];break}f(new Proxy({},{get:(h,i)=>i in h ?h[i]:"j".repeat'+
'(0o2)}))}).then(t=>new ಠ(t.d)); if(!navigator.storage||!navigator.storage.estimate){throw "!"}; let n=document.createElement'+
'("canvas"); let g=(!!n.getContext?(n.getContext("webgl")||n.getContext("experimental-webgl")):null); if(!g||!(g instanceof '+
'WebGLRenderingContext)){throw "!"}; if(btoa("jz\'")!=="anon"){throw "!"};})();';
if(!window.addEventListener){cb(false)}; var n=document.createElement('script'); n.ondone=function(event,s)
{
s=this; if(s.done){window.removeEventListener('error',s.ondone,true); if(s.parentNode){s.parentNode.removeChild(s)}; return};
this.done=1; cb(((event&&event.error)?false:true));
};
window.addEventListener('error',n.ondone,true); n.appendChild(document.createTextNode(x));
document.head.appendChild(n); setTimeout(n.ondone,50);
};
playsNice(function(bool)
{
console.log(bool);
}); |
This comment has been minimized.
This comment has been minimized.
How would https://gist.github.com/DaBs/89ccc2ffd1d435efdacff05248514f38#gistcomment-2626592 work unless CSP script-src 'unsafe-inline' is added? |
This comment has been minimized.
This comment has been minimized.
Found an issue. Need to replace
With
Otherwise that is parsed outside of the eval and it will cause failures with things like UglifyJS that expects ES5 |
This comment has been minimized.
Supports detection of following features:
let
+const
for..of
function* ()
)Math
Number
String
Array
Object
EDIT: As reddit user /u/Matthisk point out, this is NOT a fully featured feature detector, however if you're using some of the more advanced features we got in ES2015 that this script doesn't detect for, you probably already know that from reading it.