diff options
Diffstat (limited to 'scripts/theme-studio')
| -rw-r--r-- | scripts/theme-studio/WIP.json | 20 | ||||
| -rw-r--r-- | scripts/theme-studio/app-core.js | 13 | ||||
| -rw-r--r-- | scripts/theme-studio/browser-gates.js | 269 | ||||
| -rw-r--r-- | scripts/theme-studio/capture-default-faces.py | 62 | ||||
| -rw-r--r-- | scripts/theme-studio/face_coverage.py | 38 | ||||
| -rw-r--r-- | scripts/theme-studio/generate.py | 148 | ||||
| -rw-r--r-- | scripts/theme-studio/inline-strip.mjs | 15 | ||||
| -rw-r--r-- | scripts/theme-studio/test-app-core.mjs | 32 | ||||
| -rw-r--r-- | scripts/theme-studio/test-app-util.mjs | 6 | ||||
| -rw-r--r-- | scripts/theme-studio/test-colormath.mjs | 7 | ||||
| -rw-r--r-- | scripts/theme-studio/test_generate.py | 36 | ||||
| -rw-r--r-- | scripts/theme-studio/theme-studio.html | 280 |
12 files changed, 451 insertions, 475 deletions
diff --git a/scripts/theme-studio/WIP.json b/scripts/theme-studio/WIP.json index 830a013af..9735383e4 100644 --- a/scripts/theme-studio/WIP.json +++ b/scripts/theme-studio/WIP.json @@ -7390,32 +7390,36 @@ }, "orderless": { "orderless-match-face-0": { - "fg": "#223fbf", + "fg": "#cbd0d6", "bg": null, "weight": "bold", + "slant": "italic", "inherit": null, - "source": "default" + "source": "user" }, "orderless-match-face-1": { - "fg": "#8f0075", + "fg": "#c99990", "bg": null, "weight": "bold", + "slant": "italic", "inherit": null, - "source": "default" + "source": "user" }, "orderless-match-face-2": { - "fg": "#145a00", + "fg": "#c5d4ae", "bg": null, "weight": "bold", + "slant": "italic", "inherit": null, - "source": "default" + "source": "user" }, "orderless-match-face-3": { - "fg": "#804000", + "fg": "#bea9dc", "bg": null, "weight": "bold", + "slant": "italic", "inherit": null, - "source": "default" + "source": "user" } }, "org-roam": { diff --git a/scripts/theme-studio/app-core.js b/scripts/theme-studio/app-core.js index a69d958c0..f02191c67 100644 --- a/scripts/theme-studio/app-core.js +++ b/scripts/theme-studio/app-core.js @@ -156,17 +156,6 @@ function resolveUiAttr(face,attr,uimap){ return walkInheritChain(face,f=>UI_INHERIT[f],f=>uimap[f]&&uimap[f][attr]); } -// Text color for a swatch-dropdown popup row. A row showing a real palette color -// sits on the popup's own fixed background, so its name/hex text must inherit the -// popup foreground (return '' to use the CSS color). Coloring it for contrast -// against the swatch instead picks near-black text for a mid/dark swatch, which -// is unreadable on the dark popup. Only the "default" row, filled solid with -// SHOWN, uses a contrast color computed against that fill. -function dropdownRowTextColor(hex,shown,textOnFn){ - if(hex)return ''; - return shown?textOnFn(shown):''; -} - // Turn a theme name into a safe filename slug: collapse runs of disallowed // characters to a single dash, trim leading/trailing dashes, fall back to 'theme'. function slugify(name){return name.replace(/[^A-Za-z0-9._-]+/g,'-').replace(/^-+|-+$/g,'')||'theme';} @@ -566,4 +555,4 @@ function composeHoverTitle(doc,base){ return doc||base; } -export { nameToHex, migrateLegacyFace, cssWeight, faceDecoration, boxCss, faceCss, composeHoverTitle, normalizePkgFace, buildPkgmap, packagesForExport, mergePackagesInto, effResolve, resolveSyntaxFg, resolveUiAttr, dropdownRowTextColor, paletteOptionList, galleryModel, appViewKeysSorted, faceBoxNonDefaults, overflowNonDefault, clampHeight, HEIGHT_MIN, HEIGHT_MAX, stepViewIndex, spanNeighborHex, slugify, fgSetFor, floor, lMax, COVERED_FACES, columnsFromPalette, usedPaletteHexes, paletteUsages, regenColumn, rankByLightness, stepRepointPlan, sortColumns, sortColumnMembers, groundRoleOfEntry, groundColumnMembersFromPalette, clearPalettePlan, deletePaletteColumnPlan, areAllLocked, lockToggleLabel, toggleLockSet }; +export { nameToHex, migrateLegacyFace, cssWeight, faceDecoration, boxCss, faceCss, composeHoverTitle, normalizePkgFace, buildPkgmap, packagesForExport, mergePackagesInto, effResolve, resolveSyntaxFg, resolveUiAttr, paletteOptionList, galleryModel, appViewKeysSorted, faceBoxNonDefaults, overflowNonDefault, clampHeight, HEIGHT_MIN, HEIGHT_MAX, stepViewIndex, spanNeighborHex, slugify, fgSetFor, floor, lMax, COVERED_FACES, columnsFromPalette, usedPaletteHexes, paletteUsages, regenColumn, rankByLightness, stepRepointPlan, sortColumns, sortColumnMembers, groundRoleOfEntry, groundColumnMembersFromPalette, clearPalettePlan, deletePaletteColumnPlan, areAllLocked, lockToggleLabel, toggleLockSet }; diff --git a/scripts/theme-studio/browser-gates.js b/scripts/theme-studio/browser-gates.js index 5d747b1d8..503d7ea11 100644 --- a/scripts/theme-studio/browser-gates.js +++ b/scripts/theme-studio/browser-gates.js @@ -1,3 +1,52 @@ +// Shared gate harness. Each call site keeps its literal location.hash==='#NAMEtest' +// check (run-tests.sh greps it); gate() owns the ok/notes/A setup and the verdict +// postamble. Note format standardized to ' fails=note1,note2'. +function gate(id, body){ + const name=id.toUpperCase(); + let ok=true;const notes=[]; + const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; + body(A); + const verdict=name+' '+(ok?'PASS':'FAIL'); + document.title=verdict; + const d=document.createElement('div');d.id=id; + d.textContent=verdict+(notes.length?' fails='+notes.join(','):''); + document.body.appendChild(d); +} +function withSavedState(keys, body){ + // Snapshot the named studio globals, run BODY, then restore them in a finally + // so opening the studio at a #gate hash doesn't leave its state mutated for + // interactive use. Each key maps to a [get, set, clone] triple over the live + // let-binding. Scope the keys to what the gate actually touches. + // JSON clone (not structuredClone): the studio data objects carry values + // structuredClone throws on, and a JSON round-trip of the data is exactly what + // the gates' own local saves already use. + const jc=x=>JSON.parse(JSON.stringify(x)); + const reg={ + PALETTE:[()=>PALETTE, v=>{PALETTE=v;}, jc], + MAP:[()=>MAP, v=>{MAP=v;}, jc], + SYNTAX:[()=>SYNTAX, v=>{SYNTAX=v;}, jc], + UIMAP:[()=>UIMAP, v=>{UIMAP=v;}, jc], + PKGMAP:[()=>PKGMAP, v=>{PKGMAP=v;}, jc], + LOCKED:[()=>LOCKED, v=>{LOCKED.clear();for(const k of v)LOCKED.add(k);}, s=>new Set(s)], + }; + const snap=keys.map(k=>[k, reg[k][2](reg[k][0]())]); + try{ body(); } + finally{ for(const [k,v] of snap) reg[k][1](v); } +} +// Shared preview-face validator for the #mdtest / #mupreviewtest / #gnustest +// gates: render HTML into a detached div, then assert it exercises at least +// MINCOUNT data-faces, that every data-face is a real face of the package +// (drawn from FACES, the app's face rows), and that each face in REQUIRED is +// present. A is the gate's assertion collector; NAME labels the failure note. +function assertPreviewFaces(A, html, faces, minCount, name, required){ + const box=document.createElement('div');box.innerHTML=html; + const valid=new Set((faces||[]).map(r=>r[0])); + const used=[...box.querySelectorAll('[data-face]')].map(e=>e.dataset.face); + A(used.length>=minCount,'preview exercises many faces ('+used.length+')'); + const bad=used.filter(f=>!valid.has(f)); + A(bad.length===0,'every data-face is a real '+name+' face; bad='+bad.join(',')); + for(const f of required) A(used.includes(f),'preview includes '+f); +} // Phase-1 self-test (open with #selftest): seed -> export -> import -> compare. function pkgSelftest(){ const seeded=seedPkgmap(); @@ -24,7 +73,7 @@ if(location.hash==='#selftest')pkgSelftest(); // preserve, across all three tiers. (1) Locking a row disables its controls via // the shared mkLockCell. (2) reset/erase batch actions update editable rows but // leave locked rows (syntax bare-kind, ui:, pkg: keys) untouched. -if(location.hash==='#locktest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#locktest')gate('locktest',A=>withSavedState(['PALETTE','MAP','SYNTAX','UIMAP','PKGMAP','LOCKED'],()=>{ const cssRgb=h=>{const [r,g,b]=hex2rgb(h);return 'rgb('+r+', '+g+', '+b+')';}; LOCKED.clear();buildTable(); {const k=CATS.map(c=>c[0]).filter(k=>k!=='bg'&&k!=='p')[0]; @@ -94,13 +143,12 @@ if(location.hash==='#locktest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c if(filter&&faces.length>1){filter.value=faces[0];buildPkgTable();const b=document.getElementById('pkglocktoggle');b.click(); A(faces.every(face=>LOCKED.has('pkg:'+app+':'+face)),'pkg lock-all covers the whole package even when filtered'); filter.value='';buildPkgTable();}} - document.title='LOCKTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='locktest';d.textContent='LOCKTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + })); // Sort gate (open with #sorttest): all three tables now share srtTable/cellVal. // Verifies the syntax table (which used to have its own srt) sorts by color // value and by element name, that a repeat click reverses, and that the UI and // package tables still sort. Guards the unified sort for the later stages. -if(location.hash==='#sorttest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#sorttest')gate('sorttest',A=>{ const ddVals=tb=>[...document.querySelectorAll('#'+tb+' tr:not(.detailrow)')].map(tr=>{const dd=tr.cells[2].querySelector('.cdd');return dd?(dd.dataset.val||''):'';}); const txtVals=tb=>[...document.querySelectorAll('#'+tb+' tr:not(.detailrow)')].map(tr=>tr.cells[1].innerText.trim().toLowerCase()); const asc=a=>a.every((v,i)=>i===0||a[i-1]<=v),desc=a=>a.every((v,i)=>i===0||a[i-1]>=v); @@ -110,13 +158,12 @@ if(location.hash==='#sorttest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c srtTable('legbody',1);A(asc(txtVals('legbody')),'legbody-elements-asc'); buildUITable();srtTable('uibody',1);A(asc(txtVals('uibody')),'uibody-face-asc'); buildPkgTable();srtTable('pkgbody',2);A(asc(ddVals('pkgbody')),'pkgbody-fg-asc'); - document.title='SORTTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='sorttest';d.textContent='SORTTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + }); // Live-buffer rendering gate (open with #mocktest): pins the face-faithfulness // fixes so they cannot silently regress — overlay faces keep syntax colors and // honor their styles, the cursor sits on a glyph, line numbers honor weight, the // fringe shows its foreground indicator, and the mode-line carries its box. -if(location.hash==='#mocktest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#mocktest')gate('mocktest',A=>withSavedState(['UIMAP','PKGMAP'],()=>{ const Q=s=>document.querySelector('#mockframe '+s); buildMockFrame(); A(Q('[data-face="highlight"] [data-k]'),'highlight-keeps-token-colors'); @@ -165,13 +212,12 @@ if(location.hash==='#mocktest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c A(pkgWeight()&&pkgWeight().dataset.val==='','pkg weight dropdown starts empty when model is unset'); pickEnum(pkgWeight(),'heavy'); A(PKGMAP[app][face].weight==='heavy'&&PKGMAP[app][face].source==='user','pkg weight dropdown writes the model and marks the face edited'); - document.title='MOCKTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='mocktest';d.textContent='MOCKTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + })); // Palette-generator gate (open with #generatortest): previewing is non-mutating, // clicking a generated tile loads the existing selector, adding creates a normal // singleton base column, and appending a preview column commits all span members // under one stable column id. -if(location.hash==='#generatortest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#generatortest')gate('generatortest',A=>{ const before=JSON.stringify(PALETTE); A(document.getElementById('genaccents').value==='5','default accent count is 5'); A(document.getElementById('gensource').value==='palette','default generator source is palette'); @@ -221,12 +267,11 @@ if(location.hash==='#generatortest'){let ok=true;const notes=[];const A=(c,n)=>{ GEN_PROPOSAL={summary:{generated:1,rejected:0,minContrast:null},columns:[{name:'medium-aquamarine',members:[{name:'medium-aquamarine',hex:'#66cdaa',offset:0,columnId:'medium-aquamarine'}]}]}; renderGeneratorPreview(); A(document.querySelector('#genpreview .genchip .gn').textContent==='medium aquamarine','generated tile names display spaces instead of hyphens'); - document.title='GENERATORTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='generatortest';d.textContent='GENERATORTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + }); // Auto-dim gate (open with #autodimtest): the bespoke split preview shows the // selected language in both panes -- the left in real syntax colors, the right // collapsed to the single auto-dim-other-buffers face -- and tracks the langsel. -if(location.hash==='#autodimtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#autodimtest')gate('autodimtest',A=>{ const langs=Object.keys(SAMPLES),ls=document.getElementById('langsel'); ls.value=langs[0]; const box=document.createElement('div');box.innerHTML=renderAutodimPreview(); @@ -240,8 +285,7 @@ if(location.hash==='#autodimtest'){let ok=true;const notes=[];const A=(c,n)=>{if if(langs.length>1){const t1=box.textContent;ls.value=langs[1]; const box2=document.createElement('div');box2.innerHTML=renderAutodimPreview(); A(box2.textContent!==t1,'preview tracks the language selector');ls.value=langs[0];} - document.title='AUTODIMTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='autodimtest';d.textContent='AUTODIMTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + }); if(location.hash.startsWith('#pick')){openPicker();const m=location.hash.slice(5);if(m){const b=document.querySelector('.pmode button[data-m="'+m+'"]');if(b)b.click();}} if(location.hash==='#cursortest'){document.getElementById('newhexstr').value='#67809c';openPicker();const sc=document.getElementById('svcur'),hc=document.getElementById('huecur');const L=parseFloat(sc.style.left||'0'),T=parseFloat(sc.style.top||'0'),H=parseFloat(hc.style.top||'0');const ok=L>1&&T>1&&H>1;document.title='CURSORTEST '+(ok?'PASS':'FAIL');const d=document.createElement('div');d.id='cursortest';d.textContent='CURSORTEST '+(ok?'PASS':'FAIL')+' left='+sc.style.left+' top='+sc.style.top+' hue='+hc.style.top;document.body.appendChild(d);} if(location.hash.startsWith('#app')){const ap=location.hash.slice(4),s=document.getElementById('appsel');if(s&&ap){s.value=ap;pkgChanged();}} @@ -292,7 +336,7 @@ if(location.hash==='#readouttest'){const hex='#67809c';document.getElementById(' // Worst-case readout gate (open with #contrasttest): a covered overlay face shows // the floor over its foreground set and names the limiting foreground, an // out-of-scope face keeps the single-pair readout, and an empty set reads "no fg set". -if(location.hash==='#contrasttest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#contrasttest')gate('contrasttest',A=>{ const saveMAP=Object.assign({},MAP),saveUI=JSON.parse(JSON.stringify(UIMAP)); CATS.forEach(c=>{if(c[0]!=='bg'&&c[0]!=='p')setSyntaxFg(c[0],'');}); setSyntaxFg('p','#f0fef0');setSyntaxFg('kw','#67809c');setSyntaxFg('str','#a3b18a');setSyntaxFg('bg','#000000'); @@ -357,12 +401,11 @@ if(location.hash==='#contrasttest'){let ok=true;const notes=[];const A=(c,n)=>{i }else A(false,'syntax table has a p row with a dropdown'); if(pLocked){LOCKED.add('p');buildTable();} for(const k in MAP)delete MAP[k];Object.assign(MAP,saveMAP);syncSyntaxFromCache();for(const f in UIMAP)delete UIMAP[f];Object.assign(UIMAP,saveUI);buildUITable();applyGround(); - document.title='CONTRASTTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='contrasttest';d.textContent='CONTRASTTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + }); // Bevel gate (open with #beveltest): released/pressed boxes derive their // highlight and shadow from the face's effective bg per Emacs's relief // algorithm, and pressed draws the shadow edge first. -if(location.hash==='#beveltest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#beveltest')gate('beveltest',A=>{ const saveUI=JSON.parse(JSON.stringify(UIMAP)),saveP=PALETTE.slice(),savePK=JSON.parse(JSON.stringify(PKGMAP)); UIMAP['mode-line']={fg:'#d8dee9',bg:'#30343c',weight:null,slant:null,underline:null,strike:null,box:{style:'released',width:1,color:null}}; buildUITable(); @@ -388,14 +431,13 @@ if(location.hash==='#beveltest'){let ok=true;const notes=[];const A=(c,n)=>{if(! if(pdd){pdd.click();const redRow=[...document.querySelectorAll('.cddpop .cddgc')].find(c=>(c.dataset.name||'').includes('red'));if(redRow)redRow.click();} A(PKGMAP[app][face].box&&PKGMAP[app][face].box.color==='#ff0000','package box color dropdown writes box.color'); PALETTE=saveP;PKGMAP=savePK;for(const f in UIMAP)delete UIMAP[f];Object.assign(UIMAP,saveUI);buildUITable();buildPkgTable(); - document.title='BEVELTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='beveltest';d.textContent='BEVELTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + }); // Gallery gate (open with #gallerytest): the color dropdown opens a 2D grid in // the palette-panel shape. Driven on a throwaway dropdown so no real face state // is mutated. Covers: grid opens, every palette color has a cell, a cell click // fires onPick + updates the trigger, the pick highlights on reopen, the default // chip clears. -if(location.hash==='#gallerytest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#gallerytest')gate('gallerytest',A=>withSavedState(['MAP','SYNTAX'],()=>{ let picked='__none__'; const dd=mkColorDropdown(ddList(''),'',(hex)=>{picked=hex;},{}); document.body.appendChild(dd); @@ -419,11 +461,10 @@ if(location.hash==='#gallerytest'){let ok=true;const notes=[];const A=(c,n)=>{if trig.click();const defc=document.querySelector('.cddpop.cddgrid .cddgdef');if(defc)defc.click(); A(picked==='','the default chip clears the assignment: '+JSON.stringify(picked)); dd.remove();closeColorDropdown(); - document.title='GALLERYTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='gallerytest';d.textContent='GALLERYTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + })); // Preview-link gate (open with #previewlinktest): known bespoke-preview face // mappings stay wired to the face that Emacs actually uses. -if(location.hash==='#previewlinktest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#previewlinktest')gate('previewlinktest',A=>{ const box=document.createElement('div'); box.innerHTML=renderOrgPreview(); const headline=[...box.querySelectorAll('[data-face="org-headline-todo"]')].find(e=>e.textContent.includes('Heading three')); @@ -438,11 +479,10 @@ if(location.hash==='#previewlinktest'){let ok=true;const notes=[];const A=(c,n)= const bob=[...box.querySelectorAll('[data-face="erc-default-face"]')].some(e=>e.textContent.includes('hi craig')); A(own,'erc own sent message uses erc-input-face'); A(bob,'erc remote message uses erc-default-face'); - document.title='PREVIEWLINKTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='previewlinktest';d.textContent='PREVIEWLINKTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + }); // Safe-lightness gate (open with #safetest): the OKLCH picker shades the unsafe // lightness band for a selected covered face and hides it when no face is selected. -if(location.hash==='#safetest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#safetest')gate('safetest',A=>withSavedState(['MAP','SYNTAX'],()=>{ const saveMAP=Object.assign({},MAP); setSyntaxFg('p','#f0fef0');setSyntaxFg('kw','#67809c');setSyntaxFg('bg','#000000'); document.getElementById('newhexstr').value='#202830';openPicker();setPkModel('oklch'); @@ -454,11 +494,10 @@ if(location.hash==='#safetest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c A(band&&band.style.display==='none','safe band hidden when no face is selected'); for(const k in MAP)delete MAP[k];Object.assign(MAP,saveMAP);syncSyntaxFromCache(); setPkModel('hsv');closePicker(); - document.title='SAFETEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='safetest';d.textContent='SAFETEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + })); // Gone-rebind gate (open with #healtest): deleting a named color then recreating // the name re-points face references stranded on the old hex to the new color. -if(location.hash==='#healtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#healtest')gate('healtest',A=>{ const saveP=PALETTE.slice(),saveM=Object.assign({},MAP),saveU=JSON.parse(JSON.stringify(UIMAP)),savePK=JSON.parse(JSON.stringify(PKGMAP)),saveG=Object.assign({},lastGone),saveSel=selectedIdx; PALETTE=[['#0d0b0a','ground'],['#cdced1','fg'],['#67809c','blue']];setSyntaxFg('kw','#67809c');lastGone={};selectedIdx=null;renderPalette();buildTable(); const blue=[...document.querySelectorAll('#pals .pchip')].find(c=>c.querySelector('.nm')&&c.querySelector('.nm').value==='blue'); @@ -471,12 +510,11 @@ if(location.hash==='#healtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c A(!('blue' in lastGone),'heal consumed the gone entry'); PALETTE=saveP;for(const k in MAP)delete MAP[k];Object.assign(MAP,saveM);syncSyntaxFromCache();for(const f in UIMAP)delete UIMAP[f];Object.assign(UIMAP,saveU);PKGMAP=savePK;lastGone=saveG;selectedIdx=saveSel; renderPalette();buildTable();buildUITable();if(document.getElementById('pkgbody'))buildPkgTable(); - document.title='HEALTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='healtest';d.textContent='HEALTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + }); // Column-strip gate (open with #columntest): the palette renders as a pinned // ground column plus structural columns, chips keep their controls, and renaming // a color leaves it in the same strip because the column id is stable. -if(location.hash==='#columntest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#columntest')gate('columntest',A=>{ const saveP=PALETTE.slice(),saveM=Object.assign({},MAP),saveG=Object.assign({},lastGone),saveSel=selectedIdx; setSyntaxFg('bg','#0d0b0a');setSyntaxFg('p','#f0fef0'); PALETTE=[['#0d0b0a','ground'],['#f0fef0','fg'],['#c0402a','red'],['#3a6ea5','blue'],['#808080','gray']];selectedIdx=null;renderPalette(); @@ -559,13 +597,12 @@ if(location.hash==='#columntest'){let ok=true;const notes=[];const A=(c,n)=>{if( A(lastGone['blue']==='#3a6ea5'&&lastGone['blue+1']==='#92acc2','clear palette records removed names for recovery'); A(selectedIdx===null,'clear palette clears selected color'); PALETTE=saveP;for(const k in MAP)delete MAP[k];Object.assign(MAP,saveM);syncSyntaxFromCache();lastGone=saveG;selectedIdx=saveSel;renderPalette(); - document.title='COLUMNTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='columntest';d.textContent='COLUMNTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + }); // Count-control gate (open with #counttest): the per-column count regenerates the // column — count up adds symmetric steps, count down drops the extremes, a // reference to a surviving step follows the new hex, a reference to a removed step // is left on its old (now-gone) hex. -if(location.hash==='#counttest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#counttest')gate('counttest',A=>{ const saveP=PALETTE.slice(),saveM=Object.assign({},MAP),saveU=JSON.parse(JSON.stringify(UIMAP)),saveSel=selectedIdx; paletteShowFull=true; // this gate asserts span tiles, so render the full palette setSyntaxFg('bg','#204060');setSyntaxFg('p','#f0fef0'); @@ -611,12 +648,11 @@ if(location.hash==='#counttest'){let ok=true;const notes=[];const A=(c,n)=>{if(! const lo=_lum(MAP['bg']),hi=_lum(MAP['p']),blue=PALETTE.filter(p=>p[2]==='blue').map(p=>_lum(p[0])); A(blue.length&&blue.every(L=>L>=lo-1e-6&&L<=hi+1e-6),'generated span stays within the bg/fg bounds');} PALETTE=saveP;for(const k in MAP)delete MAP[k];Object.assign(MAP,saveM);syncSyntaxFromCache();for(const f in UIMAP)delete UIMAP[f];Object.assign(UIMAP,saveU);selectedIdx=saveSel;renderPalette(); - document.title='COUNTTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='counttest';d.textContent='COUNTTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + }); // Base-edit + ground-edit gate (open with #baseedittest): editing a column base // recolors the whole column at the same count and references follow; editing a // ground swatch writes the bg/fg assignment. -if(location.hash==='#baseedittest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#baseedittest')gate('baseedittest',A=>{ const saveP=PALETTE.slice(),saveM=Object.assign({},MAP),saveU=JSON.parse(JSON.stringify(UIMAP)),saveSel=selectedIdx; setSyntaxFg('bg','#0d0b0a');setSyntaxFg('p','#f0fef0'); PALETTE=[['#0d0b0a','ground'],['#f0fef0','fg']]; @@ -647,11 +683,10 @@ if(location.hash==='#baseedittest'){let ok=true;const notes=[];const A=(c,n)=>{i A(!PALETTE.some(p=>/^fg[+-]\d+$/.test(p[1])),'editing fg does not generate fg span tiles from a same-hex normal column'); A(PALETTE.find(p=>p[1]==='fg')[2]==='ground','editing fg preserves the ground column id'); PALETTE=saveP;for(const k in MAP)delete MAP[k];Object.assign(MAP,saveM);syncSyntaxFromCache();for(const f in UIMAP)delete UIMAP[f];Object.assign(UIMAP,saveU);selectedIdx=saveSel;renderPalette(); - document.title='BASEEDITTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='baseedittest';d.textContent='BASEEDITTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + }); // Round-trip gate (open with #roundtriptest): export stays a flat palette with // stable column ids, and import does not need color-derived column reconstruction. -if(location.hash==='#roundtriptest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#roundtriptest')gate('roundtriptest',A=>{ const stable=o=>Array.isArray(o)?o.map(stable):(o&&typeof o==='object'?Object.fromEntries(Object.keys(o).sort().map(k=>[k,stable(o[k])])):o); const diff=(a,b,p='')=>{if(JSON.stringify(a)===JSON.stringify(b))return '';if(typeof a!==typeof b||!a||!b||typeof a!=='object')return p+': '+JSON.stringify(a)+' != '+JSON.stringify(b); const ks=[...new Set([...Object.keys(a),...Object.keys(b)])].sort();for(const k of ks){const d=diff(a[k],b[k],p?p+'.'+k:k);if(d)return d;}return p;}; @@ -669,13 +704,12 @@ if(location.hash==='#roundtriptest'){let ok=true;const notes=[];const A=(c,n)=>{ A(obj.palette.some(e=>e[1]==='renamed-blue'&&e[2]==='blue'),'renamed color keeps its stable column id through export/import'); A(obj.locks&&obj.locks.includes('kw')&&obj.locks.includes('ui:region'),'lock state survives export/import'); PALETTE=saveP;for(const k in MAP)delete MAP[k];Object.assign(MAP,saveM);syncSyntaxFromCache();LOCKED=saveL; - document.title='ROUNDTRIPTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='roundtriptest';d.textContent='ROUNDTRIPTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + }); // View-selector gate (open with #viewtest): the assignment panel is driven by a // single #viewsel dropdown -- two editor entries (@code, @ui) then a "package // faces" optgroup of every app, alphabetically by label -- and switching it // shows exactly one of the three view blocks. -if(location.hash==='#viewtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#viewtest')gate('viewtest',A=>{ const sel=document.getElementById('viewsel'); A(!!sel,'viewsel-exists'); if(sel){ @@ -695,14 +729,13 @@ if(location.hash==='#viewtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c A(curApp()===firstApp,'curApp-returns-selected-app'); A(!document.querySelector('#pkgbody .sbtn[title="reset to default"]'),'no-per-row-reset-button'); } - document.title='VIEWTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='viewtest';d.textContent='VIEWTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // Non-default-marker gate (open with #ndtest): a per-face setting cell gets the // .nd corner flag only when its value differs from the face's seed default. Cell // order in a pkg row: 0 lock, 1 label, 2 fg, 3 bg, 4 style, 5 box, 6 contrast. // inherit + height live in the row expander, so a non-default height flags the // expander toggle (exp-nd) rather than an inline cell. -if(location.hash==='#ndtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#ndtest')gate('ndtest',A=>withSavedState(['PKGMAP','LOCKED'],()=>{ LOCKED.clear(); const app=curApp(),row=APPS[app].faces[0],face=row[0]; PKGMAP[app][face]=seedFace(row[2]||{});buildPkgTable(); @@ -717,22 +750,20 @@ if(location.hash==='#ndtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ A(tr2.cells[4].classList.contains('nd'),'toggled-weight-marks-style-box'); A(!tr2.querySelector('.exptoggle').classList.contains('exp-nd'),'restored-height-unflags-expander'); PKGMAP[app][face]=seedFace(row[2]||{});buildPkgTable(); - document.title='NDTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='ndtest';d.textContent='NDTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + })); // Contrast-cell gate (open with #crtest): the per-face contrast column shows a // bare colored number (no PASS/FAIL word); the WCAG verdict lives in the hover. -if(location.hash==='#crtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#crtest')gate('crtest',A=>{ const app=curApp(),face=APPS[app].faces[0][0];buildPkgTable(); const cell=document.querySelector('#pkgbody tr[data-face="'+face+'"]').cells[6]; const span=cell&&cell.querySelector('span'); A(span&&/^\d+\.\d$/.test(span.textContent.trim()),'contrast cell is a bare number: '+(span&&span.textContent)); A(span&&!/PASS|FAIL/.test(span.textContent),'no PASS/FAIL word in the contrast cell'); A(span&&span.title&&/(passes|fails) WCAG/i.test(span.title),'contrast cell carries a WCAG hover: '+(span&&span.title)); - document.title='CRTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='crtest';d.textContent='CRTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // View-nav gate (open with #navtest): the prev/next arrows flanking the view // dropdown step the selection (clamped, no wrap) and re-render the view. -if(location.hash==='#navtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#navtest')gate('navtest',A=>{ const sel=document.getElementById('viewsel'),prev=document.getElementById('viewprev'),next=document.getElementById('viewnext'); A(!!prev&&!!next,'nav arrows exist'); if(sel&&prev&&next){ @@ -746,57 +777,35 @@ if(location.hash==='#navtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c) sel.selectedIndex=2;onViewChange(); A(sel.options[2]&&sel.options[2].value[0]!=='@'&&vis('view-pkg'),'stepping to a package shows the pkg view'); } - document.title='NAVTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='navtest';d.textContent='NAVTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // Markdown-preview gate (open with #mdtest): markdown-mode has a dedicated README // renderer, and every data-face it emits is a real markdown-mode face. -if(location.hash==='#mdtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#mdtest')gate('mdtest',A=>{ A(APPS['markdown-mode']&&APPS['markdown-mode'].preview==='markdown','markdown-mode wired to the markdown preview'); A(!!PACKAGE_PREVIEWS['markdown'],'markdown renderer registered'); if(PACKAGE_PREVIEWS['markdown']&&APPS['markdown-mode']){ - const box=document.createElement('div');box.innerHTML=PACKAGE_PREVIEWS['markdown'](); - const valid=new Set(APPS['markdown-mode'].faces.map(r=>r[0])); - const used=[...box.querySelectorAll('[data-face]')].map(e=>e.dataset.face); - A(used.length>=15,'preview exercises many faces ('+used.length+')'); - const bad=used.filter(f=>!valid.has(f)); - A(bad.length===0,'every data-face is a real markdown face; bad='+bad.join(',')); - for(const f of ['markdown-header-face-1','markdown-bold-face','markdown-inline-code-face','markdown-blockquote-face','markdown-gfm-checkbox-face','markdown-table-face']) - A(used.includes(f),'preview includes '+f); + assertPreviewFaces(A, PACKAGE_PREVIEWS['markdown'](), APPS['markdown-mode'].faces, 15, 'markdown', + ['markdown-header-face-1','markdown-bold-face','markdown-inline-code-face','markdown-blockquote-face','markdown-gfm-checkbox-face','markdown-table-face']); } - document.title='MDTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='mdtest';d.textContent='MDTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // mu4e-preview gate (open with #mupreviewtest): the mu4e preview is a realistic // headers list + message view, and every data-face it emits is a real mu4e face. -if(location.hash==='#mupreviewtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; - const box=document.createElement('div');box.innerHTML=renderMu4ePreview(); - const valid=new Set((APPS['mu4e']&&APPS['mu4e'].faces||[]).map(r=>r[0])); - const used=[...box.querySelectorAll('[data-face]')].map(e=>e.dataset.face); - A(used.length>=20,'preview exercises many faces ('+used.length+')'); - const bad=used.filter(f=>!valid.has(f)); - A(bad.length===0,'every data-face is a real mu4e face; bad='+bad.join(',')); - for(const f of ['mu4e-unread-face','mu4e-flagged-face','mu4e-replied-face','mu4e-draft-face','mu4e-trashed-face','mu4e-header-highlight-face','mu4e-header-marks-face','mu4e-contact-face','mu4e-compose-separator-face']) - A(used.includes(f),'preview includes '+f); - document.title='MUPREVIEWTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='mupreviewtest';d.textContent='MUPREVIEWTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} +if(location.hash==='#mupreviewtest')gate('mupreviewtest',A=>{ + assertPreviewFaces(A, renderMu4ePreview(), APPS['mu4e']&&APPS['mu4e'].faces, 20, 'mu4e', + ['mu4e-unread-face','mu4e-flagged-face','mu4e-replied-face','mu4e-draft-face','mu4e-trashed-face','mu4e-header-highlight-face','mu4e-header-marks-face','mu4e-contact-face','mu4e-compose-separator-face']); + }); // gnus-preview gate (open with #gnustest): gnus is its own view package (it drives // the mu4e article view), and every data-face its preview emits is a real gnus face. -if(location.hash==='#gnustest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#gnustest')gate('gnustest',A=>{ A(!!APPS['gnus'],'gnus is a registered view package'); A(APPS['gnus']&&APPS['gnus'].preview==='gnus','gnus uses the gnus preview renderer'); - const box=document.createElement('div');box.innerHTML=renderGnusPreview(); - const valid=new Set((APPS['gnus']&&APPS['gnus'].faces||[]).map(r=>r[0])); - const used=[...box.querySelectorAll('[data-face]')].map(e=>e.dataset.face); - A(used.length>=20,'preview exercises many faces ('+used.length+')'); - const bad=used.filter(f=>!valid.has(f)); - A(bad.length===0,'every data-face is a real gnus face; bad='+bad.join(',')); - for(const f of ['gnus-header-name','gnus-header-from','gnus-header-subject','gnus-cite-1','gnus-cite-attribution','gnus-signature','gnus-button','gnus-emphasis-highlight-words']) - A(used.includes(f),'preview includes '+f); - document.title='GNUSTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='gnustest';d.textContent='GNUSTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + assertPreviewFaces(A, renderGnusPreview(), APPS['gnus']&&APPS['gnus'].faces, 20, 'gnus', + ['gnus-header-name','gnus-header-from','gnus-header-subject','gnus-cite-1','gnus-cite-attribution','gnus-signature','gnus-button','gnus-emphasis-highlight-words']); + }); // picker-distinct gate (open with #pickertest): the color picker panel must stand // out from the page background. It carries a highlighted gold accent border, and its // background is meaningfully lighter than the body so the two are easy to tell apart. -if(location.hash==='#pickertest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#pickertest')gate('pickertest',A=>{ const pk=document.getElementById('picker');A(!!pk,'picker element exists'); if(pk){const cs=getComputedStyle(pk),body=getComputedStyle(document.body); const bc=(cs.borderTopColor.match(/\d+/g)||[]).slice(0,3).map(Number); @@ -806,12 +815,11 @@ if(location.hash==='#pickertest'){let ok=true;const notes=[];const A=(c,n)=>{if( const lift=pkbg.map((c,i)=>c-bdbg[i]); A(lift.every(d=>d>=12),'picker background is clearly lighter than the page (per-channel lift '+lift.join(',')+')'); } - document.title='PICKERTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='pickertest';d.textContent='PICKERTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // Box-cluster gate (open with #boxtest): the box control is a 2x2 cluster of // four radio buttons (none / line / pressed / raised); the color swatch shows // only while a box style is active. -if(location.hash==='#boxtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#boxtest')gate('boxtest',A=>{ LOCKED.clear();const f=UI_FACES[0][0];const saveBox=UIMAP[f].box; UIMAP[f].box=null;buildUITable(); const cell=document.querySelector('#uibody tr[data-face="'+f+'"]').cells[5]; @@ -827,11 +835,10 @@ if(location.hash==='#boxtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c) A(UIMAP[f].box===null,'blank-click-clears-box'); A(dd.style.display==='none','color-hidden-again-after-clear'); UIMAP[f].box=saveBox;buildUITable(); - document.title='BOXTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='boxtest';d.textContent='BOXTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // Style-cluster gate (open with #styletest): the style cell holds a weight // selector, a slant selector, and box-like underline and strike controls. -if(location.hash==='#styletest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#styletest')gate('styletest',A=>{ buildUITable();const f=UI_FACES[0][0]; const cell=document.querySelector('#uibody tr[data-face="'+f+'"]').cells[4]; const cluster=cell.querySelector('.stylecluster'); @@ -851,11 +858,10 @@ if(location.hash==='#styletest'){let ok=true;const notes=[];const A=(c,n)=>{if(! A(sital&&sital.style.fontStyle==='italic','slant-options-preview-their-own-slant: italic renders italic'); closeColorDropdown(); A(cluster&&cluster.querySelectorAll('.boxctl').length===1,'strike-control-in-row-underline-moved-to-expander'); - document.title='STYLETEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='styletest';d.textContent='STYLETEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // Expander gate (open with #expandtest): the per-row "more" toggle reveals a // detail row with the overflow attribute editor, and its controls write the model. -if(location.hash==='#expandtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#expandtest')gate('expandtest',A=>{ buildUITable(); const row=document.querySelector('#uibody tr[data-face="region"]'); const detail=document.querySelector('#uibody tr.detailrow[data-detail-for="region"]'); @@ -895,13 +901,12 @@ if(location.hash==='#expandtest'){let ok=true;const notes=[];const A=(c,n)=>{if( buildPkgTable();const pface=APPS[curApp()].faces[0][0]; const pdetail=document.querySelector('#pkgbody tr.detailrow[data-detail-for="'+pface+'"]'); A(pdetail&&pdetail.querySelector('select.detailsel'),'package-expander-offers-inherit'); - document.title='EXPANDTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='expandtest';d.textContent='EXPANDTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // Height-clamp gate (open with #heighttest): the expander height field coerces a // typed value into [HEIGHT_MIN,HEIGHT_MAX] and writes the clamped number back, so // an out-of-range type/paste can't reach the model. Guards the fact that an // <input type=number> min/max only constrain its steppers, never typed text. -if(location.hash==='#heighttest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#heighttest')gate('heighttest',A=>{ const face=UI_FACES[0][0],save=JSON.parse(JSON.stringify(UIMAP[face])); buildUITable(); const hin=()=>document.querySelector('#uibody tr.detailrow[data-detail-for="'+face+'"] .hstep'); @@ -916,12 +921,11 @@ if(location.hash==='#heighttest'){let ok=true;const notes=[];const A=(c,n)=>{if( typeHeight(''); A(UIMAP[face].height===null,'blank-unsets-to-null: '+UIMAP[face].height); UIMAP[face]=save;buildUITable(); - document.title='HEIGHTTEST '+(ok?'PASS':'FAIL'); - const hd=document.createElement('div');hd.id='heighttest';hd.textContent='HEIGHTTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(hd);} + }); // Language-dropdown gate (open with #langtest): the language list is sorted // alphabetically with Elisp pinned as the default selection, and the ‹ › arrows // step the selection (clamped, no wrap). -if(location.hash==='#langtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#langtest')gate('langtest',A=>{ buildLangSel(); const s=document.getElementById('langsel'); const labels=[...s.options].map(o=>o.value); @@ -934,11 +938,10 @@ if(location.hash==='#langtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c A(s.selectedIndex===1,'next steps forward one'); s.selectedIndex=s.options.length-1;stepLang(1); A(s.selectedIndex===s.options.length-1,'next clamps at the last language'); - document.title='LANGTEST '+(ok?'PASS':'FAIL'); - const ld=document.createElement('div');ld.id='langtest';ld.textContent='LANGTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(ld);} + }); // View-lock-indicator gate (open with #viewlocktest): the view dropdown prefixes a // lock glyph on a view whose every element is locked, and clears it otherwise. -if(location.hash==='#viewlocktest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#viewlocktest')gate('viewlocktest',A=>withSavedState(['LOCKED'],()=>{ LOCKED.clear();updateViewLockIndicators(); const s=document.getElementById('viewsel'),codeOpt=()=>[...s.options].find(o=>o.value==='@code'); A(codeOpt()&&!codeOpt().textContent.startsWith('🔒'),'unlocked view shows no lock glyph: '+(codeOpt()&&codeOpt().textContent)); @@ -948,11 +951,10 @@ if(location.hash==='#viewlocktest'){let ok=true;const notes=[];const A=(c,n)=>{i LOCKED.delete(syntaxLockKeys()[0]);updateViewLockIndicators(); A(codeOpt()&&!codeOpt().textContent.startsWith('🔒'),'unlocking one element clears the glyph'); LOCKED.clear();updateViewLockIndicators(); - document.title='VIEWLOCKTEST '+(ok?'PASS':'FAIL'); - const vd=document.createElement('div');vd.id='viewlocktest';vd.textContent='VIEWLOCKTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(vd);} + })); // Detail-hover gate (open with #detailhovertest): every label in the expander // detail row carries an explanatory hover, the way the table-header labels do. -if(location.hash==='#detailhovertest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#detailhovertest')gate('detailhovertest',A=>{ buildUITable(); const f=UI_FACES[0][0],detail=document.querySelector('#uibody tr.detailrow[data-detail-for="'+f+'"]'); const fields=detail?[...detail.querySelectorAll('.detailfield')]:[]; @@ -960,12 +962,11 @@ if(location.hash==='#detailhovertest'){let ok=true;const notes=[];const A=(c,n)= A(fields.every(g=>g.title&&g.title.length>0),'every detail field has a hover: '+fields.map(g=>g.querySelector('span').textContent+(g.title?'+':'-')).join(' ')); const inh=fields.find(g=>g.querySelector('span').textContent==='inherit'); A(inh&&/inherit/i.test(inh.title),'inherit field hover mentions inheritance: '+(inh&&inh.title)); - document.title='DETAILHOVERTEST '+(ok?'PASS':'FAIL'); - const dh=document.createElement('div');dh.id='detailhovertest';dh.textContent='DETAILHOVERTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(dh);} + }); // Expand/collapse-all gate (open with #expandalltest): the header toggle opens or // closes every row's detail at once, the per-row triangles track state (▶ closed, // ▼ open), and the header button's label follows the aggregate. -if(location.hash==='#expandalltest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#expandalltest')gate('expandalltest',A=>{ buildUITable(); const tb=document.getElementById('uibody'),btn=document.getElementById('uiexpandall'); const details=()=>[...tb.querySelectorAll('tr.detailrow')]; @@ -983,12 +984,11 @@ if(location.hash==='#expandalltest'){let ok=true;const notes=[];const A=(c,n)=>{ firstTog().click(); A(open()===1,'a single row toggle opens just that row'); A(btn.textContent.indexOf('▼')===0,'button reflects a single open row as ▼ collapse all'); - document.title='EXPANDALLTEST '+(ok?'PASS':'FAIL'); - const ea=document.createElement('div');ea.id='expandalltest';ea.textContent='EXPANDALLTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(ea);} + }); // Expander-persistence gate (open with #expandpersisttest): a package edit rebuilds // the whole table, so an open expander must reopen instead of collapsing under the // user. Editing a value inside the open expander must not close the row. -if(location.hash==='#expandpersisttest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#expandpersisttest')gate('expandpersisttest',A=>withSavedState(['PKGMAP'],()=>{ EXPANDED.clear(); const app=curApp(),face=APPS[app].faces[0][0];buildPkgTable(); const row=()=>document.querySelector('#pkgbody tr[data-face="'+face+'"]'); @@ -1002,20 +1002,18 @@ if(location.hash==='#expandpersisttest'){let ok=true;const notes=[];const A=(c,n row().querySelector('.exptoggle').click();buildPkgTable(); A(detail()&&detail().style.display==='none','a collapsed expander stays collapsed across a rebuild'); EXPANDED.clear();buildPkgTable(); - document.title='EXPANDPERSISTTEST '+(ok?'PASS':'FAIL'); - const ep=document.createElement('div');ep.id='expandpersisttest';ep.textContent='EXPANDPERSISTTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(ep);} + })); // Palette default-state gate (open with #paldefaulttest): the studio opens with // the palette collapsed to base colors so the span tints don't crowd the first // view. initApp() ran at page load, so the live toggle reflects the opening state. -if(location.hash==='#paldefaulttest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#paldefaulttest')gate('paldefaulttest',A=>{ const tg=document.getElementById('paltoggle'); A(!!tg,'palette toggle present after boot'); A(tg&&tg.textContent==='▶','palette opens collapsed to base colors (arrow shows right-pointing ▶)'); - document.title='PALDEFAULTTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='paldefaulttest';d.textContent='PALDEFAULTTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // Palette display-toggle gate (open with #paltoggletest): the arrow control // collapses each column to its base color and expands back to full spans. -if(location.hash==='#paltoggletest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#paltoggletest')gate('paltoggletest',A=>{ const saveP=PALETTE.slice(),saveM=Object.assign({},MAP); paletteShowFull=true; // start expanded so the first click collapses to base-only setSyntaxFg('bg','#101010');setSyntaxFg('p','#f0f0f0'); @@ -1032,12 +1030,11 @@ if(location.hash==='#paltoggletest'){let ok=true;const notes=[];const A=(c,n)=>{ document.getElementById('paltoggle').click(); A(blueChips()===5,'toggling-back-restores-spans'); PALETTE=saveP;for(const k in MAP)delete MAP[k];Object.assign(MAP,saveM);syncSyntaxFromCache();renderPalette(); - document.title='PALTOGGLETEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='paltoggletest';d.textContent='PALTOGGLETEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // Unused-tile gate (open with #unusedtest): a palette color referenced nowhere // in the theme gets the .unused flag; a column with no used members gets // .unused-col; referenced colors stay unflagged. -if(location.hash==='#unusedtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#unusedtest')gate('unusedtest',A=>{ const saveP=PALETTE.slice(),saveM=Object.assign({},MAP),saveSyn=JSON.parse(JSON.stringify(SYNTAX)),saveU=JSON.parse(JSON.stringify(UIMAP)); setSyntaxFg('bg','#101010');setSyntaxFg('p','#f0f0f0'); PALETTE=[['#101010','bg','ground'],['#f0f0f0','fg','ground'],['#67809c','blue','blue'],['#123456','teal','teal']]; @@ -1053,12 +1050,11 @@ if(location.hash==='#unusedtest'){let ok=true;const notes=[];const A=(c,n)=>{if( A(tealStrip&&tealStrip.classList.contains('unused-col'),'all-unused-column-flagged'); A(blueStrip&&!blueStrip.classList.contains('unused-col'),'used-column-not-flagged'); PALETTE=saveP;for(const k in MAP)delete MAP[k];Object.assign(MAP,saveM);for(const k in SYNTAX)delete SYNTAX[k];Object.assign(SYNTAX,saveSyn);for(const f in UIMAP)delete UIMAP[f];Object.assign(UIMAP,saveU);syncSyntaxFromCache();renderPalette(); - document.title='UNUSEDTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='unusedtest';d.textContent='UNUSEDTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // Gone-assignment gate (open with #gonetest): a swatch whose assigned color is // no longer in the palette gets the .gone flag; an assignment to a present color // does not. -if(location.hash==='#gonetest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#gonetest')gate('gonetest',A=>{ const saveP=PALETTE.slice(),saveM=Object.assign({},MAP),saveU=JSON.parse(JSON.stringify(UIMAP)); setSyntaxFg('bg','#101010');setSyntaxFg('p','#f0f0f0'); PALETTE=[['#101010','bg','ground'],['#f0f0f0','fg','ground'],['#67809c','blue','blue']]; @@ -1070,11 +1066,10 @@ if(location.hash==='#gonetest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c A(goneDd&&goneDd.classList.contains('gone'),'assignment-to-missing-color-flagged'); A(okDd&&!okDd.classList.contains('gone'),'assignment-to-present-color-not-flagged'); PALETTE=saveP;for(const k in MAP)delete MAP[k];Object.assign(MAP,saveM);for(const f in UIMAP)delete UIMAP[f];Object.assign(UIMAP,saveU);syncSyntaxFromCache();buildUITable(); - document.title='GONETEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='gonetest';d.textContent='GONETEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // Tile-usage-hover gate (open with #usagetest): a tile's title lists the // "view area > element" pairings that use its color, under the name/hex line. -if(location.hash==='#usagetest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#usagetest')gate('usagetest',A=>{ const saveP=PALETTE.slice(),saveM=Object.assign({},MAP),saveU=JSON.parse(JSON.stringify(UIMAP)); setSyntaxFg('bg','#101010');setSyntaxFg('p','#f0f0f0'); PALETTE=[['#101010','bg','ground'],['#f0f0f0','fg','ground'],['#67809c','blue','blue']]; @@ -1086,12 +1081,11 @@ if(location.hash==='#usagetest'){let ok=true;const notes=[];const A=(c,n)=>{if(! A(blueChip&&blueChip.title.includes('ui faces > '+f0label),'hover-title-lists-ui-face-usage'); A(blueChip&&blueChip.title.split('\n').length>1,'usage-list-on-its-own-line-under-current-info'); PALETTE=saveP;for(const k in MAP)delete MAP[k];Object.assign(MAP,saveM);for(const f in UIMAP)delete UIMAP[f];Object.assign(UIMAP,saveU);syncSyntaxFromCache();renderPalette(); - document.title='USAGETEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='usagetest';d.textContent='USAGETEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // Element-docstring hovers (open with #hovertest): each table's category cell // carries the face's Emacs docstring on top of its prior hover text, and the // existing label-span hints are left intact (added in addition, not replaced). -if(location.hash==='#hovertest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#hovertest')gate('hovertest',A=>{ buildTable();buildUITable();buildPkgTable(); const synCell=document.querySelector('#legbody tr[data-kind="kw"] .cat'); A(synCell&&synCell.title===SYNTAX_DOCS['kw'],'syntax cat cell shows the category face docstring: '+(synCell&&synCell.title)); @@ -1103,8 +1097,7 @@ if(location.hash==='#hovertest'){let ok=true;const notes=[];const A=(c,n)=>{if(! A(docFace,'a package face with a docstring exists to test'); if(docFace){const pkgCell=document.querySelector('#pkgbody tr[data-face="'+docFace+'"] .cat'); A(pkgCell&&pkgCell.title===FACE_DOCS[docFace]+'\n\n'+docFace,'package cat cell shows docstring on top of the face name: '+(pkgCell&&JSON.stringify(pkgCell.title)));} - document.title='HOVERTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='hovertest';d.textContent='HOVERTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // Export via the File System Access API (open with #savetest): exportTheme writes // the theme JSON straight to the picked file handle and closes it, so re-exporting // overwrites in place instead of the browser uniquifying to "name (1).json". diff --git a/scripts/theme-studio/capture-default-faces.py b/scripts/theme-studio/capture-default-faces.py index 8c8fd6679..a5214fd5a 100644 --- a/scripts/theme-studio/capture-default-faces.py +++ b/scripts/theme-studio/capture-default-faces.py @@ -163,47 +163,45 @@ def normalize_value(value: object) -> object: return value +def _condition_clauses_pass(clauses: dict) -> bool: + """Apply the four display-condition rules to a {key: values} mapping. + Returns False when any present clause excludes the GUI-light target.""" + if "class" in clauses: + vals = clauses["class"] + if "color" not in vals and "grayscale" not in vals: + return False + if "min-colors" in clauses: + vals = clauses["min-colors"] + if vals and isinstance(vals[0], int) and vals[0] > 16777216: + return False + if "background" in clauses: + vals = clauses["background"] + if vals and "light" not in vals: + return False + if "type" in clauses: + if "tty" in clauses["type"]: + return False + return True + + def condition_matches(condition: object) -> bool: if condition in (True, "t", None): return True if condition == "default": return False + # Normalize the two display-spec shapes -- a {key: values} dict, or a list of + # [key, *values] clauses -- to one {key: values} mapping, then run the four + # rules once (see `_condition_clauses_pass'). if isinstance(condition, dict): - if "class" in condition: - vals = condition["class"] or [] - if "color" not in vals and "grayscale" not in vals: - return False - if "min-colors" in condition: - vals = condition["min-colors"] or [] - if vals and isinstance(vals[0], int) and vals[0] > 16777216: - return False - if "background" in condition: - vals = condition["background"] or [] - if vals and "light" not in vals: - return False - if "type" in condition and "tty" in (condition["type"] or []): - return False - return True + clauses = {k: (condition[k] or []) for k in condition} + return _condition_clauses_pass(clauses) if not isinstance(condition, list): return False + clauses = {} for clause in condition: - if not isinstance(clause, list) or not clause: - continue - key = clause[0] - vals = clause[1:] - if key == "class": - if "color" not in vals and "grayscale" not in vals: - return False - elif key == "min-colors": - if vals and isinstance(vals[0], int) and vals[0] > 16777216: - return False - elif key == "background": - if vals and "light" not in vals: - return False - elif key == "type": - if "tty" in vals: - return False - return True + if isinstance(clause, list) and clause: + clauses[clause[0]] = clause[1:] + return _condition_clauses_pass(clauses) def choose_gui_light(default_spec: object) -> dict[str, object]: diff --git a/scripts/theme-studio/face_coverage.py b/scripts/theme-studio/face_coverage.py index ba761230b..c6200e05c 100644 --- a/scripts/theme-studio/face_coverage.py +++ b/scripts/theme-studio/face_coverage.py @@ -115,22 +115,37 @@ def load_managed(): CORE_FILES = {'faces', 'frame'} +def path_kind(path): + """Classify a defface source PATH into a coarse origin kind. + Returns one of: 'none' (no path), 'elpa', 'user', 'builtin', 'other'. + Shared by bucket_from_source and bucket_of_source, which each map the kind + to their own vocabulary.""" + if not path: + return 'none' + if '/elpa/' in path: + return 'elpa' + if '/.emacs.d/modules' in path: + return 'user' + if path.startswith('/usr/share/emacs') or path.startswith('/usr/lib/emacs'): + return 'builtin' + return 'other' + + def bucket_from_source(path): """Derive a bucket name from a face's defface file, for faces that match no known family. elpa -> the package dir name (version stripped); built-in -> the source file basename; otherwise emacs-core (can't tell).""" - if not path: - return 'emacs-core' - if '/elpa/' in path: + kind = path_kind(path) + if kind == 'elpa': pkgdir = path.split('/elpa/', 1)[1].split('/', 1)[0] return re.sub(r'-[0-9].*$', '', pkgdir) or 'emacs-core' - if '/.emacs.d/modules' in path: + if kind == 'user': return 'user-config' - if path.startswith('/usr/share/emacs') or path.startswith('/usr/lib/emacs'): + if kind == 'builtin': base = os.path.basename(path) base = base[:-3] if base.endswith('.el') else base return 'emacs-core' if base in CORE_FILES else base - return 'emacs-core' + return 'emacs-core' # 'none' or 'other' def make_group_of(families, src): @@ -155,15 +170,8 @@ def make_group_of(families, src): def bucket_of_source(path): - if not path: - return 'unloaded' - if '/elpa/' in path: - return 'elpa' - if '/.emacs.d/modules' in path: - return 'user' - if path.startswith('/usr/share/emacs') or path.startswith('/usr/lib/emacs'): - return 'builtin' - return 'other' + return {'none': 'unloaded', 'elpa': 'elpa', 'user': 'user', + 'builtin': 'builtin', 'other': 'other'}[path_kind(path)] def classify(name, items, src, pkgfaces): diff --git a/scripts/theme-studio/generate.py b/scripts/theme-studio/generate.py index f0955d2df..6baa67a91 100644 --- a/scripts/theme-studio/generate.py +++ b/scripts/theme-studio/generate.py @@ -72,7 +72,7 @@ SAMPLES={"Elisp":ns['ELS'],"Go":ns['GOS'],"Python":ns['PYS'],"TypeScript":ns['TS "Racket":ns['RACKETS'],"Scheme":ns['SCHEMES'],"Haskell":ns['HASKELLS'],"OCaml":ns['OCAMLS'],"Scala":ns['SCALAS'],"Kotlin":ns['KOTLINS'],"Swift":ns['SWIFTS'],"Lua":ns['LUAS'],"Ruby":ns['RUBYS'],"Perl":ns['PERLS'],"R":ns['RLANGS'],"Erlang":ns['ERLANGS'],"SQL":ns['SQLS'],"PHP":ns['PHPS'],"Ada":ns['ADAS'],"Fortran":ns['FORTRANS'],"MATLAB":ns['MATLABS'],"Assembly":ns['ASMS']} COLS=ns['COLS'] DEFAULT_FACES_PATH=os.path.join(HERE,'emacs-default-faces.json') -DEFAULTS=DefaultFaces.from_path(DEFAULT_FACES_PATH) + def column_id(name): name = name or 'color' if re.fullmatch(r'color-\d+', name): @@ -207,9 +207,6 @@ def apply_seed_packages(apps,data,seed): if seed: apply_package_overrides(apps,data.get('packages')) -MAP,BOLD,ITALIC_MAP=initial_maps(COLS,DEFAULTS) - -PALETTE=[[MAP['bg'],"bg","ground"],[MAP['p'],"fg","ground"]] CATS=[["bg","bg (ground)","Aa Bb 123"],["p","fg","other / whitespace"],["kw","keyword","class def if return"],["bi","builtin","len echo printf"], ["pp","preprocessor","#include #define"],["fnd","function · def","resolve push"], ["fnc","function · call","printf rsync get"],["dec","decorator → type","@dataclass"], @@ -231,72 +228,97 @@ UI_FACES=[["cursor","cursor","Aa|"],["region","region (selection)","selected tex ["show-paren-mismatch","show-paren-mismatch",") ("],["link","link","https://"], ["error","error","error!"],["warning","warning","warning"], ["success","success","ok"],["vertical-border","vertical-border","|"]] -UIMAP=build_uimap(UI_FACES,DEFAULTS) -# Optional palette seed: THEME_STUDIO_SEED=<file.json> seeds the tool's starting -# palette / syntax / UI from a theme.json (path relative to -# this dir), instead of the hardcoded defaults above. Unset leaves them unchanged. -# Placed after every default it overrides (notably UIMAP) so the merge has targets. -# Mirrors what the in-page Import does, so reseed and import agree. -LOCKS=[] -# THEME_STUDIO_SEED=<file>.json opens an existing theme as the starting point. -# Unset starts empty: only bg/fg are in the palette. -_seed=os.environ.get('THEME_STUDIO_SEED') -_d=load_seed_data(_seed) -PALETTE,UIMAP,LOCKS=apply_seed_basics(_d,PALETTE,UIMAP,LOCKS) -PALETTE=normalize_palette(PALETTE) -SYNTAX=build_syntax(COLS,MAP,BOLD,ITALIC_MAP,DEFAULTS) -apply_syntax_seed(_d if _seed else {},SYNTAX,MAP) -# Bespoke apps are single-sourced as BESPOKE_APP_SPECS in face_data.py (one -# row per app: key, label, preview, FACES, prefix, SEED). -APPS={key:{"label":label,"preview":preview,"faces":face_rows(faces,prefix,seed)} - for key,label,preview,faces,prefix,seed in BESPOKE_APP_SPECS} -# Phase 6: merge the generated all-package inventory (refresh with build-inventory.el). -# Bespoke apps stay; every other installed package becomes an editable generic app. -_inv_path=os.path.join(HERE,"package-inventory.json") -add_inventory_apps(APPS, _inv_path) -apply_default_face_seeds(APPS, DEFAULTS) -# Apply seed theme package overrides when THEME_STUDIO_SEED is set: each full -# per-face spec (color + structure) replaces the hardcoded face seed before render. -apply_seed_packages(APPS,_d,_seed) +OUT=os.path.join(HERE,'theme-studio.html') +_CACHE={} -if DEFAULTS.available: - add_default_palette_colors(PALETTE,MAP,SYNTAX,UIMAP,APPS,DEFAULTS) +def _build(): + """Assemble the page, caching the derived data + HTML. Deferred from import + so a consumer that only needs the cheap module constants (e.g. + face_coverage.py reading UI_FACES) does not pay the full DEFAULTS + inventory + + fill cost; the file write stays __main__-guarded as before.""" + if _CACHE: + return _CACHE + DEFAULTS=DefaultFaces.from_path(DEFAULT_FACES_PATH) + MAP,BOLD,ITALIC_MAP=initial_maps(COLS,DEFAULTS) + PALETTE=[[MAP['bg'],"bg","ground"],[MAP['p'],"fg","ground"]] + UIMAP=build_uimap(UI_FACES,DEFAULTS) -PALETTE=normalize_palette(PALETTE) -HTML=read_text('theme-studio.template.html') -# Fill the data placeholders. str.replace is literal (no backref interpretation), -# so backslashes in the inlined JS survive intact — the escaping-bug class that -# the triple-quoted string used to cause is gone now that app.js is a real file. -# Caveat: these tokens are replaced everywhere they appear, including inside code -# comments. Don't write a placeholder name (COLORMATH_J, APP_CORE_J, ...) in -# prose in any inlined file, or that prose gets the body spliced into it too. -def fill_data(s): - return (s.replace("COLORMATH_J",COLORMATH_BODY) - .replace("APP_CORE_J",APP_CORE_BODY) - .replace("PREVIEWS_J",PREVIEWS_BODY) - .replace("APP_UTIL_J",APP_UTIL_BODY) - .replace("PALETTE_GENERATOR_CORE_J",PALETTE_GENERATOR_CORE_BODY) - .replace("PALETTE_GENERATOR_UI_J",PALETTE_GENERATOR_UI_BODY) - .replace("PALETTE_ACTIONS_J",PALETTE_ACTIONS_BODY) - .replace("BROWSER_GATES_J",BROWSER_GATES_BODY) - .replace("COLOR_NAMES_J",json.dumps(COLOR_NAMES)) - .replace("FACE_DOCS_J",json.dumps(FACE_DOCS)).replace("SYNTAX_DOCS_J",json.dumps(SYNTAX_DOCS)) - .replace("SAMPLES_J",json.dumps(SAMPLES)) - .replace("PALETTE_J",json.dumps(PALETTE)).replace("CATS_J",json.dumps(CATS)) - .replace("UIFACES_J",json.dumps(UI_FACES)).replace("UIMAP_J",json.dumps(UIMAP)).replace("APPS_J",json.dumps(APPS)) - .replace("SYNTAX_J",json.dumps(SYNTAX)).replace("MAP_J",json.dumps(MAP)).replace("LOCKS_J",json.dumps(LOCKS))) + # Optional palette seed: THEME_STUDIO_SEED=<file.json> seeds the tool's starting + # palette / syntax / UI from a theme.json (path relative to + # this dir), instead of the hardcoded defaults above. Unset leaves them unchanged. + # Placed after every default it overrides (notably UIMAP) so the merge has targets. + # Mirrors what the in-page Import does, so reseed and import agree. + LOCKS=[] + # THEME_STUDIO_SEED=<file>.json opens an existing theme as the starting point. + # Unset starts empty: only bg/fg are in the palette. + _seed=os.environ.get('THEME_STUDIO_SEED') + _d=load_seed_data(_seed) + PALETTE,UIMAP,LOCKS=apply_seed_basics(_d,PALETTE,UIMAP,LOCKS) + PALETTE=normalize_palette(PALETTE) + SYNTAX=build_syntax(COLS,MAP,BOLD,ITALIC_MAP,DEFAULTS) + apply_syntax_seed(_d if _seed else {},SYNTAX,MAP) + # Bespoke apps are single-sourced as BESPOKE_APP_SPECS in face_data.py (one + # row per app: key, label, preview, FACES, prefix, SEED). + APPS={key:{"label":label,"preview":preview,"faces":face_rows(faces,prefix,seed)} + for key,label,preview,faces,prefix,seed in BESPOKE_APP_SPECS} + # Phase 6: merge the generated all-package inventory (refresh with build-inventory.el). + # Bespoke apps stay; every other installed package becomes an editable generic app. + _inv_path=os.path.join(HERE,"package-inventory.json") + add_inventory_apps(APPS, _inv_path) + apply_default_face_seeds(APPS, DEFAULTS) + # Apply seed theme package overrides when THEME_STUDIO_SEED is set: each full + # per-face spec (color + structure) replaces the hardcoded face seed before render. + apply_seed_packages(APPS,_d,_seed) -# Splice the stylesheet and script in first, then fill the data placeholders they -# carry. The page contains app.js exactly as fill_data(APP_BODY) renders it — -# APP_FILLED is that rendering, the handle the inline-integrity test asserts on. -HTML=fill_data(HTML.replace("STYLES_CSS",STYLES).replace("APP_JS",APP_BODY)) -APP_FILLED=fill_data(APP_BODY) -OUT=os.path.join(HERE,'theme-studio.html') + if DEFAULTS.available: + add_default_palette_colors(PALETTE,MAP,SYNTAX,UIMAP,APPS,DEFAULTS) + + PALETTE=normalize_palette(PALETTE) + HTML=read_text('theme-studio.template.html') + # Fill the data placeholders. str.replace is literal (no backref interpretation), + # so backslashes in the inlined JS survive intact — the escaping-bug class that + # the triple-quoted string used to cause is gone now that app.js is a real file. + # Caveat: these tokens are replaced everywhere they appear, including inside code + # comments. Don't write a placeholder name (COLORMATH_J, APP_CORE_J, ...) in + # prose in any inlined file, or that prose gets the body spliced into it too. + def fill_data(s): + return (s.replace("COLORMATH_J",COLORMATH_BODY) + .replace("APP_CORE_J",APP_CORE_BODY) + .replace("PREVIEWS_J",PREVIEWS_BODY) + .replace("APP_UTIL_J",APP_UTIL_BODY) + .replace("PALETTE_GENERATOR_CORE_J",PALETTE_GENERATOR_CORE_BODY) + .replace("PALETTE_GENERATOR_UI_J",PALETTE_GENERATOR_UI_BODY) + .replace("PALETTE_ACTIONS_J",PALETTE_ACTIONS_BODY) + .replace("BROWSER_GATES_J",BROWSER_GATES_BODY) + .replace("COLOR_NAMES_J",json.dumps(COLOR_NAMES)) + .replace("FACE_DOCS_J",json.dumps(FACE_DOCS)).replace("SYNTAX_DOCS_J",json.dumps(SYNTAX_DOCS)) + .replace("SAMPLES_J",json.dumps(SAMPLES)) + .replace("PALETTE_J",json.dumps(PALETTE)).replace("CATS_J",json.dumps(CATS)) + .replace("UIFACES_J",json.dumps(UI_FACES)).replace("UIMAP_J",json.dumps(UIMAP)).replace("APPS_J",json.dumps(APPS)) + .replace("SYNTAX_J",json.dumps(SYNTAX)).replace("MAP_J",json.dumps(MAP)).replace("LOCKS_J",json.dumps(LOCKS))) + + # Splice the stylesheet and script in first, then fill the data placeholders they + # carry. The page contains app.js exactly as fill_data(APP_BODY) renders it — + # APP_FILLED is that rendering, the handle the inline-integrity test asserts on. + HTML=fill_data(HTML.replace("STYLES_CSS",STYLES).replace("APP_JS",APP_BODY)) + APP_FILLED=fill_data(APP_BODY) + _CACHE.update(DEFAULTS=DEFAULTS, MAP=MAP, BOLD=BOLD, ITALIC_MAP=ITALIC_MAP, + PALETTE=PALETTE, UIMAP=UIMAP, LOCKS=LOCKS, SYNTAX=SYNTAX, + APPS=APPS, HTML=HTML, APP_FILLED=APP_FILLED) + return _CACHE + +def __getattr__(name): + # PEP 562: lazily expose any built attribute (HTML, MAP, APPS, ...). Every + # other name is a real module global and never reaches here. + built = _build() + if name in built: + return built[name] + raise AttributeError(f"module {__name__!r} has no attribute {name!r}") def render_theme_studio(out_path=OUT): with open(out_path,"w") as out: - out.write(HTML) + out.write(_build()['HTML']) print("wrote",out_path) if __name__=='__main__': diff --git a/scripts/theme-studio/inline-strip.mjs b/scripts/theme-studio/inline-strip.mjs new file mode 100644 index 000000000..112d55ce6 --- /dev/null +++ b/scripts/theme-studio/inline-strip.mjs @@ -0,0 +1,15 @@ +// Shared by the inline-integrity tests (test-colormath.mjs, test-app-core.mjs, +// test-app-util.mjs). Mirrors strip_exports in generate.py: drop top-level +// export/import lines (a pure module may import a peer for its own unit tests, +// while the inlined page copy relies on that peer already being present), then +// rstrip. The page is asserted to carry the stripped body verbatim, so this MUST +// stay aligned with generate.py's strip_exports -- one definition keeps the three +// test copies from drifting apart. +// +// (This file matches the `*.mjs` test glob in run-tests.sh; it carries no tests, +// so it contributes zero to the count.) +export const stripInlinedBody = (s) => + s.split('\n') + .filter((l) => !(l.startsWith('export') || l.startsWith('import'))) + .join('\n') + .replace(/\s+$/, ''); diff --git a/scripts/theme-studio/test-app-core.mjs b/scripts/theme-studio/test-app-core.mjs index cdfa0bc1e..217ea0e6b 100644 --- a/scripts/theme-studio/test-app-core.mjs +++ b/scripts/theme-studio/test-app-core.mjs @@ -7,7 +7,7 @@ import assert from 'node:assert/strict'; import { readFileSync } from 'node:fs'; import { fileURLToPath } from 'node:url'; import { - nameToHex, migrateLegacyFace, normalizePkgFace, buildPkgmap, packagesForExport, mergePackagesInto, effResolve, resolveSyntaxFg, resolveUiAttr, dropdownRowTextColor, paletteOptionList, spanNeighborHex, slugify, + nameToHex, migrateLegacyFace, normalizePkgFace, buildPkgmap, packagesForExport, mergePackagesInto, effResolve, resolveSyntaxFg, resolveUiAttr, paletteOptionList, spanNeighborHex, slugify, clearPalettePlan, deletePaletteColumnPlan, groundColumnMembersFromPalette, areAllLocked, lockToggleLabel, toggleLockSet, galleryModel, appViewKeysSorted, faceBoxNonDefaults, overflowNonDefault, stepViewIndex, cssWeight, faceDecoration, boxCss, faceCss, composeHoverTitle, @@ -819,35 +819,34 @@ test('slugify: Error — an all-disallowed name falls back to "theme"', () => { // Guards the one-source-of-truth contract, same as the colormath integrity test: // the page must carry app-core.js's body (sans exports) verbatim. Requires // `python3 generate.py` to have run first. -const stripExports = (s) => - s.split('\n').filter((l) => !(l.startsWith('export') || l.startsWith('import'))).join('\n').replace(/\s+$/, ''); +import { stripInlinedBody } from './inline-strip.mjs'; test('inline-integrity: theme-studio.html contains the app-core.js body verbatim', () => { - const body = stripExports(readFileSync(here + 'app-core.js', 'utf8')); + const body = stripInlinedBody(readFileSync(here + 'app-core.js', 'utf8')); const html = readFileSync(here + 'theme-studio.html', 'utf8'); assert.ok(html.includes(body), 'generated page is missing the app-core.js body verbatim'); }); test('inline-integrity: theme-studio.html contains palette-generator-core.js verbatim', () => { - const body = stripExports(readFileSync(here + 'palette-generator-core.js', 'utf8')); + const body = stripInlinedBody(readFileSync(here + 'palette-generator-core.js', 'utf8')); const html = readFileSync(here + 'theme-studio.html', 'utf8'); assert.ok(html.includes(body), 'generated page is missing palette-generator-core.js verbatim'); }); test('inline-integrity: theme-studio.html contains palette-generator-ui.js verbatim', () => { - const body = stripExports(readFileSync(here + 'palette-generator-ui.js', 'utf8')); + const body = stripInlinedBody(readFileSync(here + 'palette-generator-ui.js', 'utf8')); const html = readFileSync(here + 'theme-studio.html', 'utf8'); assert.ok(html.includes(body), 'generated page is missing palette-generator-ui.js verbatim'); }); test('inline-integrity: theme-studio.html contains palette-actions.js verbatim', () => { - const body = stripExports(readFileSync(here + 'palette-actions.js', 'utf8')); + const body = stripInlinedBody(readFileSync(here + 'palette-actions.js', 'utf8')); const html = readFileSync(here + 'theme-studio.html', 'utf8'); assert.ok(html.includes(body), 'generated page is missing palette-actions.js verbatim'); }); test('inline-integrity: theme-studio.html contains browser-gates.js verbatim', () => { - const body = stripExports(readFileSync(here + 'browser-gates.js', 'utf8')); + const body = stripInlinedBody(readFileSync(here + 'browser-gates.js', 'utf8')); const html = readFileSync(here + 'theme-studio.html', 'utf8'); assert.ok(html.includes(body), 'generated page is missing browser-gates.js verbatim'); }); @@ -901,23 +900,6 @@ test('resolveUiAttr: a face with no inherit and an unset attribute returns null' assert.equal(resolveUiAttr('region', 'bg', { 'region': { bg: null } }), null); }); -// dropdownRowTextColor: a popup row showing a real palette color inherits the -// popup foreground (legible on the fixed dark popup); only the filled default -// row uses a contrast color against its own background. textOn is stubbed so the -// test asserts the decision, not the contrast math. -const stubTextOn = (h) => (h === '#000000' ? '#fff' : '#000'); -test('dropdownRowTextColor: a real palette color inherits the popup fg (empty)', () => { - assert.equal(dropdownRowTextColor('#2a3a5a', '#2a3a5a', stubTextOn), ''); -}); -test('dropdownRowTextColor: a dark swatch still inherits (regression: blues were unreadable)', () => { - assert.equal(dropdownRowTextColor('#000000', '#000000', stubTextOn), ''); -}); -test('dropdownRowTextColor: the filled default row contrasts against its fill', () => { - assert.equal(dropdownRowTextColor('', '#cdced1', stubTextOn), '#000'); -}); -test('dropdownRowTextColor: a default row with no fill inherits (empty)', () => { - assert.equal(dropdownRowTextColor('', '', stubTextOn), ''); -}); // appViewKeysSorted: the assignment-view dropdown lists package apps // alphabetically by display label, independent of the APPS build order diff --git a/scripts/theme-studio/test-app-util.mjs b/scripts/theme-studio/test-app-util.mjs index 37cf0889b..057f55f8d 100644 --- a/scripts/theme-studio/test-app-util.mjs +++ b/scripts/theme-studio/test-app-util.mjs @@ -84,12 +84,10 @@ test('textOn: Boundary — straddles the ~0.179 luminance crossover', () => { // Inline-integrity: the page must carry app-util.js's body (sans import/export) // verbatim — the same strip generate.py applies. Requires `python3 generate.py`. -const stripModule = (s) => - s.split('\n').filter((l) => !(l.startsWith('export') || l.startsWith('import'))) - .join('\n').replace(/\s+$/, ''); +import { stripInlinedBody } from './inline-strip.mjs'; test('inline-integrity: theme-studio.html contains the app-util.js body verbatim', () => { - const body = stripModule(readFileSync(here + 'app-util.js', 'utf8')); + const body = stripInlinedBody(readFileSync(here + 'app-util.js', 'utf8')); const html = readFileSync(here + 'theme-studio.html', 'utf8'); assert.ok(html.includes(body), 'generated page is missing the app-util.js body verbatim'); }); diff --git a/scripts/theme-studio/test-colormath.mjs b/scripts/theme-studio/test-colormath.mjs index ee40e3437..a1ec9264e 100644 --- a/scripts/theme-studio/test-colormath.mjs +++ b/scripts/theme-studio/test-colormath.mjs @@ -18,9 +18,8 @@ import { const close = (a, b, eps = 0.005) => Math.abs(a - b) <= eps; const here = fileURLToPath(new URL('.', import.meta.url)); -// Same export-strip generate.py applies before inlining (drop `export` lines, rstrip). -const stripExports = (s) => - s.split('\n').filter((l) => !l.startsWith('export')).join('\n').replace(/\s+$/, ''); +// Same strip generate.py applies before inlining (drop export/import lines, rstrip). +import { stripInlinedBody } from './inline-strip.mjs'; test('srgb2oklab achromatic anchors', () => { const w = srgb2oklab('#ffffff'); @@ -266,7 +265,7 @@ test('reliefColors: malformed hex returns null pair (Error)', () => { // body (sans exports) verbatim, so the inlined copy and the tested module cannot // drift. Requires `python3 generate.py` to have run first. test('inline-integrity: theme-studio.html contains the colormath.js body verbatim', () => { - const body = stripExports(readFileSync(here + 'colormath.js', 'utf8')); + const body = stripInlinedBody(readFileSync(here + 'colormath.js', 'utf8')); const html = readFileSync(here + 'theme-studio.html', 'utf8'); assert.ok(html.includes(body), 'generated page is missing the colormath.js body verbatim'); }); diff --git a/scripts/theme-studio/test_generate.py b/scripts/theme-studio/test_generate.py index 40956917e..974fca68a 100644 --- a/scripts/theme-studio/test_generate.py +++ b/scripts/theme-studio/test_generate.py @@ -102,31 +102,17 @@ class AssembledPage(unittest.TestCase): self.assertIn("keyword", generate.SYNTAX_DOCS["kw"].lower()) self.assertIn(json.dumps(generate.SYNTAX_DOCS), generate.HTML) - def test_page_carries_the_colormath_body_verbatim(self): - # Python-side inline-integrity: the same guarantee the JS test asserts, but - # checked at the point the page is built rather than after a round-trip. - self.assertIn(generate.COLORMATH_BODY, generate.HTML) - - def test_page_carries_the_app_core_body_verbatim(self): - # app-core.js inlines verbatim (no data placeholders), so the inlined copy - # and the unit-tested module cannot drift. - self.assertIn(generate.APP_CORE_BODY, generate.HTML) - - def test_page_carries_the_app_util_body_verbatim(self): - # app-util.js inlines verbatim after its import line is stripped. - self.assertIn(generate.APP_UTIL_BODY, generate.HTML) - - def test_page_carries_palette_generator_core_verbatim(self): - self.assertIn(generate.PALETTE_GENERATOR_CORE_BODY, generate.HTML) - - def test_page_carries_palette_generator_ui_verbatim(self): - self.assertIn(generate.PALETTE_GENERATOR_UI_BODY, generate.HTML) - - def test_page_carries_palette_actions_verbatim(self): - self.assertIn(generate.PALETTE_ACTIONS_BODY, generate.HTML) - - def test_page_carries_browser_gates_verbatim(self): - self.assertIn(generate.BROWSER_GATES_BODY, generate.HTML) + def test_page_carries_each_inlined_body_verbatim(self): + # Python-side inline-integrity: every verbatim-inlined module (no data + # placeholders, exports/imports stripped) must appear in the page byte for + # byte, so the inlined copy and the unit-tested module cannot drift. Checked + # at build time rather than after a round-trip. app-util.js's import line is + # already stripped in APP_UTIL_BODY. + for name in ("COLORMATH_BODY", "APP_CORE_BODY", "APP_UTIL_BODY", + "PALETTE_GENERATOR_CORE_BODY", "PALETTE_GENERATOR_UI_BODY", + "PALETTE_ACTIONS_BODY", "BROWSER_GATES_BODY"): + with self.subTest(body=name): + self.assertIn(getattr(generate, name), generate.HTML) def test_app_util_inlined_body_has_no_import_line(self): # The `import rl` line must be gone, or the page <script> is invalid. diff --git a/scripts/theme-studio/theme-studio.html b/scripts/theme-studio/theme-studio.html index 97c36554e..4896a2387 100644 --- a/scripts/theme-studio/theme-studio.html +++ b/scripts/theme-studio/theme-studio.html @@ -693,17 +693,6 @@ function resolveUiAttr(face,attr,uimap){ return walkInheritChain(face,f=>UI_INHERIT[f],f=>uimap[f]&&uimap[f][attr]); } -// Text color for a swatch-dropdown popup row. A row showing a real palette color -// sits on the popup's own fixed background, so its name/hex text must inherit the -// popup foreground (return '' to use the CSS color). Coloring it for contrast -// against the swatch instead picks near-black text for a mid/dark swatch, which -// is unreadable on the dark popup. Only the "default" row, filled solid with -// SHOWN, uses a contrast color computed against that fill. -function dropdownRowTextColor(hex,shown,textOnFn){ - if(hex)return ''; - return shown?textOnFn(shown):''; -} - // Turn a theme name into a safe filename slug: collapse runs of disallowed // characters to a single dash, trim leading/trailing dashes, fall back to 'theme'. function slugify(name){return name.replace(/[^A-Za-z0-9._-]+/g,'-').replace(/^-+|-+$/g,'')||'theme';} @@ -3064,6 +3053,55 @@ function initApp(){ } initApp(); addEventListener('resize',()=>{syncMockHeight();syncPkgHeight();}); +// Shared gate harness. Each call site keeps its literal location.hash==='#NAMEtest' +// check (run-tests.sh greps it); gate() owns the ok/notes/A setup and the verdict +// postamble. Note format standardized to ' fails=note1,note2'. +function gate(id, body){ + const name=id.toUpperCase(); + let ok=true;const notes=[]; + const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; + body(A); + const verdict=name+' '+(ok?'PASS':'FAIL'); + document.title=verdict; + const d=document.createElement('div');d.id=id; + d.textContent=verdict+(notes.length?' fails='+notes.join(','):''); + document.body.appendChild(d); +} +function withSavedState(keys, body){ + // Snapshot the named studio globals, run BODY, then restore them in a finally + // so opening the studio at a #gate hash doesn't leave its state mutated for + // interactive use. Each key maps to a [get, set, clone] triple over the live + // let-binding. Scope the keys to what the gate actually touches. + // JSON clone (not structuredClone): the studio data objects carry values + // structuredClone throws on, and a JSON round-trip of the data is exactly what + // the gates' own local saves already use. + const jc=x=>JSON.parse(JSON.stringify(x)); + const reg={ + PALETTE:[()=>PALETTE, v=>{PALETTE=v;}, jc], + MAP:[()=>MAP, v=>{MAP=v;}, jc], + SYNTAX:[()=>SYNTAX, v=>{SYNTAX=v;}, jc], + UIMAP:[()=>UIMAP, v=>{UIMAP=v;}, jc], + PKGMAP:[()=>PKGMAP, v=>{PKGMAP=v;}, jc], + LOCKED:[()=>LOCKED, v=>{LOCKED.clear();for(const k of v)LOCKED.add(k);}, s=>new Set(s)], + }; + const snap=keys.map(k=>[k, reg[k][2](reg[k][0]())]); + try{ body(); } + finally{ for(const [k,v] of snap) reg[k][1](v); } +} +// Shared preview-face validator for the #mdtest / #mupreviewtest / #gnustest +// gates: render HTML into a detached div, then assert it exercises at least +// MINCOUNT data-faces, that every data-face is a real face of the package +// (drawn from FACES, the app's face rows), and that each face in REQUIRED is +// present. A is the gate's assertion collector; NAME labels the failure note. +function assertPreviewFaces(A, html, faces, minCount, name, required){ + const box=document.createElement('div');box.innerHTML=html; + const valid=new Set((faces||[]).map(r=>r[0])); + const used=[...box.querySelectorAll('[data-face]')].map(e=>e.dataset.face); + A(used.length>=minCount,'preview exercises many faces ('+used.length+')'); + const bad=used.filter(f=>!valid.has(f)); + A(bad.length===0,'every data-face is a real '+name+' face; bad='+bad.join(',')); + for(const f of required) A(used.includes(f),'preview includes '+f); +} // Phase-1 self-test (open with #selftest): seed -> export -> import -> compare. function pkgSelftest(){ const seeded=seedPkgmap(); @@ -3090,7 +3128,7 @@ if(location.hash==='#selftest')pkgSelftest(); // preserve, across all three tiers. (1) Locking a row disables its controls via // the shared mkLockCell. (2) reset/erase batch actions update editable rows but // leave locked rows (syntax bare-kind, ui:, pkg: keys) untouched. -if(location.hash==='#locktest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#locktest')gate('locktest',A=>withSavedState(['PALETTE','MAP','SYNTAX','UIMAP','PKGMAP','LOCKED'],()=>{ const cssRgb=h=>{const [r,g,b]=hex2rgb(h);return 'rgb('+r+', '+g+', '+b+')';}; LOCKED.clear();buildTable(); {const k=CATS.map(c=>c[0]).filter(k=>k!=='bg'&&k!=='p')[0]; @@ -3160,13 +3198,12 @@ if(location.hash==='#locktest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c if(filter&&faces.length>1){filter.value=faces[0];buildPkgTable();const b=document.getElementById('pkglocktoggle');b.click(); A(faces.every(face=>LOCKED.has('pkg:'+app+':'+face)),'pkg lock-all covers the whole package even when filtered'); filter.value='';buildPkgTable();}} - document.title='LOCKTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='locktest';d.textContent='LOCKTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + })); // Sort gate (open with #sorttest): all three tables now share srtTable/cellVal. // Verifies the syntax table (which used to have its own srt) sorts by color // value and by element name, that a repeat click reverses, and that the UI and // package tables still sort. Guards the unified sort for the later stages. -if(location.hash==='#sorttest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#sorttest')gate('sorttest',A=>{ const ddVals=tb=>[...document.querySelectorAll('#'+tb+' tr:not(.detailrow)')].map(tr=>{const dd=tr.cells[2].querySelector('.cdd');return dd?(dd.dataset.val||''):'';}); const txtVals=tb=>[...document.querySelectorAll('#'+tb+' tr:not(.detailrow)')].map(tr=>tr.cells[1].innerText.trim().toLowerCase()); const asc=a=>a.every((v,i)=>i===0||a[i-1]<=v),desc=a=>a.every((v,i)=>i===0||a[i-1]>=v); @@ -3176,13 +3213,12 @@ if(location.hash==='#sorttest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c srtTable('legbody',1);A(asc(txtVals('legbody')),'legbody-elements-asc'); buildUITable();srtTable('uibody',1);A(asc(txtVals('uibody')),'uibody-face-asc'); buildPkgTable();srtTable('pkgbody',2);A(asc(ddVals('pkgbody')),'pkgbody-fg-asc'); - document.title='SORTTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='sorttest';d.textContent='SORTTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + }); // Live-buffer rendering gate (open with #mocktest): pins the face-faithfulness // fixes so they cannot silently regress — overlay faces keep syntax colors and // honor their styles, the cursor sits on a glyph, line numbers honor weight, the // fringe shows its foreground indicator, and the mode-line carries its box. -if(location.hash==='#mocktest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#mocktest')gate('mocktest',A=>withSavedState(['UIMAP','PKGMAP'],()=>{ const Q=s=>document.querySelector('#mockframe '+s); buildMockFrame(); A(Q('[data-face="highlight"] [data-k]'),'highlight-keeps-token-colors'); @@ -3231,13 +3267,12 @@ if(location.hash==='#mocktest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c A(pkgWeight()&&pkgWeight().dataset.val==='','pkg weight dropdown starts empty when model is unset'); pickEnum(pkgWeight(),'heavy'); A(PKGMAP[app][face].weight==='heavy'&&PKGMAP[app][face].source==='user','pkg weight dropdown writes the model and marks the face edited'); - document.title='MOCKTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='mocktest';d.textContent='MOCKTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + })); // Palette-generator gate (open with #generatortest): previewing is non-mutating, // clicking a generated tile loads the existing selector, adding creates a normal // singleton base column, and appending a preview column commits all span members // under one stable column id. -if(location.hash==='#generatortest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#generatortest')gate('generatortest',A=>{ const before=JSON.stringify(PALETTE); A(document.getElementById('genaccents').value==='5','default accent count is 5'); A(document.getElementById('gensource').value==='palette','default generator source is palette'); @@ -3287,12 +3322,11 @@ if(location.hash==='#generatortest'){let ok=true;const notes=[];const A=(c,n)=>{ GEN_PROPOSAL={summary:{generated:1,rejected:0,minContrast:null},columns:[{name:'medium-aquamarine',members:[{name:'medium-aquamarine',hex:'#66cdaa',offset:0,columnId:'medium-aquamarine'}]}]}; renderGeneratorPreview(); A(document.querySelector('#genpreview .genchip .gn').textContent==='medium aquamarine','generated tile names display spaces instead of hyphens'); - document.title='GENERATORTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='generatortest';d.textContent='GENERATORTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + }); // Auto-dim gate (open with #autodimtest): the bespoke split preview shows the // selected language in both panes -- the left in real syntax colors, the right // collapsed to the single auto-dim-other-buffers face -- and tracks the langsel. -if(location.hash==='#autodimtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#autodimtest')gate('autodimtest',A=>{ const langs=Object.keys(SAMPLES),ls=document.getElementById('langsel'); ls.value=langs[0]; const box=document.createElement('div');box.innerHTML=renderAutodimPreview(); @@ -3306,8 +3340,7 @@ if(location.hash==='#autodimtest'){let ok=true;const notes=[];const A=(c,n)=>{if if(langs.length>1){const t1=box.textContent;ls.value=langs[1]; const box2=document.createElement('div');box2.innerHTML=renderAutodimPreview(); A(box2.textContent!==t1,'preview tracks the language selector');ls.value=langs[0];} - document.title='AUTODIMTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='autodimtest';d.textContent='AUTODIMTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + }); if(location.hash.startsWith('#pick')){openPicker();const m=location.hash.slice(5);if(m){const b=document.querySelector('.pmode button[data-m="'+m+'"]');if(b)b.click();}} if(location.hash==='#cursortest'){document.getElementById('newhexstr').value='#67809c';openPicker();const sc=document.getElementById('svcur'),hc=document.getElementById('huecur');const L=parseFloat(sc.style.left||'0'),T=parseFloat(sc.style.top||'0'),H=parseFloat(hc.style.top||'0');const ok=L>1&&T>1&&H>1;document.title='CURSORTEST '+(ok?'PASS':'FAIL');const d=document.createElement('div');d.id='cursortest';d.textContent='CURSORTEST '+(ok?'PASS':'FAIL')+' left='+sc.style.left+' top='+sc.style.top+' hue='+hc.style.top;document.body.appendChild(d);} if(location.hash.startsWith('#app')){const ap=location.hash.slice(4),s=document.getElementById('appsel');if(s&&ap){s.value=ap;pkgChanged();}} @@ -3358,7 +3391,7 @@ if(location.hash==='#readouttest'){const hex='#67809c';document.getElementById(' // Worst-case readout gate (open with #contrasttest): a covered overlay face shows // the floor over its foreground set and names the limiting foreground, an // out-of-scope face keeps the single-pair readout, and an empty set reads "no fg set". -if(location.hash==='#contrasttest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#contrasttest')gate('contrasttest',A=>{ const saveMAP=Object.assign({},MAP),saveUI=JSON.parse(JSON.stringify(UIMAP)); CATS.forEach(c=>{if(c[0]!=='bg'&&c[0]!=='p')setSyntaxFg(c[0],'');}); setSyntaxFg('p','#f0fef0');setSyntaxFg('kw','#67809c');setSyntaxFg('str','#a3b18a');setSyntaxFg('bg','#000000'); @@ -3423,12 +3456,11 @@ if(location.hash==='#contrasttest'){let ok=true;const notes=[];const A=(c,n)=>{i }else A(false,'syntax table has a p row with a dropdown'); if(pLocked){LOCKED.add('p');buildTable();} for(const k in MAP)delete MAP[k];Object.assign(MAP,saveMAP);syncSyntaxFromCache();for(const f in UIMAP)delete UIMAP[f];Object.assign(UIMAP,saveUI);buildUITable();applyGround(); - document.title='CONTRASTTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='contrasttest';d.textContent='CONTRASTTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + }); // Bevel gate (open with #beveltest): released/pressed boxes derive their // highlight and shadow from the face's effective bg per Emacs's relief // algorithm, and pressed draws the shadow edge first. -if(location.hash==='#beveltest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#beveltest')gate('beveltest',A=>{ const saveUI=JSON.parse(JSON.stringify(UIMAP)),saveP=PALETTE.slice(),savePK=JSON.parse(JSON.stringify(PKGMAP)); UIMAP['mode-line']={fg:'#d8dee9',bg:'#30343c',weight:null,slant:null,underline:null,strike:null,box:{style:'released',width:1,color:null}}; buildUITable(); @@ -3454,14 +3486,13 @@ if(location.hash==='#beveltest'){let ok=true;const notes=[];const A=(c,n)=>{if(! if(pdd){pdd.click();const redRow=[...document.querySelectorAll('.cddpop .cddgc')].find(c=>(c.dataset.name||'').includes('red'));if(redRow)redRow.click();} A(PKGMAP[app][face].box&&PKGMAP[app][face].box.color==='#ff0000','package box color dropdown writes box.color'); PALETTE=saveP;PKGMAP=savePK;for(const f in UIMAP)delete UIMAP[f];Object.assign(UIMAP,saveUI);buildUITable();buildPkgTable(); - document.title='BEVELTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='beveltest';d.textContent='BEVELTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + }); // Gallery gate (open with #gallerytest): the color dropdown opens a 2D grid in // the palette-panel shape. Driven on a throwaway dropdown so no real face state // is mutated. Covers: grid opens, every palette color has a cell, a cell click // fires onPick + updates the trigger, the pick highlights on reopen, the default // chip clears. -if(location.hash==='#gallerytest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#gallerytest')gate('gallerytest',A=>withSavedState(['MAP','SYNTAX'],()=>{ let picked='__none__'; const dd=mkColorDropdown(ddList(''),'',(hex)=>{picked=hex;},{}); document.body.appendChild(dd); @@ -3485,11 +3516,10 @@ if(location.hash==='#gallerytest'){let ok=true;const notes=[];const A=(c,n)=>{if trig.click();const defc=document.querySelector('.cddpop.cddgrid .cddgdef');if(defc)defc.click(); A(picked==='','the default chip clears the assignment: '+JSON.stringify(picked)); dd.remove();closeColorDropdown(); - document.title='GALLERYTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='gallerytest';d.textContent='GALLERYTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + })); // Preview-link gate (open with #previewlinktest): known bespoke-preview face // mappings stay wired to the face that Emacs actually uses. -if(location.hash==='#previewlinktest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#previewlinktest')gate('previewlinktest',A=>{ const box=document.createElement('div'); box.innerHTML=renderOrgPreview(); const headline=[...box.querySelectorAll('[data-face="org-headline-todo"]')].find(e=>e.textContent.includes('Heading three')); @@ -3504,11 +3534,10 @@ if(location.hash==='#previewlinktest'){let ok=true;const notes=[];const A=(c,n)= const bob=[...box.querySelectorAll('[data-face="erc-default-face"]')].some(e=>e.textContent.includes('hi craig')); A(own,'erc own sent message uses erc-input-face'); A(bob,'erc remote message uses erc-default-face'); - document.title='PREVIEWLINKTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='previewlinktest';d.textContent='PREVIEWLINKTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + }); // Safe-lightness gate (open with #safetest): the OKLCH picker shades the unsafe // lightness band for a selected covered face and hides it when no face is selected. -if(location.hash==='#safetest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#safetest')gate('safetest',A=>withSavedState(['MAP','SYNTAX'],()=>{ const saveMAP=Object.assign({},MAP); setSyntaxFg('p','#f0fef0');setSyntaxFg('kw','#67809c');setSyntaxFg('bg','#000000'); document.getElementById('newhexstr').value='#202830';openPicker();setPkModel('oklch'); @@ -3520,11 +3549,10 @@ if(location.hash==='#safetest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c A(band&&band.style.display==='none','safe band hidden when no face is selected'); for(const k in MAP)delete MAP[k];Object.assign(MAP,saveMAP);syncSyntaxFromCache(); setPkModel('hsv');closePicker(); - document.title='SAFETEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='safetest';d.textContent='SAFETEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + })); // Gone-rebind gate (open with #healtest): deleting a named color then recreating // the name re-points face references stranded on the old hex to the new color. -if(location.hash==='#healtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#healtest')gate('healtest',A=>{ const saveP=PALETTE.slice(),saveM=Object.assign({},MAP),saveU=JSON.parse(JSON.stringify(UIMAP)),savePK=JSON.parse(JSON.stringify(PKGMAP)),saveG=Object.assign({},lastGone),saveSel=selectedIdx; PALETTE=[['#0d0b0a','ground'],['#cdced1','fg'],['#67809c','blue']];setSyntaxFg('kw','#67809c');lastGone={};selectedIdx=null;renderPalette();buildTable(); const blue=[...document.querySelectorAll('#pals .pchip')].find(c=>c.querySelector('.nm')&&c.querySelector('.nm').value==='blue'); @@ -3537,12 +3565,11 @@ if(location.hash==='#healtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c A(!('blue' in lastGone),'heal consumed the gone entry'); PALETTE=saveP;for(const k in MAP)delete MAP[k];Object.assign(MAP,saveM);syncSyntaxFromCache();for(const f in UIMAP)delete UIMAP[f];Object.assign(UIMAP,saveU);PKGMAP=savePK;lastGone=saveG;selectedIdx=saveSel; renderPalette();buildTable();buildUITable();if(document.getElementById('pkgbody'))buildPkgTable(); - document.title='HEALTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='healtest';d.textContent='HEALTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + }); // Column-strip gate (open with #columntest): the palette renders as a pinned // ground column plus structural columns, chips keep their controls, and renaming // a color leaves it in the same strip because the column id is stable. -if(location.hash==='#columntest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#columntest')gate('columntest',A=>{ const saveP=PALETTE.slice(),saveM=Object.assign({},MAP),saveG=Object.assign({},lastGone),saveSel=selectedIdx; setSyntaxFg('bg','#0d0b0a');setSyntaxFg('p','#f0fef0'); PALETTE=[['#0d0b0a','ground'],['#f0fef0','fg'],['#c0402a','red'],['#3a6ea5','blue'],['#808080','gray']];selectedIdx=null;renderPalette(); @@ -3625,13 +3652,12 @@ if(location.hash==='#columntest'){let ok=true;const notes=[];const A=(c,n)=>{if( A(lastGone['blue']==='#3a6ea5'&&lastGone['blue+1']==='#92acc2','clear palette records removed names for recovery'); A(selectedIdx===null,'clear palette clears selected color'); PALETTE=saveP;for(const k in MAP)delete MAP[k];Object.assign(MAP,saveM);syncSyntaxFromCache();lastGone=saveG;selectedIdx=saveSel;renderPalette(); - document.title='COLUMNTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='columntest';d.textContent='COLUMNTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + }); // Count-control gate (open with #counttest): the per-column count regenerates the // column — count up adds symmetric steps, count down drops the extremes, a // reference to a surviving step follows the new hex, a reference to a removed step // is left on its old (now-gone) hex. -if(location.hash==='#counttest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#counttest')gate('counttest',A=>{ const saveP=PALETTE.slice(),saveM=Object.assign({},MAP),saveU=JSON.parse(JSON.stringify(UIMAP)),saveSel=selectedIdx; paletteShowFull=true; // this gate asserts span tiles, so render the full palette setSyntaxFg('bg','#204060');setSyntaxFg('p','#f0fef0'); @@ -3677,12 +3703,11 @@ if(location.hash==='#counttest'){let ok=true;const notes=[];const A=(c,n)=>{if(! const lo=_lum(MAP['bg']),hi=_lum(MAP['p']),blue=PALETTE.filter(p=>p[2]==='blue').map(p=>_lum(p[0])); A(blue.length&&blue.every(L=>L>=lo-1e-6&&L<=hi+1e-6),'generated span stays within the bg/fg bounds');} PALETTE=saveP;for(const k in MAP)delete MAP[k];Object.assign(MAP,saveM);syncSyntaxFromCache();for(const f in UIMAP)delete UIMAP[f];Object.assign(UIMAP,saveU);selectedIdx=saveSel;renderPalette(); - document.title='COUNTTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='counttest';d.textContent='COUNTTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + }); // Base-edit + ground-edit gate (open with #baseedittest): editing a column base // recolors the whole column at the same count and references follow; editing a // ground swatch writes the bg/fg assignment. -if(location.hash==='#baseedittest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#baseedittest')gate('baseedittest',A=>{ const saveP=PALETTE.slice(),saveM=Object.assign({},MAP),saveU=JSON.parse(JSON.stringify(UIMAP)),saveSel=selectedIdx; setSyntaxFg('bg','#0d0b0a');setSyntaxFg('p','#f0fef0'); PALETTE=[['#0d0b0a','ground'],['#f0fef0','fg']]; @@ -3713,11 +3738,10 @@ if(location.hash==='#baseedittest'){let ok=true;const notes=[];const A=(c,n)=>{i A(!PALETTE.some(p=>/^fg[+-]\d+$/.test(p[1])),'editing fg does not generate fg span tiles from a same-hex normal column'); A(PALETTE.find(p=>p[1]==='fg')[2]==='ground','editing fg preserves the ground column id'); PALETTE=saveP;for(const k in MAP)delete MAP[k];Object.assign(MAP,saveM);syncSyntaxFromCache();for(const f in UIMAP)delete UIMAP[f];Object.assign(UIMAP,saveU);selectedIdx=saveSel;renderPalette(); - document.title='BASEEDITTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='baseedittest';d.textContent='BASEEDITTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + }); // Round-trip gate (open with #roundtriptest): export stays a flat palette with // stable column ids, and import does not need color-derived column reconstruction. -if(location.hash==='#roundtriptest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#roundtriptest')gate('roundtriptest',A=>{ const stable=o=>Array.isArray(o)?o.map(stable):(o&&typeof o==='object'?Object.fromEntries(Object.keys(o).sort().map(k=>[k,stable(o[k])])):o); const diff=(a,b,p='')=>{if(JSON.stringify(a)===JSON.stringify(b))return '';if(typeof a!==typeof b||!a||!b||typeof a!=='object')return p+': '+JSON.stringify(a)+' != '+JSON.stringify(b); const ks=[...new Set([...Object.keys(a),...Object.keys(b)])].sort();for(const k of ks){const d=diff(a[k],b[k],p?p+'.'+k:k);if(d)return d;}return p;}; @@ -3735,13 +3759,12 @@ if(location.hash==='#roundtriptest'){let ok=true;const notes=[];const A=(c,n)=>{ A(obj.palette.some(e=>e[1]==='renamed-blue'&&e[2]==='blue'),'renamed color keeps its stable column id through export/import'); A(obj.locks&&obj.locks.includes('kw')&&obj.locks.includes('ui:region'),'lock state survives export/import'); PALETTE=saveP;for(const k in MAP)delete MAP[k];Object.assign(MAP,saveM);syncSyntaxFromCache();LOCKED=saveL; - document.title='ROUNDTRIPTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='roundtriptest';d.textContent='ROUNDTRIPTEST '+(ok?'PASS':'FAIL')+(notes.length?' | '+notes.join(' ; '):'');document.body.appendChild(d);} + }); // View-selector gate (open with #viewtest): the assignment panel is driven by a // single #viewsel dropdown -- two editor entries (@code, @ui) then a "package // faces" optgroup of every app, alphabetically by label -- and switching it // shows exactly one of the three view blocks. -if(location.hash==='#viewtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#viewtest')gate('viewtest',A=>{ const sel=document.getElementById('viewsel'); A(!!sel,'viewsel-exists'); if(sel){ @@ -3761,14 +3784,13 @@ if(location.hash==='#viewtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c A(curApp()===firstApp,'curApp-returns-selected-app'); A(!document.querySelector('#pkgbody .sbtn[title="reset to default"]'),'no-per-row-reset-button'); } - document.title='VIEWTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='viewtest';d.textContent='VIEWTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // Non-default-marker gate (open with #ndtest): a per-face setting cell gets the // .nd corner flag only when its value differs from the face's seed default. Cell // order in a pkg row: 0 lock, 1 label, 2 fg, 3 bg, 4 style, 5 box, 6 contrast. // inherit + height live in the row expander, so a non-default height flags the // expander toggle (exp-nd) rather than an inline cell. -if(location.hash==='#ndtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#ndtest')gate('ndtest',A=>withSavedState(['PKGMAP','LOCKED'],()=>{ LOCKED.clear(); const app=curApp(),row=APPS[app].faces[0],face=row[0]; PKGMAP[app][face]=seedFace(row[2]||{});buildPkgTable(); @@ -3783,22 +3805,20 @@ if(location.hash==='#ndtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ A(tr2.cells[4].classList.contains('nd'),'toggled-weight-marks-style-box'); A(!tr2.querySelector('.exptoggle').classList.contains('exp-nd'),'restored-height-unflags-expander'); PKGMAP[app][face]=seedFace(row[2]||{});buildPkgTable(); - document.title='NDTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='ndtest';d.textContent='NDTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + })); // Contrast-cell gate (open with #crtest): the per-face contrast column shows a // bare colored number (no PASS/FAIL word); the WCAG verdict lives in the hover. -if(location.hash==='#crtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#crtest')gate('crtest',A=>{ const app=curApp(),face=APPS[app].faces[0][0];buildPkgTable(); const cell=document.querySelector('#pkgbody tr[data-face="'+face+'"]').cells[6]; const span=cell&&cell.querySelector('span'); A(span&&/^\d+\.\d$/.test(span.textContent.trim()),'contrast cell is a bare number: '+(span&&span.textContent)); A(span&&!/PASS|FAIL/.test(span.textContent),'no PASS/FAIL word in the contrast cell'); A(span&&span.title&&/(passes|fails) WCAG/i.test(span.title),'contrast cell carries a WCAG hover: '+(span&&span.title)); - document.title='CRTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='crtest';d.textContent='CRTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // View-nav gate (open with #navtest): the prev/next arrows flanking the view // dropdown step the selection (clamped, no wrap) and re-render the view. -if(location.hash==='#navtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#navtest')gate('navtest',A=>{ const sel=document.getElementById('viewsel'),prev=document.getElementById('viewprev'),next=document.getElementById('viewnext'); A(!!prev&&!!next,'nav arrows exist'); if(sel&&prev&&next){ @@ -3812,57 +3832,35 @@ if(location.hash==='#navtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c) sel.selectedIndex=2;onViewChange(); A(sel.options[2]&&sel.options[2].value[0]!=='@'&&vis('view-pkg'),'stepping to a package shows the pkg view'); } - document.title='NAVTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='navtest';d.textContent='NAVTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // Markdown-preview gate (open with #mdtest): markdown-mode has a dedicated README // renderer, and every data-face it emits is a real markdown-mode face. -if(location.hash==='#mdtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#mdtest')gate('mdtest',A=>{ A(APPS['markdown-mode']&&APPS['markdown-mode'].preview==='markdown','markdown-mode wired to the markdown preview'); A(!!PACKAGE_PREVIEWS['markdown'],'markdown renderer registered'); if(PACKAGE_PREVIEWS['markdown']&&APPS['markdown-mode']){ - const box=document.createElement('div');box.innerHTML=PACKAGE_PREVIEWS['markdown'](); - const valid=new Set(APPS['markdown-mode'].faces.map(r=>r[0])); - const used=[...box.querySelectorAll('[data-face]')].map(e=>e.dataset.face); - A(used.length>=15,'preview exercises many faces ('+used.length+')'); - const bad=used.filter(f=>!valid.has(f)); - A(bad.length===0,'every data-face is a real markdown face; bad='+bad.join(',')); - for(const f of ['markdown-header-face-1','markdown-bold-face','markdown-inline-code-face','markdown-blockquote-face','markdown-gfm-checkbox-face','markdown-table-face']) - A(used.includes(f),'preview includes '+f); + assertPreviewFaces(A, PACKAGE_PREVIEWS['markdown'](), APPS['markdown-mode'].faces, 15, 'markdown', + ['markdown-header-face-1','markdown-bold-face','markdown-inline-code-face','markdown-blockquote-face','markdown-gfm-checkbox-face','markdown-table-face']); } - document.title='MDTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='mdtest';d.textContent='MDTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // mu4e-preview gate (open with #mupreviewtest): the mu4e preview is a realistic // headers list + message view, and every data-face it emits is a real mu4e face. -if(location.hash==='#mupreviewtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; - const box=document.createElement('div');box.innerHTML=renderMu4ePreview(); - const valid=new Set((APPS['mu4e']&&APPS['mu4e'].faces||[]).map(r=>r[0])); - const used=[...box.querySelectorAll('[data-face]')].map(e=>e.dataset.face); - A(used.length>=20,'preview exercises many faces ('+used.length+')'); - const bad=used.filter(f=>!valid.has(f)); - A(bad.length===0,'every data-face is a real mu4e face; bad='+bad.join(',')); - for(const f of ['mu4e-unread-face','mu4e-flagged-face','mu4e-replied-face','mu4e-draft-face','mu4e-trashed-face','mu4e-header-highlight-face','mu4e-header-marks-face','mu4e-contact-face','mu4e-compose-separator-face']) - A(used.includes(f),'preview includes '+f); - document.title='MUPREVIEWTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='mupreviewtest';d.textContent='MUPREVIEWTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} +if(location.hash==='#mupreviewtest')gate('mupreviewtest',A=>{ + assertPreviewFaces(A, renderMu4ePreview(), APPS['mu4e']&&APPS['mu4e'].faces, 20, 'mu4e', + ['mu4e-unread-face','mu4e-flagged-face','mu4e-replied-face','mu4e-draft-face','mu4e-trashed-face','mu4e-header-highlight-face','mu4e-header-marks-face','mu4e-contact-face','mu4e-compose-separator-face']); + }); // gnus-preview gate (open with #gnustest): gnus is its own view package (it drives // the mu4e article view), and every data-face its preview emits is a real gnus face. -if(location.hash==='#gnustest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#gnustest')gate('gnustest',A=>{ A(!!APPS['gnus'],'gnus is a registered view package'); A(APPS['gnus']&&APPS['gnus'].preview==='gnus','gnus uses the gnus preview renderer'); - const box=document.createElement('div');box.innerHTML=renderGnusPreview(); - const valid=new Set((APPS['gnus']&&APPS['gnus'].faces||[]).map(r=>r[0])); - const used=[...box.querySelectorAll('[data-face]')].map(e=>e.dataset.face); - A(used.length>=20,'preview exercises many faces ('+used.length+')'); - const bad=used.filter(f=>!valid.has(f)); - A(bad.length===0,'every data-face is a real gnus face; bad='+bad.join(',')); - for(const f of ['gnus-header-name','gnus-header-from','gnus-header-subject','gnus-cite-1','gnus-cite-attribution','gnus-signature','gnus-button','gnus-emphasis-highlight-words']) - A(used.includes(f),'preview includes '+f); - document.title='GNUSTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='gnustest';d.textContent='GNUSTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + assertPreviewFaces(A, renderGnusPreview(), APPS['gnus']&&APPS['gnus'].faces, 20, 'gnus', + ['gnus-header-name','gnus-header-from','gnus-header-subject','gnus-cite-1','gnus-cite-attribution','gnus-signature','gnus-button','gnus-emphasis-highlight-words']); + }); // picker-distinct gate (open with #pickertest): the color picker panel must stand // out from the page background. It carries a highlighted gold accent border, and its // background is meaningfully lighter than the body so the two are easy to tell apart. -if(location.hash==='#pickertest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#pickertest')gate('pickertest',A=>{ const pk=document.getElementById('picker');A(!!pk,'picker element exists'); if(pk){const cs=getComputedStyle(pk),body=getComputedStyle(document.body); const bc=(cs.borderTopColor.match(/\d+/g)||[]).slice(0,3).map(Number); @@ -3872,12 +3870,11 @@ if(location.hash==='#pickertest'){let ok=true;const notes=[];const A=(c,n)=>{if( const lift=pkbg.map((c,i)=>c-bdbg[i]); A(lift.every(d=>d>=12),'picker background is clearly lighter than the page (per-channel lift '+lift.join(',')+')'); } - document.title='PICKERTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='pickertest';d.textContent='PICKERTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // Box-cluster gate (open with #boxtest): the box control is a 2x2 cluster of // four radio buttons (none / line / pressed / raised); the color swatch shows // only while a box style is active. -if(location.hash==='#boxtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#boxtest')gate('boxtest',A=>{ LOCKED.clear();const f=UI_FACES[0][0];const saveBox=UIMAP[f].box; UIMAP[f].box=null;buildUITable(); const cell=document.querySelector('#uibody tr[data-face="'+f+'"]').cells[5]; @@ -3893,11 +3890,10 @@ if(location.hash==='#boxtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c) A(UIMAP[f].box===null,'blank-click-clears-box'); A(dd.style.display==='none','color-hidden-again-after-clear'); UIMAP[f].box=saveBox;buildUITable(); - document.title='BOXTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='boxtest';d.textContent='BOXTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // Style-cluster gate (open with #styletest): the style cell holds a weight // selector, a slant selector, and box-like underline and strike controls. -if(location.hash==='#styletest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#styletest')gate('styletest',A=>{ buildUITable();const f=UI_FACES[0][0]; const cell=document.querySelector('#uibody tr[data-face="'+f+'"]').cells[4]; const cluster=cell.querySelector('.stylecluster'); @@ -3917,11 +3913,10 @@ if(location.hash==='#styletest'){let ok=true;const notes=[];const A=(c,n)=>{if(! A(sital&&sital.style.fontStyle==='italic','slant-options-preview-their-own-slant: italic renders italic'); closeColorDropdown(); A(cluster&&cluster.querySelectorAll('.boxctl').length===1,'strike-control-in-row-underline-moved-to-expander'); - document.title='STYLETEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='styletest';d.textContent='STYLETEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // Expander gate (open with #expandtest): the per-row "more" toggle reveals a // detail row with the overflow attribute editor, and its controls write the model. -if(location.hash==='#expandtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#expandtest')gate('expandtest',A=>{ buildUITable(); const row=document.querySelector('#uibody tr[data-face="region"]'); const detail=document.querySelector('#uibody tr.detailrow[data-detail-for="region"]'); @@ -3961,13 +3956,12 @@ if(location.hash==='#expandtest'){let ok=true;const notes=[];const A=(c,n)=>{if( buildPkgTable();const pface=APPS[curApp()].faces[0][0]; const pdetail=document.querySelector('#pkgbody tr.detailrow[data-detail-for="'+pface+'"]'); A(pdetail&&pdetail.querySelector('select.detailsel'),'package-expander-offers-inherit'); - document.title='EXPANDTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='expandtest';d.textContent='EXPANDTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // Height-clamp gate (open with #heighttest): the expander height field coerces a // typed value into [HEIGHT_MIN,HEIGHT_MAX] and writes the clamped number back, so // an out-of-range type/paste can't reach the model. Guards the fact that an // <input type=number> min/max only constrain its steppers, never typed text. -if(location.hash==='#heighttest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#heighttest')gate('heighttest',A=>{ const face=UI_FACES[0][0],save=JSON.parse(JSON.stringify(UIMAP[face])); buildUITable(); const hin=()=>document.querySelector('#uibody tr.detailrow[data-detail-for="'+face+'"] .hstep'); @@ -3982,12 +3976,11 @@ if(location.hash==='#heighttest'){let ok=true;const notes=[];const A=(c,n)=>{if( typeHeight(''); A(UIMAP[face].height===null,'blank-unsets-to-null: '+UIMAP[face].height); UIMAP[face]=save;buildUITable(); - document.title='HEIGHTTEST '+(ok?'PASS':'FAIL'); - const hd=document.createElement('div');hd.id='heighttest';hd.textContent='HEIGHTTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(hd);} + }); // Language-dropdown gate (open with #langtest): the language list is sorted // alphabetically with Elisp pinned as the default selection, and the ‹ › arrows // step the selection (clamped, no wrap). -if(location.hash==='#langtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#langtest')gate('langtest',A=>{ buildLangSel(); const s=document.getElementById('langsel'); const labels=[...s.options].map(o=>o.value); @@ -4000,11 +3993,10 @@ if(location.hash==='#langtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c A(s.selectedIndex===1,'next steps forward one'); s.selectedIndex=s.options.length-1;stepLang(1); A(s.selectedIndex===s.options.length-1,'next clamps at the last language'); - document.title='LANGTEST '+(ok?'PASS':'FAIL'); - const ld=document.createElement('div');ld.id='langtest';ld.textContent='LANGTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(ld);} + }); // View-lock-indicator gate (open with #viewlocktest): the view dropdown prefixes a // lock glyph on a view whose every element is locked, and clears it otherwise. -if(location.hash==='#viewlocktest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#viewlocktest')gate('viewlocktest',A=>withSavedState(['LOCKED'],()=>{ LOCKED.clear();updateViewLockIndicators(); const s=document.getElementById('viewsel'),codeOpt=()=>[...s.options].find(o=>o.value==='@code'); A(codeOpt()&&!codeOpt().textContent.startsWith('🔒'),'unlocked view shows no lock glyph: '+(codeOpt()&&codeOpt().textContent)); @@ -4014,11 +4006,10 @@ if(location.hash==='#viewlocktest'){let ok=true;const notes=[];const A=(c,n)=>{i LOCKED.delete(syntaxLockKeys()[0]);updateViewLockIndicators(); A(codeOpt()&&!codeOpt().textContent.startsWith('🔒'),'unlocking one element clears the glyph'); LOCKED.clear();updateViewLockIndicators(); - document.title='VIEWLOCKTEST '+(ok?'PASS':'FAIL'); - const vd=document.createElement('div');vd.id='viewlocktest';vd.textContent='VIEWLOCKTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(vd);} + })); // Detail-hover gate (open with #detailhovertest): every label in the expander // detail row carries an explanatory hover, the way the table-header labels do. -if(location.hash==='#detailhovertest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#detailhovertest')gate('detailhovertest',A=>{ buildUITable(); const f=UI_FACES[0][0],detail=document.querySelector('#uibody tr.detailrow[data-detail-for="'+f+'"]'); const fields=detail?[...detail.querySelectorAll('.detailfield')]:[]; @@ -4026,12 +4017,11 @@ if(location.hash==='#detailhovertest'){let ok=true;const notes=[];const A=(c,n)= A(fields.every(g=>g.title&&g.title.length>0),'every detail field has a hover: '+fields.map(g=>g.querySelector('span').textContent+(g.title?'+':'-')).join(' ')); const inh=fields.find(g=>g.querySelector('span').textContent==='inherit'); A(inh&&/inherit/i.test(inh.title),'inherit field hover mentions inheritance: '+(inh&&inh.title)); - document.title='DETAILHOVERTEST '+(ok?'PASS':'FAIL'); - const dh=document.createElement('div');dh.id='detailhovertest';dh.textContent='DETAILHOVERTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(dh);} + }); // Expand/collapse-all gate (open with #expandalltest): the header toggle opens or // closes every row's detail at once, the per-row triangles track state (▶ closed, // ▼ open), and the header button's label follows the aggregate. -if(location.hash==='#expandalltest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#expandalltest')gate('expandalltest',A=>{ buildUITable(); const tb=document.getElementById('uibody'),btn=document.getElementById('uiexpandall'); const details=()=>[...tb.querySelectorAll('tr.detailrow')]; @@ -4049,12 +4039,11 @@ if(location.hash==='#expandalltest'){let ok=true;const notes=[];const A=(c,n)=>{ firstTog().click(); A(open()===1,'a single row toggle opens just that row'); A(btn.textContent.indexOf('▼')===0,'button reflects a single open row as ▼ collapse all'); - document.title='EXPANDALLTEST '+(ok?'PASS':'FAIL'); - const ea=document.createElement('div');ea.id='expandalltest';ea.textContent='EXPANDALLTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(ea);} + }); // Expander-persistence gate (open with #expandpersisttest): a package edit rebuilds // the whole table, so an open expander must reopen instead of collapsing under the // user. Editing a value inside the open expander must not close the row. -if(location.hash==='#expandpersisttest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#expandpersisttest')gate('expandpersisttest',A=>withSavedState(['PKGMAP'],()=>{ EXPANDED.clear(); const app=curApp(),face=APPS[app].faces[0][0];buildPkgTable(); const row=()=>document.querySelector('#pkgbody tr[data-face="'+face+'"]'); @@ -4068,20 +4057,18 @@ if(location.hash==='#expandpersisttest'){let ok=true;const notes=[];const A=(c,n row().querySelector('.exptoggle').click();buildPkgTable(); A(detail()&&detail().style.display==='none','a collapsed expander stays collapsed across a rebuild'); EXPANDED.clear();buildPkgTable(); - document.title='EXPANDPERSISTTEST '+(ok?'PASS':'FAIL'); - const ep=document.createElement('div');ep.id='expandpersisttest';ep.textContent='EXPANDPERSISTTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(ep);} + })); // Palette default-state gate (open with #paldefaulttest): the studio opens with // the palette collapsed to base colors so the span tints don't crowd the first // view. initApp() ran at page load, so the live toggle reflects the opening state. -if(location.hash==='#paldefaulttest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#paldefaulttest')gate('paldefaulttest',A=>{ const tg=document.getElementById('paltoggle'); A(!!tg,'palette toggle present after boot'); A(tg&&tg.textContent==='▶','palette opens collapsed to base colors (arrow shows right-pointing ▶)'); - document.title='PALDEFAULTTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='paldefaulttest';d.textContent='PALDEFAULTTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // Palette display-toggle gate (open with #paltoggletest): the arrow control // collapses each column to its base color and expands back to full spans. -if(location.hash==='#paltoggletest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#paltoggletest')gate('paltoggletest',A=>{ const saveP=PALETTE.slice(),saveM=Object.assign({},MAP); paletteShowFull=true; // start expanded so the first click collapses to base-only setSyntaxFg('bg','#101010');setSyntaxFg('p','#f0f0f0'); @@ -4098,12 +4085,11 @@ if(location.hash==='#paltoggletest'){let ok=true;const notes=[];const A=(c,n)=>{ document.getElementById('paltoggle').click(); A(blueChips()===5,'toggling-back-restores-spans'); PALETTE=saveP;for(const k in MAP)delete MAP[k];Object.assign(MAP,saveM);syncSyntaxFromCache();renderPalette(); - document.title='PALTOGGLETEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='paltoggletest';d.textContent='PALTOGGLETEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // Unused-tile gate (open with #unusedtest): a palette color referenced nowhere // in the theme gets the .unused flag; a column with no used members gets // .unused-col; referenced colors stay unflagged. -if(location.hash==='#unusedtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#unusedtest')gate('unusedtest',A=>{ const saveP=PALETTE.slice(),saveM=Object.assign({},MAP),saveSyn=JSON.parse(JSON.stringify(SYNTAX)),saveU=JSON.parse(JSON.stringify(UIMAP)); setSyntaxFg('bg','#101010');setSyntaxFg('p','#f0f0f0'); PALETTE=[['#101010','bg','ground'],['#f0f0f0','fg','ground'],['#67809c','blue','blue'],['#123456','teal','teal']]; @@ -4119,12 +4105,11 @@ if(location.hash==='#unusedtest'){let ok=true;const notes=[];const A=(c,n)=>{if( A(tealStrip&&tealStrip.classList.contains('unused-col'),'all-unused-column-flagged'); A(blueStrip&&!blueStrip.classList.contains('unused-col'),'used-column-not-flagged'); PALETTE=saveP;for(const k in MAP)delete MAP[k];Object.assign(MAP,saveM);for(const k in SYNTAX)delete SYNTAX[k];Object.assign(SYNTAX,saveSyn);for(const f in UIMAP)delete UIMAP[f];Object.assign(UIMAP,saveU);syncSyntaxFromCache();renderPalette(); - document.title='UNUSEDTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='unusedtest';d.textContent='UNUSEDTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // Gone-assignment gate (open with #gonetest): a swatch whose assigned color is // no longer in the palette gets the .gone flag; an assignment to a present color // does not. -if(location.hash==='#gonetest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#gonetest')gate('gonetest',A=>{ const saveP=PALETTE.slice(),saveM=Object.assign({},MAP),saveU=JSON.parse(JSON.stringify(UIMAP)); setSyntaxFg('bg','#101010');setSyntaxFg('p','#f0f0f0'); PALETTE=[['#101010','bg','ground'],['#f0f0f0','fg','ground'],['#67809c','blue','blue']]; @@ -4136,11 +4121,10 @@ if(location.hash==='#gonetest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c A(goneDd&&goneDd.classList.contains('gone'),'assignment-to-missing-color-flagged'); A(okDd&&!okDd.classList.contains('gone'),'assignment-to-present-color-not-flagged'); PALETTE=saveP;for(const k in MAP)delete MAP[k];Object.assign(MAP,saveM);for(const f in UIMAP)delete UIMAP[f];Object.assign(UIMAP,saveU);syncSyntaxFromCache();buildUITable(); - document.title='GONETEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='gonetest';d.textContent='GONETEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // Tile-usage-hover gate (open with #usagetest): a tile's title lists the // "view area > element" pairings that use its color, under the name/hex line. -if(location.hash==='#usagetest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#usagetest')gate('usagetest',A=>{ const saveP=PALETTE.slice(),saveM=Object.assign({},MAP),saveU=JSON.parse(JSON.stringify(UIMAP)); setSyntaxFg('bg','#101010');setSyntaxFg('p','#f0f0f0'); PALETTE=[['#101010','bg','ground'],['#f0f0f0','fg','ground'],['#67809c','blue','blue']]; @@ -4152,12 +4136,11 @@ if(location.hash==='#usagetest'){let ok=true;const notes=[];const A=(c,n)=>{if(! A(blueChip&&blueChip.title.includes('ui faces > '+f0label),'hover-title-lists-ui-face-usage'); A(blueChip&&blueChip.title.split('\n').length>1,'usage-list-on-its-own-line-under-current-info'); PALETTE=saveP;for(const k in MAP)delete MAP[k];Object.assign(MAP,saveM);for(const f in UIMAP)delete UIMAP[f];Object.assign(UIMAP,saveU);syncSyntaxFromCache();renderPalette(); - document.title='USAGETEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='usagetest';d.textContent='USAGETEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // Element-docstring hovers (open with #hovertest): each table's category cell // carries the face's Emacs docstring on top of its prior hover text, and the // existing label-span hints are left intact (added in addition, not replaced). -if(location.hash==='#hovertest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}}; +if(location.hash==='#hovertest')gate('hovertest',A=>{ buildTable();buildUITable();buildPkgTable(); const synCell=document.querySelector('#legbody tr[data-kind="kw"] .cat'); A(synCell&&synCell.title===SYNTAX_DOCS['kw'],'syntax cat cell shows the category face docstring: '+(synCell&&synCell.title)); @@ -4169,8 +4152,7 @@ if(location.hash==='#hovertest'){let ok=true;const notes=[];const A=(c,n)=>{if(! A(docFace,'a package face with a docstring exists to test'); if(docFace){const pkgCell=document.querySelector('#pkgbody tr[data-face="'+docFace+'"] .cat'); A(pkgCell&&pkgCell.title===FACE_DOCS[docFace]+'\n\n'+docFace,'package cat cell shows docstring on top of the face name: '+(pkgCell&&JSON.stringify(pkgCell.title)));} - document.title='HOVERTEST '+(ok?'PASS':'FAIL'); - const d=document.createElement('div');d.id='hovertest';d.textContent='HOVERTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);} + }); // Export via the File System Access API (open with #savetest): exportTheme writes // the theme JSON straight to the picked file handle and closes it, so re-exporting // overwrites in place instead of the browser uniquifying to "name (1).json". |