diff --git a/src/js/player.js b/src/js/player.js index 6fa3561703..5e93b5686a 100644 --- a/src/js/player.js +++ b/src/js/player.js @@ -566,6 +566,10 @@ class Player extends Component { Dom.prependTo(tag, el); this.children_.unshift(tag); + // Set lang attr on player to ensure CSS :lang() in consistent with player + // if it's been set to something different to the doc + this.el_.setAttribute('lang', this.language_); + this.el_ = el; return el; diff --git a/test/unit/player.test.js b/test/unit/player.test.js index c3da932fda..47034a2eb9 100644 --- a/test/unit/player.test.js +++ b/test/unit/player.test.js @@ -1160,6 +1160,23 @@ QUnit.test('inherits language from parent element', function(assert) { } }); +QUnit.test('sets lang attribute on player el', function(assert) { + const fixture = document.getElementById('qunit-fixture'); + const oldLang = fixture.getAttribute('lang'); + + fixture.setAttribute('lang', 'x-attr-test'); + const player = TestHelpers.makePlayer(); + + assert.equal(player.el().getAttribute('lang'), 'x-attr-test', 'player sets lang attribute on self'); + + player.dispose(); + if (oldLang) { + fixture.setAttribute('lang', oldLang); + } else { + fixture.removeAttribute('lang'); + } +}); + QUnit.test('should return correct values for canPlayType', function(assert) { const player = TestHelpers.makePlayer();