buninu-browser 0.4.0 → 0.5.1

package/test/fixtures/qml-shader-check.mjs

@@ -0,0 +1,24 @@
+import {strict as assert} from 'node:assert';
+import {createPageRenderer} from '../../lib/renderer/page-renderer.js';
+const texture=process.argv[2]==='texture';
+const grab=process.argv[2]==='grab'||texture;
+const url=new URL(texture?'./qml-shader/texture-grab.qml':grab?'./qml-shader/grab.qml':'./qml-shader/main.qml',import.meta.url).href;
+const errors=[];
+const r=await createPageRenderer({reportError:e=>errors.push(String(e.stack||e)),fetchResource:async url=>({ok:true,status:200,url,body:url.startsWith('data:')?Buffer.from(url.slice(url.indexOf(',')+1),'base64'):await Bun.file(new URL(url)).bytes()})});
+r.resize(640,420,1);r.setScripting('host');
+try{
+ await r.loadDocument({url,contentType:'text/x-qml',source:await Bun.file(new URL(url)).text()});await r.whenLoaded();
+ await Bun.sleep(100);
+ if(!grab){
+ const pixel=()=>r.evaluate('Array.from(document.querySelector("canvas").getContext("2d").getImageData(300,160,1,1).data)');
+ assert.deepEqual(await pixel(),[128,128,51,255]);
+ await r.evaluate('testShader.phase=0.9');await Bun.sleep(100);
+ assert.deepEqual(await pixel(),[128,128,230,255]);
+ }else{
+ for(let i=0;i<100;i++){if(await r.evaluate('!!globalThis.grabPixels'))break;await Bun.sleep(10);}
+ assert.deepEqual(await r.evaluate('globalThis.grabPixels'),texture?[0,255,0,255]:[255,0,0,255]);
+ assert.equal(await r.evaluate('globalThis.unloaded'),true);
+ }
+ assert.deepEqual(errors,[]);
+ console.log('shader reactive pixels OK');
+}finally{r.dispose();}

package/test/fixtures/title-no-paint.js

@@ -0,0 +1,20 @@
+import {strict as assert} from 'node:assert';
+import {createPageRenderer} from '../../lib/renderer/page-renderer.js';
+const traces=[];
+const r=await createPageRenderer({trace:s=>traces.push(s)});
+try{
+ r.setScripting('host');
+ await r.loadDocument({url:'https://title.test/',contentType:'text/html',source:`<title>Initial</title><p>Before</p><script>globalThis.changeTitle=value=>{document.title=value;document.querySelector('p').textContent='Changed '+value};</script>`});
+ await r.whenLoaded();
+ assert.equal(r.title(),'Initial');
+ // Host scripting allows the fixture to mutate the DOM without evaluate()'s
+ // explicit refresh. No onFrame callback: pending work stays pending.
+ for(const title of ['Updated','']){
+  globalThis.changeTitle(title);
+  traces.length=0;
+  assert.equal(r.title(),title);
+  assert.equal(traces.length,0,'title reads must not rebuild or rasterize');
+  await r.screenshot();
+  assert.ok(traces.some(s=>s.includes('restyle and relayout')),'DOM mutations remain pending until rendering is requested');
+ }
+}finally{delete globalThis.changeTitle;r.dispose()}

package/test/fractional-text-scale.test.js

@@ -0,0 +1,6 @@
+import {test,expect} from 'bun:test';
+test('fractional font sizes retain the final glyph at different device scales',async()=>{
+ const child=Bun.spawn([process.execPath,new URL('./fixtures/fractional-text-scale.js',import.meta.url).pathname],{stdout:'pipe',stderr:'pipe'});
+ const [exit,stderr]=await Promise.all([child.exited,new Response(child.stderr).text()]);
+ expect({exit,stderr}).toEqual({exit:0,stderr:''});
+},30000);

package/test/inert-link.test.js

@@ -0,0 +1,37 @@
+import {test, expect} from 'bun:test';
+import Window from '../vendor/happy-dom/packages/happy-dom/src/window/Window.ts';
+import {createInertWindow} from '../lib/happy-dom/parser.js';
+
+test('inert links leave existing and subsequent ordinary windows resource loading intact', async () => {
+  const requests=[];
+  const server=Bun.serve({port:0,fetch(req){requests.push(new URL(req.url).pathname);return new Response('body{color:red}',{headers:{'content-type':'text/css'}})}});
+  const windows=[];
+  const ordinary=()=>{const w=new Window({url:server.url.href});windows.push(w);return w};
+  const addLink=(w,path)=>{
+    const link=w.document.createElement('link'),events=[];
+    link.rel='stylesheet';link.href=path;
+    link.onload=()=>events.push('load');link.onerror=()=>events.push('error');
+    w.document.head.append(link);return {link,events};
+  };
+  try {
+    const before=ordinary();
+    const inert=createInertWindow(server.url.href);windows.push(inert);
+    const after=ordinary();
+    // Repeated setup must not replace the saved native hooks with wrappers.
+    windows.push(createInertWindow(server.url.href));
+    for(const [w,path] of [[before,'/before.css'],[after,'/after.css']]){
+      const {link,events}=addLink(w,path);
+      await w.happyDOM.waitUntilComplete();
+      expect(events).toEqual(['load']);expect(link.sheet).not.toBeNull();
+      link.href=path+'?changed';await w.happyDOM.waitUntilComplete();
+      expect(events).toEqual(['load','load']);
+    }
+    const {link,events}=addLink(inert,'/inert.css');
+    link.href='/inert-changed.css';
+    await inert.happyDOM.waitUntilComplete();
+    expect(events).toEqual([]);expect(link.sheet).toBeNull();
+    expect(requests).toEqual(['/before.css','/before.css','/after.css','/after.css']);
+  } finally {
+    await Promise.all(windows.map(w=>w.happyDOM.abort()));server.stop(true);
+  }
+});

package/test/manual-double-click.html

@@ -0,0 +1,21 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>雙擊測試 · ondblclick</title>
+<style>
+body{margin:0;padding:28px;background:#101c2c;color:#e9f2ff;font-family:sans-serif}
+h1{font-size:26px}p{line-height:1.6;color:#bed0e8}
+#target{display:block;width:100%;height:180px;background:#204763;color:white;border:2px solid #5ad5df;border-radius:12px;font-size:26px}
+#result{padding:18px;font-size:22px;color:#71edcf}
+#stats{padding:14px;background:#192b40;line-height:1.8}
+</style>
+<h1>雙擊才能開啟</h1>
+<p>在下面區域快速點兩下。單擊只更新紀錄，雙擊才會切換開啟／關閉狀態。</p>
+<button id="target" onclick="recordClick(event)" ondblclick="toggleDoor(event)">🔒 雙擊開啟</button>
+<div id="result">等待 dblclick…</div>
+<div id="stats">click：0　dblclick：0　最近 detail：0</div>
+<script>
+let clicks=0,doubles=0,opened=false;
+function stats(detail){document.getElementById('stats').textContent='click：'+clicks+'　dblclick：'+doubles+'　最近 detail：'+detail}
+function recordClick(e){clicks++;stats(e.detail)}
+function toggleDoor(e){doubles++;opened=!opened;document.getElementById('target').textContent=opened?'🔓 已開啟，雙擊關閉':'🔒 已關閉，雙擊開啟';document.getElementById('result').textContent='收到 ondblclick！第 '+doubles+' 次';stats(e.detail)}
+</script>

package/test/manual-mouse-buttons.html

@@ -0,0 +1,18 @@
+<!doctype html>
+<html lang="zh-Hant"><meta charset="utf-8"><title>滑鼠按鍵測試</title>
+<style>
+body{margin:0;padding:28px;background:#101a28;color:#e1f2ff;font-family:sans-serif}
+h1{font-size:28px}p{line-height:1.6}button{display:block;width:100%;height:220px;background:#146d83;color:white;border:3px solid #62dbe9;border-radius:18px;font-size:34px;font-weight:bold}
+#result{margin-top:24px;font-size:27px;color:#70efce}#counts{font-size:22px}pre{white-space:pre-wrap;background:#19283b;padding:16px;font-size:17px}
+</style>
+<h1>左鍵・右鍵・中鍵測試</h1><p>直接點按測左鍵。長按圖片，選 Right click 測右鍵。右鍵不應增加左鍵次數。</p>
+<button id="pad">在這裡點擊 / 長按</button><div id="result">等待按鍵…</div><p id="counts">左鍵 0 ｜ 右鍵 0 ｜ 中鍵 0</p><pre id="events">事件記錄</pre>
+<script>
+const pad=document.getElementById('pad'),result=document.getElementById('result'),counts=document.getElementById('counts'),log=document.getElementById('events');
+const totals=[0,0,0],names=['左鍵','中鍵','右鍵'];let rows=[];
+for(const type of ['mousedown','contextmenu','mouseup','click','auxclick'])pad.addEventListener(type,e=>{
+ if(type==='contextmenu')e.preventDefault();
+ rows.unshift(type+' button='+e.button+' buttons='+e.buttons);rows=rows.slice(0,10);log.textContent=rows.join('\n');
+ if(type==='click'||type==='auxclick'){totals[e.button]++;result.textContent='收到：'+names[e.button];counts.textContent='左鍵 '+totals[0]+' ｜ 右鍵 '+totals[2]+' ｜ 中鍵 '+totals[1];}
+});
+</script></html>

package/test/manual-omastorm-engine.mjs

@@ -0,0 +1,19 @@
+// Requires an already-running official engine; never starts or installs one.
+import {mkdtemp,rm} from 'node:fs/promises';
+import {resolve} from 'node:path';
+import {pathToFileURL} from 'node:url';
+import {createBrowser} from '../lib/headless-shell.js';
+const root=resolve(process.argv[2] || '../omastorm');
+const dir=await mkdtemp('/tmp/omastorm-engine-probe-');
+await Bun.write(dir+'/probe.qml',`import QtQuick
+import ${JSON.stringify(pathToFileURL(root+'/ui').href)} as Storm
+Item {Storm.Engine {id:engine} Component.onCompleted:globalThis.engineProbe=engine}`);
+const browser=await createBrowser({spareRenderer:false});
+try {
+ await browser.context.navigate(pathToFileURL(dir+'/probe.qml').href);
+ for(let i=0;i<100;i++){
+  const value=await browser.context.evaluate('globalThis.engineProbe ? {error:engineProbe.error, sites:engineProbe.sites.length,state:engineProbe.state?.type,frame:engineProbe.state?.frame?.kind} : {text:document.body.textContent.slice(0,1000)}');
+  if(value?.state || value?.error || value?.text){console.log(JSON.stringify(value));break;}
+  await Bun.sleep(50);
+ }
+}finally{browser.close();await rm(dir,{recursive:true,force:true});}

package/test/manual-omastorm-shaders.mjs

@@ -0,0 +1,28 @@
+// Offline, CPU-only compatibility probe. Reads upstream GLSL without modifying it.
+import {resolve} from 'node:path';
+import init from '../usr/lib/canvaskit/canvaskit.js';
+import {compileFragment,makeFragmentShader} from '../lib/qml/shader/fragment.js';
+import {fragmentSource} from '../lib/qml/shader/qsb.js';
+const root=resolve(process.argv[2]||'../omastorm');
+const kit=await init({wasmBinary:await Bun.file(new URL('../usr/lib/canvaskit/canvaskit.wasm',import.meta.url)).arrayBuffer()});
+for(const name of ['tile','texture-check','radar','grid']){
+ const c=compileFragment(kit,fragmentSource(await Bun.file(root+'/ui/shaders/'+name+'.frag.qsb').bytes()));
+ try{
+  console.log(name+': CPU-compatible RuntimeEffect compiled');
+  if(!['tile','texture-check'].includes(name))continue;
+  const image=kit.MakeImage({width:2,height:1,colorType:kit.ColorType.RGBA_8888,alphaType:kit.AlphaType.Premul,colorSpace:kit.ColorSpace.SRGB},new Uint8Array([255,0,0,255,255,0,0,255]),8);
+  const child=image.makeShaderOptions(kit.TileMode.Clamp,kit.TileMode.Clamp,kit.FilterMode.Nearest,kit.MipmapMode.None);
+  const shader=makeFragmentShader(c,{width:16,height:16,uniforms:{expected:[2,1],boundaries:[1,0,0,1],water:[0,0,0,0],minorRoads:[0,0,0,0],majorRoads:[0,0,0,0]},textures:{[name==='tile'?'mask':'sweep']:{shader:child,width:2,height:1}}});
+  const surface=kit.MakeSurface(16,16),paint=new kit.Paint();
+  try{
+   paint.setShader(shader);surface.getCanvas().drawRect(kit.XYWHRect(0,0,16,16),paint);surface.flush();
+   const result=surface.makeImageSnapshot();
+   try{
+    const pixel=Array.from(result.readPixels(0,0,{width:1,height:1,colorType:kit.ColorType.RGBA_8888,alphaType:kit.AlphaType.Unpremul,colorSpace:kit.ColorSpace.SRGB}));
+    const expected=name==='tile'?[255,0,0,255]:[0,255,0,255];
+    if(JSON.stringify(pixel)!==JSON.stringify(expected))throw Error(name+' wrong pixel: '+pixel);
+    console.log(name+': CPU pixel '+pixel+' verified');
+   }finally{result.delete();}
+  }finally{paint.delete();surface.delete();shader.delete();child.delete();image.delete();}
+ }finally{c.effect.delete();}
+}

package/test/manual-omastorm-software.mjs

@@ -0,0 +1,25 @@
+// Explicit experiment: copy the application and remove only its GPU policy.
+// Does not alter the checkout, fake GraphicsInfo, or bypass shader/pixel checks.
+import {mkdtemp,cp,readFile,writeFile} from 'node:fs/promises';
+import {resolve} from 'node:path';
+import {tmpdir} from 'node:os';
+const root=resolve(process.argv[2]||'../omastorm');
+const directory=await mkdtemp(resolve(tmpdir(),'omastorm-software-'));
+await cp(root+'/ui',directory+'/ui',{recursive:true});
+const replacements=[
+ ['TextureCheck.qml', /        if \(GraphicsInfo\.api === GraphicsInfo\.Software\) \{\n            fail\("Radar requires GPU rendering \(OpenGL\/Vulkan\)\."\);\n            return;\n        \}\n/],
+ ['RadarMap.qml', /        Component\.onCompleted: if \(GraphicsInfo\.api === GraphicsInfo\.Software\) map\.graphicsError = "Radar requires GPU rendering \(OpenGL\/Vulkan\)\."\n/],
+];
+for(const [file,pattern] of replacements){
+ const path=directory+'/ui/'+file,source=await readFile(path,'utf8');
+ if(!pattern.test(source))throw Error('Upstream policy changed; review '+file+' before modifying it');
+ await writeFile(path,source.replace(pattern,''));
+}
+console.log('Software test copy: '+directory);
+console.log('Original engine must already be running in XDG_RUNTIME_DIR/omastorm.');
+if(process.argv.includes('--prepare-only'))process.exit(0);
+const child=Bun.spawn([process.execPath,new URL('../lib/qml/qswayland',import.meta.url).pathname,'-p',directory+'/ui/shell.qml'],{
+ env:{...process.env,OMASTORM_ROOT:root},stdin:'inherit',stdout:'inherit',stderr:'inherit',
+});
+for(const signal of ['SIGINT','SIGTERM','SIGHUP'])process.on(signal,()=>child.kill(signal));
+process.exitCode=await child.exited;

package/test/manual-pointer-scroll.html

@@ -0,0 +1,43 @@
+<!doctype html>
+<html lang="zh-Hant">
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>滑鼠與捲動測試</title>
+<style>
+*{box-sizing:border-box}body{margin:0;padding:16px;background:#101923;color:#e4edf5;font:16px sans-serif}h1{font-size:24px}h2{font-size:18px;margin:10px 0}section{padding:14px;margin:16px 0;background:#1c2a38;border:1px solid #446079;border-radius:8px}button,textarea{font:inherit}button{padding:10px;margin:4px;background:#bcebea;color:#102c35;border:0;border-radius:4px}code,pre{font:13px monospace}pre{white-space:pre-wrap;overflow-wrap:anywhere;max-height:240px;overflow:auto}p{line-height:1.5}.box{width:100%;height:220px;border:2px solid #69c7dd;background:#172431}.v{overflow-x:hidden;overflow-y:auto}.h{overflow-x:auto;overflow-y:hidden}.both{overflow:auto}.wide{width:1800px;height:180px;background:linear-gradient(90deg,#375f8b,#426e4d,#9c4f49);padding:20px}.plane{width:1800px;height:1200px;background:repeating-linear-gradient(0deg,transparent,transparent 99px,#7cabc4 100px),repeating-linear-gradient(90deg,#263d52,#263d52 99px,#7cabc4 100px);padding:20px}.row{padding:18px;border-bottom:1px solid #436479}.readout{color:#8de1e8;margin:8px 0}#target{display:block;width:100%;min-height:100px;background:#286a75;color:white}canvas{display:block;width:100%;height:220px;background:#f5fafb;touch-action:none}textarea{width:100%;height:110px}label{display:block;margin:8px 0}
+</style>
+<h1>滑鼠與捲動測試</h1>
+<p>各區獨立捲動。先把游標放在指定區域再操作，觀察位置與事件紀錄。Shift／Ctrl／Alt／Super 是否到達頁面取決於外層終端與系統；本頁不自行交換滾輪軸向。</p>
+<section><h2>1. 垂直捲動</h2><div class="readout" id="v-state"></div><div id="v" class="box v"></div></section>
+<section><h2>2. 水平捲動</h2><div class="readout" id="h-state"></div><div id="h" class="box h"><div class="wide">左端 0 ← 水平 1800 px → 右端<br><br>試水平手勢或 Shift＋滾輪；若事件仍是 deltaY，請看外層終端是否轉換。</div></div></section>
+<section><h2>3. 雙向捲動</h2><div class="readout" id="both-state"></div><div id="both" class="box both"><div class="plane">左上角 (0, 0) — 每格約 100 px；寬 1800、高 1200。</div></div><button id="reset">重設三區捲動</button></section>
+<section><h2>4. 按鍵、雙擊與修飾鍵</h2><p>此按鈕攔截原生右鍵選單，只在這裡記錄 contextmenu。中鍵不捲頁。可按住修飾鍵再點擊。</p><button id="target">左鍵／右鍵／中鍵／雙擊這裡</button><div id="counts" class="readout"></div></section>
+<section><h2>5. 按住左鍵拖曳畫線</h2><p>手機可雙擊並按住第二下拖曳。放開後再移動不應畫線；也可測移出畫布後放開。按住狀態與座標列在下方。</p><canvas id="paint" width="1000" height="300"></canvas><div id="drag" class="readout">尚未按下</div><button id="clear-paint">清除畫布</button></section>
+<section id="text-selection"><h2>6. 文字選取與編輯</h2><p>這段可拖曳選取：春天的河水流過城市，0123456789，The quick brown fox。</p><textarea>第一行：滑鼠點擊定位，Shift＋方向鍵選取。
+第二行：測試 Ctrl-C／Ctrl-V、原生長按貼上。
+第三行：這裡不自行實作 PRIMARY 選取或中鍵貼上。</textarea></section>
+<section><h2>事件紀錄（最多 40 筆）</h2><label><input id="moves" type="checkbox"> 記錄 mousemove（會產生大量事件）</label><button id="clear-log">清除紀錄</button><pre id="log" aria-live="off"></pre></section>
+<script>
+const $=id=>document.getElementById(id), records=[], counts={left:0,right:0,middle:0,double:0};
+function log(e){const mods=['shiftKey','ctrlKey','altKey','metaKey'].filter(k=>e[k]).map(k=>k.replace('Key','')).join('+')||'-';let msg=e.type+' target='+(e.target.id||e.target.tagName)+' button='+e.button+' buttons='+e.buttons+' xy='+Math.round(e.clientX||0)+','+Math.round(e.clientY||0)+' modifiers='+mods;if(e.type==='wheel')msg+=' delta='+e.deltaX+','+e.deltaY+' mode='+e.deltaMode;if(e.type==='click'||e.type==='dblclick'||e.type==='auxclick')msg+=' detail='+e.detail;records.unshift(msg);records.length=Math.min(40,records.length);$('log').textContent=records.join('\n')}
+for(const type of ['mousedown','mouseup','click','dblclick','auxclick','contextmenu','wheel'])document.addEventListener(type,log,{capture:true,passive:true});
+document.addEventListener('mousemove',e=>{if($('moves').checked)log(e)},{passive:true});
+for(let i=0;i<20;i++){const r=document.createElement('div');r.className='row';r.textContent='垂直第 '+(i+1)+' 列';$('v').appendChild(r)}
+for(const id of ['v','h','both']){const box=$(id),update=()=>{$(id+'-state').textContent='scrollLeft='+Math.round(box.scrollLeft)+' / '+Math.max(0,box.scrollWidth-box.clientWidth)+' · scrollTop='+Math.round(box.scrollTop)+' / '+Math.max(0,box.scrollHeight-box.clientHeight)};box.addEventListener('scroll',update);window.addEventListener('resize',update);update()}
+$('reset').onclick=()=>{for(const id of ['v','h','both']){$(id).scrollLeft=0;$(id).scrollTop=0}};
+const count=()=>{$('counts').textContent='左鍵 '+counts.left+' · 右鍵 '+counts.right+' · 中鍵 '+counts.middle+' · 雙擊 '+counts.double};count();
+$('target').onclick=e=>{if(e.button===0){counts.left++;count()}};
+$('target').oncontextmenu=e=>{e.preventDefault();counts.right++;count()};
+$('target').onauxclick=e=>{e.preventDefault();if(e.button===1){counts.middle++;count()}};
+$('target').onmousedown=e=>{if(e.button===1)e.preventDefault()};
+$('target').ondblclick=()=>{counts.double++;count()};
+const canvas=$('paint'),ctx=canvas.getContext('2d');let drawing=false,last=null;
+const point=e=>{const r=canvas.getBoundingClientRect();return [(e.clientX-r.left)*canvas.width/r.width,(e.clientY-r.top)*canvas.height/r.height]};
+canvas.onmousedown=e=>{if(e.button!==0)return;e.preventDefault();drawing=true;last=point(e);$('drag').textContent='按住左鍵'};
+document.addEventListener('mousemove',e=>{if(!drawing)return;if(!(e.buttons&1)){drawing=false;$('drag').textContent='左鍵已放開';return}const p=point(e);ctx.strokeStyle='#136a8b';ctx.lineWidth=3;ctx.beginPath();ctx.moveTo(...last);ctx.lineTo(...p);ctx.stroke();last=p;$('drag').textContent='拖曳 '+p.map(Math.round).join(',')});
+document.addEventListener('mouseup',e=>{if(e.button===0){drawing=false;$('drag').textContent='左鍵已放開'}});
+window.addEventListener('blur',()=>{drawing=false;$('drag').textContent='失焦，停止畫線'});
+$('clear-paint').onclick=()=>ctx.clearRect(0,0,canvas.width,canvas.height);
+$('clear-log').onclick=()=>{records.length=0;$('log').textContent=''};
+</script>
+</html>

package/test/node-iterator.test.js

@@ -0,0 +1,81 @@
+import { afterAll, beforeAll, expect, test } from 'bun:test';
+import { RendererHost } from '../lib/renderer/host.js';
+import { nodeIteratorCases } from './fixtures/node-iterator-cases.js';
+import chromium from './fixtures/node-iterator-chromium.json';
+
+const host = new RendererHost({timeout: 20000, fetch: async () => new Response('')});
+beforeAll(async () => {
+  await host.call('loadDocument', {url:'https://iterator.test/',source:'<body></body>',contentType:'text/html',status:200});
+  await host.call('whenLoaded');
+});
+afterAll(() => host.close());
+const evaluate = async expression => JSON.parse(await host.call('evaluate', `JSON.stringify(${expression})`));
+
+test('NodeIterator traversal, replacement and WebIDL conversion match Chromium and DOM', async () => {
+  const actual = await evaluate(`(${nodeIteratorCases})()`);
+  const expected = chromium.map(row => {
+    // Chromium retains a detached reference when replacing a node with its
+    // following sibling while the pointer is before it. DOM replace adopts
+    // (detaches) that sibling first, then removes the old node: the repaired
+    // reference must be root, not the now-detached old node/descendant.
+    // https://dom.spec.whatwg.org/#concept-node-replace steps 6–7
+    if (row[1] === 'sibling' && [1,2].includes(row[2]) && row[3]) {
+      return [...row.slice(0,4), 'root', false, 'b', 'b', 'b'];
+    }
+    return row;
+  });
+  expect(actual).toEqual(expected);
+});
+
+test('failed replacements leave the tree and iterator position unchanged', async () => {
+  expect(await evaluate(`(() => {
+    const results=[];
+    for(const kind of ['ancestor','missing','document','textDocument','twoElements']) {
+      const root=document.createElement('div');root.id='root';root.innerHTML='<b id="a"></b><i id="b"></i>';
+      const doc=document.implementation.createHTMLDocument('');
+      const parent=kind==='textDocument'||kind==='twoElements'?doc:root;
+      const old=parent.firstChild;
+      const it=document.createNodeIterator(parent);it.nextNode();it.nextNode();
+      const reference=it.referenceNode,before=it.pointerBeforeReferenceNode;
+      const children=[...parent.childNodes];
+      let incoming=kind==='ancestor'?root:kind==='document'?document:document.createElement('em');
+      if(kind==='textDocument')incoming=document.createTextNode('invalid');
+      if(kind==='twoElements'){incoming=document.createDocumentFragment();incoming.append(document.createElement('i'),document.createElement('b'));}
+      let error;
+      try{parent.replaceChild(incoming,kind==='missing'?document.createElement('b'):old)}catch(e){error=e.name}
+      results.push([kind,error,it.referenceNode===reference,it.pointerBeforeReferenceNode===before,
+        children.length===parent.childNodes.length&&children.every((n,i)=>n===parent.childNodes[i])]);
+    }
+    return results;
+  })()`)).toEqual([
+    ['ancestor','HierarchyRequestError',true,true,true],['missing','NotFoundError',true,true,true],
+    ['document','HierarchyRequestError',true,true,true],['textDocument','HierarchyRequestError',true,true,true],
+    ['twoElements','HierarchyRequestError',true,true,true]
+  ]);
+});
+
+test('filter replacement repairs both active and stored iterator cursors', async () => {
+  expect(await evaluate(`(() => {
+    const root=document.createElement('div');root.id='root';root.innerHTML='<b id="a"></b><i id="b"></i>';
+    const it=document.createNodeIterator(root,1,n=>{
+      if(n.id==='a'){const replacement=document.createElement('em');replacement.id='x';root.replaceChild(replacement,n)}
+      return 1;
+    });
+    const got=[];for(let n,i=0;i<8&&(n=it.nextNode());i++)got.push(n.id);
+    return got;
+  })()`)).toEqual(['root','a','x','b']);
+});
+
+test('batch removal follows DOM tree order and keeps references attached', async () => {
+  expect(await evaluate(`(() => {
+    const results=[];
+    for(const operation of ['replaceChildren','innerHTML','textContent'])for(const before of [false,true]) {
+      const root=document.createElement('div');root.innerHTML='<i>a</i><i>b</i>';
+      const it=document.createNodeIterator(root);it.nextNode();it.nextNode();it.nextNode();
+      if(before)it.previousNode();
+      if(operation==='replaceChildren')root.replaceChildren();else root[operation]='';
+      results.push([it.referenceNode===root,it.pointerBeforeReferenceNode,it.nextNode()]);
+    }
+    return results;
+  })()`)).toEqual(Array.from({length:6},()=>[true,false,null]));
+});

package/test/page-scripts.test.js

@@ -1997,14 +1997,24 @@ test("a click inside an iframe goes to the element under it in the frame's docum
 test("dynamic linked stylesheets fire load after their rules become available", async () => {
   await load(`<div id="target"></div><script>
     window.sheetLoaded = false;
+    window.sheetEvents = [];
     const link = document.createElement('link');
     link.rel = 'stylesheet';
     link.href = '/slow.css';
-    link.onload = () => { window.sheetLoaded = getComputedStyle(document.body).color; };
+    window.styleTestLink = link;
+    link.onerror = () => sheetEvents.push('error');
+    link.onload = () => { sheetEvents.push('load'); 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)');
+  expect(await evaluate('sheetEvents.join()')).toBe('load');
+  await evaluate("styleTestLink.href='/missing.css'; window.eventsAfterHref=sheetEvents.join()");
+  expect(await evaluate('eventsAfterHref')).toBe('load');
+  expect(await waitFor("sheetEvents.join() === 'load,error'")).toBe(true);
+  await evaluate("styleTestLink.href='/slow.css'; window.eventsAfterHref=sheetEvents.join()");
+  expect(await evaluate('eventsAfterHref')).toBe('load,error');
+  expect(await waitFor("sheetEvents.join() === 'load,error,load'")).toBe(true);
 });
 
 test("decoded dynamic images report natural dimensions and fire load", async () => {
@@ -2154,3 +2164,108 @@ test("the page scrolls over content that overflows a 100vh layout, not over clip
   expect(await evaluate(`(scrollTo(0, 99999), [scrollY, Math.round(document.getElementById("end").getBoundingClientRect().bottom)])`))
     .toEqual([2090 - 300, 300]);
 });
+
+test("NodeIterator includes its root, preserves direction, and skips rejected nodes without pruning", async () => {
+  await load('<div id="root"><p id="a"><b id="child"></b></p><!--note--><p id="b"></p></div>');
+  expect(await evaluate(`(() => {
+    const root = document.getElementById('root');
+    const filter = {acceptNode(n) {return n.id === 'a' ? NodeFilter.FILTER_REJECT : NodeFilter.FILTER_ACCEPT}};
+    const it = document.createNodeIterator(root, NodeFilter.SHOW_ELEMENT, filter);
+    const initial = [it instanceof NodeIterator,it.root === root,it.referenceNode === root,it.pointerBeforeReferenceNode,it.filter === filter];
+    const forward=[];let n;while(n=it.nextNode())forward.push(n.id);
+    const reverse=[];while(n=it.previousNode())reverse.push(n.id);
+    it.detach();
+    return JSON.stringify([initial,forward,reverse,it.nextNode().id]);
+  })()`)).toBe(JSON.stringify([[true,true,true,true,true],['root','child','b'],['b','child','root'],'root']));
+});
+
+test("NodeIterator survives sanitizer removals, reparenting, and rejected reentrant filters", async () => {
+  await load('<div id="root"><i id="a"><b id="child"></b></i><i id="b"></i><i id="c"></i></div>');
+  expect(await evaluate(`(() => {
+    const root=document.getElementById('root'),it=document.createNodeIterator(root,1);
+    it.nextNode();it.nextNode();it.nextNode();
+    root.firstChild.remove();
+    const removed=[it.referenceNode.id,it.nextNode().id];
+    it.previousNode();root.firstChild.remove();
+    const before=[it.referenceNode.id,it.pointerBeforeReferenceNode,it.nextNode().id];
+    document.body.appendChild(root.firstChild);
+    const moved=[it.referenceNode.id,it.nextNode()];
+    let error;const recur=document.createNodeIterator(root,1,()=>{try{recur.nextNode()}catch(e){error=e.name}return 1});
+    recur.nextNode();
+    const fresh=document.createNodeIterator(root,NodeFilter.SHOW_TEXT);
+    root.innerHTML='hello<b>world</b>';
+    return JSON.stringify([removed,before,moved,error,fresh.nextNode().data,fresh.nextNode().data]);
+  })()`)).toBe(JSON.stringify([['root','b'],['c',true,'c'],['root',null],'InvalidStateError','hello','world']));
+});
+
+// Expectations independently checked against Chromium Headless Shell.
+test("NodeIterator repairs an active filter cursor when the candidate or its ancestor is removed", async () => {
+  await load("<body></body>");
+  expect(await evaluate(`JSON.stringify((()=>{const results=[];for(const direction of ['nextNode','previousNode'])for(const remove of ['self','ancestor'])for(const verdict of [1,3]){
+ const root=document.createElement('div');root.id='root';root.innerHTML='<i id="a"></i><section id="parent"><b id="b"></b><b id="c"></b></section><i id="d"></i>';document.body.append(root);
+ let armed=false,once=false;const seen=[];const it=document.createNodeIterator(root,1,n=>{if(armed)seen.push(n.id);if(armed&&!once&&n.id==='b'){once=true;(remove==='self'?n:n.parentNode).remove();return verdict;}return 1});
+ if(direction==='previousNode')while(it.nextNode());armed=true;
+ const got=[];for(let n,k=0;k<15&&(n=it[direction]());k++)got.push(n.id);
+ results.push({direction,remove,verdict,seen,got,reference:it.referenceNode.id,before:it.pointerBeforeReferenceNode});root.remove();
+}return results.map(r=>[r.direction,r.remove,r.verdict,r.seen.join(','),r.got.join(','),r.reference,r.before])})())`)).toBe(JSON.stringify([
+    ["nextNode", "self", 1, "root,a,parent,b,c,d", "root,a,parent,b,c,d", "d", false],
+    ["nextNode", "self", 3, "root,a,parent,b,c,d", "root,a,parent,c,d", "d", false],
+    ["nextNode", "ancestor", 1, "root,a,parent,b,d", "root,a,parent,b,d", "d", false],
+    ["nextNode", "ancestor", 3, "root,a,parent,b,d", "root,a,parent,d", "d", false],
+    ["previousNode", "self", 1, "d,c,b,parent,a,root", "d,c,b,parent,a,root", "root", true],
+    ["previousNode", "self", 3, "d,c,b,parent,a,root", "d,c,parent,a,root", "root", true],
+    ["previousNode", "ancestor", 1, "d,c,b,a,root", "d,c,b,a,root", "root", true],
+    ["previousNode", "ancestor", 3, "d,c,b,a,root", "d,c,a,root", "root", true]
+  ]));
+});
+
+test("NodeIterator releases its active cursor after a filter throws", async () => {
+  await load('<div id="root"><b id="child"></b></div>');
+  expect(await evaluate(`(() => {
+    const root=document.getElementById('root');let first=true;
+    const it=document.createNodeIterator(root,1,()=>{if(first){first=false;throw Error('filter failed')}return 1});
+    let message;try{it.nextNode()}catch(e){message=e.message}
+    return [message,it.nextNode().id,it.nextNode().id].join(',');
+  })()`)).toBe('filter failed,root,child');
+});
+
+test("NodeIterator repairs removals through proxy-backed select and form parents", async () => {
+  await load('<body></body>');
+  expect(await evaluate(`(() => {
+    const results=[];
+    for(const tag of ['div','select','form']) for(const outerRoot of [false,true])
+      for(const operation of ['remove','removeChild','innerHTML','reparent']) {
+        const outer=document.createElement('div'),parent=document.createElement(tag);
+        outer.append(parent);document.body.append(outer);
+        parent.innerHTML='<option id="a"></option><option id="b"></option>';
+        const it=document.createNodeIterator(outerRoot?outer:parent,1);
+        while(it.nextNode()?.id!=='a') {}
+        const child=parent.firstChild;
+        if(operation==='remove')child.remove();
+        else if(operation==='removeChild')parent.removeChild(child);
+        else if(operation==='innerHTML')parent.innerHTML='';
+        else outer.append(child);
+        results.push([it.referenceNode===parent,it.nextNode()?.id??null]);
+        outer.remove();
+      }
+    return JSON.stringify(results);
+  })()`)).toBe(JSON.stringify(Array.from({length:6},()=>[
+    [true,'b'],[true,'b'],[true,null],[true,'b']
+  ]).flat()));
+});
+
+test("NodeIterator validates nullable callback-interface filters at creation", async () => {
+  await load('<body></body>');
+  expect(await evaluate(`(() => {
+    const results=[];
+    for(const filter of [0,1,false,true,'','x',Symbol('filter'),1n]) {
+      try { document.createNodeIterator(document.body,0,filter);results.push('accepted'); }
+      catch(error) { results.push(error.name); }
+    }
+    for(const filter of [null,undefined,()=>1,{acceptNode(){return 1}},{}]) {
+      const it=document.createNodeIterator(document.body,0,filter);
+      results.push(it.filter===(filter??null) && it.nextNode()===null);
+    }
+    return JSON.stringify(results);
+  })()`)).toBe(JSON.stringify([...Array(8).fill('TypeError'),...Array(5).fill(true)]));
+});

package/test/pointer-drag.test.js

@@ -0,0 +1,104 @@
+import {test,expect} from 'bun:test';
+import {mkdtempSync,rmSync} from 'node:fs';
+import {createBrowser} from '../lib/headless-shell.js';
+import {CdpServer} from '../lib/cdp-server.js';
+import {CDP,launch} from '../tools/browser-lab.js';
+import {WaylandUrlBar} from '../frontends/wayland/urlbar.js';
+
+const source=`<style>body{margin:0}#box{width:300px;height:160px}#a,#b{display:inline-block;width:100px;height:100px}canvas{display:block}</style>
+<div id="box"><span id="a">A</span><span id="b">B</span></div><input id="field" value="hello"><canvas id="paint" width="300" height="100"></canvas>
+<script>
+globalThis.paint=document.getElementById("paint");globalThis.a=document.getElementById("a");globalThis.field=document.getElementById("field");
+globalThis.events=[];globalThis.cancelDown=false;globalThis.cancelPointer=false;
+for(const type of ['pointerdown','mousedown','pointermove','mousemove','pointerup','mouseup','click','auxclick'])document.addEventListener(type,e=>{events.push([type,e.target.id,e.button,e.buttons,e.shiftKey]);if(type==='mousedown'&&cancelDown)e.preventDefault();if(type==='pointerdown'&&cancelPointer)e.preventDefault()});
+let drawing=false;const ctx=paint.getContext('2d');paint.onmousedown=()=>drawing=true;document.addEventListener('mouseup',()=>drawing=false);paint.onmousemove=e=>{if(drawing&&(e.buttons&1)){ctx.fillStyle='red';ctx.fillRect(0,0,20,20)}};
+</script>`;
+async function check(c){
+ await c.send('Page.navigate',{url:'data:text/html,'+encodeURIComponent(source)});
+ for(let i=0;i<200;i++){if(await c.evaluate('!!document.getElementById("paint")'))break;await Bun.sleep(20)}
+ const send=(type,x=20,y=20,extra={})=>c.send('Input.dispatchMouseEvent',{type,x,y,button:'left',buttons:type==='mouseReleased'?0:1,clickCount:1,...extra});
+ await send('mouseMoved',20,20,{buttons:0,button:'none'});await c.evaluate('events=[]');
+ await send('mousePressed',20,20,{modifiers:8});
+ expect(await c.evaluate('events')).toEqual([['pointerdown','a',0,1,true],['mousedown','a',0,1,true]]);
+ await send('mouseMoved',40,40,{modifiers:8});
+ expect((await c.evaluate('events')).slice(-2)).toEqual([['pointermove','a',-1,1,true],['mousemove','a',0,1,true]]);
+ await send('mouseReleased',40,40,{modifiers:8});
+ expect((await c.evaluate('events')).slice(-3)).toEqual([['pointerup','a',0,0,true],['mouseup','a',0,0,true],['click','a',0,0,true]]);
+ // Sibling press/release activates the common ancestor, never the release sibling.
+ await c.evaluate('events=[]');await send('mousePressed');await send('mouseReleased',140,20);
+ expect((await c.evaluate('events')).at(-1)).toEqual(['click','box',0,0,false]);
+ // A disconnected press target cannot activate another element on release.
+ await send('mousePressed');await c.evaluate('a.remove();events=[]');await send('mouseReleased');
+ expect((await c.evaluate('events')).some(e=>e[0]==='click')).toBe(false);
+ // Canceled mousedown must not focus the editor; normal focus happens on press.
+ const rect=await c.evaluate('field.getBoundingClientRect().toJSON()');
+ await c.evaluate('cancelDown=true');await send('mousePressed',rect.x+10,rect.y+8);
+ expect(await c.evaluate('document.activeElement.id')).not.toBe('field');await send('mouseReleased',rect.x+10,rect.y+8);
+ await c.evaluate('cancelDown=false');await send('mousePressed',rect.x+10,rect.y+8);
+ expect(await c.evaluate('document.activeElement.id')).toBe('field');await send('mouseReleased',rect.x+10,rect.y+8);
+ // pointerdown cancellation suppresses compatibility mouse events, not click.
+ await c.evaluate('cancelPointer=true;events=[]');await send('mousePressed',20,20);await send('mouseMoved',30,30);await send('mouseReleased',30,30);
+ expect((await c.evaluate('events')).map(e=>e[0])).toEqual(['pointerdown','pointermove','pointerup','click']);
+ await c.evaluate('cancelPointer=false;events=[]');
+ // The same canvas drawing contract as the manual test, checked before release.
+ const paint=await c.evaluate('paint.getBoundingClientRect().toJSON()');
+ await send('mousePressed',paint.x+20,paint.y+20);await send('mouseMoved',paint.x+40,paint.y+40);
+ expect(await c.evaluate('Array.from(paint.getContext("2d").getImageData(5,5,1,1).data)')).toEqual([255,0,0,255]);
+ await send('mouseReleased',paint.x+40,paint.y+40);await send('mouseMoved',20,20,{buttons:0,button:'none'});
+ expect((await c.evaluate('events')).at(-1)[3]).toBe(0);
+}
+test('CDP real pointer phases preserve dragging, focus and click targets',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 check(c)}finally{c.close();server.stop(true);b.close()}
+},30000);
+test.skipIf(process.env.BUNINU_TEST_CHROMIUM!=='1')('Chromium reference uses the same pointer event contract',async()=>{
+ const dir=mkdtempSync('/tmp/pointer-chromium-');let app;
+ try{app=await launch('chromium',dir);await check(app.cdp)}finally{await app?.stop();rmSync(dir,{recursive:true,force:true})}
+},30000);
+test('Wayland toolbar sends real press and motion before release, including over chrome',async()=>{
+ const b=await createBrowser({spareRenderer:false});const bar=new WaylandUrlBar(b.context,{history:{list:()=>[],add(){}}});
+ try{
+  await b.context.navigate('data:text/html,'+encodeURIComponent(source));
+  await bar.pointerButton(20,bar.height+20,272,1,{clickCount:1});
+  expect((await b.context.evaluate('events')).map(e=>e[0])).toEqual(['pointerdown','mousedown']);
+  await bar.move(40,bar.height+40);
+  expect((await b.context.evaluate('events')).at(-1)[3]).toBe(1);
+  await bar.pointerButton(40,0,272,0,{clickCount:1});
+  await bar.move(40,bar.height+40);
+  expect((await b.context.evaluate('events')).at(-1)[3]).toBe(0);
+  expect(bar.editor.editing).toBe(false);
+ }finally{bar.dispose();b.close()}
+},30000);
+
+test.skipIf(process.env.BUNINU_TEST_WAYLAND!=='1')('real Wayland pointer draws on the unchanged manual test page',async()=>{
+ const {start}=await import('../../buninu-land/compositor.js');
+ const {launch:wayland}=await import('../frontends/wayland/index.js');
+ const dir=mkdtempSync('/tmp/pointer-wayland-'),saved=process.env.XDG_RUNTIME_DIR;
+ process.env.XDG_RUNTIME_DIR=dir;let land,app;
+ const until=async fn=>{for(let n=0;n<200;n++){if(await fn())return;await Bun.sleep(20)}throw Error('Wayland pointer timed out')};
+ try{
+  land=await start(['--remote-debugging-port=0','--window-size=800,700']);
+  app=await wayland({socket:dir+'/wayland-buninu',url:Bun.pathToFileURL(new URL('./manual-pointer-scroll.html',import.meta.url).pathname).href});
+  const c=app.browser.context;
+  await until(()=>land.compositor.wm.renderSurfaces().some(s=>s.pixels));
+  const top=await c.evaluate('document.getElementById("paint").getBoundingClientRect().top');
+  await c.scroll(0,top-100);
+  const rect=await c.evaluate('document.getElementById("paint").getBoundingClientRect().toJSON()');
+  const surface=land.compositor.wm.renderSurfaces().find(s=>s.pixels),origin=land.compositor.wm.origin(surface);
+  const x=origin.x+rect.x+40,y=origin.y+app.toolbar.height+rect.y+40;
+  land.context.dispatchMouseEvent({type:'mouseMoved',x,y});
+  land.context.dispatchMouseEvent({type:'mousePressed',x,y,button:'left',buttons:1});
+  await until(async()=>(await c.evaluate('document.getElementById("drag").textContent'))==='按住左鍵');
+  land.context.dispatchMouseEvent({type:'mouseMoved',x:x+80,y:y+40,button:'left',buttons:1});
+  await until(async()=>await c.evaluate('(()=>{const c=document.getElementById("paint");return c.getContext("2d").getImageData(0,0,c.width,c.height).data.some((v,i)=>i%4===3&&v>0)})()'));
+  land.context.dispatchMouseEvent({type:'mouseReleased',x:x+80,y:y+40,button:'left',buttons:0});
+  await until(async()=>(await c.evaluate('document.getElementById("drag").textContent'))==='左鍵已放開');
+  expect(await c.evaluate('document.getElementById("log").textContent')).toContain('mousedown');
+ }finally{app?.close();land?.close();if(saved===undefined)delete process.env.XDG_RUNTIME_DIR;else process.env.XDG_RUNTIME_DIR=saved;rmSync(dir,{recursive:true,force:true})}
+},30000);
+
+test('pointer bursts preserve drawing points while batching raster work',async()=>{
+ const child=Bun.spawn([process.execPath,new URL('./fixtures/pointer-paint-batching.js',import.meta.url).pathname],{stdout:'pipe',stderr:'pipe'});
+ const [exit,stderr]=await Promise.all([child.exited,new Response(child.stderr).text()]);
+ expect(stderr).toBe('');expect(exit).toBe(0);
+},15000);

package/test/qml-canvas.test.js

@@ -0,0 +1,21 @@
+import {test,expect} from 'bun:test';
+import {RendererHost} from '../lib/renderer/host.js';
+test('QML Canvas paints into HTML canvas and repaints after resize and property changes',async()=>{
+ const host=new RendererHost({timeout:20000});
+ try{
+  await host.start();
+  await host.call('loadDocument',{url:'data:text/x-qml,canvas',contentType:'text/x-qml',source:`import QtQuick
+Canvas {id: c; width:16;height:16;property color ink:"red"
+onInkChanged:requestPaint()
+onPaint:{var ctx=getContext("2d");ctx.reset();ctx.fillStyle=ink;ctx.fillRect(0,0,width,height);globalThis.paints=(globalThis.paints||0)+1;}
+Component.onCompleted:globalThis.canvasObject=c
+}`});
+  await host.call('whenLoaded');
+  for(let i=0;i<100;i++){if(await host.call('evaluate','globalThis.paints>0'))break;await Bun.sleep(10);}
+  expect(await host.call('evaluate','Array.from(document.querySelector("canvas").getContext("2d").getImageData(8,8,1,1).data)')).toEqual([255,0,0,255]);
+  await host.call('evaluate','canvasObject.ink="blue";canvasObject.width=32;canvasObject.requestPaint();canvasObject.requestPaint()');
+  for(let i=0;i<100;i++){if(await host.call('evaluate','document.querySelector("canvas").width===32 && globalThis.paints>1'))break;await Bun.sleep(10);}
+  expect(await host.call('evaluate','Array.from(document.querySelector("canvas").getContext("2d").getImageData(24,8,1,1).data)')).toEqual([0,0,255,255]);
+  expect(await host.call('evaluate','canvasObject.available')).toBe(true);
+ }finally{host.close();}
+},20000);