// 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); });