mirror of
https://github.com/multipleof4/lynchmark.git
synced 2026-01-14 00:27:55 +00:00
Feat: Create debug page to show runtime outputs
This commit is contained in:
44
debug.html
44
debug.html
@@ -36,7 +36,7 @@
|
|||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<p class="text-base text-gray-600 max-w-lg mx-auto">
|
<p class="text-base text-gray-600 max-w-lg mx-auto">
|
||||||
Review exactly what each model produced for every benchmark test.
|
Review the runtime output of what each model produced for every benchmark test.
|
||||||
</p>
|
</p>
|
||||||
</header>
|
</header>
|
||||||
<div id="results-container" class="flex flex-col gap-6 flex-grow"></div>
|
<div id="results-container" class="flex flex-col gap-6 flex-grow"></div>
|
||||||
@@ -56,8 +56,7 @@
|
|||||||
const now=new Date();
|
const now=new Date();
|
||||||
stamp.textContent=now.toLocaleDateString('en-US',{month:'short',year:'numeric'});
|
stamp.textContent=now.toLocaleDateString('en-US',{month:'short',year:'numeric'});
|
||||||
stamp.dateTime=now.toISOString().split('T')[0];
|
stamp.dateTime=now.toISOString().split('T')[0];
|
||||||
const esc=s=>s.replace(/[&<>]/g,c=>({ '&':'&','<':'<','>':'>' }[c]));
|
const esc=s=>s.replace(/[&<>]/g,c=>({'&':'&','<':'<','>':'>'})[c]);
|
||||||
const load=path=>fetch(path).then(r=>r.ok?r.text():null).catch(()=>null);
|
|
||||||
const run=async()=>{
|
const run=async()=>{
|
||||||
const [readme,genTimes]=await Promise.all([
|
const [readme,genTimes]=await Promise.all([
|
||||||
fetch('./README').then(r=>r.text()),
|
fetch('./README').then(r=>r.text()),
|
||||||
@@ -65,36 +64,33 @@
|
|||||||
]);
|
]);
|
||||||
const models=readme.match(/<!-- MODELS_START -->\n([\s\S]+?)\n<!-- MODELS_END -->/)[1].trim().split('\n');
|
const models=readme.match(/<!-- MODELS_START -->\n([\s\S]+?)\n<!-- MODELS_END -->/)[1].trim().split('\n');
|
||||||
const tests=[...new Set(Object.values(genTimes).flatMap(o=>Object.keys(o||{})))].sort();
|
const tests=[...new Set(Object.values(genTimes).flatMap(o=>Object.keys(o||{})))].sort();
|
||||||
if(!tests.length){
|
|
||||||
container.innerHTML='<p class="text-center text-sm text-gray-500">No tests available.</p>';
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
for(const model of models){
|
for(const model of models){
|
||||||
const sModel=model.replace(/[\/:]/g,'_');
|
const sModel=model.replace(/[\/:]/g,'_');
|
||||||
const card=document.createElement('section');
|
const card=document.createElement('section');
|
||||||
card.className='rounded-2xl border border-gray-200 bg-white shadow-sm overflow-hidden';
|
card.className='rounded-2xl border border-gray-200 bg-white shadow-sm overflow-hidden';
|
||||||
card.innerHTML=`
|
card.innerHTML=`<div class="bg-gray-50 px-5 py-3 border-b border-gray-200"><p class="mono text-sm text-gray-700 font-medium">${model}</p></div><ul class="p-4 space-y-3" id="list-${sModel}"></ul>`;
|
||||||
<div class="bg-gray-50 px-5 py-3 border-b border-gray-200">
|
|
||||||
<p class="mono text-sm text-gray-700 font-medium">${model}</p>
|
|
||||||
</div>
|
|
||||||
<ul class="p-4 space-y-3" id="list-${sModel}"></ul>`;
|
|
||||||
container.appendChild(card);
|
container.appendChild(card);
|
||||||
const list=get(`list-${sModel}`);
|
const list=get(`list-${sModel}`);
|
||||||
for(const test of tests){
|
for(const test of tests){
|
||||||
const li=document.createElement('li');
|
const li=document.createElement('li');
|
||||||
li.className='list-none';
|
|
||||||
list.appendChild(li);
|
list.appendChild(li);
|
||||||
const code=await load(`./tests/${test}/outputs/${sModel}.js`);
|
let body,status='✅',label='View output';
|
||||||
const body=code?`<pre class="bg-gray-900 text-green-100 text-xs rounded-lg p-4 overflow-x-auto"><code>${esc(code)}</code></pre>`:`<p class="text-sm text-red-500">No generated output found.</p>`;
|
try{
|
||||||
li.innerHTML=`
|
const [tMod,lMod]=await Promise.all([
|
||||||
<details class="rounded-xl border border-gray-200 bg-white p-4">
|
import(`./tests/${test}/test.js`),
|
||||||
<summary class="flex items-center gap-3 text-sm cursor-pointer select-none">
|
import(`./tests/${test}/outputs/${sModel}.js`)
|
||||||
${code?'✅':'⚠️'}
|
]);
|
||||||
<span class="font-medium text-gray-800">${test}</span>
|
if(!lMod?.default) throw new Error('Generated module invalid.');
|
||||||
<span class="mono text-gray-500 ml-auto">${code?'View code':'Missing output'}</span>
|
if(!tMod?.default?.getTestCases) throw new Error('Test case getter missing.');
|
||||||
</summary>
|
const result=await lMod.default(...tMod.default.getTestCases());
|
||||||
<div class="mt-3">${body}</div>
|
const str=JSON.stringify(result,null,2);
|
||||||
</details>`;
|
body=`<pre class="bg-gray-900 text-green-100 text-xs rounded-lg p-4 overflow-x-auto"><code>${esc(str)}</code></pre>`;
|
||||||
|
}catch(e){
|
||||||
|
status='❌';
|
||||||
|
label='View error';
|
||||||
|
body=`<p class="text-sm text-red-500">${esc(e.message)}</p>`;
|
||||||
|
}
|
||||||
|
li.innerHTML=`<details class="rounded-xl border border-gray-200 bg-white p-4"><summary class="flex items-center gap-3 text-sm cursor-pointer select-none">${status} <span class="font-medium text-gray-800">${test}</span><span class="mono text-gray-500 ml-auto">${label}</span></summary><div class="mt-3">${body}</div></details>`;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user