Made of little things.

import assert from 'node:assert/strict';
import { createRequire } from 'node:module';
import { realpathSync } from 'node:fs';
import { mkdir, readFile } from 'node:fs/promises';
import { execFileSync } from 'node:child_process';
const require = createRequire(realpathSync('node_modules/@napplet/conformance-cli/package.json'));
const { chromium } = require('playwright');
const info = JSON.parse(execFileSync('soyli', ['browser', 'path', '--json'], { encoding: 'utf8' }));
const browser = await chromium.launch({ executablePath: info.executables.find(e => e.name === 'chromium' && e.installed).path, headless: true });
const output = '.napplet-space/evidence-checks'; await mkdir(output, { recursive: true });
const errors = [];
async function open(page) {
  page.on('pageerror', e => errors.push(e.message)); await page.goto(process.argv[2]);
  const iframe = page.locator('iframe'); await iframe.waitFor();
  const f = await (await iframe.elementHandle()).contentFrame(); await f.locator('#app[data-ready=true]').waitFor();
  return { iframe, f };
}
async function resize(page, iframe, f, w, h) {
  await page.setViewportSize({ width: w, height: h });
  await iframe.evaluate((el, [w,h]) => el.style.cssText = `position:fixed;inset:0;width:${w}px;height:${h}px;min-width:0;min-height:0;z-index:9999;border:0`, [w,h]);
  await f.waitForFunction(([w,h]) => innerWidth === w && innerHeight === h, [w,h]);
}
async function syntheticPhoto(page, type = 'image/png', label = 'SYNTHETIC PHOTO TEST') {
  const url = await page.evaluate(([type,label]) => {
    const c = document.createElement('canvas'); c.width=1600;c.height=1000;const x=c.getContext('2d');
    x.fillStyle='#f2dad0';x.fillRect(0,0,1600,1000);if(type==='image/png'){const d=x.createImageData(1600,200);let v=7;for(let i=0;i<d.data.length;i+=4){v=(Math.imul(v,1664525)+1013904223)>>>0;d.data[i]=v&255;d.data[i+1]=(v>>>8)&255;d.data[i+2]=(v>>>16)&255;d.data[i+3]=255;}x.putImageData(d,0,300);}x.fillStyle='#202124';x.font='54px sans-serif';x.fillText(label,90,160);x.fillStyle='#c43c20';x.fillRect(220,300,450,450);
    return c.toDataURL(type,.9);
  }, [type,label]);
  return { name: `synthetic.${type.split('/')[1]}`, mimeType:type, buffer:Buffer.from(url.split(',')[1],'base64') };
}
async function pick(page, button, file) {
  await button.click(); const input = page.locator('input[type=file]:visible'); await input.waitFor({timeout:15000}); await input.setInputFiles(file);
}
const saved = f => f.waitForFunction(() => document.querySelector('#sessionStatus').textContent === 'Session saved');
let page;
try {
  page = await browser.newPage({viewport:{width:1600,height:1000}});
  let {iframe,f}=await open(page);await resize(page,iframe,f,1600,1000);
  assert.equal(await f.locator('footer').count(),0);assert.ok(await f.locator('header #nextButton').isVisible());
  await f.locator('#examplesButton').click();await f.locator('[data-example-preview=longstanding]').click();
  assert.match(await f.locator('.example-preview').innerText(),/decades|Always/);await f.locator('[data-example-load=longstanding]').click();
  assert.ok(await f.locator('#exampleBanner').isVisible());assert.equal(await f.locator('#concernCount').innerText(),'3');
  assert.equal(await f.locator('#chronic').inputValue(),'yes');
  await f.locator('#timingText').fill('For decades; always noticeable in winter.');await f.locator('#chronic').selectOption('unsure');
  await f.locator('#concernAttachment').click();await page.getByRole('button',{name:'Cancel',exact:true}).click();await f.getByRole('heading',{name:'Photo not added',exact:true}).waitFor();await f.locator('#closeModal').click();
  assert.equal(await f.locator('.photo-tile').count(),0);
  await pick(page,f.locator('#concernAttachment'),{name:'invalid.jpg',mimeType:'image/jpeg',buffer:Buffer.from('not an image')});await f.getByRole('heading',{name:'Photo not added',exact:true}).waitFor();assert.match(await f.locator('#modalContent').innerText(),/not a supported/);await f.locator('#closeModal').click();
  const largePhoto=await syntheticPhoto(page);assert.ok(largePhoto.buffer.length>262144,'Fixture exercises multiple SDK read chunks');
  await pick(page, f.locator('#concernAttachment'), largePhoto);
  await f.locator('.photo-editor').waitFor({timeout:20000});
  const id=await f.locator('.photo-editor').getAttribute('data-photo-editor');
  await f.locator('[data-photo-field=caption]').fill('Synthetic left knee photo — fixture only.');await f.locator('[data-photo-field=takenOn]').fill('2026-10-01');
  assert.equal(await f.locator('[data-photo-field=includeInAi]').isChecked(),false);
  await f.locator('[data-photo-field=includeInAi]').check();await f.locator('#closeModal').first().click();await saved(f);
  await page.reload();({iframe,f}=await open(page));await resize(page,iframe,f,1600,1000);
  assert.equal(await f.locator('#timingText').inputValue(),'For decades; always noticeable in winter.');assert.equal(await f.locator('#chronic').inputValue(),'unsure');
  await f.locator(`[data-photo-open="${id}"]`).click();
  assert.equal(await f.locator('[data-photo-field=caption]').inputValue(),'Synthetic left knee photo — fixture only.');
  assert.equal(await f.locator('[data-photo-field=takenOn]').inputValue(),'2026-10-01');assert.equal(await f.locator('[data-photo-field=includeInAi]').isChecked(),true);
  assert.ok(await f.locator('.photo-preview').evaluate(i=>i.complete&&i.naturalWidth>0&&i.naturalWidth<=1280));
  await pick(page,f.locator('[data-photo-replace]'),await syntheticPhoto(page,'image/webp','REPLACED TEST IMAGE'));
  await f.locator('.photo-editor').waitFor();assert.equal(await f.locator('[data-photo-field=includeInAi]').isChecked(),false,'Replacement requires renewed sharing choice');
  await f.locator('[data-photo-field=concernId]').selectOption('');await f.locator('#closeModal').first().click();
  await f.locator('[data-page=context]').first().click();assert.equal(await f.locator('.photo-tile').count(),1);
  await saved(f);await page.screenshot({path:`${output}/photos-desktop.png`});
  console.log('PASS: real host picker cancellation/invalid-file recovery, chunked PNG and WebP import, resizing, editing, assignment, replacement, timing and actual reload persistence.');
  for(const theme of ['light','dark']) {
    await page.setViewportSize({width:1600,height:1000});await iframe.evaluate(e=>e.style.cssText='');
    const appearance=page.getByRole('button',{name:/Appearance:/});
    for(let n=0;n<4;n++){if(((await appearance.getAttribute('aria-label'))||await appearance.innerText()).toLowerCase().includes(theme))break;await appearance.click();}
    for(const [w,h] of [[1600,1000],[900,600],[320,560],[200,160]]) {
      await resize(page,iframe,f,w,h);
      if(w===200){assert.ok(await f.locator('.minimum-notice').isVisible());continue;}
      for(const selector of ['#nextButton','#examplesButton','#connectionsButton','#sessionStatus']) assert.ok(await f.locator(selector).evaluate(e=>{const r=e.getBoundingClientRect();return r.left>=0&&r.right<=innerWidth&&r.top>=0&&r.bottom<=innerHeight;}),`${selector} fits ${w}`);
      assert.equal(await f.locator('#app').evaluate(e=>getComputedStyle(e).color),'rgb(32, 33, 36)');
      await f.locator('.photo-tile').click();await f.locator('[data-photo-field=caption]').fill('Synthetic photo — accessible at all tested sizes.');
      await f.locator('#closeModal').first().click();await f.locator('#modal').waitFor({state:'hidden'});await page.screenshot({path:`${output}/${theme}-${w}.png`});
    }
  }
  await resize(page,iframe,f,1600,1000);await f.locator('.photo-tile').click();await f.locator('[data-photo-remove]').click();assert.equal(await f.locator('.photo-tile').count(),0);await saved(f);
  await page.reload();({iframe,f}=await open(page));assert.equal(await f.locator('.photo-tile').count(),0);
  await f.locator('#examplesButton').click();await f.locator('[data-example-preview=skin]').click();await f.locator('[data-example-load=skin]').click();
  assert.match(await f.locator('#modalContent').innerText(),/Replace the current case/);await f.locator('[data-example-cancel]').click();assert.equal(await f.locator('#concernCount').innerText(),'3');
  await f.locator('#startOwnCase').click();await f.locator('#confirmOwnCase').click();assert.equal(await f.locator('#concernCount').innerText(),'0');assert.equal(await f.locator('#exampleBanner').isVisible(),false);
  await page.close();
  console.log('PASS: removal persists, template replacement requires explicit confirmation, and all header controls fit required desktop/narrow frames in both host themes.');
  const touch=await browser.newContext({viewport:{width:390,height:844},hasTouch:true,isMobile:true});const tp=await touch.newPage();page=tp;const t=await open(tp);
  for(const [w,h] of [[390,844],[360,640],[844,390]]) {
    await resize(tp,t.iframe,t.f,w,h);await t.f.locator('#examplesButton').tap();await t.f.locator('[data-example-preview=running]').tap();await t.f.locator('[data-example-load=running]').tap();
    if(await t.f.locator('[data-example-confirm]').count())await t.f.locator('[data-example-confirm]').tap();
    await t.f.locator('#modal').waitFor({state:'hidden'});
    if(w<761)await t.f.locator('button[data-panel=concerns]').tap();
    await t.f.locator('#timingText').fill('Since last week; happens after longer walks.');await t.f.locator('#chronic').selectOption('no');
    await tp.screenshot({path:`${output}/touch-${w}.png`});
  }
  await touch.close();
  const absent=await browser.newPage({viewport:{width:900,height:600}});absent.on('pageerror',e=>errors.push(e.message));await absent.setContent('<iframe sandbox="allow-scripts" style="position:fixed;inset:0;width:900px;height:600px;border:0"></iframe>');
  await absent.locator('iframe').evaluate((e,html)=>e.srcdoc=html,await readFile('dist/index.html','utf8'));const af=await (await absent.locator('iframe').elementHandle()).contentFrame();await af.locator('#app[data-ready=true]').waitFor();
  await af.locator('[data-page=context]').first().click();await af.locator('#contextAttachment').click();assert.match(await af.locator('#toast').innerText(),/unavailable/);assert.equal(await af.locator('#sessionStatus').innerText(),'Session only');
  assert.deepEqual(errors,[]);console.log('PASS: touch templates/timing, missing fs/storage/theme fallback, no browser errors.');await absent.close();
} catch(error) { if(page&&!page.isClosed())await page.screenshot({path:`${output}/failure.png`});throw error; }
finally {await browser.close();}