Today I Learned - Rocky Kev

TIL finding the browser being used

POSTED ON:

TAGS: javascript browser

My biggest pain the 🍑 client had me fixing something that was a issue on his kid's iPhone 5, using Firefox.

I could not recreate it ANYWHERE ELSE.

To determine their browser, I had to use this.

function whichBrowser() {
  if (isFirefox()) {
    return "Firefox";
  } else if (isEdge()) {
    return "Edge";
  } else if (isIE()) {
    return "Internet Explorer";
  } else if (isOpera()) {
    return "Opera";
  } else if (isVivaldi()) {
    return "Vivaldi";
  } else if (isChrome()) {
    return "Chrome";
  } else if (isSafari()) {
    return "Safari";
  } else {
    return "Unknown";
  }
}
function agentHas(keyword) {
  return navigator.userAgent.toLowerCase().search(keyword.toLowerCase()) > -1;
}
function isIE() {
  return !!document.documentMode;
}
function isSafari() {
  return (
    (!!window.ApplePaySetupFeature || !!window.safari) &&
    agentHas("Safari") &&
    !agentHas("Chrome") &&
    !agentHas("CriOS")
  );
}
function isChrome() {
  return agentHas("CriOS") || agentHas("Chrome") || !!window.chrome;
}
function isFirefox() {
  return agentHas("Firefox") || agentHas("FxiOS") || agentHas("Focus");
}
function isEdge() {
  return agentHas("Edg");
}
function isOpera() {
  return agentHas("OPR");
}
function isVivaldi() {
  return agentHas("Vivaldi");
}

Related TILs

Tagged: javascript

TIL what is npm Script

Despite their high usage they are not particularly well optimized and add about 400ms of overhead. In this article we were able to bring that down to ~22ms.

TIL fancy methods to transform Javascript Objects

You can use Object.entries(), Object.keys(), Object.fromEntries()...

TIL how to hide your JS code

ONE THING TO NOTE: Encrypting a script is stronger than obfuscation, both methods are still not adequate to protect secret content. Honestly, I don't think it's worth it on a production site, and instead just go with pure server-side if you want security. But it's fascinating.