Add a 'test' button to each test in Puter.js's test suite

This commit is contained in:
jelveh
2025-07-04 19:12:06 -07:00
parent 6da8ebfe96
commit a02a228bf6

View File

@@ -38,6 +38,10 @@
.test-container{
font-family: monospace;
}
.test-checkbox-container{
display: flex;
align-items: center;
}
.test-container:hover{
background-color: #f0f0f0;
}
@@ -47,6 +51,35 @@
.test-container input{
float: left;
}
.test-run-button {
margin-left: 10px;
background-color: #4c84af;
border: none;
color: white;
padding: 5px 10px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 12px;
cursor: pointer;
border-radius: 3px;
opacity: 0;
transition: opacity 0.2s ease;
}
.test-container:hover .test-run-button {
opacity: 1;
}
.test-run-button:hover {
background-color: #3a6a8a;
}
.test-run-button:disabled {
background-color: #999;
cursor: not-allowed;
opacity: 1;
}
.test-run-button:disabled:hover {
background-color: #999;
}
</style>
<script>
document.addEventListener("DOMContentLoaded", () => {
@@ -77,24 +110,33 @@
$('#tests').append('<h2>File System Tests</h2>');
for (let i = 0; i < fsTests.length; i++) {
$('#tests').append(`<div class="test-container" id="fsTests-container-${i}">
<input type="checkbox" class="test-checkbox" id="fsTests${i}" checked>
<label for="fsTests${i}">${fsTests[i].name}</label><br>
<div class="test-checkbox-container">
<input type="checkbox" class="test-checkbox" id="fsTests${i}" checked>
<label for="fsTests${i}">${fsTests[i].name}</label><br>
<button class="test-run-button" onclick="runSingleTest('fs', ${i})">Run Test</button>
</div>
</div>`);
}
$('#tests').append('<h2>Key Value Tests</h2>');
for (let i = 0; i < kvTests.length; i++) {
$('#tests').append(`<div class="test-container" id="kvTests-container-${i}">
<input type="checkbox" class="test-checkbox" id="kvTests${i}" checked>
<label for="kvTests${i}">${kvTests[i].name}</label><br>
<div class="test-checkbox-container">
<input type="checkbox" class="test-checkbox" id="kvTests${i}" checked>
<label for="kvTests${i}">${kvTests[i].name}</label><br>
<button class="test-run-button" onclick="runSingleTest('kv', ${i})">Run Test</button>
</div>
</div>`);
}
$('#tests').append('<h2>AI Tests</h2>');
for (let i = 0; i < aiTests.length; i++) {
$('#tests').append(`<div class="test-container" id="aiTests-container-${i}">
<input type="checkbox" class="test-checkbox" id="aiTests${i}" checked>
<label for="aiTests${i}">${aiTests[i].name}</label><br>
<div class="test-checkbox-container">
<input type="checkbox" class="test-checkbox" id="aiTests${i}" checked>
<label for="aiTests${i}">${aiTests[i].name}</label><br>
<button class="test-run-button" onclick="runSingleTest('ai', ${i})">Run Test</button>
</div>
</div>`);
}
@@ -104,6 +146,46 @@
}
}
async function runSingleTest(testType, index) {
const testSuites = {
'fs': fsTests,
'kv': kvTests,
'ai': aiTests
};
const tests = testSuites[testType];
const containerId = `${testType}Tests-container-${index}`;
const buttonSelector = `#${containerId} .test-run-button`;
// Disable the button and show it while running
$(buttonSelector).prop('disabled', true).text('Running...');
// Clear previous results
$(`#${containerId}`).css('background-color', '');
$(`#${containerId} pre`).remove();
try {
await tests[index]();
// make this test's container green
$(`#${containerId}`).css('background-color', '#85e085');
} catch (e) {
console.error(`${testType.toUpperCase()} Test failed:`, tests[index].name, e);
// make this test's container red
$(`#${containerId}`).css('background-color', '#ffbfbf');
// message - show full error information including JSON details
let errorMessage = e.message || e.toString();
if (e.originalError) {
errorMessage += '\n\nOriginal Error:\n' + JSON.stringify(e.originalError, null, 2);
}
$(`#${containerId}`).append(`<pre style="color:#c00000; white-space: pre-wrap; font-size: 12px; margin: 5px 0; padding: 10px; background-color: #f8f8f8; border-radius: 3px;">${errorMessage}</pre>`);
} finally {
// Re-enable the button
$(buttonSelector).prop('disabled', false).text('Run Test');
}
}
window.runSingleTest = runSingleTest;
async function runTests() {
// go through fsTests and run each test
for (let i = 0; i < fsTests.length; i++) {