live_interaction_contracts

import { chromium, firefox, webkit } from 'playwright';
for (const [n,l] of [['chromium',chromium],['firefox',firefox],['webkit',webkit]]) {
  const b = await l.launch(); const p = await (await b.newContext()).newPage();
  await p.goto('http://127.0.0.1:4126/');
  await p.waitForFunction(()=>document.querySelector('[data-phx-main]')?.classList.contains('phx-connected'),null,{timeout:8000});
  await p.waitForTimeout(200);
  // focus the CONTAINER (aria-activedescendant model), then content patch
  await p.evaluate(()=>document.getElementById('clist').focus());
  const before = await p.evaluate(()=>document.activeElement?.id);
  await p.click('#c-content');
  await p.waitForFunction(()=>document.querySelector('[data-item="alpha"]')?.textContent.includes('v1'),null,{timeout:6000}).catch(()=>{});
  await p.waitForTimeout(150);
  const after = await p.evaluate(()=>document.activeElement?.id);
  // now container tag swap (replaces container)
  await p.evaluate(()=>document.getElementById('clist').focus());
  await p.click('#c-container-tag');
  await p.waitForFunction(()=>document.getElementById('clist')?.tagName==='OL',null,{timeout:6000}).catch(()=>{});
  await p.waitForTimeout(150);
  const afterSwap = await p.evaluate(()=>document.activeElement?.id);
  console.log(n, 'containerFocus: beforePatch='+before, 'afterContentPatch='+after, 'afterContainerReplace='+afterSwap);
  await b.close();
}