title: Drag & Drop works sometimes and not others
body: <p>I'm hoping someone can shed some light on this for me.</p>
  <p>I have 2 different drag &amp; drop scenarios but the same approach doesn't work for both. One scenario only works with the Actions class while the other works with the javascript executor and I was hoping someone could explain to me why this might be happening.</p>
  <p>First - here are my drag and drop methods</p>
  <p><strong>drag and drop with actions class</strong></p>
  <pre><code>public void DragAndDropActions(IWebDriver driver, IWebElement sourceElement, IWebElement targetElement)
  {
      try
      {
          var actions = new Actions(driver);
          actions.DragAndDrop(sourceElement, targetElement).Build().Perform();                
      }
      catch (Exception e)
      {
      }
  }
  </code></pre>
  <p><strong>drag and drop with jse</strong> - i actually found this jse code in another SO question</p>
  <pre><code>public void DragAndDropJSE(IWebDriver driver, IWebElement sourceElement, IWebElement targetElement)
  {
      try
      {
          IJavaScriptExecutor js = (IJavaScriptExecutor)driver;
          js.ExecuteScript(&quot;function createEvent(typeOfEvent) {\n&quot; + &quot;var event =document.createEvent(\&quot;CustomEvent\&quot;);\n&quot;
          + &quot;event.initCustomEvent(typeOfEvent,true, true, null);\n&quot; + &quot;event.dataTransfer = {\n&quot; + &quot;data: {},\n&quot;
          + &quot;setData: function (key, value) {\n&quot; + &quot;this.data[key] = value;\n&quot; + &quot;},\n&quot;
          + &quot;getData: function (key) {\n&quot; + &quot;return this.data[key];\n&quot; + &quot;}\n&quot; + &quot;};\n&quot; + &quot;return event;\n&quot;
          + &quot;}\n&quot; + &quot;\n&quot; + &quot;function dispatchEvent(element, event,transferData) {\n&quot;
          + &quot;if (transferData !== undefined) {\n&quot; + &quot;event.dataTransfer = transferData;\n&quot; + &quot;}\n&quot;
          + &quot;if (element.dispatchEvent) {\n&quot; + &quot;element.dispatchEvent(event);\n&quot;
          + &quot;} else if (element.fireEvent) {\n&quot; + &quot;element.fireEvent(\&quot;on\&quot; + event.type, event);\n&quot; + &quot;}\n&quot;
          + &quot;}\n&quot; + &quot;\n&quot; + &quot;function simulateHTML5DragAndDrop(element, destination) {\n&quot;
          + &quot;var dragStartEvent =createEvent('dragstart');\n&quot; + &quot;dispatchEvent(element, dragStartEvent);\n&quot;
          + &quot;var dropEvent = createEvent('drop');\n&quot;
          + &quot;dispatchEvent(destination, dropEvent,dragStartEvent.dataTransfer);\n&quot;
          + &quot;var dragEndEvent = createEvent('dragend');\n&quot;
          + &quot;dispatchEvent(element, dragEndEvent,dropEvent.dataTransfer);\n&quot; + &quot;}\n&quot; + &quot;\n&quot;
          + &quot;var source = arguments[0];\n&quot; + &quot;var destination = arguments[1];\n&quot;
          + &quot;simulateHTML5DragAndDrop(source,destination);&quot;, sourceElement, targetElement);                
      }
      catch (Exception e)
      {
      }
  }
  </code></pre>
  <p>And now the tests:</p>
  <p><strong>drag and drop actions - passing</strong></p>
  <pre><code>[TestMethod]
  public void DragAndDropActionsPassingTest()
  {
      driver.Url = &quot;http://demo.guru99.com/test/drag_drop.html&quot;;
      var from = driver.FindElement(By.XPath(&quot;//*[@id='credit2']/a&quot;));
      var to = driver.FindElement(By.XPath(&quot;//*[@id='bank']/li&quot;));
      DragAndDropActions(driver, from, to);
      Assert.IsTrue(driver.FindElement(By.XPath(&quot;//*[@id='bank']/li&quot;)).Text.Contains(&quot;BANK&quot;));
  }
  </code></pre>
  <p><strong>drag and drop actions - failing</strong></p>
  <pre><code>[TestMethod]
  public void DragAndDropActionsFailingTest()
  {
      driver.Url = &quot;https://the-internet.herokuapp.com/drag_and_drop&quot;;
      var boxes = driver.FindElements(By.XPath(&quot;//div[@id='columns']/div&quot;));
      Assert.IsTrue(boxes[0].FindElement(By.XPath(&quot;./header&quot;)).Text.Equals(&quot;A&quot;));
      DragAndDropActions(driver, driver.FindElement(By.XPath(&quot;//*[@id='column-a']&quot;)), driver.FindElement(By.XPath(&quot;//*[@id='column-b']&quot;)));
      boxes = driver.FindElements(By.XPath(&quot;//div[@id='columns']/div&quot;));
      Assert.IsTrue(boxes[0].FindElement(By.XPath(&quot;./header&quot;)).Text.Equals(&quot;B&quot;));
  }
  </code></pre>
  <p><strong>drag and drop jse - passing</strong></p>
  <pre><code>[TestMethod]
  public void DragAndDropJSEPassingTest()
  {
      driver.Url = &quot;https://the-internet.herokuapp.com/drag_and_drop&quot;;
      var boxes = driver.FindElements(By.XPath(&quot;//div[@id='columns']/div&quot;));
      Assert.IsTrue(boxes[0].FindElement(By.XPath(&quot;./header&quot;)).Text.Equals(&quot;A&quot;));
      DragAndDropJSE(driver, driver.FindElement(By.XPath(&quot;//*[@id='column-a']&quot;)), driver.FindElement(By.XPath(&quot;//*[@id='column-b']&quot;)));
      boxes = driver.FindElements(By.XPath(&quot;//div[@id='columns']/div&quot;));
      Assert.IsTrue(boxes[0].FindElement(By.XPath(&quot;./header&quot;)).Text.Equals(&quot;B&quot;));
  }
  </code></pre>
  <p><strong>drag and drop jse - failing</strong></p>
  <pre><code>[TestMethod]
  public void DragAndDropJSEFailingTest()
  {
      driver.Url = &quot;http://demo.guru99.com/test/drag_drop.html&quot;;
      var from = driver.FindElement(By.XPath(&quot;//*[@id='credit2']/a&quot;));
      var to = driver.FindElement(By.XPath(&quot;//*[@id='bank']/li&quot;));
      DragAndDropJSE(driver, from, to);
      Assert.IsTrue(driver.FindElement(By.XPath(&quot;//*[@id='bank']/li&quot;)).Text.Contains(&quot;BANK&quot;));
  }
  </code></pre>
  <p><strong>EDIT</strong> - While looking over both sites I noticed that the elements that work with the JSE have an actual <code>draggable=&quot;true&quot;</code> tag associated to them:
  <a href="https://i.stack.imgur.com/BCuk9.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/BCuk9.png" alt="enter image description here" /></a></p>
  <p>while the elements that work with the Actions class don't seem to have that tag (at least on these sites):
  <a href="https://i.stack.imgur.com/1hwwO.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/1hwwO.png" alt="enter image description here" /></a></p>
  <p>I have no idea if this is actually related or not. Just something interesting I thought I'd include.</p>