I’m struggling to find click on an item inside an dynamic loaded accordion.
When the page opens, the first thing i do is click on the accordion button to expand its items. So far so good, i managed to click on it and open the table.

However, i can’t find a way to click on a radio button inside there.
I managed to do it with Selenium, by doing the following:

1. Get into the selector (div > spaui-datatable > table)

2. Inside the selector, get all css selector “tr”

3. Search the tr for the one with an specific item i wanted (numero acordo)
   This is how i did on Selenium:

    var tabelaAcordos = driver.FindElement(By.CssSelector("div > spaui-datatable > table"));
    var linhasTabelaAcordos = tabelaAcordos.FindElements(By.CssSelector("tr"));
    for (int i = 0; i < linhasTabelaAcordos.Count; i++)
    {
    var itensAcordo = HelperMethods.FormataString(linhasTabelaAcordos[i].Text);
    if (itensAcordo[2].Equals(numAcordo))
    {                        
    var acordoTr = new WebDriverWait(driver, TimeSpan.FromSeconds(10))                            .Until(ExpectedConditions.ElementExists(By.XPath("//div[contains(@class, 'spaui-radio-helper-hidden')]//input[@type='radio']")));
   

   acordoTr.SendKeys(Keys.Space);
   }
   }

However i can’t replicate it to puppeteer on nodejs.
I don’t know if its related to the page not being readyloaded or something like that. If i scroll down the page (on the session opened) i can see the items there. But the console.log shows nothing also.

One post i think may have something to do with my question is this one:
Accordions clicked with puppeteer not revealing tables after being clicked

But i couldn’t replicate what was done there =(

This is the accordion i’m trying to click:

Green is the item i’m using as an unique identifier. When i did this with Selenium, i was just getting the line with this number, finding its related radio button and sending an space key (so it would be selected).

This is the HTML code of the part i’m trying to reach. There are others items on this accordion, but already managed to get the one i need.

Any input is really appreciated. Thanks a lot for your attention.

My code:

const puppeteer = require('puppeteer');

(async () => {
    const browser = await puppeteer.launch({ 
        headless: false,
        args: [
            '--window-size=800,600',
            '--disable-gpu',
            '--no-sandbox',
            '--disable-dev-shm-usage',
            '--disable-software-rasterizer'
        ]
    });
    const numAcordo = "235247368";
    const page = await browser.newPage();
    await page.setViewport({ width: 800, height: 600 });

   //Begin navigation. Go to the URL, type login and password, press enter and login
    await page.goto('https://www.santandernegocios.com.br/portaldenegocios/#/externo');
    
    await page.waitForSelector('#userLogin__input'); 
    await page.waitForSelector('#userPassword__input'); 
    await page.type('#userLogin__input', 'EX108593'); 
    await page.type('#userPassword__input', '@BARC02');  
   await page.focus('#userPassword__input');
   await page.keyboard.press('Enter')

   //Waiting until it finishes loading the page
    await page.waitForNavigation();

   
    await page.waitForSelector('input[name="inputSearch"]');
    await page.type('input[name="inputSearch"]', '32877625000122');
    await page.focus('input[name="inputSearch"]');
    await page.keyboard.press('Enter')
    await page.waitForNavigation();
    
   
   
   
 
   //Trying to reach the button
   await page.evaluate(() => {
    document.querySelector('div.avatar-letters').click();

    
});

await page.evaluate(() => {
    
    const sessionMenu = document.querySelector('div.session-menu');

    if (sessionMenu) {
        // Find the <ul> inside this <div>
        const ul = sessionMenu.querySelector('ul');

        if (ul) {
           
            const link = Array.from(ul.querySelectorAll('li a')).find(anchor => anchor.textContent.trim() === 'Acordo Pj' || anchor.textContent.trim() === 'Acordo Pf');

            if (link) {
                
                link.click();
            } else {
                console.error('Acordo pf or pj not found');
            }
        } else {
            console.error('No <ul> found');
        }
    } else {
        console.error('No session-menu div found');
    }
});

await page.waitForNavigation();


await page.evaluate(() => {
    document.querySelector('#accordioAcordosPendentes > div.accordion-tab > div > div > h4 > span.accordion-tab-button').click();

    
});
await page.waitForNavigation();
let accordions = document.querySelectorAll("div.accordion-tab-body")    
    console.log("qtos eu achei");
    console.log("n" + accordions.length)

/*
await page.evaluate(() => {
    console.log("clicking");
    let accordions = document.querySelectorAll("div.accordion-tab-body")    
    console.log("qtos eu achei");
    console.log("n" + accordions.length)
    accordions.forEach(accordion => {
        console.log(accordion)
    })
})
*/

/*
await page.evaluate(() => {
    // Find all spaui-datatable elements
    const datatables = Array.from(document.querySelectorAll('spaui-datatable'));

    // Log if any spaui-datatable elements are found
    if (datatables.length > 0) {
        console.log(`Found ${datatables.length} spaui-datatable elements.`);
        
        datatables.forEach((datatable, index) => {
            // Find the table element inside each spaui-datatable
            const table = datatable.querySelector('table');
            
            if (table) {
                console.log(`Table found in spaui-datatable element ${index + 1}`);
            } else {
                console.error(`No table found in spaui-datatable element ${index + 1}`);
            }
        });
    } else {
        console.error('No spaui-datatable elements found');
    }
});

*/

})();

Again, thanks for your attention.