O'Reilly logo

Mastering Selenium WebDriver 3.0 by Mark Collin

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Working with offsets

Let's make the drag-and-drop code a little bit more complicated. We are going to change the main page markup and the JavaScript slightly to make it more challenging to automate.

First of all, we are going to change the HTML code by adding a <span> element in each draggable element. We are going to move the text for the element into this <span>, as follows:

 <ul> <li> <div id="one" href="#" class="draggable"> <span>one</span> </div> </li> <li> <div id="two" href="#" class="draggable"> <span>two</span> </div> </li> <li> <div id="three" href="#" class="draggable"> <span>three</span> </div> </li> <li> <div id="four" href="#" class="draggable"> <span>four</span> </div> </li> <li> <div id="five" href="#" class="draggable"> ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required