Browser detect

browser.js

import isString from 'lodash/isString';

export class Browser {

  /**
   * Creates an instance of Browser.
   * @memberof Browser
   */
  constructor() {
    this.setClassOnBody(this.detectBrowser());
  }

  /**
   * Sets a class on Body.
   *
   * @param {string} browser
   * @memberof Browser
   */
  setClassOnBody(browser) {
    isString(browser) && document.body.classList.add(`browser-${browser }`);
  }

  /**
   *
   *
   * @returns {string} String of browser
   * @memberof Browser
   */
  detectBrowser() {
    const ua = window.navigator.userAgent;

    // Test values; Uncomment to check result …

    // IE 10
    // const ua = 'Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; Trident/6.0)';

    // IE 11
    // const ua = 'Mozilla/5.0 (Windows NT 6.3; Trident/7.0; rv:11.0) like Gecko';

    // Edge 12 (Spartan)
    // const ua = 'Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.71 Safari/537.36 Edge/12.0';

    // Edge 13
    // const ua = 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2486.0 Safari/537.36 Edge/13.10586';

    // Firefox
    // const ua = 'Mozilla/5.0 (Windows NT 6.3; Win64; x64; rv:55.0) Gecko/20100101 Firefox/55.0';

    // Chrome
    // const ua = 'Mozilla/5.0 (Windows NT 6.3; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/59.0.3071.115 Safari/537.36';

    // Safari
    // const ua = 'Mozilla/5.0 (iPhone; CPU iPhone OS 9_1 like Mac OS X) AppleWebKit/601.1.46 (KHTML, like Gecko) Version/9.0 Mobile/13B143 Safari/601.1';

    const msie = ua.indexOf('MSIE ');
    if (msie > 0) {
      // IE 10 or older => return version number
      return 'ie-' + parseInt(ua.substring(msie + 5, ua.indexOf('.', msie)), 10);
    }

    const trident = ua.indexOf('Trident/');
    if (trident > 0) {
      // IE 11 => return version number
      var rv = ua.indexOf('rv:');
      return 'ie-' + parseInt(ua.substring(rv + 3, ua.indexOf('.', rv)), 10);
    }

    const edge = ua.indexOf('Edge/');
    if (edge > 0) {
      // Edge (IE 12+) => return version number
      return 'edge-' + parseInt(ua.substring(edge + 5, ua.indexOf('.', edge)), 10);
    }

    const firefox = ua.indexOf('Firefox/');
    if (firefox > 0) {
      // Firefox => return version number
      return 'firefox-' + parseInt(ua.substring(firefox + 8, ua.indexOf('.', firefox)), 10);
    }

    const chrome = ua.indexOf('Chrome/');
    if (chrome > 0) {
      // Chrome => return version number
      return 'chrome-' + parseInt(ua.substring(chrome + 7, ua.indexOf('.', chrome)), 10);
    }

    const safari = ua.indexOf('Safari/');
    if (safari > 0) {
      // Safari => return version number
      return 'safari-' + parseInt(ua.substring(ua.indexOf('OS ') + 3).split('_')[0]);
    }

    // other browser
    return false;
  }
}