@tryvitris/website-harness 1.0.1 → 1.0.2

package/bin/chunks/{chunk-AUO5I56E.js → chunk-C3F7XQD2.js}

@@ -1,3 +1,10 @@
+import {
+  MINIMUM_TYPE_PX,
+  TYPE_ROLES,
+  TYPE_SELECTORS,
+  resolvedTypography
+} from "./chunk-S2XVNTQP.js";
+
 // src/agent/theme-cloud.json
 var theme_cloud_default = {
   version: 1,
@@ -118726,6 +118733,187 @@ function visualTheme2(id, release = THEME_RELEASE2) {
 }
 var themeHash = (t) => digest(t);
 
+// src/agent/browser-typography.ts
+var TYPOGRAPHY_SCENARIO = "typography-v1-2026-10-28";
+async function captureTypography(page3, theme2, path, width, state) {
+  const roles = resolvedTypography(theme2);
+  const variants = theme2.typography?.variants || {};
+  const result = await page3.evaluate(`(async ({roles,variants,minimum,selectors}) => {
+    const failures=[],observations=[];
+    await Promise.race([document.fonts.ready,new Promise(resolve=>setTimeout(resolve,5000))]);
+    if(document.fonts.status!=='loaded')failures.push('Fonts did not settle before typography measurement');
+    const settling=document.getAnimations().filter(a=>a.playState==='running'&&Number.isFinite(a.effect?.getComputedTiming().endTime));
+    if(settling.length)await Promise.race([Promise.all(settling.map(a=>a.finished.catch(()=>{}))),new Promise(resolve=>setTimeout(resolve,1000))]);
+    const probe=document.createElement('span');
+    probe.setAttribute('aria-hidden','true');
+    probe.style.cssText='all:initial!important;position:fixed!important;left:-10000px!important;visibility:hidden!important';
+    document.body.append(probe);
+    const expected={};
+    const resolve=(key,style)=>{
+      for(const [property,value] of Object.entries({fontSize:style.size,fontWeight:String(style.weight),lineHeight:style.lineHeight,letterSpacing:style.tracking,fontFamily:'var(--font-'+style.font+')'})){
+        const cssProperty=property.replace(/[A-Z]/g,c=>'-'+c.toLowerCase());
+        probe.style.removeProperty(cssProperty);probe.style.setProperty(cssProperty,value,'important');
+        if(!probe.style[property])failures.push('Invalid CSS for typography '+key+'.'+property+': '+value);
+      }
+      const s=getComputedStyle(probe);
+      if(!Number.isFinite(parseFloat(s.fontSize))||parseFloat(s.fontSize)<minimum-.001)failures.push('Typography '+key+' resolves below '+minimum+'px');
+      return {size:parseFloat(s.fontSize),weight:s.fontWeight,lineHeight:s.lineHeight,tracking:s.letterSpacing,family:s.fontFamily};
+    };
+    for(const [role,style] of Object.entries(roles))expected[role]=resolve(role,style);
+    for(const [name,style] of Object.entries(variants))expected['variant:'+name]=resolve(name,{...roles[style.role],...style});
+    const roleFor=e=>{
+      for(let a=e;a;a=a.parentElement){
+        if(a.hasAttribute('data-type-role'))return a.getAttribute('data-type-role');
+        for(const [role,matches] of Object.entries(selectors))if(a.matches(matches.join(',')))return role;
+      }
+      return 'body';
+    };
+    const selector=e=>{
+      const segments=[];for(let a=e;a&&a!==document.body&&segments.length<5;a=a.parentElement){
+        let part=a.tagName.toLowerCase();if(a.id){segments.unshift(part+'#'+CSS.escape(a.id));break;}
+        const index=a.parentElement?[...a.parentElement.children].filter(s=>s.tagName===a.tagName).indexOf(a)+1:1;
+        part+=[...a.classList].slice(0,2).map(c=>'.'+CSS.escape(c)).join('');segments.unshift(part+':nth-of-type('+index+')');
+      }return segments.join(' > ');
+    };
+    const visible=e=>{
+      if(e.closest('script,style,noscript,template')||e===probe)return false;
+      if(!e.checkVisibility({checkOpacity:true,checkVisibilityCSS:true}))return false;
+      const rect=e.getBoundingClientRect(),s=getComputedStyle(e);
+      if(rect.width<=1&&rect.height<=1&&['hidden','clip'].includes(s.overflow))return false;
+      return true;
+    };
+    // Controls, placeholders and options need a sample even without child text nodes.
+    const elements=[...document.querySelectorAll('body *')].filter(e=>visible(e)&&(
+      [...e.childNodes].some(n=>n.nodeType===3&&n.textContent.trim())||e.matches('input:not([type=hidden]),textarea,select')||['before','after'].some(p=>{const c=getComputedStyle(e,'::'+p).content;return c&&c!=='none'&&c!=='normal'&&c!=='""';})
+    ));
+    const seenFonts=new Set();
+    const close=(a,b)=>a===b||(Number.isFinite(parseFloat(a))&&Number.isFinite(parseFloat(b))&&Math.abs(parseFloat(a)-parseFloat(b))<=.1);
+    for(const e of elements){
+      const role=roleFor(e),variantElement=e.closest('[data-type-variant]'),variant=variantElement?.getAttribute('data-type-variant');
+      const spec=variant?variants[variant]:undefined;
+      const key=variant?'variant:'+variant:role,exp=expected[key];
+      const s=getComputedStyle(e),size=parseFloat(s.fontSize),loc=selector(e);
+      let scale=1;
+      if(typeof e.getScreenCTM==='function'){const m=e.getScreenCTM();if(m)scale=Math.min(Math.hypot(m.a,m.b),Math.hypot(m.c,m.d));}
+      for(let a=e;a;a=a.parentElement){
+        const st=getComputedStyle(a);
+        if(typeof e.getScreenCTM!=='function'&&st.transform!=='none'){const m=new DOMMatrix(st.transform);scale*=Math.min(Math.hypot(m.a,m.b),Math.hypot(m.c,m.d));}
+        if(typeof e.getScreenCTM!=='function'&&st.scale!=='none'){const values=st.scale.split(' ').map(Number);scale*=Math.min(Math.abs(values[0]),Math.abs(values[1]??values[0]));}
+        if(typeof e.getScreenCTM!=='function')scale*=parseFloat(st.zoom)||1;
+      }
+      const text=(e.matches('input,textarea,select')?(e.value||e.getAttribute('placeholder')||e.getAttribute('aria-label')||e.tagName):[...e.childNodes].filter(n=>n.nodeType===3).map(n=>n.textContent).join(' ')).trim().replace(/\\s+/g,' ').slice(0,120);
+      const observation={selector:loc,text,role,...(variant?{variant}:{}),size,renderedSize:size*scale,weight:s.fontWeight,lineHeight:s.lineHeight,tracking:s.letterSpacing,family:s.fontFamily};
+      observations.push(observation);
+      if(!exp||spec&&spec.role!==role)failures.push(loc+': unknown or incompatible type role/variant '+key+' (role '+role+')');
+      const checkSize=(fontSize,label)=>{if(fontSize*scale<minimum-.001)failures.push(loc+label+': rendered '+(fontSize*scale).toFixed(2)+'px is below '+minimum+'px: '+text);};
+      checkSize(size,'');
+      for(const pseudo of ['::before','::after',...(e.matches('input,textarea')?['::placeholder']:[])]){
+        const ps=getComputedStyle(e,pseudo);
+        if(pseudo==='::placeholder'?!e.getAttribute('placeholder'):(!ps.content||['none','normal','""'].includes(ps.content)))continue;
+        if(ps.display!=='none'&&ps.visibility!=='hidden'&&Number(ps.opacity)!==0)checkSize(parseFloat(ps.fontSize),pseudo);
+      }
+      if(exp){
+        const emphasis=!!e.closest('strong,b');
+        for(const field of ['size','weight','lineHeight','tracking','family']){
+          if(field==='weight'&&emphasis)continue;
+          if(!close(String(observation[field]),String(exp[field])))failures.push(loc+': '+key+' '+field+' is '+observation[field]+'; expected '+exp[field]+' ('+text+')');
+        }
+      }
+      const fontKey=s.fontFamily+'/'+s.fontWeight;
+      if(!seenFonts.has(fontKey)){
+        seenFonts.add(fontKey);
+        const first=s.fontFamily.split(',')[0].trim().replace(/^['"]|['"]$/g,'').toLowerCase();
+        const faces=[...document.fonts].filter(f=>f.family.replace(/^['"]|['"]$/g,'').toLowerCase()===first);
+        if(faces.length){
+          const weight=Number(s.fontWeight);
+          const match=faces.some(f=>{const range=f.weight==='normal'?[400]:f.weight==='bold'?[700]:f.weight.split(' ').map(Number);return f.status==='loaded'&&weight>=range[0]&&weight<=(range[1]??range[0]);});
+          if(!match)failures.push(loc+': requested font '+first+' weight '+weight+' has no loaded matching face');
+        }
+      }
+    }
+    probe.remove();return {observations,failures:[...new Set(failures)]};
+  })(${JSON.stringify({ roles, variants, minimum: MINIMUM_TYPE_PX, selectors: TYPE_SELECTORS })})`);
+  return { path, width, state, scenario: TYPOGRAPHY_SCENARIO, ...result };
+}
+function typographyConsistencyFailures(captures) {
+  const first = /* @__PURE__ */ new Map();
+  const failures = /* @__PURE__ */ new Set();
+  for (const capture of captures) for (const observation of capture.observations) {
+    if (!TYPE_ROLES.includes(observation.role)) continue;
+    const key = `${capture.width}/${observation.role}/${observation.variant || "default"}`;
+    const prior = first.get(key);
+    if (!prior) {
+      first.set(key, { observation, path: capture.path });
+      continue;
+    }
+    if (Math.abs(prior.observation.size - observation.size) > 0.1 || prior.observation.family !== observation.family) failures.add(`Type role drift ${key}: ${capture.path} ${observation.selector} differs from ${prior.path} ${prior.observation.selector}`);
+  }
+  return [...failures];
+}
+function typographyEvidenceFailures(report, routes) {
+  if (!report || report.scenario !== TYPOGRAPHY_SCENARIO || !Array.isArray(report.captures) || !Array.isArray(report.failures)) return ["Missing current rendered typography evidence"];
+  const errors = [...report.failures];
+  for (const path of routes) for (const width of [375, 1080]) if (!report.captures.some((c) => c.path === path && c.width === width && c.state === "resting" && c.scenario === TYPOGRAPHY_SCENARIO && Array.isArray(c.observations) && c.observations.length)) errors.push(`Missing typography coverage: ${path} ${width}px`);
+  for (const capture of report.captures) {
+    if (!Array.isArray(capture.failures) || !Array.isArray(capture.observations)) {
+      errors.push("Malformed typography capture");
+      continue;
+    }
+    errors.push(...capture.failures.map((f) => `${capture.path} ${capture.width}px ${capture.state}: ${f}`));
+    for (const observation of capture.observations) if (!Number.isFinite(observation.renderedSize) || observation.renderedSize < MINIMUM_TYPE_PX - 1e-3) errors.push(`Undersized typography evidence: ${capture.path} ${observation.selector}`);
+  }
+  errors.push(...typographyConsistencyFailures(report.captures.filter((c) => Array.isArray(c.observations))));
+  return [...new Set(errors)];
+}
+async function captureTypographyStates(page3, theme2, path, width) {
+  const blocked = [];
+  const fence = async (route) => {
+    const request2 = route.request();
+    if (request2.method() !== "GET" || request2.isNavigationRequest()) {
+      if (new URL(request2.url()).pathname !== "/api/t") blocked.push(`Typography disclosure attempted ${request2.method()} ${new URL(request2.url()).pathname}; request blocked`);
+      await route.abort();
+    } else await route.fallback();
+  };
+  await page3.route("**/*", fence);
+  try {
+    const captures = [await captureTypography(page3, theme2, path, width, "resting")];
+    const tabs = await page3.locator('[role="tab"]:visible').all();
+    const selected = [];
+    for (const tab of tabs) if (await tab.getAttribute("aria-selected") === "true") selected.push(tab);
+    for (const [index, tab] of tabs.entries()) if (await tab.isEnabled()) {
+      await tab.click();
+      captures.push(await captureTypography(page3, theme2, path, width, `tab-${index}`));
+    }
+    for (const tab of selected) if (await tab.isVisible()) await tab.click();
+    const closed = [], originallyOpen = [];
+    for (const detail of await page3.locator("details").all()) (await detail.getAttribute("open") === null ? closed : originallyOpen).push(detail);
+    for (const [index, detail] of closed.entries()) {
+      await detail.evaluate((e) => {
+        e.open = true;
+      });
+      captures.push(await captureTypography(page3, theme2, path, width, `detail-${index}`));
+      await detail.evaluate((e) => {
+        e.open = false;
+      });
+    }
+    for (const detail of originallyOpen) await detail.evaluate((e) => {
+      e.open = true;
+    });
+    const toggles = await page3.locator('[data-nav-toggle],button[aria-expanded][aria-controls],button[aria-haspopup="dialog"][aria-controls]').all();
+    for (const [index, toggle] of toggles.entries()) {
+      if (!await toggle.isVisible() || !await toggle.isEnabled() || await toggle.getAttribute("aria-expanded") === "true") continue;
+      await toggle.click();
+      captures.push(await captureTypography(page3, theme2, path, width, `disclosure-${index}`));
+      await page3.keyboard.press("Escape");
+      if (await toggle.isVisible() && await toggle.getAttribute("aria-expanded") === "true") await toggle.click();
+    }
+    captures[0].failures.push(...blocked);
+    return captures;
+  } finally {
+    await page3.unroute("**/*", fence);
+  }
+}
+
 export {
   CLOUD_CATALOG,
   cloudEntry,
@@ -118770,5 +118958,10 @@ export {
   ARCHIVE_THEMES,
   VISUAL_THEMES2,
   visualTheme2,
-  themeHash
+  themeHash,
+  TYPOGRAPHY_SCENARIO,
+  captureTypography,
+  typographyConsistencyFailures,
+  typographyEvidenceFailures,
+  captureTypographyStates
 };

package/bin/chunks/{chunk-UR4NWYVW.js → chunk-CPQQQ5YB.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-2NW7KSPA.js";
 import {
   verifyPreservedSite
-} from "./chunk-65LRZIBP.js";
+} from "./chunk-YYYPSFFZ.js";
 import {
   EXIT_CODES
 } from "./chunk-JCRGE6AL.js";
@@ -13,7 +13,7 @@ import {
 import {
   gradeAll,
   sourceRevision
-} from "./chunk-GQPUILFR.js";
+} from "./chunk-JPQCUN2J.js";
 import {
   parseReleaseRecord
 } from "./chunk-M4LNHYYR.js";
@@ -21,7 +21,7 @@ import {
   buildVerified,
   findHarnessRoot,
   isPreserveSite
-} from "./chunk-H3BS2EBR.js";
+} from "./chunk-QRIYA3GJ.js";
 import {
   json,
   save

package/bin/chunks/{chunk-LKN75JGA.js → chunk-GE6UUEG2.js}

@@ -1,6 +1,10 @@
 import {
   defaultTheme
 } from "./chunk-YYPYYOEV.js";
+import {
+  typographyVariables,
+  typographyVariantCss
+} from "./chunk-S2XVNTQP.js";
 
 // src/theme.ts
 function mergeTheme(partial) {
@@ -12,8 +16,9 @@ function mergeTheme(partial) {
   if (!partial?.radiusLg) merged.radiusLg = partial?.radiusLg || defaultTheme.radiusLg;
   return merged;
 }
-function themeCss(tokens) {
+function themeCss(tokens, typography) {
   const t = mergeTheme(tokens);
+  const sharedType = typography?.version === 1;
   return `:root {
   --color-bg: ${t.colorBg};
   --color-text: ${t.colorText};
@@ -39,12 +44,12 @@ function themeCss(tokens) {
   --space-7: 3rem;
   --space-8: 4.5rem;
   --space-9: 6rem;
-  --step-0: ${t.typeStep0 || "clamp(0.9rem, 0.85rem + 0.2vw, 1rem)"};
-  --step-1: ${t.typeStep1 || "clamp(1rem, 0.95rem + 0.3vw, 1.125rem)"};
-  --step-2: ${t.typeStep2 || "clamp(1.2rem, 1.05rem + 0.6vw, 1.5rem)"};
-  --step-3: ${t.typeStep3 || "clamp(1.6rem, 1.25rem + 1.2vw, 2.25rem)"};
+  --step-0: ${sharedType ? "var(--type-caption-size)" : t.typeStep0 || "clamp(0.9rem, 0.85rem + 0.2vw, 1rem)"};
+  --step-1: ${sharedType ? "var(--type-body-size)" : t.typeStep1 || "clamp(1rem, 0.95rem + 0.3vw, 1.125rem)"};
+  --step-2: ${sharedType ? "var(--type-subheading-size)" : t.typeStep2 || "clamp(1.2rem, 1.05rem + 0.6vw, 1.5rem)"};
+  --step-3: ${sharedType ? "var(--type-section-size)" : t.typeStep3 || "clamp(1.6rem, 1.25rem + 1.2vw, 2.25rem)"};
   --step-4: ${t.typeStep4 || "clamp(2.1rem, 1.5rem + 2.2vw, 3.5rem)"};
-  --step-5: ${t.typeStep5 || "clamp(2.6rem, 1.7rem + 3.4vw, 4.75rem)"};
+  --step-5: ${sharedType ? "var(--type-display-size)" : t.typeStep5 || "clamp(2.6rem, 1.7rem + 3.4vw, 4.75rem)"};
   --tap-min: 44px;
   --header-h: 4.75rem;
   --section-y: ${t.sectionY || "clamp(3.5rem, 3rem + 3vw, 6rem)"};
@@ -53,8 +58,8 @@ function themeCss(tokens) {
   --shadow-2: 0 8px 24px color-mix(in srgb, var(--color-text) 8%, transparent);
   --shadow-3: 0 20px 48px color-mix(in srgb, var(--color-text) 12%, transparent);
   --ring: 0 0 0 3px color-mix(in srgb, var(--color-focus) 35%, transparent);
-}
-`;
+${sharedType ? typographyVariables(t) + "\n" : ""}}
+${sharedType ? typographyVariantCss(t) + "\n" : ""}`;
 }
 
 export {

package/bin/chunks/{chunk-445FZZEC.js → chunk-GM57SNLL.js}

@@ -11,40 +11,40 @@ import {
   runDoctor,
   shareSite,
   synthesizeSite
-} from "./chunk-KIWEFRNG.js";
+} from "./chunk-BMD5GVUT.js";
 import {
   verifySite
-} from "./chunk-UR4NWYVW.js";
+} from "./chunk-CPQQQ5YB.js";
 import {
   upgradeSite
-} from "./chunk-JBSGJR7X.js";
+} from "./chunk-ATPI2YRF.js";
 import {
   createSite
-} from "./chunk-M72KKZIB.js";
+} from "./chunk-Q6FLOYHS.js";
 import {
   explainStage
-} from "./chunk-VKU5TY5C.js";
+} from "./chunk-OQGUEQ6F.js";
 import {
   runSite,
   statusSite,
   workflowArgvFromFlags
-} from "./chunk-RE4GOHSU.js";
+} from "./chunk-GO3XEQBA.js";
 import {
   EXIT_CODES
 } from "./chunk-JCRGE6AL.js";
 import {
   siteInputsFromFlags
-} from "./chunk-GQPUILFR.js";
+} from "./chunk-JPQCUN2J.js";
 import {
   buildVerified,
   findHarnessRoot
-} from "./chunk-H3BS2EBR.js";
+} from "./chunk-QRIYA3GJ.js";
 import {
   approvedOrigin,
   inspectForms,
   safeId,
   validateFormConfig
-} from "./chunk-L44ZTNDM.js";
+} from "./chunk-NMTFSWPK.js";
 import {
   files
 } from "./chunk-T6PE4KN4.js";

package/bin/chunks/{chunk-RE4GOHSU.js → chunk-GO3XEQBA.js}

@@ -1,7 +1,7 @@
 import {
   capturePreservedSite,
   verifyPreservedSite
-} from "./chunk-65LRZIBP.js";
+} from "./chunk-YYYPSFFZ.js";
 import {
   AGENT_RUNTIME_HISTORY_ENTRIES
 } from "./chunk-34H54KEY.js";
@@ -68,7 +68,7 @@ import {
   verifyAllowedWrites,
   withMutationLock,
   writeVisualProbe
-} from "./chunk-GQPUILFR.js";
+} from "./chunk-JPQCUN2J.js";
 import {
   QUESTION_VERSION,
   questionSemanticsHash
@@ -99,7 +99,7 @@ import {
   findHarnessRoot,
   findKernelRoot,
   isPreserveSite
-} from "./chunk-H3BS2EBR.js";
+} from "./chunk-QRIYA3GJ.js";
 import {
   STUDY_CAPTURE_HEIGHT,
   STUDY_CAPTURE_VIEWPORTS,