How to scroll a modal window in Capybara - selenium

I'm testing with Selenium WebDriver, RSpec and Capybara.
I let the program successfully fill in some fields in a modal window. Now I want to click on a button that is at the bottom of this modal window. At the first glance, I cannot see this button, so Capybara needs to scroll down in the modal window.
The two relevant code snippets of the webpage:
<div class = “modal”> </div>
<button class=”btn …..”> TextOnButton ::after </button>
I tried:
within('.modal') do
find('.btn', text: ‘TextOnButton').scrollIntoView(true)
end
but received the error message.
Unable to find visible css ".btn" with text "TextOnButton"
I tried:
within('.modal’) do
page.execute_script 'window.scrollBy(0,100)'
end
but then he scrolls the main window but not the modal window.

Assuming your HTML snippet is incorrect and the button element is actually contained in the modal (as in your text description), then you can try something like
within('.modal') do
btn = find(:button, 'TextOnButton', visible: :all)
execute_script('arguments[0].scrollIntoView(true)', btn)
btn.click
end

This work:
execute_script('arguments[0].scrollIntoView(true)', element)

I understand you are already executing code on the modal, but just wondering have you used driver.switchTo().window(handle) to switch to that modal first?

Related

Clicking button with selenium doesn't throw exception but the button isn't actually clicking?

I am trying to click a button, which once clicked some text should appear. Selenium is not throwing any errors which means the buttons should have been clicked however the text is not appearing (it works manually).
<button class = "redButton one">
<img src = "images/name.png" class = redImage">
"Name"
</button>
I tried to click the button with the xpath: "//button[contains(text(), 'Name')]". I don't understand why the text is not appearing.
What is the expected text to be displayed after button click event? In order to help with this request, provide the HTML snippet of <button> before & after click event. Since this is working fine manually, did you try adding adequate wait time for the text to display?

cypress how to test data-state is visble

Here is the scenario:
I click a button and a popup comes and I want to test when I click on button, the popup should be visible
Sample code:
<button id='bt'>
<div id ='new_div' data-state = visible >
cy.get('#bt').click()
//after clicking this I need to test data-state of "new_div" is visible/not
cy.get('#new_div').should('have.data-state','visible') //something like this
You can do this:
cy.get('[data-state = visible]').should('be.exist')
It will basically check if this tag data-state = visible present or exist inside your DOM at the moment when the popup is visible.
But the best way, of course, is to grab selector from the opened popup!

How to click on the center of the button using selenium java? Which position of the button is actually getting clicked when button is identified?

I have button in our website, and border areas of the button is not clickable. So, i need to make sure the button is getting clicked at the center. Is it possible via selenium?
I tried using coorinates, but it is not recommended for our scenario.
xpath used : //div/button[#id='clickme']
<div class="col-lg-10 col-sm-12 p-0 pt-4">
<button class="click mb-3 " tabindex="0" id="clickme">+ Click Here</button>
</div>
Java code used to click
WebElement button = driver.findElement(By.id("clickme"));
button.click();
I guess the click is happening sometimes[2 out of 10 times] on the border where it is not clickable(hand symbol not shown) . As a result report says the click action happened, but there is no event fired on the website.
To identify the element with text as Click Here you can use either of the following Locator Strategies:
cssSelector:
"button.click#clickme"
xpath:
"//button[contains(#class, 'click') and #id='clickme'][contains(., 'Click Here')]"

selenium testing a tooltip for an inactive button

on whom I am able to click, on clicking , nothing happens, i.e. the action is disabled. However, a tooltip gets displayed. The tooltip appears only when we focus on the button.
The html of the button is as follows:
<button type="button" style="color:#ffffff;" rel="rel-517347" data-toggle="popover" data-animation="true" data-placement="top" data-html="true" data-trigger="hover" data-content="<span class='text-center'>
<div>Ride can only be edited before </div><div>1 hour of pickup time.</div>
</span>" class="btn btn-default disbleBtn width_100" data-original-title="" title="">Edit Ride</button>
where Ride can only be edited before is the tooltip.
How can i verify the text of the tooltip as it keeps getting destroyed.
Note that isEnabled() function returns true here as i can click on the button, but no action takes place.
Is there any way I can verify the class of the button i.e btn btn-default disbleBtn width_100 ?
Is there any function or method for it?
I supposed you need to hover not click on the button. When hover tooltip is showing and than you click immediately and tooltip gone.
Do it manually with chrome devtools, open devtools-> sources tab, hover on the button and press F8 to pause then inspect tooltip element. After you get selector for tooltip try codes below:
new Actions(driver).moveToElement(buttonElement).perform();
String tooltipText = new WebDriverWait(driver, 10)
.until(ExpectedConditions.visibilityOfElementLocated(toolTipLocator).getText();
//Verify
Or try this:
new Actions(driver).moveToElement(buttonElement).perform();
new WebDriverWait(driver, 10)
.until(ExpectedConditions.textToBePresentInElementLocated(toolTipLocator, textToVerify)

Geb : Unable to click on an element

Geb automation : Failing to click on element. Can someone help me to resolve this.
Note : Button is available at left bottom of the page but it is visible.
data-haspromo="" data-element="add" id="qa_button_0" type="button" class="amain btn primary" data-formname="" data-partnumber="12314" data-count="0" data-crossitem="" data-noncompliant="" data-partpreferred="false">Add
Here is my code to click on a button in page. It is failing to identify the element and click on it.
def clickAdd() {
Thread.sleep(3000)
waitFor (60){$("#qa_button_0").displayed}
$('#qa_button_0').click()
Thread.sleep(3000)
}