g1t/apps/web/app/lib/meta.test.ts
| 1 | import assert from "node:assert/strict"; |
| 2 | import { test } from "node:test"; |
| 3 | |
| 4 | import { OG_RENDER_VERSION } from "@g1t/contracts/og"; |
| 5 | |
| 6 | import { DESCRIPTION, cardUrl, excerpt, fingerprint, page } from "./meta.ts"; |
| 7 | |
| 8 | type Tag = Record<string, string>; |
| 9 | |
| 10 | function tags(list: unknown[]): Map<string, string> { |
| 11 | const found = new Map<string, string>(); |
| 12 | for (const tag of list as Tag[]) { |
| 13 | if ("title" in tag) found.set("title", tag.title); |
| 14 | else found.set(tag.property ?? tag.name, tag.content); |
| 15 | } |
| 16 | return found; |
| 17 | } |
| 18 | |
| 19 | test("a page gets its title, description, Open Graph and Twitter tags", () => { |
| 20 | const meta = tags(page({ location: { pathname: "/pricing" }, matches: [] }, { title: "Pricing · g1t", description: "What it costs." })); |
| 21 | assert.equal(meta.get("title"), "Pricing · g1t"); |
| 22 | assert.equal(meta.get("description"), "What it costs."); |
| 23 | assert.equal(meta.get("og:title"), "Pricing"); |
| 24 | assert.equal(meta.get("og:url"), "https://g1t.sh/pricing"); |
| 25 | assert.equal(meta.get("og:site_name"), "g1t"); |
| 26 | assert.equal(meta.get("og:image"), `https://og.g1t.sh/image?path=%2Fpricing&v=${OG_RENDER_VERSION}`); |
| 27 | assert.equal(meta.get("twitter:card"), "summary_large_image"); |
| 28 | assert.equal(meta.get("twitter:image"), meta.get("og:image")); |
| 29 | }); |
| 30 | |
| 31 | test("pages under a project describe the project, and their card follows its details", () => { |
| 32 | const project = { |
| 33 | id: "routes/repo/layout", |
| 34 | loaderData: { repo: { description: "Repo words" }, project: { name: "Web", description: "The storefront" }, open: { issues: 2, pulls: 1 } }, |
| 35 | }; |
| 36 | const meta = tags(page({ location: { pathname: "/acme/web/commits/" }, matches: [project] }, { title: "Commits · acme/web · g1t" })); |
| 37 | assert.equal(meta.get("description"), "The storefront"); |
| 38 | assert.equal(meta.get("og:url"), "https://g1t.sh/acme/web/commits"); |
| 39 | assert.match(meta.get("og:image") ?? "", new RegExp(`\\?path=%2Facme%2Fweb%2Fcommits&v=${OG_RENDER_VERSION}\\.[0-9a-z]+$`)); |
| 40 | }); |
| 41 | |
| 42 | test("with nothing particular to say, a page says what g1t is", () => { |
| 43 | const meta = tags(page({ location: { pathname: "/login" }, matches: [] }, { title: "Sign in · g1t" })); |
| 44 | assert.equal(meta.get("description"), DESCRIPTION); |
| 45 | }); |
| 46 | |
| 47 | test("a card's version changes with what it shows", () => { |
| 48 | assert.equal(fingerprint(["a", "open"]), fingerprint(["a", "open"])); |
| 49 | assert.notEqual(fingerprint(["a", "open"]), fingerprint(["a", "merged"])); |
| 50 | assert.equal(cardUrl("/", undefined), `https://og.g1t.sh/image?path=%2F&v=${OG_RENDER_VERSION}`); |
| 51 | }); |
| 52 | |
| 53 | test("every card address carries the render version, so a new design is a new address", () => { |
| 54 | assert.match(cardUrl("/"), new RegExp(`[?&]v=${OG_RENDER_VERSION}$`)); |
| 55 | assert.match(cardUrl("/acme", ["Acme"]), new RegExp(`[?&]v=${OG_RENDER_VERSION}\\.[0-9a-z]+$`)); |
| 56 | }); |
| 57 | |
| 58 | test("an excerpt is plain text from the start of the Markdown", () => { |
| 59 | assert.equal(excerpt("## Why\n\nThe [queue](https://x) is **slow**.\n\n```ts\ncode()\n```"), "Why The queue is slow."); |
| 60 | assert.equal(excerpt("x".repeat(300), 10).length, 10); |
| 61 | assert.equal(excerpt(null), ""); |
| 62 | }); |