/**
 * Workflow spec: MKT-DEMO-WIRE caption — session 3ce3dee2-2fe6-4658-b175-b0ed3f599673
 *
 * Golden path: the homepage renders the static disclaimer caption
 * "Interactive demo — example workflow" below the ProductDemoAnimation Suspense boundary.
 *
 * This is a pure-render regression spec. There is no interactive path to verify:
 * no form, no navigation, no XHR. The single assertion guards against the caption
 * being accidentally removed or its text changed.
 *
 * Sad-path coverage (encoded as assertions in this spec, per v-workflow-verifier contract):
 *   - console-error listener: zero uncaught JS errors during page load
 *   - request-failed listener: zero 4xx/5xx XHR responses
 *
 * Stack: Laravel 13 + Inertia.js + React 18.
 * Server boots via playwright.config.ts webServer: "npm run build && php artisan serve"
 */

import { expect, test } from '@playwright/test';

test.describe('MKT-DEMO-WIRE: homepage caption below product demo animation', () => {
  test('homepage renders the demo disclaimer caption with correct text', async ({ page }) => {
    const consoleErrors: string[] = [];
    const failedRequests: string[] = [];

    page.on('console', (msg) => {
      if (msg.type() === 'error') {
        consoleErrors.push(msg.text());
      }
    });

    page.on('requestfailed', (request) => {
      failedRequests.push(`${request.method()} ${request.url()} — ${request.failure()?.errorText ?? 'unknown'}`);
    });

    page.on('response', (response) => {
      const url = response.url();
      const status = response.status();
      // Filter XHR/fetch responses (skip navigation, assets, and Vite HMR).
      if (
        status >= 400 &&
        !url.includes('/__vite') &&
        !url.includes('hot-update') &&
        (response.request().resourceType() === 'fetch' ||
          response.request().resourceType() === 'xhr')
      ) {
        failedRequests.push(`${response.request().method()} ${url} — HTTP ${status}`);
      }
    });

    await page.goto('/', { waitUntil: 'networkidle' });

    // Primary assertion: the caption text is present and visible.
    const caption = page.getByText('Interactive demo — example workflow');
    await expect(caption).toBeVisible();

    // Verify it is a <p> element (not accidentally promoted to a heading).
    const tagName = await caption.evaluate((el) => el.tagName.toLowerCase());
    expect(tagName).toBe('p');

    // Sad-path: zero uncaught console errors and zero failed XHR/fetch requests.
    expect(consoleErrors, `Uncaught console errors: ${consoleErrors.join('; ')}`).toHaveLength(0);
    expect(failedRequests, `Failed requests: ${failedRequests.join('; ')}`).toHaveLength(0);
  });
});