Not able to access bootstrap modal dialog in Selenium Webdriver

Question

I want to Access the content of the model dialog box open, and want to access buttons (Yes,No).

Here is HTML code looks like

<div class="modal-dialog">
<div class="modal-content">
    <div class="modal-header"><div class="bootstrap-dialog-header">
        <div class="bootstrap-dialog-close-button" style="display: none;">
            <button class="close">×</button>
        </div>
        <div class="bootstrap-dialog-title" id="e6adf6aa-dcbf-4fb8-9935-c083762f2812_title">
        Inactivate user
        </div>
    </div>
</div>
<div class="modal-body">
    <div class="bootstrap-dialog-body">
        <div class="bootstrap-dialog-message">
        Are you sure you want Inactivate user?
        </div>
    </div>
</div>
<div class="modal-footer">
    <div class="bootstrap-dialog-footer">
        <div class="bootstrap-dialog-footer-buttons">
            <button class="btn btn-default" id="868d2d8a-67f6-4308-a3c8-0246a5d4618c">Yes</button>
            <button class="btn btn-default" id="23e4d027-ef32-4b58-b8b6-6f95bead2db4">No</button>
        </div>
    </div>
</div>

One more thing is id of the buttons are dynamic.

score 12 · Accepted Answer · answered Oct 09 '15 at 05:47

12

I found the solution for this after so much googling... here is the simple solution for this

//Switch to active element here in our case its model dialogue box.
driver.switchTo().activeElement();

Thread.sleep(3000);

// find the button which contains text "Yes" as we have dynamic id
driver.findElement(By.xpath("//button[contains(text(),'Yes')]")).click();

This code solves my problem.

answered Oct 09 '15 at 05:47

Nikunj

199
2
14

This solved my problem with node-webdriver. driver.switchTo().activeElement().then(() => {}) Thanks!! – Huy Aug 15 '18 at 02:14
I wish this worked for me. But it didn't. When the automation process attempts to click on a download button on the bootstrap modal popup, the modal popup disappears. Any thoughts? See my question here: https://stackoverflow.com/questions/72133835/bootstrap-modal-dialog-disappears-upon-clicking-in-automation-selenium – Stack0verflow May 05 '22 at 21:49

score 1 · Answer 2 · answered Sep 30 '15 at 08:40

1

Instead ID try using xpath like:

By.XPath("//div[@class='bootstrap-dialog-footer-buttons']//button[text()='Yes']")

I hope that helps.

answered Sep 30 '15 at 08:40

Boris Stoyanov

96
12

ljubomir · Answer 3 · 2015-09-30T11:42:38.510

In cases where ID of the element is not predefined, CSS class can be used as valid selector. That, of course, applies if there is only one element with that class in the page. For multiple elements i would suggest that you mark each one of them with different css class, like:

<button class="yes btn btn-default" id="868d2d8a-67f6-4308-a3c8-0246a5d4618c">Yes</button>
<button class="no btn btn-default" id="23e4d027-ef32-4b58-b8b6-6f95bead2db4">No</button>

and then you can use simple CSS selector like

button.btn-default.yes

to reach the desired element using selenium.

Not able to access bootstrap modal dialog in Selenium Webdriver

3 Answers3

Linked