---
title: XRSession.visibilityState
slug: Web/API/XRSession/visibilityState
tags:
  - API
  - AR
  - Augmented Reality
  - Experimental
  - Property
  - Reference
  - VR
  - Virtual Reality
  - WebXR
  - WebXR Device API
  - XRSession
  - visibilityState
browser-compat: api.XRSession.visibilityState
---
{{APIRef("WebXR Device API")}}

The *read-only* **`visibilityState`** property of the
{{DOMxRef("XRSession")}} interface is a string indicating whether the WebXR content is
currently visible to the user, and if it is, whether it's the primary focus.

Every time the visibility state changes, a
{{DOMxRef("XRSession.visibilitychange_event","visibilitychange")}} event is fired on the
{{DOMxRef("XRSession")}} object.

## Value

A string indicating whether or not the XR content is
visible to the user and if it is, whether or not it's currently the primary focus.

The possible values of `visibilityState` are:

- `hidden`
  - : The virtual scene generated by the {{domxref("XRSession")}} is not currently visible to the user,
    so its {{domxref("XRSession.requestAnimationFrame", "requestAnimationFrame()")}}
    callbacks are *not* being executed until the `visibilityState` changes.
    Input controllers are *not* being handled for the session.
- `visible`
  - : The virtual scene rendered by the {{domxref("XRSession")}} is currently visible to the user
    and is the primary focus of the user's attention. To that end, the session's
    {{domxref("XRSession.requestAnimationFrame", "requestAnimationFrame()")}} callbacks are being processed
    at the XR device's native refresh rate and input controllers are being processed as normal.
- `visible-blurred`
  - : While the virtual scene rendered by the {{domxref("XRSession")}} may currently be visible to the user,
    it is not the user's primary focus at the moment; it's also possible the session is not currently visible at all.
    In order to optimize resource utilization, the {{Glossary("user agent")}} may be handling the session's
    {{domxref("XRSession.requestAnimationFrame", "requestAnimationFrame()")}} callbacks at a throttled rate.
    Input controllers are _not_ being processed for the session.

## Usage notes

It's important to keep in mind that because an immersive WebXR session is potentially
being shown using a different display than the HTML document in which it's running (such
as when being shown on a headset), the value of a
session's `visibilityState` may not necessarily be the same as the owning
*{{domxref("document")}}'s* {{domxref("Document.visibilityState",
  "visibilityState")}}. For instance, if the viewer is using a headset tethered to a
computer and the immersive scene is obscured by a configuration UI, the user could peek
out from behind the headset and still be able to see the document itself on their
computer's monitor.

## Specifications

{{Specifications}}

## Browser compatibility

{{Compat}}

## See also

- {{DOMxRef("XRSession.onvisibilitychange")}}
- {{DOMxRef("XRSession.visibilitychange_event","visibilitychange")}} event
