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

test.beforeEach(async ({ page }) => {
  await page.addInitScript(() => {
    class FakeWebSocket {
      readyState = 1;
      onopen: ((event: Event) => void) | null = null;
      onmessage: ((event: MessageEvent) => void) | null = null;
      onclose: (() => void) | null = null;
      onerror: (() => void) | null = null;

      constructor() {
        setTimeout(() => this.onopen?.(new Event('open')), 10);
      }

      send() {}
      close() {
        this.onclose?.();
      }
    }

    Object.defineProperty(window, 'WebSocket', {
      configurable: true,
      writable: true,
      value: FakeWebSocket,
    });

    Object.defineProperty(navigator, 'mediaDevices', {
      configurable: true,
      value: {
        getUserMedia: async () => new MediaStream(),
      },
    });

    HTMLMediaElement.prototype.play = async function play() {
      return Promise.resolve();
    };
  });
});

test('assigned mode wizard reaches active session', async ({ page }) => {
  await page.route('**/api/videos/marketing', async (route) => {
    await route.fulfill({
      status: 200,
      contentType: 'application/json',
      body: JSON.stringify({
        count: 2,
        videos: [
          {
            id: 'eden-devprayag',
            title: 'Eden Devprayag - Walkthrough',
            property_name: 'Eden Devprayag',
            unit_number: 'ED-01',
            type: 'Property Walkthrough',
            duration_seconds: 185,
            video_url: '/assets/videos/eden-devprayag.mp4',
            thumbnail_color: '#3b82f6',
          },
          {
            id: 'atri-aqua',
            title: 'Atri Aqua - Walkthrough',
            property_name: 'Atri Aqua',
            unit_number: 'AA-01',
            type: 'Property Walkthrough',
            duration_seconds: 134,
            video_url: '/assets/videos/atri-aqua.mp4',
            thumbnail_color: '#8b5cf6',
          },
        ],
      }),
    });
  });
  await page.goto('/login');
  await page.getByRole('button').first().click();
  await expect(page.getByText('Project Velocity')).toBeVisible({ timeout: 5000 });
  await page.locator('a[href="/sentinel"]').click();
  await expect(page.locator('#sentinel-tab-live-session')).toBeVisible();
  await page.locator('#sentinel-tab-live-session').click();
  await page.getByText('Eden Devprayag - Walkthrough').click();
  await page.getByRole('button', { name: /Continue with Eden Devprayag/i }).click();
  await page.getByText('Assigned Mode').click();
  await page.getByText('Mohammed Al-Rashid').click();
  await page.getByRole('button', { name: /Start Session with Mohammed Al-Rashid/i }).click();
  await expect(page.getByText('Enable Perception Mode')).toBeVisible();
});

test('auto mode wizard reaches active session', async ({ page }) => {
  await page.route('**/api/videos/marketing', async (route) => {
    await route.fulfill({
      status: 200,
      contentType: 'application/json',
      body: JSON.stringify({
        count: 2,
        videos: [
          {
            id: 'eden-devprayag',
            title: 'Eden Devprayag - Walkthrough',
            property_name: 'Eden Devprayag',
            unit_number: 'ED-01',
            type: 'Property Walkthrough',
            duration_seconds: 185,
            video_url: '/assets/videos/eden-devprayag.mp4',
            thumbnail_color: '#3b82f6',
          },
          {
            id: 'atri-aqua',
            title: 'Atri Aqua - Walkthrough',
            property_name: 'Atri Aqua',
            unit_number: 'AA-01',
            type: 'Property Walkthrough',
            duration_seconds: 134,
            video_url: '/assets/videos/atri-aqua.mp4',
            thumbnail_color: '#8b5cf6',
          },
        ],
      }),
    });
  });
  await page.goto('/login');
  await page.getByRole('button').first().click();
  await expect(page.getByText('Project Velocity')).toBeVisible({ timeout: 5000 });
  await page.locator('a[href="/sentinel"]').click();
  await expect(page.locator('#sentinel-tab-live-session')).toBeVisible();
  await page.locator('#sentinel-tab-live-session').click();
  await page.getByText('Atri Aqua - Walkthrough').click();
  await page.getByRole('button', { name: /Continue with Atri Aqua/i }).click();
  await page.getByText('Auto Mode').click();
  await expect(page.getByText(/Auto mode active/i)).toBeVisible();
  await expect(page.getByText('Enable Perception Mode')).toBeVisible();
});