web: test bot responses and date-dependent query caching

web/tests/smoke/smoke.test.ts

@@ -83,11 +83,54 @@ describe("pages", () => {
   );
 });
 
+// next.config.mjs empties Next's list of "HTML-limited" bots, so crawlers
+// and link-preview bots get the cached pages. That is only right as long as
+// every page has its metadata in <head> without running any script
+describe.each([
+  ["a link-preview bot", "facebookexternalhit/1.1"],
+  ["Bingbot", "Mozilla/5.0 (compatible; bingbot/2.0; +http://www.bing.com/bingbot.htm)"],
+])("%s", (_name, userAgent) => {
+  const get = (path: string) =>
+    fetch(app(path), { headers: { "user-agent": userAgent } });
+
+  const head = (html: string) => html.split("</head>")[0];
+
+  test("gets the cached page", async () => {
+    await getPage("/kontakt");
+    const res = await get("/kontakt");
+    await res.text();
+
+    expect(res.headers.get("x-nextjs-cache")).toBe("HIT");
+    expect(res.headers.get("etag")).toBeTruthy();
+    expect(res.headers.get("cache-control")).toContain("s-maxage=");
+  });
+
+  test.each([
+    ["/", "Chateau Neuf"],
+    ["/kontakt", "Chateau Neuf"],
+    ["/arrangementer", "Chateau Neuf"],
+    [`/aktuelt/${SLUGS.news}`, "Testartikkel"],
+    [`/arrangementer/${SLUGS.event}`, "Testkonsert"],
+    [`/aktuelt/${SLUGS.newsOnDemand}`, "Testartikkel"],
+  ])("finds the title and Open Graph tags of %s in <head>", async (path, title) => {
+    const html = await (await get(path)).text();
+
+    expect(head(html)).toMatch(new RegExp(`<title>[^<]*${title}[^<]*</title>`));
+    expect(head(html)).toContain('property="og:title"');
+    // nothing left to be moved into place by a script
+    expect(html.split("</head>")[1]).not.toContain("<title>");
+  });
+});
+
 describe("event list", () => {
   // The list is rendered per request inside the prerendered page, so that
   // the URL's filters are applied on the server (no layout shift)
+  // the last match: the skeleton in the prerendered shell has the same
+  // buttons, and the real list is streamed in after it
   const activeButton = (html: string) =>
-    /data-active="true"[^>]*><span>Vis (liste|kalender)<\/span>/.exec(html)?.[1];
+    [
+      ...html.matchAll(/data-active="true"[^>]*><span>Vis (liste|kalender)<\/span>/g),
+    ].at(-1)?.[1];
 
   test("is server-rendered in list mode by default", async () => {
     const { html } = await getPage("/arrangementer");