fix: registering new player component (#8932)

Do not allow to register new Player component, if any instance of the
current component still exists.

Fixes #8925

Co-authored-by: mister-ben <1676039+mister-ben@users.noreply.github.com>

src/js/component.js

@@ -2023,12 +2023,14 @@ class Component {
 
       // If we have players that were disposed, then their name will still be
       // in Players.players. So, we must loop through and verify that the value
-      // for each item is not null. This allows registration of the Player component
+      // for each item is null. This allows registration of the Player component
       // after all players have been disposed or before any were created.
-      if (players &&
-          playerNames.length > 0 &&
-          playerNames.map((pname) => players[pname]).every(Boolean)) {
-        throw new Error('Can not register Player component after player has been created.');
+      if (players && playerNames.length > 0) {
+        for (let i = 0; i < playerNames.length; i++) {
+          if (players[playerNames[i]] !== null) {
+            throw new Error('Can not register Player component after player has been created.');
+          }
+        }
       }
     }
 

test/unit/player.test.js

@@ -2345,6 +2345,41 @@ QUnit.test('should not allow to register custom player when any player has been
   videojs.registerComponent('Player', Player);
 });
 
+QUnit.test('should not allow to register custom player when any player still exists', function(assert) {
+  const videoTag1 = document.createElement('video');
+  const videoTag2 = document.createElement('video');
+
+  const fixture = document.getElementById('qunit-fixture');
+
+  fixture.appendChild(videoTag1);
+  fixture.appendChild(videoTag2);
+
+  const player1 = videojs(videoTag1);
+  const player2 = videojs(videoTag2);
+
+  class CustomPlayer extends Player {}
+
+  assert.throws(function() {
+    videojs.registerComponent('Player', CustomPlayer);
+  }, 'Can not register Player component after player has been created');
+
+  player1.dispose();
+
+  // still throws, because player2 still exists
+  assert.throws(function() {
+    videojs.registerComponent('Player', CustomPlayer);
+  }, 'Can not register Player component after player has been created');
+
+  player2.dispose();
+
+  // successfully registers, because no player exists anymore
+  // should not throw
+  videojs.registerComponent('Player', CustomPlayer);
+
+  // reset the Player to the original value;
+  videojs.registerComponent('Player', Player);
+});
+
 QUnit.test('setters getters passed to tech', function(assert) {
   const tag = TestHelpers.makeTag();
   const fixture = document.getElementById('qunit-fixture');