buninu-browser 0.5.0 → 0.6.0

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/inline-style-cascade.test.js

@@ -0,0 +1,63 @@
+import { expect, test } from 'bun:test';
+import { parseHTMLDocument } from '../lib/happy-dom/parser.js';
+import { computeElementStyle, parseDeclarations, StyleEngine } from '../lib/style/computed-style.js';
+
+test('inline importance and variables reach principal styles without leaking into pseudos', () => {
+  const { document, window } = parseHTMLDocument('<div id="target" style="--accent:blue!important;--accent:orange;color:var(--accent);margin:2px;margin-left:7px!important;content:\'principal\'">text</div>');
+  const sheets = [
+    '#target {--accent:red!important;color:purple!important;margin-left:9px!important;background-color:var(--accent)}',
+    '#target::before {--accent:gold;content:"before";color:var(--accent);margin-left:inherit}',
+  ];
+  try {
+    const target = document.getElementById('target');
+    const engine = new StyleEngine().compute(document, sheets);
+    const original = engine.get(target), originalCustom = engine.customPropertiesOf(target);
+    expect(original).toMatchObject({
+      color:'rgba(128, 0, 128, 1)', backgroundColor:'rgba(0, 0, 255, 1)', margin:[2,2,2,7], content:'principal',
+    });
+    expect(originalCustom.get('--accent')).toBe('blue');
+    expect(engine.getPseudo(target, 'before')).toMatchObject({ content:'before', color:'rgba(255, 215, 0, 1)', margin:[0,0,0,7] });
+
+    target.setAttribute('style', '--accent:lime!important;color:var(--accent)!important;margin:4px;margin-left:8px!important');
+    engine.compute(document, sheets, {}, new Set([target]));
+    expect(engine.get(target)).toMatchObject({
+      color:'rgba(0, 255, 0, 1)', backgroundColor:'rgba(0, 255, 0, 1)', margin:[4,4,4,8], content:null,
+    });
+    expect(engine.customPropertiesOf(target).get('--accent')).toBe('lime');
+    expect(engine.getPseudo(target, 'before')).toMatchObject({ content:'before', color:'rgba(255, 215, 0, 1)', margin:[0,0,0,8] });
+    expect(original.backgroundColor).toBe('rgba(0, 0, 255, 1)');
+    expect(originalCustom.get('--accent')).toBe('blue');
+  } finally { window.happyDOM.abort(); }
+});
+
+test('inline shorthands retain their priority over UA defaults and dimension hints', () => {
+  const { document, window } = parseHTMLDocument('<h1 id="heading" style="font:italic 20px serif;margin:3px">heading</h1><img id="picture" width="17" height="19" style="width:33px;height:44px">');
+  try {
+    const engine = new StyleEngine().compute(document, ['#picture {width:80px!important}']);
+    expect(engine.get(document.getElementById('heading'))).toMatchObject({
+      fontSize:20, fontWeight:400, fontStyle:'italic', fontFamily:['serif'], margin:[3,3,3,3],
+    });
+    expect(engine.get(document.getElementById('picture'))).toMatchObject({ width:80, height:44 });
+  } finally { window.happyDOM.abort(); }
+});
+
+test('direct computed-style calls still cascade inline values without mutating supplied declarations', () => {
+  const { document, window } = parseHTMLDocument('<div style="color:blue;width:31px;padding:2px">text</div>');
+  try {
+    const element = document.querySelector('div');
+    const declarations = parseDeclarations('color:purple!important;width:10px');
+    const originalWidth = declarations.get('width');
+    const first = computeElementStyle(element, null, declarations);
+    expect(first).toMatchObject({ color:'rgba(128, 0, 128, 1)', width:31, padding:[2,2,2,2] });
+    expect(declarations.size).toBe(2);
+    expect(declarations.get('width')).toBe(originalWidth);
+    expect(originalWidth.value).toBe('10px');
+
+    declarations.set('color', { ...declarations.get('color'), value:'green' });
+    element.setAttribute('style', 'color:blue;width:41px;padding:4px');
+    const second = computeElementStyle(element, null, declarations);
+    expect(second).toMatchObject({ color:'rgba(0, 128, 0, 1)', width:41, padding:[4,4,4,4] });
+    expect(first.width).toBe(31);
+    expect(first.color).toBe('rgba(128, 0, 128, 1)');
+  } finally { window.happyDOM.abort(); }
+});

package/test/layout-repaint-renderer.test.js

@@ -0,0 +1,9 @@
+import { expect, test } from 'bun:test';
+
+test('paint-only geometry reads skip layout and match full-layout pixels', async () => {
+  const child = Bun.spawn([process.execPath, new URL('./fixtures/layout-repaint.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);
+}, 15_000);

package/test/layout-repaint.test.js

@@ -0,0 +1,222 @@
+import {test, expect} from 'bun:test';
+import {parseHTMLDocument} from '../lib/happy-dom/parser.js';
+import {StyleEngine} from '../lib/style/computed-style.js';
+import {RenderTreeBuilder} from '../lib/render-tree/index.js';
+import {LayoutEngine} from '../lib/layout/text-layout.js';
+import {buildDisplayList} from '../lib/paint/display-list.js';
+import {repaintLayout} from '../lib/layout/repaint.js';
+
+function fixture(source='<body><div id="a" style="width:100px;height:30px;transform:scaleX(0.3);background-image:linear-gradient(red, blue);background-size:20px 20px">hello <span>world</span></div><p>after</p></body>') {
+  const parsed=parseHTMLDocument(source);
+  const builder=new RenderTreeBuilder(),engine=new LayoutEngine();
+  const first=builder.build(parsed.document,new StyleEngine().compute(parsed.document));
+  const options={width:300,viewportHeight:200};
+  const layout=engine.layout(first,options);
+  return {...parsed,builder,engine,first,layout,options,element:parsed.document.getElementById('a')};
+}
+for (const [name,value] of [['transform','scaleX(0.8)'],['backgroundSize','40px 15px'],['transformOrigin','left top'],['opacity','0.4'],['backgroundColor','blue']]) {
+  test(`retained ${name} paint matches a complete layout, leaving prior geometry immutable`,()=>{
+    const f=fixture();
+    try {
+      const before=JSON.stringify(f.layout);
+      f.element.style[name]=value;
+      const next=f.builder.build(f.document,new StyleEngine().compute(f.document)),retained=repaintLayout(f.layout,f.first,next);
+      expect(retained).not.toBeNull();
+      expect(buildDisplayList(retained,next)).toEqual(buildDisplayList(f.engine.layout(next,f.options),next));
+      expect(JSON.stringify(f.layout)).toBe(before);
+      const unchanged=f.layout.fragments.findIndex(fragment=>fragment.runs.some(run=>run.text==='after'));
+      expect(unchanged).toBeGreaterThanOrEqual(0);
+      expect(retained.fragments[unchanged]).toBe(f.layout.fragments[unchanged]);
+      expect(retained.fragments[unchanged].runs).toBe(f.layout.fragments[unchanged].runs);
+    } finally {f.window.happyDOM.abort();}
+  });
+}
+for (const [name,value] of [['transform','translateX(10px) scaleX(0.8)'],['transform','none'],['width','120px'],['color','red'],['display','none']]) {
+  test(`changing ${name} outside the paint-only subset retains full layout`,()=>{
+    const f=fixture();try {f.element.style[name]=value;expect(repaintLayout(f.layout,f.first,f.builder.build(f.document,new StyleEngine().compute(f.document)))).toBeNull();}
+    finally{f.window.happyDOM.abort();}
+  });
+}
+test('text changes cannot reuse old line breaking',()=>{
+  const f=fixture();try{f.element.firstChild.data='a much longer paragraph';expect(repaintLayout(f.layout,f.first,f.builder.build(f.document,new StyleEngine().compute(f.document)))).toBeNull();}
+  finally{f.window.happyDOM.abort();}
+});
+
+function expectEquivalent(f, next, retained) {
+  expect(retained).not.toBeNull();
+  const full = new LayoutEngine().layout(next, f.options);
+  // Fragment IDs retain the generation in which their geometry was created.
+  const comparable = layout => ({ ...layout, fragments: layout.fragments.map(({ id, ...fragment }) => fragment) });
+  expect(comparable(retained)).toEqual(comparable(full));
+  const painted = buildDisplayList(retained, next), reference = buildDisplayList(full, next);
+  expect(painted).toEqual(reference);
+  // Hit testing, text selection, and scroll extents are non-enumerable.
+  expect(painted.hits).toEqual(reference.hits);
+  expect(painted.scrollers).toEqual(reference.scrollers);
+  expect(painted.extent).toEqual(reference.extent);
+  return painted;
+}
+
+test('ancestor opacity updates nested positioned content and survives zero opacity', () => {
+  const f = fixture(`<body><div id="a" style="position:relative;z-index:2;width:100px;height:70px;background:red">
+    text <span style="opacity:.5;background:yellow">faint</span>
+    <span style="position:absolute;z-index:-1;left:2px;top:4px;background:blue">behind</span>
+    <span style="position:absolute;z-index:3;left:8px;top:15px;background:green">above</span>
+    </div><div style="position:relative;z-index:1">outside</div></body>`);
+  try {
+    let previous = f.first, layout = f.layout;
+    for (const opacity of ['0.5', '0', '1']) {
+      f.element.style.opacity = opacity;
+      const next = f.builder.build(f.document, new StyleEngine().compute(f.document));
+      const retained = repaintLayout(layout, previous, next);
+      const list = expectEquivalent(f, next, retained);
+      const faint = list.items.find(item => item.text === 'faint');
+      if (opacity === '0') expect(faint).toBeUndefined();
+      else expect(faint.opacity).toBe(Number(opacity) * 0.5);
+      for (let index = 0; index < retained.boxes.length; index++) {
+        expect(retained.boxes[index].layer).toBe(layout.boxes[index].layer);
+      }
+      previous = next;
+      layout = retained;
+    }
+  } finally { f.window.happyDOM.abort(); }
+});
+
+for (const [description, content] of [
+  ['wrapped inline', '<div style="width:90px">before <span id="a" style="background:red">several wrapped words</span> after</div>'],
+  ['bordered inline', '<div><span id="a" style="border:1px solid currentColor">text</span></div>'],
+  ['bordered image', '<div><img id="a" width="30" height="20" style="border:1px solid currentColor"></div>'],
+  ['table cell with resolved padding', '<table style="width:140px"><tr><td id="a" style="padding:10%;background:red">cell</td><td>other</td></tr></table>'],
+  ['block with anonymous lines', '<div id="a" style="padding:5%">before<p>middle</p>after</div>'],
+]) {
+  test(`background color retains ${description} geometry and paint`, () => {
+    const f = fixture(`<body>${content}</body>`);
+    try {
+      f.element.style.backgroundColor = 'blue';
+      const next = f.builder.build(f.document, new StyleEngine().compute(f.document));
+      expectEquivalent(f, next, repaintLayout(f.layout, f.first, next));
+    } finally { f.window.happyDOM.abort(); }
+  });
+}
+
+for (const [description, content, color] of [
+  ['new inline background', '<span id="a">text</span>', 'red'],
+  ['removed inline background', '<span id="a" style="background:red">text</span>', 'transparent'],
+  ['new image background', '<img id="a" width="30" height="20">', 'red'],
+  ['removed image background', '<img id="a" width="30" height="20" style="background:red">', 'transparent'],
+]) {
+  test(`${description} regenerates inline decoration boxes`, () => {
+    const f = fixture(`<body><div>${content}</div></body>`);
+    try {
+      f.element.style.backgroundColor = color;
+      const next = f.builder.build(f.document, new StyleEngine().compute(f.document));
+      expect(repaintLayout(f.layout, f.first, next)).toBeNull();
+    } finally { f.window.happyDOM.abort(); }
+  });
+}
+
+test('retained styles preserve gradient text identity across repeated paint changes', () => {
+  const f = fixture('<body><div id="a" style="width:100px;background-image:linear-gradient(red,blue);background-clip:text">gradient text</div></body>');
+  try {
+    let previous = f.first, layout = f.layout;
+    for (const [property, value] of [['opacity', '.5'], ['background-size', '40px 20px'], ['background-color', 'green']]) {
+      f.element.setAttribute('style', `${f.element.getAttribute('style')};${property}:${value}`);
+      const next = f.builder.build(f.document, new StyleEngine().compute(f.document));
+      const retained = repaintLayout(layout, previous, next);
+      const list = expectEquivalent(f, next, retained);
+      expect(list.items.filter(item => item.op === 'drawText').every(item => item.gradient)).toBe(true);
+      previous = next;
+      layout = retained;
+    }
+  } finally { f.window.happyDOM.abort(); }
+});
+
+test('color changes with inherited currentColor borders, decorations and SVG keep full layout', () => {
+  const f = fixture(`<body><div id="a" style="color:red;text-decoration:underline">
+    <span style="border:1px solid currentColor">text</span>
+    <svg width="20" height="20"><rect width="20" height="20" fill="currentColor"/></svg>
+    </div></body>`);
+  try {
+    f.element.style.color = 'blue';
+    const next = f.builder.build(f.document, new StyleEngine().compute(f.document));
+    expect(repaintLayout(f.layout, f.first, next)).toBeNull();
+  } finally { f.window.happyDOM.abort(); }
+});
+
+for (const otherOpacity of [null, '0.7', '0.3']) {
+  test(`a shared old style cannot leak into an alias with opacity ${otherOpacity ?? 'unchanged'}`, () => {
+    const f = fixture('<body><div id="a" style="width:100px">first</div><div id="b" style="width:100px">second</div></body>');
+    try {
+      const a = [...f.first.nodesById.values()].find(node => node.domNode === f.element);
+      const other = f.document.getElementById('b');
+      const b = [...f.first.nodesById.values()].find(node => node.domNode === other);
+      expect(a.style).toEqual(b.style);
+      // Render trees may share immutable styles. Give both elements and their
+      // text nodes that same style, then split it in the next generation.
+      const nodesById = new Map();
+      const share = node => {
+        const shared = Object.freeze({ ...node,
+          style: node.style === b.style ? a.style : node.style,
+          children: Object.freeze(node.children.map(share)),
+        });
+        nodesById.set(shared.id, shared);
+        return shared;
+      };
+      const previous = { ...f.first, root: share(f.first.root), nodesById };
+      const layout = new LayoutEngine().layout(previous, f.options);
+      f.element.style.opacity = '0.3';
+      if (otherOpacity != null) other.style.opacity = otherOpacity;
+      const next = f.builder.build(f.document, new StyleEngine().compute(f.document));
+      const retained = repaintLayout(layout, previous, next);
+      if (otherOpacity === '0.3') expectEquivalent(f, next, retained);
+      else expect(retained).toBeNull();
+    } finally { f.window.happyDOM.abort(); }
+  });
+}
+test('a changed run only replaces its own immutable fragment and preserves sibling runs',()=>{
+  const f=fixture('<body><div style="width:280px">before <span id="a" style="background-size:20px 20px">target</span> after</div><p>outside</p></body>');
+  try {
+    const before=JSON.stringify(f.layout);
+    const index=f.layout.fragments.findIndex(fragment=>fragment.runs.some(run=>run.text==='target'));
+    const original=f.layout.fragments[index];
+    expect(original.runs.length).toBeGreaterThan(1);
+    f.element.style.backgroundSize='40px 15px';
+    const next=f.builder.build(f.document,new StyleEngine().compute(f.document)),retained=repaintLayout(f.layout,f.first,next);
+    expect(retained).not.toBeNull();
+    const updated=retained.fragments[index];
+    expect(updated).not.toBe(original);
+    expect(updated.runs).not.toBe(original.runs);
+    for(let runIndex=0;runIndex<original.runs.length;runIndex++) {
+      const run=original.runs[runIndex],replacement=updated.runs[runIndex];
+      if(run.text==='target') {
+        expect(replacement).not.toBe(run);
+        expect(Object.isFrozen(replacement)).toBe(true);
+        expect(Object.isFrozen(replacement.style)).toBe(true);
+      } else expect(replacement).toBe(run);
+    }
+    expect(Object.isFrozen(updated)).toBe(true);
+    expect(Object.isFrozen(updated.runs)).toBe(true);
+    expect(Object.isFrozen(retained.fragments)).toBe(true);
+    expect(buildDisplayList(retained,next)).toEqual(buildDisplayList(f.engine.layout(next,f.options),next));
+    expect(JSON.stringify(f.layout)).toBe(before);
+  } finally {f.window.happyDOM.abort();}
+});
+test('box-only and no-op paint updates keep unchanged fragment and record arrays',()=>{
+  const f=fixture('<body><div id="a" style="width:100px;height:30px;background-size:20px 20px"></div><p>after</p></body>');
+  try {
+    const before=JSON.stringify(f.layout);
+    f.element.style.backgroundSize='40px 15px';
+    const next=f.builder.build(f.document,new StyleEngine().compute(f.document)),retained=repaintLayout(f.layout,f.first,next);
+    expect(retained).not.toBeNull();
+    expect(retained.boxes).not.toBe(f.layout.boxes);
+    expect(Object.isFrozen(retained.boxes)).toBe(true);
+    expect(retained.fragments).toBe(f.layout.fragments);
+    expect(buildDisplayList(retained,next)).toEqual(buildDisplayList(f.engine.layout(next,f.options),next));
+    expect(JSON.stringify(f.layout)).toBe(before);
+    const unchanged=f.builder.build(f.document,new StyleEngine().compute(f.document));
+    const again=repaintLayout(retained,next,unchanged);
+    expect(again.boxes).toBe(retained.boxes);
+    expect(again.fragments).toBe(retained.fragments);
+    expect(again.generation).toBe(unchanged.generation);
+  } finally {f.window.happyDOM.abort();}
+});

package/test/media-presentation-continuation.test.js

@@ -0,0 +1,14 @@
+import { test, expect } from 'bun:test';
+
+for (const scenario of ['success', 'pause', 'controls', 'seek', 'source', 'format', 'worker-failure', 'epoch', 'no-growth']) {
+  test(`presentation continuation: ${scenario}`, async () => {
+    const child = Bun.spawn([process.execPath,
+      new URL('./fixtures/media-presentation-continuation.js', import.meta.url).pathname, scenario],
+    { stdout: 'pipe', stderr: 'pipe' });
+    const [out, error, code] = await Promise.all([
+      new Response(child.stdout).text(), new Response(child.stderr).text(), child.exited,
+    ]);
+    expect({ code, error }).toEqual({ code: 0, error: '' });
+    expect(out).toContain(`continuation ${scenario} passed`);
+  }, 15000);
+}

package/test/media-presentation-refill.test.js

@@ -0,0 +1,8 @@
+import {test,expect} from 'bun:test';
+
+test('presentation refill avoids duplicate page decoding and retains local fallbacks',async()=>{
+  const child=Bun.spawn([process.execPath,new URL('./fixtures/media-presentation-refill.js',import.meta.url).pathname],{stdout:'pipe',stderr:'pipe'});
+  const [out,error,code]=await Promise.all([new Response(child.stdout).text(),new Response(child.stderr).text(),child.exited]);
+  expect({code,error}).toEqual({code:0,error:''});
+  expect(out).toContain('presentation refill avoids duplicate page decode and preserves fallbacks');
+},15000);

package/test/media-probe.test.js

@@ -0,0 +1,16 @@
+import { expect, test } from 'bun:test';
+
+for (const scenario of ['initial-shared', 'initial-growth', 'initial-source', 'initial-rejected', 'audio-only',
+  'refresh-growth', 'pipe-change', 'failed-retry', 'mime-change', 'epoch', 'epoch-inflight', 'moving-snapshot']) {
+  test(`media metadata probe: ${scenario}`, async () => {
+    const child = Bun.spawn([process.execPath, new URL('./fixtures/media-probe.js', import.meta.url).pathname, scenario],
+      { stdout: 'pipe', stderr: 'pipe' });
+    try {
+      const [out, error, code] = await Promise.all([
+        new Response(child.stdout).text(), new Response(child.stderr).text(), child.exited,
+      ]);
+      expect({ code, error }).toEqual({ code: 0, error: '' });
+      expect(out).toContain(`media probe ${scenario} passed`);
+    } finally { child.kill(); }
+  }, 10000);
+}

package/test/media-repaint.test.js

@@ -0,0 +1,8 @@
+import {test,expect} from 'bun:test';
+
+test('independent media coalesces page UI painting while pause, seek and native controls remain live',async()=>{
+  const child=Bun.spawn([process.execPath,new URL('./fixtures/media-repaint.js',import.meta.url).pathname],{stdout:'pipe',stderr:'pipe'});
+  const [out,error,code]=await Promise.all([new Response(child.stdout).text(),new Response(child.stderr).text(),child.exited]);
+  expect({code,error}).toEqual({code:0,error:''});
+  expect(out).toContain('media repaint integration passed');
+},15000);

package/test/media-source-attachment.test.js

@@ -0,0 +1,34 @@
+import {expect, test} from 'bun:test';
+
+test('only the currently attached MediaSource can change media state across src, srcObject and documents', async () => {
+  const child=Bun.spawn([process.execPath,new URL('./fixtures/media-source-attachment.js',import.meta.url).pathname],{
+    stdout:'pipe',stderr:'pipe',
+  });
+  const [out,error,code]=await Promise.all([
+    new Response(child.stdout).text(),new Response(child.stderr).text(),child.exited,
+  ]);
+  expect({code,error}).toEqual({code:0,error:''});
+  expect(out).toContain('MediaSource attachment isolation passed');
+},15000);
+
+for(const action of ['src','attribute','load'])test(`explicit ${action} reselects media while passive base changes preserve it`,async()=>{
+  const child=Bun.spawn([process.execPath,new URL('./fixtures/media-resource-reselection.js',import.meta.url).pathname,action],{
+    stdout:'pipe',stderr:'pipe',
+  });
+  const [out,error,code]=await Promise.all([
+    new Response(child.stdout).text(),new Response(child.stderr).text(),child.exited,
+  ]);
+  expect({code,error}).toEqual({code:0,error:''});
+  expect(out).toContain(`Media resource reselection ${action} passed`);
+},15000);
+
+test('MediaSource attachment queues sourceopen without a playback decoder', async () => {
+  const child=Bun.spawn([process.execPath,new URL('./fixtures/media-source-no-decoder.js',import.meta.url).pathname],{
+    stdout:'pipe',stderr:'pipe',
+  });
+  const [out,error,code]=await Promise.all([
+    new Response(child.stdout).text(),new Response(child.stderr).text(),child.exited,
+  ]);
+  expect({code,error}).toEqual({code:0,error:''});
+  expect(out).toContain('Decoder-less MediaSource attachment passed');
+},15000);

package/test/media-track-refill.test.js

@@ -0,0 +1,26 @@
+import {expect, test} from 'bun:test';
+
+test('video-only refills retain audio until its own EOF or epoch boundary, including pending output requests', async () => {
+  const child = Bun.spawn([process.execPath, new URL('./fixtures/media-track-refill.js', import.meta.url).pathname], {
+    stdout:'pipe', stderr:'pipe',
+  });
+  const [out, error, code] = await Promise.all([
+    new Response(child.stdout).text(), new Response(child.stderr).text(), child.exited,
+  ]);
+  expect({code, error}).toEqual({code:0, error:''});
+  expect(out).toContain('track-independent refill integration passed');
+}, 15_000);
+
+for (const action of ['seek', 'pause', 'navigate']) {
+  test(`a failed audio refill cancelled by ${action} does not fail the current playback`, async () => {
+    const child = Bun.spawn([process.execPath,
+      new URL('./fixtures/media-refill-cancel.js', import.meta.url).pathname, action], {
+      stdout:'pipe', stderr:'pipe',
+    });
+    const [out, error, code] = await Promise.all([
+      new Response(child.stdout).text(), new Response(child.stderr).text(), child.exited,
+    ]);
+    expect({code, error}).toEqual({code:0, error:''});
+    expect(out).toContain(`${action} ignores an obsolete refill rejection`);
+  }, 15_000);
+}

package/test/media-webm-seek.test.js

@@ -0,0 +1,11 @@
+import {expect,test} from 'bun:test';
+
+test('renderer resumes audio output after seeking across a missing WebM range',async()=>{
+  const child=Bun.spawn([process.execPath,new URL('./fixtures/media-webm-seek.js',import.meta.url).pathname],{stdout:'pipe',stderr:'pipe'});
+  const timeout=setTimeout(()=>child.kill(),15_000);
+  try{
+    const [code,stdout,stderr]=await Promise.all([child.exited,new Response(child.stdout).text(),new Response(child.stderr).text()]);
+    expect({code,stderr}).toEqual({code:0,stderr:''});
+    expect(stdout).toContain('sparse WebM seek and playback passed');
+  }finally{clearTimeout(timeout);}
+},20_000);

package/test/mp4-keyframes.test.js

@@ -0,0 +1,36 @@
+import {expect,test} from 'bun:test';
+import {mp4KeyframeBefore} from '../lib/media/mp4-keyframes.js';
+
+async function fixture(){return new Uint8Array(await Bun.file(new URL('./fixtures/mse-switch-large.mp4',import.meta.url)).arrayBuffer());}
+function findBox(bytes,type){
+  for(let i=4;i+4<=bytes.length;i++)if(String.fromCharCode(...bytes.subarray(i,i+4))===type)return i+4;
+  throw Error(`missing ${type}`);
+}
+
+test('fMP4 sync-sample candidates retain absolute decode times',async()=>{
+  const bytes=await fixture();
+  expect([0,1.9,2,3.9,4,20].map(time=>mp4KeyframeBefore(bytes,time))).toEqual([0,0,2,2,4,4]);
+  expect(mp4KeyframeBefore(bytes,-1)).toBeNull();
+  expect(mp4KeyframeBefore(bytes,Infinity)).toBeNull();
+});
+
+test('invalid and unsupported MP4 layouts decline indexing without throwing',async()=>{
+  const source=await fixture();
+  for(const change of [
+    (b,v)=>v.setUint32(0,4), // invalid root box
+    (b,v)=>v.setUint32(0,0xffffffff), // truncated root box
+    (b,v)=>v.setUint32(findBox(b,'trun')+4,0xffffffff), // bounded sample work
+    (b,v)=>v.setUint32(findBox(b,'trun'),0x00000404), // conflicting flag tables
+    (b,v)=>v.setUint32(findBox(b,'tfhd'),0x00040000), // unknown fragment flags
+    (b,v)=>v.setUint32(findBox(b,'mdhd')+12,0), // no timescale
+    (b,v)=>{const at=findBox(b,'tfdt');b[at]=2;}, // unknown timing version
+    (b,v)=>{const at=findBox(b,'trex');v.setUint32(at+4,999);}, // unmatched track
+  ]){
+    const bytes=source.slice();change(bytes,new DataView(bytes.buffer));
+    expect(mp4KeyframeBefore(bytes,3)).toBeNull();
+    expect(mp4KeyframeBefore(bytes,3)).toBeNull(); // a declined index is cached too
+  }
+  for(const length of [0,1,7,16,source.length-1])expect(mp4KeyframeBefore(source.slice(0,length),3)).toBeNull();
+  const ordinary=new Uint8Array(await Bun.file(new URL('./fixtures/video.mp4',import.meta.url)).arrayBuffer());
+  expect(mp4KeyframeBefore(ordinary,2)).toBeNull();
+});

package/test/mutation-observer.test.js

@@ -0,0 +1,91 @@
+import { expect, test } from 'bun:test';
+import { parseHTMLDocument } from '../lib/happy-dom/parser.js';
+import * as symbols from '../vendor/happy-dom/packages/happy-dom/src/PropertySymbol.ts';
+
+const tick = () => new Promise(resolve => queueMicrotask(resolve));
+
+test('multiple windows share notification ordering and one closing window cannot cancel another', async () => {
+  const first = parseHTMLDocument('<div></div>'), second = parseHTMLDocument('<div></div>');
+  const events = [];
+  try {
+    const older = new first.window.MutationObserver(() => events.push('older'));
+    const newer = new second.window.MutationObserver(() => events.push('newer'));
+    older.observe(first.document.body, { attributes: true });
+    newer.observe(second.document.body, { attributes: true });
+    second.document.body.setAttribute('x', '1');
+    queueMicrotask(() => events.push('promise'));
+    first.document.body.setAttribute('x', '1');
+    await tick();
+    expect(events).toEqual(['older', 'newer', 'promise']);
+    events.length = 0;
+    first.document.body.setAttribute('x', '2');
+    second.document.body.setAttribute('x', '2');
+    const closing = first.window.happyDOM.close();
+    await tick(); await closing;
+    expect(events).toEqual(['newer']);
+    second.document.body.setAttribute('x', '3'); await tick();
+    expect(events).toEqual(['newer', 'newer']);
+  } finally { await first.window.happyDOM.close(); await second.window.happyDOM.close(); }
+});
+
+test('window teardown disconnects every observer including cross-document and detached targets', async () => {
+  const first = parseHTMLDocument('<div><span></span></div>'), second = parseHTMLDocument('<div></div>');
+  const target = first.document.querySelector('div'), child = target.firstChild, other = second.document.body;
+  let calls = 0;
+  try {
+    const observers = Array.from({ length: 3 }, () => new first.window.MutationObserver(() => calls++));
+    for (const observer of observers) {
+      observer.observe(first.document.body, { attributes: true, subtree: true });
+      observer.observe(other, { attributes: true });
+    }
+    target.remove(); child.setAttribute('x', '1'); other.setAttribute('x', '1');
+    await first.window.happyDOM.close(); await tick();
+    expect(calls).toBe(0);
+    for (const node of [target, child, other]) expect(node[symbols.mutationListeners]).toHaveLength(0);
+    for (const observer of observers) expect(observer.takeRecords()).toEqual([]);
+    child.setAttribute('x', '2'); other.setAttribute('x', '2'); await tick();
+    expect(calls).toBe(0);
+  } finally { await first.window.happyDOM.close(); await second.window.happyDOM.close(); }
+});
+
+test('repeated subtree moves retain only live registrations and disconnect releases every listener', async () => {
+  const { window, document } = parseHTMLDocument('<section><div><span></span></div><aside></aside></section>');
+  const root = document.querySelector('section'), parent = root.firstChild, child = parent.firstChild, other = root.lastChild;
+  const nodes = [root, parent, child, other]; const seen = [];
+  try {
+    const observer = new window.MutationObserver(records => seen.push(records.length));
+    observer.observe(root, { attributes: true, childList: true, subtree: true });
+    observer.observe(parent, { attributes: true, subtree: true });
+    for (let round = 0; round < 10; round++) {
+      parent.remove(); child.remove(); other.appendChild(child); root.appendChild(parent);
+      parent.appendChild(child); parent.remove(); root.appendChild(parent);
+      await tick();
+      expect(nodes.map(node => node[symbols.mutationListeners].length)).toEqual([1, 2, 2, 1]);
+    }
+    parent.remove(); child.remove(); observer.disconnect();
+    for (const node of nodes) expect(node[symbols.mutationListeners]).toHaveLength(0);
+    const count = seen.length; child.setAttribute('after', '1'); await tick();
+    expect(seen).toHaveLength(count);
+  } finally { await window.happyDOM.close(); }
+});
+
+test('callback exceptions are reported without aborting later observers', async () => {
+  const { window, document } = parseHTMLDocument('<div></div>');
+  const events = [];
+  try {
+    window.addEventListener('error', event => { events.push(event.message); event.preventDefault(); });
+    const first = new window.MutationObserver(() => { events.push('first'); throw new Error('expected-observer-error'); });
+    const second = new window.MutationObserver(() => events.push('second'));
+    for (const observer of [first, second]) observer.observe(document.body, { attributes: true });
+    document.body.setAttribute('x', '1'); await tick();
+    expect(events).toEqual(['first', 'expected-observer-error', 'second']);
+  } finally { await window.happyDOM.close(); }
+});
+
+test('SES observer delivery agrees with Chromium for batching, options and callback mutations', async () => {
+  const child = Bun.spawn([process.execPath, new URL('./fixtures/mutation-observer.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);
+}, 15_000);