selenium tests, the object oriented way. the workshop · selenium tests, the object oriented way....
TRANSCRIPT
Selenium tests, the Object Oriented way.The workshop
Corina Pip
@imalittletester
https://iamalittletester.wordpress.com/
• Blog: https://iamalittletester.wordpress.com/
• Travel blog: https://travelwithcori.com/
• Photos: https://www.flickr.com/photos/capreoara
• Twitter: @imalittletester
@imalittletester
The task
- Navigate to https://iamalittletester.wordpress.com/
- Look at the ‘featured’ content section
- Test that the ‘featured’ content is the one from the image
below
- Do this task by using only ONE assert
Phase 1: Analysis
Phase 1: Analysis
• Structure of module:• 3 articles
• Each article:• 1 clickable image with link
• 3 assigned tags which are links
• 1 link to the post
• 3 articles
• Each article:• 1 clickable image with link
<article>
<a href=…>
<img width=… height=… src=… />
</a>
...
</article>
• Each article:• 3 assigned tags which are links
<article>
...
<a href=… rel="category tag"> Label </a>
<a href=… rel="category tag"> Label </a>
<a href=… rel="category tag"> Label </a>
...
</article>
• Each article:• 1 link to the post
<article>
...
<a href=… rel="bookmark"> Label </a>
</article>
• So, for each article:
<article><a href=…>
<img width=… height=… src=… /></a>
…<a href=… rel="category tag"> Label </a><a href=… rel="category tag"> Label </a><a href=… rel="category tag"> Label </a>
... <a href=… rel="bookmark"> Label </a>
</article>
Phase 2: Defining the objects
The featured content module
• Will be an object with 3 properties:• Featured content 1
• ClickableImage: href, width, height, src• TagSection
• Link1: href, label
• Link2: href, label
• Link3: href, label
• Link: href, label
• Featured content 2: same properties as first one
• Featured content 3: same properties as first one
Each object consists of
•Properties•Constructor for expected content•Constructor for actual content•equals() and hashCode() methods – for comparing objects•toString() method – to print object to the console
An image object: ClickableImage
•Will be named: ClickableImage
•Will be an object with 4 properties: href, src, width, height
•Will have two constructors
•Will have the additional methods: equals(), hashCode(), toString()
ClickableImage
• Will be an object with 4 properties: href, src, width, height
public class ClickableImage {
private String imageHref;
private String imageWidth;
private String imageHeight;
private String imageSource;
Generating constructors
- inside the class, click Alt + Ins:
- then, select all the displayed properties
ClickableImage – constructor for EXPECTED
public ClickableImage(String imageHref, String imageWidth, String
imageHeight, String imageSource) {
this.imageHref = imageHref;
this.imageWidth = imageWidth;
this.imageHeight = imageHeight;
this.imageSource = imageSource;
}
ClickableImage – constructor for ACTUAL
public ClickableImage(WebElement element) {
this.imageHref = element.getAttribute("href");
this.imageWidth =
element.findElement(By.cssSelector("img")).getAttribute("width");
this.imageHeight =
element.findElement(By.cssSelector("img")).getAttribute("height");
this.imageSource =
element.findElement(By.cssSelector("img")).getAttribute("src");
}
equals(), hashCode(), toString()
•Click Alt + Ins yet again
•Choose: equals() and hashCode()
•Click Alt + Ins yet again
•Choose: toString()
Link
• Each item in the tag section is an object of type Link
•A Link object has two properties: href, label
public class Link {
private String href;
private String label;
Link – constructor for EXPECTED
public Link(String href, String
label) {
this.href = href;
this.label = label;
}
Link - constructor for ACTUAL
public Link(WebElement element) {
this.href
= element.getAttribute("href
");
this.label = element.getText();
}
+ equals(), hashCode(), toString()
TagSection
•An Object with 3 properties of type Link
public class TagSection {
private Link tag1;
private Link tag2;
private Link tag3;
TagSection – constructor for EXPECTED
public TagSection(Link tag1, Link tag2, Link
tag3) {
this.tag1 = tag1;
this.tag2 = tag2;
this.tag3 = tag3;
}
+equals(), hashCode(), toString()
TagSection – constructor for ACTUAL
public TagSection(List<WebElement> elementList)
{
this.tag1 = new Link(elementList.get(0));
this.tag2 = new Link(elementList.get(1));
this.tag3 = new Link(elementList.get(2));
}
Article
•One of the 3 items of the featured content = Article
public class Article {
private ClickableImage
clickableImage;
private TagSection tagSection;
private Link postLink;
Article – constructor for EXPECTED
public Article(ClickableImage clickableImage,
TagSection tagSection, Link postLink) {
this.clickableImage = clickableImage;
this.tagSection = tagSection;
this.postLink = postLink;
}
Article - constructor for ACTUAL
public Article(WebElement imageElement,
List<WebElement> tagElementList, WebElement
postElement) {
this.clickableImage = new
ClickableImage(imageElement);
this.tagSection = new TagSection(tagElementList);
this.postLink = new Link(postElement);
}
Featured content section
• FeaturedContent Object – made up of three Article Objects
public class FeaturedContentSection {
private Article article1;
private Article article2;
private Article article3;
Featured content section - EXPECTED
public FeaturedContentSection(Article article1,
Article article2, Article article3) {
this.article1 = article1;
this.article2 = article2;
this.article3 = article3;
}
Featured content section - ACTUAL
public FeaturedContentSection(WebElement _1_imageElement, List<WebElement>
_1_tagElementList, WebElement _1_postElement,
WebElement _2_imageElement, List<WebElement>
_2_tagElementList, WebElement _2_postElement,
WebElement _3_imageElement, List<WebElement>
_3_tagElementList, WebElement _3_postElement) {
this.article1 = new Article(_1_imageElement, _1_tagElementList, _1_postElement);
this.article2 = new Article(_2_imageElement, _2_tagElementList, _2_postElement);
this.article3 = new Article(_3_imageElement, _3_tagElementList, _3_postElement);
}
Phase 3: Define the PageObject
Define the PageObject
• @FindBy(how = CSS, using = "#post-564 a") public WebElement image1Element;
@FindBy(how = CSS, using = "#post-564 header
a") public List<WebElement> tagList1Element;
@FindBy(how = CSS, using = "#post-564 h1 a")
public WebElement post1Element;
Phase 4: Write the tests
Generate expected content
private ClickableImage image1 = new ClickableImage("https://iamalittletester.wordpress.com/2016/02/02/ho
w-to-identify-the-test-scenarios-you-have-to-automate/", "346","192", "https://iamalittletester.files.wordpress.com/2016/01/24680224896_5c3e7335c5_o.jpg?w=672&h=372&crop=1");private ClickableImage image2 = new ClickableImage(
"https://iamalittletester.wordpress.com/2015/04/03/working-with-cookies-in-selenium/", "346", "192",
"https://iamalittletester.files.wordpress.com/2015/04/dsc_0882.jpg?w=672&h=372&crop=1");private ClickableImage image3 = new ClickableImage(
"https://iamalittletester.wordpress.com/2014/05/05/useful-generating-random-strings-with-randomstringutils/",
"346", "192", "https://iamalittletester.files.wordpress.com/2014/05/13643775275_e4d2dd2da3_o.jpg?w=672&h=372&crop=1");
Generate expected content
private Link tag_automation = new Link("https://iamalittletester.wordpress.com/category/automation/", "AUTOMATION");private Link tag_code = new Link("https://iamalittletester.wordpress.com/category/code/", "CODE");private Link tag_testing = new Link("https://iamalittletester.wordpress.com/category/testing/", "TESTING");private Link tag_selenium = new Link("https://iamalittletester.wordpress.com/category/selenium/", "SELENIUM");private Link tag_flavours = new Link("https://iamalittletester.wordpress.com/category/flavours/", "FLAVOURS");
Generate expected content
//below part of the article - the link to the postprivate Link postLink1 = new Link("https://iamalittletester.wordpress.com/2016/02/02/how-to-identify-the-test-scenarios-you-have-to-automate/",
"HOW TO IDENTIFY THE TEST SCENARIOS YOU HAVE TO AUTOMATE");private Link postLink2 = new Link("https://iamalittletester.wordpress.com/2015/04/03/working-with-cookies-in-selenium/",
"WORKING WITH COOKIES IN SELENIUM");private Link postLink3 = new Link("https://iamalittletester.wordpress.com/2014/05/05/useful-generating-random-strings-with-randomstringutils/",
"USEFUL: GENERATING RANDOM STRINGS WITH RANDOMSTRINGUTILS");
Generate expected content
//tag sectionsprivate TagSection tagSection1 = new TagSection(tag_automation, tag_code, tag_testing);private TagSection tagSection2 = new TagSection(tag_automation, tag_selenium, tag_testing);private TagSection tagSection3 = new TagSection(tag_automation, tag_flavours, tag_testing);
//articlesprivate Article article1 = new Article(image1, tagSection1, postLink1);private Article article2 = new Article(image2, tagSection2, postLink2);private Article article3 = new Article(image3, tagSection3, postLink3);
//the featured content sectionprivate FeaturedContentSection featuredContentSection = new FeaturedContentSection(article1, article2, article3);
The test
@Testpublic void theTest() {
webDriver.get("https://iamalittletester.wordpress.com/";
assertEquals(new FeaturedContentSection(page.image1Element, page.tagList1Element, page.post1Element,
page.image2Element, page.tagList2Element, page.post2Element,
page.image3Element, page.tagList3Element, page.post3Element), featuredContentSection);}
Summary
• Analyze the module under test
• Map module and properties to objects and object properties
• Create constructors for expected and actual content
• Add equals(), hashCode(), toString() methods to objects
• Create page objects
• Generate expected and actual content objects
• Compare expected and actual objects
Possible improvements
•Reduce constructor signatures
• Extract common texts into variables/constants
•Add more constructors if needed
•Override display for assertion error
Solution available
• Git project: https://github.com/iamalittletester/learning-
project
• Page objects: https://github.com/iamalittletester/learning-
project/tree/master/src/main/java/pageobjects/seOO/ntd17
• Objects + test : https://github.com/iamalittletester/learning-
project/tree/master/src/test/java/ntd17