Recommand · August 7, 2021 0

Puppeteer clicking link in a span element

Hello I am trying to parse a manga site and save all the pages, I have the code working to run through the page saving the images.

I am having trouble clicking on a link that goes to the next page. Working with Node and using puppeteer. Been stuck on this for a more than I care to admit. Thought I would be able to just use document.querySelectorAll("span.next-prev-text") to get the span in the link.

Included the relevant code for trying to get the next page and html I am trying to click the NEXT CHAPTER link on.

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

Appreciate any help!