XRInputSource: handedness property

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

The read-only XRInputSource property handedness indicates which of the user's hands the WebXR input source is associated with, or if it's not associated with a hand at all.

Value

A string indicating whether the input controller is held in one of the user's hands, and if it is, which hand. The value is one of the following:

none

The input controller is not associated with one of the user's hands.

left

The input controller is being held in, worn on, or is attached to the user's left hand.

The input controller is being held in, worn on, or is attached to the user's right hand.

Usage notes

If the input source is not a device associated with a user's hand (whether by being held, attached, or worn), the value of handedness is none. This may indicate, for example, an input source which isn't hand-held, such as controls built into a headset or an input device attached to the head or body.

Examples

One important usage scenario for handedness is to determine which hand a controller is in so you can draw a representation of that hand (or the device that hand is controlling) in virtual space.

js
function updateInputSources(session, frame, refSpace) {
  for (const source of session.inputSources) {
    if (source.gripSpace) {
      const gripPose = frame.getPose(source.gripSpace, refSpace);

      if (gripPose) {
        myRenderHandObject(gripPose, inputSource.handedness);
      }
    }
  }
}

This function, which would be called every animation frame (or possibly just periodically, depending on the degree of smoothness required and any performance constraints), scans the list of input sources looking for any which have a gripSpace which isn't null. If a gripSpace is present, that means the input source is a hand-held device of some sort, so it should be rendered visibly if possible.

If gripSpace is non-null, the function proceeds to get the pose for the gripSpace transformed into the current reference space. Assuming that's then valid, a function called myRenderHandObject() is called with the grip's pose and the value of handedness. It then draws the appropriate model positioned and formed for the correct hand.

Specifications

Specification
WebXR Device API
# dom-xrinputsource-handedness

Browser compatibility

desktop mobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
handedness
Chrome – Full support
Chrome 79 (Release date: 2019-12-10)
footnote Full support
Edge – Full support
Edge 79 (Release date: 2020-01-15)
footnote Full support
Firefox – No support
Firefox
footnote No support
Opera – Full support
Opera 66 (Release date: 2020-01-07)
footnote Full support
Safari – No support
Safari
footnote No support
Chrome Android – Full support
Chrome Android 79 (Release date: 2019-12-17)
footnote Full support
Firefox for Android – No support
Firefox for Android
footnote No support
Opera Android – Full support
Opera Android 57 (Release date: 2020-03-30)
footnote Full support
Safari on iOS – No support
Safari on iOS
footnote No support
Samsung Internet – Full support
Samsung Internet 11.2 (Release date: 2020-03-22)
footnote Full support
WebView Android – No support
WebView Android
footnote No support
WebView on iOS – No support
WebView on iOS
footnote No support

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
No support
No support

See also