We Keep Coding

WebDriver Drag-and-Drop does not work on the page

I have a very simple test
#Test
void dragAndDrop()
{
driver.get("https://www.testandquiz.com/selenium/testing.html");
driver.manage().window().maximize();
WebElement source = driver.findElement(By.id("sourceImage"));
WebElement target = driver.findElement(By.id("targetDiv"));
builder.dragAndDrop(source, target).perform();
}
The test passes without any exceptions. However, it does not perform drag-and-drop.
I tried on Chrome, Firefox, and Edge.
Appreciate any help.

There are issues with Drag and Drop in Selenium interacting with HTML5, I've tried using the following Actions class methods on HTML5 pages but they never seem to work
dragAndDrop() | clickAndHold() | moveToElement() | release()
On the other hand you can use a JS script
String filePath = "C:\\Users\\Wilfred\\Desktop\\drag_and_drop_helper.js";
StringBuffer buffer = new StringBuffer();
String line;
BufferedReader br = new BufferedReader(new FileReader(filePath));
while ((line = br.readLine()) != null)
buffer.append(line);
String javaScript = buffer.toString();
javaScript = javaScript + "$('#sourceImage').simulateDragDrop({ dropTarget: '#targetDiv'});";
((JavascriptExecutor) driver).executeScript(javaScript);
The same method doesn't work on this link and we had to resort to robot class which I wouldn't suggest. You can find more information here

The HTML of the WebElement which you want to dragAndDrop() contains the attribute draggable=true
draggable
draggable is a attribute that indicates whether an element can be dragged, either with native browser behavior or the HTML Drag and Drop API. draggable can have the following values:
true: the element can be dragged.
false: the element cannot be dragged.
If this attribute is not set, its default value is auto which means drag behavior is the default browser behavior: only text selections, images, and links can be dragged. For other elements, the event ondragstart must be set for drag and drop to work.
Native HTML5 Drag and Drop
Eric Bidelman in the article Native HTML5 Drag and Drop mentioned, making an object draggable is simple as you only need to set the draggable=true attribute on the element you want to make moveable. As an example:
<div id="cols">
<div class="col" draggable="true"><header>X</header></div>
<div class="col" draggable="true"><header>Y</header></div>
<div class="col" draggable="true"><header>Z</header></div>
</div>
To enable other types of content to be draggable you can leverage the HTML5 DnD APIs. However, using CSS3 you can spruce up the markup to look like columns and adding cursor gives users a visual indicator that something is moveable but most browsers will create a ghost image of the content being dragged and draggable won't do anything. Some browser, FF in particular will require that some data be sent in the drag operation.
Further, Remy Sharp in the article Dragging Anything mentioned:
The HTML 5 spec says it should be as simple as adding the following attributes to the markup of the elements in question:
draggable="true"
However, this doesn’t work completely for Safari or Firefox. For Safari you need to add the following style to the element:
[draggable=true] {
-khtml-user-drag: element;
}
This will start working in Safari, and as you drag it will set a default, empty value with the dataTransfer object. However, Firefox won’t allow you to drag the element unless you manually set some data to go with it.

What's the best scroll up/down method based on a particular locator in Android emulator?

I have tried all of the ones available on Internet but none is working.
Using Appium 1.15 and Java-Client 7.0.0.
Problem is that,
If,
driver.findElementByAndroidUIAutomator("new UiScrollable( new UiSelector().scrollable(true).instance(0)).scrollIntoView"+"(new UiSelector().text(\"" + text + "\").instance(0))");
is used, then it keeps scrolling till the end of the page and then fails. For me, "text" is not just a button or text box. It can be a simple non-functional text on the page below which a dropdown will be present.
In the other approach:
TouchAction action = new TouchAction((PerformsTouchActions) driver);
WebElement phone = driver.findElement(start);
WebElement contact = driver.findElement(end);
action.press((PointOption) phone)
.waitAction()
.moveTo((PointOption) contact)
.release()
.perform();
It fails while finding the element itself. Meaning, it does not proceed from the line: driver.findElemet(start) because this element is located at the bottom of the screen where I exactly need to scroll to.
Please help!

If the elements locators are correct and you confirm it, Try to use driver.flick() command. It do the same without wait. "Wait time" (that you define it with "Duration" arguman in any scroll class functions) has many prbolem with different device screen size.
For example: You have 3 element is a page: A , B , C
you try to scroll from A to B in a 5" screen size. The same code maybe scroll from A to C in 7" screen size!
So driver.flick() solve this.

Unable to locate and click checkbox ::before using Selenium Webdriver

I'm trying to click a checkbox but it's keep clicking the link 'terms and conditions'. Although my xpath (mentioned below) work on a minimized window but it's failing to click the checkbox when the window is maximized because the href (image) appears in the second line next to checkbox. Looking for some suggestions on clicking the checkbox widget on maximized window. I need to get a focus on it.
Interestingly, when i hover over the ::before (css selector) only than the widget gets highlighted.
<div class="checkbox u-mar-bot-5">
<div class="checkbox__container">
<input class="checkbox__input" type="checkbox" id="basket-contact-terms" required data-parsley-multiple="basket-contact-terms" style>
<label class="checkbox__label checkbox__label--has-link checkbox__label--small" for="basket-contact-terms" style>
::before
"I have read and agree to " <a class="text-link text-link--base text-link- small" href="/terms-conditions" target="_blank">Terms and Conditions</a>
</label>
</div>
</div>
image: Terms and Conditions
I tried a few options that keep failing to check the box and instead the link 'terms and conditions' gets the click. I must be missing something basic.
driver.findElement(By.xpath("//label[#for='basket-contact-terms']")).click();
driver.findElement(By.xpath("//label[contains(#class,'checkbox__label checkbox__label--has-link checkbox__label--small')]")).click();
I did looked around and found someone suggested to use this (below) so i tried but didn't work:
WebElement elem = driver.findElement(By.xpath("//div[contains(#class,'checkbox u-mar-bot-5')]"));
Actions action = new Actions(driver);
action.moveToElement(elem).click().build().perform();
Any suggestion would be appreciated.

Since you tried the ID of the INPUT and it threw an error that it wasn't visible, I would first try a wait to see if it will become visible. (I'm assuming it won't but it's worth a try first).
new WebDriverWait(driver, 10).until(ExpectedConditions.elementToBeClickable(By.id("basket-contact-terms"))).click();
If that doesn't work, I would next try to click a different position on the element. By default, Selenium clicks on the center of the element. In your case, I think this is what's causing the issue. You can use Actions to click the upper left (1,1) of the element.
WebElement label = driver.findElement(By.xpath("//label[#for='basket-contact-terms']"));
new Actions(driver).moveToElement(label, 1, 1).click().perform();

You can try with
WebElement elem = driver.findElement(By.id("basket-contact-terms"))

How to find relative x path of unique code?

3 matching nodes.. all have same source code ..hence it is failing //img[(#src='/PHYLINSPortlet/images/override-0.gif')]
<img id="_PHYLINSPortlet_WAR_PHYLINSPortlet_INSTANCE_o3P5_:form_PolicyContent_UI2:Messages:0:j_id1885:0:j_id897" class="null" alt="" src="/PHYLINSPortlet/images/override-0.gif" style="border:0px"/>
This is the xpath of a dynamic button:
I need to click on all the buttons.
what I did is --
List<WebElement> buttons = driver.findElements(By.xpath("//img[(#src='/PHYLINSPortlet/images/override-0.gif')]"));
for( WebElement button : buttons ) {
button.click();
}

It is little bit difficult to provide the proper solution of your problem as you haven't shared your HTML.
As I observe the image in the question. You have 3 same types of image and want to click on any specific image lets say SECOND image then you need to use xpath methods like following-sibling or preceding-sibling to make your xpath unique
Example :-
Suppose you have any unique column in your table (Rule id) or you want to click a specific image.e.g. rule id Val01014 image
Use the methods like following xpath -
//img[#src='/PHYLINSPortlet/images/override-0.gif']/preceding-sibling::td[text()='Val_01014']
OR
//img[#src='/PHYLINSPortlet/images/override-0.gif']/following-sibling::td[text()='Val_01014']

How do I use selenium to change the value of a input[type='range']

I have a slider that uses html5 on an input
e.g.
<input id="sliderWidget" title="Slide me" type="range" min="1" max="1.6" step="0.3" value="1.3">
I have been trying to use selenium to change the slider but traditional image slider controls are not working for me.... e.g.
Action dragAndDrop = builder.dragAndDropBy(sliderWidget,0,30).build();
dragAndDrop.perform();
Does anyone have any ideas how i can perform this incremental range change
thanks in advance

You can select the element and use the send_keys method to send it the right/left arrow keys (which should increment/decrement the input).
In Python:
from selenium.webdriver.common.keys import Keys
...
slider = page.find_element_by_id("sliderWidget")
for i in range(10):
slider.send_keys(Keys.RIGHT)
That should increment the value by 10.

You can set the value direct in JavaScript:
WebElement slider = webDriver.findElement(By.id("sliderWidget"));
System.out.println(slider.getAttribute("value"));
JavascriptExecutor js = (JavascriptExecutor) webDriver;
js.executeScript("javascript:document.getElementById(\"sliderWidget\").value=1.5;");
System.out.println(slider.getAttribute("value"));
Notice that sliderWidget was set to 1.5 but result was 1.6. This way you can test that step=0.3 is working well.

I've found the most stable and cross-browser way is to perform a binary search, dragging the mouse on the slider thumb until you hit the spot.
I have Python/webdriver code for this in my blog: http://blog.usetrace.com/?p=279