const { test, expect } = require('@playwright/test');
const { spawn } = require('child_process');
const path = require('path');

const staticServerPath = path.resolve(__dirname, '..', 'server.mjs');

let serverProc;

test.beforeAll(async () => {
  // start static server
  serverProc = spawn(process.execPath, [staticServerPath], { env: { ...process.env, PORT: '5174' }, stdio: 'inherit' });
  // wait a bit for server to start
  await new Promise(resolve => setTimeout(resolve, 400));
});

test.afterAll(async () => {
  if (serverProc) {
    serverProc.kill();
  }
});

test('handshake: sender -> studio via postMessage and ACKs', async ({ page, context }) => {
  const base = 'http://localhost:5174';

  // open sender page
  await page.goto(base + '/sender.html');
  // open popup by clicking
  await page.click('#open');
  // give popup time to open and be ready
  await new Promise(r => setTimeout(r, 300));

  // send token
  await page.click('#send');

  // wait for token ack from studio
  await page.waitForFunction(() => {
    const p = document.querySelector('pre');
    return p && p.textContent && p.textContent.includes('LIVEKIT_TOKEN_ACK');
  }, { timeout: 5000 });

  // wait for connected ack
  await page.waitForFunction(() => {
    const p = document.querySelector('pre');
    return p && p.textContent && p.textContent.includes('LIVEKIT_ACK') && p.textContent.includes('connected');
  }, { timeout: 5000 });

  const log = await page.$eval('pre', el => el.textContent);
  expect(log).toContain('LIVEKIT_TOKEN_ACK');
  expect(log).toContain('LIVEKIT_ACK');
});