title: WebDriver synchronisation issue when waiting for an element
body: <p>Using WebDriver, Junit 4.11, Maven, IntelliJ v.13</p>
  
  <p>Im trying to find the correct method in writing this test which is to verify that once I have clicked an element, it takes me to the next page.</p>
  
  <p>After researching the WaitTool, Im attempting to nullify the <code>implicitlyWait()</code> then execute the <code>WebDriverWait()</code> and then reset <code>implicitlyWait()</code> although I'm receiving initialisation errors.</p>
  
  <p>Ultimately, my main goal is to stop the synchronisation issues Im experiencing by using the new WaitTool.</p>
  
  <p>The problem Im having is that when I click a button, I occasionally receive an error in waiting for an element <code>new WebDriverWait(chrome, 30).until(ExpectedConditions.visibilityOfElementLocated(By.cssSelector("div.listContainer")));</code>to appear on the next page.</p>
  
  <p>This is what my code has been when executing the test:</p>
  
  <pre><code>@Test
  public void selectBlankProject(){
      new WebDriverWait(chrome, 30).until(ExpectedConditions.visibilityOfElementLocated(By.xpath("//*[@id=\"templateGrid\"]/li[2]/img[1]")));
  
      WebElement item1 = chrome.findElement(By.xpath("//*[@id=\"templateGrid\"]/li[2]/img[1]"));
      WebElement item2 = chrome.findElement(By.xpath("//*[@id=\"templateGrid\"]/li[2]/img[2]"));
      WebElement item3 = chrome.findElement(By.xpath("//*[@id=\"templateGrid\"]/li[2]/header/span"));
      WebElement item4 = chrome.findElement(By.xpath("//*[@id=\"templateGrid\"]/li[2]"));
  
      Actions click = new Actions(chrome);
      click.moveToElement(item1).moveToElement(item2).moveToElement(item3).moveToElement(item4).click().build().perform();
  
      System.out.println("Blank Project has been selected");
  
  }
  
  @Test
  public void dragVideoCompoenentOnToTheCanvas(){
  
      chrome.manage().timeouts().implicitlyWait(3, TimeUnit.SECONDS);
  
      new WebDriverWait(chrome, 30).until(ExpectedConditions.visibilityOfElementLocated(By.cssSelector("div.listContainer")));
  
      Actions dragAndDrop = new Actions(chrome);
      //Dragging the video component onto the canvas
      WebElement listContainerVideo = chrome.findElement(By.cssSelector("div.listContainer"));
      WebElement componentListVideo = chrome.findElement(By.cssSelector("ul.componentList.j-componentList"));
      WebElement videoComponent = chrome.findElement(By.cssSelector("li.componentItem.ui-draggable[data-id=\"c5\"]"));
      WebElement componentThumbVideo = chrome.findElement(By.cssSelector("div.componentThumb"));
      WebElement componentNameVideo = chrome.findElement(By.cssSelector("div.componentName.f-feature-A"));
  
      //finds the canvas to drop the video component onto
      WebElement canvas = chrome.findElement(By.cssSelector("div#page-c3"));
  
      dragAndDrop.clickAndHold(videoComponent)
              .moveToElement(listContainerVideo)
              .moveToElement(componentListVideo)
              .moveToElement(componentThumbVideo)
              .moveToElement(componentNameVideo)
              .release(canvas).perform();
  
      WebElement draggableVideoComponent = chrome.findElement(By.cssSelector("div.t-component-A.videoComponent.component.draggableComponent.ui-draggable.layerSelected"));
  
      Assert.assertEquals("video", draggableVideoComponent.getAttribute("data-type"));
  }
  </code></pre>
  
  <p>I added <code>chrome.manage().timeouts().implicitlyWait(3, TimeUnit.SECONDS);</code> in the second test, then realised that this was also setting <code>WebDriverWait()</code>. So I came across <code>WaitTool</code> and I'm attempting to use this to see if it will solve my sync issue.</p>
  
  <p>Reference here: <a href="https://github.com/ChonC/wtbox/blob/master/src/wtbox/util/WaitTool.java" rel="nofollow">WaitTool</a></p>
  
  <p>However, this is causing me further problems. When I attempt to use the following code, I receive initialisation errors:</p>
  
  <pre><code>@Test
      public int dragClickAreaComponentToStage(int element){
  
      try{
          chrome.manage().timeouts().implicitlyWait(0, TimeUnit.SECONDS);
  
          new WebDriverWait(chrome, 30).until(ExpectedConditions.presenceOfElementLocated(By.cssSelector("li.componentItem.ui-draggable[data-id=\"c3\"]")));
  
          chrome.manage().timeouts().implicitlyWait(DEFAULT_WAIT_FOR_PAGE, TimeUnit.SECONDS);
          return element;
      }catch (StaleElementReferenceException e){
          e.printStackTrace();
  
      }
  
  
      WebElement clickArea = chrome.findElement(By.cssSelector("li.componentItem.ui-draggable[data-id=\"c3\"]"));
      WebElement arrowHead = chrome.findElement(By.cssSelector("div.componentThumb"));
      WebElement imageHolderClickArea = chrome.findElement(By.cssSelector("div.imageHolder"));
      WebElement componentNameClickArea = chrome.findElement(By.cssSelector("div.componentName.f-feature-A"));
  
      WebElement canvas = chrome.findElement(By.cssSelector("div.j-page.t-page-A[id=\"page-c3\"]"));
  
      Actions click = new Actions(chrome);
  
      click.clickAndHold(clickArea).moveToElement(arrowHead).moveToElement(imageHolderClickArea).moveToElement(componentNameClickArea).moveToElement(canvas).release();
  
      click.perform();
  
      //checking that the draggable click area component has a data-type value as clickArea
      WebElement clickAreaComp = chrome.findElement(By.cssSelector("div.t-componentImg-A.component.clickAreaComponent.draggableComponent.ui-draggable"));
      Assert.assertEquals("clickArea", clickAreaComp.getAttribute("data-type"));
  
          return element;
  
  }
  </code></pre>
  
  <p>So in the stacktrace I'm getting</p>
  
  <p><code>java.lang.Exception: Method cDragClickAreaComponentToStage() should be void</code></p>
  
  <p>and </p>
  
  <p><code>java.lang.Exception: Method cDragClickAreaComponentToStage should have no parameters</code></p>
  
  <p>Okay, queue "So, what is your question?".</p>
  
  <p>Firstly, I'd like to know where I'm going wring with setting my <code>@Test</code> public int. Usually I would have it declared as void, but in this case I want to <code>return</code> something which has to be an <code>int</code>, right?</p>
  
  <p>Secondly, I'd like to know where am I going wrong with the synchronisation issue when it attempts to wait for an element.</p>