Add a twitter:card tag (fix #96)

index.html

@@ -13,6 +13,9 @@
     <link rel="shortcut icon" href="/img/icons/favicon.ico">
     <meta property="og:image" content="https://data.firefox.com/img/ogimage.png">
     <meta property="og:type" content="website">
+    <meta name="twitter:card" content="summary_large_image">
+    <!-- data-rh lets react-helmet-async replace this with each page's own og:title. -->
+    <meta property="og:title" content="Firefox Public Data Report" data-rh="true">
     <title>Firefox Public Data Report</title>
   </head>
   <body>

tests/playwright/specs/jsDisabled.spec.js

@@ -20,3 +20,7 @@ test('Correct <noscript> message is displayed when JavaScript is disabled', asyn
     await expect(page.locator('#enable-javascript')).toBeVisible();
     await expect(page.locator('#enable-javascript')).toHaveText('You need to enable JavaScript to run this app.');
 });
+
+test('index.html has an og:title for crawlers that do not run JavaScript', async ({ page }) => {
+    await expect(page.locator('meta[property="og:title"]')).toHaveAttribute('content', 'Firefox Public Data Report');
+});

tests/playwright/specs/og-title.spec.js

@@ -0,0 +1,29 @@
+const { test, expect } = require('../fixtureData');
+
+
+const pages = [
+    ['/', 'Firefox Public Data Report'],
+    ['/contact', 'Contact | Firefox Public Data Report'],
+    ['/dashboard/hardware', 'Hardware Across the Web | Firefox Public Data Report'],
+];
+
+for (const [path, title] of pages) {
+    test(`${path} replaces the static og:title with its own`, async ({ page }) => {
+        await page.goto(path);
+        await expect(page).toHaveTitle(title);
+
+        const ogTitle = page.locator('meta[property="og:title"]');
+        await expect(ogTitle).toHaveCount(1);
+        await expect(ogTitle).toHaveAttribute('content', title);
+    });
+}
+
+test('Navigating between pages keeps a single og:title', async ({ page }) => {
+    await page.goto('/contact');
+    await page.locator('#main-navigation a', { hasText: 'Hardware' }).click();
+    await expect(page).toHaveTitle('Hardware Across the Web | Firefox Public Data Report');
+
+    const ogTitle = page.locator('meta[property="og:title"]');
+    await expect(ogTitle).toHaveCount(1);
+    await expect(ogTitle).toHaveAttribute('content', 'Hardware Across the Web | Firefox Public Data Report');
+});