buninu-browser 0.7.0 → 0.9.0

package/test/manual-clumsy-bird-three-pipes.js

@@ -0,0 +1,81 @@
+#!/usr/bin/env bun
+// Live acceptance test; no game patches or third-party packages.
+// bun test/manual-clumsy-bird-three-pipes.js [output-directory] [buninu|chromium]
+import {resolve} from 'node:path';
+import {launch} from '../tools/browser-lab.js';
+
+const directory=resolve(process.argv[2]??'/tmp/clumsy-bird-three-pipes');
+const engine=process.argv[3]??'buninu';
+const url='https://ellisonleao.github.io/clumsy-bird/';
+const app=await launch(engine,directory),cdp=app.cdp;
+const report={engine,url,width:900,height:600,passed:false,attempts:[],exceptions:[]};
+// Observation only: all controls use ordinary CDP keyboard events.
+const readState=`JSON.stringify({
+ play:me.state.isCurrent(me.state.PLAY),menu:me.state.isCurrent(me.state.MENU),
+ over:me.state.isCurrent(me.state.GAME_OVER),start:game.data.start,score:game.data.steps,
+ y:me.state.current().bird?.pos.y,force:me.state.current().bird?.gravityForce,
+ collided:me.state.current().bird?.collided,
+ pipes:me.game.world.children.filter(o=>o.type==='pipe'&&o.pos.y>0&&o.pos.x>-90)
+   .map(o=>({x:o.pos.x,y:o.pos.y})).sort((a,b)=>a.x-b.x)
+})`;
+const state=async()=>JSON.parse(await cdp.evaluate(readState));
+let held=null;
+async function key(key,code,keyCode,hold=80){
+ const event={key,code,windowsVirtualKeyCode:keyCode};held=event;
+ try{
+  await cdp.send('Input.dispatchKeyEvent',{type:'rawKeyDown',...event});
+  await Bun.sleep(hold);
+ }finally{
+  await cdp.send('Input.dispatchKeyEvent',{type:'keyUp',...event});held=null;
+ }
+}
+try{
+ await cdp.send('Emulation.setDeviceMetricsOverride',{width:900,height:600,deviceScaleFactor:1,mobile:false});
+ await cdp.send('Page.navigate',{url});
+ let loaded=false;
+ for(let n=0;n<240;n++){
+  if(await cdp.evaluate('typeof me!=="undefined"&&me.state.isCurrent(me.state.MENU)')){loaded=true;break;}
+  await Bun.sleep(200);
+ }
+ if(!loaded)throw Error('Game menu did not load during the manual test');
+ for(let attempt=1;attempt<=16&&!report.passed;attempt++){
+  if((await state()).over){await key('Enter','Enter',13);await Bun.sleep(700);}
+  await key('Enter','Enter',13);
+  const started=performance.now(),record={attempt,states:[]};report.attempts.push(record);
+  let lastFlap=0,lastScore=-1;
+  while(performance.now()-started<180000){
+   const s=await state(),elapsedMs=performance.now()-started;
+   record.states.push({elapsedMs,...s});
+   if(s.score!==lastScore){console.log(JSON.stringify({attempt,elapsedMs,score:s.score}));lastScore=s.score;}
+   // The third scoring marker alone is not enough: its pipe must also have
+   // cleared the bird, and play must still be active without a collision.
+   if(s.score>=3&&s.pipes[0]?.x>150&&s.start&&!s.collided){
+    const {data}=await cdp.send('Page.captureScreenshot',{format:'png'});
+    const after=await state();
+    if(after.start&&!after.collided){
+     report.passed=true;report.final=after;report.elapsedMs=elapsedMs;
+     report.screenshot=directory+'/three-pipes.png';
+     await Bun.write(report.screenshot,Buffer.from(data,'base64'));
+     console.log('Passed three pipes:',report.screenshot);
+     break;
+    }
+   }
+   if(s.over||s.collided){await Bun.sleep(2200);break;}
+   if(s.start&&s.play){
+    const pipe=s.pipes[0];
+    const target=pipe&&pipe.x<650?Math.max(25,Math.min(430,pipe.y-88)):200;
+    const now=performance.now();
+    if(s.y>target+8&&now-lastFlap>100){lastFlap=now;await key(' ','Space',32,55);}
+   }
+   await Bun.sleep(10);
+  }
+ }
+ report.exceptions=cdp.events.filter(event=>event.method==='Runtime.exceptionThrown');
+ if(!report.passed)throw Error('CDP pilot did not clear three pipes during this run');
+}finally{
+ try{await Bun.write(directory+'/three-pipes-report.json',JSON.stringify(report,null,2));}
+ finally{
+  if(held)await cdp.send('Input.dispatchKeyEvent',{type:'keyUp',...held}).catch(()=>{});
+  await app.stop();
+ }
+}

package/test/manual-clumsy-bird.js

@@ -0,0 +1,52 @@
+#!/usr/bin/env bun
+// Live reference check: no page patches, downloaded source or extra packages.
+// bun test/manual-clumsy-bird.js [buninu|chromium] [output-directory]
+import {resolve} from 'node:path';
+import {launch,snapshot} from '../tools/browser-lab.js';
+const engine=process.argv[2]??'buninu',directory=resolve(process.argv[3]??'/tmp/clumsy-bird');
+const url='https://ellisonleao.github.io/clumsy-bird/';
+const app=await launch(engine,directory);
+const report={engine,url};
+try{
+ const {cdp}=app;
+ await cdp.send('Emulation.setDeviceMetricsOverride',{width:900,height:600,deviceScaleFactor:1,mobile:false});
+ console.log('navigate');const started=performance.now();await cdp.send('Page.navigate',{url});
+ console.log('waiting for menu');
+ const until=async expression=>{
+  const deadline=performance.now()+30000;
+  while(performance.now()<deadline){
+   if(await cdp.evaluate(expression,2000).catch(()=>false))return;
+   await Bun.sleep(250);
+  }
+  throw Error('Timed out waiting for '+expression);
+ };
+ await until('typeof me==="object" && me.state.isCurrent(me.state.MENU)');
+ report.menuMs=performance.now()-started;console.log('menu',report.menuMs);
+ await snapshot(cdp,directory,'menu');console.log('menu captured');
+ const rect=await cdp.evaluate('(()=>{const r=document.querySelector("canvas").getBoundingClientRect();return {x:r.x+r.width/2,y:r.y+r.height/2}})()');
+ for(const type of ['mousePressed','mouseReleased'])await cdp.send('Input.dispatchMouseEvent',{type,...rect,button:'left',clickCount:1});
+ await until('me.state.isCurrent(me.state.PLAY)');
+ for(const type of ['keyDown','keyUp'])await cdp.send('Input.dispatchKeyEvent',{type,key:' ',code:'Space',windowsVirtualKeyCode:32});
+ for(let n=0;n<30&&!await cdp.evaluate('game.data.start');n++){
+  for(const type of ['keyDown','keyUp'])await cdp.send('Input.dispatchKeyEvent',{type,key:' ',code:'Space',windowsVirtualKeyCode:32});
+  await Bun.sleep(100);
+ }
+ if(!await cdp.evaluate('game.data.start'))throw Error('Game did not leave its ready screen');
+ report.inputStartedGame=true;
+ // Starting is a timed ready-screen transition, not proof that jump input works.
+ // Keep keyDown held across a real game update before releasing it.
+ const before=await cdp.evaluate('me.state.current().bird.pos.y');
+ await cdp.send('Input.dispatchKeyEvent',{type:'keyDown',key:' ',code:'Space',windowsVirtualKeyCode:32});
+ await Bun.sleep(100);
+ const after=await cdp.evaluate('me.state.current().bird.pos.y');
+ await cdp.send('Input.dispatchKeyEvent',{type:'keyUp',key:' ',code:'Space',windowsVirtualKeyCode:32});
+ report.flight={before,after};
+ if(!(after<before))throw Error('Space did not make the bird fly upward');
+
+ report.images=await cdp.evaluate('["clumsy","pipe","ground","logo"].map(name=>{const image=me.loader.getImage(name);return {name,width:image.width,height:image.height,naturalWidth:image.naturalWidth,naturalHeight:image.naturalHeight}})');
+ if(report.images.some(image=>!image.width||!image.height))throw Error('Loaded sprite image has no dimensions');
+ await snapshot(cdp,directory,'playing');
+ report.exceptions=cdp.events.filter(event=>event.method==='Runtime.exceptionThrown');
+ await Bun.write(resolve(directory,'clumsy-report.json'),JSON.stringify(report,null,2));
+ console.log(JSON.stringify(report,null,2));
+}finally{await app.stop();}

package/test/manual-hextris.js

@@ -0,0 +1,30 @@
+#!/usr/bin/env bun
+// env NODE_TLS_REJECT_UNAUTHORIZED=0 bun test/manual-hextris.js [buninu|chromium] [output-directory]
+// No game patches: Runtime.evaluate observes state; only CDP input operates it.
+import assert from 'node:assert/strict';
+import {resolve} from 'node:path';
+import {launch} from '../tools/browser-lab.js';
+const engine=process.argv[2]??'buninu',directory=resolve(process.argv[3]??`/tmp/hextris-validation-${engine}`);
+const app=await launch(engine,directory,engine==='chromium'&&process.env.NODE_TLS_REJECT_UNAUTHORIZED==='0'?['--ignore-certificate-errors']:[]),c=app.cdp;
+const report={engine,url:'https://hextris.io/',states:[]};
+const state=()=>c.evaluate('JSON.stringify({state:gameState,position:MainHex.position,blocks:blocks.length,score})').then(JSON.parse);
+async function key(key,code,n){for(const type of ['rawKeyDown','keyUp']){await c.send('Input.dispatchKeyEvent',{type,key,code,windowsVirtualKeyCode:n});if(type==='rawKeyDown')await Bun.sleep(60);}await Bun.sleep(120);}
+try{
+ await c.send('Page.navigate',{url:report.url});
+ for(let n=0;n<300;n++){if(await c.evaluate('typeof MainHex!=="undefined"&&!!MainHex'))break;await Bun.sleep(100);}
+ report.states.push(await state());assert.equal(report.states[0].state,0);
+ const point=await c.evaluate('(()=>{const r=document.getElementById("startBtn").getBoundingClientRect();return {x:r.x+r.width/2,y:r.y+r.height/2}})()');
+ for(const type of ['mousePressed','mouseReleased'])await c.send('Input.dispatchMouseEvent',{type,button:'left',clickCount:1,...point});
+ await Bun.sleep(250);assert.equal((await state()).state,1);
+ await key('ArrowLeft','ArrowLeft',37);report.states.push(await state());assert.equal(report.states.at(-1).position,1);
+ await key('ArrowRight','ArrowRight',39);assert.equal((await state()).position,0);
+ await key('p','KeyP',80);assert.equal((await state()).state,-1);
+ await Bun.sleep(700);await key('p','KeyP',80);
+ for(let n=0;n<50&&(await state()).state!==1;n++)await Bun.sleep(100);
+ assert.equal((await state()).state,1);
+ let generated=false;
+ for(let n=0;n<100;n++){const s=await state();if(s.blocks>0){generated=true;report.states.push(s);break;}await Bun.sleep(100);}
+ assert.ok(generated,'live blocks must be generated');
+ const {data}=await c.send('Page.captureScreenshot',{format:'png'});await Bun.write(directory+'/playing.png',Buffer.from(data,'base64'));
+ report.passed=true;console.log(JSON.stringify(report));
+}finally{try{await Bun.write(directory+'/report.json',JSON.stringify(report,null,2));}finally{await app.stop();}}

package/test/manual-numbered-music.js

@@ -0,0 +1,24 @@
+// Live reference test; opens only its own headless browser and closes it.
+// bun test/manual-numbered-music.js [buninu|chromium] [output-directory]
+import {launch} from '../tools/browser-lab.js';
+import assert from 'node:assert/strict';
+const engine=process.argv[2]??'buninu',dir=process.argv[3]??'/tmp/numbered-music-playback-'+Date.now();
+const b=await launch(engine,dir,engine==='chromium'?['--autoplay-policy=no-user-gesture-required']:[]),c=b.cdp;
+try{
+ await c.send('Page.addScriptToEvaluateOnNewDocument',{source:`window.testContexts=[];window.testFrequencies=[];window.testOscillators=[];const OriginalAudioContext=window.AudioContext;window.AudioContext=class extends OriginalAudioContext{constructor(...a){super(...a);testContexts.push(this);}createOscillator(){const o=super.createOscillator();testOscillators.push(o);const p=o.frequency,set=p.setValueAtTime.bind(p);p.setValueAtTime=(v,t)=>{testFrequencies.push({v,t});return set(v,t)};return o;}};`});
+ await c.send('Page.navigate',{url:'https://drjohnjstest.blogspot.com/2023/10/text-to-numbered-musical-notation.html'});
+ for(let i=0;i<150;i++){if(await c.evaluate('typeof playsheet==="function"'))break;await Bun.sleep(200);}
+ const song='Title=Web Audio test\nSpeed=180\n1234567*1';
+ await c.evaluate(`tsheet.value=${JSON.stringify(song)};document.querySelector('button[onclick="playsheet(tsheet.value);"]').click();`);
+ for(let i=0;i<100;i++) {
+  if(await c.evaluate('testFrequencies.filter(e=>e.v>20).length>=8'))break;
+  await Bun.sleep(100);
+ }
+ await Bun.sleep(400);
+ let state=await c.evaluate('({contexts:testContexts.map(c=>({state:c.state,time:c.currentTime})),frequencies:testFrequencies,oscillators:testOscillators.length})');console.log('play button',{contexts:state.contexts,pitches:state.frequencies.filter(e=>e.v>20).map(e=>e.v)});assert.equal(state.oscillators,1);assert.ok(state.contexts[0].time>1);assert.ok(state.frequencies.filter(e=>e.v>20).length>=8);
+ await c.evaluate(`Promise.all([playsheet(${JSON.stringify('Speed=240\n1234')}),playsheet2(${JSON.stringify('Speed=240\n567*1')})])`);await Bun.sleep(2400);
+ state=await c.evaluate('({contexts:testContexts.map(c=>({state:c.state,time:c.currentTime})),frequencies:testFrequencies,oscillators:testOscillators.length})');console.log('two parts',{contexts:state.contexts,oscillators:state.oscillators});assert.equal(state.oscillators,2);assert.ok(state.contexts.every(c=>c.state==='running'&&c.time>1));
+ const exceptions=c.events.filter(e=>e.method==='Runtime.exceptionThrown');assert.deepEqual(exceptions,[]);
+ const shot=await c.send('Page.captureScreenshot',{format:'png'});await Bun.write(dir+'/playback.png',Buffer.from(shot.data,'base64'));console.log('screenshot',dir+'/playback.png');
+ console.log('PASS: original Play button, changing pitches and two-part playback use running Web Audio outputs');
+}finally{await b.stop();}

package/test/manual-t-rex-runner.js

@@ -0,0 +1,49 @@
+#!/usr/bin/env bun
+// Real desktop game, ordinary CDP input only. No patches to game state/physics.
+// bun test/manual-t-rex-runner.js [buninu|chromium] [output-directory]
+import {resolve} from 'node:path';
+import {launch} from '../tools/browser-lab.js';
+const engine=process.argv[2]??'buninu',directory=resolve(process.argv[3]??`/tmp/t-rex-${engine}`);
+const app=await launch(engine,directory),cdp=app.cdp;
+const report={engine,url:'https://wayou.github.io/t-rex-runner/',states:[]};
+const state=()=>cdp.evaluate(`JSON.stringify({playing:Runner.instance_.playing,intro:Runner.instance_.playingIntro,crashed:Runner.instance_.crashed,time:Runner.instance_.runningTime,obstacles:Runner.instance_.horizon.obstacles.map(o=>({x:o.xPos,y:o.yPos,width:o.width,type:o.typeConfig.type})),score:Runner.instance_.distanceRan})`).then(JSON.parse);
+try{
+ await cdp.send('Emulation.setDeviceMetricsOverride',{width:900,height:600,deviceScaleFactor:1,mobile:false});
+ await cdp.send('Page.navigate',{url:report.url});
+ for(let n=0;n<200;n++){
+  if(await cdp.evaluate('typeof Runner!=="undefined"&&!!Runner.instance_?.tRex'))break;
+  await Bun.sleep(100);
+ }
+ const rect=await cdp.evaluate(`(()=>{const r=document.querySelector('canvas').getBoundingClientRect();return {x:r.x+r.width/2,y:r.y+r.height/2}})()`);
+ await cdp.send('Input.dispatchMouseEvent',{type:'mousePressed',button:'left',clickCount:1,...rect});
+ await cdp.send('Input.dispatchMouseEvent',{type:'mouseReleased',button:'left',clickCount:1,...rect});
+ await Bun.sleep(200);report.afterMouse=await state();
+ // Upstream desktop game does not start on a mouse click, including Chromium.
+ if(report.afterMouse.playing)throw Error('Desktop click unexpectedly started the game');
+ await cdp.send('Input.dispatchKeyEvent',{type:'rawKeyDown',key:' ',code:'Space',windowsVirtualKeyCode:32});
+ await Bun.sleep(100);
+ await cdp.send('Input.dispatchKeyEvent',{type:'keyUp',key:' ',code:'Space',windowsVirtualKeyCode:32});
+ let captured=false;
+ for(let n=0;n<200;n++){
+  await Bun.sleep(100);const s=await state();report.states.push(s);
+  if(!captured&&s.obstacles.some(o=>o.x>80&&o.x<500)){
+   const {data}=await cdp.send('Page.captureScreenshot',{format:'png'});
+   await Bun.write(directory+'/cactus.png',Buffer.from(data,'base64'));captured=true;
+  }
+  if(s.crashed)break;
+ }
+ report.final=await state();report.exceptions=cdp.events.filter(e=>e.method==='Runtime.exceptionThrown');
+ if(!captured||!report.final.crashed||report.final.intro||report.exceptions.length)throw Error('Expected visible moving cactus and a real collision');
+ const placement=()=>cdp.evaluate(`JSON.stringify((()=>{const r=Runner.instance_.containerEl.getBoundingClientRect();return {x:r.x,y:r.y,width:r.width,height:r.height,scrollY}})())`).then(JSON.parse);
+ report.beforeRestart=await placement();
+ await Bun.sleep(1000);
+ await cdp.send('Input.dispatchKeyEvent',{type:'rawKeyDown',key:' ',code:'Space',windowsVirtualKeyCode:32});
+ await Bun.sleep(100);
+ await cdp.send('Input.dispatchKeyEvent',{type:'keyUp',key:' ',code:'Space',windowsVirtualKeyCode:32});
+ await Bun.sleep(500);report.afterRestart=await placement();
+ report.restartState=await state();
+ if(JSON.stringify(report.beforeRestart)!==JSON.stringify(report.afterRestart)||!report.restartState.playing)throw Error('Restart moved the game or failed to start');
+ console.log(JSON.stringify({engine,passed:true,screenshot:directory+'/cactus.png',final:report.final,beforeRestart:report.beforeRestart,afterRestart:report.afterRestart}));
+}finally{
+ try{await Bun.write(directory+'/report.json',JSON.stringify(report,null,2));}finally{await app.stop();}
+}

package/test/manual-threejs-scene.js

@@ -0,0 +1,64 @@
+// Network integration check against the unchanged Three.js example. Not a CI
+// unit test: it needs the website and (optionally) local floor/wall images.
+// bun test/manual-threejs-scene.js [/path/to/3D素材] [/tmp/threejs-check]
+import assert from 'node:assert/strict';
+import {resolve,join} from 'node:path';
+import {launch} from '../tools/browser-lab.js';
+const assets=process.argv[2]&&resolve(process.argv[2]),out=resolve(process.argv[3]??'/tmp/buninu-threejs-check');
+const browser=await launch('buninu',out),c=browser.cdp;
+async function wait(expression){for(let i=0;i<300;i++){if(await c.evaluate(expression,180000))return;await Bun.sleep(100);}throw Error('Not ready: '+expression);}
+async function click(text){
+ const expression=`[...document.querySelectorAll('button')].find(b=>b.textContent.trim()===${JSON.stringify(text)})`;
+ await c.evaluate(`(${expression}).scrollIntoView({block:'center'})`);
+ const point=await c.evaluate(`(()=>{const r=(${expression}).getBoundingClientRect();return{x:r.x+r.width/2,y:r.y+r.height/2}})()`);
+ for(const type of['mousePressed','mouseReleased'])await c.send('Input.dispatchMouseEvent',{type,button:'left',clickCount:1,...point},180000);
+ console.log('clicked',text);
+}
+async function pick(names){
+ await wait('!!document.getElementById("path")');
+ // Exercise the same controller actions as the browser-owned chooser buttons.
+ const action=async value=>{await c.evaluate(`window.__fileAction=${JSON.stringify(value)}`);await c.send('Input.dispatchKeyEvent',{type:'keyDown',key:'Shift'});await c.send('Input.dispatchKeyEvent',{type:'keyUp',key:'Shift'});};
+ await action({kind:'browse',path:assets});
+ for(const name of names){const index=await c.evaluate(`[...document.querySelectorAll('.entry')].findIndex(e=>e.textContent.endsWith(${JSON.stringify(name)}))`);assert(index>=0,'missing '+name);await action({kind:'select',index});}
+ await action({kind:'open'});
+}
+try{
+ await c.send('Page.navigate',{url:'https://drjohnjstest.blogspot.com/2023/11/3dsbsthreejsdemo.html'});
+ await wait('typeof te!=="undefined"&&!!te.openo');
+ if(assets){
+  await c.evaluate('window.bgReady=false;te.selectbg().then(()=>window.bgReady=true);true');
+  await pick(['floor.jpg','wall.jpg']);await wait('window.bgReady&&te.floor.material.map.image.complete&&te.wallr.material.map.image.complete');
+ }
+ const initialCount=await c.evaluate('te.obj.length');
+ for(const name of['+人','+複製','+球','+立方']){
+  const count=await c.evaluate('te.obj.length');await click(name);assert.equal(await c.evaluate('te.obj.length'),count+1);
+ }
+ assert.equal(await c.evaluate('te.obj.filter(o=>o.type==="Group"&&o.children.length===7).length'),2);
+ const typing=click('+字');await wait('!!document.getElementById("answer")');await c.send('Page.handleJavaScriptDialog',{accept:true,promptText:'Hello 文字'});await typing;
+ assert.equal(await c.evaluate('te.obj.length'),initialCount+5);
+ const active=await c.evaluate('te.cv.active');await click('Next Element');assert.notEqual(await c.evaluate('te.cv.active'),active);await click('Previous Element');assert.equal(await c.evaluate('te.cv.active'),active);
+ const visible=await c.evaluate('te.ca.obj.visible');await click('Toggle');assert.equal(await c.evaluate('te.ca.obj.visible'),!visible);await click('Toggle');
+ await click('直向');assert.equal(await c.evaluate('getComputedStyle(te.cv).transform'),'none');await click('橫向');assert.equal(await c.evaluate('getComputedStyle(te.cv).transform'),'matrix(0, 1, -1, 0, 0, 0)');
+ await c.evaluate('te.cv.scrollIntoView()');const r=await c.evaluate('(()=>{const r=te.cv.getBoundingClientRect();return{x:r.x,y:r.y,width:r.width}})()');
+ const point=(x,y)=>({x:r.x+r.width-y,y:r.y+x});
+ const before=await c.evaluate('te.ca.obj.position.toArray()');
+ for(const [x,y]of[[150,30],[30,150],[270,150],[150,270]])for(const type of['mousePressed','mouseReleased'])await c.send('Input.dispatchMouseEvent',{type,button:'left',clickCount:1,...point(x,y)},180000);
+ assert.deepEqual(await c.evaluate('te.ca.obj.position.toArray()'),before);
+ const rotation=await c.evaluate('te.ca.obj.rotation.y');
+ await c.send('Input.dispatchMouseEvent',{type:'mousePressed',button:'left',buttons:1,...point(40,40)});
+ for(const x of[70,200])await c.send('Input.dispatchMouseEvent',{type:'mouseMoved',button:'none',buttons:1,...point(x,40)},180000);
+ await c.send('Input.dispatchMouseEvent',{type:'mouseReleased',button:'left',buttons:0,...point(200,40)},180000);assert.notEqual(await c.evaluate('te.ca.obj.rotation.y'),rotation);
+ if(assets&&await Bun.file(join(assets,'小凱L.png')).exists()&&await Bun.file(join(assets,'小凱R.png')).exists()){
+  const adding=click('+立體圖');await wait('!!document.getElementById("ok")');await c.send('Page.handleJavaScriptDialog',{accept:true});await adding;await pick(['小凱L.png','小凱R.png']);await wait('te.opensbs_success&&te.sbsl[0].obj.material.map.image.complete&&te.sbsr[0].obj.material.map.image.complete');
+ }
+ await c.evaluate('tdebug.value="window.smokeRun=123"');await click('Run');assert.equal(await c.evaluate('window.smokeRun'),123);
+ await click('→');await c.evaluate('tdebug.value="second slot"');await click('←');assert.equal(await c.evaluate('tdebug.value'),'window.smokeRun=123');await click('→');assert.equal(await c.evaluate('tdebug.value'),'second slot');
+ const clearing=click('Clear');await wait('!!document.getElementById("ok")');await c.send('Page.handleJavaScriptDialog',{accept:true});await clearing;assert.equal(await c.evaluate('tdebug.value'),'');
+ // Copy uses the existing browser clipboard bridge. Its non-destructive mocked
+ // host contract is covered separately; do not replace the user's clipboard.
+ await click('Open Console');await wait('typeof eruda!=="undefined"&&!!document.querySelector("#eruda")');
+ await c.evaluate('eruda.hide();te.cv.scrollIntoView();te.rd()');
+ const shot=await c.send('Page.captureScreenshot',{format:'png'},180000);await Bun.write(join(out,'scene.png'),Buffer.from(shot.data,'base64'));
+ assert.deepEqual(c.events.filter(e=>e.method==='Runtime.exceptionThrown'),[]);
+ console.log('PASS; screenshot:',join(out,'scene.png'));
+}finally{await browser.stop();}

package/test/manual-webgl-benchmark.js

@@ -0,0 +1,27 @@
+// Completed-frame timing, not merely asynchronous GPU command submission.
+// bun test/manual-webgl-benchmark.js buninu|chromium /path/to/3D素材 [/tmp/output]
+// Select a software Vulkan ICD externally for the Chromium CPU comparison.
+import{launch}from'../tools/browser-lab.js';
+import{resolve,join}from'node:path';
+const engine=process.argv[2]??'buninu',assets=process.argv[3];
+if(!assets)throw Error('Pass a directory containing floor.jpg and wall.jpg');
+const out=resolve(process.argv[4]??'/tmp/threejs-benchmark-'+engine);
+const b=await launch(engine,out,engine==='chromium'?['--use-gl=angle','--use-angle=vulkan','--disable-gpu-sandbox','--ignore-gpu-blocklist']:[]);
+try{
+ const c=b.cdp;await c.send('Page.navigate',{url:'https://drjohnjstest.blogspot.com/2023/11/3dsbsthreejsdemo.html'});
+ for(let i=0;i<300;i++){if(await c.evaluate('typeof te!=="undefined"&&!!te.openo'))break;await Bun.sleep(100);}
+ const images=await Promise.all(['floor.jpg','wall.jpg'].map(async name=>'data:image/jpeg;base64,'+(await Bun.file(join(assets,name)).bytes()).toBase64()));
+ await c.evaluate(`te.selectbg(${JSON.stringify(images[0])},${JSON.stringify(images[1])}).then(()=>true)`,180000);
+ for(let i=0;i<100;i++){if(await c.evaluate('te.floor.material.map.image.complete&&te.wallr.material.map.image.complete'))break;await Bun.sleep(50);}
+ const result=await c.evaluate(`(()=>{
+  const contexts=[te.renderer.getContext(),te.renderer2.getContext()],pixel=new Uint8Array(4);
+  const fence=()=>{for(const gl of contexts){gl.finish();if(gl.readPixels)gl.readPixels(0,0,1,1,gl.RGBA,gl.UNSIGNED_BYTE,pixel);}};
+  let start=performance.now();te.add('man');te.rd();fence();const preparationMs=performance.now()-start,frames=[];
+  for(let i=0;i<30;i++){start=performance.now();te.obj[0].position.x=6.1*i;te.rd();fence();frames.push(performance.now()-start);}
+  return {preparationMs,frames,canvas:[te.cv.width,te.cv.height],errors:contexts.map(g=>g.getError())};
+ })()`,300000);
+ const sorted=result.frames.slice(3).sort((a,b)=>a-b),median=sorted[Math.floor(sorted.length/2)],p95=sorted[Math.floor(sorted.length*.95)];
+ const report={engine,...result,medianMs:median,medianFps:1000/median,p95Ms:p95,p95Fps:1000/p95};
+ await Bun.write(join(out,'timing.json'),JSON.stringify(report,null,2));console.log(JSON.stringify(report,null,2));
+ await c.evaluate('te.cv.scrollIntoView()');const shot=await c.send('Page.captureScreenshot',{format:'png'},180000);await Bun.write(join(out,'scene.png'),Buffer.from(shot.data,'base64'));
+}finally{await b.stop();}

package/test/manual-webgl-cpu.html

@@ -0,0 +1,26 @@
+<!doctype html><meta charset="utf-8"><title>CPU WebGL triangle</title>
+<style>body{background:#222;color:white}canvas{border:1px solid white}</style>
+<h1>CPU WebGL / CanvasKit</h1><p>Click left/right to move. Drag horizontally to rotate.</p><canvas draggable="true" width="320" height="240"></canvas><pre id="result"></pre>
+<script>
+const canvas=document.querySelector('canvas'),gl=canvas.getContext('webgl');
+function compile(type,source){const s=gl.createShader(type);gl.shaderSource(s,source);gl.compileShader(s);if(!gl.getShaderParameter(s,gl.COMPILE_STATUS))throw Error(gl.getShaderInfoLog(s));return s;}
+try{
+ const p=gl.createProgram();
+ gl.attachShader(p,compile(gl.VERTEX_SHADER,'attribute vec3 position; uniform float dx; uniform float angle; varying vec3 color; void main(){color=position*0.5+0.5;vec2 p=mat2(cos(angle),sin(angle),-sin(angle),cos(angle))*position.xy;gl_Position=vec4(p+vec2(dx,0.0),position.z,1.0);}'));
+ gl.attachShader(p,compile(gl.FRAGMENT_SHADER,'precision highp float; varying vec3 color;void main(){gl_FragColor=vec4(color,1.0);}'));
+ gl.linkProgram(p);gl.useProgram(p);
+ const b=gl.createBuffer();gl.bindBuffer(gl.ARRAY_BUFFER,b);gl.bufferData(gl.ARRAY_BUFFER,new Float32Array([-.8,-.8,0,.8,-.8,0,0,.8,0]),gl.STATIC_DRAW);
+ const a=gl.getAttribLocation(p,'position');gl.enableVertexAttribArray(a);gl.vertexAttribPointer(a,3,gl.FLOAT,false,0,0);
+ let dx=0,angle=0,start=0;
+ const offset=gl.getUniformLocation(p,'dx'),rotation=gl.getUniformLocation(p,'angle');
+ function draw(){
+   gl.uniform1f(offset,dx);gl.uniform1f(rotation,angle);
+   gl.clearColor(.05,.1,.15,1);gl.clear(gl.COLOR_BUFFER_BIT|gl.DEPTH_BUFFER_BIT);gl.drawArrays(gl.TRIANGLES,0,3);
+   document.querySelector('pre').textContent=`offset=${dx.toFixed(2)} angle=${angle.toFixed(2)} error=${gl.getError()}`;
+ }
+ canvas.onclick=e=>{dx+=e.offsetX<canvas.clientWidth/2?-.1:.1;draw();};
+ canvas.ondragstart=e=>{start=e.offsetX;e.dataTransfer.setData('text/plain','rotate');};
+ canvas.ondragend=e=>{angle+=(e.offsetX-start)/100;draw();};
+ draw();
+}catch(e){document.querySelector('pre').textContent=e.stack;}
+</script>

package/test/media-audio-lifetime.test.js

@@ -0,0 +1,8 @@
+import {expect,test} from 'bun:test';
+
+test('completed audio releases bounded decoders while preserving metadata, replay and background playback',async()=>{
+  const child=Bun.spawn([process.execPath,new URL('./fixtures/media-audio-lifetime.js',import.meta.url).pathname],{stdout:'pipe',stderr:'pipe'});
+  const [out,error,code]=await Promise.all([new Response(child.stdout).text(),new Response(child.stderr).text(),child.exited]);
+  expect({code,error}).toEqual({code:0,error:''});
+  expect(out).toContain('audio decoder lifetime integration passed');
+},15000);

package/test/mp4-frame-times.test.js

@@ -0,0 +1,33 @@
+import {test,expect} from 'bun:test';
+import {mp4FrameTimes,timeVideoDecoder} from '../lib/media/mp4-frame-times.js';
+const words=(...ns)=>{const b=new Uint8Array(ns.length*4),v=new DataView(b.buffer);ns.forEach((n,i)=>v.setUint32(i*4,n));return b};
+const box=(name,...parts)=>{const body=Buffer.concat(parts),head=Buffer.alloc(8);head.writeUInt32BE(body.length+8);head.write(name,4);return Buffer.concat([head,body])};
+function movie(){return box('moov',box('trak',box('mdia',
+ box('hdlr',words(0,0,0x76696465)),box('mdhd',words(0,0,0,1000)),
+ box('minf',box('stbl',box('stts',words(0,3,1,50,1,100,2,25)),box('stss',words(0,2,1,3)))))))}
+test('MP4 variable-rate frames use sample times rather than average FPS',()=>{
+ const t=mp4FrameTimes(movie());expect([...t.frames]).toEqual([0,.05,.15,.175]);expect(t.end).toBe(.2);
+ let seek;const decoder=timeVideoDecoder({width:2,height:2,fps:20,nextFrame:()=>new Uint8Array(16),seek:ms=>seek=ms,close(){}},movie());
+ decoder.nextFrame();expect(decoder.frameTime).toBe(0);expect(decoder.nextFrameTime).toBe(.05);
+ decoder.nextFrame();expect(decoder.frameTime).toBe(.05);expect(decoder.nextFrameTime).toBe(.15);
+ decoder.seek(160);expect(seek).toBe(160);decoder.nextFrame();expect(decoder.frameTime).toBe(.15);
+});
+test('unsupported or truncated containers retain the original decoder',()=>{
+ const decoder={};for(const data of [new Uint8Array(),movie().subarray(0,20),box('free',words(0))]){
+ expect(mp4FrameTimes(data)).toBeNull();expect(timeVideoDecoder(decoder,data)).toBe(decoder);
+ }
+});
+
+test('composition offsets and an edit map reordered samples onto presentation time',()=>{
+ const data=box('moov',box('trak',
+  box('edts',box('elst',words(0,1,200,50,65536))),
+  box('mdia',box('hdlr',words(0,0,0x76696465)),box('mdhd',words(0,0,0,1000)),
+   box('minf',box('stbl',box('stts',words(0,1,4,50)),
+    box('ctts',words(0,4,1,50,1,100,1,0,1,50)),box('stss',words(0,1,1)))))));
+ const t=mp4FrameTimes(data);expect([...t.frames]).toEqual([0,.05,.1,.15]);expect(t.end).toBe(.2);
+});
+test('a progressive mdat does not hide already complete sample timing tables',()=>{
+ const head=movie(),payload=box('mdat',new Uint8Array(1000));
+ const t=mp4FrameTimes(Buffer.concat([head,payload.subarray(0,16)]));
+ expect([...t.frames]).toEqual([0,.05,.15,.175]);
+});

package/test/page-scripts.test.js

@@ -1,5 +1,6 @@
 import { afterAll, beforeAll, expect, test } from "bun:test";
 import { RendererHost } from "../lib/renderer/host.js";
+import { supportsFrameCheckpoint } from "../lib/renderer/animation-frames.js";
 
 /**
  * Page JavaScript runs in a real renderer process (seccomp + SES lockdown),
@@ -1221,6 +1222,22 @@ test("import methods keep their names and receivers alongside real dynamic impor
   expect(await evaluate("dynamicImportNames")).toEqual([42, true, "module:e"]);
 });
 
+test("dynamic module imports preserve grouped specifiers after property rewriting", async () => {
+  scripts.set("https://page.test/grouped-dependency.js", "export const answer=42;");
+  scripts.set("https://page.test/grouped-main.js", `
+    let reads=0;
+    const entry={get module(){reads++;return './grouped-dependency.js'}};
+    const a=await import(entry.module);
+    const b=await import((entry.module));
+    const c=await import /* comment */ (((entry.module)));
+    const d=await import /* comment */ ('./grouped-dependency.js');
+    window.groupedImports=[a.answer,a===b,b===c,c===d,reads];
+  `);
+  await load('<script type="module" src="./grouped-main.js"></script>');
+  await waitFor("typeof groupedImports !== 'undefined'");
+  expect(await evaluate("groupedImports")).toEqual([42,true,true,true,3]);
+});
+
 test("ES modules: graphs, live exports, JSON, import.meta, dynamic import, TLA, cycles, import maps", async () => {
   const base = "https://page.test/modules/";
   scripts.set(`${base}math.js`, `
@@ -1724,7 +1741,9 @@ test("a video starts from a prefix while the rest of the file is still downloadi
   await evaluate("document.getElementById('v').play()");
   expect(dripFinished).toBe(false);
   expect(await evaluate(`(() => { const v = document.getElementById('v');
-    return !v.paused && v.readyState >= 1 && v.currentTime > 0 && v.networkState === 2; })()`)).toBe(true);
+    // The first presented frame has timestamp zero; wall time alone
+    // must not advance a silent video before its next picture.
+    return !v.paused && v.readyState >= 1 && v.videoWidth > 0 && v.currentTime >= 0 && v.networkState === 2; })()`)).toBe(true);
   const deadline = Date.now() + 4000;
   while (!dripFinished && Date.now() < deadline) await Bun.sleep(50);
   expect(dripFinished).toBe(true);
@@ -2304,3 +2323,79 @@ test("NodeIterator validates nullable callback-interface filters at creation", a
     return JSON.stringify(results);
   })()`)).toBe(JSON.stringify([...Array(8).fill('TypeError'),...Array(5).fill(true)]));
 });
+
+
+test("mouse offsets use target padding edges and CSS pixels, including bubbling and canvas scaling", async () => {
+  await load(`<body style="margin:0"><div id="parent"><canvas id="cv" width="1200" height="1200"
+    style="position:absolute;left:40px;top:30px;width:300px;height:300px;border:5px solid;padding:10px"></canvas></div>
+    <script>
+      window.offsets=[];
+      cv.onclick=e=>{window.lastMouse=e;offsets.push([e.offsetX,e.offsetY]);};
+      document.getElementById('parent').addEventListener('click',e=>offsets.push([e.offsetX,e.offsetY]));
+    </script>`);
+  await renderer.call("click", 75, 85);
+  expect(await evaluate("offsets")).toEqual([[30,50],[30,50]]);
+  expect(await evaluate("[lastMouse.offsetX,lastMouse.offsetY]")).toEqual([75,85]);
+  expect(await evaluate("(()=>{const e=new MouseEvent('click',{clientX:12,clientY:14});return [e.offsetX,e.offsetY]})()")).toEqual([12,14]);
+});
+
+(supportsFrameCheckpoint() ? test : test.skip)("classic script cleanup drains promise jobs before restoring currentScript", async () => {
+  await load(`<script id="outer">
+    var checkpointLog = [];
+    const nested = document.createElement('script');
+    nested.id = 'nested';
+    nested.textContent = "checkpointLog.push(document.currentScript.id); Promise.resolve().then(() => checkpointLog.push(document.currentScript?.id ?? null));";
+    document.head.appendChild(nested);
+    checkpointLog.push('after nested');
+    Promise.resolve().then(() => Promise.resolve().then(() => checkpointLog.push(document.currentScript?.id ?? null)));
+    setTimeout(() => checkpointLog.push(document.currentScript?.id ?? null), 0);
+  </script>`);
+  await Bun.sleep(50);
+  expect(await evaluate('checkpointLog')).toEqual(['nested', 'after nested', 'outer', 'outer', null]);
+  expect(await evaluate('document.currentScript')).toBeNull();
+});
+
+test('primitive and literal extension methods stay page-local without exposing host capabilities',async()=>{
+ await load(`<script>
+ Number.prototype.pageClamp=function(a,b){return Math.max(a,Math.min(b,this));};
+ Number.prototype.strictReceiver=function(){'use strict';return [typeof this,this];};
+ String.prototype.pageSuffix=function(){return this+'!';};
+ Boolean.prototype.pageToggle=function(){return !this.valueOf();};
+ Array.prototype.pageDrop=function(){return this.pop();};
+ Function.prototype.pageInvoke=function(...args){return this.apply(null,args);};
+ </script><script>
+ window.primitiveResults=[(300).pageClamp(0,255),(-1)['pageClamp'](0,255),'test'.pageSuffix(),true.pageToggle(),[4,5].pageDrop(),(x=>x+1).pageInvoke(3),(2).strictReceiver(),(1).constructor===Number,'a'.constructor===String];
+ window.keyReads=0;const key={[Symbol.toPrimitive](){keyReads++;return 'pageClamp'}};
+ primitiveResults.push((5)[key](1,3),keyReads,eval("(3).pageClamp(0,2)"),Object(1) instanceof Number,new Number(1) instanceof Number);
+ window.escapeResults=[typeof Bun,typeof process,typeof require,Function('return typeof Bun')(),Function('return typeof process')(),(async()=>{}).constructor('return typeof Bun')() instanceof Promise];
+ window.sharedFrozen=[Object.isFrozen(Object.getPrototypeOf(function(){})),Object.isFrozen(Object.getPrototypeOf([]))];
+ </script>`);
+ expect(JSON.parse(await evaluate('JSON.stringify(primitiveResults)'))).toEqual([255,0,'test!',false,5,4,['number',2],true,true,3,1,2,true,true]);
+ expect(JSON.parse(await evaluate('JSON.stringify(escapeResults)'))).toEqual(['undefined','undefined','undefined','undefined','undefined',true]);
+ expect(JSON.parse(await evaluate('JSON.stringify(sharedFrozen)'))).toEqual([true,true]);
+ // A navigation reuses the renderer but must not retain any of these extensions.
+ await load('<script>window.clean=[typeof (1).pageClamp,typeof "a".pageSuffix,typeof true.pageToggle,typeof [].pageDrop,typeof (function(){}).pageInvoke,typeof Bun,typeof process];</script>');
+ expect(JSON.parse(await evaluate('JSON.stringify(clean)'))).toEqual(Array(7).fill('undefined'));
+});
+
+test('CanvasRenderingContext2D has a page-local prototype for feature detection and method extensions',async()=>{
+ await load('<canvas id="surface" width="20" height="20"></canvas>');
+ expect(await evaluate(`(()=>{
+  const ctx=document.getElementById('surface').getContext('2d');
+  CanvasRenderingContext2D.prototype.redBox=function(){this.fillStyle='red';this.fillRect(0,0,20,20)};
+  ctx.redBox();
+  return [ctx instanceof CanvasRenderingContext2D,Object.getPrototypeOf(ctx)===CanvasRenderingContext2D.prototype,typeof CanvasRenderingContext2D.prototype.roundRect,ctx.getImageData(5,5,1,1).data[0]].join(',');
+ })()`)).toBe('true,true,function,255');
+ await load('<canvas id="surface"></canvas>');
+ expect(await evaluate('typeof CanvasRenderingContext2D.prototype.redBox')).toBe('undefined');
+});
+
+test('decoded video dimensions invalidate retained intrinsic layout without a DOM mutation',async()=>{
+ await load('<video id="intrinsicVideo" src="/video.mp4"></video><div id="afterVideo">after</div>');
+ const before=await evaluate('intrinsicVideo.getBoundingClientRect().width');
+ expect(before).toBe(300);
+ await evaluate('intrinsicVideo.play().then(()=>intrinsicVideo.pause())');
+ const size=await evaluate(`(()=>{const r=intrinsicVideo.getBoundingClientRect();return [intrinsicVideo.videoWidth,intrinsicVideo.videoHeight,r.width,r.height]})()`);
+ expect(size[0]).toBeGreaterThan(0);expect(size[1]).toBeGreaterThan(0);
+ expect(size[2]).toBe(size[0]);expect(size[3]).toBe(size[1]);
+});

package/test/piano-input.test.js

@@ -14,7 +14,9 @@ test("CDP raw keydown uses the physical key even with an empty text field", () =
   expect(notes.at(-1)).toBe(38);
   expect(handlePianoInput(input, { key: " ", code: "Space", text: " ", repeat: true }, play)).toBe(true);
   expect(notes).toHaveLength(4);
-  expect(handlePianoInput(input, { key: "Tab", code: "Tab", text: "" }, play)).toBe(false);
+  expect(handlePianoInput(input, { key: "Tab", code: "Tab", text: "" }, play)).toBe(true);
+  expect(notes.at(-1)).toBe(47);
+  expect(handlePianoInput(input, { key: "Shift", code: "ShiftRight", text: "" }, play)).toBe(false);
 });
 
 test("piano consumes batched terminal/IME text and plays every mapped note", () => {
@@ -32,10 +34,21 @@ test("piano consumes repeats without retriggering and supports shifted physical
   expect(handlePianoInput(input, { key: "J", code: "KeyJ", modifiers: 8 }, play)).toBe(true);
   expect(handlePianoInput(input, { key: "j", modifiers: 2 }, play)).toBe(true);
   expect(notes).toEqual([71]);
-  expect(handlePianoInput(input, { key: "Tab" }, play)).toBe(false);
+  expect(handlePianoInput(input, { key: "Alt", code: "AltLeft", modifiers: 1 }, play)).toBe(false);
   expect(handlePianoInput(input, { key: "Backspace" }, play)).toBe(false);
 });
 
+test("left-hand control keys and AltGr play even while reporting their own modifier", () => {
+  const notes = [];
+  const play = n => notes.push(n);
+  for (const [key, code] of [["Escape", "Escape"], ["`", "Backquote"], ["Tab", "Tab"], ["CapsLock", "CapsLock"]])
+    expect(handlePianoInput(input, { key, code }, play)).toBe(true);
+  expect(handlePianoInput(input, { key: "Shift", code: "ShiftLeft", modifiers: 8 }, play)).toBe(true);
+  expect(handlePianoInput(input, { key: "AltGraph", code: "AltRight", modifiers: 3 }, play)).toBe(true);
+  expect(handlePianoInput(input, { key: "Alt", code: "AltRight", modifiers: 1 }, play)).toBe(true);
+  expect(notes).toEqual([35, 42, 47, 50, 54, 64, 64]);
+});
+
 test("ordinary, disabled and readonly editors are unaffected", () => {
   expect(handlePianoInput({ getAttribute: () => "editor" }, { text: "jk" })).toBe(false);
   expect(handlePianoInput({ ...input, disabled: true }, { text: "jk" })).toBe(false);

package/test/piano.test.js

@@ -2,7 +2,7 @@ import { test, expect } from "bun:test";
 import { PIANO_KEYS, PIANO_DO, pianoNote, pianoTone, PianoMixer } from "../lib/audio/piano.js";
 
 test("piano keyboard mapping is editable in one table", () => {
-  expect(Object.keys(PIANO_KEYS)).toHaveLength(61);
+  expect(Object.keys(PIANO_KEYS)).toHaveLength(66);
   expect(PIANO_DO).toBe(69);
   expect(PIANO_KEYS[" "]).toBe(60);
   expect(pianoNote(" ")).toBe(69);
@@ -16,7 +16,16 @@ test("piano keyboard mapping is editable in one table", () => {
   expect(pianoNote("/", "Slash")).toBe(71);
   expect(pianoNote("Unidentified", "KeyJ")).toBe(71);
   expect(pianoNote("!", "Digit1")).toBe(45);
-  expect(pianoNote("Escape")).toBeNull();
+  expect(pianoNote("Escape", "Escape")).toBe(35);
+  expect(pianoNote("`", "Backquote")).toBe(42);
+  expect(pianoNote("Tab", "Tab")).toBe(47);
+  expect(pianoNote("CapsLock", "CapsLock")).toBe(50);
+  expect(pianoNote("Shift", "ShiftLeft")).toBe(54);
+  expect(pianoNote("Shift", "ShiftRight")).toBeNull();
+  expect(pianoNote("Alt", "AltRight")).toBe(64);
+  expect(pianoNote("AltGraph")).toBe(64);
+  expect(pianoNote("Alt", "AltLeft")).toBeNull();
+  expect(pianoNote("Backspace")).toBeNull();
 });
 
 test("piano tone is 48 kHz mono PCM with a nonzero, decaying sound", () => {

package/test/playback-buffer.test.js

@@ -29,3 +29,14 @@ test("short clips drain and piano stays interactive", () => {
   expect(piano.request(0, 0, 0, 120)).toBe(120);
   expect(piano.request(0, 120, 0, 120)).toBe(0);
 });
+
+
+test('live synthesis prepares a small reserve while server credits are delayed, without startup gating',()=>{
+ const live=new PlaybackBuffer(1000,2,.12,.12);
+ expect(live.ready(20,0,false)).toBe(true);
+ expect(live.request(0,0,0,0)).toBe(120);
+ expect(live.request(0,120,0,0)).toBe(0);
+ expect(live.request(20,0,40,0)).toBe(60);
+ expect(live.request(20,60,40,0)).toBe(0);
+ expect(live.request(0,0,200,0)).toBe(0);
+});