3 Replies Latest reply on Oct 11, 2016 5:49 PM by vinothsjboss

    Graphene - Visual Validation

    vinothsjboss
    vinothsjboss Oct 5, 2016 4:32 PM

      mjobanek, I was thinking if we could add an extn for visual validation in Graphene. For ex: the use case would be as shown here.

       

       

      @Image(Baseline = "/resources/login.png")
public class LoginPage {


 @FindBy
 private WebElement username;


 @FindBy
 private WebElement password;


 @FindBy
 private WebElement someDynamicContentElement;


 @ArquillianResource
 private ImageComparator imageComparator;


 @Image(Baseline = "/resources/login/mustmatch.png")
 @FindBy
 private WebElement someElementWhichShouldMatchImge;


 //takes the screenshot of the current page
 //compares with baseline & returns the status
 //it can even highlight the difference in case of mismatch
 public boolean isPageAsExpected() {
  return imageComparator.compare();
 }


 //we might want to exclude some elements
 //it might have dynamic content like current date/time etc
 public boolean isPageAsExpectedAfterExcludingElements() {
  return imageComparator.exclude(someDynamicContentElement)
   .exclude(someOtherElement1)
   .exclude(someOtherElement2)
   .compare();
 }


 //in some case we might not want to do whole page compare
 //ex: it might have tons of adds
 //So we might want to just compare one or more elements - not whole page
 public boolean isSomeElementAsExpected() {
  //take current coordinates of the element and get the image
  //compare with baseline 
  return imageComparator.element(someElementWhichShouldMatchImge)
   .element(someOtherElement1) //or list of elements
   .element(someOtherElement2)
   .element(someOtherElement3)
   .compare();
 }
}