当您的页面javascript重新加载元素时，如何应用等待时间

Question

Hi i am using selenium webdriver to automate my script and i have used wait.until condition in my script to click on the delivery bttn in below html page. The problem is selenium is finding my element but since the java script reloads the certain element. And the delivery bttn only becomes clickable after reloading. And my selenium script throws "stale element reference: element is not attached to the page document". What should i do to overcome this error.

WebElement delibttn=wait.until(ExpectedConditions.elementToBeClickable(By.xpath("(//button[@class='btn-to-cart nopricetohide btn btn-primary your-catalog-deliver btn-block btn-unpadded tocart-rounded'])[1]")));
delibttn.click();
WebElement contshopping=wait.until(ExpectedConditions.elementToBeClickable(By.xpath("//a[@class='btn btn-link full-width mb-10']")));

Screenshot:

Answer 1

there are two ways to solve your problem.

1) Run the code with Async, that way you can 'await' a line of code, for example..

 function async(test1){
    await driver.findElement(By.id("");
    driver.click();
    });

or you can also do the following

2)

 function (test1) {
        let element = driver.findElement(By.id(elementId));
        driver.wait(until.elementIsVisible(element), 10000).then(async () =>{
            element.click();
    });

This wait in number 2, is the one that i use in my code and it always works.

A very barbaric way of doing it would be to add a ridiculous wait time to check that it isn't something else showing an error similar to a wait problem

driver.sleep(10000);
or 
thread.sleep(10000);

(the measurement is in milliseconds unless defined otherwise)

Please let me know if these solutions do not solve the problem.

Answer 2

as Jack suggested you could use async, but I always used an infinte while loop

Code i have given below is in python, but you can use the logic in java too

def wait_for_element():
    val = True
    while val:
        web_elem = driver.find_element_by_id('id')
         try:
            web_elem.is_displayed()
         except Exception as ex:
            val = True
         else:
            val = False

i know infinite loop is not a better way than async, but if there are cases where you can't use async you can use this. Also keep in mind to put timeout for loop, otherwise you would looping infinitely when the page was unresponsive or has not loaded.

Answer 3

the reason it is still throwing this issue is because you are not handling your exceptions properly, this is a response to it still throwing stale element errors.

Add something like this to your project, if you look at the bottom of my code you will see that i have added exceptions to catch errors so it does not affect the code the way it is doing.

  driver.findElement(By.id(buttonID)).then(pageElement => {                           
        driver.wait(until.elementIsVisible(pageElement), 10000).then( () => {                                                          
            pageElement.click();
                next();
            })
            .catch(ex => {
                console.log(ex.message, ex.stack)
            });
    }).catch(ex => {console.log(ex.message, ex.stack)});

This is the example of how i am using catches, however many promises you have in your function the more catches you will need, if you hover over an element in Visual Code / Studio you will be able to see if it throws a promise or not.