AvanzaCast/packages/broadcast-panel/e2e/playwright_connect.mjs

// packages/broadcast-panel/e2e/playwright_connect.mjs
import { chromium } from 'playwright';

const DEFAULT_WS = process.env.PW_WS || 'ws://192.168.1.20:3003';
const BROADCAST_URL = process.env.BROADCAST_URL || 'http://localhost:5175';
const OUTSHOT = process.env.OUTSHOT || '/tmp/playwright_final.png';

function sleep(ms){return new Promise(r=>setTimeout(r,ms));}

async function clickByText(page, text){
  try{
    const locator = page.locator(`text=${text}`);
    const count = await locator.count();
    if(count>0){
      await locator.first().click({timeout:5000});
      return true;
    }
  }catch(e){
    console.error('clickByText error', text, e && e.message);
  }
  return false;
}

(async ()=>{
  console.log('Playwright E2E starting');
  console.log('ENV PW_WS=', process.env.PW_WS, 'PW_WS fallback=', DEFAULT_WS);
  console.log('ENV BROADCAST_URL=', process.env.BROADCAST_URL, 'BROADCAST_URL fallback=', BROADCAST_URL);
  console.log('OUTSHOT=', OUTSHOT);

  console.log('Attempting to connect to Playwright WS endpoint:', DEFAULT_WS);
  let browser;
  try{
    // increase timeout to 30s for unstable networks
    browser = await chromium.connect({ wsEndpoint: DEFAULT_WS, timeout: 30000 });
    console.log('Connected to Playwright server');
  }catch(e){
    console.error('Failed to connect to Playwright server:', e && (e.stack || e.message));
    console.error('Tip: verify that the Playwright server is running and reachable from this host.');
    process.exit(2);
  }

  try{
    console.log('Creating context...');
    const context = await browser.newContext();
    console.log('Creating page...');
    const page = await context.newPage();
    page.on('console', msg => console.log('PAGE LOG:', msg.text()));
    page.on('pageerror', err => console.error('PAGE ERROR:', err && err.toString()));

    console.log('Navigating to', BROADCAST_URL);
    await page.goto(BROADCAST_URL, { waitUntil: 'networkidle', timeout: 60000 });
    console.log('Navigation finished, current URL:', page.url());
    await sleep(1000);

    if(await clickByText(page, 'Entrar al Estudio')){
      console.log('Clicked "Entrar al Estudio"');
      await sleep(1500);
    } else {
      console.log('Entrar al Estudio not found, trying creation flow...');
      // try several create/transmit buttons
      const created = await (async ()=>{
        if(await clickByText(page, 'Crear transmisión')) return true;
        if(await clickByText(page, 'Crear transmisión en vivo')) return true;
        if(await clickByText(page, 'Nueva transmisión')) return true;
        if(await clickByText(page, 'Crear')) return true;
        if(await clickByText(page, 'Transmitir')) return true;
        return false;
      })();

      if(created){
        console.log('Opened creation modal; trying "Omitir por ahora"');
        await sleep(800);
        await clickByText(page, 'Omitir por ahora').catch((e)=>console.error('omit click failed', e && e.message));
        await sleep(300);
        // fill input
        try{
          const input = await page.locator('input').first();
          await input.fill('Transmitir');
          console.log('Filled input with Transmitir');
        }catch(e){
          console.error('Input fill error', e && e.message);
        }
        await clickByText(page, 'Empezar ahora').catch(()=>{});
        await sleep(800);
        await clickByText(page, 'Entrar al Estudio').catch(()=>{});
        await sleep(1500);
      } else {
        console.log('Could not open creation modal — manual check required');
      }
    }

    console.log('Taking screenshot to', OUTSHOT);
    try{
      await page.screenshot({ path: OUTSHOT, fullPage: true });
      console.log('Screenshot saved:', OUTSHOT);
    }catch(e){
      console.error('Screenshot failed:', e && (e.stack || e.message));
    }

    await context.close();
    try{ await browser.close(); }catch(e){ console.error('browser.close error', e && e.message); }
    console.log('E2E finished successfully');
    process.exit(0);
  }catch(err){
    console.error('Error during flow:', err && (err.stack || err.message));
    try{ await browser.close(); }catch(e){ console.error('Error closing browser after failure', e && e.message); }
    process.exit(1);
  }
})();