Skip to main content

Xamarin UI Tests – Deep dive Part 2

Following up to the previous blog i would like to get my hands a bit more dirty with the code and actually start using calabash to do some UI tests, knowing that the whole idea of testing can be maximized as we go through, from a sample UI test using the normal calabash syntax to the a more complex behavioral driven development approach where we can employ the power of  Cucumber and Gherkin using SpecFlow Syntax to create readable test cases that can be ready by non technical guys, of course every step we take towards a more technical advancement the more work we are required to do, anyhow lets start simple

First thing is the tools we gonna need and i will mention them all even if we are going to start simple but i like to get everything ready first.

The Tools

The IDE
Depending on your preference you can choose to use Xamarin studio or Visual studio to write your tests
The Test Runner:
You should be able to run the test using Microsoft test runner or the Xamarin studio test running or you could just use the one that comes with other providers like resharper, it should be all up to you
Speckflow
Speckflow is all .net implementation for the Cucumber and Gherkin syntax so in order for Visual studio to understand the natural language that the User Stories is written by, you will need to install it on visual studio which can be found in the extensions
or you could use the xamarin studio addin from the link Specflow for Xamarin studio


That cuts it for the tools, now lets write a UI Test, but we will need an application so that we can test it on, and that is entirely up to you, i have already been working on an app and i am gonna use it to do the UI tests.

Our First UI Tests

First we will create a Xamarin UI tests you can find it in the visual studio templates as below

now that we have the ui test project layout we can view the anatomy of the solution on how it should work
before we begin it is good to know that the resources need for an initial xamarin UI test is two basic libraries
Xamarin.UITest: which contains the basic UI querying mechanisms
Xamarin.UITest.Queries; which contains the querying assisting functions like comparing and assertion helpers.
first there should be a file called appintializer which by its name should define how the apps should get initialized and initiated as below

1:  public static IApp StartApp(Platform platform)  
2:      {  
3:        if (platform == Platform.Android)  
4:        {  
5:          return ConfigureApp  
6:            .Android  
7:            .StartApp();  
8:        }  
9:        return ConfigureApp  
10:          .iOS  
11:          .StartApp();  
12:      }


but this project does not know which or what APK/IPA files he should run so obviously we will need to modify this file and here is a sample of how you can do that


 public static IApp StartApp (Platform platform, string iOSSimulator, bool resetDevice)  
           {  
                // TODO: If the iOS or Android app being tested is included in the solution   
                // then open the Unit Tests window, right click Test Apps, select Add App Project  
                // and select the app projects that should be tested.  
                if (platform == Platform.Android) {  
                     if (resetDevice) {  
                          ResetEmulator ();  
                     }  
                     return ConfigureApp  
                          .Android  
                          .ApkFile ("../../binaries/com.xamarin.samples.taskydroidnew.exampleapp.apk")  
                          .EnableLocalScreenshots ()  
                          .StartApp ();  
                } else if (platform == Platform.iOS) {  
                     if (resetDevice) {  
                          ResetSimulator (iOSSimulator);  
                     }  
                     return ConfigureApp  
                          .iOS  
                          .AppBundle ("../../binaries/TaskyiOS.app")  
                          .EnableLocalScreenshots ()  
                          .DeviceIdentifier(iOSSimulator)  
                          .StartApp ();  
                }  
                throw new ArgumentException ("Unsupported platform");  
           }

As you can  see i have added the path to all the packages for android and iOS and some additional code regarding the unsupported exception and so on.

now lets check the test class that is added by default in the project

and it should be as below

 [TestFixture(Platform.Android)]  
   [TestFixture(Platform.iOS)]  
   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.Screenshot("First screen.");  
     }  
   }

[SetUp]
the setup decorated method is the method which contains the code that should be ran before the beginning of each test

[Test]
while the test decorated method is the method running the test and in this case it is just taking a screenshot so no actual test

IApp
is the app that calls the Android/iOS APIs to check the UI

so if i run now should that UI test run ?
the answer is no, because as i said before Xamarin UI test relies on calabash, and in order to run it needs the calabash to be started on the APK/IPA file so how should this be done ?
on Android in the main activity
adding this line of code

 Xamarin.Calabash.Start();

Same as for the iOS App delegate, this will allow the Xamarin UI tests to talk to the android/iOS APIs at runtime.


now lets run and check the runing of the app, and accordingly you should see your app runing in the simulator as per the Appinitializer.cs
now lets right a sample test and figure out how we can do a small test, say a test that checks if a button with a certain name exist, we are going to see how we can query the ui of the app.

 [Test]  
 public void ButtonNamedLoginShouldExist()  
     {  
       app.WaitForElement(c => c.Marked("Login"));  
       app.Query(c => c.Marked("Login")).Length.ShouldBeGreaterThan(0);  
       app.Screenshot("Button named Login exists");  
     }

in the previous code we wait for any element marked with Login  which will get any element named login or has the text property set to login and then we query the results to make sure that the button exist
If we run app should run and we should see the test passing,  for me i am using resharper test runner,


Now that we are done with sample unit test, this concludes this part, in the next part we will take things another step further, we will talk and do things like BDD , Gherkin, Specflow.



Comments

Post a Comment

Popular posts from this blog

Xamarin Forms Core components Part 1 Dependency Service

Intro Xamarin Forms is a collection of controls that can be used and rendered on multiple platforms, and in order of them to function as they are suppose to, they do need a set of core components that defines the way these controls, in how they are created, how they are rendered to how they are used, of course every platform is different and sometimes a platform specific extra configuration is required, specially that there are so many differences between the different platforms in matter of design, user experience and operating system behavior. So one of the core components of  Xamarin  Forms is the Dependency Service, and by the name suggest it does act as the dependency resolver for all forms controls, if you are not familiar with IOC " I nversion O f C ontrol" and Dependency Injection please refer to the link for a quick intro i wrote a while ago on IOC  IOC Part 1 - Inversion of control Principle .  And as of such the Dependency Service is the concrete inboxe
Post a Comment
Read more

Xamarin Forms: XAML Creating Custom Controls The MVVM Way

Intro For a growing UI page there always comes a need to create sub views that can be used inside a bigger view, and for that we need custom controls, which are controls that are derived either from a layout or a simple view which is the basic control for almost any UI component in Xamarin forms, and therefore for a start i will use that as an example. And in such example we will create a custom control with a set of bindable properties and explain how they work, also how to add an event that can also be bound to Commands Lets Create the control  I have just went ahead and created a custom control that inherits from Xamarin.Forms.View and have some properties such color and checked all properties to be bound to by the ViewModel serving as the datacontext of the this control. here is the code below using System; using Xamarin.Forms; namespace UserControls { public class CustomView : View { public Color Color { get ; set ;
Post a Comment
Read more

Windows Phone 8 - Application bar command binding MVVM

This is a short post in which i will explain how on Windows phone 8 to bind the application bar button or menu item, first this is only a fix for the  BindableApplicationbar  which supports windows phone 7 only, i just made it support windows 8 no features added or anything. i have uploaded the dll file here so it can be accessible easily here is the link to download http://sdrv.ms/RApUal now that you got the link lets check how we gonna use it you can refer to BinableApplicationbar  or check out the code here that i actually used in my app and i already read it there !  Add a reference to the BindableApplicationBar library here is the link again  http://sdrv.ms/RApUal Add XML namespace declaration in your page's XAML: xmlns : bar ="clr-namespace:BindableApplicationBar;assembly=BindableApplicationBar" Set Bindable.ApplicationBar property on your page code as in the snippet below: < phone : PhoneApplicationPage >     …     < bar : Bindable.App
6 comments
Read more