I wrote a Letterboxd web scraper that's supposed to scrape all reviews on a given page. I confirmed in headed mode that it successfully clicks each "...more" tag to reveal reviews that have been condensed on the page, but when I look at the string representations afterwards, the reveal tag closest to the bottom of the page is always represented in its unexpanded form.

There should not be a "...more" tacked onto the end of this review.

Is there some kind of synchronization error that's occurring with my implementation? I don't know what to do so I can make sure that everything that's on the webpage is extracted properly during string conversion. I've also attached the before and after states of the page elements upon clicking them.

 let revealsRemaining = await firstPage.locator('a.reveal').count();

    while (revealsRemaining > 0) {
        let revealLink = firstPage.locator('a.reveal').first();
        await revealLink.click();
        revealsRemaining--;
    }

    const pageOneReviews = await firstPage.locator('.js-listitem .js-review .body-text').evaluateAll(
        els => els.map(el => { // This will already isolate each individual instance of the locator tag
            const nodeOfReview = el.querySelectorAll("p"); // Unpacks every p tag within each review into a NodeList

            let concatReview = "";

            for (let i = 0; i < nodeOfReview.length; i++) {
                let paragraph = nodeOfReview.item(i).textContent; // Get the text content of each paragraph (every item is a DOM element that can be treated as a standard tag in HTML)

                concatReview += paragraph; // Append onto concatReview
            }

            return concatReview; // Return the entire text content and then push it onto the reviews list
        }
    ));

    await context.close();
    return { pageOneReviews };

State of review-body before expanding.

State of review-body after expanding.