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

// puppeteer_connect_debug.mjs
// Conecta a un Chrome con --remote-debugging-port=9222 y ejecuta el flujo descrito
// Uso: node --input-type=module packages/broadcast-panel/e2e/puppeteer_connect_debug.mjs

import puppeteer from 'puppeteer-core';

const DEBUG_BROWSER_URL = process.env.DEBUG_BROWSER_URL || 'http://127.0.0.1:9222';
const APP_URL = process.env.BROADCAST_URL || 'http://localhost:5175';

function byTextXPath(text){
  // case-insensitive contains
  return `//*[contains(translate(normalize-space(string(.)), 'ABCDEFGHIJKLMNOPQRSTUVWXYZ', 'abcdefghijklmnopqrstuvwxyz'), '${text.toLowerCase()}')]`;
}

async function clickByText(page, text, timeout = 5000){
  const xpath = byTextXPath(text);
  const els = await page.$x(xpath);
  if(els && els.length){
    await els[0].click();
    return true;
  }
  return false;
}

async function run(){
  console.log('Conectando a browser en', DEBUG_BROWSER_URL);
  const browser = await puppeteer.connect({ browserURL: DEBUG_BROWSER_URL, defaultViewport: null });
  const page = await browser.newPage();
  page.on('console', msg => console.log('PAGE LOG:', msg.text()));

  console.log('Navegando a', APP_URL);
  await page.goto(APP_URL, { waitUntil: 'networkidle2', timeout: 60000 });
  await page.waitForTimeout(1000);

  // Intentar click en "Entrar al Estudio" si visible
  const tryEntrar = await clickByText(page, 'Entrar al Estudio');
  if(tryEntrar){
    console.log('Click en Entrar al Estudio (homepage)');
    await page.waitForTimeout(1500);
  } else {
    console.log('No se encontró Entrar al Estudio directamente, intentando flujo de crear transmisión.');

    // Intentar abrir modal: buscar botones que contengan "Crear" o "Nueva" o "Transmisión"
    const opened = 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(opened) {
      console.log('Modal abierto, esperando...');
      await page.waitForTimeout(1000);
      // Buscar botón "Omitir por ahora"
      if(await clickByText(page, 'Omitir por ahora')){
        console.log('Omitir por ahora clicado');
        await page.waitForTimeout(500);
      }

      // Buscar input y poner 'Transmitir'
      // Intentar seleccionar un input placeholder común
      const inputs = await page.$$('input');
      if(inputs && inputs.length){
        // buscar input visible vacío
        for(const inp of inputs){
          try{
            const val = await (await inp.getProperty('value')).jsonValue();
            const visible = await inp.boundingBox();
            if(visible && (val === '' || val === null)){
              await inp.focus();
              await page.keyboard.type('Transmitir', { delay: 100 });
              console.log('Rellenado input con Transmitir');
              break;
            }
          }catch(e){ /* ignore */ }
        }
      }

      // Click en "Empezar ahora"
      if(await clickByText(page, 'Empezar ahora')){
        console.log('Click Empezar ahora');
        await page.waitForTimeout(1500);
      }

      // Finalmente intentar Entrar al Estudio
      if(await clickByText(page, 'Entrar al Estudio')){
        console.log('Click Entrar al Estudio desde modal');
        await page.waitForTimeout(2000);
      } else {
        console.log('No se pudo encontrar Entrar al Estudio tras modal');
      }
    } else {
      console.log('No pude abrir el modal de creación — inténtalo manualmente o revisa selectores.');
    }
  }

  // Tomar screenshot final para revisión
  const out = '/tmp/puppeteer_final.png';
  await page.screenshot({ path: out, fullPage: true });
  console.log('Screenshot guardado en', out);

  // Mantener la conexión abierta un tiempo para que puedas visualizar en la ventana real
  console.log('Proceso completado. Mantendré la página abierta 30s para inspección interactiva...');
  await page.waitForTimeout(30000);

  try{ await browser.disconnect(); }catch(e){/* ignore */}
  console.log('Desconectado. Script finalizado.');
}

run().catch(err=>{
  console.error('Error en script:', err);
  process.exit(1);
});