I am scraping a page and this is the data I'm looking for:
<div class="account-balance">
<span class="name">Total balance</span>
<span class="balance">$10</span>
</div>
If I look for the text "total balance," I can find it:
await page.waitForSelector('text=Total balance');
But if I try to find a classname, it times out:
await page.waitForSelector('.account-balance');
I've tried waitForSelector as well as locator, and whenever I target a classname like this, it fails. Thanks for any help.
There may be possibility that there are multiple class with same value. You can try with xpath.
await page.waitForSelector(xpath=//div[@class='account-balance']);
Or
await page.waitForSelector(xpath=//span[text()='Total balance']/..);
You have to go to the class name for the text Total balance and then wait for it.
await page.waitForSelector('.account-balance > .name');
Instead of using a selector engine (like text or css), try using this
span:has-text('Total balance');
Also, check if there are multiple text with Total balance. In that case, you case use the nth matcher to select the text - for e.g. you can use this locator to select the 3rd instance of Total balance
await page.locator(':nth-match(:text("Total balance"), 3)').click();