Automated Unit & Functional Tests for HTML5 Mobile Apps [Workshop]

HTML5 and hybrid mobile apps are becoming increasingly important, whether as alternative instances of successful web apps, or as mobile-only experiences. A combination of JS unit testing and functional UI testing helps ensure every HTML5 project stays bug-free throughout release cycles, and opens up the possibility for continuously-delivered mobile apps.

In this workshop, we’ll get hands-on with QUnit (for unit testing) and Appium (for functional testing), and write some tests together for a jQuery Mobile-based HTML5 site packaged as a cross-platform hybrid mobile app using Phonegap/Cordova. Then we’ll run the tests using the Sauce Labs cloud service, dig into the results, and talk about speeding up build times using parallelisation of test runs.

Transcript

1. mobile automation made awesome Jonathan Lipps • Director of Ecosystem & Integrations • Sauce Labs @AppiumDevs • @jlipps • @saucelabs jQueryUK Workshop • Oxford, UK May 16 2014
2. Ecosystem & Integrations Project Lead & Architect Unit/Functional Mobile Testing with Appium and Sauce Labs Jonathan Lipps • Director of Ecosystem & Integrations • Sauce Labs @AppiumDevs • @jlipps • @saucelabs
3. appium introduction
4. The Dev Cycle of Optimal Happiness [ ]
5. appium is the cross-platform solution for native and hybrid mobile automation
6. Philosophy R1. Test the same app you submit to the marketplace R2. Write your tests in any language, using any framework R3. Use a standard automation specification and API R4. Build a large and thriving open-source community effort
8. appium architecture
9. Automation Orchestra Apple Instruments & UIAutomation for iOS Google UiAutomator for Android (4.2.1 up) Selendroid for older Android WebDriver interface
10. appium is an HTTP server that creates and handles WebDriver sessions
11. appium extends the WebDriver protocol with mobile-specific behaviors
12. appium setup
13. Requirements (1/2) • Mac (10.8/10.9) • Android automation works on PC/Linux too • Node >= 0.10 • Xcode 5.1 with CLI tools and iOS 7.1
14. Requirements (2/2) • Android Developer Tools >= 22 • http://developer.android.com/sdk/index.html • mv to /usr/local/adt • export ANDROID_HOME=/usr/local/adt/sdk • add (.bashrc, .zshrc, etc): export PATH=”$PATH:$ANDROID_HOME/tools: $ANDROID_HOME/platform-tools”
15. Install HAXM for Android Speed! • open /usr/local/adt/sdk/extras/intel/ Hardware_Accelerated_Execution_Manager/ IntelHAXM.dmg • https://software.intel.com/en-us/android/ articles/intel-hardware-accelerated- execution-manager
16. Make an Android Device • android • Check ‘Intel x86 Atom System Image’ - Android (4.4) • Click ‘Install 1 package...’ • Tools > Manage AVDs • New...
17. • AVD Name: workshop • Device: Nexus S • Target: Android 4.4 • CPU: Intel/Atom • Skin: hw controls • Host GPU Create the Image
18. Launch AVD • In a new terminal window: • emulator @workshop -netfast • Go through the new device tour • $ANDROID_HOME/sdk/tools/emulator @workshop -netfast (without env)
19. Get the workshop code • git clone https://github.com/jlipps/ jqueryuk-workshop-2014.git • cd jqueryuk-workshop-2014
20. Install dependencies • npm install -g appium # no sudo! • npm install -g cordova • npm install -g mocha • npm install .
21. unit tests
22. Run local server • node server.js • # visit http://localhost:8081
24. Run QUnit tests • http://localhost:8081/test.html • # moviesearch/www/test.html • # moviesearch/www/test.js
25. Set up Sauce Labs env vars • http://saucelabs.com/signup/plan/free • http://saucelabs.com/account • # add to .bashrc or equivalent • export SAUCE_USERNAME=”myusername” • export SAUCE_ACCESS_KEY=”xxxxxxxx”
26. Get Sauce Connect • https://saucelabs.com/docs/connect • cp ~/Downloads/sc-4.2-osx/bin/sc \ /usr/local/bin
27. Start Sauce Connect • sc -u $SAUCE_USERNAME -k $SAUCE_ACCESS_KEY
28. Run JS unit tests on Sauce Labs • ./test/jsunit.sh • http://saucelabs.com/tests
29. appium test model
30. Start/stop a session
31. Find & Interact with Elements
32. Automate a WebView
33. appium tests
34. Build & run sample apps • ./go_ios.sh • ./go_android.sh
35. Launch Appium • sudo authorize_ios • appium
36. Moment of truth... • mocha -t 90000 -R spec test/ios.js • mocha -t 90000 -R spec test/android.js
37. Upload app to Sauce Storage • ./test/upload.sh • # or use pre-uploaded app url
38. Run Appium tests on Sauce • SAUCE=1 mocha -t 90000 -R spec test/ios.js
39. Questions? http://appium.io https://github.com/appium/appium @AppiumDevs • @jlipps • @saucelabs
40. Thanks! http://appium.io https://github.com/appium/appium @AppiumDevs • @jlipps • @saucelabs