[JENKINS-69658] - CSP compatibility for failed-test.jelly

src/main/resources/lib/hudson/test/failed-test.jelly

@@ -60,13 +60,10 @@ THE SOFTWARE.
       }
     </style>
   </st:once>
-  <j:set var="id" value="${h.jsStringEscape(url)}"/>
-  <j:set var="open" value="showFailureSummary('test-${id}','${url}/summary')"/>
-  <j:set var="close" value="hideFailureSummary('test-${id}')"/>
-  <a id="test-${id}-showlink" onclick="${open}" title="${%Show details}">
+  <a id="test-${id}-showlink" title="${%Show details}">
     <l:icon src="symbol-add-outline plugin-ionicons-api" class="icon-sm"/>
   </a>
-  <a id="test-${id}-hidelink" onclick="${close}" title="${%Hide details}" style="display:none">
+  <a id="test-${id}-hidelink" title="${%Hide details}" style="display:none">
     <l:icon src="symbol-remove-outline plugin-ionicons-api" class="icon-sm"/>
   </a>
   <st:nbsp/>

src/main/resources/lib/hudson/test/js/failureSummary.js

@@ -1,20 +1,51 @@
 
-function showFailureSummary(id,query) {
-    var element = document.getElementById(id)
+const PREFIX = "test-";
+const SHOWLINK_SUFFIX = "-showlink";
+const HIDELINK_SUFFIX = "-hidelink";
+
+function showFailureSummary(summaryId, query) {
+    let element = document.getElementById(summaryId);
+
     element.style.display = "";
-    document.getElementById(id + "-showlink").style.display = "none";
-    document.getElementById(id + "-hidelink").style.display = "";
+    document.getElementById(summaryId + SHOWLINK_SUFFIX).style.display = "none";
+    document.getElementById(summaryId + HIDELINK_SUFFIX).style.display = "";
 
+    console.log(query);
     if (typeof query !== 'undefined') {
-        var rqo = new XMLHttpRequest();
+        let rqo = new XMLHttpRequest();
         rqo.open('GET', query, true);
         rqo.onreadystatechange = function() { element.innerHTML = rqo.responseText; }
         rqo.send(null);
     }
 }
 
-function hideFailureSummary(id) {
-    document.getElementById(id).style.display = "none";
-    document.getElementById(id + "-showlink").style.display = "";
-    document.getElementById(id + "-hidelink").style.display = "none";
+function hideFailureSummary(summaryId) {
+    document.getElementById(summaryId).style.display = "none";
+    document.getElementById(summaryId + SHOWLINK_SUFFIX).style.display = "";
+    document.getElementById(summaryId + HIDELINK_SUFFIX).style.display = "none";
 }
+
+
+document.addEventListener('DOMContentLoaded', () => {
+
+    // add the onclick behavior for all the "showlinks"
+    const testShowlinks = document.querySelectorAll("a[id*=test-][id*=-showlink]");
+    testShowlinks.forEach((element) => {
+        element.onclick = (_) => {
+            const id = element.id.replace(PREFIX, '').replace(SHOWLINK_SUFFIX, '');
+            const summaryId =PREFIX + id;
+            showFailureSummary(summaryId, document.URL + id + "summary");
+        }
+    });
+
+    // add the onclick behavior for all the "hidelinks"
+    const testHidelinks = document.querySelectorAll("a[id*=test-][id*=-hidelink]");
+    testHidelinks.forEach((element) => {
+        element.onclick = (_) => {
+            const id = element.id.replace(PREFIX, '').replace(HIDELINK_SUFFIX, '');
+            const summaryId = PREFIX + id;
+            hideFailureSummary(summaryId);
+        }
+    });
+
+});