harb/tests/e2e/07-landing-pages.spec.ts

import { test, expect } from '@playwright/test';
import { getStackConfig, validateStackHealthy } from '../setup/stack';

const STACK_CONFIG = getStackConfig();
const STACK_BASE_URL = process.env.STACK_BASE_URL ?? 'http://localhost:8081';

test.describe('Landing Pages', () => {
  test.beforeAll(async () => {
    await validateStackHealthy(STACK_CONFIG);
  });

  test('landing homepage loads without errors', async ({ page }) => {
    const errors: string[] = [];
    page.on('console', msg => {
      if (msg.type() === 'error') errors.push(msg.text());
    });

    await page.goto(`${STACK_BASE_URL}/`, { waitUntil: 'domcontentloaded' });
    await page.waitForLoadState('networkidle');

    // Page should contain recognisable KRAIKEN branding
    const body = await page.textContent('body');
    expect(body).toBeTruthy();
    // Landing page always has a call-to-action button
    const cta = page.getByRole('link', { name: /app|stake|launch|get started/i }).first();
    await expect(cta).toBeVisible({ timeout: 15_000 });

    await page.screenshot({ path: 'test-results/landing-homepage.png', fullPage: true });

    const realErrors = errors.filter(
      e => !e.includes('favicon') && !e.includes('DevTools'),
    );
    expect(realErrors).toHaveLength(0);

    console.log('[TEST] ✅ Landing homepage renders correctly');
  });

  test('docs introduction page loads', async ({ page }) => {
    const errors: string[] = [];
    page.on('console', msg => {
      if (msg.type() === 'error') errors.push(msg.text());
    });

    await page.goto(`${STACK_BASE_URL}/docs/introduction`, { waitUntil: 'domcontentloaded' });
    await page.waitForLoadState('networkidle');

    const body = await page.textContent('body');
    expect(body).toBeTruthy();

    // Docs page should have heading or content indicating documentation
    const heading = page.locator('h1, h2').first();
    await expect(heading).toBeVisible({ timeout: 15_000 });

    const realErrors = errors.filter(
      e => !e.includes('favicon') && !e.includes('DevTools'),
    );
    expect(realErrors).toHaveLength(0);

    console.log('[TEST] ✅ Docs introduction page renders correctly');
  });

  test('docs navigation works across pages', async ({ page }) => {
    await page.goto(`${STACK_BASE_URL}/docs/introduction`, { waitUntil: 'domcontentloaded' });
    await page.waitForLoadState('networkidle');

    // Find a docs nav link to another page
    const navLink = page.locator('a[href*="/docs/"]').filter({ hasNotText: /introduction/i }).first();
    if (await navLink.isVisible({ timeout: 5_000 })) {
      const href = await navLink.getAttribute('href');
      console.log(`[TEST] Clicking docs nav link: ${href}`);
      await navLink.click();
      // eslint-disable-next-line no-restricted-syntax -- waitForTimeout: SPA navigation has no reliable event source for Vue Router view mount completion across browsers. See AGENTS.md #Engineering Principles.
      await page.waitForTimeout(2_000);

      // Should navigate without crashing
      const body = await page.textContent('body');
      expect(body).toBeTruthy();
      console.log('[TEST] ✅ Docs navigation works');
    } else {
      console.log('[TEST] ⚠️ No docs nav links found — skipping navigation test');
    }
  });
});