aframevr / aframevr/aframe

Scene has a gap when exiting Fullscreen/VR mode in Firefox for Android

Open
#1,235 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

mobile
Dominant language
JavaScript
Stars
17.6k
Forks
4.4k
PR merge metrics
No merged PRs in 30d

Description

Description:

  1. Open Firefox for Android
  2. Launch an A-Frame scene (e.g., Hello World)
  3. Enter VR mode (which enters Fullscreen)
  4. Press the hardware back button to exit Fullscreen/VR mode
  5. Notice there's a ~20px gap (where the toast notification once was) below the scene (i.e., the canvas) and the bottom of the <body>
  6. Click anywhere on the page
  7. Notice the gap goes away

I tried adding a bunch of workarounds to src/core/fullscreen.js:

  scene.addEventListener('exit-vr', function () {
    setTimeout(function () {
      scene.resize();
      window.scrollTo(0, 0);
      document.body.scrollTop = 0;
      scene.canvas.focus();
      document.activeElement.blur();
      scene.canvas.click();
      document.body.click();
    }, 3000);
  });

Nothing worked. The gap went away only by calling alert, clicking anywhere on the page, or rotating the phone to force an orientation change.

I could not reproduce this in Chrome for Android nor any mobile browser on iOS. This is likely a Firefox for Android bug that we need to file. It's very minor, but it looks quite buggy.

  • A-Frame Version: all (0.1.2 on https://aframe.io/ and master)
  • Platform/Device: Android / Firefox stable (45.0) and Firefox Beta (46.0)

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the gap using Firefox for Android and the Hello World A-Frame scene, following the listed VR/fullscreen and hardware-back steps. Review src/core/fullscreen.js and compare the behavior with Chrome for Android and iOS browsers. Done means documenting a confirmed Firefox-specific issue for filing, or identifying a reproducible project-side fix.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
ar-vr-xr
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.