aframevr / aframevr/aframe

Loaded/preloaded/autoplayed videos are uncached and time out if `autoplay="false"` but missing `preload="auto"`

Open
#3,175 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

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

Description

Description:

If a video is already loaded…

  1. the video loads but is not cached.

  2. an uncaught Promise is thrown (see error in the Console).
    https://github.com/aframevr/aframe/blob/68e6c26/src/core/a-assets.js#L162

  3. have mediaElementLoaded return a Promise.resolve() instead of undefined.

    Change this:

      if (!el.hasAttribute('autoplay') && el.getAttribute('preload') !== 'auto') {
        return;
      }
    

    to this:

      if (!el.autoplay && el.preload !== 'auto') {
        THREE.Cache.files[el.src] = el;
        return Promise.resolve();
      }
    

    Notice the hasAttribute and getAttribute calls have been changed to instead use the <video> element's (magical) getter properties. (I commented on this in https://github.com/aframevr/aframe/issues/3173#issuecomment-337191996.)

  4. Promise.all should be caught if anything throws.

/cc @machenmusik


  • A-Frame Version: 0.7.0/master
  • Platform / Device: any (but tested with iPhone 5 on iOS 10.3.1, iPhone 7 with iOS 11.

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

Start in src/core/a-assets.js, reading mediaElementLoaded around the linked lines and the Promise.all call near line 59. Verify that already-loaded video elements are cached, return a resolved promise when appropriate, and that Promise.all errors are caught without an uncaught console rejection.

Written by the indexing model from the issue text.

Assessment

Tech stack
html, javascript, three.js
Domain
frontend, web-dev
Issue type
Bug
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
38/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.