question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Unaccounted for WebXR state when not enough detail present in the environment

See original GitHub issue

Description

When entering WebXR, there appears to be an unaccounted for state, prior to ‘session-started’. It appears this state happens when the camera is not receiving enough information to even begin tracking the environment. For example, if the user is too close to a surface, the scene is too dark, or the user is looking at a very blank wall. The session-started status only seems to begin once the WebXR engine is able to start tracking an environment with enough detail. It also appears that ModelViewer does not render the floating 3D model during this state.

This leaves us with a potentially anomalous state, when the WebXR session has actually started (the camera feed is on) but ModelViewer has not yet registered state as session-started and the 3D model is not displayed. Potentially leading to a confusing state for the user.

It would be useful to be able to handle this state though, as it could be used to provide additional guidance to users during the WebXR experience - ‘unable to scan environment’, ‘needs more light’, ‘back up a bit please’, etc.

Live Demo

In the below demo, both JavaScript event listeners and CSS attribute selectors are being used to visually update status changes. You’ll notice that when WebXR session starts, and the camera is intentionally too close to a blank surface, we see the camera feed, yet the CSS attribute selectors still reflect status as not-presenting, no JS ar-status event has fired, and the 3D model is not rendered. Only when the camera is panned to reveal a little bit of detail - enough to start trying to track the environment - does the JS event and CSS update to a status of session-started and the model then appears. By panning for more detail, we see the status change as expected from session-started to object-placed.

https://puzzle-chip-pluto.glitch.me/

Version

  • model-viewer: v1.6.0

Browser Affected

  • Chrome, version: 90.0.4430.91
  • Edge
  • Firefox
  • IE
  • Safari

OS

  • Android, v 11
  • iOS
  • Linux
  • MacOS
  • Windows

AR

  • WebXR
  • SceneViewer
  • QuickLook

Device

Pixel 4 XL

https://user-images.githubusercontent.com/53870482/116556142-12280a80-a8f5-11eb-8053-43dd2dd6f2c0.mov

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:10 (6 by maintainers)

github_iconTop GitHub Comments

1reaction
elalishcommented, May 7, 2021

I like this idea, thanks for thinking it through. I think session-started not happening right at session start is a bug rather than a breaking change. As I was implementing the tracking event I realized it’s a little tricky because you always start out not tracking, but that’s expected; it takes a few frames to understand your space. I’m going to put in a delay so that it only sends a not-tracking event if it’s been long enough that there seems to be a problem.

0reactions
elalishcommented, May 10, 2021

Thanks for testing it! That’s good to hear.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Starting up and shutting down a WebXR session - Web APIs
The navigator.xr property doesn't even exist if the document wasn't loaded securely. This may also be the case if there is no compatible...
Read more >
WebXR not working on Chrome Desktop Windows · Issue #4709
The browser enters VR mode but doesn't present in headset. I get now Chrome next up prompt in the SteamVR space instead of...
Read more >
WebXR Device API - W3C
An XR device is a physical unit of hardware that can present immersive content to the user. Content is considered to be "immersive"...
Read more >
WebXR Device API Explained - Immersive Web
The WebXR Device API provides access to input and output capabilities commonly associated with Virtual Reality (VR) and Augmented Reality (AR) devices.
Read more >
Usability of WebXR Visualizations in Urban Planning - MDPI
Here we test the WebXR solution that can mitigate those problems. We have created six AR and VR environments that resembled common urban...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found