fix(seo): restore the homepage OpenGraph image

`getOgImageUrl` strips the leading and trailing slashes off the pathname to
build the image filename. For the homepage that pathname is `/`, so stripping
left an empty string and the lookup missed — every docs page had an OpenGraph
image and the homepage shipped `<meta property="og:image">` with no content.

The homepage's collection id is `index`, which is what `getStaticPaths` names
its image, so fall back to that when the slug comes out empty.

Covered by a regression test that fails against the old expression. The
generated-image set comes from the content collection and needs the Astro build
pipeline, so the test stubs it and exercises the derivation, which is the half
that was wrong.

Change-Id: Ifb9a23ea2caa20d28489a4f21363d85ed5e3342c

Author: jd

src/util/getOgImageUrl.test.ts

@@ -0,0 +1,30 @@
+import { describe, expect, it, vi } from 'vitest';
+import { getOgImageUrl } from './getOgImageUrl';
+
+// `getOgImageUrl` looks a derived filename up in the set of images
+// astro-og-canvas actually generated, which comes from the content collection
+// and so needs the Astro build pipeline. Stub that set and test the derivation
+// — the half where the homepage bug was.
+vi.mock('../pages/open-graph/[...path]', () => ({
+  getStaticPaths: async () => [
+    { params: { path: 'index.png' } },
+    { params: { path: 'merge-queue.png' } },
+  ],
+}));
+
+describe('getOgImageUrl', () => {
+  it('resolves the homepage to the index image', () => {
+    // Regression: stripping the slashes off `/` left an empty slug, so the
+    // homepage was the one page that shipped an empty `og:image`.
+    expect(getOgImageUrl('/')).toBe('/open-graph/index.png');
+  });
+
+  it('resolves a normal page, with or without a trailing slash', () => {
+    expect(getOgImageUrl('/merge-queue')).toBe('/open-graph/merge-queue.png');
+    expect(getOgImageUrl('/merge-queue/')).toBe('/open-graph/merge-queue.png');
+  });
+
+  it('returns undefined when no image was generated', () => {
+    expect(getOgImageUrl('/not-a-page')).toBeUndefined();
+  });
+});

src/util/getOgImageUrl.ts

@@ -20,6 +20,10 @@ const paths = new Set(routes.map(({ params }) => params.path));
  * @returns Path to the OpenGraph image if found. Otherwise, `undefined`.
  */
 export function getOgImageUrl(path: string): string | undefined {
-  const imagePath = path.replace(/^\//, '').replace(/\/$/, '') + '.png';
+  // The homepage's collection id is `index`, so stripping its slashes leaves an
+  // empty string and the lookup misses — which is why the homepage shipped with
+  // an empty `og:image` while every other page had one.
+  const slug = path.replace(/^\//, '').replace(/\/$/, '') || 'index';
+  const imagePath = slug + '.png';
   if (paths.has(imagePath)) return '/open-graph/' + imagePath;
 }