[JENKINS-73946] Remove inline event handlers in History/index.jelly (#658)

Author: yaroslavafenkin

src/main/resources/hudson/tasks/junit/History/history.js

@@ -10,20 +10,24 @@ var resultSeries
 var durationSeries
 var trendChartId = 'test-trend-chart'
 
-function onBuildWindowChange(selectObj) {
+function onBuildWindowChange(changeEvent) {
+    let selectObj = changeEvent.target;
     let idx = selectObj.selectedIndex;
     let c = selectObj.options[idx].value
     document.location = `${appRootUrl}${testObjectUrl}/history?start=${start}&count=${c}&interval=${interval}`
 }
 
-function onBuildIntervalChange(selectObj) {
+function onBuildIntervalChange(changeEvent) {
+    let selectObj = changeEvent.target;
     let idx = selectObj.selectedIndex;
     let i = selectObj.options[idx].value
     document.location = `${appRootUrl}${testObjectUrl}/history?start=${start}&count=${count}&interval=${i}`
 }
 
 (function ($) {
     $(document).ready(function ($) {
+        document.querySelector("#history-window").addEventListener("change", onBuildWindowChange);
+        document.querySelector("#history-interval").addEventListener("change", onBuildIntervalChange);
         let dataEl = document.getElementById("history-data");
         start = dataEl.getAttribute("data-start")
         end = dataEl.getAttribute("data-end")

src/main/resources/hudson/tasks/junit/History/index.jelly

@@ -70,7 +70,7 @@ THE SOFTWARE.
         <div style="flex-grow: 1"/>
         <div style="display: flex; flex-basis: auto; justify-content: space-between; align-items: center" tooltip="The history window size. Out of N builds, every Mth build with test results is shown, where M is the interval.">
           <div id="history-info" class="jenkins-!-margin-right-1" style="text-wrap: nowrap"></div>
-          <select name="history-window" id="history-window" onchange="onBuildWindowChange(this);" class="jenkins-!-margin-left-0 jenkins-!-margin-right-1 jenkins-select__input " style="min-width: fit-content;">
+          <select name="history-window" id="history-window" class="jenkins-!-margin-left-0 jenkins-!-margin-right-1 jenkins-select__input " style="min-width: fit-content;">
             <option value="100">100</option>
             <option value="200">200</option>
             <option value="500">500</option>
@@ -82,7 +82,7 @@ THE SOFTWARE.
         </div>
         <div style="display: flex; flex-basis: auto; justify-content: space-between; align-items: center" tooltip="Every Mth build will be taken into account.">
           <div class="jenkins-!-margin-right-1" style="text-wrap: nowrap">Sample interval:</div>
-          <select name="history-interval" id="history-interval" onchange="onBuildIntervalChange(this);" class="jenkins-!-margin-left-0 jenkins-!-margin-right-0 jenkins-select__input " style="min-width: fit-content;">
+          <select name="history-interval" id="history-interval" class="jenkins-!-margin-left-0 jenkins-!-margin-right-0 jenkins-select__input " style="min-width: fit-content;">
             <option value="1">1</option>
             <option value="2">2</option>
             <option value="5">5</option>