Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Screenshot your Entire App with Screengrab and Firebase

Edward Dale
November 03, 2016

Screenshot your Entire App with Screengrab and Firebase

Presentation from the GDG Munich Android meetup

Edward Dale

November 03, 2016
Tweet

More Decks by Edward Dale

Other Decks in Technology

Transcript

  1. Screenshot
    your Entire App
    Edward Dale
    Freeletics
    © Edward Dale, 2016 1

    View Slide

  2. Screenshot
    your Entire App
    with Screengrab
    and Firebase
    Edward Dale
    Freeletics
    © Edward Dale, 2016 2

    View Slide

  3. Find the bug(s)
    © Edward Dale, 2016 3

    View Slide

  4. © Edward Dale, 2016 4

    View Slide

  5. © Edward Dale, 2016 5

    View Slide

  6. Some things
    are best
    verified visually
    !
    Screenshot
    © Edward Dale, 2016 6

    View Slide

  7. Screenshots are useful for
    • Acceptance testing
    • Edge case
    • Localization
    • Multiple devices
    • Regression testing
    © Edward Dale, 2016 7

    View Slide

  8. Screenshot testing tools
    • Espresso tests
    • Dependency injection
    • Dependency mocking
    • Screengrab
    • Firebase Cloud Test Lab for Android
    © Edward Dale, 2016 8

    View Slide

  9. Espresso test setup
    @MediumTest
    public class BuyCoachScreenGrab {
    @Inject
    DummyUserManager mUserManager;
    @Rule
    public ActivityTestRule mActivityRule =
    new ActivityTestRule<>(BuyCoachActivity.class,
    false, false);
    © Edward Dale, 2016 9

    View Slide

  10. Automated localized screenshots of your Android app on
    every device
    Screengrab ▶ Fastlane ▶ Fabric ▶ Twitter
    Combination of command-line tool and classes used in tests
    © Edward Dale, 2016 10

    View Slide

  11. Screengrab test
    @Test
    public void testTestimonialMale() {
    when(mUserManager.getUser().getGender()).thenReturn(Gender.MALE);
    mActivityRule.launchActivity(new Intent());
    onView(withId(R.id.feature_pager_videos)).perform(scrollTo());
    Screengrab.screenshot("buy_coach_male_testimonial");
    }
    © Edward Dale, 2016 11

    View Slide

  12. Screengrab test
    @Test
    public void testTestimonialMale() {
    when(mUserManager.getUser().getGender()).thenReturn(Gender.MALE);
    mActivityRule.launchActivity(new Intent());
    onView(withId(R.id.feature_pager_videos)).perform(scrollTo());
    Screengrab.screenshot("buy_coach_male_testimonial");
    }
    @Test
    public void testTestimonialFemale() {
    when(mUserManager.getUser().getGender()).thenReturn(Gender.FEMALE);
    mActivityRule.launchActivity(new Intent());
    onView(withId(R.id.feature_pager_videos)).perform(scrollTo());
    Screengrab.screenshot("buy_coach_female_testimonial");
    }
    © Edward Dale, 2016 12

    View Slide

  13. Screengrab configuration
    app_package_name 'com.freeletics.debug'
    app_apk_path 'Freeletics-debug.apk'
    tests_apk_path 'Freeletics-debug-androidTest.apk'
    locales ['en-US', 'fr-FR', 'it-IT', 'de-DE',
    'pt-PT', 'es-ES', 'tr-TR', 'ja-JA']
    use_tests_in_classes ['com.freeletics.coach.view.BuyCoachScreenGrab']
    © Edward Dale, 2016 13

    View Slide

  14. Running
    Screengrab
    $ ./gradlew clean assembleDebug assembleDebugTest
    $ screengrab
    © Edward Dale, 2016 14

    View Slide

  15. Firebase Cloud Test Lab for
    Android
    Test your app on devices hosted in a Google datacenter.
    Combination of command-line tool and classes used in tests
    Also supports virtual devices
    © Edward Dale, 2016 15

    View Slide

  16. Firebase Cloud Test Lab for
    Android
    Test your app on devices hosted in a Google datacenter.
    Combination of command-line tool and classes used in tests
    Also supports virtual devices
    $€£¥
    © Edward Dale, 2016 16

    View Slide

  17. Firebase test
    @Test
    public void testTestimonialMale() {
    when(mUserManager.getUser().getGender()).thenReturn(Gender.MALE);
    Activity activity = mActivityRule.launchActivity(new Intent());
    onView(withId(R.id.feature_pager_videos)).perform(scrollTo());
    ScreenShotter.takeScreenshot("buy_coach_male_testimonial", activity);
    }
    © Edward Dale, 2016 17

    View Slide

  18. Screengrab
    Screengrab.screenshot("buy_coach_male_testimonial");
    Firebase
    ScreenShotter.takeScreenshot("buy_coach_male_testimonial", activity);
    © Edward Dale, 2016 18

    View Slide

  19. Running Firebase
    gcloud beta test android run
    --type instrumentation
    --app Freeletics-debug.apk
    --test Freeletics-debug-androidTest.apk
    --device-ids Nexus6
    --os-version-ids 21
    --locales en-US,fr-FR,it-IT,de-DE,pt-PT,es-ES,tr-TR,ja-JA
    --orientations portrait
    --test-targets "class com.freeletics.coach.view.BuyCoachScreenGrab"
    Also possible to stick this in a YML configuration file.
    © Edward Dale, 2016 19

    View Slide

  20. Screengrab
    vs
    Firebase
    Fight!
    © Edward Dale, 2016 20

    View Slide

  21. Screengrab
    • ✅ Free
    • ✅ No waiting for a free device
    • ❌ Limited by your devices
    © Edward Dale, 2016 21

    View Slide

  22. Firebase
    • ✅ Easy to setup a test matrix
    • ✅ Fits well with a CI system
    • ❌ Have to wait your turn
    • ❌ Costs money
    • $5/hour for real device
    • $1/hour for virtual device
    © Edward Dale, 2016 22

    View Slide

  23. My suggestion
    Use both
    © Edward Dale, 2016 23

    View Slide

  24. Cross-platform test
    @Test
    public void testTestimonialMale() {
    when(mUserManager.getUser().getGender()).thenReturn(Gender.MALE);
    Activity activity = mActivityRule.launchActivity(new Intent());
    onView(withId(R.id.feature_pager_videos)).perform(scrollTo());
    ScreenShotter.takeScreenshot("buy_coach_male_testimonial", activity);
    Screengrab.screenshot("buy_coach_male_testimonial");
    }
    Screengrab for daily development
    Firebase for CI regression testing
    © Edward Dale, 2016 24

    View Slide

  25. Thanks!
    Edward Dale (@scompt)
    Freeletics (We're hiring)
    © Edward Dale, 2016 25

    View Slide