Value of navigator.userAgent
in each major browser
Firefox
navigator.userAgent
"Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:90.0) Gecko/20100101 Firefox/90.0"
Safari
navigator.userAgent
"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.1 Safari/605.1.15"
Chrome
navigator.userAgent
"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.107 Safari/537.36"
Edge
navigator.userAgent
"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.107 Safari/537.36 Edg/92.0.902.55"
Brave
navigator.userAgent
"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.107 Safari/537.36"
navigator.brave
Opera
navigator.userAgent
"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.164 Safari/537.36 OPR/77.0.4054.277"
Code
To determine which browser
function getUserAgent() {
const userAgent = navigator.userAgent
// Note: the order matters here
if (userAgent.includes('OPR/')) return 'opera'
if (userAgent.includes('Firefox/')) return 'firefox'
if (userAgent.includes('Edg/')) return 'edge'
if (navigator.brave) return 'brave'
if (userAgent.includes('Chrome/')) return 'chrome'
if (userAgent.includes('Safari/')) return 'safari'
return undefined
}
Β
To run code coditionally based on browser
function browserSwitch(fnRecord) {
const userAgent = getUserAgent()
const fn = fnRecord[userAgent]
return typeof fn === 'function' && fn()
}
Usage:
const result = browserSwitch({
chrome: () => 'this is what you get if running in chrome',
firefox: () => 'this is what you get if running in firefox',
edge: () => 'this is what you get if running in edge',
safari: () => 'this is what you get if running in safari',
brave: () => 'this is what you get if running in brave',
opera: () => 'this is what you get if running in opera',
})
console.log(result)
Β