Reset the cached clientRect when media is attached (video-dev#5070)

* Reset the cached clientRect when media is attached * Add test for capLevelToPlayerSize event order independence
dimied · Nov 29, 2022 · 4f01724 · 4f01724
1 parent d785f03
commit 4f01724
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 0 deletions.
diff --git a/src/controller/cap-level-controller.ts b/src/controller/cap-level-controller.ts
@@ -90,6 +90,7 @@ class CapLevelController implements ComponentAPI {
     data: MediaAttachingData
   ) {
     this.media = data.media instanceof HTMLVideoElement ? data.media : null;
+    this.clientRect = null;
   }
 
   protected onManifestParsed(

diff --git a/tests/unit/controller/cap-level-controller.js b/tests/unit/controller/cap-level-controller.js
@@ -132,6 +132,34 @@ describe('CapLevelController', function () {
       expect(capLevelController.mediaWidth).to.equal(1280 * pixelRatio);
       expect(capLevelController.mediaHeight).to.equal(720 * pixelRatio);
     });
+
+    it('gets valid width and height when the media element is attached after onManifestParsed', function () {
+      hls = new Hls({ capLevelToPlayerSize: true });
+      capLevelController = new CapLevelController(hls);
+      capLevelController.onManifestParsed(Events.MANIFEST_PARSED, {
+        levels,
+      });
+
+      let bounds = capLevelController.getDimensions();
+      expect(bounds.width).to.equal(0);
+      expect(bounds.height).to.equal(0);
+      expect(capLevelController.mediaWidth).to.equal(0);
+      expect(capLevelController.mediaHeight).to.equal(0);
+
+      media.style.width = '1280px';
+      media.style.height = '720px';
+      document.querySelector('#test-fixture').appendChild(media);
+      capLevelController.onMediaAttaching(Events.MEDIA_ATTACHING, {
+        media,
+      });
+
+      const pixelRatio = capLevelController.contentScaleFactor;
+      bounds = capLevelController.getDimensions();
+      expect(bounds.width).to.equal(1280);
+      expect(bounds.height).to.equal(720);
+      expect(capLevelController.mediaWidth).to.equal(1280 * pixelRatio);
+      expect(capLevelController.mediaHeight).to.equal(720 * pixelRatio);
+    });
   });
 
   describe('initialization', function () {