Page MenuHomePhabricator

VideoJS displays in wrong size using live preview
Closed, ResolvedPublicBUG REPORT

Description

Steps to Reproduce:

  1. Turn on live preview (“Show previews without reloading the page” at Preferences / Editing) and VideoJS beta feature.
  2. Edit a random page and insert a video embed, say, [[File:Rudy Mancuso & Maia Mitchell - Magic (Official Music Video).webm|1000px]].
  3. Press the preview button.
  4. Change the display size to e.g. 100px.
  5. Press the preview button again.

Actual Results:
The JavaScript-less experience (native HTML5 player) displays in the right size (100px), but the VideoJS player appearing soon after uses the size of the first preview (1000px). This remains so even if the video is replaced, only the ordinal within page counts.

Expected Results:
The VideoJS player uses the size specified in wikitext, just like the native player.

Event Timeline

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptJul 17 2019, 6:51 PM
TheDJ added a subscriber: TheDJ.Jul 17 2019, 7:17 PM

This is because we reuse ids.. and render the new player in detached mode, before removing the old player.. But video.js keeps global dom state, which is only removed when you use the .dispose() function on the player.. And since we don't, the 'new player' reuses context from the 'old' player...

I've known about this for a while, but struggle with finding a solution.. MutationObserver ?

Change 524044 had a related patch set uploaded (by TheDJ; owner: TheDJ):
[mediawiki/extensions/TimedMediaHandler@master] live preview: dispose of detached players

https://gerrit.wikimedia.org/r/524044

TheDJ claimed this task.Jul 17 2019, 9:44 PM

Change 524044 merged by jenkins-bot:
[mediawiki/extensions/TimedMediaHandler@master] live preview: dispose of detached players

https://gerrit.wikimedia.org/r/524044

TheDJ closed this task as Resolved.Jul 25 2019, 8:02 AM