Front-end fixes

tests/e2e/integration.spec.js

@@ -1150,3 +1150,57 @@ test.describe('Custom patches', () => {
     await expect(page.locator('#step-connect')).not.toBeHidden();
   });
 });
+
+// ============================================================
+// Build output
+// ============================================================
+
+test.describe('Build output', () => {
+  const path = require('path');
+  const distDir = path.join(__dirname, '..', '..', 'web', 'dist');
+
+  test('CSS cache-bust hash is present on style.css link', async () => {
+    const html = fs.readFileSync(path.join(distDir, 'index.html'), 'utf-8');
+    expect(html).toMatch(/css\/style\.css\?h=[0-9a-f]{8}/);
+  });
+
+  test('JS cache-bust hash is present on bundle.js script', async () => {
+    const html = fs.readFileSync(path.join(distDir, 'index.html'), 'utf-8');
+    expect(html).toMatch(/bundle\.js\?h=[0-9a-f]{8}/);
+  });
+
+  test('critical CSS is inlined with :root tokens', async () => {
+    const html = fs.readFileSync(path.join(distDir, 'index.html'), 'utf-8');
+    // :root block should be inside an inline <style> tag, not in a <link>
+    expect(html).toMatch(/<style>[^<]*:root\{[^}]*--primary:/);
+    // var() references should be used (not hardcoded hex colors for themed values)
+    expect(html).toMatch(/<style>[^<]*var\(--primary\)/);
+  });
+
+  test('style.css does not contain a :root block', async () => {
+    const css = fs.readFileSync(path.join(distDir, 'css', 'style.css'), 'utf-8');
+    expect(css).not.toContain(':root');
+  });
+
+  test('--primary-hover differs from --primary', async () => {
+    const critical = fs.readFileSync(
+      path.join(__dirname, '..', '..', 'web', 'src', 'css', 'critical.css'), 'utf-8'
+    );
+    const primary = critical.match(/--primary:\s*([^;]+);/);
+    const hover = critical.match(/--primary-hover:\s*([^;]+);/);
+    expect(primary).not.toBeNull();
+    expect(hover).not.toBeNull();
+    expect(primary[1].trim()).not.toBe(hover[1].trim());
+  });
+
+  test('no jszip script tag in built HTML', async () => {
+    const html = fs.readFileSync(path.join(distDir, 'index.html'), 'utf-8');
+    expect(html).not.toContain('jszip');
+  });
+
+  test('no unreplaced template placeholders in built HTML', async () => {
+    const html = fs.readFileSync(path.join(distDir, 'index.html'), 'utf-8');
+    expect(html).not.toMatch(/\{\{[\w-]+\}\}/);
+    expect(html).not.toContain('@critical-css');
+  });
+});