From 53d9b7d748bdffebf9b91579a4c84195f5178573 Mon Sep 17 00:00:00 2001
From: David Cook <dcook@prosentient.com.au>
Date: Wed, 21 Aug 2024 05:58:59 +0000
Subject: [PATCH] Bug 37697: use shadow DOM for additional contents preview

This change uses the declarative HTML style of Shadow DOM
to encapsulate the additional contents preview so that they don't
affect the main Koha page.

Test plan:
0. Create opacheader with following content:
<style>* { background-color: red }</style>
<p>This is awesome</p>
1. Note that most background-color in /cgi-bin/koha/tools/additional-contents.pl
is now red
2. Click "Preview content" for "opacheader"
3. Note that the background-color of the "p" in "opacheader" is red

4. Apply the patch

5. Refresh the page at /cgi-bin/koha/tools/additional-contents.pl
6. Note that the background-color is normal again
7. Click "Preview content for "opacheader"
8. Note that the background-color of the "p" in "opacheader" is red
---
 .../prog/en/modules/tools/additional-contents.tt              | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/tools/additional-contents.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/tools/additional-contents.tt
index bdf8a0a089..622e27c4c7 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/modules/tools/additional-contents.tt
+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/tools/additional-contents.tt
@@ -451,7 +451,9 @@
                                                 <h5 class="modal-title">Preview of: "[% default_localization.title | html %]"</h5>
                                             </div>
                                         <div class="modal-body">
-                                            [% default_localization.content | $raw %]
+                                            <template shadowrootmode="open">
+                                               [% default_localization.content | $raw %]
+                                            </template>
                                         </div>
                                         <div class="modal-footer">
                                             <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
-- 
2.39.2