XRInputSourceEvent: frame 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 XRInputSourceEvent property frame specifies an XRFrame object representing the event frame during which a WebXR user input occurred. This may thus be an event which occurred in the past rather than a current or impending event.

Value

An XRFrame indicating the event frame at which the user input event described by the object took place.

Usage notes

The event frame does not correspond to a visual frame as is delivered to the frame rendering callback function (see Rendering and the WebXR frame rendering callback for details on the callback). Instead, the XRFrame specified by the frame property is a method to provide access to the getPose() method, which you can use to get the relative positions of the objects in the scene at the time the event occurred.

However, since the event frame isn't an animation frame, there is no viewer pose available to represent the viewer's current point of view; the results of calling getViewerPose() will be an XRViewerPose with an empty views list.

Examples

This code shows a handler for the selectstart event which gets the target ray's pose from the frame, mapping the pose representing the ray (event.inputSource.targetRaySpace) to the overall reference space myRefSpace.

Then, if the result isn't null, the target ray pose's transform is passed into a function called myCheckAndHandleHit() to see if the ray was pointing at anything when the select was triggered.

js
xrSession.onselectstart = (event) => {
  let targetRayPose = event.frame.getPose(
    event.inputSource.targetRaySpace,
    myRefSpace,
  );
  if (targetRayPose) {
    checkAndHandleHit(targetRayPose.transform);
  }
};

Specifications

Specification
WebXR Device API
# dom-xrinputsourceevent-frame

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
frame
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