buninu-browser 0.2.2 → 0.2.4

package/test/page-scripts.test.js

@@ -226,6 +226,69 @@ test("direct eval preserves receivers of lexical calls and tagged templates", as
   ]);
 });
 
+test("pointer movement delivers trusted mouse events to page controls", async () => {
+  await load(`<div id="control" style="width:100px;height:100px;background:red"></div><script>
+    window.moves = [];
+    for (const type of ['mouseenter','mousemove','mouseleave']) {
+      document.querySelector('#control').addEventListener(type, e => moves.push([e.type,e.isTrusted]));
+    }
+  </script>`);
+  await renderer.call('move', 30, 30);
+  await renderer.call('move', 150, 150);
+  expect(await evaluate('moves')).toEqual([['mouseenter',true],['mousemove',true],['mouseleave',true]]);
+});
+
+test("assigning element.style forwards to cssText without replacing its identity", async () => {
+  await load(`<div id="target"></div><script>
+    const target = document.querySelector('#target'), original = target.style;
+    target.style = 'width: 73px; color: red';
+    window.styleResult = [target.style === original, target.style.width, target.style.color];
+    target.style = '';
+    styleResult.push(target.style.cssText);
+  </script>`);
+  expect(JSON.parse(await evaluate("JSON.stringify(styleResult)"))).toEqual([true, '73px', 'red', '']);
+});
+
+test("History methods borrowed from an iframe operate on the receiving history", async () => {
+  await load(`<iframe></iframe><script>
+    const frame = document.querySelector('iframe').contentWindow;
+    frame.History.prototype.replaceState.call(history, { step: 1 }, '', '/watch?v=example');
+    frame.History.prototype.pushState.call(history, { step: 2 }, '', '#comments');
+    window.historyResult = [location.href, history.state.step, history.length, frame.location.href];
+    try { frame.History.prototype.replaceState.call(history, {}, '', 'https://other.test/'); }
+    catch (e) { window.historyOriginError = e.name; }
+  </script>`);
+  expect(JSON.parse(await evaluate("JSON.stringify(historyResult)"))).toEqual([
+    'https://page.test/watch?v=example#comments', 2, 2, 'about:blank',
+  ]);
+  expect(await evaluate("historyOriginError")).toBe('SecurityError');
+});
+
+test("custom elements receive observed attribute reactions and can enable deferred initialization", async () => {
+  await load(`<script>
+    window.reactions = [];
+    window.observedReads = 0;
+    class DeferredPanel extends HTMLElement {
+      static get observedAttributes() { observedReads++; return ['disable-upgrade']; }
+      attributeChangedCallback(name, before, after) {
+        reactions.push([name, before, after, this === document.querySelector('deferred-panel')]);
+        if (after === null) this.textContent = 'ready';
+      }
+    }
+    customElements.define('deferred-panel', DeferredPanel);
+    const panel = document.createElement('deferred-panel');
+    document.body.appendChild(panel);
+    panel.setAttribute('disable-upgrade', '');
+    panel.setAttribute('unobserved', 'value');
+    panel.removeAttribute('disable-upgrade');
+  </script>`);
+  expect(JSON.parse(await evaluate("JSON.stringify(reactions)"))).toEqual([
+    ['disable-upgrade', null, '', true], ['disable-upgrade', '', null, true],
+  ]);
+  expect(await evaluate("observedReads")).toBe(1);
+  expect(await evaluate("document.querySelector('deferred-panel').textContent")).toBe('ready');
+});
+
 test("documents and shadow roots have adoptedStyleSheets, which page patches of Element.prototype may extend", async () => {
   await load(`<div id="host"></div><script>
     // As a popover polyfill does: every new shadow root adopts its sheet.
@@ -354,6 +417,24 @@ test("form.elements is a live named collection of form controls", async () => {
   expect(await evaluate("document.getElementById('form').elements.length")).toBe(3);
 });
 
+test("uncommitted links do not change the base used by subsequent fragment links", async () => {
+  for (const href of ["/archive.zip", "/LICENSE"]) {
+    for (const scripted of [false, true]) {
+      await load(`<a id="away" href="${href}">away</a><a id="toc" href="#contents">TOC</a>
+        <h2 id="contents">Contents</h2>`);
+      const before = await evaluate("[document.URL, document.baseURI, location.href, document.getElementById('toc').href]");
+      if (scripted) await evaluate("document.getElementById('away').click()");
+      else {
+        const point = await evaluate("(() => { const r=document.getElementById('away').getBoundingClientRect(); return [r.x+r.width/2,r.y+r.height/2]; })()");
+        expect(await renderer.call("click", ...point)).toBe(`https://page.test${href}`);
+      }
+      expect(await evaluate("[document.URL, document.baseURI, location.href, document.getElementById('toc').href]")).toEqual(before);
+      await evaluate("document.getElementById('toc').click()");
+      expect(await evaluate("[location.href, document.URL, document.baseURI]")).toEqual(Array(3).fill("https://page.test/#contents"));
+    }
+  }
+});
+
 test("constructable CSSStyleSheet supports feature checks and basic rule mutation", async () => {
   await load(`<p>cssom</p>`);
   expect(await evaluate(`(async () => {
@@ -391,6 +472,23 @@ test("document.elementFromPoint finds the topmost element painted there", async
     document.elementFromPoint(300, 30)?.id, document.elementFromPoint(-1, 5)]`)).toEqual(["text", "over", "under", null]);
 });
 
+test("rounded overflow clips a child's pixels rather than only the parent's background", async () => {
+  await load('<div style="width:40px;height:40px;border-radius:20px;overflow:hidden"><div style="width:40px;height:40px;background:red"></div></div>');
+  const clipped = await renderer.call("screenshot");
+  const { default: init } = await import('../usr/lib/canvaskit/canvaskit.js');
+  const kit = await init({ locateFile: name => new URL(`../usr/lib/canvaskit/${name}`, import.meta.url).pathname });
+  const image = kit.MakeImageFromEncoded(Buffer.from(clipped, 'base64'));
+  try {
+    const pixel = (x, y) => Array.from(image.readPixels(x, y, {
+      width:1, height:1, colorType:kit.ColorType.RGBA_8888, alphaType:kit.AlphaType.Unpremul, colorSpace:kit.ColorSpace.SRGB,
+    })).slice(0, 3);
+    expect(pixel(0, 0)).toEqual([255, 255, 255]);
+    expect(pixel(20, 20)).toEqual([255, 0, 0]);
+  } finally { image.delete(); }
+  await load('<div style="width:40px;height:40px;background:red"></div>');
+  expect(await renderer.call("screenshot")).not.toBe(clipped);
+});
+
 test("scripts change the DOM and the next screenshot shows it", async () => {
   await load(`<div id="box" style="height:20px"></div>
     <script>document.getElementById('box').style.background = 'rgb(255, 0, 0)';
@@ -577,6 +675,40 @@ test("CSS.escape produces selectors for leading digits and punctuation", async (
   expect(await evaluate("CSS.escape('1:a')")).toBe("\\31 \\:a");
 });
 
+test("legacy keyboard shortcuts cancel space scrolling on every press", async () => {
+  await load(`<div tabindex="0" id="player" style="height:100px"></div><div style="height:2000px"></div>
+    <script>var keys=[],player=document.getElementById('player');player.focus();player.addEventListener('keydown',e=>{
+      keys.push([e.key,e.code,e.keyCode,e.which,e.isTrusted]);if(e.keyCode===32)e.preventDefault();
+    });</script>`);
+  for (let i=0;i<6;i++) await renderer.call('press',' ',{code:'Space',windowsVirtualKeyCode:32});
+  expect(await evaluate('keys')).toEqual(Array.from({length:6},()=>[' ','Space',32,32,true]));
+  expect(await renderer.call('scrollOffset')).toEqual({x:0,y:0});
+  await evaluate('player.blur()');
+  await renderer.call('press',' ',{code:'Space'});
+  expect((await renderer.call('scrollOffset')).y).toBeGreaterThan(0);
+});
+
+test("site media controls can repeatedly toggle using playing/pause events and legacy space keys", async () => {
+  await load(`<div id="player" tabindex="0" style="height:100px"><video id="v" src="/long-video.mp4" style="width:100px;height:80px"></video></div><div style="height:2000px"></div>
+    <script>var state='paused',events=[],player=document.getElementById('player'),v=document.getElementById('v');
+    for(const type of ['play','playing','pause'])v.addEventListener(type,()=>{events.push(type);if(type!=='play')state=type;});
+    function toggle(){if(state==='playing')v.pause();else v.play();}
+    player.addEventListener('click',toggle);
+    player.addEventListener('keydown',e=>{if(e.keyCode===32){e.preventDefault();toggle();}});
+    player.focus();</script>`);
+  for (const input of ['click','press']) {
+    for(let i=0;i<6;i++) {
+      if(input==='click')await renderer.call('click',40,40);
+      else await renderer.call('press',' ',{code:'Space'});
+      const expected=i%2===0?'playing':'pause';
+      expect(await waitFor(`state===${JSON.stringify(expected)}`,5000)).toBe(true);
+      expect(await evaluate('v.paused')).toBe(i%2===1);
+    }
+  }
+  expect(await renderer.call('scrollOffset')).toEqual({x:0,y:0});
+  expect(await evaluate('events.slice(0,3)')).toEqual(['play','playing','pause']);
+});
+
 test("a video plays frames and pauses when clicked", async () => {
   await load(`<video src="/long-video.mp4" controls width="160" height="120"></video>`);
   const bounds = await evaluate("document.querySelector('video').getBoundingClientRect().toJSON()");
@@ -1084,7 +1216,7 @@ test("ES modules: graphs, live exports, JSON, import.meta, dynamic import, TLA,
   await load(`
     <script type="importmap">{ "imports": { "cdn-lib": "https://cdn.test/lib/index.js" } }</script>
     <script type="module" src="/modules/main.js"></script>
-    <script type="module">window.inlineModule = import.meta.url.includes('#inline-module');</script>`);
+    <script type="module">window.inlineModule = import.meta.url === document.baseURI;</script>`);
   expect(await evaluate("moduleResult")).toBe([
     // Imports are live bindings, named and namespace alike.
     "named:2", "namespace:2", "twice:42", "json:42", "loaded lazily from lazy.js",
@@ -1707,7 +1839,8 @@ test("initial MSE playback waits briefly for a separate audio segment", async ()
   await load(`<video id="v" width="160" height="120"></video>`);
   await evaluate(`(() => {
     const video = document.getElementById("v");
-    video.addEventListener("play", () => { window.startedAt = performance.now(); });
+    // play is the unpause request; playing is when buffered media can advance.
+    video.addEventListener("playing", () => { window.startedAt = performance.now(); }, { once:true });
     const source = new MediaSource();
     video.src = URL.createObjectURL(source);
     source.addEventListener("sourceopen", async () => {
@@ -1861,6 +1994,31 @@ test("a click inside an iframe goes to the element under it in the frame's docum
   expect(await evaluate(`document.getElementById("frame").contentWindow.clicked`)).toEqual([[20, 20]]);
 });
 
+test("dynamic linked stylesheets fire load after their rules become available", async () => {
+  await load(`<div id="target"></div><script>
+    window.sheetLoaded = false;
+    const link = document.createElement('link');
+    link.rel = 'stylesheet';
+    link.href = '/slow.css';
+    link.onload = () => { window.sheetLoaded = getComputedStyle(document.body).color; };
+    document.head.appendChild(link);
+  </script>`);
+  for (let i = 0; i < 60 && await evaluate('sheetLoaded') === false; i++) await Bun.sleep(25);
+  expect(await evaluate('sheetLoaded')).toBe('rgba(255, 0, 0, 1)');
+});
+
+test("decoded dynamic images report natural dimensions and fire load", async () => {
+  await load(`<script>
+    window.imageLoaded = false;
+    const img = document.createElement('img');
+    img.onload = () => { window.imageLoaded = [img.complete, img.naturalWidth, img.naturalHeight]; };
+    img.src = '/red-2x3.png';
+    document.body.appendChild(img);
+  </script>`);
+  for (let i = 0; i < 60 && await evaluate('imageLoaded') === false; i++) await Bun.sleep(25);
+  expect(await evaluate('imageLoaded')).toEqual([true, 2, 3]);
+});
+
 test("images a script inserts and measures at once still load", async () => {
   await load(`<div id="host"></div><script>
     const img = document.createElement("img");

package/test/paint-frame.test.js

@@ -0,0 +1,103 @@
+import { expect, test } from 'bun:test';
+import { cropViewport, encodeImage, encodeImageBase64 } from '../lib/paint/frame.js';
+import { FrameCaptureCache } from '../lib/paint/frame-cache.js';
+import { appendParagraphText } from '../lib/paint/paragraph-text.js';
+
+function numberedTile() {
+  const bytes = new Uint8Array(7 + 3 * 4 * 4);
+  const pixels = bytes.subarray(7);
+  for (let i = 0; i < 12; i++) pixels.set([i + 1, 20, 30, 255], i * 4);
+  return { pixels, pixelWidth: 3, pixelHeight: 4, x: 0, y: 10, width: 3, height: 4, scale: 1,
+    background: [99, 0, 0, 128] };
+}
+const reds = (pixels) => Array.from({ length: pixels.length / 4 }, (_, i) => pixels[i * 4]);
+
+test('full-width viewport crops reuse immutable tile bytes and respect the source byte offset', () => {
+  const tile = numberedTile();
+  const result = cropViewport(tile, 0, 11, 3, 2);
+  expect(result.pixels.buffer).toBe(tile.pixels.buffer);
+  expect(reds(result.pixels)).toEqual([4, 5, 6, 7, 8, 9]);
+  expect(result.width).toBe(3);
+  expect(result.height).toBe(2);
+  expect(reds(cropViewport(tile, 0, 10, 3, 4).pixels)).toEqual(reds(tile.pixels));
+});
+
+test('partial crops preserve columns, background alpha, and scaled outside rows', () => {
+  const tile = numberedTile();
+  expect(reds(cropViewport(tile, 1, 11, 2, 2).pixels)).toEqual([5, 6, 8, 9]);
+  const clipped = cropViewport(tile, -1, 9, 4, 3);
+  expect(reds(clipped.pixels)).toEqual([99, 99, 99, 99, 99, 1, 2, 3, 99, 4, 5, 6]);
+  expect([...clipped.pixels.subarray(0, 4)]).toEqual([99, 0, 0, 128]);
+  const scaled = { ...tile, scale: 2, width: 1.5, height: 2 };
+  expect(reds(cropViewport(scaled, 0.5, 10.5, 1, 1).pixels)).toEqual([5, 6, 8, 9]);
+});
+
+test('native base64 capture preserves PNG and JPEG bytes', async () => {
+  const tile = numberedTile();
+  for (const format of ['png', 'jpeg', 'webp']) {
+    const bytes = await encodeImage(tile.pixels, 3, 4, { format, quality: 85 });
+    const base64 = await encodeImageBase64(tile.pixels, 3, 4, { format, quality: 85 });
+    expect(Buffer.from(base64, 'base64')).toEqual(Buffer.from(bytes));
+  }
+});
+
+test('encoding releases only its temporary bytes on success and failure', async () => {
+  const pixels = new Uint8Array([5, 10, 15, 255]);
+  const expected = [...pixels];
+  const encoded = await encodeImage(pixels, 1, 1);
+  expect(encoded.byteLength).toBeGreaterThan(0);
+  expect([...pixels]).toEqual(expected);
+  await expect(encodeImage(pixels, 100, 100)).rejects.toThrow();
+  expect([...pixels]).toEqual(expected);
+  expect((await new Bun.Image(encoded).metadata()).width).toBe(1);
+});
+
+test('simultaneous captures share work and an older completion cannot replace the latest frame', async () => {
+  const cache = new FrameCaptureCache();
+  let completeOld;
+  let captures = 0;
+  const first = cache.get('old', () => { captures++; return new Promise(resolve => { completeOld = resolve; }); });
+  expect(cache.get('old', () => { captures++; })).toBe(first);
+  expect(captures).toBe(1);
+  const second = cache.get('new', () => 'new frame');
+  expect(await second).toBe('new frame');
+  completeOld('old frame');
+  expect(await first).toBe('old frame');
+  expect(cache.get('new', () => { throw new Error('must retain new'); })).toBe(second);
+});
+
+test('capture failures allow retry without discarding a newer frame', async () => {
+  const cache = new FrameCaptureCache();
+  await expect(cache.get('bad', () => { throw new Error('encode failed'); })).rejects.toThrow('encode failed');
+  expect(await cache.get('bad', () => 'retry')).toBe('retry');
+  let fail;
+  const pending = cache.get('old', () => new Promise((_, reject) => { fail = reject; }));
+  const next = cache.get('new', () => 'new');
+  fail(new Error('old failed'));
+  await expect(pending).rejects.toThrow('old failed');
+  expect(cache.get('new', () => 'wrong')).toBe(next);
+});
+
+function textRuns(text) {
+  let emoji = false;
+  const runs = [];
+  appendParagraphText({
+    addText: text => runs.push({ text, emoji }),
+    pushStyle: () => { emoji = true; },
+    pop: () => { emoji = false; },
+  }, text, () => ({}));
+  return runs;
+}
+
+test('paragraphs batch ordinary text while preserving whole emoji graphemes and fallback boundaries', () => {
+  const ordinary = 'Latin office العربية हिन्दी 中文 e\u0301 ';
+  expect(textRuns(ordinary)).toEqual([{ text: ordinary, emoji: false }]);
+  expect(textRuns('')).toEqual([{ text: ' ', emoji: false }]);
+  const emojis = ['👨‍👩‍👧‍👦', '❤️', '🇹🇼', '1️⃣', '👍🏽'];
+  const mixed = `${ordinary}${emojis.join(' + ')} end`;
+  const runs = textRuns(mixed);
+  expect(runs.map(run => run.text).join('')).toBe(mixed);
+  expect(runs.filter(run => run.emoji).map(run => run.text)).toEqual(emojis);
+  expect(runs[0].text).toBe(ordinary);
+  expect(runs.at(-1)).toEqual({ text: ' end', emoji: false });
+});

package/test/paint-paragraph-cache.test.js

@@ -0,0 +1,87 @@
+import { expect, test } from "bun:test";
+import { createPageRenderer, loadGraphics } from "../lib/renderer/page-renderer.js";
+
+test("scroll paints reuse shaped text, evict bounded resources, and release paragraphs on navigation/disposal", async () => {
+  const { CanvasKit } = await loadGraphics();
+  const original = CanvasKit.ParagraphBuilder.MakeFromFontCollection;
+  let built = 0;
+  let alive = 0;
+  CanvasKit.ParagraphBuilder.MakeFromFontCollection = (...args) => {
+    const builder = original(...args);
+    const build = builder.build.bind(builder);
+    builder.build = () => {
+      const paragraph = build();
+      const dispose = paragraph.delete.bind(paragraph);
+      built++;
+      alive++;
+      paragraph.delete = () => { alive--; dispose(); };
+      return paragraph;
+    };
+    return builder;
+  };
+  let renderer;
+  try {
+    renderer = await createPageRenderer({ fetchResource: async url => ({ ok: false, status: 404, url, body: new Uint8Array() }) });
+    renderer.resize(400, 200, 1);
+    await renderer.loadDocument({ url: "https://paint.test/", status: 200, contentType: "text/html",
+      source: `<!doctype html><style>body { margin:0 } p { margin:0; height:30px }</style>${
+        Array.from({ length: 400 }, (_, i) => `<p>Article number ${i}: shared text</p>`).join("")}` });
+    await renderer.whenLoaded();
+    const first = await renderer.screenshot();
+    const before = built;
+    renderer.scroll(0, 1);
+    await renderer.screenshot();
+    // No layout invalidation and the same seven visible paragraph items.
+    expect(built - before).toBeLessThanOrEqual(1);
+    renderer.scroll(0, -1);
+    expect(await renderer.screenshot()).toBe(first);
+    // A fresh layout/display list still uses identical text shaping inputs.
+    const beforeLayout = built;
+    renderer.resize(400, 201, 1);
+    await renderer.screenshot();
+    expect(built - beforeLayout).toBeLessThanOrEqual(1);
+    renderer.resize(400, 200, 1);
+    expect(await renderer.screenshot()).toBe(first);
+
+    for (let i = 0; i < 40; i++) renderer.scroll(0, 250);
+    expect(alive).toBeGreaterThan(0);
+    expect(alive).toBeLessThanOrEqual(256);
+    renderer.resize(400, 200, 2);
+    const zoomed = await renderer.screenshot();
+    expect((await new Bun.Image(Buffer.from(zoomed, "base64")).metadata()).width).toBe(800);
+    await renderer.loadDocument({ url: "https://paint.test/empty", status: 200, contentType: "text/html", source: "<!doctype html><body></body>" });
+    await renderer.whenLoaded();
+    expect(alive).toBe(0);
+  } finally {
+    renderer?.dispose();
+    CanvasKit.ParagraphBuilder.MakeFromFontCollection = original;
+  }
+  expect(alive).toBe(0);
+});
+
+test("screenshot encoding options are honored and separated in the frame cache", async () => {
+  const { CanvasKit: kit } = await loadGraphics();
+  const renderer = await createPageRenderer({});
+  const images = [];
+  try {
+    renderer.resize(400, 200, 1);
+    await renderer.loadDocument({ url: "https://capture.test/", contentType: "text/html",
+      source: "<body style='margin:0;color:#256;background:#def'><h1>Frame format cache</h1><p>Lossless PNG and JPEG capture</p>" });
+    await renderer.whenLoaded();
+    const png = await renderer.screenshot();
+    const jpeg = await renderer.screenshot({ format: "jpeg", quality: 85 });
+    expect((await new Bun.Image(Buffer.from(jpeg, "base64")).metadata()).format).toBe("jpeg");
+    const fast = await renderer.screenshot({ optimizeForSpeed: true });
+    const pixelBytes = value => {
+      const image = kit.MakeImageFromEncoded(Buffer.from(value, "base64"));
+      images.push(image);
+      return image.readPixels(0, 0, { width: 400, height: 200, colorType: kit.ColorType.RGBA_8888,
+        alphaType: kit.AlphaType.Unpremul, colorSpace: kit.ColorSpace.SRGB });
+    };
+    expect(pixelBytes(fast)).toEqual(pixelBytes(png));
+    expect(await renderer.screenshot()).toBe(png);
+  } finally {
+    for (const image of images) image.delete();
+    renderer.dispose();
+  }
+});

package/test/piano-input.test.js

@@ -0,0 +1,44 @@
+import { test, expect } from "bun:test";
+import { handlePianoInput } from "../lib/renderer/piano-input.js";
+
+const input = { getAttribute: () => "buninu-piano-input" };
+
+test("CDP raw keydown uses the physical key even with an empty text field", () => {
+  const notes = [];
+  const play = n => notes.push(n);
+  for (let i = 0; i < 3; i++) {
+    expect(handlePianoInput(input, { key: " ", code: "Space", text: "", modifiers: 0, repeat: false }, play)).toBe(true);
+  }
+  expect(notes).toEqual([69, 69, 69]);
+  expect(handlePianoInput(input, { key: "F1", code: "F1", text: "" }, play)).toBe(true);
+  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);
+});
+
+test("piano consumes batched terminal/IME text and plays every mapped note", () => {
+  const notes = [];
+  expect(handlePianoInput(input, { text: "jk L!中" }, n => notes.push(n))).toBe(true);
+  expect(notes).toEqual([71, 73, 69, 74, 45]);
+  expect(handlePianoInput(input, { text: "jk" }, null)).toBe(true);
+});
+
+test("piano consumes repeats without retriggering and supports shifted physical keys", () => {
+  const notes = [];
+  const play = n => notes.push(n);
+  expect(handlePianoInput(input, { key: "j", repeat: true }, play)).toBe(true);
+  expect(handlePianoInput(input, { key: " ", repeat: true }, play)).toBe(true);
+  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: "Backspace" }, play)).toBe(false);
+});
+
+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);
+  expect(handlePianoInput({ ...input, readOnly: true }, { text: "jk" })).toBe(false);
+  expect(handlePianoInput(null, { text: "jk" })).toBe(false);
+});

package/test/playback-buffer.test.js

@@ -0,0 +1,31 @@
+import { expect, test } from "bun:test";
+import { PlaybackBuffer } from "../lib/audio/playback-buffer.js";
+
+test("media prepares a bounded reserve regardless of server credits", () => {
+  const buffer = new PlaybackBuffer(1000, 2, 0.5);
+  expect(buffer.request(0, 0, 0, 0)).toBe(2000);
+  expect(buffer.request(0, 2000, 0, 500)).toBe(0);
+  expect(buffer.request(1500, 0, 500, 0)).toBe(0);
+  expect(buffer.request(1100, 0, 500, 40)).toBe(400);
+  expect(buffer.request(1100, 400, 500, 40)).toBe(0);
+});
+
+test("startup and starvation recovery require playable PCM, not elapsed time", () => {
+  const buffer = new PlaybackBuffer(1000, 2, 0.5);
+  expect(buffer.ready(40, 0, false)).toBe(false);
+  expect(buffer.ready(398, 0, false)).toBe(false);
+  expect(buffer.ready(400, 0, false)).toBe(true);
+  expect(buffer.ready(40, 300, false)).toBe(true);
+  expect(buffer.ready(0, 0, false)).toBe(false);
+  expect(buffer.ready(40, 0, false)).toBe(false);
+  expect(buffer.ready(400, 0, false)).toBe(true);
+});
+
+test("short clips drain and piano stays interactive", () => {
+  const media = new PlaybackBuffer(1000, 2, 0.5);
+  expect(media.ready(40, 0, true)).toBe(true);
+  const piano = new PlaybackBuffer(1000, 2, 0.12);
+  expect(piano.ready(40, 0, false)).toBe(true);
+  expect(piano.request(0, 0, 0, 120)).toBe(120);
+  expect(piano.request(0, 120, 0, 120)).toBe(0);
+});

package/test/position-audio.test.js

@@ -65,3 +65,27 @@ test("an ended prefix or failed reopen never claims to have reached the target",
   const sound = track(pipe, 2);
   expect(await advanceAudio(() => sound, 8, { needsMore: () => false, reopen: async () => false })).toBe(false);
 });
+
+test("a seek before the first audio epoch cannot keep reopening an unreachable prefix", async () => {
+  let sound = { position: 6, decoder: { sampleRate: 1, channels: 1 } }, reopened = 0;
+  expect(await advanceAudio(() => sound, 2, {
+    needsMore: () => true,
+    reopen: async () => { reopened++; sound = { ...sound, position: 6 }; return true; },
+  })).toBe(false);
+  expect(reopened).toBe(1);
+});
+
+test("audio epoch EOF resumes at the next absolute sample cursor", async () => {
+  const pipe = createBytePipe(); pipe.finish();
+  let sound = { position: 6, pending: null, endTime: 6, snapshotId: 1, openedGeneration: 1, pipe,
+    decoder: { sampleRate: 1, channels: 1, nextSamples: () => null } };
+  expect(await advanceAudio(() => sound, 7, {
+    needsMore: () => true,
+    reopen: async () => {
+      sound = { ...sound, position: 6, endTime: Infinity, snapshotId: 2, pending: new Float32Array([6, 7]) };
+      return true;
+    },
+  })).toBe(true);
+  expect(sound.position).toBe(7);
+  expect([...sound.pending]).toEqual([7]);
+});

package/test/positioning.test.js

@@ -107,6 +107,28 @@ test("relative offsets and translate move a box and its content without affectin
   expect(box(".centered")).toMatchObject({ x: -20, y: 40 + 10 });
 });
 
+test("transform lists compose pixel and percentage translations in order", () => {
+  const { box } = render(
+    `<div class="popup"></div><div class="scaled"></div><div class="reversed"></div><div class="math"></div>`,
+    `.popup,.scaled,.reversed,.math { position:absolute;left:0;top:0;width:100px;height:153px }
+     .popup { transform:translate(56px,780px) translate(0,-100%) }
+     .scaled { transform:scale(2,3) translate(10px,20%) translateX(5px) }
+     .reversed { transform:translate(10px,20%) scale(2,3) translateX(5px) }
+     .math { transform:translate(calc(25% + 10px),min(20%,40px)) translate(10%,5px) }`,
+  );
+  expect(box(".popup")).toEqual({x:56,y:627,width:100,height:153});
+  expect(box(".scaled")).toMatchObject({x:30,y:91.8});
+  expect(box(".reversed")).toMatchObject({x:20,y:30.6});
+  expect(box(".math")).toMatchObject({x:45,y:35.6});
+});
+
+test("individual translate precedes the transform list and preserves normal flow", () => {
+  const {box} = render('<div class="translated"></div><div class="next"></div>',
+    '.translated{width:100px;height:80px;translate:10px -50%;transform:scale(2) translate(5px,10px)}.next{height:20px}');
+  expect(box('.translated')).toEqual({x:20,y:-20,width:100,height:80});
+  expect(box('.next').y).toBe(80);
+});
+
 test("an absolutely positioned ::after arrow is centred on its host's edge", () => {
   // The buninu.org step arrow: top:50%; right:-.75rem; translate(50%,-50%).
   const { box } = render(

package/test/prepared-script-cache.test.js

@@ -0,0 +1,45 @@
+import { expect, test } from "bun:test";
+import { PreparedScriptCache, prepareClassicScript } from "../lib/renderer/prepared-script-cache.js";
+import { escapeSesHtmlComments, rewriteClassicScriptSource } from "../lib/renderer/script-rewrite.js";
+
+test("cached preparation preserves source semantics and does not retain evaluated globals", () => {
+  const source = "var result = supplied + 1; function read() { return result; }";
+  const prepared = prepareClassicScript(source);
+  const original = rewriteClassicScriptSource(source);
+  expect(prepared).toEqual({ code: escapeSesHtmlComments(original.code), parsed: true, strict: false });
+  expect(prepareClassicScript(source)).toBe(prepared);
+  const run = supplied => {
+    const page = { supplied, $buninu$ref: name => { throw new ReferenceError(name); } };
+    page.globalThis = page;
+    Function("page", "source", "with(page) { eval(source); }")(page, prepared.code);
+    return page;
+  };
+  const first = run(2), second = run(8);
+  expect(first.read()).toBe(3);
+  expect(second.read()).toBe(9);
+  expect(first.read).not.toBe(second.read);
+  expect(Object.isFrozen(prepared)).toBeTrue();
+});
+
+test("preparation retains a bounded working set and never keeps oversized sources", () => {
+  const calls = [];
+  const cache = new PreparedScriptCache({ maxBytes: 40, maxEntries: 2, prepare(source) {
+    calls.push(source); return { code: source, parsed: true, strict: false };
+  } });
+  cache.prepare("first"); cache.prepare("next"); cache.prepare("first"); cache.prepare("third");
+  expect(calls).toEqual(["first", "next", "third"]);
+  cache.prepare("next");
+  expect(calls).toEqual(["first", "next", "third", "next"]);
+  const oversized = "a".repeat(11);
+  cache.prepare(oversized); cache.prepare(oversized);
+  expect(calls.filter(source => source === oversized)).toHaveLength(2);
+  expect(cache.prepare("next").code).toBe("next");
+  expect(calls.filter(source => source === "next")).toHaveLength(2);
+});
+
+test("different strictness and invalid sources never share a prepared result", () => {
+  const cache = new PreparedScriptCache();
+  expect(cache.prepare("'use strict'; var value = 1;").strict).toBeTrue();
+  expect(cache.prepare("var value = 1;").strict).toBeFalse();
+  expect(cache.prepare("var = ;").parsed).toBeFalse();
+});

package/test/pulse-client.test.js

@@ -134,7 +134,14 @@ function header(length, channel) {
 test("measured device progress governs the media clock and bounded audio queue through starvation", async () => {
   const { createServer } = await import("node:net");
   let received = 0, played = 0, reports = 0;
-  const times = [], errors = [];
+  const times = [], errors = [], requests = [];
+  // The suite also runs CPU-heavy renderers in parallel. Observe protocol
+  // progress instead of assuming a polling timer ran within 120 ms.
+  const waitFor = async predicate => {
+    const deadline = Date.now() + 2000;
+    while (!predicate() && Date.now() < deadline) await Bun.sleep(10);
+    expect(predicate()).toBe(true);
+  };
   const scalar64 = (tag, value) => {
     const bytes = Buffer.alloc(9);
     bytes[0] = tag;
@@ -171,14 +178,20 @@ test("measured device progress governs the media clock and bounded audio queue t
   const client = await PulseClient.connect({ port: server.address().port });
   try {
     const stream = await client.openPlayback({ rate: 500, channels: 1,
+      onRequest: bytes => requests.push(bytes),
       onTiming: timing => times.push(timing.seconds), onTimingError: error => errors.push(error) });
-    stream.write(new Uint8Array(2000));
-    await Bun.sleep(180);
+    expect(requests).toEqual([2000]); // controller reserve, not the device queue
+    stream.write(new Uint8Array(100));
+    await Bun.sleep(80);
+    expect(received).toBe(0); // a short prefix does not start/stop playback
+    stream.write(new Uint8Array(1900));
+    await waitFor(() => reports > 0 && received === 500 && times.length > 0);
     expect(reports).toBeGreaterThan(0);
     expect(received).toBe(500); // at most the 0.5 s queue budget, not 2 s
+    expect(stream.queued).toBe(1500); // survives a renderer busy spell in the controller
     expect(times.at(-1)).toBe(0); // server/device hasn't played anything
     played = 100;
-    await Bun.sleep(120);
+    await waitFor(() => times.at(-1) === 0.1 && received === 600);
     expect(times.at(-1)).toBeCloseTo(0.1, 5);
     expect(received).toBe(600);
     // A long network/producer pause is NOT permission to catch up by queuing seconds.
@@ -186,12 +199,21 @@ test("measured device progress governs the media clock and bounded audio queue t
     expect(times.at(-1)).toBeCloseTo(0.1, 5);
     expect(received).toBe(600);
     played = 600;
-    await Bun.sleep(120);
+    await waitFor(() => times.at(-1) === 0.6 && received > 1000);
     expect(times.at(-1)).toBeCloseTo(0.6, 5);
     expect(received).toBeGreaterThan(1000);
     expect(received).toBeLessThanOrEqual(1100);
+    // No more PCM is provided by the producer: continue from the local reserve.
+    for (let i = 0; i < 4; i++) {
+      played = received;
+      await Bun.sleep(150);
+    }
+    expect(received).toBeGreaterThan(1500);
+    expect(received).toBeLessThanOrEqual(2000);
+    expect(requests.reduce((sum, value) => sum + value, 0)).toBeLessThanOrEqual(4000);
     expect(errors).toEqual([]);
     await stream.close();
+    expect(stream.queued).toBe(0); // pause/seek discards reserve; no extra device tail
   } finally {
     client.close();
     await new Promise(resolve => server.close(resolve));