I'm making a checkout bot and I have gotten the base of it to work, I've been using waitForTimeout in order to let the page elements to load but sometimes that load times varies and it stops my code from working if it takes longer than the 2 seconds it's coded to wait. Is there a way to wait for the button Puppeteer will be clicking on to be available instead of using a timeout? The things i've found don't seem to work but that could be me just doing it wrong. (I'm basically new to coding)
async function initBrowser(){
puppeteerExtra.use(pluginStealth());
//const browser = await puppeteerExtra.launch({ headless: false });
const browser = await puppeteer.launch({headless:false}); //Launches browser
const page = await browser.newPage(); //Opens new page
await page.evaluateOnNewDocument(() => {delete navigator.__proto__.webdriver;});
await page.goto(rand_url); //goes to given link
await page.waitForTimeout(1000); //waits for 2 second
//await page.screenshot({ path: 'Pageloaded.png' }); //Screenshot to prove it is working
await page.$eval("button[class='button spin-button prod-ProductCTA--primary button--primary']", elem => elem.click()); //Clicks Add to cart button
await page.waitForTimeout(2000);
//await page.screenshot({ path: 'Added To Cart.png' }); //Takes screenshot of it being added to cart
await page.$eval("button[class='button ios-primary-btn-touch-fix hide-content-max-m checkoutBtn button--primary']", elem => elem.click()); //Goes to Checkout
await page.waitForTimeout(2000);
//await page.screenshot({path: 'Checkout Screen.png'}); //Takes screenshot of login/checkout screen
await page.evaluate(()=> document.getElementsByClassName('button m-margin-top width-full button--primary')[0].click()); //Chooses check out as guest
//await page.waitForTimeout(6000);
await page.evaluate(()=> document.getElementsByClassName('button cxo-continue-btn button--primary')[0].click()); //continues to shipping info
await page.waitForTimeout(3000);