The document discusses testing mobile apps on AWS Device Farm. It begins with an introduction to the challenges of mobile testing and what Device Farm is. It then demonstrates building a React Native notes app, writing Espresso tests for it, bundling the app for testing on real devices, and generating the APK file. Finally, it discusses running the tests on Device Farm and integrating testing into a CI/CD pipeline.

1. © 2017, Amazon Web Services, Inc. or its Affiliates. All rights reserved
Pop-up Loft
Testing your app before launch
An introduction to AWS Device Farm
Nikhil Dabhade
Cloud Solutions Engineer | AWS Mobile
Email: nikdabn@amazon.com
Twitter: @in_nikoftime

2. © 2017, Amazon Web Services, Inc. or its Affiliates. All rights reserved
If you have not done so already…
q Download and Install Android Studio 3.x
q Download or Clone React Native Notes Tutorial from Github
https://github.com/aws-samples/aws-mobile-react-native-notes-tutorial
q Build and run React Native Notes app for Android

3. © 2017, Amazon Web Services, Inc. or its Affiliates. All rights reserved
Wait, what ?

4. © 2017, Amazon Web Services, Inc. or its Affiliates. All rights reserved
I can fix this!

5. © 2017, Amazon Web Services, Inc. or its Affiliates. All rights reserved
Challenges in mobile testing space
• Fragmentation of devices
• Reliable access to real devices
• Testing: UI vs. functional
• Different test frameworks
• Continuous integration for mobile-automation testing
• Reporting from tests
• Access to test artifacts
• Granular control and maintenance of devices and test setup

6. © 2017, Amazon Web Services, Inc. or its Affiliates. All rights reserved
What is AWS Device Farm?
Automated testing Remote Access
Test your app in parallel against a large collection
of physical devices in the AWS Cloud
Gesture, swipe, and interact with devices in real
time, directly from your web browser or local host

7. © 2017, Amazon Web Services, Inc. or its Affiliates. All rights reserved
Automation Testing for React Native Apps on Device Farm
Your App
UI Automation
UI Automator
XCTest
AWS Device FarmPopular Test Frameworks
Detailed Test
Reports

8. © 2017, Amazon Web Services, Inc. or its Affiliates. All rights reserved
What are we going to do today?
• Build the React Native Notes app
• Write Espresso tests
• Generate app and tests package
• Run Tests on Device Farm
• CI/CD integration

9. © 2017, Amazon Web Services, Inc. or its Affiliates. All rights reserved
Demo: Building the React Native Notes App

10. © 2017, Amazon Web Services, Inc. or its Affiliates. All rights reserved
Demo: Building the React Native Notes App
• Download or git clone
– https://github.com/aws-samples/aws-mobile-react-native-notes-tutorial
• Run “yarn install” in root folder of downloaded app
• Open Android Studio
– Open Android part (aws-mobile-react-native-notes-tutorial/android) of the
downloaded app
– Start emulator
• From terminal run “yarn run android”

11. © 2017, Amazon Web Services, Inc. or its Affiliates. All rights reserved
Demo: Writing Espresso Tests

12. © 2017, Amazon Web Services, Inc. or its Affiliates. All rights reserved
Demo: Writing Espresso Tests
• In Android Studio, Select Runà Record Espresso Test
– For prompt asking to add Espresso dependencies
• Select Yes
– For error related to library version
• Add androidTestCompile 'com.google.code.findbugs:jsr305:3.0.0’ to module level
build.gradle
• Save the test class as “NotesTest”
• In generated “NotesTest” code add imports
– import static android.support.test.espresso.assertion.ViewAssertions.matches;
– import static android.support.test.espresso.Espresso.pressBack;
– import static android.support.test.espresso.matcher.ViewMatchers.withText;
– import static android.support.test.espresso.matcher.ViewMatchers.withHint;

13. © 2017, Amazon Web Services, Inc. or its Affiliates. All rights reserved
Demo: Writing Espresso Tests
• Add code for pressing “+”
ViewInteraction reactAddButton = onView(
allOf(withText("+"), isDisplayed()));
reactAddButton.perform(click());
• Add code for clicking on New Note Title
ViewInteraction reactEditText = onView(
allOf(withHint("Note Title"), isDisplayed()));
reactEditText.perform(click());
• Add code for adding text in New Note Title
reactEditText.perform(replaceText("Test"));

14. © 2017, Amazon Web Services, Inc. or its Affiliates. All rights reserved
Demo: Bundle app for testing on real device

15. © 2017, Amazon Web Services, Inc. or its Affiliates. All rights reserved
Demo: Bundle app for testing on real device
• Bundle app using the following 3 commands.
mkdir android/app/src/main/assets
react-native bundle --platform android --dev false
--entry-file index.android.js
--bundle-output android/app/src/main/assets/index.android.bundle
--assets-dest android/app/src/main/res
react-native run-android
• Why?
– JS bundle is located on your development system and the app inside your real device is not
aware of it's location.

16. © 2017, Amazon Web Services, Inc. or its Affiliates. All rights reserved
Demo: Generate apk for app and tests

17. © 2017, Amazon Web Services, Inc. or its Affiliates. All rights reserved
Demo: Generate apk for app and tests
• Run following commands
cd aws-mobile-react-native-notes-tutorial/android
./gradlew cC
• Output apk will be located under:
aws-mobile-react-native-notes
tutorial/android/app/build/outputs/apk

18. © 2017, Amazon Web Services, Inc. or its Affiliates. All rights reserved
Demo: Run Tests on Device Farm

19. © 2017, Amazon Web Services, Inc. or its Affiliates. All rights reserved
Demo: CI/CD integration with Device Farm

20. © 2017, Amazon Web Services, Inc. or its Affiliates. All rights reserved
Pop-up Loft
aws.amazom.com/mobile
@AWSForMobile
Everything you need to connect
your mobile app to the cloud