Detect Safari browser
Solution 1:
Note: always try to detect the specific behavior you're trying to fix, instead of targeting it with isSafari?
As a last resort, detect Safari with this regex:
var isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
It uses negative look-arounds and it excludes Chrome, Edge, and all Android browsers that include the Safari
name in their user agent.
Solution 2:
You can easily use index of Chrome to filter out Chrome:
var ua = navigator.userAgent.toLowerCase();
if (ua.indexOf('safari') != -1) {
if (ua.indexOf('chrome') > -1) {
alert("1") // Chrome
} else {
alert("2") // Safari
}
}
Solution 3:
As other people have already noted, feature detection is preferred over checking for a specific browser. One reason is that the user agent string can be altered. Another reason is that the string may change and break your code in newer versions.
If you still want to do it and test for any Safari version, I'd suggest using this
var isSafari = navigator.vendor && navigator.vendor.indexOf('Apple') > -1 &&
navigator.userAgent &&
navigator.userAgent.indexOf('CriOS') == -1 &&
navigator.userAgent.indexOf('FxiOS') == -1;
This will work with any version of Safari across all devices: Mac, iPhone, iPod, iPad.
Edit
To test in your current browser: https://jsfiddle.net/j5hgcbm2/
Edit 2
Updated according to Chrome docs to detect Chrome on iOS correctly
It's worth noting that all Browsers on iOS are just wrappers for Safari and use the same engine. See bfred.it's comment on his own answer in this thread.
Edit 3
Updated according to Firefox docs to detect Firefox on iOS correctly
Solution 4:
Just use:
var isSafari = window.safari !== undefined;
if (isSafari) console.log("Safari, yeah!");
Solution 5:
This code is used to detect only safari browser
if (navigator.userAgent.search("Safari") >= 0 && navigator.userAgent.search("Chrome") < 0)
{
alert("Browser is Safari");
}