-
Notifications
You must be signed in to change notification settings - Fork 7.5k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
fix: Suppress Infinity duration on Android Chrome before playback (#3476
) HTML5 tech will return NaN instead of Infinity if playback has not started. Fires a durationupdate event once the reported duration can be believed if the duration is still Infinity, so controls can update. Fixes #3079.
- Loading branch information
1 parent
2988f6a
commit ed59531
Showing
2 changed files
with
43 additions
and
1 deletion.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -428,7 +428,30 @@ class Html5 extends Tech { | |
* @return {Number} | ||
*/ | ||
duration() { | ||
return this.el_.duration || 0; | ||
// Android Chrome will report duration as Infinity for VOD HLS until after | ||
// playback has started, which triggers the live display erroneously. | ||
// Return NaN if playback has not started and trigger a durationupdate once | ||
// the duration can be reliably known. | ||
if (this.el_.duration === Infinity && | ||
browser.IS_ANDROID && browser.IS_CHROME) { | ||
if (this.el_.currentTime === 0) { | ||
// Wait for the first `timeupdate` with currentTime > 0 - there may be | ||
// several with 0 | ||
const checkProgress = () => { | ||
if (this.el_.currentTime > 0) { | ||
// Trigger durationchange for genuinely live video | ||
if (this.el_.duration === Infinity) { | ||
this.trigger('durationchange'); | ||
} | ||
this.off(this.player_, 'timeupdate', checkProgress); | ||
This comment has been minimized.
Sorry, something went wrong.
This comment has been minimized.
Sorry, something went wrong. |
||
} | ||
}; | ||
|
||
this.on(this.player_, 'timeupdate', checkProgress); | ||
This comment has been minimized.
Sorry, something went wrong.
boushley
Contributor
|
||
return NaN; | ||
} | ||
} | ||
return this.el_.duration || NaN; | ||
} | ||
|
||
/** | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
The
this.player_
reference here is likely misleading.This is equivalent to
this.off('timeupdate', checkProgress)
sincethis.player_
will always bethis
for a Tech. Based on slack conversations we've had the lack of a reference to the player is on purpose inside of Techs. So the confusingthis.player_
should be removed from this call.