test: cover responsive no-script acceptance

tests/browser/no-javascript.spec.ts

@@ -36,10 +36,11 @@ const navigationLabels: Readonly<Record<(typeof sectionIds)[number], string>> =
     contact: "Contact",
   };
 
-const visibleTextLeafSelector = "h1,h2,h3,h4,p,dt,dd,li,figcaption,a,svg text";
+const visibleTextLeafSelector =
+  "h1,h2,h3,h4,p,dt,dd,li,figcaption,caption,th,td,a,svg text";
 const visibleTextSelector = [
-  ".site-header :is(h1,h2,h3,h4,p,dt,dd,li,figcaption,a)",
+  ".site-header :is(h1,h2,h3,h4,p,dt,dd,li,figcaption,caption,th,td,a)",
-  ".portfolio-main :is(h1,h2,h3,h4,p,dt,dd,li,figcaption,a)",
+  ".portfolio-main :is(h1,h2,h3,h4,p,dt,dd,li,figcaption,caption,th,td,a)",
   ".portfolio-main svg text",
 ].join(",");
 
@@ -104,6 +105,30 @@ const expectedVisibleTextSegments = (
     project: PortfolioContent["projects"]["selected"][number],
   ): string[] =>
     project.visibility === "public" && project.url ? [project.title] : [];
+  const projectMediaText = (
+    project: PortfolioContent["projects"]["selected"][number],
+  ): string[] =>
+    (project.media ?? []).flatMap((presentation) => [
+      presentation.caption,
+      presentation.longDescription,
+      ...(presentation.kind === "chart"
+        ? [
+            "Variables",
+            presentation.chart.variables,
+            "Trend",
+            presentation.chart.trend,
+            "Conclusion",
+            presentation.chart.conclusion,
+            ...(presentation.chart.table === undefined
+              ? []
+              : [
+                  presentation.chart.table.caption,
+                  ...presentation.chart.table.columns,
+                  ...presentation.chart.table.rows.flat(),
+                ]),
+          ]
+        : []),
+    ].filter((segment): segment is string => segment !== undefined));
 
   return [
     ...sectionIds.map((id) => navigationLabels[id]),
@@ -152,6 +177,7 @@ const expectedVisibleTextSegments = (
       content.projects.selected.flatMap((project) => [
         project.title,
         project.summary,
+        ...projectMediaText(project),
         "Problem",
         project.problem,
         "Contribution",
@@ -169,6 +195,7 @@ const expectedVisibleTextSegments = (
       content.projects.additional.flatMap((project) => [
         project.title,
         project.summary,
+        ...projectMediaText(project),
         project.contribution,
         project.outcome,
         ...projectLinkText(project),

tests/browser/semantic.spec.ts

@@ -109,9 +109,16 @@ test('exposes the complete semantic portfolio from the generated document', asyn
     const content = hero.querySelector('.hero-journey__content')!;
     const heroStyle = getComputedStyle(hero);
     const contentStyle = getComputedStyle(content);
+    const compact = innerWidth < 768;
+    const expectedPadding = compact
+      ? Math.min(72, Math.max(32, innerHeight * 0.09))
+      : Math.min(128, Math.max(56, innerHeight * 0.12));
+    const expectedWidth = compact
+      ? innerWidth - 32
+      : Math.min(544, innerWidth * 0.39);
     return {
-      preservesPadding: Math.abs(Number.parseFloat(heroStyle.paddingTop) - innerHeight * 0.12) < 0.01,
+      preservesPadding: Math.abs(Number.parseFloat(heroStyle.paddingTop) - expectedPadding) < 0.01,
-      preservesWidth: Math.abs(Number.parseFloat(contentStyle.width) - Math.min(544, innerWidth * 0.39)) < 0.1,
+      preservesWidth: Math.abs(Number.parseFloat(contentStyle.width) - expectedWidth) < 0.1,
       position: contentStyle.position,
       zIndex: contentStyle.zIndex,
     };