From 062bb1d7c66efc516066ffe27aec7628b39c2074 Mon Sep 17 00:00:00 2001
From: multipleof4 <planetrenox@protonmail.com>
Date: Mon, 13 Oct 2025 12:10:12 -0700
Subject: [PATCH] Feat: Show spinner while running tests

---
 index.html | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/index.html b/index.html
index fb8c7cd..a8de638 100644
--- a/index.html
+++ b/index.html
@@ -51,6 +51,11 @@
         const list = document.getElementById(`list-${sModel}`);
 
         for (const test of tests) {
+          const li = document.createElement('li');
+          li.className = 'flex items-center gap-3 text-sm';
+          list.appendChild(li);
+          li.innerHTML = `<svg class="animate-spin h-4 w-4 text-gray-400" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle><path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path></svg><span class="font-medium text-gray-800">${test}</span><span class="mono text-gray-500 ml-auto">...</span>`;
+          
           let itemHTML;
           try {
             const tMod = await import(`./tests/${test}/test.js`);
@@ -62,7 +67,7 @@
             itemHTML = `❌ <span class="font-medium text-gray-800">${test}</span>`;
           }
           const time = genTimes[model]?.[test]?.toFixed(3) ?? 'N/A';
-          list.innerHTML += `<li class="flex items-center gap-3 text-sm">${itemHTML}<span class="mono text-gray-500 ml-auto">${time}s</span></li>`;
+          li.innerHTML = `${itemHTML}<span class="mono text-gray-500 ml-auto">${time}s</span>`;
         }
       }
     };