17 lines
2.0 KiB
TypeScript
17 lines
2.0 KiB
TypeScript
import {readFileSync} from 'node:fs';
|
|
import {renderComponent} from '../../packages/test/src/index';
|
|
import {getReactiveRuntime,getComponentControllerRuntime} from '../../packages/csr/src/index';
|
|
const source=readFileSync('packages/ui/components/Chart.wrn','utf8');
|
|
const types=['bar','line','area','pie','doughnut','radar','polarArea','scatter','bubble','mixed'];
|
|
const bundle=await Bun.build({entrypoints:['output/chartjs-verify/entry.ts'],target:'browser',minify:false});
|
|
if(!bundle.success) throw new Error(String(bundle.logs));
|
|
const js=await bundle.outputs[0].text();
|
|
let html='<!doctype html><html><head><style>body{font:14px Arial;background:#f7f7f8;margin:20px}main{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}figure{background:white;padding:20px;margin:0}canvas{max-width:100%}.wrn-chart__stage{position:relative}.wrn-chart__accessible{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}@media(max-width:600px){main{grid-template-columns:1fr}}</style></head><body><main>';
|
|
for(const type of types){
|
|
const data=type==='scatter'||type==='bubble'?{datasets:[{label:'Coordinates',data:[{x:1,y:4,r:8},{x:3,y:8,r:16},{x:5,y:3,r:12}]}]}:{labels:['Mon','Tue','Wed','Thu','Fri'],datasets:[{label:'Sample',data:type==='bar'?[-20,38,29,52,45]:[24,38,29,52,45]},...(type==='mixed'?[{type:'line',label:'Target',data:[25,30,40,45,50]}]:[])]};
|
|
html+=await renderComponent(source,{title:type,description:'Sample data',type:type==='mixed'?'bar':type,data,showValues:false,options:{animation:false},height:260});
|
|
}
|
|
html+='</main><script src="/csr.js"></script><script type="module" src="/chart.js"></script></body></html>';
|
|
const server=Bun.serve({port:4319,fetch(req){const path=new URL(req.url).pathname;return new Response(path==='/chart.js'?js:path==='/csr.js'?getReactiveRuntime()+'\n'+getComponentControllerRuntime():html,{headers:{'Content-Type':path.endsWith('.js')?'text/javascript':'text/html'}})}});
|
|
console.log('Chart verification listening on '+server.url);
|