Writing UI tests for Android apps using Xamarin and Visual Studio 2015

Welcome to our weekly MVP series where we discuss some of the most useful solutions, tips & tricks and how to’s on integrating OSS & Microsoft technologies. In case you have any questions, don’t hesitate and drop us a comment below or reach out to us via Twitter and Facebook! Enjoy!

Today I will be tackling how to write unit tests for iOS and Android apps using my two favourite developer tools

Visual Studio 2015 (https://www.microsoftstore.com/store/msca/en\_CA/cat/Visual-Studio/categoryID.64522300?tduid=(e92a5348db4c4e9cdfec646e36497d02)(240780)(2316686)(SRi0yYDlqd0-LyPJqJnqVsDz7flDh1avAg)()) and [Xamarin](https://xamarin.com/).

I know most developers avoid writing unit tests for their apps.  Hopefully, through this article, I will show just how painless this coding process can be.

I’m going to assume everyone has Visual Studio 2015 and Xamarin installed and setup correctly. The great news is Xamarin is now a part of the Visual Studio 2015 installation.

Let's get started.

Open up Visual Studio 2015 and let’s create a new project. For this walkthrough we are going to create a simple Android app. From the main menu in Visual Studio select File->New Project.

On the New Project dialog screen under the Android templates select “Blank App (Andorid)”. For this demo let’s name the app “MyAwesomeApp”.

After a short time, Visual Studio will have created “MyAwesomeApp” which is pictured below. I still love the fact that now I can build my Android apps within Visual Studio 2015 using the built-in Android designer.

Let’s run the app and make sure everything is working correctly for us. I’m using the new Xamarin Android Player which you can find here: https://xamarin.com/android-player . If you have ever done any Android development you will appreciate just how much faster app deploys work with this emulator.

The app doesn’t do much, however, our focus for today is learning how to setup and create UI unit tests.

Now that we’ve seen the demo app in action lets add a new project into the solution. This new project will be used to contain our unit tests and keep it separate from the rest of the code.

Using the solution explorer panel select the solution file then bring up the pop up menu.

Select Add->New Project in the menu options.

Within the AddNew Project dialog screen locate the UITest project under the Mobile Apps project templates. Enter the name MyAwesomeApp.Tests for the project name.

Now that the UITest project has been setup within the solution, navigater to the tests.cs file under the MyAwesomeApp.Tests project.

We should take a moment to pause and talk a little about the Xamarin.UITest. Xamarin.UITest is a testing framework that allows us to automate our UI acceptance testing. The best part is that the tests are written using NUnit and can be run against both iOS and Android applications. Think about the number of times you had to login or fill in a form within the application you are developing to test an update or new feature. Now imagine having those steps automated. You can begin to see the time savings here. Plus, we can leverage these same tests within Xamarin Test Cloud. I won’t go into Xamarin Test Cloud in this article. Let’s save that topic for the next one.

Let’s get back to the tests.cs file under the MyAwesomeApp.Tests project. We need to update the code to setup for our project and write a quick test to make sure everything is working correctly.

Within tests.cs make the following code changes.

 using System;

using NUnit.Framework;

using Xamarin.UITest;

using Xamarin.UITest.Queries;

namespace MyAwesomeApp.Tests

{

    [TestFixture(Platform.Android)]

public class Tests

    {

IApp app;

Platform platform;

public Tests(Platform platform)

        {

this.platform = platform;

        }

        [SetUp]

public void BeforeEachTest()

        {

            app = AppInitializer.StartApp(platform);

        }

        [Test]

public void AppLaunches()

        {

            app.Repl();

        }

    }

}

Next we need to configure the setup of our tests to point to the compiled Android .apk file of our application. So make the following codes changes in the AppInitializer.cs within the MyAwesomeApp.Tests project.

Please note that the normal build process does not create the apk file. In order to generate the apk file you need to deploy to an Android emulator or device.

 using Xamarin.UITest;

namespace MyAwesomeApp.Tests

{

public class AppInitializer

    {

public static IApp StartApp(Platform platform)

        {

          if (platform == Platform.Android)

          {

return ConfigureApp

            .Android

            .ApkFile("../../../MyAwesomeApp/bin/Debug/MyAwesomeApp.MyAwesomeApp.apk")

           .StartApp();

          }

return ConfigureApp

                .iOS

                .StartApp();

        }

    }

}

The last step is to disable “Use Shared Runtime” within the Android Options which you can navigate to by double clicking on the Properties item within the Solution Explorer. Xamarin.UITest framework does not support running tests with this option enabled.

What is happening is we are making sure that the tests execute our Android application within the solution. When the application launches we are starting the console app REPL. REPL stands for Read-Eval-Print-Loop. This app allows us to perform queries against the UI and perform operations against the app UI. The best part is we can use the REPL’s copy feature to copy all these actions and paste into our tests.

Let’s run the application and take a quick look at REPL in action. To run our tests we need to active the tests using the Test Explorer within Visual Studio. We can open this panel by selecting from the main menu Tests -> Windows -> Text Explorer.

Next click on the “Run All” tests link within the Test Explorer.

Once the tests are started successful the REPL console windows will appear. Within the REPL console enter in the command Tree. Think of the tree command as the directory listing for all the UI elements visible on the screen.

REPL is very powerful tool to help you with building your UI tests. Xamarin has great documentation on REPL which you can find here: https://developer.xamarin.com/guides/testcloud/uitest/working-with/repl/

For this tutorial we want to setup a test to trigger the click event on the “Hello World. Click Me!” button.

So looking at the UI tree information we know the id of the button is “MyButton”. Let’s confirm this by entering the following command in the REPL windows app.Flash(c=>c.Marked("MyButton")) . Make sure to have the Xamarin Android Player in view next to the REPL console window.

Did you notice the button flashed for a few seconds within the Xamarin Android Player? Great, this means we’ve properly identified the button within our UI tree. Lets see how we can trigger the click event of the button.

Enter the follow command app.Tap(c=>c.Marked("MyButton")) within the REPL console. The end result should be that the click event is activated within the Android Xamarin Player.

Next we want to copy all the previous actions done within the REPL console. We will use these to help build a next test for the button click event.

Enter the command copy in the REPL console windows. This will copy the command history from REPL.

Now we need to go back in our tests.cs file and create the follow test. Enter the following code.

 [Test]
public void ButtonClicked()
{ 
  
//paste the REPL commands here.
 
}

 With the commands copied from REPL lets paste them within our new test.  So you can see how useful the copy command can be for building our tests.

 To complete this exercise lets complete the testing code for the ButtonClicked test.  Replace the code for the ButtonClicked test.

 [Test]
public void ButtonClicked()

{    

app.Tap(c => c.Marked("MyButton"));   
 
AppResult[] results = app.Query(MyButton);

app.Screenshot("Button clicked twice.");


Assert.AreEqual("2 clicks!", results[0].Text); 

}

 So with the test we are using the query method to return the state of the button.  Next we are taking a screen shot of our Android during the test. Imagine running 

 these tests at night and reviewing the image results in the next day. In final step we are confirming that the text on the button contains the characters “2 clicks!”.   

 If the button does, the test passes!

 So hopefully with this bit of knowledge you can leverage Xamarin UITests with Visual Studio 2015 to automate your build QA process.

 As always happy coding! 

Comments

• Anonymous
  January 18, 2016
  Tom - A good article on a topic that is often ignored. Well done!