fix: take devicePixelRatio into account during ABR (#784)

Backport of #744 against 1.x Co-authored-by: Ehsan Chavoshi <[email protected]>
videojs · Mar 26, 2020 · bd63e57 · bd63e57
1 parent 1a4fc1e
commit bd63e57
Showing 1 changed file with 9 additions and 6 deletions.
diff --git a/src/playlist-selectors.js b/src/playlist-selectors.js
@@ -121,9 +121,9 @@ export const comparePlaylistResolution = function(left, right) {
  * @param {Number} playerBandwidth
  *        Current calculated bandwidth of the player
  * @param {Number} playerWidth
- *        Current width of the player element
+ *        Current width of the player element (should account for the device pixel ratio)
  * @param {Number} playerHeight
- *        Current height of the player element
+ *        Current height of the player element (should account for the device pixel ratio)
  * @param {Boolean} limitRenditionByPlayerDimensions
  *        True if the player width and height should be used during the selection, false otherwise
  * @return {Playlist} the highest bitrate playlist less than the
@@ -272,10 +272,12 @@ export const simpleSelector = function(master,
  * bandwidth variance
  */
 export const lastBandwidthSelector = function() {
+  const pixelRatio = window.devicePixelRatio || 1;
+
   return simpleSelector(this.playlists.master,
                         this.systemBandwidth,
-                        parseInt(safeGetComputedStyle(this.tech_.el(), 'width'), 10),
-                        parseInt(safeGetComputedStyle(this.tech_.el(), 'height'), 10),
+                        parseInt(safeGetComputedStyle(this.tech_.el(), 'width'), 10) * pixelRatio,
+                        parseInt(safeGetComputedStyle(this.tech_.el(), 'height'), 10) * pixelRatio,
                         this.limitRenditionByPlayerDimensions);
 };
 
@@ -295,6 +297,7 @@ export const lastBandwidthSelector = function() {
  */
 export const movingAverageBandwidthSelector = function(decay) {
   let average = -1;
+  const pixelRatio = window.devicePixelRatio || 1;
 
   if (decay < 0 || decay > 1) {
     throw new Error('Moving average bandwidth decay must be between 0 and 1.');
@@ -308,8 +311,8 @@ export const movingAverageBandwidthSelector = function(decay) {
     average = decay * this.systemBandwidth + (1 - decay) * average;
     return simpleSelector(this.playlists.master,
                           average,
-                          parseInt(safeGetComputedStyle(this.tech_.el(), 'width'), 10),
-                          parseInt(safeGetComputedStyle(this.tech_.el(), 'height'), 10),
+                          parseInt(safeGetComputedStyle(this.tech_.el(), 'width'), 10) * pixelRatio,
+                          parseInt(safeGetComputedStyle(this.tech_.el(), 'height'), 10) * pixelRatio,
                           this.limitRenditionByPlayerDimensions);
   };
 };