buninu-browser 0.3.0 → 0.5.0

package/test/qml-socket.test.js

@@ -0,0 +1,60 @@
+import {test,expect} from 'bun:test';
+import {mkdtemp,rm} from 'node:fs/promises';
+import {createServer} from 'node:net';
+import {createBrowser} from '../lib/headless-shell.js';
+
+test('local QML Socket connects, splits UTF-8 messages, writes and disconnects',async()=>{
+ const dir=await mkdtemp('/tmp/qml-socket-');
+ const peers=new Set(); let received='';
+ const server=createServer(socket=>{
+  peers.add(socket);socket.on('close',()=>peers.delete(socket));
+  socket.on('data',data=>{received+=data;});
+  const bytes=Buffer.from('你好\nsecond\n');
+  socket.write(bytes.subarray(0,2));setTimeout(()=>socket.write(bytes.subarray(2)),20);
+ });
+ await new Promise(r=>server.listen(dir+'/engine.sock',r));
+ const browser=await createBrowser({spareRenderer:false});
+ try{
+  await Bun.write(dir+'/main.qml',`import QtQuick\nimport QtQuick.Window\nimport Quickshell.Io
+Item { Socket { id: socket; path: ${JSON.stringify(dir+'/engine.sock')}; connected: true
+ parser: SplitParser { onRead: data => { globalThis.messages.push(data); socket.write(data + "!"); socket.flush(); } }
+ onConnectedChanged: (globalThis.states ??= []).push(connected)
+ Component.onCompleted: { globalThis.messages=[]; globalThis.states=[]; globalThis.sock=socket; }
+} }`);
+  await browser.context.navigate('file://'+dir+'/main.qml');
+  for(let i=0;i<100;i++){if(await browser.context.evaluate('globalThis.messages?.length===2'))break;await Bun.sleep(20);}
+  expect(await browser.context.evaluate('messages')).toEqual(['你好','second']);
+  expect(await browser.context.evaluate('sock.connected')).toBe(true);
+  for(let i=0;i<100&&!received.includes('second!');i++)await Bun.sleep(10);
+  expect(received).toBe('你好!second!');
+  await browser.context.evaluate('sock.connected=false');
+  for(let i=0;i<100&&peers.size;i++)await Bun.sleep(10);
+  expect(peers.size).toBe(0);
+  expect(await browser.context.evaluate('sock.connected')).toBe(false);
+ }finally{browser.close();for(const p of peers)p.destroy();await new Promise(r=>server.close(r));await rm(dir,{recursive:true,force:true});}
+},20000);
+
+test('Socket failure can reconnect and navigation closes the live connection',async()=>{
+ const dir=await mkdtemp('/tmp/qml-socket-retry-');
+ const peers=new Set();
+ const server=createServer(s=>{peers.add(s);s.on('close',()=>peers.delete(s));});
+ const browser=await createBrowser({spareRenderer:false});
+ try{
+  await Bun.write(dir+'/main.qml',`import QtQuick\nimport Quickshell.Io
+Item { Socket {id:s; path:${JSON.stringify(dir+'/retry.sock')};connected:true
+onError:error=>{globalThis.socketError=error;}
+Component.onCompleted:globalThis.socketObject=s
+} }`);
+  await browser.context.navigate('file://'+dir+'/main.qml');
+  for(let i=0;i<100;i++){if(await browser.context.evaluate('!!globalThis.socketError'))break;await Bun.sleep(10);}
+  expect(await browser.context.evaluate('socketObject.connected')).toBe(false);
+  expect(await browser.context.evaluate('socketError')).toBe('ENOENT');
+  await new Promise(r=>server.listen(dir+'/retry.sock',r));
+  await browser.context.evaluate('socketObject.connected=true');
+  for(let i=0;i<100;i++){if(await browser.context.evaluate('socketObject.connected'))break;await Bun.sleep(10);}
+  expect(await browser.context.evaluate('socketObject.connected')).toBe(true);
+  await browser.context.navigate('data:text/html,<p>ordinary page</p>');
+  for(let i=0;i<100&&peers.size;i++)await Bun.sleep(10);
+  expect(peers.size).toBe(0);
+ }finally{browser.close();for(const p of peers)p.destroy();await new Promise(r=>server.close(r));await rm(dir,{recursive:true,force:true});}
+},20000);

package/test/qml-software-shader.test.js

@@ -0,0 +1,55 @@
+import {test,expect,beforeAll} from 'bun:test';
+import init from '../usr/lib/canvaskit/canvaskit.js';
+import {compileFragment,makeFragmentShader,translateFragment} from '../lib/qml/shader/fragment.js';
+let kit;
+beforeAll(async()=>{kit=await init({wasmBinary:await Bun.file(new URL('../usr/lib/canvaskit/canvaskit.wasm',import.meta.url)).arrayBuffer()});});
+const header=`#version 440
+layout(location=0) in vec2 qt_TexCoord0;
+layout(location=0) out vec4 fragColor;
+layout(std140,binding=0) uniform buf {mat4 qt_Matrix;float qt_Opacity;};`;
+function pixel(compiled,options,x=0,y=0){
+ const surface=kit.MakeSurface(options.width,options.height),paint=new kit.Paint();
+ const shader=makeFragmentShader(compiled,options);
+ try{
+  paint.setShader(shader);surface.getCanvas().drawRect(kit.XYWHRect(0,0,options.width,options.height),paint);surface.flush();
+  const image=surface.makeImageSnapshot();
+  try{return Array.from(image.readPixels(x,y,{width:1,height:1,colorType:kit.ColorType.RGBA_8888,alphaType:kit.AlphaType.Unpremul,colorSpace:kit.ColorSpace.SRGB}));}finally{image.delete();}
+ }finally{paint.delete();shader.delete();surface.delete();}
+}
+test('Qt fragment uniform and coordinate mapping executes on CPU raster surface',()=>{
+ const c=compileFragment(kit,header+'uniform int mode; void main(){fragColor=mode==2?vec4(qt_TexCoord0,0,1):vec4(0);fragColor*=qt_Opacity;}');
+ try{const p=pixel(c,{width:16,height:16,uniforms:{mode:2}},8,8);expect(p).toEqual([135,135,0,255]);}finally{c.effect.delete();}
+});
+test('CPU child texture sampling and textureSize preserve source pixel dimensions',()=>{
+ 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,0,255,0,255]),8);
+ const child=image.makeShaderOptions(kit.TileMode.Clamp,kit.TileMode.Clamp,kit.FilterMode.Nearest,kit.MipmapMode.None);
+ const c=compileFragment(kit,header+'layout(binding=1) uniform sampler2D source;void main(){if(textureSize(source,0)!=ivec2(2,1)){fragColor=vec4(0,0,1,1);return;}fragColor=texture(source,qt_TexCoord0);}');
+ try{
+  const options={width:4,height:2,textures:{source:{shader:child,width:2,height:1}}};
+  expect(pixel(c,options,0,0)).toEqual([255,0,0,255]);
+  expect(pixel(c,options,3,0)).toEqual([0,255,0,255]);
+  expect(()=>makeFragmentShader(c,{width:1,height:1})).toThrow('Missing shader texture');
+ }finally{c.effect.delete();child.delete();image.delete();}
+});
+test('unsupported shader interfaces fail rather than rendering a success placeholder',()=>{
+ expect(()=>translateFragment('#include "missing"')).toThrow('preprocessor');
+ expect(()=>translateFragment(header+'void main(){discard;}')).toThrow('Unsupported');
+ expect(()=>compileFragment(kit,header+'void main(){fragColor=unknown();}')).toThrow('compilation failed');
+});
+
+import {deflateSync} from 'node:zlib';
+import {fragmentSource} from '../lib/qml/shader/qsb.js';
+function qsb(source){
+ const text=Buffer.from(source),head=Buffer.alloc(28),tail=Buffer.from([0,0,0,4,109,97,105,110]);
+ [9,4,1,150,0,0,text.length].forEach((n,i)=>head.writeUInt32BE(n,i*4));
+ const raw=Buffer.concat([head,text,tail]),size=Buffer.alloc(4);size.writeUInt32BE(raw.length);
+ return Buffer.concat([size,deflateSync(raw)]);
+}
+test('QSB source records are validated and generated struct uniforms compile',()=>{
+ const source='#version 150\nstruct buf {float gain;};uniform buf _12;out vec4 fragColor;void main(){fragColor=vec4(_12.gain,0,0,1);}';
+ expect(fragmentSource(qsb(source))).toBe(source);
+ const c=compileFragment(kit,fragmentSource(qsb(source)));
+ try{expect(pixel(c,{width:1,height:1,uniforms:{gain:1}})).toEqual([255,0,0,255]);}finally{c.effect.delete();}
+ expect(()=>fragmentSource(qsb(source).subarray(0,10))).toThrow();
+ expect(()=>fragmentSource(qsb(source.replace('#version 150','#version 100')))).toThrow('no supported');
+});

package/test/qml-style-updates.test.js

@@ -0,0 +1,124 @@
+import { test, expect } from 'bun:test';
+import { RendererHost } from '../lib/renderer/host.js';
+
+test('QML style updates preserve final overrides and clear conditional styles', async () => {
+  const host = new RendererHost({ timeout: 20000 });
+  try {
+    await host.start();
+    await host.call('loadDocument', {
+      url: 'data:text/x-qml,styles',
+      contentType: 'text/x-qml',
+      source: `import QtQuick
+Rectangle {
+ id: root; width: 320; height: 160; property bool changed: false
+ onClicked: { changed = !changed; }
+ Rectangle { id: box; width: root.changed ? 120 : 80; height: 30; x: 10
+  opacity: root.changed ? 0.5 : 1; color: root.changed ? "blue" : "red"
+  gradient: root.changed ? null : ramp
+  Gradient { id: ramp; GradientStop { position: 0; color: "red" } GradientStop { position: 1; color: "blue" } }
+ }
+ Text { id: label; y:40; width:80; height:30; text:"long long text"
+  elide: root.changed ? Text.ElideNone : Text.ElideRight
+  verticalAlignment: Text.AlignVCenter
+ }
+}`,
+    });
+    await host.call('whenLoaded');
+    const styles = () =>
+      host.call(
+        'evaluate',
+        `JSON.stringify({
+      width:box.style.width,opacity:box.style.opacity,
+      gradient:box.style.backgroundImage,overflow:label.style.overflow,
+      whiteSpace:label.style.whiteSpace,lineHeight:label.style.lineHeight,
+      elide:label.style.textOverflow
+    })`
+          .replaceAll('box.style', 'document.getElementById("box").style')
+          .replaceAll('label.style', 'document.getElementById("label").style'),
+      );
+    const before = JSON.parse(await styles());
+    expect(before.width).toBe('80px');
+    expect(before.gradient).toContain('linear-gradient');
+    expect(before.elide).toBe('ellipsis');
+    expect(before.whiteSpace).toBe('nowrap');
+    expect(before.lineHeight).toBe('30px');
+    await host.call(
+      'evaluate',
+      'document.getElementById("box").style.zIndex="99";document.getElementById("root").click()',
+    );
+    expect(
+      await host.call(
+        'evaluate',
+        'document.getElementById("box").style.zIndex',
+      ),
+    ).toBe('0');
+    const after = JSON.parse(await styles());
+    expect(after.width).toBe('120px');
+    expect(after.opacity).toBe('0.5');
+    expect(after.gradient).toBe('none');
+    expect(after.elide).toBe('clip');
+    expect(after.whiteSpace).toBe('pre');
+    expect(after.overflow).toBe('visible');
+    expect(after.lineHeight).toBe('30px');
+    await host.call('evaluate', 'document.getElementById("root").click()');
+    expect(JSON.parse(await styles())).toEqual(before);
+  } finally {
+    host.close();
+  }
+}, 30000);
+
+// Qt retains the long Wrap enum spelling used by styled code viewers.
+test('StyledText can toggle WrapAtWordBoundaryOrAnywhere and grow its line count', async () => {
+  const host = new RendererHost({ timeout: 20000 });
+  try {
+    await host.start();
+    await host.call('loadDocument', {
+      url: 'data:text/x-qml,wrap-alias', contentType: 'text/x-qml',
+      source: `import QtQuick
+Rectangle {
+ id: root; width: 320; height: 200; property bool wrapped: false
+ onClicked: wrapped = !wrapped
+ Text { id: code; width: 90; textFormat: Text.StyledText
+  text: "<font color='red'>const</font> averylongidentifierwithoutspaces = 123456789;"
+  wrapMode: root.wrapped ? Text.WrapAtWordBoundaryOrAnywhere : Text.NoWrap
+ }
+ Text { id: count; y: 180; text: code.lineCount }
+}`,
+    });
+    await host.call('whenLoaded');
+    const read = () => host.call('evaluate', `({
+      lines: Number(document.getElementById('count').textContent),
+      whiteSpace: document.getElementById('code').style.whiteSpace,
+      overflowWrap: document.getElementById('code').style.overflowWrap
+    })`);
+    expect((await read()).lines).toBe(1);
+    await host.call('evaluate', "document.getElementById('root').click()");
+    const wrapped = await read();
+    expect(wrapped.lines).toBeGreaterThan(1);
+    expect(wrapped.whiteSpace).toBe('pre-wrap');
+    expect(wrapped.overflowWrap).toBe('anywhere');
+    await host.call('evaluate', "document.getElementById('root').click()");
+    expect((await read()).lines).toBe(1);
+  } finally { host.close(); }
+}, 30000);
+
+test('Qt.binding attaches to a default property and a plain write detaches it', async () => {
+ const host = new RendererHost({timeout:20000});
+ try {
+  await host.start();
+  await host.call('loadDocument',{url:'data:text/x-qml,default-binding',contentType:'text/x-qml',source:`import QtQuick
+Item {id:root;width:100;height:100;property bool shown:true
+ Rectangle {id:box;width:40;height:40}
+ Component.onCompleted:box.visible=Qt.binding(function(){return root.shown})
+ Button {id:toggle;onClicked:root.shown=!root.shown}
+ Button {id:detach;onClicked:box.visible=true}
+}`});
+  await host.call('whenLoaded');
+  const display=()=>host.call('evaluate','document.getElementById("box").style.display');
+  const click=id=>host.call('evaluate',`document.getElementById('${id}').click()`);
+  expect(await display()).toBe('block');
+  await click('toggle');expect(await display()).toBe('none');
+  await click('toggle');expect(await display()).toBe('block');
+  await click('detach');await click('toggle');expect(await display()).toBe('block');
+ }finally{host.close();}
+},30000);

package/test/qml-textures.test.js

@@ -0,0 +1,66 @@
+import { test, expect } from 'bun:test';
+import { mkdtempSync, rmSync } from 'node:fs';
+import { createBrowser } from '../lib/headless-shell.js';
+import { loadGraphics } from '../lib/renderer/page-renderer.js';
+
+test('ShaderEffectSource freezes, updates, hides sources and releases Loader references', async () => {
+  const dir = mkdtempSync('/tmp/qml-textures-');
+  const browser = await createBrowser({ spareRenderer: false });
+  const { CanvasKit: kit } = await loadGraphics();
+  async function pixel(x,y) {
+    const image=kit.MakeImageFromEncoded(Buffer.from(await browser.context.screenshot({format:'png'}),'base64'));
+    try { return [...image.readPixels(x,y,{width:1,height:1,colorType:kit.ColorType.RGBA_8888,alphaType:kit.AlphaType.Unpremul,colorSpace:kit.ColorSpace.SRGB})]; }
+    finally { image.delete(); }
+  }
+  const run = code => browser.context.evaluate(code);
+  async function until(fn) { for(let i=0;i<50;i++){if(await fn())return;await Bun.sleep(20);}throw Error(await run('document.body.innerText+JSON.stringify(errors)')); }
+  try {
+    await Bun.write(dir+'/main.qml', `import QtQuick
+Rectangle {width:240;height:160;color:"white"
+ property int frames:0
+ Rectangle {id:source;width:60;height:40;color:"red"}
+ Loader {id:layer;x:80;width:60;height:40;active:true
+  sourceComponent:ShaderEffectSource {sourceItem:source;hideSource:true;live:false;onScheduledUpdateCompleted:frames+=1}}
+ Loader {id:mirror;x:160;width:60;height:40;active:false;sourceComponent:ShaderEffectSource {sourceItem:source;hideSource:true;live:false}}
+ Text {id:status;y:120;text:frames+":"+layer.active}
+ Button {id:toggle;x:210;y:80;text:"hide";onClicked:layer.item.hideSource=!layer.item.hideSource}
+ Button {id:blue;y:80;text:"blue";onClicked:source.color=source.color==="blue"?"red":"blue"}
+ Button {id:update;x:70;y:80;text:"update";onClicked:layer.item.scheduleUpdate()}
+ Button {id:live;x:140;y:80;text:"live";onClicked:layer.item.live=true}
+ Button {id:mirrorOn;y:140;text:"mirror";onClicked:mirror.active=true}
+ Button {id:clear;x:70;y:140;text:"clear";onClicked:mirror.item.sourceItem=null}
+ Button {id:release;x:140;y:120;text:"release";onClicked:layer.active=false}
+}`);
+    await browser.context.addInitScript('globalThis.errors=[];addEventListener("error",e=>errors.push(String(e.error?.stack||e.message)))');
+    await browser.context.navigate(Bun.pathToFileURL(dir+'/main.qml').href);
+    await until(async()=> (await run('document.getElementById("status")?.textContent'))?.startsWith('1:'));
+    expect(await pixel(5,5)).toEqual([255,255,255,255]);
+    expect(await pixel(85,5)).toEqual([255,0,0,255]);
+    await run('document.getElementById("toggle").click()');await Bun.sleep(30);
+    expect(await pixel(5,5)).toEqual([255,0,0,255]);
+    await run('document.getElementById("toggle").click()');await Bun.sleep(30);
+    expect(await pixel(5,5)).toEqual([255,255,255,255]);
+    await run('document.getElementById("blue").click()');await Bun.sleep(50);
+    expect(await pixel(85,5)).toEqual([255,0,0,255]);
+    await run('document.getElementById("update").click()');
+    await until(async()=> (await run('document.getElementById("status").textContent')).startsWith('2:'));
+    expect(await pixel(85,5)).toEqual([0,0,255,255]);
+    await run('document.getElementById("live").click()');
+    await until(async()=> (await run('document.getElementById("status").textContent')).startsWith('3:'));
+    await run('document.getElementById("blue").click()');
+    await until(async()=> (await run('document.getElementById("status").textContent')).startsWith('4:'));
+    expect(await pixel(85,5)).toEqual([255,0,0,255]);
+    await Bun.sleep(120);
+    expect(await run('document.getElementById("status").textContent')).toBe('4:true');
+    await run('document.getElementById("mirrorOn").click()');
+    await until(async()=> (await pixel(165,5))[1]===0);
+    await run('document.getElementById("release").click()');await Bun.sleep(30);
+    expect(await pixel(5,5)).toEqual([255,255,255,255]);
+    expect(await pixel(165,5)).toEqual([255,0,0,255]);
+    await run('document.getElementById("clear").click()');await Bun.sleep(30);
+    expect(await pixel(165,5)).toEqual([255,255,255,255]);
+    expect(await pixel(5,5)).toEqual([255,0,0,255]);
+    expect(await pixel(85,5)).toEqual([255,255,255,255]);
+    expect(await run('errors')).toEqual([]);
+  } finally { browser.close();rmSync(dir,{recursive:true,force:true}); }
+},30000);

package/test/qml-views.test.js

@@ -0,0 +1,332 @@
+import { test, expect } from 'bun:test';
+import { RendererHost } from '../lib/renderer/host.js';
+const wait = async (fn, predicate) => {
+  let value;
+  for (let i = 0; i < 80; i++) {
+    value = await fn();
+    if (predicate(value)) return value;
+    await Bun.sleep(15);
+  }
+  throw Error('View did not settle: ' + JSON.stringify(value));
+};
+test('ListView virtualizes a large DelegateModel, scrolls, updates count and reuses delegates', async () => {
+  const host = new RendererHost({ timeout: 20000 });
+  try {
+    await host.start();
+    await host.call('loadDocument', {
+      url: 'data:text/x-qml,view',
+      contentType: 'text/x-qml',
+      source: `
+import QtQuick
+import QtQml.Models
+Item {
+ id:root;width:300;height:200
+ ListView {id:view;width:200;height:100;reuseItems:true
+  model:DelegateModel {id:rows;model:100000000;filterOnGroup:"shown";groups:DelegateModelGroup {name:"shown";includeByDefault:false}
+   Component.onCompleted:items.addGroups(0,2000,"shown")
+  }
+  delegate:Text {required property int index;text:"row "+index;height:20;width:200}
+ }
+ Text {id:count;y:120;text:view.count}
+ Button {id:scroll;y:150;onClicked:view.positionViewAtIndex(1000,ListView.Beginning)}
+ Button {id:shrink;x:100;y:150;onClicked:{rows.groups.removeGroups(5,1995,"shown");view.positionViewAtBeginning()}}
+}`,
+    });
+    await host.call('whenLoaded');
+    const read = async () =>
+      JSON.parse(
+        await host.call(
+          'evaluate',
+          'JSON.stringify({count:document.getElementById("count").textContent,text:document.body.innerText,n:document.querySelectorAll("[data-qml-type=Text]").length})',
+        ),
+      );
+    await wait(read, (v) => v.count === '2000');
+    let result = await read();
+    expect(result.n).toBeLessThan(20);
+    expect(result.text).toContain('row 0');
+    await host.call('evaluate', 'document.getElementById("scroll").click()');
+    result = await wait(read, (v) => v.text.includes('row 1000'));
+    expect(result.n).toBeLessThan(25);
+    await host.call('evaluate', 'document.getElementById("shrink").click()');
+    result = await wait(
+      read,
+      (v) => v.count === '5' && v.text.includes('row 0'),
+    );
+    expect(result.n).toBeLessThan(25);
+  } finally {
+    host.close();
+  }
+}, 30000);
+
+test('Flickable routes default children to contentItem and responds to wheel without moving explicit overlays', async () => {
+  const host = new RendererHost({ timeout: 20000 });
+  try {
+    await host.start();
+    await host.call('loadDocument', {
+      url: 'data:text/x-qml,flick',
+      contentType: 'text/x-qml',
+      source: `
+import QtQuick
+Flickable {id:root;width:200;height:100;contentWidth:200;contentHeight:500;clip:true
+ Rectangle {id:body;width:parent.width;height:500;color:"red"}
+ Text {id:overlay;parent:root;text:"fixed"}
+ Text {id:status;parent:root;y:20;text:root.contentY+":"+body.parent.height}
+}`,
+    });
+    await host.call('whenLoaded');
+    expect(
+      await host.call(
+        'evaluate',
+        'document.getElementById("body").parentElement.hasAttribute("data-qml-content")',
+      ),
+    ).toBe(true);
+    expect(
+      await host.call(
+        'evaluate',
+        'document.getElementById("overlay").parentElement.id',
+      ),
+    ).toBe('root');
+    await host.call(
+      'evaluate',
+      'document.getElementById("root").dispatchEvent(new WheelEvent("wheel",{deltaY:50,bubbles:true,cancelable:true}))',
+    );
+    await wait(
+      () =>
+        host.call('evaluate', 'document.getElementById("status").textContent'),
+      (v) => v === '50:500',
+    );
+    expect(
+      await host.call(
+        'evaluate',
+        'document.getElementById("body").parentElement.style.top',
+      ),
+    ).toBe('-50px');
+  } finally {
+    host.close();
+  }
+}, 30000);
+
+test('empty Loaders, decoration Items and DropAreas do not swallow pointer activation', async () => {
+  const host = new RendererHost({ timeout: 20000 });
+  try {
+    await host.start();
+    await host.call('loadDocument', {
+      url: 'data:text/x-qml,pointer',
+      contentType: 'text/x-qml',
+      source: `
+import QtQuick
+Item {width:200;height:100;property int clicks:0
+ Rectangle {width:80;height:40;color:"red";TapHandler {onTapped:clicks++}}
+ DropArea {anchors.fill:parent}
+ Loader {anchors.fill:parent;active:false;z:3}
+ Item {anchors.fill:parent;z:4}
+ Text {id:status;y:50;text:clicks}
+}`,
+    });
+    await host.call('whenLoaded');
+    await host.call('click', 20, 20);
+    await wait(
+      () =>
+        host.call('evaluate', 'document.getElementById("status").textContent'),
+      (v) => v === '1',
+    );
+  } finally {
+    host.close();
+  }
+}, 30000);
+
+test('XmlListModel reads XBEL attributes through Qt role indices and reports unsupported queries', async () => {
+  const host = new RendererHost({ timeout: 20000 });
+  try {
+    await host.start();
+    await host.call('loadDocument', {
+      url: 'data:text/x-qml,xml',
+      contentType: 'text/x-qml',
+      source: `
+import QtQuick
+import QtQml.XmlListModel
+Item {
+ XmlListModel {id:model;query:"/xbel/bookmark";xml:"<xbel><bookmark href='file:///tmp/a' visited='2026-10-22'/><bookmark href='file:///tmp/b'/></xbel>"
+  XmlListModelRole {name:"href";attributeName:"href"}
+  XmlListModelRole {name:"visited";attributeName:"visited"}
+ }
+ Text {id:status;text:model.status+":"+model.count+":"+model.data(model.index(1,0),Qt.UserRole)}
+ Button {id:bad;onClicked:model.query="//bookmark[@bad]"}
+}`,
+    });
+    await host.call('whenLoaded');
+    await wait(
+      () =>
+        host.call('evaluate', 'document.getElementById("status").textContent'),
+      (v) => v === '1:2:file:///tmp/b',
+    );
+    await host.call('evaluate', 'document.getElementById("bad").click()');
+    await wait(
+      () =>
+        host.call('evaluate', 'document.getElementById("status").textContent'),
+      (v) => v.startsWith('3:0:'),
+    );
+  } finally {
+    host.close();
+  }
+}, 30000);
+
+test('unchanged Flea StableModel resizes a virtualized view synchronously and warms reusable rows', async () => {
+  const { mkdtempSync, rmSync } = await import('node:fs');
+  const dir = mkdtempSync('/tmp/qml-stable-model-');
+  const ui = Bun.fileURLToPath(
+    new URL('./fixtures/qml/flea-theme/ui/', import.meta.url),
+  );
+  await Bun.write(
+    dir + '/main.qml',
+    `import QtQuick
+import ${JSON.stringify(ui)} as Flea
+Item {width:300;height:200;property int total:100
+ ListView {id:view;width:200;height:100;reuseItems:true
+  model:Flea.StableModel {id:stable;view:view;total:parent.parent.total;warm:true;warmRows:20}
+  delegate:Text {required property int index;width:200;height:20;text:"row "+index}
+ }
+ Text {id:status;y:120;text:view.count+":"+view.currentIndex}
+ Button {id:grow;y:150;onClicked:{total=105;stable.resize()}}
+ Button {id:scroll;x:80;y:150;onClicked:view.positionViewAtIndex(50,ListView.Beginning)}
+}`,
+  );
+  const { createBrowser } = await import('../lib/headless-shell.js');
+  const browser = await createBrowser({ spareRenderer: false });
+  try {
+    await browser.context.navigate(Bun.pathToFileURL(dir + '/main.qml').href);
+    await wait(
+      () =>
+        browser.context.evaluate(
+          'document.getElementById("status").textContent',
+        ),
+      (v) => v === '100:0',
+    );
+    await browser.context.evaluate('document.getElementById("scroll").click()');
+    await wait(
+      () => browser.context.evaluate('document.body.innerText'),
+      (v) => v.includes('row 50'),
+    );
+    await browser.context.evaluate('document.getElementById("grow").click()');
+    await wait(
+      () =>
+        browser.context.evaluate(
+          'document.getElementById("status").textContent',
+        ),
+      (v) => v === '105:0',
+    );
+    expect(
+      await browser.context.evaluate(
+        'document.querySelectorAll("[data-qml-type=Text]").length',
+      ),
+    ).toBeLessThan(30);
+  } finally {
+    browser.close();
+    rmSync(dir, { recursive: true, force: true });
+  }
+}, 30000);
+
+test('passive HoverHandler observes a decoration without intercepting the button beneath', async () => {
+  const host = new RendererHost({ timeout: 20000 });
+  try {
+    await host.start();
+    await host.call('loadDocument', {
+      url: 'data:text/x-qml,hover',
+      contentType: 'text/x-qml',
+      source: `
+import QtQuick
+Item {width:200;height:120;property int clicks:0
+ Rectangle {width:80;height:40;color:"red";TapHandler {onTapped:clicks++}}
+ Item {width:80;height:40;z:5;HoverHandler {id:hover}}
+ Text {id:status;y:60;text:hover.hovered+":"+clicks}
+}`,
+    });
+    await host.call('whenLoaded');
+    await host.call('move', 20, 20);
+    await host.call('click', 20, 20);
+    await wait(
+      () =>
+        host.call('evaluate', 'document.getElementById("status").textContent'),
+      (v) => v === 'true:1',
+    );
+    await host.call('move', 110, 80);
+    await wait(
+      () =>
+        host.call('evaluate', 'document.getElementById("status").textContent'),
+      (v) => v === 'false:1',
+    );
+  } finally {
+    host.close();
+  }
+}, 30000);
+
+test('turning reuseItems off and back on in one handler immediately drains parked delegates', async () => {
+  const host = new RendererHost({ timeout: 20000 });
+  try {
+    await host.start();
+    await host.call('loadDocument', {
+      url: 'data:text/x-qml,pool',
+      contentType: 'text/x-qml',
+      source: `import QtQuick
+Item {width:300;height:200
+ ListView {id:view;width:200;height:100;reuseItems:true;cacheBuffer:0;model:100
+  delegate:Text {required property int index;width:200;height:20;text:"row "+index}
+ }
+ Button {id:park;y:120;onClicked:{view.displayMarginEnd=300;view.forceLayout();view.displayMarginEnd=0;view.forceLayout()}}
+ Button {id:drain;x:80;y:120;onClicked:{view.reuseItems=false;view.reuseItems=true}}
+}`,
+    });
+    await host.call('whenLoaded');
+    const count = () =>
+      host.call(
+        'evaluate',
+        'document.querySelectorAll("[data-qml-type=Text]").length',
+      );
+    await host.call('evaluate', 'document.getElementById("park").click()');
+    const parked = await count();
+    expect(parked).toBeGreaterThan(10);
+    await host.call('evaluate', 'document.getElementById("drain").click()');
+    expect(await count()).toBeLessThan(10);
+  } finally {
+    host.close();
+  }
+}, 30000);
+
+test('replacing a numeric ListView model resets its scroll before creating new delegates',async()=>{
+ const host=new RendererHost({timeout:20000});
+ try{
+  await host.start();await host.call('loadDocument',{url:'data:text/x-qml,reset',contentType:'text/x-qml',source:`import QtQuick
+Item {width:300;height:200
+ ListView {id:view;width:200;height:100;model:100;delegate:Text {required property int index;text:"row "+index;width:200;height:20}}
+ Text {id:offset;y:110;text:String(view.contentY)+","+view.model+","+view.count}
+ Button {id:scroll;y:140;onClicked:view.positionViewAtIndex(50,ListView.Beginning)}
+ Button {id:replace;x:100;y:140;onClicked:view.model=80}
+}`});await host.call('whenLoaded');
+  await host.call('evaluate','document.getElementById("scroll").click()');
+  await wait(()=>host.call('evaluate','document.getElementById("offset").textContent'),v=>Number(v.split(",")[0])>0);
+  await host.call('evaluate','document.getElementById("replace").click()');
+  await wait(()=>host.call('evaluate','document.getElementById("offset").textContent'),v=>Number(v.split(",")[0])===0);
+  expect(await host.call('evaluate','document.body.innerText')).toContain('row 0');
+ }finally{host.close();}
+},30000);
+
+test('ListView positions unequal delegates by measured extent and updates following rows when a later row grows',async()=>{
+ const host=new RendererHost({timeout:20000});
+ try{
+  await host.start();await host.call('loadDocument',{url:'data:text/x-qml,variable',contentType:'text/x-qml',source:`import QtQuick
+Item {id:root;width:400;height:400;property int extra:0
+ ListView {id:view;width:200;height:300;spacing:5;model:[20,80,35,60]
+  delegate:Rectangle {required property int index;required property var modelData;width:200;height:modelData+(index===1?root.extra:0)}
+ }
+ Text {id:report;x:220}
+ Button {id:inspect;y:330;onClicked:report.text=JSON.stringify({rows:[0,1,2,3].map(i=>{var c=view.itemAtIndex(i);return c?[c.y,c.height]:null}),index:view.indexAt(10,110),gap:view.indexAt(10,22),content:view.contentHeight})}
+ Button {id:grow;x:100;y:330;onClicked:root.extra=50}
+}`});await host.call('whenLoaded');
+  const read=async()=>{await host.call('evaluate','document.getElementById("inspect").click()');return JSON.parse(await host.call('evaluate','document.getElementById("report").textContent'));};
+  let state=await wait(read,s=>s.rows[3]?.[0]===150);
+  expect(state.rows).toEqual([[0,20],[25,80],[110,35],[150,60]]);expect(state.index).toBe(2);expect(state.gap).toBe(-1);
+  await host.call('evaluate','document.getElementById("grow").click()');
+  state=await wait(read,s=>s.rows[3]?.[0]===200);
+  expect(state.rows).toEqual([[0,20],[25,130],[160,35],[200,60]]);expect(state.content).toBe(265);
+ }finally{host.close();}
+},30000);