Blog
How to check if the browser is Safari programmatically?

How to check if the browser is Safari programmatically?

In this article, we review how you can check if the browser is Safari programmatically. We will look at:

  1. isSafari function

  2. navigator.userAgent

isSafari function

I found the following code in the snapdom/src/utils/helpers.js

export function isSafari() {
  return /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
}

This function uses a regular expression to determine if the browser is Safari and uses the navigator.userAgent API.

navigator.userAgent

The Navigator.userAgent read-only property returns the user agent string for the current browser.

This is a test I ran to see this function in action in my Google chrome’s browser.

I found an interesting point in the MDN docs:

Browser identification based on detecting the user agent string is unreliable and is not recommended, as the user agent string is user configurable. For example:

  • In Firefox, you can change the preference general.useragent.override in about:config. Some Firefox extensions do that; however, this only changes the HTTP header that gets sent and that is returned by navigator.userAgent. There might be other methods that utilize JavaScript code to identify the browser.

  • Opera 6+ allows users to set the browser identification string via a menu.

Learn more about navigator.userAgent.

About me:

Hey, my name is Ramu Narasinga. I study codebase architecture in large open-source projects.

Email: ramu.narasinga@gmail.com

Want to learn from open-source? Solve challenges inspired by open-source projects.

References:

  1. https://github.com/zumerlab/snapdom/blob/main/src/utils/helpers.js#L284

  2. https://github.com/zumerlab/snapdom/blob/main/src/api/snapdom.js#L8

  3. https://developer.mozilla.org/en-US/docs/Web/API/Navigator/userAgent