buninu-browser 0.3.0 → 0.5.0

package/test/qml-flea-navigation-timing.test.js

@@ -0,0 +1,147 @@
+// Opt-in integration: unmodified packaged QML and the real installed Flea binary.
+import { test, expect } from 'bun:test';
+import { join } from 'node:path';
+import {
+  mkdirSync,
+  writeFileSync,
+  readdirSync,
+  statSync,
+  unlinkSync,
+} from 'node:fs';
+import { createBrowser } from '../lib/headless-shell.js';
+import { fleaSandbox } from './helpers/flea-sandbox.js';
+const root = process.env.BUNINU_FLEA_ROOT,
+  omarchy = process.env.BUNINU_OMARCHY_ROOT,
+  binary = process.env.FLEA_BIN;
+test.skipIf(!root || !omarchy || !binary)(
+  'measure real Flea directory navigation and raw capture',
+  async () => {
+    const sandbox = fleaSandbox(root, omarchy),
+      oldPath = process.env.FLEA_PATH;
+    const home = sandbox.values.HOME,
+      folder = join(home, 'Documents');
+    mkdirSync(folder);
+    writeFileSync(join(home, 'hello.txt'), 'hello');
+    writeFileSync(join(folder, 'inside.txt'), 'inside');
+    process.env.FLEA_PATH = home;
+    let browser;
+    try {
+      browser = await createBrowser({
+        spareRenderer: false,
+        rendererTimeout: 30000,
+      });
+      await browser.context.addInitScript(
+        `globalThis.qmlErrors=[];addEventListener('error',e=>qmlErrors.push(String(e.error?.stack||e.message)));const original=console.error;console.error=(...args)=>{qmlErrors.push(args.map(String).join(' '));original(...args);};`,
+      );
+      if (process.env.BUNINU_QML_TIMING_TRACE)
+        await browser.context.addInitScript(`
+        globalThis.qmlTiming=[];
+        const stamp=(kind,detail)=>qmlTiming.push({at:Date.now(),kind,detail});
+        stamp('init',!!globalThis.__qmlHost);
+        const microtask=globalThis.queueMicrotask;
+        globalThis.queueMicrotask=fn=>microtask(()=>{const start=Date.now();try{return fn();}finally{const ms=Date.now()-start;if(ms>10)stamp('microtask',{ms,fn:String(fn).slice(0,180)});}});
+        const timeout=globalThis.setTimeout;
+        globalThis.setTimeout=(fn,delay,...args)=>timeout(()=>{const start=Date.now();try{return fn(...args);}finally{const ms=Date.now()-start;if(ms>10)stamp('timer',{ms,delay,fn:String(fn).slice(0,180)});}},delay);
+
+        if(globalThis.__qmlHost){
+          const host=globalThis.__qmlHost,run=host.run;
+          for(const name of ['compile','read','write']){
+            const original=host[name];if(!original)continue;
+            host[name]=(...args)=>{const start=Date.now();try{return original(...args);}finally{const ms=Date.now()-start;if(ms>10)stamp('host-'+name,{ms,path:args[0]});}};
+          }
+
+          host.run=(command,callback,options={})=>{
+            const traced={...options};
+            for(const channel of ['stdout','stderr']) if(options[channel]) traced[channel]=chunk=>{
+              stamp(channel,String(chunk).slice(0,500));
+              const start=Date.now();try{return options[channel](chunk);}finally{stamp(channel+'-handled',Date.now()-start);}
+            };
+            const child=run.call(host,command,callback,traced),write=child.write;
+            if(write)child.write=text=>{stamp('stdin',String(text).slice(0,500));return write(text);};
+            return child;
+          };
+        }
+        addEventListener('keydown',e=>stamp('keydown',e.key),true);
+      `);
+      await browser.context.navigate(
+        Bun.pathToFileURL(join(sandbox.flea, 'ui/boot/shell.qml')).href,
+      );
+      const text = () => browser.context.evaluate('document.body.innerText');
+      const until = async (predicate) => {
+        for (let n = 0; n < 150; n++) {
+          if (await predicate()) return;
+          await Bun.sleep(40);
+        }
+        throw Error('Flea did not settle: ' + (await text()));
+      };
+      await until(async () => (await text()).includes('hello.txt'));
+      const results = [];
+      for (let i = 0; i < 6; i++) {
+        const entering = i % 2 === 0,
+          key = entering ? 'ArrowRight' : 'ArrowLeft';
+        const start = performance.now();
+        await browser.context.press(key, { code: key });
+        const dispatch = performance.now();
+        for (let n = 0; n < 300; n++) {
+          const content = await text();
+          if (
+            entering
+              ? content.includes('inside.txt') && !content.includes('hello.txt')
+              : content.includes('hello.txt') && !content.includes('inside.txt')
+          )
+            break;
+          if (n === 299) throw Error('Navigation timed out: ' + key);
+          await Bun.sleep(10);
+        }
+        const ready = performance.now();
+        const frame = JSON.parse(
+          await browser.context.screenshot({ format: 'bgra' }),
+        );
+        if (frame.path) unlinkSync(frame.path);
+        const painted = performance.now();
+        results.push({
+          key,
+          dispatchMs: dispatch - start,
+          contentMs: ready - start,
+          captureMs: painted - ready,
+          totalMs: painted - start,
+        });
+        await Bun.sleep(250);
+      }
+      const fsTimes = [];
+      for (let i = 0; i < 20; i++) {
+        const start = performance.now();
+        for (const dir of [home, folder])
+          for (const name of readdirSync(dir)) statSync(join(dir, name));
+        fsTimes.push(performance.now() - start);
+      }
+      const trace = process.env.BUNINU_QML_TIMING_TRACE
+        ? JSON.parse(
+            await browser.context.evaluate('JSON.stringify(qmlTiming)'),
+          )
+        : [];
+      const report = {
+        viewport: '800x600',
+        results,
+        fsReadBothDirsMs: fsTimes,
+        trace,
+      };
+      await Bun.write(
+        '/tmp/flea-navigation-timing.json',
+        JSON.stringify(report, null, 2),
+      );
+      console.log(JSON.stringify(report));
+      // Wait through the upstream prebuild driver's first idle tick too.
+      await Bun.sleep(1500);
+      expect(await browser.context.evaluate('JSON.stringify(qmlErrors)')).toBe(
+        '[]',
+      );
+    } finally {
+      browser?.close();
+      if (oldPath === undefined) delete process.env.FLEA_PATH;
+      else process.env.FLEA_PATH = oldPath;
+      sandbox.close();
+    }
+  },
+  60000,
+);

package/test/qml-flea-preview-backend.test.js

@@ -0,0 +1,53 @@
+import { test, expect } from 'bun:test';
+import { join } from 'node:path';
+import { createBrowser } from '../lib/headless-shell.js';
+import { encodeImage } from '../lib/paint/frame.js';
+import { fleaSandbox } from './helpers/flea-sandbox.js';
+const root=process.env.BUNINU_FLEA_ROOT,omarchy=process.env.BUNINU_OMARCHY_ROOT,binary=process.env.FLEA_BIN;
+test.skipIf(!root||!omarchy||!binary)('official Flea backend opens and switches real text and image previews',async()=>{
+ const sandbox=fleaSandbox(root,omarchy),oldPath=process.env.FLEA_PATH;
+ let browser;
+ try {
+  process.env.FLEA_PATH=sandbox.values.HOME;
+  await Bun.write(join(sandbox.values.HOME,'first.txt'),'First real Flea preview\nDOM textures preserve the previous frame.\n'+'A long preview line.\n'.repeat(150));
+  await Bun.write(join(sandbox.values.HOME,'second.txt'),'Second real Flea preview\nThe official backend loaded this file.\n'+'Another long preview.\n'.repeat(170));
+  const rgba=new Uint8Array(320*160*4);
+  for(let y=0;y<160;y++)for(let x=0;x<320;x++)rgba.set(x<80?[0,100,255,255]:[255,0,0,255],(y*320+x)*4);
+  await Bun.write(join(sandbox.values.HOME,'third.png'),await encodeImage(rgba,320,160));
+  browser=await createBrowser({spareRenderer:false,rendererTimeout:20000});
+  await browser.context.resize(900,600);
+  await browser.context.addInitScript(`globalThis.qmlReaders=[];globalThis.qmlRows=[];let runtime;Object.defineProperty(globalThis,'__qmlRuntime',{get:()=>runtime,set:r=>{runtime=r;const describe=r.describe;r.describe=(v,t,...a)=>{if(t.includes('PreviewText'))qmlReaders.push(v);if(t.includes('Row'))qmlRows.push(v);return describe(v,t,...a)}}});globalThis.errors=[];addEventListener('error',e=>errors.push(String(e.error?.stack||e.message)));const old=console.error;console.error=(...a)=>{errors.push(a.map(String).join(' '));old(...a)};`);
+  await browser.context.navigate(Bun.pathToFileURL(join(sandbox.flea,'ui/boot/shell.qml')).href);
+  const run=code=>browser.context.evaluate(code);
+  async function until(fn){for(let i=0;i<120;i++){if(await fn())return;await Bun.sleep(30);}throw Error(await run('document.body.innerText+JSON.stringify(errors)'));}
+  await until(async()=>(await run('document.body.innerText')).includes('first.txt'));
+  const second=await run(`(()=>{const e=[...document.querySelectorAll('[data-qml-type=Text]')].find(e=>e.textContent==='second.txt'&&e.getBoundingClientRect().width>0);const r=e.getBoundingClientRect();return[r.x+r.width/2,r.y+r.height/2]})()`);
+  await browser.context.click(...second);await run('0');
+  expect(await run(`qmlRows.some(v=>v.row?.n==='second.txt'&&v.selected)`)).toBe(true);
+  const pt=await run(`(()=>{const e=[...document.querySelectorAll('[data-qml-type=Text]')].find(e=>e.textContent==='first.txt'&&e.getBoundingClientRect().width>0);if(!e)throw Error('row missing');const r=e.getBoundingClientRect();return [r.x+r.width/2,r.y+r.height/2]})()`);
+  await browser.context.click(...pt);
+  await browser.context.press(' ',{code:'Space'});
+  await until(async()=>(await run('document.body.innerText')).includes('First real Flea preview'));
+  await until(async()=>!(await run('document.body.innerText')).includes('reading'));
+  await Bun.write('/tmp/flea-real-preview-first.png',Buffer.from(await browser.context.screenshot({format:'png'}),'base64'));
+  await run(`qmlReaders.find(r=>r.active&&r.list).list.contentY=400`);await run('0');
+  expect(await run(`qmlReaders.find(r=>r.active&&r.list).list.contentY`)).toBeGreaterThan(0);
+  await browser.context.press('ArrowDown',{code:'ArrowDown'});
+  await until(async()=>(await run('document.body.innerText')).includes('Second real Flea preview'));
+  await until(async()=>await run(`qmlReaders.some(r=>r.active&&r.path.endsWith('/second.txt')&&r.list&&r.list.contentY===0)`));
+  expect(await run(`qmlReaders.find(r=>r.active&&r.path.endsWith('/second.txt')).list.contentY`)).toBe(0);
+  await Bun.sleep(100);
+  await Bun.write('/tmp/flea-real-preview-second.png',Buffer.from(await browser.context.screenshot({format:'png'}),'base64'));
+  await browser.context.press('ArrowDown',{code:'ArrowDown'});
+  await until(async()=>await run(`[...document.querySelectorAll('img')].some(e=>e.src.endsWith('/third.png')&&e.complete&&e.naturalWidth===320)`));
+  await until(async()=>!(await run('document.body.innerText')).includes('reading'));
+  const png=Buffer.from(await browser.context.screenshot({format:'png'}),'base64');
+  await Bun.write('/tmp/flea-real-preview-image.png',png);
+  const {CanvasKit:kit}=await import('../lib/renderer/page-renderer.js').then(m=>m.loadGraphics());
+  const image=kit.MakeImageFromEncoded(png);
+  try { expect([...image.readPixels(450,300,{width:1,height:1,colorType:kit.ColorType.RGBA_8888,alphaType:kit.AlphaType.Unpremul,colorSpace:kit.ColorSpace.SRGB})]).toEqual([255,0,0,255]); }
+  finally { image.delete(); }
+  expect(await run('errors')).toEqual([]);
+  await browser.context.press('Escape',{code:'Escape'});
+ }finally{browser?.close();if(oldPath===undefined)delete process.env.FLEA_PATH;else process.env.FLEA_PATH=oldPath;sandbox.close();}
+},45000);

package/test/qml-flea-previews.test.js

@@ -0,0 +1,163 @@
+import { test, expect } from 'bun:test';
+import { join } from 'node:path';
+import { createBrowser } from '../lib/headless-shell.js';
+import { fleaSandbox } from './helpers/flea-sandbox.js';
+const flea = process.env.BUNINU_FLEA_ROOT,
+  omarchy = process.env.BUNINU_OMARCHY_ROOT;
+for (const [type, extension, contents, expected] of [
+  [
+    'PreviewText',
+    'txt',
+    Array.from({ length: 80 }, (_, i) => 'example line ' + i).join('\n'),
+    'example line 0',
+  ],
+  ['PreviewText', 'csv', 'Name,Count\nApple,12\nOrange,9\n', 'Apple'],
+  [
+    'PreviewMarkdown',
+    'md',
+    '# Flea preview\n\nA **bold** paragraph.\n\n- First item\n- Second item\n',
+    'Flea preview',
+  ],
+])
+  test.skipIf(!flea || !omarchy)(
+    'unchanged Flea ' + type + ' renders a real .' + extension + ' file',
+    async () => {
+      const sandbox = fleaSandbox(flea, omarchy);
+      let browser;
+      try {
+        const path = join(sandbox.dir, 'sample.' + extension);
+        await Bun.write(path, contents);
+        const file = join(sandbox.dir, 'main.qml');
+        await Bun.write(
+          file,
+          `import QtQuick
+import ${JSON.stringify(join(sandbox.flea, 'ui'))} as Flea
+Rectangle {width:800;height:600;color:Flea.Theme.color.background
+ Flea.${type} {id:preview;anchors.fill:parent;active:true;path:${JSON.stringify(path)};size:${Buffer.byteLength(contents)}}
+}`,
+        );
+        browser = await createBrowser({
+          spareRenderer: false,
+          rendererTimeout: 30000,
+        });
+        await browser.context.addInitScript(
+          `globalThis.qmlErrors=[];addEventListener('error',e=>qmlErrors.push(String(e.error?.stack||e.message)));const old=console.error;console.error=(...args)=>{qmlErrors.push(args.map(String).join(' '));old(...args);};`,
+        );
+        await browser.context.navigate(Bun.pathToFileURL(file).href);
+        let text = '';
+        for (let i = 0; i < 150; i++) {
+          text = await browser.context.evaluate('document.body.innerText');
+          if (text.includes(expected)) break;
+          await Bun.sleep(40);
+        }
+        expect(
+          await browser.context.evaluate('JSON.stringify(qmlErrors)'),
+        ).toBe('[]');
+        expect(text).toContain(expected);
+        await Bun.write(
+          '/tmp/buninu-flea-preview-' + extension + '.png',
+          Buffer.from(
+            await browser.context.screenshot({ format: 'png' }),
+            'base64',
+          ),
+        );
+      } finally {
+        browser?.close();
+        sandbox.close();
+      }
+    },
+    60000,
+  );
+
+for (const extension of ['svg', 'png'])
+  test.skipIf(!flea || !omarchy)(
+    'unchanged Flea PreviewImage loads, zooms and resets a real ' +
+      extension +
+      ' image',
+    async () => {
+      const sandbox = fleaSandbox(flea, omarchy);
+      let browser;
+      try {
+        const path = join(sandbox.dir, 'sample.' + extension);
+        if (extension === 'svg')
+          await Bun.write(
+            path,
+            '<svg xmlns="http://www.w3.org/2000/svg" width="320" height="160"><rect width="160" height="160" fill="#ff0000"/><rect x="160" width="160" height="160" fill="#0000ff"/></svg>',
+          );
+        else {
+          const { encodeImage } = await import('../lib/paint/frame.js');
+          const pixels = new Uint8Array(320 * 160 * 4);
+          for (let y = 0; y < 160; y++)
+            for (let x = 0; x < 320; x++)
+              pixels.set(
+                x < 160 ? [255, 0, 0, 255] : [0, 0, 255, 255],
+                (y * 320 + x) * 4,
+              );
+          await Bun.write(path, await encodeImage(pixels, 320, 160));
+        }
+        const file = join(sandbox.dir, 'image.qml');
+        await Bun.write(
+          file,
+          `import QtQuick
+import ${JSON.stringify(join(sandbox.flea, 'ui'))} as Flea
+Rectangle {width:800;height:600;color:Flea.Theme.color.background
+ Flea.PreviewImage {id:preview;anchors.fill:parent;path:${JSON.stringify(path)}}
+ Text {id:status;text:preview.status+":"+preview.zoom+":"+preview.fullPicture.drawn}
+ Button {id:zoom;y:550;text:"Zoom";onClicked:preview.zoomBy(1)}
+ Button {id:fit;x:100;y:550;text:"Fit";onClicked:preview.zoomFit()}
+}`,
+        );
+        browser = await createBrowser({
+          spareRenderer: false,
+          rendererTimeout: 30000,
+        });
+        await browser.context.addInitScript(
+          `globalThis.qmlErrors=[];addEventListener('error',e=>qmlErrors.push(String(e.error?.stack||e.message)));`,
+        );
+        await browser.context.navigate(Bun.pathToFileURL(file).href);
+        const until = async (predicate) => {
+          for (let i = 0; i < 150; i++) {
+            const status = await browser.context.evaluate(
+              'document.getElementById("status")?.textContent',
+            );
+            if (predicate(status)) return status;
+            await Bun.sleep(40);
+          }
+          throw Error(
+            await browser.context.evaluate(
+              'document.body.innerText+JSON.stringify(qmlErrors)',
+            ),
+          );
+        };
+        await until((s) => s?.startsWith('image:1:'));
+        await browser.context.evaluate(
+          'document.getElementById("zoom").click()',
+        );
+        const zoomed = await until(
+          (s) =>
+            s?.startsWith('image:') &&
+            !s.startsWith('image:1:') &&
+            s.endsWith(':true'),
+        );
+        expect(zoomed).toContain(':true');
+        await Bun.write(
+          '/tmp/buninu-flea-preview-' + extension + '.png',
+          Buffer.from(
+            await browser.context.screenshot({ format: 'png' }),
+            'base64',
+          ),
+        );
+        await browser.context.evaluate(
+          'document.getElementById("fit").click()',
+        );
+        await until((s) => s === 'image:1:false');
+        expect(
+          await browser.context.evaluate('JSON.stringify(qmlErrors)'),
+        ).toBe('[]');
+      } finally {
+        browser?.close();
+        sandbox.close();
+      }
+    },
+    60000,
+  );

package/test/qml-flea-rows.test.js

@@ -0,0 +1,101 @@
+// Component tests with ordinary input data, not a replacement Flea backend.
+import { test, expect } from 'bun:test';
+import { join } from 'node:path';
+import { createBrowser } from '../lib/headless-shell.js';
+import { fleaSandbox } from './helpers/flea-sandbox.js';
+const flea = process.env.BUNINU_FLEA_ROOT,
+  omarchy = process.env.BUNINU_OMARCHY_ROOT;
+for (const type of ['Row', 'GridTile'])
+  test.skipIf(!flea || !omarchy)(
+    'unchanged Flea ' +
+      type +
+      ' displays file metadata and reacts to changed input',
+    async () => {
+      const sandbox = fleaSandbox(flea, omarchy);
+      let browser;
+      try {
+        const file = join(sandbox.dir, 'rows.qml');
+        await Bun.write(
+          file,
+          `import QtQuick
+import ${JSON.stringify(join(sandbox.flea, 'ui'))} as Flea
+Rectangle {id:root;width:800;height:600;color:Flea.Theme.color.background
+ property var entry:({n:"example-notes.txt",s:12345,m:1700000000,p:33188,i:"file",k:0,d:false})
+ Flea.${type} {id:row;x:20;y:30;width:${type === 'Row' ? 760 : 260};height:${type === 'Row' ? 60 : 300};row:root.entry;cursor:true}
+ ${
+   type === 'GridTile'
+     ? `Text {id:captionMetrics;x:400;y:400;text:row.captionItem.lineCount+":"+row.captionItem.truncated}
+ Button {id:longName;x:200;y:500;text:"Long filename";onClicked:root.entry=({n:"a very long file name with many words and notes.txt",s:456,m:1700000000,p:33188,i:"file",k:0,d:false})}`
+     : ''
+ }
+ Button {id:change;y:500;text:"Change input";onClicked:root.entry=({n:"renamed-notes.txt",s:456,m:1700000000,p:33188,i:"file",k:0,d:false})}
+}`,
+        );
+        browser = await createBrowser({
+          spareRenderer: false,
+          rendererTimeout: 30000,
+        });
+        await browser.context.addInitScript(
+          `globalThis.qmlErrors=[];addEventListener('error',e=>qmlErrors.push(String(e.error?.stack||e.message)));const old=console.error;console.error=(...args)=>{qmlErrors.push(args.map(String).join(' '));old(...args);};`,
+        );
+        await browser.context.navigate(Bun.pathToFileURL(file).href);
+        const ready = await browser.context.evaluate(
+          '!!document.getElementById("change")',
+        );
+        if (!ready)
+          throw Error(
+            await browser.context.evaluate(
+              'document.querySelector("p")?.textContent||document.body.innerText',
+            ),
+          );
+
+        const until = async (word) => {
+          for (let i = 0; i < 150; i++) {
+            const text = await browser.context.evaluate(
+              'document.body.innerText',
+            );
+            if (text.includes(word)) return;
+            await Bun.sleep(40);
+          }
+          throw Error(
+            await browser.context.evaluate(
+              'document.body.innerText+JSON.stringify(qmlErrors)',
+            ),
+          );
+        };
+        await until('example-notes.txt');
+        await browser.context.evaluate(
+          'document.getElementById("change").click()',
+        );
+        await until('renamed-notes.txt');
+        if (type === 'GridTile') {
+          await browser.context.evaluate(
+            'document.getElementById("longName").click()',
+          );
+          let metric = '';
+          for (let i = 0; i < 100; i++) {
+            metric = await browser.context.evaluate(
+              'document.getElementById("captionMetrics").textContent',
+            );
+            if (metric === '2:false') break;
+            await Bun.sleep(20);
+          }
+          expect(metric).toBe('2:false');
+        }
+        expect(
+          await browser.context.evaluate('JSON.stringify(qmlErrors)'),
+        ).toBe('[]');
+        await Bun.write(
+          '/tmp/buninu-flea-' + type + '.png',
+          Buffer.from(
+            await browser.context.screenshot({ format: 'png' }),
+            'base64',
+          ),
+        );
+      } finally {
+        browser?.close();
+        sandbox.close();
+      }
+    },
+    60000,
+  );

package/test/qml-flea-textures.test.js

@@ -0,0 +1,59 @@
+import { test, expect } from 'bun:test';
+import { join } from 'node:path';
+import { createBrowser } from '../lib/headless-shell.js';
+import { loadGraphics } from '../lib/renderer/page-renderer.js';
+import { fleaSandbox } from './helpers/flea-sandbox.js';
+const flea=process.env.BUNINU_FLEA_ROOT, omarchy=process.env.BUNINU_OMARCHY_ROOT;
+for(const kind of ['swap','clip']) test.skipIf(!flea||!omarchy)('unchanged Flea '+kind+' paints actual texture pixels',async()=>{
+  const sandbox=fleaSandbox(flea,omarchy);
+  let browser;
+  try {
+    const content=kind==='swap'?`
+ property bool complete:true
+ Flea.PreviewSwap {id:swap;x:20;y:20;width:180;height:100;ready:complete;folderHold:true
+  Rectangle {id:source;anchors.fill:parent;color:"red"}}
+ Button {id:move;y:150;text:"Move";onClicked:{complete=false;swap.hold(function(){source.color="blue";swap.start(false)},1)}}
+ Button {id:finish;x:100;y:150;text:"Finish";onClicked:{swap.folderHold=false;complete=true}}
+ Text {id:status;y:200;text:JSON.stringify(swap.describe())}
+`:`
+ Rectangle {id:source;x:20;y:20;width:100;height:60;color:"red"}
+ Flea.HtmlClip {id:clip;x:150;y:20;width:100;height:60;radius:20;target:source}
+ Button {id:blue;y:150;text:"Blue";onClicked:source.color="blue"}
+`;
+    const file=join(sandbox.dir,'main.qml');
+    await Bun.write(file,`import QtQuick\nimport ${JSON.stringify(join(sandbox.flea,'ui'))} as Flea\nRectangle {width:400;height:240;color:"white"\n${content}\n}`);
+    browser=await createBrowser({spareRenderer:false,rendererTimeout:15000});
+    await browser.context.resize(400,240);
+    await browser.context.addInitScript('globalThis.errors=[];addEventListener("error",e=>errors.push(String(e.error?.stack||e.message)))');
+    await browser.context.navigate(Bun.pathToFileURL(file).href);
+    const run=code=>browser.context.evaluate(code);
+    async function until(fn){for(let i=0;i<70;i++){if(await fn())return;await Bun.sleep(20);}throw Error(await run('document.body.innerText+JSON.stringify(errors)'));}
+    const {CanvasKit:kit}=await loadGraphics();
+    async function capture(){return Buffer.from(await browser.context.screenshot({format:'png'}),'base64');}
+    function pixel(bytes,x,y){const image=kit.MakeImageFromEncoded(bytes);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();}}
+    if(kind==='swap'){
+      await until(async()=>await run('!!document.getElementById("move")'));
+      expect(pixel(await capture(),30,30)).toEqual([255,0,0,255]);
+      await run('document.getElementById("move").click()');
+      await until(async()=>await run('JSON.parse(document.getElementById("status").textContent).holding'));
+      const held=await capture();await Bun.write('/tmp/flea-preview-held.png',held);
+      expect(pixel(held,30,30)).toEqual([255,0,0,255]);
+      expect(await run('document.getElementById("source").style.backgroundColor')).toBe('blue');
+      await run('document.getElementById("finish").click()');
+      await until(async()=>!(await run('JSON.parse(document.getElementById("status").textContent).holding')));
+      const done=await capture();await Bun.write('/tmp/flea-preview-released.png',done);
+      expect(pixel(done,30,30)).toEqual([0,0,255,255]);
+      expect(await run('JSON.parse(document.getElementById("status").textContent).last.end')).toBe('landed');
+    }else{
+      await until(async()=>pixel(await capture(),200,50)[0]===255&&pixel(await capture(),200,50)[1]===0);
+      const rounded=await capture();await Bun.write('/tmp/flea-preview-rounded.png',rounded);
+      expect(pixel(rounded,25,25)).toEqual([255,255,255,255]);
+      expect(pixel(rounded,151,21)).toEqual([255,255,255,255]);
+      expect(pixel(rounded,200,50)).toEqual([255,0,0,255]);
+      await run('document.getElementById("blue").click()');
+      await until(async()=>pixel(await capture(),200,50)[0]===0);
+      expect(pixel(await capture(),200,50)).toEqual([0,0,255,255]);
+    }
+    expect(await run('errors')).toEqual([]);
+  }finally{browser?.close();sandbox.close();}
+},30000);

package/test/qml-flea-view-switch.test.js

@@ -0,0 +1,33 @@
+import { test, expect } from 'bun:test';
+import { mkdirSync } from 'node:fs';
+import { join } from 'node:path';
+import { createBrowser } from '../lib/headless-shell.js';
+import { fleaSandbox } from './helpers/flea-sandbox.js';
+const flea=process.env.BUNINU_FLEA_ROOT, omarchy=process.env.BUNINU_OMARCHY_ROOT;
+test.skipIf(!flea||!omarchy||!process.env.FLEA_BIN)('Flea hides retained columns when switching back to list',async()=>{
+ const sandbox=fleaSandbox(flea,omarchy), oldPath=process.env.FLEA_PATH;
+ let browser;
+ try {
+  process.env.FLEA_PATH=sandbox.values.HOME;
+  mkdirSync(join(sandbox.values.HOME,'Documents'));
+  await Bun.write(join(sandbox.values.HOME,'Documents/inside.txt'),'inside');
+  await Bun.write(join(sandbox.values.HOME,'hello.md'),'hello');
+  await Bun.write(join(sandbox.values.HOME,'second.js'),'second');
+  browser=await createBrowser({spareRenderer:false,rendererTimeout:30000});
+  await browser.context.resize(800,600);
+  await browser.context.addInitScript(`globalThis.views=[];let rt;Object.defineProperty(globalThis,"__qmlRuntime",{get:()=>rt,set:r=>{rt=r;const d=r.describe;r.describe=(v,t,...a)=>{if(t.includes("ColumnsArea")||t.includes("Pane"))views.push({v,t});return d(v,t,...a)}}});globalThis.qmlErrors=[];addEventListener('error',e=>qmlErrors.push(String(e.error?.stack||e.message)));`);
+  await browser.context.navigate(Bun.pathToFileURL(join(sandbox.flea,'ui/boot/shell.qml')).href);
+  const names=column=>browser.context.evaluate(`Array.from(document.querySelectorAll('[data-qml-type="Text"]')).map(e=>({text:e.textContent,r:e.getBoundingClientRect()})).filter(({text,r})=>/^(cache|config|data|home|imports|state|Documents|inside.txt|hello.md|second.js)$/.test(text)&&r.width>0&&r.y>20&&r.x>=${column===0?200:500}&&r.x<${column===0?500:800}).sort((a,b)=>a.r.y-b.r.y).map(e=>e.text)`);
+  async function until(column,wanted){for(let i=0;i<150;i++){const actual=await names(column);if(JSON.stringify(actual)===JSON.stringify(wanted))return;await Bun.sleep(30);}expect(await names(column)).toEqual(wanted);}
+  await until(0,['Documents','hello.md','second.js']);
+  await browser.context.press('2',{code:'Digit2',modifiers:2});
+  await until(1,['inside.txt']);
+  await browser.context.press('1',{code:'Digit1',modifiers:2});
+  await Bun.sleep(100);
+  expect(await browser.context.evaluate(`views.find(({t})=>t.includes('Pane')).v.viewMode`)).toBe('list');
+  expect(await browser.context.evaluate(`views.find(({t})=>t.includes('Pane')).v.columnsArea.visible`)).toBe(false);
+  await until(1,[]);
+  await Bun.write('/tmp/flea-list-switch.png',Buffer.from(await browser.context.screenshot({format:'png'}),'base64'));
+  expect(await browser.context.evaluate('qmlErrors')).toEqual([]);
+ }finally{browser?.close();if(oldPath===undefined)delete process.env.FLEA_PATH;else process.env.FLEA_PATH=oldPath;sandbox.close();}
+},60000);

package/test/qml-flea-wayland.test.js

@@ -0,0 +1,68 @@
+// Opt-in real socket test; owns its compositor and never touches a user's Land.
+import { test, expect } from 'bun:test';
+import { join } from 'node:path';
+import { fleaSandbox } from './helpers/flea-sandbox.js';
+import { launch } from '../frontends/wayland/index.js';
+const flea = process.env.BUNINU_FLEA_ROOT,
+  omarchy = process.env.BUNINU_OMARCHY_ROOT;
+test.skipIf(!flea || !omarchy || !process.env.BUNINU_QML_WAYLAND_TEST)(
+  'real Flea receives Wayland keys and closes through Super-W',
+  async () => {
+    const { start } = await import('../../buninu-land/compositor.js');
+    const sandbox = fleaSandbox(flea, omarchy),
+      oldRuntime = process.env.XDG_RUNTIME_DIR;
+    let land, app;
+    try {
+      process.env.XDG_RUNTIME_DIR = sandbox.dir;
+      land = await start([
+        '--remote-debugging-port=0',
+        '--window-size=1000,720',
+      ]);
+      app = await launch({
+        url: Bun.pathToFileURL(join(sandbox.flea, 'ui/boot/shell.qml')).href,
+        width: 1000,
+        height: 720,
+        socket: join(sandbox.dir, 'wayland-buninu'),
+      });
+      const until = async (predicate) => {
+        for (let i = 0; i < 300; i++) {
+          if (await predicate()) return;
+          await Bun.sleep(40);
+        }
+        throw Error('Flea Wayland state did not settle');
+      };
+      const text = () =>
+        app.browser.context.evaluate('document.body.innerText');
+      await until(() =>
+        land.compositor.wm.renderSurfaces().some((s) => s.pixels),
+      );
+      expect(await text()).toContain('PLACES');
+      const key = async (key, code, modifiers = 0) => {
+        for (const type of ['keyDown', 'keyUp'])
+          land.context.dispatchKeyEvent({ type, key, code, modifiers });
+        await Bun.sleep(100);
+      };
+      await key(',', 'Comma');
+      await until(async () => (await text()).includes('Settings'));
+      await Bun.write(
+        '/tmp/buninu-flea-wayland.png',
+        Buffer.from(await land.context.screenshot({ format: 'png' }), 'base64'),
+      );
+      await key('Escape', 'Escape');
+      await until(async () => !(await text()).includes('Settings'));
+      let closed = false;
+      app.done.then(() => (closed = true));
+      await key('w', 'KeyW', 4);
+      await until(() => closed);
+      await until(() => !land.compositor.wm.visible.length);
+      expect(closed).toBe(true);
+    } finally {
+      app?.close();
+      land?.close();
+      if (oldRuntime === undefined) delete process.env.XDG_RUNTIME_DIR;
+      else process.env.XDG_RUNTIME_DIR = oldRuntime;
+      sandbox.close();
+    }
+  },
+  120000,
+);

package/test/qml-flea.test.js

@@ -0,0 +1,34 @@
+import { test, expect } from 'bun:test';
+import { createBrowser } from '../lib/headless-shell.js';
+
+test('Flea EscapeHint imports a real singleton and shares reactive theme updates', async () => {
+  const browser = await createBrowser({ spareRenderer: false });
+  try {
+    await browser.context.resize(640, 400, 1);
+    await browser.context.navigate(
+      new URL('./fixtures/qml/flea/demo.qml', import.meta.url).href,
+    );
+    expect(await browser.context.evaluate('document.title')).toBe(
+      'Browser — Flea real import test',
+    );
+    const colors = () =>
+      browser.context.evaluate(
+        "JSON.stringify([...document.querySelectorAll('[data-qml-type=Text]')].filter(e=>e.textContent==='esc').map(e=>e.style.color))",
+      );
+    expect(JSON.parse(await colors())).toEqual(['#70e1e8', '#70e1e8']);
+    await browser.context.evaluate('document.querySelector("button").click()');
+    expect(JSON.parse(await colors())).toEqual(['#ffcc66', '#ffcc66']);
+    await browser.context.evaluate('document.querySelector("button").click()');
+    expect(JSON.parse(await colors())).toEqual(['#70e1e8', '#70e1e8']);
+    expect(await browser.context.evaluate('typeof Theme')).toBe('undefined');
+    await Bun.write(
+      '/tmp/browser-flea-import.png',
+      Buffer.from(
+        await browser.context.screenshot({ format: 'png' }),
+        'base64',
+      ),
+    );
+  } finally {
+    browser.close();
+  }
+}, 30000);