diff options
author | stephan <stephan@noemail.net> | 2023-08-30 11:54:43 +0000 |
---|---|---|
committer | stephan <stephan@noemail.net> | 2023-08-30 11:54:43 +0000 |
commit | e621556724c044aa09e7c4fdab4e8407df83d216 (patch) | |
tree | d04b1828b6b5ab68398981876e1a0a2d793ced5c /ext/wasm/SQLTester/index.html | |
parent | ac5e1f82ce5e4103bf31882252587f3cbb2a564b (diff) | |
download | sqlite-e621556724c044aa09e7c4fdab4e8407df83d216.tar.gz sqlite-e621556724c044aa09e7c4fdab4e8407df83d216.zip |
Add a UI, of sorts, to the JS SQLTester.
FossilOrigin-Name: 249e82b9917ea47c56ee1cbd3345a977d335fd3fc0d67a1ef157813ef4571c7c
Diffstat (limited to 'ext/wasm/SQLTester/index.html')
-rw-r--r-- | ext/wasm/SQLTester/index.html | 99 |
1 files changed, 94 insertions, 5 deletions
diff --git a/ext/wasm/SQLTester/index.html b/ext/wasm/SQLTester/index.html index 8ae3e27a3..ebd828c64 100644 --- a/ext/wasm/SQLTester/index.html +++ b/ext/wasm/SQLTester/index.html @@ -8,19 +8,108 @@ <link rel="stylesheet" href="../common/testing.css"/> <title>SQLTester</title> </head> + <style> + fieldset { + display: flex; + flex-direction: row; + padding-right: 1em; + } + fieldset > :not(.legend) { + display: flex; + flex-direction: row; + padding-right: 1em; + } + </style> <body> - <p>SQLTester App. + <h1>SQLTester for JS/WASM</h1> + <p>This app reads in a build-time-defined set of SQLTester test + scripts and runs them through the test suite. </p> - <p>All stuff on this page happens in the dev console.</p> - <hr> + <fieldset> + <legend>Options</legend> + <span class='input-wrapper'> + <input type='checkbox' id='cb-log-reverse' checked> + <label for='cb-log-reverse'>Reverse log order?</label> + </span> + <input type='button' id='btn-run-tests' value='Run tests'/> + </fieldset> <div id='test-output'></div> <!--script src='SQLTester.run.mjs' type='module'></script--> <script> - (function(){ - // Noting that Firefox can't do this yet. + (async function(){ const W = new Worker('SQLTester.run.mjs',{ type: 'module' }); + const wPost = (type,payload)=>W.postMessage({type,payload}); + const mapToString = (v)=>{ + switch(typeof v){ + case 'string': return v; + case 'number': case 'boolean': + case 'undefined': case 'bigint': + return ''+v; + default: break; + } + if(null===v) return 'null'; + if(v instanceof Error){ + v = { + message: v.message, + stack: v.stack, + errorClass: v.name + }; + } + return JSON.stringify(v,undefined,2); + }; + const normalizeArgs = (args)=>args.map(mapToString); + const logTarget = document.querySelector('#test-output'); + const logClass = function(cssClass,...args){ + const ln = document.createElement('div'); + if(cssClass){ + for(const c of (Array.isArray(cssClass) ? cssClass : [cssClass])){ + ln.classList.add(c); + } + } + ln.append(document.createTextNode(normalizeArgs(args).join(' '))); + logTarget.append(ln); + }; + { + const cbReverse = document.querySelector('#cb-log-reverse'); + const cbReverseKey = 'SQLTester:cb-log-reverse'; + const cbReverseIt = ()=>{ + logTarget.classList[cbReverse.checked ? 'add' : 'remove']('reverse'); + }; + cbReverse.addEventListener('change', cbReverseIt, true); + cbReverseIt(); + } + + const btnRun = document.querySelector('#btn-run-tests'); + const runTests = ()=>{ + btnRun.setAttribute('disabled','disabled'); + wPost('run-tests'); + logTarget.innerText = 'Running tests...'; + } + btnRun.addEventListener('click', runTests); + const log2 = function f(...args){ + logClass('', ...args); + return f; + }; + const log = function f(...args){ + logClass('','index.html:',...args); + return f; + }; + W.onmessage = function({data}){ + switch(data.type){ + case 'stdout': log2(data.payload.message); break; + case 'tests-end': btnRun.removeAttribute('disabled'); break; + case 'is-ready': + log("SQLTester.run.mjs is ready."); + runTests(); break; + default: + log("unhandled onmessage",data); + break; + } + }; + //runTests() + /* Inexplicably, */ })(); </script> </body> |