Slides: bit.ly/ui-testing-apps UI Testing iOS & Android Apps @BradBroulik | [email protected] BradBroulik.blogspot.com iOS Code: github.com/BradBroulik/iOS-adaptive-demos Android Code: github.com/BradBroulik/android-adaptive-demos

2 UI Testing Advantages Stability Less Manual Testing Fewer Regressions Future Friendly (OS Upgrades)

3 Test Pyramid 70% Unit Tests 30% UI Tests • UI testing compliments unit tests • UI testing covers broader aspects of functionality • Candidates for UI testing: demo sequences, common workflows, custom views

4 UI Testing iOS

5 Requirements 1) Xcode 7 2) iOS 9 3) iOS device must be enabled for development and connected to a trusted host

6 Getting Started 1) Project Setup 2) Creating UI Tests 3) Running UI Tests 4) Continuous Integration

7 Project Setup 1) Add a new UI Testing Target to your existing or new Xcode project. This will create a UI Testing Stub.

8 Creating UI Tests Place cursor in test method and hit record to auto- generate your UI test code as you run your app TIP: Swift 2.0 has a new @testable annotation which exposes internal methods to your tests so you don’t have to mark methods public just for testing anymore. For example: @testable import

9 Add Assertions func testPopover_whenTapped_thenDisplayDoneButton() { let app = XCUIApplication() let tablesQuery = app.tables tablesQuery.staticTexts["Adaptive Content"].tap() tablesQuery.staticTexts["Popovers"].tap() app.navigationBars.matchingIdentifier("Popover Example").buttons["Share"].tap() let doneButton = app.navigationBars["Popover"].buttons["Done"] XCTAssertEqual(doneButton.exists, true) doneButton.tap() } Add Assertions to verify state changes or expected behavior

10 Running UI Tests To run UI tests in Xcode click the run icon next to the class or method

11 Test API XCUIApplication XCUIElementQuery XCUIElement

12 XCUIApplication Launches a proxy of your app in a new process. It can also terminate your app. It’s also the starting point for finding elements DEFINITION: XCUIApplication is a proxy to your application.

13 XCUIElement XCUIElement is a proxy for elements in your UI DEFINITION: XCUIElement is a proxy for elements in your app. It’s made of a type (button, cell, window, etc) and an identifier (accessibility identifier, label, title, etc). These types and identifiers are used by queries to find your elements. Elements are found with queries which is a combination of type and identifier Identifier Element Query Type

14 XCUIElementQuery DEFINITION: XCUIElementQuery is the API for searching for elements. A query must resolve to a unique element. A non- match or multiple-match will result in a test failure. Identifier Element Query (collection of button types) Query (collection of nav bar types) Filter to find descendant element(s)

15 Test Reports Xcode’s report navigator Test activities

16 Quick Look Quick look preview TIP: Quick look allows you to view the UI at any stage of the test. It’s visible when you click on a test in the Report Navigator.

17 Accessibility Inspector TIP: Queries can only find elements that are visible to accessibility - tested apps are 508-compliant! Accessibility Inspector allows you to view the accessibility data of UI elements. Open the inspector by right-clicking Xcode icon, Open Developer Tool, and select Accessibility Inspector. View accessibility data by running your app, hover the cursor over an element and toggle Command + F7 .

18 Continuous Integration https://developer.apple.com/library/ios/documentation/IDEs/Conceptual/xcode_guide-continuous_integration/index.html

19 Report Navigator https://developer.apple.com/library/ios/documentation/IDEs/Conceptual/xcode_guide-continuous_integration/view_integration_results.html

20 UI Testing Android https://developer.android.com/training/testing/ui-testing/espresso-testing.html

21 Requirements 1) Android SDK v22 2) Android Support Repository rev24 https://developer.android.com/tools/testing-support-library/index.html#setup

22 Getting Started 1) Setting up Espresso 2) Creating UI Tests 3) Running UI Tests 4) Continuous Integration

23 Project Setup 1) Install latest Android Support Repository and Library in SDK Manager 2) Setup Gradle dependencies https://developer.android.com/tools/testing-support-library/index.html#setup 3) Setup folder structure - UI tests are created in src/androidTest

Avoid extending ActivityInstrumentationTestCase2 because of its verbose setup 24 Test Setup Setup your activity under test via ActivityTestRule https://developer.android.com/training/testing/ui-testing/espresso-testing.html#build

25 Creating UI Tests 1) Find a view with a ViewMatcher or find an adapter-backed view with an ObjectMatcher 2) Perform a user action on the view with a ViewAction (tap, input text, etc) 3) Assert the state of the UI with a ViewAssertion https://developer.android.com/training/testing/ui-testing/espresso-testing.html#accessing-ui-components

26 Test API ViewMatcher ViewAction ViewAssertion ObjectMatcher https://github.com/googlesamples/android-testing/blob/master/downloads/espresso-cheat-sheet-2.1.0.pdf

27 1) Find a view with a ViewMatcher or find an adapter-backed view with an ObjectMatcher 2) Perform a user action on the view with a ViewAction (tap, input text, etc) 3) Assert the state of the UI with a ViewAssertion ViewMatcher ObjectMatcher http://hamcrest.org/

28 ViewMatcher ObjectMatcher https://code.google.com/p/hamcrest/wiki/Tutorial

29 1) Find a view with a ViewMatcher or find an adapter-backed view with an ObjectMatcher 2) Perform a user action on the view with a ViewAction (tap, input text, etc) 3) Assert the state of the UI with a ViewAssertion ViewAction

30 ViewAction

31 1) Find a view with a ViewMatcher or find an adapter-backed view with an ObjectMatcher 2) Perform a user action on the view with a ViewAction (tap, input text, etc) 3) Assert the state of the UI with a ViewAssertion Add Assertions to verify state changes or expected behavior ViewAssertion

32 ViewAssertion

33 Running UI Tests Run tests in Android Studio by right-clicking a test class or test method and select Run Or click the Run menu, Edit Configuration, and setup a new Test runner

34 Continuous Integration Build artifacts Build status TIP: CircleCI requires a circle.yml configuration file to manage your CI build settings.

35 UI Testing Practices Espresso Testing best practices: • Don’t navigate through your entire UI every single time. You can launch an activity and configure state in @Before • If you can test things without the UI test them without the UI because firing up the UI is expensive • Feed your networking stack mock data (Mocktrofit)

Thank You! @BradBroulik | [email protected] BradBroulik.blogspot.com iOS Code: github.com/BradBroulik/iOS-adaptive-demos Android Code: github.com/BradBroulik/android-adaptive-demos Slides: bit.ly/ui-testing-apps