Estoy tratando de analizar un sitio de manga y guardar todas las páginas. Tengo el código funcionando para ejecutar la página guardando las imágenes.
Tengo problemas para hacer clic en un enlace que va a la página siguiente. Estoy trabajando con Node y usando Puppeteer. Pensé que podría usar document.querySelectorAll("span.next-prev-text") para obtener el intervalo en el enlace.
Incluí el código relevante para tratar de obtener la página siguiente y el html en el que estoy tratando de hacer clic en el enlace SIGUIENTE CAPÍTULO.
<div class="col-md-6 prev-post"> <a class="" href="https://tokyorevengersmanga.com/manga/tokyo-manji-revengers-vol-1-chapter-1-reborn/"> <span class="next-prev-text">PREVIOUS CHAPTER </span> </a> </div> <div class="col-md-6 next-post"> <a class="" href="https://tokyorevengersmanga.com/manga/tokyo-manji-revengers-chapter-3/"> <span class="next-prev-text">NEXT CHAPTER</span> </a> </div> (async() => { try { const browser = await puppeteer.launch(); const page = await browser.newPage(); //starting page await page.goto( "https://tokyorevengersmanga.com/manga/tokyo-manji-revengers-vol-1-chapter-1-reborn/" ); console.log("page has loaded") const chapter = await page.evaluate(() => { const pages = Array.from( document.querySelectorAll("img.aligncenter") ).map((image) => image.getAttribute("src")); return pages }); fs.writeFileSync("./data.json", JSON.stringify(chapter)); console.log("File is created!"); const nextPage = await page.evaluate(() => { var obj = document.querySelectorAll("span.next-prev-text"); return obj[1]; }) await page.click(nextPage); await page.waitForNavigation(); await browser.close(); } catch (error) { console.log(error); }El page.click() solo toma un selector de cadena. No sé por qué, pero llamar a page.click(".next-prev-text") arroja un error que dice Error: Node is either not visible or not an HTMLElement .
La solución es usar el método page.$$() que realmente invoca document.querySelectorAll() . Devuelve una matriz de ElementHandle para que simplemente pueda invocar el método click() en ElementHandle .
También agregué el código para manejar la página emergente cuando haces clic en el enlace "siguiente capítulo".
Aquí está el código completo para probar.
const puppeteer = require('puppeteer'); const fs = require('fs'); (async () => { try { const browser = await puppeteer.launch({ headless: false }); const page = await browser.newPage(); //starting page await page.goto( "https://tokyorevengersmanga.com/manga/tokyo-manji-revengers-vol-1-chapter-1-reborn/" ); console.log("page has loaded") const chapter = await page.evaluate(() => { const pages = Array.from( document.querySelectorAll("img.aligncenter") ).map((image) => image.getAttribute("src")); return pages }); fs.writeFileSync("./data.json", JSON.stringify(chapter)); console.log("File is created!"); const next = await page.$$(".next-prev-text"); const [popup] = await Promise.all([ new Promise((resolve) => page.once('popup', async p => { await p.waitForNavigation({ waitUntil: 'networkidle0' }); resolve(p); })), next[1].click() ]); // do your job on the next page with 'popup' here await browser.close(); } catch (error) { console.log(error); } })();