title: protractor drag and drop is not working on chrome
body: <p>I having an issue with protractor v~5.3.0 . I was trying to drag and drop an element from this site : <a href="https://www.html5rocks.com/en/tutorials/dnd/basics/" rel="nofollow noreferrer">https://www.html5rocks.com/en/tutorials/dnd/basics/</a></p>
  
  <p>at the bottom, there are four square that we can drag and drop. but through protractor, I can only drag the element but could not drop it. here is the code that I wrote. please let me know what wrong have I done. thanks in advance. </p>
  
  <pre><code>describe('germi App', () =&gt; {
    let page: AppPage;
  
    beforeEach(() =&gt; {
      page = new AppPage();
  
      browser.waitForAngularEnabled(false);
    });
  
    it('should  drag and drop with JavaScript', async () =&gt; {
      await page.navigate2();
      const element1 = element(by.xpath('//*[@id="columns-full"]/div[1]'));
      const element2 = element(by.xpath('//*[@id="columns-full"]/div[2]'));
      browser.sleep(10000);
  
      /* browser
          .actions()
          .dragAndDrop(element1, element2)
          .perform();
      browser.sleep(5000); */
  
      browser.actions().
        mouseDown(element1).
        mouseMove(element2).
        mouseUp().
        perform();
  
      browser.sleep(5000);
    });
  });
  </code></pre>
  
  <p>in case you want to check my navigate2 func . </p>
  
  <pre><code>navigate2() {
             return browser.get("https://www.html5rocks.com/en/tutorials/dnd/basics/");
           }
  </code></pre>