diff options
Diffstat (limited to 'tools/timeline_editor/test_format.html')
| -rw-r--r-- | tools/timeline_editor/test_format.html | 127 |
1 files changed, 127 insertions, 0 deletions
diff --git a/tools/timeline_editor/test_format.html b/tools/timeline_editor/test_format.html new file mode 100644 index 0000000..12b788f --- /dev/null +++ b/tools/timeline_editor/test_format.html @@ -0,0 +1,127 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="UTF-8"> + <title>Timeline Format Test</title> + <style> + body { font-family: monospace; padding: 20px; background: #1e1e1e; color: #d4d4d4; } + .test { margin: 20px 0; padding: 10px; border: 1px solid #444; } + .pass { border-color: #4ec9b0; } + .fail { border-color: #f48771; } + pre { background: #2d2d30; padding: 10px; overflow-x: auto; } + </style> +</head> +<body> + <h1>Timeline Format V2 Test</h1> + <div id="results"></div> + + <script type="module"> + import { TimelineFormat } from './timeline-format.js'; + + const timelineFormat = new TimelineFormat(); + const results = document.getElementById('results'); + + function addTest(name, passed, details) { + const div = document.createElement('div'); + div.className = `test ${passed ? 'pass' : 'fail'}`; + div.innerHTML = `<h3>${passed ? '✓' : '✗'} ${name}</h3>${details}`; + results.appendChild(div); + } + + // Test 1: Parse existing timeline (no NODE declarations) + const testTimeline1 = `# WORKSPACE: test +# BPM 120 + +SEQUENCE 0.0 0 "MainLoop" +EFFECT + Hybrid3D source -> temp1 0.00 4.00 +EFFECT + GaussianBlur temp1 -> sink 0.00 4.00`; + + const parsed1 = timelineFormat.parse(testTimeline1, 120); + const test1Pass = parsed1.sequences.length === 1 && + parsed1.sequences[0].effects.length === 2 && + parsed1.sequences[0].effects[0].inputs[0] === 'source' && + parsed1.sequences[0].effects[0].outputs[0] === 'temp1'; + addTest('Parse timeline without NODE declarations', test1Pass, + `<pre>Sequences: ${parsed1.sequences.length} +Effects: ${parsed1.sequences[0].effects.length} +First effect inputs: ${parsed1.sequences[0].effects[0].inputs.join(', ')} +First effect outputs: ${parsed1.sequences[0].effects[0].outputs.join(', ')}</pre>`); + + // Test 2: Parse timeline with NODE declarations + const testTimeline2 = `# BPM 120 +SEQUENCE 0.0 0 "v2_test" + NODE temp1 u8x4_norm + NODE temp2 f32x4 + EFFECT + Hybrid3D source -> temp1 0.0 4.0 + EFFECT + GaussianBlur temp1 -> temp2 0.0 4.0`; + + const parsed2 = timelineFormat.parse(testTimeline2, 120); + const test2Pass = parsed2.sequences[0].nodes.length === 2 && + parsed2.sequences[0].nodes[0].name === 'temp1' && + parsed2.sequences[0].nodes[0].type === 'u8x4_norm'; + addTest('Parse timeline with NODE declarations', test2Pass, + `<pre>Nodes: ${parsed2.sequences[0].nodes.length} +Node 1: ${parsed2.sequences[0].nodes[0].name} (${parsed2.sequences[0].nodes[0].type}) +Node 2: ${parsed2.sequences[0].nodes[1].name} (${parsed2.sequences[0].nodes[1].type})</pre>`); + + // Test 3: Serialize without nodes + const serialized1 = timelineFormat.serialize(parsed1.sequences, 120); + const test3Pass = serialized1.includes('EFFECT + Hybrid3D source -> temp1') && + !serialized1.includes('NODE'); + addTest('Serialize timeline without NODE declarations', test3Pass, + `<pre>${serialized1}</pre>`); + + // Test 4: Serialize with nodes + const serialized2 = timelineFormat.serialize(parsed2.sequences, 120); + const test4Pass = serialized2.includes('NODE temp1 u8x4_norm') && + serialized2.includes('NODE temp2 f32x4'); + addTest('Serialize timeline with NODE declarations', test4Pass, + `<pre>${serialized2}</pre>`); + + // Test 5: Validation (no nodes - should pass) + const errors1 = timelineFormat.validateSequence(parsed1.sequences[0]); + const test5Pass = errors1.length === 0; + addTest('Validation without NODE declarations', test5Pass, + `<pre>Errors: ${errors1.length}</pre>`); + + // Test 6: Validation (with nodes - should pass) + const errors2 = timelineFormat.validateSequence(parsed2.sequences[0]); + const test6Pass = errors2.length === 0; + addTest('Validation with NODE declarations', test6Pass, + `<pre>Errors: ${errors2.length}</pre>`); + + // Test 7: Validation failure (undeclared node) + const invalidSeq = { + nodes: [{ name: 'temp1', type: 'u8x4_norm' }], + effects: [{ + className: 'Test', + inputs: ['source'], + outputs: ['temp2'], // temp2 not declared! + startTime: 0, + endTime: 4 + }] + }; + const errors3 = timelineFormat.validateSequence(invalidSeq); + const test7Pass = errors3.length > 0 && errors3[0].includes('temp2'); + addTest('Validation detects undeclared nodes', test7Pass, + `<pre>Errors: ${errors3.join('\n')}</pre>`); + + // Test 8: Round-trip (parse → serialize → parse) + const reparsed = timelineFormat.parse(serialized2, 120); + const test8Pass = JSON.stringify(parsed2.sequences[0].nodes) === + JSON.stringify(reparsed.sequences[0].nodes); + addTest('Round-trip consistency', test8Pass, + `<pre>Original nodes: ${JSON.stringify(parsed2.sequences[0].nodes, null, 2)} +Reparsed nodes: ${JSON.stringify(reparsed.sequences[0].nodes, null, 2)}</pre>`); + + // Summary + const allTests = document.querySelectorAll('.test'); + const passed = document.querySelectorAll('.test.pass').length; + const total = allTests.length; + const summary = document.createElement('div'); + summary.style.cssText = 'margin-top: 30px; padding: 20px; background: #2d2d30; font-size: 18px;'; + summary.innerHTML = `<strong>Results: ${passed}/${total} tests passed</strong>`; + results.appendChild(summary); + </script> +</body> +</html> |