fix: do not handle hotkeys in contenteditable elements (#6182)

Exclude elements where `el.isContentEditable == true;` for hotkeys.

src/js/player.js

@@ -2938,8 +2938,10 @@ class Player extends Component {
     const excludeElement = (el) => {
       const tagName = el.tagName.toLowerCase();
 
-      // These tags will be excluded entirely.
-      const excludedTags = ['textarea'];
+      // The first and easiest test is for `contenteditable` elements.
+      if (el.isContentEditable) {
+        return true;
+      }
 
       // Inputs matching these types will still trigger hotkey handling as
       // they are not text inputs.
@@ -2956,6 +2958,9 @@ class Player extends Component {
         return allowedInputTypes.indexOf(el.type) === -1;
       }
 
+      // The final test is by tag name. These tags will be excluded entirely.
+      const excludedTags = ['textarea'];
+
       return excludedTags.indexOf(tagName) !== -1;
     };
 

test/unit/player-user-actions.test.js

@@ -410,6 +410,27 @@ QUnit.test('when userActions.hotkeys.playPauseKey can be a function', function(a
   assert.strictEqual(this.player.play.callCount, 1, 'has played');
 });
 
+QUnit.test('hotkeys are ignored when focus is in a contenteditable element', function(assert) {
+  this.player.dispose();
+  this.player = TestHelpers.makePlayer({
+    controls: true,
+    userActions: {
+      hotkeys: true
+    }
+  });
+
+  const div = document.createElement('div');
+
+  div.contentEditable = 'true';
+  this.player.el_.appendChild(div);
+  div.focus();
+
+  assert.expect(14);
+  defaultKeyTests.fullscreen(this.player, assert, false);
+  defaultKeyTests.mute(this.player, assert, false);
+  defaultKeyTests.playPause(this.player, assert, false);
+});
+
 QUnit.test('hotkeys are ignored when focus is in a textarea', function(assert) {
   this.player.dispose();
   this.player = TestHelpers.makePlayer({