Favicon-caching en 404 op ontbrekende statische bestanden

backend/test/app.test.js

@@ -13,6 +13,7 @@ import { join } from "node:path";
 
 const INDEX_MARKER = "<div id=\"root\"></div>";
 const ASSET_BODY   = "console.log('vibefinance');";
+const FAVICON_BODY = "<svg xmlns=\"http://www.w3.org/2000/svg\"></svg>";
 
 let server;
 let basis;
@@ -23,6 +24,7 @@ before(async () => {
   mkdirSync(join(staticDir, "assets"));
   writeFileSync(join(staticDir, "index.html"), `<!DOCTYPE html><html><body>${INDEX_MARKER}</body></html>`);
   writeFileSync(join(staticDir, "assets", "index-abc12345.js"), ASSET_BODY);
+  writeFileSync(join(staticDir, "favicon.svg"), FAVICON_BODY);
 
   process.env.NODE_ENV         = "test";
   process.env.STATIC_DIR       = staticDir;
@@ -93,6 +95,32 @@ describe("Frontend serveren", () => {
     assert.equal(await res.text(), ASSET_BODY);
     assert.match(res.headers.get("cache-control") ?? "", /immutable/);
   });
+
+  it("favicon wordt geserveerd als svg", async () => {
+    const res = await fetch(`${basis}/favicon.svg`);
+    assert.equal(res.status, 200);
+    assert.match(res.headers.get("content-type") ?? "", /image\/svg\+xml/);
+    assert.equal(await res.text(), FAVICON_BODY);
+  });
+
+  // De naam bevat geen hash, dus een jaar "immutable" zou een oude of
+  // verkeerde versie onhoudbaar lang in de browsercache vastzetten.
+  it("favicon wordt niet immutable gecached", async () => {
+    const res = await fetch(`${basis}/favicon.svg`);
+    const cache = res.headers.get("cache-control") ?? "";
+    assert.doesNotMatch(cache, /immutable/);
+    assert.match(cache, /must-revalidate/);
+  });
+
+  // Anders krijgt de browser index.html met status 200 en content-type
+  // text/html waar hij een icoon verwacht, en toont hij stil niets.
+  it("ontbrekend bestand geeft 404 in plaats van index.html", async () => {
+    for (const pad of ["/favicon.ico", "/apple-touch-icon.png"]) {
+      const res = await fetch(`${basis}${pad}`);
+      assert.equal(res.status, 404, pad);
+      assert.doesNotMatch(await res.text(), new RegExp(INDEX_MARKER), pad);
+    }
+  });
 });
 
 describe("Security headers", () => {