From 9b36247f8f4f5d6416f080ee7128008b18c4a21b Mon Sep 17 00:00:00 2001
From: peregrineshahin <41402573+peregrineshahin@users.noreply.github.com>
Date: Thu, 11 Jul 2024 11:31:06 +0300
Subject: [PATCH] Use an IIFE to Reduce Global Scope Pollution

---
 server/fishtest/static/js/application.js      |  10 +-
 server/fishtest/static/js/spsa.js             |   2 +-
 server/fishtest/templates/contributors.mak    |   3 +-
 server/fishtest/templates/tests.mak           | 134 +--
 server/fishtest/templates/tests_live_elo.mak  |   8 +-
 server/fishtest/templates/tests_run.mak       | 684 ++++++------
 server/fishtest/templates/tests_view.mak      | 973 +++++++++---------
 server/fishtest/templates/user.mak            |  40 +-
 server/fishtest/templates/user_management.mak |  41 +-
 server/fishtest/templates/workers.mak         |  98 +-
 10 files changed, 993 insertions(+), 1000 deletions(-)

diff --git a/server/fishtest/static/js/application.js b/server/fishtest/static/js/application.js
index d1fa8e0f3..ccfa51c5d 100644
--- a/server/fishtest/static/js/application.js
+++ b/server/fishtest/static/js/application.js
@@ -375,8 +375,7 @@ function padDotVersionStr(dn) {
 }
 
 // Filters tables client-side
-function filterTable(inputValue, tableId, originalRows, predicate) {
-  const table = document.getElementById(tableId);
+function filterTable(inputValue, table, originalRows, predicate) {
   const tbody = table.querySelector("tbody");
   let noDataRow = table.querySelector(".no-data");
   inputValue = inputValue.toLowerCase();
@@ -442,13 +441,12 @@ function filterTable(inputValue, tableId, originalRows, predicate) {
       });
     };
 
-    const originalTable = document
-      .getElementById("my_table")
-      .cloneNode(true);
+    const originalTable = document.getElementById("my_table").cloneNode(true);
     const originalRows = Array.from(originalTable.querySelectorAll("tbody tr"));
-
     const searchInput = document.getElementById("my_input");
+
     searchInput.addEventListener("input", (e) => {
+      const myTable = document.getElementById("my_table");
       filterTable(e.target.value, "my_table", originalRows, myPredicate);
     });
   })();
diff --git a/server/fishtest/static/js/spsa.js b/server/fishtest/static/js/spsa.js
index 575f6a602..e9d20c7f8 100644
--- a/server/fishtest/static/js/spsa.js
+++ b/server/fishtest/static/js/spsa.js
@@ -1,4 +1,4 @@
-async function handleSPSA() {
+async function handleSPSA(spsaData) {
   let raw = [],
     chart_object,
     chart_data,
diff --git a/server/fishtest/templates/contributors.mak b/server/fishtest/templates/contributors.mak
index b619c2413..b030ff82e 100644
--- a/server/fishtest/templates/contributors.mak
+++ b/server/fishtest/templates/contributors.mak
@@ -29,7 +29,8 @@
 
     const searchInput = document.getElementById("search_contributors");
     searchInput.addEventListener("input", (e) => {
-      filterTable(e.target.value, "contributors_table", originalRows, includes);
+      const contributorsTable = document.getElementById("contributors_table");
+      filterTable(e.target.value, contributorsTable, originalRows, includes);
     });
   })();
 </script>
diff --git a/server/fishtest/templates/tests.mak b/server/fishtest/templates/tests.mak
index 3e486fed7..9dade538e 100644
--- a/server/fishtest/templates/tests.mak
+++ b/server/fishtest/templates/tests.mak
@@ -47,72 +47,6 @@
     </div>
   </div>
 
-  <script>
-    let fetchedMachinesBefore = false;
-    let machinesSkeleton = null;
-    let machinesBody = null;
-    async function handleRenderMachines(){
-        await DOMContentLoaded();
-        machinesBody = document.getElementById("machines");
-        if (!machinesSkeleton) {
-          machinesSkeleton = document.querySelector("#machines .ssc-wrapper").cloneNode(true);
-        }
-        const machinesButton = document.getElementById("machines-button");
-        machinesButton?.addEventListener("click", async () => {
-          await toggleMachines();
-        })
-        if (${str(machines_shown).lower()})
-          await renderMachines();
-      }
-
-    async function renderMachines() {
-      await DOMContentLoaded();
-      if (fetchedMachinesBefore) {
-        return Promise.resolve();
-      }
-      try {
-        if (document.querySelector("#machines .retry")) {
-          machinesBody.replaceChildren(machinesSkeleton);
-        }
-        const html = await fetchText("/tests/machines");
-        machinesBody.replaceChildren();
-        machinesBody.insertAdjacentHTML("beforeend", html);
-        const machinesTbody = document.querySelector("#machines tbody");
-        let newMachinesCount = machinesTbody?.childElementCount;
-
-        if (newMachinesCount === 1) {
-          const noMachines = document.getElementById("no-machines");
-          if (noMachines) newMachinesCount = 0;
-        }
-
-        const countSpan = document.getElementById("workers-count");
-        countSpan.textContent = `Workers - ${"${newMachinesCount}"} machines`;
-        fetchedMachinesBefore = true;
-      } catch (error) {
-        console.log("Request failed: " + error);
-        machinesBody.replaceChildren();
-        createRetryMessage(machinesBody, renderMachines);
-      }
-    }
-
-    async function toggleMachines() {
-      const button = document.getElementById("machines-button");
-      const active = button.textContent.trim() === "Hide";
-      if (active) {
-        button.textContent = "Show";
-      }
-      else {
-        button.textContent = "Hide";
-        await renderMachines();
-      }
-
-      document.cookie =
-        "machines_state" + "=" + button.textContent.trim() + "; max-age=${60 * 60}; SameSite=Lax";
-    }
-
-    handleRenderMachines();
-  </script>
-
   <h4>
     <a id="machines-button" class="btn btn-sm btn-light border"
       data-bs-toggle="collapse" href="#machines" role="button" aria-expanded="false"
@@ -138,6 +72,74 @@
           </div>
       </div>
   </div>
+
+  <script>
+    (() => {
+      let fetchedMachinesBefore = false;
+      let machinesSkeleton = null;
+      let machinesBody = null;
+      async function handleRenderMachines(){
+          await DOMContentLoaded();
+          machinesBody = document.getElementById("machines");
+          if (!machinesSkeleton) {
+            machinesSkeleton = document.querySelector("#machines .ssc-wrapper").cloneNode(true);
+          }
+          const machinesButton = document.getElementById("machines-button");
+          machinesButton?.addEventListener("click", async () => {
+            await toggleMachines();
+          })
+          if (${str(machines_shown).lower()})
+            await renderMachines();
+        }
+
+      async function renderMachines() {
+        await DOMContentLoaded();
+        if (fetchedMachinesBefore) {
+            return Promise.resolve();
+        }
+        try {
+          if (document.querySelector("#machines .retry")) {
+            machinesBody.replaceChildren(machinesSkeleton);
+          }
+          const html = await fetchText("/tests/machines");
+          machinesBody.replaceChildren();
+          machinesBody.insertAdjacentHTML("beforeend", html);
+          const machinesTbody = document.querySelector("#machines tbody");
+          let newMachinesCount = machinesTbody?.childElementCount;
+
+          if (newMachinesCount === 1) {
+            const noMachines = document.getElementById("no-machines");
+            if (noMachines) newMachinesCount = 0;
+          }
+
+          const countSpan = document.getElementById("workers-count");
+          countSpan.textContent = `Workers - ${"${newMachinesCount}"} machines`;
+          fetchedMachinesBefore = true;
+        } catch (error) {
+          console.log("Request failed: " + error);
+          machinesBody.replaceChildren();
+          createRetryMessage(machinesBody, renderMachines);
+        }
+      }
+
+      async function toggleMachines() {
+        const button = document.getElementById("machines-button");
+        const active = button.textContent.trim() === "Hide";
+        if (active) {
+          button.textContent = "Show";
+        }
+        else {
+          button.textContent = "Hide";
+          await renderMachines();
+        }
+
+        document.cookie =
+          "machines_state" + "=" + button.textContent.trim() + "; max-age=${60 * 60}; SameSite=Lax";
+      }
+
+      handleRenderMachines();
+    })();
+  </script>
 % endif
 
 <%include file="run_tables.mak"/>
diff --git a/server/fishtest/templates/tests_live_elo.mak b/server/fishtest/templates/tests_live_elo.mak
index 85a22eb7c..c9acfd665 100644
--- a/server/fishtest/templates/tests_live_elo.mak
+++ b/server/fishtest/templates/tests_live_elo.mak
@@ -8,9 +8,11 @@
 ></script>
 
 <script>
-  document.title = "Live Elo - ${page_title} | Stockfish Testing";
-  const testId = "${str(run['_id'])}";
-  followLive(testId);
+  (() => {
+    document.title = "Live Elo - ${page_title} | Stockfish Testing";
+    const testId = "${str(run['_id'])}";
+    followLive(testId);
+  })();
 </script>
 
 <h2>Live Elo for SPRT test <a href="/tests/view/${str(run['_id'])}">${str(run['_id'])}</a></h2>
diff --git a/server/fishtest/templates/tests_run.mak b/server/fishtest/templates/tests_run.mak
index 744ecb782..aa43ab08a 100644
--- a/server/fishtest/templates/tests_run.mak
+++ b/server/fishtest/templates/tests_run.mak
@@ -673,389 +673,389 @@
   </div>
 </form>
 
+<script
+  src="/js/spsa_new.js?5&?v=${cache_busters['js/spsa_new.js']}"
+  integrity="sha384-${cache_busters['js/spsa_new.js']}"
+  crossorigin="anonymous"
+></script>
+
 <script>
-  let submitted = false;
-  window.addEventListener("pageshow", () => {
-    // make sure submitted is set back to false
-    submitted = false;
-
-    // make sure the submit test button is enabled again and has the correct text.
-    document.getElementById('submit-test').disabled = false;
-    document.getElementById('submit-test').textContent = 'Submit test';
-
-    // Also make sure that the fields have the right visibility.
-    updateOdds(document.getElementById('checkbox-time-odds'));
-    toggleBook(document.getElementById('checkbox-book-visibility'));
-  });
-
-  let stopRule = null;
-
-  const presetBounds = {
-    'standard STC': [ 0.0, 2.0],
-    'standard LTC': [ 0.5, 2.5],
-    'regression STC': [-1.75, 0.25],
-    'regression LTC': [-1.75, 0.25],
-  };
-
-  const isRun = ${'true' if is_rerun else 'false'};
-
-  function updateSprtBounds(selectedBounds) {
-    if (selectedBounds === "custom") {
-      document
-        .querySelectorAll(".custom-bounds")
-        .forEach((bound) => (bound.style.display = ""));
-    } else {
-      document
-        .querySelectorAll(".custom-bounds")
-        .forEach((bound) => (bound.style.display = "none"));
-      const bounds = presetBounds[selectedBounds];
-      document.getElementById("sprt_elo0").value = bounds[0];
-      document.getElementById("sprt_elo1").value = bounds[1];
-    }
-  }
+  (() => {
+    let submitted = false;
+    window.addEventListener("pageshow", () => {
+      // make sure submitted is set back to false
+      submitted = false;
+
+      // make sure the submit test button is enabled again and has the correct text.
+      document.getElementById('submit-test').disabled = false;
+      document.getElementById('submit-test').textContent = 'Submit test';
+
+      // Also make sure that the fields have the right visibility.
+      updateOdds(document.getElementById('checkbox-time-odds'));
+      toggleBook(document.getElementById('checkbox-book-visibility'));
+    });
 
-  function toggleBookDepth(book) {
-    if (book.match('\\.pgn$')) {
-      document.querySelector('.book-depth').style.display = "";
-    } else {
-      document.querySelector('.book-depth').style.display = "none";
-    }
-  }
+    let stopRule = null;
 
-  document
-    .getElementById("bounds")
-    .addEventListener("change", (e) => {
-      updateSprtBounds(e.target.value);
-    });
+    const presetBounds = {
+      'standard STC': [ 0.0, 2.0],
+      'standard LTC': [ 0.5, 2.5],
+      'regression STC': [-1.75, 0.25],
+      'regression LTC': [-1.75, 0.25],
+    };
 
-  let initialBaseBranch = document.getElementById("base-branch").value;
-  let initialBaseSignature = document.getElementById("base-signature").value;
-  let spsa = false;
+    const isRun = ${'true' if is_rerun else 'false'};
 
-  // Test type is changed
-  document.querySelectorAll("[name=test-type]").forEach((btn) =>
-    btn.addEventListener("click", (e) => {
-      if (!spsa) {
-        initialBaseBranch = document.getElementById("base-branch").value;
-        initialBaseSignature = document.getElementById("base-signature").value;
+    function updateSprtBounds(selectedBounds) {
+      if (selectedBounds === "custom") {
+        document
+          .querySelectorAll(".custom-bounds")
+          .forEach((bound) => (bound.style.display = ""));
+      } else {
+        document
+          .querySelectorAll(".custom-bounds")
+          .forEach((bound) => (bound.style.display = "none"));
+        const bounds = presetBounds[selectedBounds];
+        document.getElementById("sprt_elo0").value = bounds[0];
+        document.getElementById("sprt_elo1").value = bounds[1];
       }
-      const btn = e.target;
-
-      // choose test type - STC, LTC - sets preset values
-      let testOptions = null;
-      if (btn.dataset.options) testOptions = btn.dataset.options;
-
-      if (testOptions) {
-        const {
-          name,
-          tc,
-          new_tc,
-          throughput,
-          threads,
-          options,
-          book,
-          stop_rule,
-          bounds,
-          games,
-          test_branch,
-          base_branch,
-          test_signature,
-          base_signature,
-        } = JSON.parse(testOptions);
-        document.getElementById("tc").value = tc;
-        document.getElementById("new_tc").value = new_tc;
-        document.getElementById("throughput").value = throughput;
-        document.getElementById("threads").value = threads;
-        document.getElementById("new-options").value = (
-          options + " " +
-          document
-            .getElementById("new-options")
-            .value.replace(/Hash=[0-9]+ ?/, "")
-        ).replace(/ $/, "");
-        document.getElementById("base-options").value = (
-          options + " " +
-          document
-            .getElementById("base-options")
-            .value.replace(/Hash=[0-9]+ ?/, "")
-        ).replace(/ $/, "");
+    }
 
-        document.getElementById("book").value = book;
-        toggleBookDepth(book);
+    function toggleBookDepth(book) {
+      if (book.match('\\.pgn$')) {
+        document.querySelector('.book-depth').style.display = "";
+      } else {
+        document.querySelector('.book-depth').style.display = "none";
+      }
+    }
 
-        document.getElementById("checkbox-book-visibility").checked = (book != "${test_book}");
-        toggleBook(document.getElementById("checkbox-book-visibility"));
+    document
+      .getElementById("bounds")
+      .addEventListener("change", (e) => {
+        updateSprtBounds(e.target.value);
+      });
+
+    let initialBaseBranch = document.getElementById("base-branch").value;
+    let initialBaseSignature = document.getElementById("base-signature").value;
+    let spsa = false;
+
+    // Test type is changed
+    document.querySelectorAll("[name=test-type]").forEach((btn) =>
+      btn.addEventListener("click", (e) => {
+        if (!spsa) {
+          initialBaseBranch = document.getElementById("base-branch").value;
+          initialBaseSignature = document.getElementById("base-signature").value;
+        }
+        const btn = e.target;
+
+        // choose test type - STC, LTC - sets preset values
+        let testOptions = null;
+        if (btn.dataset.options) testOptions = btn.dataset.options;
+
+        if (testOptions) {
+          const {
+            name,
+            tc,
+            new_tc,
+            throughput,
+            threads,
+            options,
+            book,
+            stop_rule,
+            bounds,
+            games,
+            test_branch,
+            base_branch,
+            test_signature,
+            base_signature,
+          } = JSON.parse(testOptions);
+          document.getElementById("tc").value = tc;
+          document.getElementById("new_tc").value = new_tc;
+          document.getElementById("throughput").value = throughput;
+          document.getElementById("threads").value = threads;
+          document.getElementById("new-options").value = (
+            options + " " +
+            document
+              .getElementById("new-options")
+              .value.replace(/Hash=[0-9]+ ?/, "")
+          ).replace(/ $/, "");
+          document.getElementById("base-options").value = (
+            options + " " +
+            document
+              .getElementById("base-options")
+              .value.replace(/Hash=[0-9]+ ?/, "")
+          ).replace(/ $/, "");
 
-        document.getElementById(stop_rule).click();
+          document.getElementById("book").value = book;
+          toggleBookDepth(book);
 
-        if (bounds) {
-          document.getElementById("bounds").value = bounds;
-          updateSprtBounds(bounds);
-        }
+          document.getElementById("checkbox-book-visibility").checked = (book != "${test_book}");
+          toggleBook(document.getElementById("checkbox-book-visibility"));
 
-        if (games) {
-          document.getElementById("num-games").value = games;
-        }
+          document.getElementById(stop_rule).click();
 
-        if (!isRun) {
-          if (test_branch) {
-            document.getElementById("test-branch").value = test_branch;
+          if (bounds) {
+            document.getElementById("bounds").value = bounds;
+            updateSprtBounds(bounds);
           }
-          if (test_signature) {
-            document.getElementById("test-signature").value = test_signature;
+
+          if (games) {
+            document.getElementById("num-games").value = games;
           }
 
-          if (base_branch) {
-            document.getElementById("base-branch").value = base_branch;
+          if (!isRun) {
+            if (test_branch) {
+              document.getElementById("test-branch").value = test_branch;
+            }
+            if (test_signature) {
+              document.getElementById("test-signature").value = test_signature;
+            }
+
+            if (base_branch) {
+              document.getElementById("base-branch").value = base_branch;
+            }
+            if (base_signature) {
+              document.getElementById("base-signature").value = base_signature;
+            }
           }
-          if (base_signature) {
-            document.getElementById("base-signature").value = base_signature;
+
+          if (name === "PT" || name === "PT SMP") {
+            let info = (name === "PT SMP") ? "SMP " : "";
+            info +=
+              'Progression test of "${master_info["message"]}" of ${master_info["date"]} vs ${pt_version}.';
+            document.getElementById("run-info").value = info;
           }
-        }
 
-        if (name === "PT" || name === "PT SMP") {
-          let info = (name === "PT SMP") ? "SMP " : "";
-          info +=
-            'Progression test of "${master_info["message"]}" of ${master_info["date"]} vs ${pt_version}.';
-          document.getElementById("run-info").value = info;
+          spsaWork();
         }
+      })
+    );
 
-        spsaWork();
-      }
-    })
-  );
-
-  function testBranchHandler() {
-    document.getElementById("base-branch").value =
-      document.getElementById("test-branch").value;
-  }
-
-  function testSignatureHandler() {
-    document.getElementById("base-signature").value =
-      document.getElementById("test-signature").value;
-  }
-
-  // Stop rule is changed
-  document.querySelectorAll("[name=stop-rule]").forEach((btn) =>
-    btn.addEventListener("click", function () {
-      stopRule = btn.value;
-
-      if (stopRule) {
-        // Hide all elements that have the class "stop-rule"
-        document
-          .querySelectorAll(".stop-rule")
-          .forEach((el) => (el.style.display = "none"));
+    function testBranchHandler() {
+      document.getElementById("base-branch").value =
+        document.getElementById("test-branch").value;
+    }
 
-        document.getElementById("stop_rule_field").value = stopRule.substring(10);
+    function testSignatureHandler() {
+      document.getElementById("base-signature").value =
+        document.getElementById("test-signature").value;
+    }
 
-        // Show all elements that have the class with the same name as the selected stop rule
-        document
-          .querySelectorAll("." + stopRule)
-          .forEach((el) => (el.style.display = ""));
-
-        if (!isRun) {
-          if (stopRule === "stop-rule-spsa") {
-            // base branch and test branch should be the same for SPSA tests
-            document.getElementById("base-branch").readOnly = true;
-            document.getElementById("base-branch").value = document.getElementById("test-branch").value;
-            document
-              .getElementById("test-branch")
-              .addEventListener("input", testBranchHandler);
-            document.getElementById("base-signature").readOnly = true;
-            document.getElementById("base-signature").value = document.getElementById("test-signature").value;
-            document
-              .getElementById("test-signature")
-              .addEventListener("input", testSignatureHandler);
-            spsa = true;
-          } else {
-            document.getElementById("base-branch").removeAttribute("readonly");
-            document.getElementById("base-branch").value = initialBaseBranch;
-            document.getElementById("base-signature").removeAttribute("readonly");
-            document.getElementById("base-signature").value = initialBaseSignature;
-            document
-              .getElementById("test-branch")
-              .removeEventListener("input", testBranchHandler);
-            document
-              .getElementById("test-signature")
-              .removeEventListener("input", testSignatureHandler);
-            spsa = false;
+    // Stop rule is changed
+    document.querySelectorAll("[name=stop-rule]").forEach((btn) =>
+      btn.addEventListener("click", function () {
+        stopRule = btn.value;
+
+        if (stopRule) {
+          // Hide all elements that have the class "stop-rule"
+          document
+            .querySelectorAll(".stop-rule")
+            .forEach((el) => (el.style.display = "none"));
+
+          document.getElementById("stop_rule_field").value = stopRule.substring(10);
+
+          // Show all elements that have the class with the same name as the selected stop rule
+          document
+            .querySelectorAll("." + stopRule)
+            .forEach((el) => (el.style.display = ""));
+
+          if (!isRun) {
+            if (stopRule === "stop-rule-spsa") {
+              // base branch and test branch should be the same for SPSA tests
+              document.getElementById("base-branch").readOnly = true;
+              document.getElementById("base-branch").value = document.getElementById("test-branch").value;
+              document
+                .getElementById("test-branch")
+                .addEventListener("input", testBranchHandler);
+              document.getElementById("base-signature").readOnly = true;
+              document.getElementById("base-signature").value = document.getElementById("test-signature").value;
+              document
+                .getElementById("test-signature")
+                .addEventListener("input", testSignatureHandler);
+              spsa = true;
+            } else {
+              document.getElementById("base-branch").removeAttribute("readonly");
+              document.getElementById("base-branch").value = initialBaseBranch;
+              document.getElementById("base-signature").removeAttribute("readonly");
+              document.getElementById("base-signature").value = initialBaseSignature;
+              document
+                .getElementById("test-branch")
+                .removeEventListener("input", testBranchHandler);
+              document
+                .getElementById("test-signature")
+                .removeEventListener("input", testSignatureHandler);
+              spsa = false;
+            }
+          }
+          if (stopRule === "stop-rule-sprt") {
+            updateSprtBounds(document.getElementById("bounds").value);
           }
         }
-        if (stopRule === "stop-rule-sprt") {
-          updateSprtBounds(document.getElementById("bounds").value);
+      })
+    );
+
+    // Only .pgn book types have a book_depth field
+    toggleBookDepth(document.getElementById("book").value);
+    document.getElementById("book").addEventListener("input", (e) => {
+      toggleBookDepth(e.target.value);
+    });
+
+    document
+      .getElementById("create-new-test")
+      .addEventListener("submit", function (e) {
+        const ret = spsaWork(); // Last check that all spsa data are consistent.
+        if (!ret) {
+          return false;
         }
+        // we want to be able to register users for their own tests
+        if (supportsNotifications() && Notification.permission === "default") {
+          Notification.requestPermission();
+        }
+        if (submitted) {
+          // Don't allow submitting the form more than once
+          e.preventDefault();
+          return;
+        }
+        submitted = true;
+        const submitButton = document.getElementById("submit-test");
+        submitButton.setAttribute("disabled","");
+        submitButton.replaceChildren();
+        const spinner = document.createElement("div");
+        spinner.className = "spinner-border spinner-border-sm";
+        spinner.role = "status";
+        submitButton.append(spinner, " Submitting...");
+      });
+
+    // If the test is a reschedule
+    if (isRun) {
+      // Select the correct fields by default for re-runs
+      const tc = '${args.get('tc')}';
+      if (tc === "10+0.1") {
+        document.getElementById("stc_test").checked = true;
+      } else if (tc === "5+0.05") {
+        document.getElementById("stc_smp_test").checked = true;
+      } else if (tc === "20+0.2") {
+        document.getElementById("ltc_smp_test").checked = true;
+      } else if (tc === "180+1.8") {
+        document.getElementById("vltc_test").checked = true;
       }
-    })
-  );
-
-  // Only .pgn book types have a book_depth field
-  toggleBookDepth(document.getElementById("book").value);
-  document.getElementById("book").addEventListener("input", (e) => {
-    toggleBookDepth(e.target.value);
-  });
-
-  document
-    .getElementById("create-new-test")
-    .addEventListener("submit", function (e) {
-      const ret = spsaWork(); // Last check that all spsa data are consistent.
-      if (!ret) {
-        return false;
-      }
-      // we want to be able to register users for their own tests
-      if (supportsNotifications() && Notification.permission === "default") {
-        Notification.requestPermission();
-      }
-      if (submitted) {
-        // Don't allow submitting the form more than once
-        e.preventDefault();
-        return;
+
+      const threads = '${args.get('threads')}';
+      if (tc === "60+0.6") {
+        if (threads === "1") {
+          document.getElementById("ltc_test").checked = true;
+        } else if (threads === "8") {
+          document.getElementById("vltc_smp_test").checked = true;
+        }
       }
-      submitted = true;
-      const submitButton = document.getElementById("submit-test");
-      submitButton.setAttribute("disabled","");
-      submitButton.replaceChildren();
-      const spinner = document.createElement("div");
-      spinner.className = "spinner-border spinner-border-sm";
-      spinner.role = "status";
-      submitButton.append(spinner, " Submitting...");
-    });
 
-  // If the test is a reschedule
-  if (isRun) {
-    // Select the correct fields by default for re-runs
-    const tc = '${args.get('tc')}';
-    if (tc === "10+0.1") {
-      document.getElementById("stc_test").checked = true;
-    } else if (tc === "5+0.05") {
-      document.getElementById("stc_smp_test").checked = true;
-    } else if (tc === "20+0.2") {
-      document.getElementById("ltc_smp_test").checked = true;
-    } else if (tc === "180+1.8") {
-      document.getElementById("vltc_test").checked = true;
+      % if args.get('spsa'):
+        document.getElementById('stop-rule-spsa').click();
+      % elif not args.get('sprt'):
+        document.getElementById('stop-rule-games').click();
+      % endif
+    } else {
+      // Focus the "Test branch" field on page load for new tests
+      document.getElementById('test-branch').focus();
     }
 
-    const threads = '${args.get('threads')}';
-    if (tc === "60+0.6") {
-      if (threads === "1") {
-        document.getElementById("ltc_test").checked = true;
-      } else if (threads === "8") {
-        document.getElementById("vltc_smp_test").checked = true;
+    function updateOdds(checkbox) {
+      if (checkbox.checked) {
+        document.querySelector('.new_tc').style.display = "";
+        document.querySelector('[for=tc]').textContent = "Base TC";
+      } else {
+        document.querySelector('.new_tc').style.display = "none";
+        document.getElementById('new_tc').value = document.getElementById('tc').value;
+        document.querySelector('[for=tc]').textContent = "TC";
       }
     }
 
-    % if args.get('spsa'):
-      document.getElementById('stop-rule-spsa').click();
-    % elif not args.get('sprt'):
-      document.getElementById('stop-rule-games').click();
-    % endif
-  } else {
-    // Focus the "Test branch" field on page load for new tests
-    document.getElementById('test-branch').focus();
-  }
-
-  function updateOdds(checkbox) {
-    if (checkbox.checked) {
-      document.querySelector('.new_tc').style.display = "";
-      document.querySelector('[for=tc]').textContent = "Base TC";
-    } else {
-      document.querySelector('.new_tc').style.display = "none";
-      document.getElementById('new_tc').value = document.getElementById('tc').value;
-      document.querySelector('[for=tc]').textContent = "TC";
-    }
-  }
-
-  document.getElementById('checkbox-time-odds').addEventListener("change", (e) => {
-    updateOdds(e.target);
-  });
+    document.getElementById('checkbox-time-odds').addEventListener("change", (e) => {
+      updateOdds(e.target);
+    });
 
-  function toggleBook(checkbox) {
-    if (checkbox.checked) {
-      document.getElementById('test-book').style.display = "";
-    } else {
-      document.getElementById('test-book').style.display = "none";
-      document.getElementById('book').value = "${test_book}";
-      toggleBookDepth(document.getElementById('book').value);
+    function toggleBook(checkbox) {
+      if (checkbox.checked) {
+        document.getElementById('test-book').style.display = "";
+      } else {
+        document.getElementById('test-book').style.display = "none";
+        document.getElementById('book').value = "${test_book}";
+        toggleBookDepth(document.getElementById('book').value);
+      }
     }
-  }
-
-  document.getElementById('checkbox-book-visibility').addEventListener("change", (e) => {
-    toggleBook(e.target);
-  });
-</script>
 
-<script
-  src="/js/spsa_new.js?5&?v=${cache_busters['js/spsa_new.js']}"
-  integrity="sha384-${cache_busters['js/spsa_new.js']}"
-  crossorigin="anonymous"
-></script>
+    document.getElementById('checkbox-book-visibility').addEventListener("change", (e) => {
+      toggleBook(e.target);
+    });
 
-<script>
-  function spsaWork() {
-    /* parsing/computing */
-    if (!document.getElementById('autoselect').checked) {
+    function spsaWork() {
+      /* parsing/computing */
+      if (!document.getElementById('autoselect').checked) {
+        return true;
+      }
+      const params = document.getElementById('spsa_raw_params').value;
+      let s = fishtestToSpsa(params);
+      if (s === null) {
+        alertError("Unable to parse spsa parameters.");
+        return false;
+      }
+      /* estimate the draw ratio */
+      const tc = document.getElementById('tc').value;
+      const dr = drawRatio(tc);
+      if (dr === null) {
+        alertError("Unable to parse time control.");
+        return false;
+      }
+      s.draw_ratio = dr;
+      s = spsaCompute(s);
+      const fs = spsaToFishtest(s);
+      /* Let's go */
+      document.getElementById("spsa_A").value = 0;
+      document.getElementById("spsa_alpha").value = 0.0;
+      document.getElementById("spsa_gamma").value = 0.0;
+      document.getElementById("num-games").value = 1000 * Math.round(s.num_games / 1000);
+      document.getElementById("spsa_raw_params").value = fs.trim();
       return true;
     }
-    const params = document.getElementById('spsa_raw_params').value;
-    let s = fishtestToSpsa(params);
-    if (s === null) {
-      alertError("Unable to parse spsa parameters.");
-      return false;
-    }
-    /* estimate the draw ratio */
-    const tc = document.getElementById('tc').value;
-    const dr = drawRatio(tc);
-    if (dr === null) {
-      alertError("Unable to parse time control.");
-      return false;
-    }
-    s.draw_ratio = dr;
-    s = spsaCompute(s);
-    const fs = spsaToFishtest(s);
-    /* Let's go */
-    document.getElementById("spsa_A").value = 0;
-    document.getElementById("spsa_alpha").value = 0.0;
-    document.getElementById("spsa_gamma").value = 0.0;
-    document.getElementById("num-games").value = 1000 * Math.round(s.num_games / 1000);
-    document.getElementById("spsa_raw_params").value = fs.trim();
-    return true;
-  }
-
-  let saved_A = null;
-  let saved_alpha = null;
-  let saved_gamma = null;
-  let saved_games = null;
-  let saved_params = null;
-
-  function spsaEvents() {
-    if (document.getElementById('autoselect')["checked"]) {
-      /* save old stuff */
-      saved_A = document.getElementById("spsa_A").value;
-      saved_alpha = document.getElementById("spsa_alpha").value;
-      saved_gamma = document.getElementById("spsa_gamma").value;
-      saved_games = document.getElementById("num-games").value;
-      saved_params = document.getElementById("spsa_raw_params").value;
-      const ret = spsaWork();
-      if (!ret) {
-        document.getElementById('autoselect').checked = false;
+
+    let saved_A = null;
+    let saved_alpha = null;
+    let saved_gamma = null;
+    let saved_games = null;
+    let saved_params = null;
+
+    function spsaEvents() {
+      if (document.getElementById('autoselect')["checked"]) {
+        /* save old stuff */
+        saved_A = document.getElementById("spsa_A").value;
+        saved_alpha = document.getElementById("spsa_alpha").value;
+        saved_gamma = document.getElementById("spsa_gamma").value;
+        saved_games = document.getElementById("num-games").value;
+        saved_params = document.getElementById("spsa_raw_params").value;
+        const ret = spsaWork();
+        if (!ret) {
+          document.getElementById('autoselect').checked = false;
+        }
+      } else {
+        document.getElementById("spsa_A").value = saved_A;
+        document.getElementById("spsa_alpha").value = saved_alpha;
+        document.getElementById("spsa_gamma").value = saved_gamma;
+        document.getElementById("num-games").value = saved_games;
+        document.getElementById("spsa_raw_params").value = saved_params;
       }
-    } else {
-      document.getElementById("spsa_A").value = saved_A;
-      document.getElementById("spsa_alpha").value = saved_alpha;
-      document.getElementById("spsa_gamma").value = saved_gamma;
-      document.getElementById("num-games").value = saved_games;
-      document.getElementById("spsa_raw_params").value = saved_params;
     }
-  }
 
-  document.getElementById('autoselect').addEventListener("change", spsaEvents);
+    document.getElementById('autoselect').addEventListener("change", spsaEvents);
 
-  document.getElementById('tc').addEventListener("input", (e) => {
-    if (!document.getElementById('autoselect').checked) {
-      return;
-    }
-    const tc = e.target.value;
-    const tc_seconds = tcToSeconds(tc);
-    if (tc_seconds !== null) {
-      spsaWork();
-    }
-  });
+    document.getElementById('tc').addEventListener("input", (e) => {
+      if (!document.getElementById('autoselect').checked) {
+        return;
+      }
+      const tc = e.target.value;
+      const tc_seconds = tcToSeconds(tc);
+      if (tc_seconds !== null) {
+        spsaWork();
+      }
+    });
+  })();
 </script>
diff --git a/server/fishtest/templates/tests_view.mak b/server/fishtest/templates/tests_view.mak
index 8ecd01730..21c78b2f0 100644
--- a/server/fishtest/templates/tests_view.mak
+++ b/server/fishtest/templates/tests_view.mak
@@ -6,64 +6,6 @@
 
 <%namespace name="base" file="base.mak"/>
 
-<script
-  src="https://cdnjs.cloudflare.com/ajax/libs/jsdiff/5.2.0/diff.js"
-  integrity="sha512-Ubw08LwzeoACkP9I1L0LqwnhiVs6Vg9LWeTFDj0leZIVp5XG28xcxK0lrlFvaL8ZqR8oMOBnFdZLo6agy5+SgQ=="
-  crossorigin="anonymous"
-  referrerpolicy="no-referrer"
-></script>
-
-% if show_task >= 0:
-  <script>
-    document.documentElement.style="scroll-behavior:auto; overflow:hidden;";
-    function scroll_to(task_id) {
-      const task_offset = document.getElementById("task" + task_id).offsetTop;
-      const tasks_head_height = document.getElementById("tasks-head").offsetHeight;
-      const tasks_div = document.getElementById("tasks");
-      tasks_div.scrollIntoView();
-      tasks_div.scrollTop = task_offset - tasks_head_height;
-    }
-  </script>
-% endif
-
-% if follow == 1:
-  <script>
-    (async () => {
-      await DOMContentLoaded();
-      await followRun("${run['_id']}");
-      setNotificationStatus("${run['_id']}");
-    })();
-  </script>
-% else:
-  <script>
-    (async () => {
-      await DOMContentLoaded();
-      setNotificationStatus_("${run['_id']}");
-    })();
-  </script>
-% endif
-
-% if 'spsa' in run['args']:
-  <script src="https://www.gstatic.com/charts/loader.js"></script>
-  <script>
-    const spsaData = ${json.dumps(run["args"]["spsa"])|n};
-  </script>
-
-  <script
-    src="/js/spsa.js?v=${cache_busters['js/spsa.js']}"
-    integrity="sha384-${cache_busters['js/spsa.js']}"
-    crossorigin="anonymous"
-  ></script>
-
-  <script>
-    const spsaPromise = handleSPSA();
-  </script>
-% else:
-  <script>
-    const spsaPromise = Promise.resolve();
-  </script>
-% endif
-
 <div id="enclosure"${' style="visibility:hidden;"' if show_task >= 0 else "" |n}>
 
   <h2>
@@ -481,6 +423,12 @@
 ## End of enclosing div to be able to make things invisible.
 </div>
 
+<script
+  src="https://cdnjs.cloudflare.com/ajax/libs/jsdiff/5.2.0/diff.js"
+  integrity="sha512-Ubw08LwzeoACkP9I1L0LqwnhiVs6Vg9LWeTFDj0leZIVp5XG28xcxK0lrlFvaL8ZqR8oMOBnFdZLo6agy5+SgQ=="
+  crossorigin="anonymous"
+  referrerpolicy="no-referrer"
+></script>
 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.8.0/highlight.min.js"
         integrity="sha512-rdhY3cbXURo13l/WU9VlaRyaIYeJ/KBakckXIvJNAQde8DgpOmE+eZf7ha4vdqVjTtwQt69bD2wH2LXob/LB7Q=="
@@ -488,506 +436,545 @@
         referrerpolicy="no-referrer"
 ></script>
 
+% if 'spsa' in run['args']:
+  <script src="https://www.gstatic.com/charts/loader.js"></script>
+  <script
+    src="/js/spsa.js?v=${cache_busters['js/spsa.js']}"
+    integrity="sha384-${cache_busters['js/spsa.js']}"
+    crossorigin="anonymous"
+  ></script>
+% endif
+
 <script>
-  document.title = "${page_title} | Stockfish Testing";
-  let cookieTheme = getCookie("theme");
-  const currentTime = new Date().getTime();
-  const oneDayAgo = currentTime - (24 * 60 * 60 * 1000); // 24 hours ago in milliseconds
-
-  const setHighlightTheme = (theme) => {
-    const link = document.createElement("link");
-    if (theme === "dark") {
-      document.head
-        .querySelector('link[href*="styles/github.min.css"]')
-        ?.remove();
-      link["rel"] = "stylesheet";
-      link["crossOrigin"] = "anonymous";
-      link["referrerPolicy"] = "no-referrer";
-      link["href"] =
-        "https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/github-dark.min.css";
-      link["integrity"] =
-        "sha512-rO+olRTkcf304DQBxSWxln8JXCzTHlKnIdnMUwYvQa9/Jd4cQaNkItIUj6Z4nvW1dqK0SKXLbn9h4KwZTNtAyw==";
+  (async () => {
+    document.title = "${page_title} | Stockfish Testing";
+    const runId = "${run['_id']}";
+
+    % if 'spsa' in run['args']:
+        const spsaData = ${json.dumps(run["args"]["spsa"])|n};
+        const spsaPromise = handleSPSA(spsaData);
+    % else:
+        const spsaPromise = Promise.resolve();
+    % endif
+
+    % if show_task >= 0:
+      document.documentElement.style = "scroll-behavior:auto; overflow:hidden;";
+      function scroll_to(task_id) {
+        const task_offset = document.getElementById("task" + task_id).offsetTop;
+        const tasks_head_height = document.getElementById("tasks-head").offsetHeight;
+        const tasks_div = document.getElementById("tasks");
+        tasks_div.scrollIntoView();
+        tasks_div.scrollTop = task_offset - tasks_head_height;
+      }
+    % endif
+
+    await DOMContentLoaded();
+    % if follow == 1:
+      await followRun(runId);
+      setNotificationStatus(runId);
+    % else:
+      setNotificationStatus_(runId);
+    % endif
+
+    let cookieTheme = getCookie("theme");
+    const currentTime = new Date().getTime();
+    const oneDayAgo = currentTime - (24 * 60 * 60 * 1000); // 24 hours ago in milliseconds
+
+    const setHighlightTheme = (theme) => {
+      const link = document.createElement("link");
+      if (theme === "dark") {
+        document.head
+          .querySelector('link[href*="styles/github.min.css"]')
+          ?.remove();
+        link["rel"] = "stylesheet";
+        link["crossOrigin"] = "anonymous";
+        link["referrerPolicy"] = "no-referrer";
+        link["href"] =
+          "https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/github-dark.min.css";
+        link["integrity"] =
+          "sha512-rO+olRTkcf304DQBxSWxln8JXCzTHlKnIdnMUwYvQa9/Jd4cQaNkItIUj6Z4nvW1dqK0SKXLbn9h4KwZTNtAyw==";
+      } else {
+        document.head
+          .querySelector('link[href*="styles/github-dark.min.css"]')
+          ?.remove();
+        link["rel"] = "stylesheet";
+        link["crossOrigin"] = "anonymous";
+        link["referrerPolicy"] = "no-referrer";
+        link["href"] =
+          "https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/github.min.css";
+        link["integrity"] =
+          "sha512-0aPQyyeZrWj9sCA46UlmWgKOP0mUipLQ6OZXu8l4IcAmD2u31EPEy9VcIMvl7SoAaKe8bLXZhYoMaE/in+gcgA==";
+      }
+      document.head.append(link);
+    };
+
+    if (!cookieTheme) {
+      setHighlightTheme(mediaTheme());
     } else {
-      document.head
-        .querySelector('link[href*="styles/github-dark.min.css"]')
-        ?.remove();
-      link["rel"] = "stylesheet";
-      link["crossOrigin"] = "anonymous";
-      link["referrerPolicy"] = "no-referrer";
-      link["href"] =
-        "https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/github.min.css";
-      link["integrity"] =
-        "sha512-0aPQyyeZrWj9sCA46UlmWgKOP0mUipLQ6OZXu8l4IcAmD2u31EPEy9VcIMvl7SoAaKe8bLXZhYoMaE/in+gcgA==";
+      setHighlightTheme(cookieTheme);
     }
-    document.head.append(link);
-  };
-
-  if (!cookieTheme) {
-    setHighlightTheme(mediaTheme());
-  } else {
-    setHighlightTheme(cookieTheme);
-  }
-
-  try {
-    window
-      .matchMedia("(prefers-color-scheme: dark)")
-      .addEventListener("change", () => setHighlightTheme(mediaTheme()));
-  } catch (e) {
-    console.error(e);
-  }
-
-  document
-    .getElementById("sun")
-    .addEventListener("click", () => setHighlightTheme("light"));
-
-  document
-    .getElementById("moon")
-    .addEventListener("click", () => setHighlightTheme("dark"));
-
-  let downloading = false;
-  async function downloadPGNs(e) {
-    if (downloading) {
-      return;
-    }
-    downloading = true;
-    const button = e.currentTarget;
-    button.textContent = "Downloading...";
+
     try {
-      const response = await fetch(`/api/run_pgns/${run["_id"]}.pgn.gz`);
-      if (!response.ok) {
-        if (response.status === 404) {
-          alertError("No games found for this run");
-        } else {
-          alertError("Unable to download PGNs");
-        }
+      window
+        .matchMedia("(prefers-color-scheme: dark)")
+        .addEventListener("change", () => setHighlightTheme(mediaTheme()));
+    } catch (e) {
+      console.error(e);
+    }
+
+    document
+      .getElementById("sun")
+      .addEventListener("click", () => setHighlightTheme("light"));
+
+    document
+      .getElementById("moon")
+      .addEventListener("click", () => setHighlightTheme("dark"));
+
+    let downloading = false;
+    async function downloadPGNs(e) {
+      if (downloading) {
         return;
       }
-      const contentLength = parseInt(response.headers.get('Content-Length'));
-      const contentLengthFormatted = formatBytes(contentLength);
-      const reader = response.body.getReader();
-      let receivedLength = 0;
-      let chunks = [];
+      downloading = true;
+      const button = e.currentTarget;
+      button.textContent = "Downloading...";
+      try {
+        const response = await fetch(`/api/run_pgns/${run["_id"]}.pgn.gz`);
+        if (!response.ok) {
+          if (response.status === 404) {
+            alertError("No games found for this run");
+          } else {
+            alertError("Unable to download PGNs");
+          }
+          return;
+        }
+        const contentLength = parseInt(response.headers.get('Content-Length'));
+        const contentLengthFormatted = formatBytes(contentLength);
+        const reader = response.body.getReader();
+        let receivedLength = 0;
+        let chunks = [];
 
-      while (true) {
-        const { done, value } = await reader.read();
+        while (true) {
+          const { done, value } = await reader.read();
 
-        if (done) {
-          break;
-        }
+          if (done) {
+            break;
+          }
 
-        chunks.push(value);
-        receivedLength += value.length;
+          chunks.push(value);
+          receivedLength += value.length;
 
-        const progressFormatted = formatBytes(receivedLength);
-        button.textContent = progressFormatted + " / " + contentLengthFormatted;
-      }
+          const progressFormatted = formatBytes(receivedLength);
+          button.textContent = progressFormatted + " / " + contentLengthFormatted;
+        }
 
-      // Combine all chunks into a single Blob
-      const blob = new Blob(chunks);
+        // Combine all chunks into a single Blob
+        const blob = new Blob(chunks);
 
-      // Check if the blob is empty
-      if (blob.size === 0) {
-        alertError("Blob is empty!");
-        return;
+        // Check if the blob is empty
+        if (blob.size === 0) {
+          alertError("Blob is empty!");
+          return;
+        }
+        
+        const url = window.URL.createObjectURL(blob);
+        const a = document.createElement("a");
+        a.href = url;
+        a.download = `${run["_id"]}.pgn.gz`;
+        document.body.append(a);
+        a.click();
+        document.body.removeChild(a);
+      } catch (error) {
+        alertError("Network error: please check your network!");
+      } finally {
+        downloading = false;
+        button.textContent = "Download Games";
       }
-      
-      const url = window.URL.createObjectURL(blob);
-      const a = document.createElement("a");
-      a.href = url;
-      a.download = `${run["_id"]}.pgn.gz`;
-      document.body.append(a);
-      a.click();
-      document.body.removeChild(a);
-    } catch (error) {
-      alertError("Network error: please check your network!");
-    } finally {
-      downloading = false;
-      button.textContent = "Download Games";
     }
-  }
 
-  const downloadPGNsButton = document.getElementById("download_games");
-  downloadPGNsButton?.addEventListener("click", downloadPGNs);
+    const downloadPGNsButton = document.getElementById("download_games");
+    downloadPGNsButton?.addEventListener("click", downloadPGNs);
 
-  let fetchedTasksBefore = false;
-  async function handleRenderTasks(){
-    await DOMContentLoaded();
-    const tasksButton = document.getElementById("tasks-button");
-    tasksButton?.addEventListener("click", async () => {
-      await toggleTasks();
-    })
-     if (${str(tasks_shown).lower()})
-       await renderTasks();
-  }
-
-  async function renderTasks() {
-    await DOMContentLoaded();
-    if (fetchedTasksBefore)
-      return Promise.resolve();
-    const tasksBody = document.getElementById("tasks-body");
-    try {
-      const html = await fetchText(`/tests/tasks/${str(run['_id'])}?show_task=${show_task}`);
-      tasksBody.innerHTML = html;
-      fetchedTasksBefore = true;
-    } catch (error) {
-      console.log("Request failed: " + error);
+    let fetchedTasksBefore = false;
+    async function handleRenderTasks(){
+      await DOMContentLoaded();
+      const tasksButton = document.getElementById("tasks-button");
+      tasksButton?.addEventListener("click", async () => {
+        await toggleTasks();
+      })
+      if (${str(tasks_shown).lower()})
+        await renderTasks();
     }
-  }
 
-  async function toggleTasks() {
-    const button = document.getElementById("tasks-button");
-    const active = button.textContent.trim() === "Hide";
-    if (active){
-      button.textContent = "Show";
-    }
-    else {
-      await renderTasks();
-      button.textContent = "Hide";
+    async function renderTasks() {
+      await DOMContentLoaded();
+      if (fetchedTasksBefore)
+        return Promise.resolve();
+      const tasksBody = document.getElementById("tasks-body");
+      try {
+        const html = await fetchText(`/tests/tasks/${str(run['_id'])}?show_task=${show_task}`);
+        tasksBody.innerHTML = html;
+        fetchedTasksBefore = true;
+      } catch (error) {
+        console.log("Request failed: " + error);
+      }
     }
 
-    document.cookie =
-      "tasks_state" + "=" + button.textContent.trim() + "; max-age=${60 * 60}; SameSite=Lax";
-  }
+    async function toggleTasks() {
+      const button = document.getElementById("tasks-button");
+      const active = button.textContent.trim() === "Hide";
+      if (active){
+        button.textContent = "Show";
+      }
+      else {
+        await renderTasks();
+        button.textContent = "Hide";
+      }
 
-  function addDiff (diffText, text) {
-    diffText.textContent = text;
-  }
+      document.cookie =
+        "tasks_state" + "=" + button.textContent.trim() + "; max-age=${60 * 60}; SameSite=Lax";
+    }
 
-  const fetchDiffThreeDots = async (diffApiUrl) => {
-    try {
-      const token = localStorage.getItem("github_token");
-      const options = {
-        headers: {
-          "Authorization": token ? "token " + token : null,
-          "Accept": "application/vnd.github.diff",
-        }
-      };
-      const text = await fetchText(diffApiUrl, options);
-      return {text: text, count: text?.split("\n")?.length || 0};
-    } catch(e) {
-      console.log("Error fetching diff: " + e);
-      return {text: "", count: 0};
+    function addDiff (diffText, text) {
+      diffText.textContent = text;
     }
-  };
-
-  function loadingButton() {
-    const button = document.getElementById("diff-toggle");
-    const span = document.createElement("span");
-    span.id = "loadingIcon";
-    const icon = document.createElement("i");
-    icon.className = "fas fa-spinner fa-spin";
-    span.append(icon);
-    button.replaceChildren();
-    button.append(span);
-  }
-
-  function showDiff(diffContents, diffText, numLines, copyDiffBtn, toggleBtn) {
-    // Hide large diffs by default
-    if (numLines < 50) {
-      diffContents.style.display = "";
-      if (copyDiffBtn) copyDiffBtn.style.display = "";
-      setTimeout(() => {
-        toggleBtn.textContent = "Hide";
-      }, 350);
-    } else {
-      diffContents.style.display = "none";
-      if (copyDiffBtn) copyDiffBtn.style.display = "none";
-      setTimeout(() => {
-        toggleBtn.textContent = "Show";
-      }, 350);
+
+    const fetchDiffThreeDots = async (diffApiUrl) => {
+      try {
+        const token = localStorage.getItem("github_token");
+        const options = {
+          headers: {
+            "Authorization": token ? "token " + token : null,
+            "Accept": "application/vnd.github.diff",
+          }
+        };
+        const text = await fetchText(diffApiUrl, options);
+        return {text: text, count: text?.split("\n")?.length || 0};
+      } catch(e) {
+        console.log("Error fetching diff: " + e);
+        return {text: "", count: 0};
+      }
+    };
+
+    function loadingButton() {
+      const button = document.getElementById("diff-toggle");
+      const span = document.createElement("span");
+      span.id = "loadingIcon";
+      const icon = document.createElement("i");
+      icon.className = "fas fa-spinner fa-spin";
+      span.append(icon);
+      button.replaceChildren();
+      button.append(span);
     }
-  }
 
-  async function getFileContentFromGitHubApi(url, options) {
-    try {
-      options.headers = options.headers || {};
-      options.headers["Accept"] = "application/vnd.github.v3.raw";
-      const response = await fetch(url, options);
-      if (!response.ok) {
-        if (response.status === 404) {
-          return "";
-        } else {
+    function showDiff(diffContents, diffText, numLines, copyDiffBtn, toggleBtn) {
+      // Hide large diffs by default
+      if (numLines < 50) {
+        diffContents.style.display = "";
+        if (copyDiffBtn) copyDiffBtn.style.display = "";
+        setTimeout(() => {
+          toggleBtn.textContent = "Hide";
+        }, 350);
+      } else {
+        diffContents.style.display = "none";
+        if (copyDiffBtn) copyDiffBtn.style.display = "none";
+        setTimeout(() => {
+          toggleBtn.textContent = "Show";
+        }, 350);
+      }
+    }
+
+    async function getFileContentFromGitHubApi(url, options) {
+      try {
+        options.headers = options.headers || {};
+        options.headers["Accept"] = "application/vnd.github.v3.raw";
+        const response = await fetch(url, options);
+        if (!response.ok) {
+          if (response.status === 404) {
+            return "";
+          } else {
+            throw new Error(
+              "Failed to fetch " + url + ": " + response.status + " " + response.statusText
+            );
+          }
+        }
+        const text = await response.text();
+        return text;
+      } catch (error) {
           throw new Error(
-            "Failed to fetch " + url + ": " + response.status + " " + response.statusText
+            "Failed to fetch file: " + error
           );
-        }
       }
-      const text = await response.text();
-      return text;
-    } catch (error) {
-        throw new Error(
-          "Failed to fetch file: " + error
-        );
     }
-  }
 
-  async function getFilesInBranch(apiUrl, branch, options) {
-    try {
-      const url = apiUrl + "/git/trees/" + branch + "?recursive=1";
-      const response = await fetch(url, options);
-      if (!response.ok) {
+    async function getFilesInBranch(apiUrl, branch, options) {
+      try {
+        const url = apiUrl + "/git/trees/" + branch + "?recursive=1";
+        const response = await fetch(url, options);
+        if (!response.ok) {
+          return null;
+        }
+        const data = await response.json();
+        
+        const filesMap = new Map();
+        data.tree.forEach((entry) => {
+          if (entry.type === "blob") {
+            filesMap.set(entry.path, entry.sha);
+          }
+        });
+        
+        return filesMap;
+      } catch (error) {
+        console.error("Error fetching files in branch " +  branch + ": ", error);
         return null;
       }
-      const data = await response.json();
-      
-      const filesMap = new Map();
-      data.tree.forEach((entry) => {
-        if (entry.type === "blob") {
-          filesMap.set(entry.path, entry.sha);
-        }
-      });
-      
-      return filesMap;
-    } catch (error) {
-      console.error("Error fetching files in branch " +  branch + ": ", error);
-      return null;
-    }
-  }
-
-  
-  const diffContents = document.getElementById("diff-contents");
-  const diffText = diffContents.querySelector("code");
-  const toggleBtn = document.getElementById("diff-toggle");
-
-  async function fetchDiffTwoDots(apiUrlNew, apiUrlBase, diffNew, diffBase, options) {
-    const [files1, files2] = await Promise.all([
-      getFilesInBranch(apiUrlBase, diffBase, options),
-      getFilesInBranch(apiUrlNew, diffNew, options),
-    ]);
-
-    if (files1 === null || files2 === null) {
-        throw new Error("Failed to fetch files from branches");
     }
 
-    const allFiles = new Set([...files1.keys(), ...files2.keys()]);
+    
+    const diffContents = document.getElementById("diff-contents");
+    const diffText = diffContents.querySelector("code");
+    const toggleBtn = document.getElementById("diff-toggle");
+
+    async function fetchDiffTwoDots(apiUrlNew, apiUrlBase, diffNew, diffBase, options) {
+      const [files1, files2] = await Promise.all([
+        getFilesInBranch(apiUrlBase, diffBase, options),
+        getFilesInBranch(apiUrlNew, diffNew, options),
+      ]);
+
+      if (files1 === null || files2 === null) {
+          throw new Error("Failed to fetch files from branches");
+      }
 
-    let diffs = await Promise.all(
-      Array.from(allFiles).map(async (filePath) => {
-        const sha1 = files1.get(filePath);
-        const sha2 = files2.get(filePath);
+      const allFiles = new Set([...files1.keys(), ...files2.keys()]);
 
-        if (sha1 === sha2) {
-          // Skip files with the same SHA
-          return null;
-        }
+      let diffs = await Promise.all(
+        Array.from(allFiles).map(async (filePath) => {
+          const sha1 = files1.get(filePath);
+          const sha2 = files2.get(filePath);
 
-        const [content1, content2] = await Promise.all([
-          getFileContentFromGitHubApi(
-            apiUrlBase + "/contents/" + filePath + "?ref=" + diffBase, options
-          ),
-          getFileContentFromGitHubApi(
-            apiUrlNew + "/contents/" + filePath + "?ref=" + diffNew, options
-          ),
-        ]);
-
-        const diff = Diff.createPatch(filePath, content1, content2);
-        if (diff.trim() !== "" && diff.trim().split("\n").length >= 5) {
-          return diff;
-        }
-      })
-    );
+          if (sha1 === sha2) {
+            // Skip files with the same SHA
+            return null;
+          }
 
-    // Filter out null values (skipped files)
-    diffs = diffs.filter(diff => diff !== null);
+          const [content1, content2] = await Promise.all([
+            getFileContentFromGitHubApi(
+              apiUrlBase + "/contents/" + filePath + "?ref=" + diffBase, options
+            ),
+            getFileContentFromGitHubApi(
+              apiUrlNew + "/contents/" + filePath + "?ref=" + diffNew, options
+            ),
+          ]);
+
+          const diff = Diff.createPatch(filePath, content1, content2);
+          if (diff.trim() !== "" && diff.trim().split("\n").length >= 5) {
+            return diff;
+          }
+        })
+      );
 
-    if (diffs.length) {
-      return { text: diffs.join("\n"), count: diffs.length };
-    } else {
-      return { text: "", count: 0 };
-    }
-  }
+      // Filter out null values (skipped files)
+      diffs = diffs.filter(diff => diff !== null);
 
-  async function fetchComments(diffApiUrl, options) {
-    // Fetch amount of comments
-    try {
-      const json = await fetchJson(diffApiUrl, options);
-      let numComments = 0;
-      json.commits.forEach(function (row) {
-        numComments += row.commit.comment_count;
-      });
-        document.getElementById("diff-num-comments").textContent =
-          "(" + numComments + " comments)";
-        document.getElementById("diff-num-comments").style.display = "";
-    } catch(e) {
-      console.log("Error fetching comments: "+e);
+      if (diffs.length) {
+        return { text: diffs.join("\n"), count: diffs.length };
+      } else {
+        return { text: "", count: 0 };
+      }
     }
-  }
 
-  async function handleDiff() {
-    await DOMContentLoaded();
-    let copyDiffBtn = document.getElementById("copy-diff");
-    if (
-      document.queryCommandSupported &&
-      document.queryCommandSupported("copy")
-    ) {
-      copyDiffBtn.addEventListener("click", () => {
-        const textarea = document.createElement("textarea");
-        textarea.style.position = "fixed";
-        textarea.textContent = "curl -s ${h.diff_url(run)}.diff | git apply";
-        document.body.append(textarea);
-        textarea.select();
-        try {
-          document.execCommand("copy");
-          document.querySelector(".copied").style.display = "";
-        } catch (ex) {
-          console.warn("Copy to clipboard failed.", ex);
-        } finally {
-          document.body.removeChild(textarea);
-        }
-      });
-    } else {
-      copyDiffBtn = null;
+    async function fetchComments(diffApiUrl, options) {
+      // Fetch amount of comments
+      try {
+        const json = await fetchJson(diffApiUrl, options);
+        let numComments = 0;
+        json.commits.forEach(function (row) {
+          numComments += row.commit.comment_count;
+        });
+          document.getElementById("diff-num-comments").textContent =
+            "(" + numComments + " comments)";
+          document.getElementById("diff-num-comments").style.display = "";
+      } catch(e) {
+        console.log("Error fetching comments: "+e);
+      }
     }
 
-    const diffApiUrl = "${h.diff_url(run)}".replace(
-      "//github.com/",
-      "//api.github.com/repos/"
-    );
-    
-    let dots = 2;
-
-    const token = localStorage.getItem("github_token");
-    const options = token ? {
-      headers: {
-        "Authorization": "token " + token
+    async function handleDiff() {
+      await DOMContentLoaded();
+      let copyDiffBtn = document.getElementById("copy-diff");
+      if (
+        document.queryCommandSupported &&
+        document.queryCommandSupported("copy")
+      ) {
+        copyDiffBtn.addEventListener("click", () => {
+          const textarea = document.createElement("textarea");
+          textarea.style.position = "fixed";
+          textarea.textContent = "curl -s ${h.diff_url(run)}.diff | git apply";
+          document.body.append(textarea);
+          textarea.select();
+          try {
+            document.execCommand("copy");
+            document.querySelector(".copied").style.display = "";
+          } catch (ex) {
+            console.warn("Copy to clipboard failed.", ex);
+          } finally {
+            document.body.removeChild(textarea);
+          }
+        });
+      } else {
+        copyDiffBtn = null;
       }
-    } : {};
-
-    const testRepo = "${h.tests_repo(run)}";
-    const apiUrlNew = testRepo.replace(
-      "//github.com/",
-      "//api.github.com/repos/"
-    );
-
-    const diffNew  = "${run["args"]["resolved_new"][:10]}";
-    const apiOfficialMaster = "https://api.github.com/repos/official-stockfish/Stockfish";
-    const baseOfficialMaster = "${run["args"]["official_master_sha"][:10] if run["args"].get("official_master_sha") else ""}";
-
-    % if run["args"].get("spsa"):
-      const apiUrlBase = apiOfficialMaster;
-      % if run["args"].get("official_master_sha"):
-          const diffBase = baseOfficialMaster;
-      % else: # old tests before this field
-          const diffBase = "master";
-          dots = 3; // fall back to the three dot diff request as the diff will be rebased
-      % endif
-    % else:
-      % if run["args"]["new_tag"] == "master" and run["args"]["base_tag"] == pt_info["pt_branch"]:
-          dots = 3; // fall back to the three dot in case of PTs since official is always rebased
-      % endif
-      const apiUrlBase = apiUrlNew;
-      const diffBase = "${run["args"]["resolved_base"][:10]}";
-    % endif
 
-    // Check if the diff is already in localStorage and use it if it is
-    let localStorageDiffs = JSON.parse(localStorage.getItem("localStorageDiffs")) || [];
-    localStorageDiffs = localStorageDiffs.filter(diff => diff?.timeStamp >= oneDayAgo);
-
-    let run = localStorageDiffs.find(diff => diff["id"] === "${run['_id']}" && !diff["masterVsBase"]);
-    let text = run?.text;
-    let count = run?.lines || 0;
+      const diffApiUrl = "${h.diff_url(run)}".replace(
+        "//github.com/",
+        "//api.github.com/repos/"
+      );
+      
+      let dots = 2;
 
-    try {
-      loadingButton();
-      if (!text) {
-        if (dots === 2)
-          diffs = await fetchDiffTwoDots(apiUrlNew, apiUrlBase, diffNew, diffBase, options);
-        else if (dots === 3)
-          diffs = await fetchDiffThreeDots(diffApiUrl);
-
-        text = diffs.text || "No diff available";
-        count = diffs.count || 0;
-
-        // Try to save the diff in localStorage
-        // It can throw an exception if there is not enough space
-        try {
-          localStorageDiffs.push({id:"${run['_id']}", text: text, lines: count, masterVsBase: false, timeStamp: currentTime});
-          localStorage.setItem("localStorageDiffs", JSON.stringify(localStorageDiffs));
-        } catch (e) {
-          console.warn("Could not save diff in localStorage");
+      const token = localStorage.getItem("github_token");
+      const options = token ? {
+        headers: {
+          "Authorization": "token " + token
         }
-      }
-      fetchComments(diffApiUrl, options);
-    } catch (e) {
-      console.error(e);
-      text = e + "\n" + "Suggested Fix: Most probably API limit rate exceeded, please try to add a GitHub personal token in your profile or 'View on GitHub'.";
-    }
+      } : {};
+
+      const testRepo = "${h.tests_repo(run)}";
+      const apiUrlNew = testRepo.replace(
+        "//github.com/",
+        "//api.github.com/repos/"
+      );
+
+      const diffNew  = "${run["args"]["resolved_new"][:10]}";
+      const apiOfficialMaster = "https://api.github.com/repos/official-stockfish/Stockfish";
+      const baseOfficialMaster = "${run["args"]["official_master_sha"][:10] if run["args"].get("official_master_sha") else ""}";
+
+      % if run["args"].get("spsa"):
+        const apiUrlBase = apiOfficialMaster;
+        % if run["args"].get("official_master_sha"):
+            const diffBase = baseOfficialMaster;
+        % else: # old tests before this field
+            const diffBase = "master";
+            dots = 3; // fall back to the three dot diff request as the diff will be rebased
+        % endif
+      % else:
+        % if run["args"]["new_tag"] == "master" and run["args"]["base_tag"] == pt_info["pt_branch"]:
+            dots = 3; // fall back to the three dot in case of PTs since official is always rebased
+        % endif
+        const apiUrlBase = apiUrlNew;
+        const diffBase = "${run["args"]["resolved_base"][:10]}";
+      % endif
 
-    addDiff(diffText, text);
-    showDiff(diffContents, diffText, count, copyDiffBtn, toggleBtn);
-    hljs.highlightElement(diffText);
-    toggleBtn.addEventListener("click", function () {
-        diffContents.style.display =
-          diffContents.style.display === "none" ? "" : "none";
-        if (copyDiffBtn)
-          copyDiffBtn.style.display =
-            copyDiffBtn.style.display === "none" ? "" : "none";
-        if (toggleBtn.textContent === "Hide") toggleBtn.textContent = "Show";
-        else toggleBtn.textContent = "Hide";
-      });
-    document.getElementById("diff-section").style.display = "";
+      // Check if the diff is already in localStorage and use it if it is
+      let localStorageDiffs = JSON.parse(localStorage.getItem("localStorageDiffs")) || [];
+      localStorageDiffs = localStorageDiffs.filter(diff => diff?.timeStamp >= oneDayAgo);
 
-    % if run["args"]["base_tag"] == "master":
-      if (baseOfficialMaster) {
-        // Check if the diff is already in localStorage and use it if it is
-        let run = localStorageDiffs.find(diff => diff["id"] === "${run['_id']}" && diff["masterVsBase"] === true);
-        let text = run?.text;
+      let run = localStorageDiffs.find(diff => diff["id"] === "${run['_id']}" && !diff["masterVsBase"]);
+      let text = run?.text;
+      let count = run?.lines || 0;
 
+      try {
+        loadingButton();
         if (!text) {
-          const masterVsOfficialMaster =
-            await fetchDiffTwoDots(apiUrlBase, apiOfficialMaster, diffBase, baseOfficialMaster, options);
-          text = masterVsOfficialMaster.text || "No diff available";
+          if (dots === 2)
+            diffs = await fetchDiffTwoDots(apiUrlNew, apiUrlBase, diffNew, diffBase, options);
+          else if (dots === 3)
+            diffs = await fetchDiffThreeDots(diffApiUrl);
+
+          text = diffs.text || "No diff available";
+          count = diffs.count || 0;
+
           // Try to save the diff in localStorage
           // It can throw an exception if there is not enough space
           try {
-            localStorageDiffs.push({id:"${run['_id']}", text: text, lines: count, masterVsBase: true, timeStamp: currentTime});
+            localStorageDiffs.push({id:"${run['_id']}", text: text, lines: count, masterVsBase: false, timeStamp: currentTime});
             localStorage.setItem("localStorageDiffs", JSON.stringify(localStorageDiffs));
           } catch (e) {
             console.warn("Could not save diff in localStorage");
           }
         }
+        fetchComments(diffApiUrl, options);
+      } catch (e) {
+        console.error(e);
+        text = e + "\n" + "Suggested Fix: Most probably API limit rate exceeded, please try to add a GitHub personal token in your profile or 'View on GitHub'.";
+      }
 
-        if (text === "No diff available") {
-          return;
-        }
+      addDiff(diffText, text);
+      showDiff(diffContents, diffText, count, copyDiffBtn, toggleBtn);
+      hljs.highlightElement(diffText);
+      toggleBtn.addEventListener("click", function () {
+          diffContents.style.display =
+            diffContents.style.display === "none" ? "" : "none";
+          if (copyDiffBtn)
+            copyDiffBtn.style.display =
+              copyDiffBtn.style.display === "none" ? "" : "none";
+          if (toggleBtn.textContent === "Hide") toggleBtn.textContent = "Show";
+          else toggleBtn.textContent = "Hide";
+        });
+      document.getElementById("diff-section").style.display = "";
 
-        document.getElementById("master_vs_official_master").style.display = "";
-        document.getElementById("master_vs_official_master").addEventListener("click", (e) => {
+      % if run["args"]["base_tag"] == "master":
+        if (baseOfficialMaster) {
           // Check if the diff is already in localStorage and use it if it is
-          let localStorageDiffs = JSON.parse(localStorage.getItem("localStorageDiffs")) || [];
-          localStorageDiffs = localStorageDiffs.filter(diff => diff?.timeStamp >= oneDayAgo);
-          e.currentTarget.classList.toggle("active");
-          if (e.currentTarget.classList.contains("active")) {
-              e.currentTarget.querySelector("span").textContent = "base vs master";
-              e.currentTarget.title = "Compares base to master";
-              addDiff(diffText, text);
-              hljs.highlightElement(diffText);
+          let run = localStorageDiffs.find(diff => diff["id"] === "${run['_id']}" && diff["masterVsBase"] === true);
+          let text = run?.text;
+
+          if (!text) {
+            const masterVsOfficialMaster =
+              await fetchDiffTwoDots(apiUrlBase, apiOfficialMaster, diffBase, baseOfficialMaster, options);
+            text = masterVsOfficialMaster.text || "No diff available";
+            // Try to save the diff in localStorage
+            // It can throw an exception if there is not enough space
+            try {
+              localStorageDiffs.push({id:"${run['_id']}", text: text, lines: count, masterVsBase: true, timeStamp: currentTime});
+              localStorage.setItem("localStorageDiffs", JSON.stringify(localStorageDiffs));
+            } catch (e) {
+              console.warn("Could not save diff in localStorage");
+            }
           }
-          else {
-            e.currentTarget.querySelector("span").textContent = "master vs official";
-            e.currentTarget.title = "Compares master to official-master at the time of submission";
-            // Check if the diff is already in localStorage and use it if it is
-            let run = localStorageDiffs.find(diff => diff["id"] === "${run['_id']}" && diff["masterVsBase"] === false);
-            const originalDiffText = run.text;
-            const originalDiffCount = run.lines || 0;
-            addDiff(diffText, originalDiffText);
-            showDiff(diffContents, diffText, originalDiffCount, copyDiffBtn, toggleBtn);
-            hljs.highlightElement(diffText);
+
+          if (text === "No diff available") {
+            return;
           }
-        });
-      }
-    % endif
-  }
 
-  const diffPromise = handleDiff();
-  const tasksPromise = handleRenderTasks();
+          document.getElementById("master_vs_official_master").style.display = "";
+          document.getElementById("master_vs_official_master").addEventListener("click", (e) => {
+            // Check if the diff is already in localStorage and use it if it is
+            let localStorageDiffs = JSON.parse(localStorage.getItem("localStorageDiffs")) || [];
+            localStorageDiffs = localStorageDiffs.filter(diff => diff?.timeStamp >= oneDayAgo);
+            e.currentTarget.classList.toggle("active");
+            if (e.currentTarget.classList.contains("active")) {
+                e.currentTarget.querySelector("span").textContent = "base vs master";
+                e.currentTarget.title = "Compares base to master";
+                addDiff(diffText, text);
+                hljs.highlightElement(diffText);
+            }
+            else {
+              e.currentTarget.querySelector("span").textContent = "master vs official";
+              e.currentTarget.title = "Compares master to official-master at the time of submission";
+              // Check if the diff is already in localStorage and use it if it is
+              let run = localStorageDiffs.find(diff => diff["id"] === "${run['_id']}" && diff["masterVsBase"] === false);
+              const originalDiffText = run.text;
+              const originalDiffCount = run.lines || 0;
+              addDiff(diffText, originalDiffText);
+              showDiff(diffContents, diffText, originalDiffCount, copyDiffBtn, toggleBtn);
+              hljs.highlightElement(diffText);
+            }
+          });
+        }
+      % endif
+    }
 
-  Promise.all([spsaPromise, diffPromise, tasksPromise])
-    .then(() => {
-    % if show_task >= 0:
-      scroll_to(${show_task});
-      document.getElementById("enclosure").style="visibility:visible;";
-      document.documentElement.style="overflow:scroll;";
-    % endif
-    });
+    const diffPromise = handleDiff();
+    const tasksPromise = handleRenderTasks();
+
+    Promise.all([spsaPromise, diffPromise, tasksPromise])
+      .then(() => {
+      % if show_task >= 0:
+        scroll_to(${show_task});
+        document.getElementById("enclosure").style="visibility:visible;";
+        document.documentElement.style="overflow:scroll;";
+      % endif
+      });
+  })();
 </script>
diff --git a/server/fishtest/templates/user.mak b/server/fishtest/templates/user.mak
index 1172e4a0e..7ff4e3eb2 100644
--- a/server/fishtest/templates/user.mak
+++ b/server/fishtest/templates/user.mak
@@ -4,26 +4,26 @@
   from fishtest.util import format_group
 %>
 
-% if profile:
-  <script>
-    document.title = "Profile | Stockfish Testing";
-    async function handleGitHubToken() {
-      await DOMContentLoaded();
-      document.getElementById("github_token").value = localStorage.getItem("github_token") || "";
-      document.getElementById("profile_form").addEventListener("submit", (e) => {
-          e.preventDefault();
-          const githubToken = document.getElementById("github_token").value;
-          localStorage.setItem("github_token", githubToken);
-          e.target.submit();
-      });
-    }
-    handleGitHubToken();
-  </script>
-% else:
-  <script>
-    document.title = "User Management | Stockfish Testing";
-  </script>
-% endif
+<script>
+  (() => {
+    % if profile:
+      document.title = "Profile | Stockfish Testing";
+      async function handleGitHubToken() {
+        await DOMContentLoaded();
+        document.getElementById("github_token").value = localStorage.getItem("github_token") || "";
+        document.getElementById("profile_form").addEventListener("submit", (e) => {
+            e.preventDefault();
+            const githubToken = document.getElementById("github_token").value;
+            localStorage.setItem("github_token", githubToken);
+            e.target.submit();
+        });
+      }
+      handleGitHubToken();
+    % else:
+      document.title = "User Management | Stockfish Testing";
+    % endif
+  })();
+</script>
 
 <div class="col-limited-size">
   <header class="text-md-center py-2">
diff --git a/server/fishtest/templates/user_management.mak b/server/fishtest/templates/user_management.mak
index 095c939f9..c7d557031 100644
--- a/server/fishtest/templates/user_management.mak
+++ b/server/fishtest/templates/user_management.mak
@@ -5,29 +5,30 @@
 %>
 
 <script>
-  document.title = "User Management | Stockfish Testing";
-  async function handleToggleUsers() {
-    await DOMContentLoaded();
-    const tableHandlers =
-      [...document.getElementById("users-table-handler").querySelectorAll(".dropdown-item")];
-    tableHandlers.forEach((tableHandler) => {
-      tableHandler.addEventListener("click", (e) => {
-        const tableBodies =
-          [...document.getElementById("users-table").querySelectorAll("tbody")];
-
-        tableBodies.forEach((tableBody) => {
-          tableBody.classList.add("d-none");
+  (() => {
+    document.title = "User Management | Stockfish Testing";
+    async function handleToggleUsers() {
+      await DOMContentLoaded();
+      const tableHandlers =
+        [...document.getElementById("users-table-handler").querySelectorAll(".dropdown-item")];
+      tableHandlers.forEach((tableHandler) => {
+        tableHandler.addEventListener("click", (e) => {
+          const tableBodies =
+            [...document.getElementById("users-table").querySelectorAll("tbody")];
+
+          tableBodies.forEach((tableBody) => {
+            tableBody.classList.add("d-none");
+          })
+
+          const selectedTbodyId = e.target.dataset.handleTargetCustom;
+          document.getElementById(selectedTbodyId).classList.remove("d-none");
+          document.getElementById("users-table-toggle").textContent = e.target.textContent;
         })
-
-        const selectedTbodyId = e.target.dataset.handleTargetCustom;
-        document.getElementById(selectedTbodyId).classList.remove("d-none");
-        document.getElementById("users-table-toggle").textContent = e.target.textContent;
       })
-    })
-  }
-
-  handleToggleUsers();
+    }
 
+    handleToggleUsers();
+  })();
 </script>
 
 <h2>User Management</h2>
diff --git a/server/fishtest/templates/workers.mak b/server/fishtest/templates/workers.mak
index 2e56cc0ae..c013a7189 100644
--- a/server/fishtest/templates/workers.mak
+++ b/server/fishtest/templates/workers.mak
@@ -7,56 +7,58 @@
 %>
 
 <script>
-  document.title = "Workers Management | Stockfish Testing";
-
-  async function handleToggleWorkers() {
-    await DOMContentLoaded();
-    const originalTable = document
-      .getElementById("workers-table")
-      .cloneNode(true);
-
-    const originalRows = Array.from(originalTable.querySelectorAll("tbody tr"));
-
-    const all = (row, _inputValue) => true;
-    const olderThan5Days = (row, _inputValue) => {
-      const cells = Array.from(row.querySelectorAll("td"));
-      return cells.some((cell) => {
-        const cellText = cell.textContent || cell.innerText;
-        if (cellText.toLowerCase().includes("days ago")) {
-          const daysAgo = parseInt(cellText);
-          return daysAgo > 5;
-        }
-        return false;
-      });
-    };
-
-    const notOlderThan5Days = (row, _inputValue) => {
-      return !olderThan5Days(row, _inputValue);
-    };
-
-    filterTable("dummy", "workers-table", originalRows, notOlderThan5Days);
-    document
-      .getElementById("workers-table").classList.remove("d-none");
-
-    const tableHandlers =
-      [...document.getElementById("workers-table-handler").querySelectorAll(".dropdown-item")];
-    tableHandlers.forEach((tableHandler) => {
-      tableHandler.addEventListener("click", (e) => {
-        const selected = e.target.dataset.handleTargetCustom;
-        if (selected === "all-workers")
-          filterTable("dummy", "workers-table", originalRows, all);
-        else if (selected === "gt-5days")
-          filterTable("dummy", "workers-table", originalRows, olderThan5Days);
-        else if (selected === "le-5days")
-          filterTable("dummy", "workers-table", originalRows, notOlderThan5Days);
-
-        document.getElementById("workers-table-toggle").textContent = e.target.textContent;
+  (() => {
+    document.title = "Workers Management | Stockfish Testing";
+
+    async function handleToggleWorkers() {
+      await DOMContentLoaded();
+      const originalTable = document
+        .getElementById("workers-table")
+        .cloneNode(true);
+
+      const originalRows = Array.from(originalTable.querySelectorAll("tbody tr"));
+
+      const all = (row, _inputValue) => true;
+      const olderThan5Days = (row, _inputValue) => {
+        const cells = Array.from(row.querySelectorAll("td"));
+        return cells.some((cell) => {
+          const cellText = cell.textContent || cell.innerText;
+          if (cellText.toLowerCase().includes("days ago")) {
+            const daysAgo = parseInt(cellText);
+            return daysAgo > 5;
+          }
+          return false;
+        });
+      };
+
+      const notOlderThan5Days = (row, _inputValue) => {
+        return !olderThan5Days(row, _inputValue);
+      };
+
+      const workerTable = document.getElementById("workers-table");
+      filterTable("dummy", workerTable, originalRows, notOlderThan5Days);
+      workerTable.classList.remove("d-none");
+
+      const tableHandlers =
+        [...document.getElementById("workers-table-handler").querySelectorAll(".dropdown-item")];
+      tableHandlers.forEach((tableHandler) => {
+        tableHandler.addEventListener("click", (e) => {
+          const workerTable = document.getElementById("workers-table");
+          const selected = e.target.dataset.handleTargetCustom;
+          if (selected === "all-workers")
+            filterTable("dummy", workerTable, originalRows, all);
+          else if (selected === "gt-5days")
+            filterTable("dummy", workerTable, originalRows, olderThan5Days);
+          else if (selected === "le-5days")
+            filterTable("dummy", workerTable, originalRows, notOlderThan5Days);
+
+          document.getElementById("workers-table-toggle").textContent = e.target.textContent;
+        })
       })
-    })
-  }
-
-  handleToggleWorkers();
+    }
 
+    handleToggleWorkers();
+  })();
 </script>
 
 <h2>Workers Management</h2>