CODEWITHSUNDEEP
javascriptjavaselenium
eeadev
eeadev

Reputation: 3852

Selenium - cannot click on an element inside a modal

I am using Selenium and java and I cannot click on an element inside a modal. The scenario is this: after clicking on an item inside a frame, it opens up a modal and I need to click on an element inside this modal but I cannot get it.

I already tried with:

js.executeScript("document.getElementById('saveexit').scrollIntoView(true);");

I also tried with switchTo() this way:

while (itr.hasNext()) {
    String popup =  itr.next();
    System.out.println("itr: " + popup);
    driver.switchTo().window(popup);
}

Here is the html of my modal:

<div class="modal-dialog">

    <div class="modal-content modal-custom-content">
        <div class="modal-header">
            ...
        </div>
        <div class="modal-body">
            <form id="formTo" class="form-container">
                <div class="row">
                    ...
                </div>
                <div class="small-space"></div>
                <input ...>
                <div class="row">
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        ...
                    </div>
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        ...
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        ...
                    </div>
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        ...
                    </div>
                </div>
                <div class="small-space"></div>
                <div class="row"> 
                    ...
                </div> 
            </form> 
        </div>
        <div class="small-space"></div>
        <div class="modal-footer">
            <div class="row text-center"> 
                <div class="col-md-6 col-sm-6 col-xs-12">
                    <button class="btn modal-button full-btn" id="saveexit" type="button">SAVE AND EXIT</button>
                </div>
                <div class="col-md-6 col-sm-6 col-xs-12">
                    ...
                </div>
            </div>
        </div>
    </div>
</div>

this is the CSS Path as taken from firefox dev tool: 

html.no-touch body div.remodal-wrapper.remodal-is-opened div.modaliAdesione.remodal.remodal-is-initialized.remodal-is‌​-opened div.modal-dialog div.modal-content.modal-custom-content div.modal-footer div.row.text-center div.col-md-6.col-sm-6.col-xs-12 button#saveexit.btn.modal-button.full-btn

the object is never found.

here is shared a code snippet of the html: https://codeshare.io/arLW9q

Here is the java code:

wait.until(ExpectedConditions.visibilityOfElementLocated(By.xpath("//*[@id=\"saveexit\"]")))

I have also tried with:

cssSelector: #saveexit
cssPath: html.no-touch body div.remodal-wrapper.remodal-is-opened div.modaliAdesione.remodal.remodal-is-initialized.remodal-is-opened 
div.modal-dialog div.modal-content.modal-custom-content div.modal-footer div.row.text-center div.col-md-6.col-sm-6.col-xs-12 
button#saveexit.btn.modal-button.full-btn
xpath: //*[@id="saveexit"]

Please note: if I run document.getElementById('saveexit').click(); from browser's console it works out

Upvotes: 0

Views: 3045

Answers (2)

eeadev
eeadev

Reputation: 3852

I fixed it using jquery inside my script;

here is the linecode:

js.executeScript("$('#saveexit').trigger('click');");

I hope it can help someone in future.

I dont know why plain javascript was not working...

Upvotes: 0

undetected Selenium
undetected Selenium

Reputation: 193368

As you are using the Selenium-Java clients as per best practices the first and foremost trial must be with invoking the highly efficient and proven click() method. Depending on the errors resulting out of click() method we can work on other alternate solutions.

As I can see from your code trials with JavascriptExecutor and switchTo().window(), you havn't identified the WebElement representing the SAVE AND EXIT button well.

To click on the SAVE AND EXIT button you can use the following code block :

new WebDriverWait(driver, 5).until(ExpectedConditions.visibilityOfElementLocated(By.xpath("//div[@class='modal-dialog']//div[@class='modal-footer']//button[@class='btn modal-button full-btn' and @id='saveexit']"))).click();

Upvotes: 1

Related Questions