From b1e8ded7a8cec12196489194bd212a86974770a0 Mon Sep 17 00:00:00 2001
From: Fabian Helfer <fhelfer@databay.de>
Date: Mon, 2 Feb 2026 12:47:03 +0100
Subject: [PATCH 1/2] [Fix] 0047061: Audio/Video elements must not have empty
 id attribute

---
 .../Implementation/Component/Player/Renderer.php    | 13 +++++++++----
 .../ILIAS/UI/tests/Component/Item/ItemTest.php      |  2 +-
 .../UI/tests/Component/Player/PlayerAudioTest.php   |  2 +-
 .../UI/tests/Component/Player/PlayerVideoTest.php   | 10 +++++-----
 4 files changed, 16 insertions(+), 11 deletions(-)

diff --git a/components/ILIAS/UI/src/Implementation/Component/Player/Renderer.php b/components/ILIAS/UI/src/Implementation/Component/Player/Renderer.php
index 9489d4788a3e..7b80de25069b 100755
--- a/components/ILIAS/UI/src/Implementation/Component/Player/Renderer.php
+++ b/components/ILIAS/UI/src/Implementation/Component/Player/Renderer.php
@@ -45,7 +45,9 @@ public function renderAudio(Component\Component $component, RendererInterface $d
     {
         $tpl = $this->getTemplate("tpl.audio.html", true, true);
 
-        $id = $this->bindJavaScript($component);
+        // Always provide a non-empty id attribute. If there is no JS binding,
+        // fall back to a plain, unique id.
+        $id = $this->bindJavaScript($component) ?? $this->createId();
 
         if ($component->getTranscription() != "") {
             $factory = $this->getUIFactory();
@@ -96,7 +98,8 @@ public function renderVimeo(
 
         $tpl = $this->getTemplate("tpl.video_vimeo.html", true, true);
 
-        $id = $this->bindJavaScript($component);
+        // Ensure the iframe always has a valid, non-empty id attribute.
+        $id = $this->bindJavaScript($component) ?? $this->createId();
 
         $tpl->setVariable("ID", $id);
         $tpl->setVariable("SOURCE", $component->getSource());
@@ -111,7 +114,8 @@ public function renderYoutube(
 
         $tpl = $this->getTemplate("tpl.video_youtube.html", true, true);
 
-        $id = $this->bindJavaScript($component);
+        // Ensure the iframe always has a valid, non-empty id attribute.
+        $id = $this->bindJavaScript($component) ?? $this->createId();
 
         $tpl->setVariable("ID", $id);
         $tpl->setVariable("SOURCE", $component->getSource());
@@ -126,7 +130,8 @@ public function renderNative(
 
         $tpl = $this->getTemplate("tpl.video.html", true, true);
 
-        $id = $this->bindJavaScript($component);
+        // Ensure the <video> element always has a valid, non-empty id attribute.
+        $id = $this->bindJavaScript($component) ?? $this->createId();
 
         foreach ($component->getSubtitleFiles() as $lang_key => $file) {
             $tpl->setCurrentBlock("track");
diff --git a/components/ILIAS/UI/tests/Component/Item/ItemTest.php b/components/ILIAS/UI/tests/Component/Item/ItemTest.php
index a5bdc97ee7c7..696799b62e87 100755
--- a/components/ILIAS/UI/tests/Component/Item/ItemTest.php
+++ b/components/ILIAS/UI/tests/Component/Item/ItemTest.php
@@ -642,7 +642,7 @@ public function testRenderAudioPlayer(): void
 <div class="il-item il-std-item ">
     <h4 class="il-item-title">title</h4>
     <div class="il-item-audio"><div class="il-audio-container">
-    <audio controls="controls" class="il-audio-player" id="" src="src" preload="metadata"></audio>
+    <audio controls="controls" class="il-audio-player" id="id_1" src="src" preload="metadata"></audio>
 </div></div>
 </div>
 EOT;
diff --git a/components/ILIAS/UI/tests/Component/Player/PlayerAudioTest.php b/components/ILIAS/UI/tests/Component/Player/PlayerAudioTest.php
index 4ce1d49f55f6..29eddf965c0e 100755
--- a/components/ILIAS/UI/tests/Component/Player/PlayerAudioTest.php
+++ b/components/ILIAS/UI/tests/Component/Player/PlayerAudioTest.php
@@ -100,7 +100,7 @@ public function testRenderAudio(): void
 
         $expected = <<<EOT
 <div class="il-audio-container">
-    <audio controls="controls" class="il-audio-player" id="" src="/foo" preload="metadata"></audio>
+    <audio controls="controls" class="il-audio-player" id="id_1" src="/foo" preload="metadata"></audio>
 </div>
 EOT;
         $this->assertHTMLEquals(
diff --git a/components/ILIAS/UI/tests/Component/Player/PlayerVideoTest.php b/components/ILIAS/UI/tests/Component/Player/PlayerVideoTest.php
index 27b963f10575..6ebc922a402a 100755
--- a/components/ILIAS/UI/tests/Component/Player/PlayerVideoTest.php
+++ b/components/ILIAS/UI/tests/Component/Player/PlayerVideoTest.php
@@ -108,7 +108,7 @@ public function testRenderVideo(): void
         $html = $r->render($video);
         $expected = <<<EOT
 <div class="il-video-container">
-    <video controls="controls" class="il-video-player" id="" src="/foo" preload="metadata" >
+    <video controls="controls" class="il-video-player" id="id_1" src="/foo" preload="metadata" >
     </video>
 </div>
 EOT;
@@ -128,7 +128,7 @@ public function testRenderWithPoster(): void
         $html = $r->render($video);
         $expected = <<<EOT
 <div class="il-video-container">
-    <video controls="controls" class="il-video-player" id="" src="/foo" preload="metadata" poster="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" style="background-image:url('bar.jpg')">
+    <video controls="controls" class="il-video-player" id="id_1" src="/foo" preload="metadata" poster="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" style="background-image:url('bar.jpg')">
     </video>
 </div>
 EOT;
@@ -148,7 +148,7 @@ public function testRenderWithSubtitles(): void
         $html = $r->render($video);
         $expected = <<<EOT
 <div class="il-video-container">
-    <video controls="controls" class="il-video-player" id="" src="/foo" preload="metadata" >
+    <video controls="controls" class="il-video-player" id="id_1" src="/foo" preload="metadata" >
         <track kind="subtitles" src="subtitles.vtt" srclang="en" />
     </video>
 </div>
@@ -170,7 +170,7 @@ public function testRenderYoutube(): void
 
         $expected = <<<EOT
 <div class="il-video-container">
-    <iframe id="" src="https://www.youtube.com/embed/YSN2osYbshQ" allow="fullscreen; autoplay; picture-in-picture;" referrerpolicy="strict-origin-when-cross-origin"></iframe>
+    <iframe id="id_1" src="https://www.youtube.com/embed/YSN2osYbshQ" allow="fullscreen; autoplay; picture-in-picture;" referrerpolicy="strict-origin-when-cross-origin"></iframe>
 </div>
 EOT;
         $this->assertHTMLEquals(
@@ -190,7 +190,7 @@ public function testRenderVimeo(): void
 
         $expected = <<<EOT
 <div class="il-video-container">
-    <iframe id="" src="https://player.vimeo.com/video/669475821" allow="fullscreen; autoplay; picture-in-picture;" referrerpolicy="strict-origin-when-cross-origin"></iframe>
+    <iframe id="id_1" src="https://player.vimeo.com/video/669475821" allow="fullscreen; autoplay; picture-in-picture;" referrerpolicy="strict-origin-when-cross-origin"></iframe>
 </div>
 EOT;
         $this->assertHTMLEquals(

From debf5ed85ecae4474929287dda4947c100b8648d Mon Sep 17 00:00:00 2001
From: Fabian Helfer <fhelfer@databay.de>
Date: Wed, 4 Feb 2026 10:00:34 +0100
Subject: [PATCH 2/2] [Fix] 0047060 UI: Audio/Video remove comments

---
 .../UI/src/Implementation/Component/Player/Renderer.php      | 5 -----
 1 file changed, 5 deletions(-)

diff --git a/components/ILIAS/UI/src/Implementation/Component/Player/Renderer.php b/components/ILIAS/UI/src/Implementation/Component/Player/Renderer.php
index 7b80de25069b..9b87f97e3b88 100755
--- a/components/ILIAS/UI/src/Implementation/Component/Player/Renderer.php
+++ b/components/ILIAS/UI/src/Implementation/Component/Player/Renderer.php
@@ -45,8 +45,6 @@ public function renderAudio(Component\Component $component, RendererInterface $d
     {
         $tpl = $this->getTemplate("tpl.audio.html", true, true);
 
-        // Always provide a non-empty id attribute. If there is no JS binding,
-        // fall back to a plain, unique id.
         $id = $this->bindJavaScript($component) ?? $this->createId();
 
         if ($component->getTranscription() != "") {
@@ -98,7 +96,6 @@ public function renderVimeo(
 
         $tpl = $this->getTemplate("tpl.video_vimeo.html", true, true);
 
-        // Ensure the iframe always has a valid, non-empty id attribute.
         $id = $this->bindJavaScript($component) ?? $this->createId();
 
         $tpl->setVariable("ID", $id);
@@ -114,7 +111,6 @@ public function renderYoutube(
 
         $tpl = $this->getTemplate("tpl.video_youtube.html", true, true);
 
-        // Ensure the iframe always has a valid, non-empty id attribute.
         $id = $this->bindJavaScript($component) ?? $this->createId();
 
         $tpl->setVariable("ID", $id);
@@ -130,7 +126,6 @@ public function renderNative(
 
         $tpl = $this->getTemplate("tpl.video.html", true, true);
 
-        // Ensure the <video> element always has a valid, non-empty id attribute.
         $id = $this->bindJavaScript($component) ?? $this->createId();
 
         foreach ($component->getSubtitleFiles() as $lang_key => $file) {