test(trip): specs for trip one-liner, description, banner & home gating

- trips-list.spec.js: one-liner presence/absence, retina srcset, cover
  fallback, alt text (U3).
- trip-header.spec.js: HTD stacking order, expandable description, banner
  fallback, split intact (U4).
- home.spec.js: AE7 — the gated trip-page extras never leak onto the home
  route (asserted mode-independently so it can't race the home-highlights
  suite that toggles travelling in a parallel worker).

Also marks the plan complete.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01RDS6t8wcpbwKvvrxykVQ5K

tests/ui/trip/trip-header.spec.js

@@ -0,0 +1,71 @@
+// @ts-check
+// Tests: U4 — trip-page in-column header extras (R8, R9, R10, R13)
+const { test, expect } = require('@playwright/test');
+
+const TRIP_URL = '/trips/italy-2026-demo';
+
+const topOf = async (locator) => (await locator.boundingBox()).y;
+
+// ── R8/R9: extras render in HTD order, banner sits above the filter bar ────────
+test('U4/R8+R9: one-liner, description and banner stack in order above the filter bar', async ({ page }) => {
+    await page.goto(TRIP_URL);
+    const header = page.locator('.home-trip-header');
+    await expect(header.locator('.home-trip-tagline')).toHaveText(/southern Tuscany by bike/);
+
+    const yTitle  = await topOf(page.locator('.home-trip-name'));
+    const yTag    = await topOf(page.locator('.home-trip-tagline'));
+    const yCounts = await topOf(page.locator('.home-trip-counts'));
+    const yDesc   = await topOf(page.locator('.trip-header-desc'));
+    const yBanner = await topOf(page.locator('.trip-header-banner'));
+    const yFilter = await topOf(page.locator('.trip-filter-bar'));
+
+    expect(yTitle).toBeLessThan(yTag);      // one-liner directly below the title
+    expect(yTag).toBeLessThan(yCounts);
+    expect(yCounts).toBeLessThan(yDesc);    // description below the counts
+    expect(yDesc).toBeLessThan(yBanner);    // banner below the description
+    expect(yBanner).toBeLessThan(yFilter);  // ...and above the filter bar (R9)
+});
+
+// ── R8/R13: description shows a collapsed preview and expands on demand ────────
+test('U4/R13: description is clamped to a preview and expands to full text', async ({ page }) => {
+    await page.goto(TRIP_URL);
+    const desc = page.locator('.trip-header-desc');
+    const body = page.locator('.trip-header-desc-body');
+    const btn  = page.locator('.trip-header-desc-toggle');
+
+    await expect(desc).toHaveAttribute('data-collapsed', 'true');
+    await expect(btn).toBeVisible();
+
+    const collapsedH = (await body.boundingBox()).height;
+    await btn.click();
+
+    await expect(desc).toHaveAttribute('data-collapsed', 'false');
+    await expect(btn).toHaveText('Show less');
+    const expandedH = (await body.boundingBox()).height;
+    expect(expandedH).toBeGreaterThan(collapsedH);
+    await expect(body).toContainText('finally made sense'); // tail of the full description
+});
+
+// ── R9/AE3: banner uses the first journal image (no cover_image set) ───────────
+test('U4/R9/AE3: banner falls back to the first journal entry image', async ({ page }) => {
+    await page.goto(TRIP_URL);
+    const img = page.locator('.trip-header-banner img');
+    await expect(img).toBeVisible();
+    const srcset = await img.getAttribute('srcset');
+    expect(srcset).toContain('720w');
+    expect(srcset).toContain('1440w');
+    await expect(img).toHaveAttribute('alt', 'Tuscany 2026');
+});
+
+// ── R10/AE6: the map+journal split is intact with no header above it ───────────
+test('U4/R10/AE6: map+journal split renders with the extras inside the feed column', async ({ page }) => {
+    await page.goto(TRIP_URL);
+    await expect(page.locator('.home-layout')).toBeVisible();
+    await expect(page.locator('.home-layout > .home-map-col')).toBeVisible();
+    await expect(page.locator('.home-layout > .home-feed-col')).toBeVisible();
+    // extras live inside the feed column, not as a new header above the split
+    await expect(page.locator('.home-feed-col .trip-header-banner')).toHaveCount(1);
+    await expect(page.locator('.home-feed-col .home-trip-tagline')).toHaveCount(1);
+    // the header extras never appear outside the two-column layout
+    await expect(page.locator('body > .trip-header-banner, .home-layout ~ .trip-header-banner')).toHaveCount(0);
+});