From 161a09cae6ca597b0b98d0390529a92374337402 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andr=C3=A9?= <34163393+amtins@users.noreply.github.com>
Date: Wed, 29 Nov 2023 10:36:56 +0100
Subject: [PATCH] fix(title-bar): component remains displayed after player
 reset (#8481)

When `player.reset` is called the `titleBar` component is not reset.

- Sets the properties `title` and `description` to `undefined` when `player.titleBar.update` is called so that the component is properly reset.
---
 src/js/player.js           |  7 +++++++
 test/unit/reset-ui.test.js | 21 +++++++++++++++++++++
 2 files changed, 28 insertions(+)

diff --git a/src/js/player.js b/src/js/player.js
index df362e3b6f..e3597c6e0d 100644
--- a/src/js/player.js
+++ b/src/js/player.js
@@ -3607,6 +3607,13 @@ class Player extends Component {
 
     this.error(null);
 
+    if (this.titleBar) {
+      this.titleBar.update({
+        title: undefined,
+        description: undefined
+      });
+    }
+
     if (isEvented(this)) {
       this.trigger('playerreset');
     }
diff --git a/test/unit/reset-ui.test.js b/test/unit/reset-ui.test.js
index a09808fd5d..14bea1f865 100644
--- a/test/unit/reset-ui.test.js
+++ b/test/unit/reset-ui.test.js
@@ -160,3 +160,24 @@ QUnit.test('Calling reset player method should reset both error display and play
 
   player.dispose();
 });
+
+QUnit.test('Calling reset player method should reset title bar', function(assert) {
+  const player = TestHelpers.makePlayer();
+
+  player.titleBar.update({
+    title: 'Title',
+    description: 'Description'
+  });
+
+  assert.notOk(player.titleBar.hasClass('vjs-hidden'), 'TitleBar is visible if not empty');
+  assert.strictEqual(player.titleBar.els.title.textContent, 'Title', 'TitleBar title element has content');
+  assert.strictEqual(player.titleBar.els.description.textContent, 'Description', 'TitleBar description element has content');
+
+  player.reset();
+
+  assert.ok(player.titleBar.hasClass('vjs-hidden'), 'TitleBar is not visible if empty');
+  assert.strictEqual(player.titleBar.els.title.textContent, '', 'TitleBar title element has no content');
+  assert.strictEqual(player.titleBar.els.description.textContent, '', 'TitleBar description element has no content');
+
+  player.dispose();
+});