tricu

syntax-probe.mjs (3451B)

---

 // Browser-only presentation checks: no evaluator/compiler substitution.
 const assert=(ok,message)=>{if(!ok)throw Error(message);};
 export async function syntaxProbe(){
  const source=document.getElementById('source-editor'), input=document.getElementById('expression-editor');
  const wrapper=input.closest('.syntax-editor'), mirror=wrapper.querySelector('pre');
  assert(source.closest('.syntax-editor').querySelector('.syntax-definition'),'Loaded source declarations are highlighted');
  const sourceMirror=source.closest('.syntax-editor').querySelector('pre');
  await new Promise(r=>requestAnimationFrame(()=>requestAnimationFrame(r)));
  assert(Math.abs(sourceMirror.scrollHeight-source.scrollHeight)<=2,'Source mirror wrapping matches native editor: '+JSON.stringify({viewport:innerWidth,input:source.scrollHeight,mirror:sourceMirror.scrollHeight,width:source.clientWidth,mirrorWidth:sourceMirror.style.width,lineHeight:getComputedStyle(source).lineHeight}));
  assert(document.querySelector('#source .syntax-definition'),'Read-only source gets the same tokens');
  assert(wrapper.querySelector('[aria-hidden=true]')&&input.tagName==='TEXTAREA','Decorative mirror leaves native accessible textarea intact');
  const saved=input.value;
  const set=value=>{input.value=value;input.dispatchEvent(new Event('input'));};
  const caret=position=>{input.focus();input.setSelectionRange(position,position);input.dispatchEvent(new Event('select'));};
  set('let named x = [x (t)] in named "λ🙂["');
  assert(mirror.querySelector('.syntax-definition').textContent==='named','Local declaration color');
  assert(mirror.textContent===input.value,'Mirror preserves all source bytes');
  assert(getComputedStyle(mirror.querySelector('.syntax-definition')).color!==getComputedStyle(mirror.querySelector('.syntax-name')).color,'Definition names have a dedicated color');
  caret(input.value.indexOf('['));assert(mirror.querySelectorAll('.bracket-match').length===2,'Caret highlights bracket pair');
  caret(input.value.lastIndexOf('['));assert(!mirror.querySelector('.bracket-match'),'String brackets are ignored');
  input.setSelectionRange(0,4);input.dispatchEvent(new Event('select'));assert(!mirror.querySelector('.bracket-match'),'Range selections have no caret match');
  set('(t');caret(0);assert(mirror.querySelector('.bracket-unmatched'),'Unclosed delimiter marked without compiler interaction');
  set('<img src=x onerror="throw 1">');assert(!mirror.querySelector('img')&&mirror.textContent===input.value,'Source cannot become HTML');
  input.dispatchEvent(new CompositionEvent('compositionstart'));
  assert(wrapper.classList.contains('composing')&&getComputedStyle(wrapper.querySelector('.syntax-viewport')).visibility==='hidden','IME uses visible native text, not a duplicate mirror');
  set('"λ🙂"');input.dispatchEvent(new CompositionEvent('compositionend'));assert(!wrapper.classList.contains('composing'),'IME restores highlighting');
  set(Array(80).fill('"λ🙂" t (t t) '+ 'longIdentifier '.repeat(12)).join('\n')+'\n');
  await new Promise(r=>requestAnimationFrame(()=>requestAnimationFrame(r)));
  assert(Math.abs(mirror.scrollHeight-input.scrollHeight)<=2,'Wrapping and trailing-line heights match native textarea');
  input.scrollTop=300;input.dispatchEvent(new Event('scroll'));
  assert(mirror.style.transform.includes('-300px'),'Scrolling keeps decoration aligned');
  input.blur();set(saved);input.scrollTop=0;input.dispatchEvent(new Event('scroll'));
 }