1. GUI Testing
, NovaTEC // LE

2. Why test the GUI?

3. Why test the GUI? User Interface API Unit-Tests Component-Tests
Integration-Tests
System-Test
Business
Persistence
Web-UI Testing mit testIT - WebTester

4. Why test the GUI? The User Interface … … is part of the application.
… is an entry point into the system.
… is what the customer perceives as THE „application“.
… contains it‘s own business logic.
Web-UI Testing mit testIT - WebTester

5. Different Kinds of GUI-Tests

6. Agile Testing Pyramid Unit Tests Unit & Component Tests Automated
Manual, Exploratory Testing
Automated
UI-Tests
Service Layer Tests (API-Layer)
Unit & Component Tests
Detail
Complexity / Cost
Technology
Business
Unit Tests
Quantity
Web-UI Testing mit testIT - WebTester

7. GUI-Testing Pyramid Unit Tests UI System Tests UI Integration Tests
UI “Unit” Tests
Unit Tests
Web-UI Testing mit testIT - WebTester

8. Different Kinds of GUI-Tests
UI „Unit“
UI Integration
UI System UI
Mock-API
API
Business
Persistence
Web-UI Testing mit testIT - WebTester

9. Page Object Pattern

10. Scenario: Login login.html main.html Username: Password:
testuser
********
LOGIN
Username:
Password:
Hello testuser!
Web-UI Testing mit testIT - WebTester

11. Scenario: Login with default Selenium code (and no optimization)
@Test
public void testValidLogin () {
webDriver.findElement(By.id("username")).sendKeys("testuser");
webDriver.findElement(By.id("password")).sendKeys("123456");
webDriver.findElement(By.id("login")).click();
String headline = webDriver.findElement(By.id("headline")).getText();
assertThat(headline, is("Hello testuser!")); }
public void testInvalidLogin () {
webDriver.findElement(By.id("username")).sendKeys(„foo");
String errorMessage = webDriver.findElement (By.id("errorMessage")).getText();
assertThat(errorMessage, is("Wrong Credentials!"));
Web-UI Testing mit testIT - WebTester

12. Scenario: Login login.html main.html Username: Password:
testuser
********
LOGIN
Username:
Password:
Hello testuser!
LoginPage.java
MainPage.java
Web-UI Testing mit testIT - WebTester

13. Scenario: Login with Page Objects
@Test
public void testValidLogin () {
MainPage mainPage = loginPage.login("testuser", "123456");
assertThat(mainPage.getWelcomeMessage(), is("Hello testuser!")); }
public void testInvalidLogin () {
loginPage = loginPage.loginExpectingError("foo", "123456");
assertThat(loginPage.getErrorMessage(), is("Wrong Credentials!"));
Web-UI Testing mit testIT - WebTester

14. Different kinds of Page Object methods
Hello testuser!
testuser
********
LOGIN
Username:
Password:
Workflows
Actions
Navigations
Information Getter
Web-UI Testing mit testIT - WebTester

15. Page Object Pattern: Actions
public LoginPage setUsername(String value){
username.sendKeys(value);
return this; }
public LoginPage setPassword(String value){
password.sendKeys(value);
Web-UI Testing mit testIT - WebTester

16. Page Object Pattern: Navigations
public MainPage clickLogin(){
login.click();
return createPageObject(MainPage.class); }
public LoginPage clickLoginExpectingError(){
return createPageObject(LoginPage.class);
Web-UI Testing mit testIT - WebTester

17. Page Object Pattern: Workflows
public MainPage login(String username, String password){
return setUsername(username).setPassword(password)
.clickLogin(); }
public LoginPage loginExpectingError(String username, String password){
.clickLoginExpectingError();
Web-UI Testing mit testIT - WebTester

18. Page Object Pattern: Information Getter
public String getErrorMessage () {
return errorMessage.getText(); }
public List<String> getErrorMessages () {
List<String> returnValue = new LinkedList<>();
for(ErrorMessage message : errorMessages){
returnValue.add(message.getText());
return returnValue;
Web-UI Testing mit testIT - WebTester

19. Page Object Pattern With the help of the Page Object Pattern…
… GUI-Tests are maintainable.
… new tests can be implemented with ease and speed.
… tests focus on the “WHAT” not on the “HOW”.
Web-UI Testing mit testIT - WebTester

20. Web-Tester

21. What is testIT WebTester?
Best Practices from ears of actual project experience
Page Object Pattern as a framework
Efficiency-oriented
Extendable in order to adapt to different functional and technological project contexts
Web-UI Testing mit testIT - WebTester

22. What is testIT WebTester?
Testcode
WebTester
Selenium
Browser
Web-UI Testing mit testIT - WebTester

23. WebTester Feature: Typesave API (Functional Classes)
Web-UI Testing mit testIT - WebTester

24. WebTester Feature: Event System
click()
EventListener
EventRegistry
Web-UI Testing mit testIT - WebTester

25. WebTester Feature: Extendibility
You can …
… call the Selenium API directly if any feature is missing.
… create custom Page Objects for project specific components and widgets.
… create custom Event Listeners, f.e. to handle exceptions.
… create custom Browser Factories in order to customize the Web Driver to project specifications.
Web-UI Testing mit testIT - WebTester

26. The END
, NovaTEC // LE