buninu-browser 0.6.0 → 0.9.0

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);
+});

package/test/pointer-drag.test.js

@@ -102,3 +102,36 @@ test('pointer bursts preserve drawing points while batching raster work',async()
  const [exit,stderr]=await Promise.all([child.exited,new Response(child.stderr).text()]);
  expect(stderr).toBe('');expect(exit).toBe(0);
 },15000);
+
+test('HTML draggable canvas emits offsets, protected text data and dragend without a click',async()=>{
+ const b=await createBrowser({spareRenderer:false}),server=CdpServer.create(b.context).listen(0),c=new CDP(`ws://127.0.0.1:${server.port}/devtools/browser/cdp-server`);
+ try{
+  await c.send('Page.navigate',{url:'data:text/html,'+encodeURIComponent(`<body style="margin:0"><canvas id="cv" draggable="true" width="300" height="300"></canvas><script>
+  window.events=[];window.cancelDrag=false;
+  cv.ondragstart=e=>{events.push([e.type,e.offsetX,e.offsetY,e instanceof DragEvent]);e.dataTransfer.setData('text/plain','drag');if(cancelDrag)e.preventDefault()};
+  cv.ondragover=e=>{events.push([e.type,e.dataTransfer.getData('text/plain')]);e.preventDefault()};
+  cv.ondrop=e=>events.push([e.type,e.dataTransfer.getData('text/plain')]);
+  cv.ondragend=e=>events.push([e.type,e.offsetX,e.offsetY]);
+  cv.onclick=()=>events.push(['click']);</script>`)});
+  const send=(type,x,y)=>c.send('Input.dispatchMouseEvent',{type,x,y,button:'left',clickCount:1});
+  await send('mousePressed',30,40);await send('mouseMoved',160,170);await send('mouseReleased',160,170);
+  expect(await c.evaluate('events')).toEqual([['dragstart',30,40,true],['dragover',''],['drop','drag'],['dragend',160,170]]);
+  await c.evaluate('events=[];cancelDrag=true');
+  await send('mousePressed',30,40);await send('mouseMoved',160,170);await send('mouseReleased',160,170);
+  expect((await c.evaluate('events')).some(e=>e[0]==='dragend')).toBe(false);
+  await c.evaluate('events=[];cancelDrag=false');
+  await send('mousePressed',30,40);await send('mouseMoved',160,170);
+  await c.send('Input.dispatchKeyEvent',{type:'keyDown',key:'Escape',code:'Escape',windowsVirtualKeyCode:27});
+  expect((await c.evaluate('events')).map(e=>e[0])).toEqual(['dragstart','dragover','dragend']);
+ }finally{c.close();server.stop(true);b.close()}
+},30000);
+
+test('CSS rotation transforms painting bounds and inversely maps pointer offsets',async()=>{
+ const b=await createBrowser({spareRenderer:false}),server=CdpServer.create(b.context).listen(0),c=new CDP(`ws://127.0.0.1:${server.port}/devtools/browser/cdp-server`);
+ try{
+  await c.send('Page.navigate',{url:'data:text/html,'+encodeURIComponent(`<style>body{margin:0}canvas{position:absolute;left:100px;top:100px;width:200px;height:100px;transform:rotate(90deg)}</style><canvas id="cv"></canvas><script>window.clicks=[];cv.onclick=e=>clicks.push([e.offsetX,e.offsetY]);</script>`)});
+  const r=await c.evaluate('cv.getBoundingClientRect().toJSON()');expect(r.left).toBeCloseTo(150);expect(r.top).toBeCloseTo(50);expect(r.width).toBeCloseTo(100);expect(r.height).toBeCloseTo(200);
+  for(const type of ['mousePressed','mouseReleased'])await c.send('Input.dispatchMouseEvent',{type,x:175,y:90,button:'left',clickCount:1});
+  const hits=await c.evaluate('clicks');expect(hits.length).toBe(1);expect(hits[0][0]).toBeCloseTo(40);expect(hits[0][1]).toBeCloseTo(75);
+ }finally{c.close();server.stop(true);b.close()}
+},30000);

package/test/positioning.test.js

@@ -237,3 +237,85 @@ test("an svg without width and height fills its container and keeps its viewBox'
   expect(run("#sized")).toMatchObject({ width: 10, height: 5 });
   expect(run("#bare")).toMatchObject({ width: 24, height: 150 });
 });
+
+test("aspect-ratio sizes bottom-anchored controls and centers a percentage-width grid child", () => {
+  const { box } = render(`<div class="stage"><div class="pad"><div class="knob"></div></div><button class="fire">!</button></div>`,
+    `* { box-sizing:border-box } .stage { position:relative; width:400px; height:300px }
+     .pad { position:absolute; left:20px; bottom:20px; width:150px; aspect-ratio:1; border:2px solid; display:grid; place-items:center }
+     .knob { width:42%; aspect-ratio:1 }
+     .fire { position:absolute; right:20px; bottom:20px; width:100px; aspect-ratio:1; border:2px solid; padding:4px }`);
+  expect(box('.pad')).toEqual({ x:20, y:130, width:150, height:150 });
+  expect(box('.knob').width).toBeCloseTo(61.32);
+  expect(box('.knob').height).toBeCloseTo(61.32);
+  expect(box('.knob').x).toBeCloseTo(64.34);
+  expect(box('.knob').y).toBeCloseTo(174.34);
+  expect(box('.fire')).toEqual({ x:280, y:180, width:100, height:100 });
+});
+
+test("aspect-ratio respects box-sizing, definite dimensions and height constraints", () => {
+  const { box } = render(`<div id="content"></div><div id="border"></div><div id="height"></div>
+    <div id="both"></div><div id="clamped"><div id="percent"></div></div>`,
+    `#content,#border { width:100px; aspect-ratio:2; padding:10px; border:2px solid }
+     #border { box-sizing:border-box }
+     #height { height:40px; aspect-ratio:2 }
+     #both { width:100px; height:30px; aspect-ratio:1 }
+     #clamped { width:100px; aspect-ratio:1; max-height:40px }
+     #percent { height:50% }`);
+  expect(box('#content')).toMatchObject({ width:124, height:74 });
+  expect(box('#border')).toMatchObject({ width:100, height:50 });
+  expect(box('#height')).toMatchObject({ width:80, height:40 });
+  expect(box('#both')).toMatchObject({ width:100, height:30 });
+  expect(box('#clamped').height).toBe(40);
+  expect(box('#percent').height).toBe(20);
+});
+
+test("grid normal alignment preserves an item's preferred ratio while explicit stretch can override it", () => {
+  const { box } = render(`<div class="grid"><div id="normal"></div></div><div class="grid"><div id="stretch"></div></div>`,
+    `.grid { display:grid; width:100px; height:200px } .grid>div { width:100px; aspect-ratio:1 }
+     #stretch { align-self:stretch }`);
+  expect(box('#normal')).toMatchObject({ width:100, height:100 });
+  expect(box('#stretch')).toMatchObject({ width:100, height:200 });
+});
+
+test("aspect-ratio preserves the automatic content minimum unless min-height allows overflow", () => {
+  const { box } = render(`<div class="ratio" id="auto"><div></div></div><div class="ratio" id="zero"><div></div></div>`,
+    `.ratio { width:100px; aspect-ratio:2 } .ratio>div { height:80px } #zero { min-height:0 }`);
+  expect(box('#auto').height).toBe(80);
+  expect(box('#zero').height).toBe(50);
+});
+
+test("replaced elements use an explicit aspect-ratio or their natural ratio with auto", () => {
+  const { box } = render(`<canvas id="override" width="200" height="100"></canvas>
+    <canvas id="natural" width="200" height="100"></canvas><canvas id="degenerate" width="200" height="100"></canvas>`,
+    `canvas { display:block; width:80px } #override { aspect-ratio:1 } #natural { aspect-ratio:auto 1 } #degenerate { aspect-ratio:0 / 1 }`);
+  expect(box('#override')).toMatchObject({ width:80, height:80 });
+  expect(box('#natural')).toMatchObject({ width:80, height:40 });
+  expect(box('#degenerate')).toMatchObject({ width:80, height:40 });
+});
+
+test('absolute left/right and explicit width resolve auto margins before CSS transforms',()=>{
+ const {box}=render('<div class="both"></div><div class="left"></div><div class="right"></div><div class="large"></div>',`
+  .both,.left,.right,.large{position:absolute;left:10px;right:30px;width:100px;height:20px}
+  .both{margin:0 auto}.left{margin-left:auto;margin-right:20px}.right{margin-left:20px;margin-right:auto}
+  .large{width:500px;margin:0 auto}
+ `);
+ expect(box('.both').x).toBe(140);
+ expect(box('.left').x).toBe(250);
+ expect(box('.right').x).toBe(30);
+ expect(box('.large').x).toBe(10);
+});
+
+test('backface-hidden card faces respect preserve-3d rotations and remain correct after a flip',()=>{
+ for(const flipped of [false,true]){
+  const {layout,tree}=render('<div class="card"><div class="back">back</div><div class="front">front</div></div>',`
+   .card{position:relative;width:100px;height:100px;transform-style:preserve-3d;${flipped?'transform:rotateY(180deg)':''}}
+   .back,.front{position:absolute;inset:0;backface-visibility:hidden}
+   .back{background:blue}.front{background:red;transform:rotateY(180deg)}
+  `);
+  const list=buildDisplayList(layout,tree);
+  const colors=list.items.filter(item=>item.op==='fillRect').map(item=>item.color);
+  expect(colors).toContain(flipped?'rgba(255, 0, 0, 1)':'rgba(0, 0, 255, 1)');
+  expect(colors).not.toContain(flipped?'rgba(0, 0, 255, 1)':'rgba(255, 0, 0, 1)');
+  expect(list.items.filter(item=>item.op==='drawText').map(item=>item.text)).toEqual([flipped?'front':'back']);
+ }
+});

package/test/pulse-client.test.js

@@ -223,7 +223,7 @@ test("measured device progress governs the media clock and bounded audio queue t
 // Keep the real connection/open/close path, but drive only the playback
 // intervals with a virtual monotonic clock. Latency responses are controlled
 // at the client boundary; the test above covers their wire representation.
-async function playbackTimers(run) {
+async function playbackTimers(run, {credit = 1e7} = {}) {
   const { createServer } = await import("node:net");
   const server = createServer(socket => {
     let input = Buffer.alloc(0);
@@ -235,7 +235,7 @@ async function playbackTimers(run) {
         input = input.subarray(20 + length);
         if (channel !== 0xffffffff) continue;
         const command = body.readUInt32BE(1), tag = body.readUInt32BE(6);
-        const extra = command === 3 ? [0x4c, ...u32(1), 0x4c, ...u32(1), 0x4c, ...u32(1e7)] : [];
+        const extra = command === 3 ? [0x4c, ...u32(1), 0x4c, ...u32(1), 0x4c, ...u32(credit)] : [];
         const reply = Buffer.from([0x4c, ...u32(2), 0x4c, ...u32(tag), ...extra]);
         socket.write(Buffer.concat([header(reply.length, 0xffffffff), reply]));
       }
@@ -384,3 +384,52 @@ test("timing rejection permits a retry and a late rejection after kill stays sil
     expect(times).toEqual([]);
   });
 });
+
+test('live audio adapts to slow renderer replies with a bounded live reserve and device queue',async()=>{
+  await playbackTimers(async({client,sent,advance})=>{
+    const requests=[];
+    client.playbackTiming=()=>({writeIndex:0,readIndex:0,sinkSeconds:0,playing:false});
+    const stream=await client.openPlayback({rate:500,channels:1,leadSeconds:.12,adaptiveLead:true,
+      onRequest:bytes=>requests.push(bytes),onTiming:()=>{}});
+    // Even a renderer that has not replied gets only a bounded live request.
+    expect(requests.reduce((a,b)=>a+b,0)).toBeLessThanOrEqual(320);
+    await advance(250);
+    stream.write(new Uint8Array(1000));
+    const total=()=>sent.reduce((a,p)=>a+p.bytes,0);
+    expect(total()).toBe(350); // 250 ms observed response + 100 ms headroom
+    await advance(2000);
+    expect(total()).toBe(350); // stale playback clock cannot flood the sink
+    expect(requests.reduce((a,b)=>a+b,0)).toBeLessThanOrEqual(500);
+    stream.kill();expect(stream.queued).toBe(0);
+    sent.length=0;
+    const slow=await client.openPlayback({rate:500,channels:1,leadSeconds:.12,adaptiveLead:true,
+      onRequest:()=>{},onTiming:()=>{}});
+    await advance(1500);slow.write(new Uint8Array(2000));
+    expect(total()).toBe(500); // even extreme stalls stop at half a second
+    slow.kill();sent.length=0;
+    const fast=await client.openPlayback({rate:500,channels:1,leadSeconds:.12,adaptiveLead:true,
+      onRequest:()=>{},onTiming:()=>{}});
+    fast.write(new Uint8Array(1000));expect(total()).toBe(120);
+    fast.kill();
+  });
+});
+
+
+test('live synthesis prepares PCM even after server credits are exhausted',async()=>{
+ await playbackTimers(async({client,sent,advance})=>{
+  const requests=[];
+  client.playbackTiming=()=>({writeIndex:100,readIndex:100,sinkSeconds:0,playing:false});
+  const stream=await client.openPlayback({rate:500,channels:1,leadSeconds:.12,adaptiveLead:true,
+   onRequest:bytes=>requests.push(bytes),onTiming:()=>{}});
+  expect(requests).toEqual([320]);
+  stream.write(new Uint8Array(320));
+  expect(sent.reduce((n,p)=>n+p.bytes,0)).toBe(100);
+  await advance(50);
+  // No new server credits, but device consumption leaves room for the live
+  // producer to refill its reserve before those credits eventually arrive.
+  expect(requests).toEqual([320,100]);
+  await advance(200);
+  expect(requests).toEqual([320,100]); // outstanding demand is not duplicated
+  stream.kill();
+ },{credit:100});
+});

package/test/raster-readback.test.js

@@ -38,3 +38,17 @@ test("raster readback reuses native scratch while published shared frames stay i
   }
   expect(releases).toBe(allocations);
 });
+
+test('partial raster readback patches an immutable previous frame and rejects invalid regions',async()=>{
+ const {CanvasKit:kit}=await loadGraphics();const surface=kit.MakeSurface(8,6);
+ const capture=new RasterReadback(kit,{shared:true});
+ const read=options=>{const image=surface.makeImageSnapshot();try{return capture.read(image,8,6,options)}finally{image.delete()}};
+ try{
+  surface.getCanvas().clear(kit.Color(255,0,0,1));const first=read(),saved=first.slice();
+  const paint=new kit.Paint();try{paint.setColor(kit.Color(0,0,255,0.5));paint.setBlendMode(kit.BlendMode.Src);surface.getCanvas().drawRect(kit.XYWHRect(2,1,3,2),paint)}finally{paint.delete()}
+  const full=read(),partial=read({previous:first,region:{x:2,y:1,width:3,height:2}});
+  expect(partial).toEqual(full);expect(first).toEqual(saved);expect(partial.buffer).not.toBe(first.buffer);
+  for(const region of [{x:-1,y:0,width:2,height:2},{x:0,y:0,width:0,height:2},{x:7,y:0,width:2,height:2},{x:0.5,y:0,width:2,height:2}])
+   expect(read({previous:first,region})).toEqual(full);
+ }finally{capture.dispose();surface.dispose()}
+});

package/test/script-rewrite.test.js

@@ -1,7 +1,7 @@
 import { expect, test } from "bun:test";
 import {
-  escapeSesHtmlComments, prepareDirectEvalSource, restoreSourceText, rewriteClassicScript, rewriteConstructorReads,
-  referenceHelper, rewriteClassicScriptSource, rewriteDirectEval,
+  escapeSesHtmlComments, prepareDirectEvalSource, restoreSourceText, rewriteClassicScript, rewriteMemberReads, rewriteConstructorReads,
+  referenceHelper, rewriteClassicScriptSource, rewriteModuleSource, rewriteDirectEval,
 } from "../lib/renderer/script-rewrite.js";
 
 // The comment each constructor rewrite leaves for restoreSourceText.
@@ -134,7 +134,7 @@ test("the classic-script pipeline parses once when earlier rewrites change nothi
     "return 1;",
   ];
   for (const source of sources) {
-    const stepwise = rewriteClassicScript(rewriteConstructorReads(rewriteDirectEval(source).code).code);
+    const stepwise = rewriteClassicScript(rewriteMemberReads(rewriteConstructorReads(rewriteDirectEval(source).code).code).code);
     expect(rewriteClassicScriptSource(source)).toEqual(stepwise);
   }
   const direct = rewriteDirectEval("var s = 'eval(1)';");
@@ -169,3 +169,61 @@ test("global variable reads go through the script's global binding, keeping thei
   // A block-level function outside functions (Annex B) leaves the script's identifiers as written.
   expect(rewriteClassicScript("{ function b() {} } b(Q);").code).not.toContain("$buninu$g");
 });
+
+test('global-read rewrites preserve automatic semicolons and original function source', () => {
+  const source = `function convert() {
+    let a = input.value
+    output.value = a
+    if (a) output.extra = input.value
+    output.done = true
+    for (let i=0;i<1;i++) output.count = i
+    return
+    output.unreachable = true
+  }`;
+  const rewritten = rewriteClassicScriptSource(source);
+  const g = {input:{value:'text'},output:{},$buninu$self:x=>x,$buninu$member:(o,k,c)=>c&&typeof o[k]==='function'?o[k].bind(o):o[k]};
+  g.$buninu$ref = referenceHelper(g);
+  Function('globalThis', 'input', 'output', '$buninu$member', `let convert; ${rewritten.code}; globalThis.convert=convert;`)(g,g.input,g.output,g.$buninu$member);
+  g.convert();
+  expect(g.output).toEqual({value:'text',extra:'text',done:true,count:0});
+  expect(restoreSourceText(g.convert.toString())).toBe(source);
+});
+
+test('member adaptation preserves source, call order, computed keys, parentheses and assignment patterns',()=>{
+ const samples=[
+  'function f(a){return(a.x).y(a.z)}',
+  'function f(a){return a /* property comment */ .\\u0062(a[/* index comment */ a.key])}',
+  'function f(a){return(a,b).x}',
+  'function f(a){return new (a.Ctor)(a.x)}',
+  'function f(a){return a[a.key](a.x)}',
+  'function f(a){({x:a.x=2,...a.rest}=a.source);[a.y]=a.values;return a.x}',
+  'function f(a){a.x++;delete a.x;for(a.x of a.values){};return a?.x}',
+  'class C extends B{#x=1;f(){return super.f(this.#x)}}',
+ ];
+ for(const source of samples){const result=rewriteMemberReads(source);expect(restoreSourceText(result.code)).toBe(source);expect(()=>Function('$buninu$member','B',result.code)).not.toThrow();}
+ const calls=[];
+ const receiver={get fn(){calls.push('get');return function(x){calls.push(this===receiver?'this':'wrong');return x;};}};
+ const key={ [Symbol.toPrimitive](hint){calls.push(hint);return 'fn';}};
+ const read=(o,k,call)=>{const f=o[k];return call?(...args)=>Reflect.apply(f,o,args):f;};
+ const source='return receiver[key]((calls.push("arg"),42))';
+ expect(Function('$buninu$member','receiver','key','calls',rewriteMemberReads(source.replace('return ','')).code.replace(/^/,'return '))(read,receiver,key,calls)).toBe(42);
+ expect(calls).toEqual(['string','get','arg','this']);
+});
+
+test('member adaptation preserves ASI before reparsing local calls in scripts and modules',()=>{
+ const source=`function local($) {
+  var diff = (7-2)
+  $('box').css('value',diff)
+  var receiver = {value:3}
+  receiver.read = function(){return this.value}
+  return receiver.read()
+ }`;
+ for(const rewrite of [rewriteMemberReads,source=>({code:rewriteModuleSource(source)})]){
+  const code=rewrite(source).code;
+  const values=[],$=()=>({css:(key,value)=>values.push([key,value])});
+  const member=(object,key,call)=>call&&typeof object[key]==='function'?object[key].bind(object):object[key];
+  const fn=Function('$buninu$member',`${code}; return local;`)(member);
+  expect(fn($)).toBe(3);expect(values).toEqual([['value',5]]);
+  expect(restoreSourceText(fn.toString())).toBe(source);
+ }
+});

package/test/video-slow-end.test.js

@@ -0,0 +1,6 @@
+import {test,expect} from 'bun:test';
+test('silent video waits for a slow decoder and retains its final frame',async()=>{
+ const child=Bun.spawn([process.execPath,new URL('./fixtures/video-slow-end.js',import.meta.url).pathname],{stdout:'pipe',stderr:'pipe'});
+ const [out,err,code]=await Promise.all([new Response(child.stdout).text(),new Response(child.stderr).text(),child.exited]);
+ expect({code,err}).toEqual({code:0,err:''});expect(out).toContain('slow video end integration passed');
+},15000);

package/test/viewport-keyboard-overflow.test.js

@@ -0,0 +1,25 @@
+import {test,expect} from 'bun:test';
+import {createBrowser} from '../lib/headless-shell.js';
+
+test('root/body overflow blocks keyboard scrolling without blocking script scrolling for hidden overflow',async()=>{
+ const browser=await createBrowser({spareRenderer:false}),ctx=browser.context;
+ try{
+  await ctx.resize(400,300);
+  for(const rule of ['body{overflow:hidden}','html{overflow:hidden}','html{overflow:clip}','body{overflow-y:hidden}']){
+   await ctx.navigate('data:text/html,'+encodeURIComponent(`<style>body{margin:0}${rule}</style><div style="height:1500px">content</div>`));
+   for(const key of [' ','ArrowDown','PageDown','End']){
+    await ctx.press(key);expect(await ctx.evaluate('scrollY')).toBe(0);
+   }
+   if(!rule.includes('clip')){
+    await ctx.evaluate('scrollTo(0,100)');expect(await ctx.evaluate('scrollY')).toBe(100);
+    await ctx.press('Home');expect(await ctx.evaluate('scrollY')).toBe(100);
+   }
+  }
+  await ctx.navigate('data:text/html,'+encodeURIComponent('<style>body{margin:0}</style><div style="height:1500px">content</div>'));
+  await ctx.press(' ');expect(await ctx.evaluate('scrollY')).toBeGreaterThan(0);
+  await ctx.evaluate('scrollTo(0,0); document.body.style.overflow="hidden"');
+  await ctx.press(' ');expect(await ctx.evaluate('scrollY')).toBe(0);
+  await ctx.evaluate('document.body.style.overflow="auto"');
+  await ctx.press(' ');expect(await ctx.evaluate('scrollY')).toBeGreaterThan(0);
+ }finally{browser.close();}
+},30000);

package/test/wayland-win32-resources.test.js

@@ -0,0 +1,47 @@
+import {test,expect} from 'bun:test';
+import {mkdtempSync,rmSync} from 'node:fs';
+import {tmpdir} from 'node:os';
+import {join} from 'node:path';
+const windows=process.platform==='win32';
+test.skipIf(!windows)('Windows mapping shares pixels between independent Bun processes',async()=>{
+ const r=await import('../frontends/wayland/win32-resources.js');
+ const fd=r.createMapping(16),held=r.sendResource(fd);
+ let child;
+ try{
+  expect(held.descriptor.name).toMatch(/^Local\\buninu-wayland-/);
+  r.writeResource(fd,Buffer.from([1,2,3,4]),0,4,0);
+  const module=new URL('../frontends/wayland/win32-resources.js',import.meta.url).href;
+  child=Bun.spawn([process.execPath,'-e',`
+   const r=await import(${JSON.stringify(module)}),fd=r.receiveResource(JSON.parse(Bun.argv.at(-1)));
+   try{const b=Buffer.alloc(4);r.readResource(fd,b,0,4,0);if(b[0]!==1)throw Error('wrong pixels');
+    r.writeResource(fd,Buffer.from([9,8,7,6]),0,4,0);
+   }finally{r.closeResource(fd)}
+  `,JSON.stringify(held.descriptor)],{stdout:'pipe',stderr:'pipe'});
+  const timer=setTimeout(()=>child.kill(),15000);
+  try{const error=await new Response(child.stderr).text();expect({code:await child.exited,error}).toEqual({code:0,error:''})}finally{clearTimeout(timer)}
+  const b=Buffer.alloc(4);r.readResource(fd,b,0,4,0);expect([...b]).toEqual([9,8,7,6]);
+ }finally{child?.kill();held.release();r.closeResource(fd)}
+},20000);
+test.skipIf(!windows)('Windows pipe resource preserves pending reads and EOF across FD transfer',async()=>{
+ const r=await import('../frontends/wayland/win32-resources.js'),fds=new Int32Array(2);r.libc.pipe2(fds);
+ const held=r.sendResource(fds[1]);r.closeResource(fds[1]);const remote=r.receiveResource(held.descriptor);held.release();
+ try{
+  const b=Buffer.alloc(32);expect(()=>r.readResource(fds[0],b)).toThrow('pending');
+  r.writeResource(remote,Buffer.from('中文 clipboard'));r.closeResource(remote);
+  const n=r.readResource(fds[0],b);expect(b.subarray(0,n).toString()).toBe('中文 clipboard');expect(r.readResource(fds[0],b)).toBe(0);
+ }finally{r.closeResource(remote);r.closeResource(fds[0])}
+});
+test.skipIf(!windows)('Windows ordinary socket delivers a named mapping with resource ACK',async()=>{
+ const r=await import('../frontends/wayland/win32-resources.js');
+ const {MappingConnection}=await import('../frontends/wayland/win32-wire.js');
+ const {connectUnix}=await import('../frontends/wayland/transport.js');
+ const dir=mkdtempSync(join(tmpdir(),'wayland-mapping-')),path=join(dir,'wayland-buninu');
+ let server,client,peer;const fd=r.createMapping(4);
+ try{
+  r.writeResource(fd,Buffer.from([12,34,56,78]),0,4,0);
+  server=Bun.listen({unix:path,socket:{open(s){peer=new MappingConnection(r);s.data=peer;peer.attach(s);peer.onData=()=>{const b=Buffer.alloc(4);const received=peer.fds.shift();try{r.readResource(received,b)}finally{r.closeResource(received)}peer.send(b)}},data:(s,b)=>s.data.receive(b),drain:s=>s.data.flush(),close:s=>s.data.close()}});
+  client=connectUnix(path);client.send(Buffer.from('commit'),[fd]);
+  const deadline=Date.now()+5000;while(client.input.length<4&&Date.now()<deadline)await Bun.sleep(10);
+  expect([...client.input]).toEqual([12,34,56,78]);expect(client.pending.size).toBe(0);
+ }finally{client?.close();peer?.close();server?.stop(true);r.closeResource(fd);rmSync(dir,{recursive:true,force:true})}
+});