browserName.js

const browserName = {
    browsers: [
        'Chrome',
        'Firefox',
        'Opera',
        'Safari',
        'MobileChrome',
        'MobileSafari',
    ],
    toString() {
        const browser = this.browsers.find(browser => this[`is${browser}`]());

        if (!browser) {
            return 'Unknown';
        }

        return browser;
    },
    isChrome() {
        const { navigator: { userAgent, vendor } } = window;

        return (
            userAgent.includes('Chrome')
            && !this.isOpera()
            && vendor === 'Google Inc.'
        );
    },
    isFirefox() {
        const { navigator: { userAgent, vendor } } = window;

        return (
            userAgent.includes('Firefox')
            && !userAgent.includes('like Gecko')
            && !vendor.length
        );
    },
    isOpera() {
        const { navigator: { userAgent } } = window;

        return (
            userAgent.includes('OPR')
        );
    },
    isSafari() {
        const { navigator: { userAgent, vendor } } = window;

        return (
            userAgent.includes('Safari')
            && !this.isChrome()
            && vendor === 'Apple Computer, Inc.'
        )
    },
    isMobileChrome() {
        const { navigator: { userAgent } } = window;

        return (
            // TODO: This is only for iOS
            userAgent.includes('CriOS')
        );
    },
    isMobileSafari() {
        const { navigator: { userAgent } } = window;

        return (
            this.isSafari()
            && userAgent.includes('Mobile')
            && !this.isMobileChrome()
        );
    },
};

export default browserName;