"If a worker wants to do his job well, he must first sharpen his tools." - Confucius, "The Analects of Confucius. Lu Linggong"
Front page > Programming > Detecting visionOS by JavaScript

Detecting visionOS by JavaScript

Published on 2024-07-30
Browse:584

Detecting visionOS by JavaScript

As of July 2024, you can use the following code to determine if a browser is on visionOS or not. (This does not identify browser brands; I only checked major browsers.)

function isVisionOS () {
  return navigator.userAgent.includes("(Macintosh;") &&
    !!navigator.xr &&
    document.ontouchstart !== undefined;
}

Breakdown

The function is using 3 criteria.

1. Whether the user agent string contains "(Macintosh;" or not.

Safari on macOS, iPadOS, visionOS has user agents like following.

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/18.0 Safari/605.1.15

By using the following code, we can determine if the browser is on macOS, iPadOS, or visionOS.

navigator.userAgent.includes("(Macintosh;")

2. Whether the browser supports XR or not.

According to the MDN page, Safari for macOS, iPadOS does not support XR. However, Safari on visionOS supports.

You can check if XR is supported with the following code:

!!navigator.xr

So far, it seems like criteria No.1 and No.2 are enough to identify visionOS. However, Chrome on macOS supports XR. So we need No.3.

3. Whether it is a touch device or not.

Finally, we can exclude macOS by using the following code.

document.ontouchstart !== undefined
OS Browser UserAgent navigator.xr Touch enabled
visionOS (2.0) Safari
visionOS (2.0) Firefox (128.3)
Windows 11 Chrome (127.0.6533.72)
Windows 11 Edge (127.0.2651.74)
Android 12 (Pixel 6) Chrome (126.0.6478.188)
iOS (18.0) Chrome (127.0.6533.77)
iOS (18.0) Safari
iPadOS (17.5.1) Chrome (127.0.6533.77)
iPadOS (17.5.1) Safari
macOS (Sonoma 14.5) Chrome (126.0.6478.114)
macOS (Sonoma 14.5) Safari
Release Statement This article is reproduced at: https://dev.to/ku6ryo/detecting-visionos-by-javascript-1ei5?1 If there is any infringement, please contact [email protected] to delete it
Latest tutorial More>

Disclaimer: All resources provided are partly from the Internet. If there is any infringement of your copyright or other rights and interests, please explain the detailed reasons and provide proof of copyright or rights and interests and then send it to the email: [email protected] We will handle it for you as soon as possible.

Copyright© 2022 湘ICP备2022001581号-3