{"id":1473,"date":"2014-04-04T17:47:00","date_gmt":"2014-04-04T17:47:00","guid":{"rendered":"https:\/\/blogs.msdn.microsoft.com\/visualstudioalm\/2014\/04\/04\/using-coded-ui-to-test-xaml-based-windows-phone-apps\/"},"modified":"2022-07-18T00:16:33","modified_gmt":"2022-07-18T08:16:33","slug":"using-coded-ui-to-test-xaml-based-windows-phone-apps","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/devops\/using-coded-ui-to-test-xaml-based-windows-phone-apps\/","title":{"rendered":"Using Coded UI to test XAML-based Windows Phone apps"},"content":{"rendered":"

\n In order to ship a great quality app to the Store, it is essential that you test it and flush out the bugs. End to end scenario tests when automated can help you ensure that any regressions in the app are caught early. With Visual Studio 2013 Update 2, you can now write automated end-to-end tests for your app using Coded UI Test. In Visual Studio 2013, Coded UI Test support for XAML-based Windows Store apps<\/a> was enabled and the experience to use Coded UI test for Phone apps is largely the same. This post walks you through the essentials of creating a Coded UI test for your XAML-based Phone app.<\/span>\n<\/p>\n

\n Getting Started\u00a0<\/span>\n<\/p>\n

\n Writing a Coded UI test for XAML based Phone app is easy. When you install Visual Studio 2013 Update 2 RC, you will see a new template under the Windows Phone apps node that lets you create Coded UI Test for your Phone app. <\/span>\n<\/p>\n

\n \"\"<\/a><\/span>\n<\/p>\n

\n After you create a new <\/span>project, you can use the Coded UI test builder to spy on the UI controls in <\/span>your app that you want to interact with. You can also use the builder to build <\/span>a UIMap, a repository of UI controls, code for which is automatically generated <\/span>for you.<\/span>\n<\/p>\n

\n \"\"<\/a><\/span>\n<\/p>\n

Coded UI test builder <\/span>connects to a Windows Phone Blue emulator instance running on your machine. You <\/span>can start building your UIMap by dragging and dropping the cross-hair tool on<\/span>
\nthe control of interest. You can also use keyboard shortcut keys Ctrl+I (spy) and <\/span>Ctrl+Shift+I (Add to UIMap) for the same \u2013 just hover over the control of <\/span>interest in the emulator with your mouse and use the shortcut keys. \u00a0A couple of points to note:<\/span><\/p>\n

    \n
  1. If you use the cross-hair tool to spy on UI <\/span>elements that are outside of the emulator, the builder will not detect those<\/span>
    \ncontrols. It will tell you that the control co-ordinates are outside of the <\/span>emulator. <\/span><\/li>\n
  2. The builder can spy UI elements when the app is <\/span>running on the emulator. Builder cannot be used to spy UI elements when the app<\/span>
    \nis running on a physical Phone device.<\/span><\/li>\n<\/ol>\n

    If you want to author <\/span>your test from scratch and not use the builder to build a UIMap, you can choose <\/span>the option to \u2018Manually edit the test\u2019.<\/span><\/p>\n

    \n Working with UI elements of the app<\/span>\n<\/p>\n

    \n Coded UI test makes <\/span>specialized classes available so that a rich set of properties is available for <\/span>working with the UI elements. In the case of XAML apps, the specialized classes<\/span>
    for all the controls are prefixed with Xaml. XamlButton, XamlEdit, XamlList <\/span>etc., are some examples. All these classes are available under the\u00a0Microsoft.VisualStudio.TestTools.UITesting.WindowsRuntimeControls <\/span>namespace. This is the same set of classes that are available for     Coded UI test for Windows apps<\/a>.<\/span>\n<\/p>\n

    \n WebView control used to host <\/span>HTML content in a XAML app is currently not supported.<\/span>\n<\/p>\n

    \n You can also interact with Shell <\/span>controls \u2013 controls that are not XAML, but essential for testing your app E2E \u2013 <\/span>such as the tiles, confirmation dialogs, etc. These controls are provided by<\/span>
    the OS and are not XAML. These will be identified as UITestControl. The Shell <\/span>controls are identified differently than big Windows, because the UI technology <\/span>behind these controls is different on the two platforms. On big Windows, the shell <\/span>controls such as controls in the settings charm, tiles etc. are identified as a <\/span>    DirectUIControl<\/a>.<\/span>\n<\/p>\n

    \n Performing actions on UI elements<\/span>\n<\/p>\n

    \n Once you have built the UIMap to <\/span>identify UI controls, you can start writing code to act on these controls. A <\/span>series of actions will make up the scenario you want to test.<\/span>\n<\/p>\n

    \n Actions on controls can be <\/span>performed in two ways:<\/span>\n<\/p>\n

    \n 1. Touch gestures on controls: All gestures<\/a> supported by the Windows platform are supported. Gesture class exposes all the touch gestures. For e.g., to invoke a button, the action code would be Gesture.Tap(myButton);<\/span><\/span>\n<\/p>\n

    2. Properties and methods on control classes. Each <\/span>specialized control class exposes a bunch of properties and methods that you <\/span>can use to obtain information about or interact with the control. For e.g., to <\/span>input text \u201cABC\u201d in an edit control, you can use<\/span><\/p>\n

    \n myXamlEditControl.Text=\u201dABC\u201d;<\/span>\n<\/p>\n

    \n Launching an app<\/span>\n<\/p>\n

    \n Launching an app on Windows <\/span>Phone is similar to launching a Store app on big Windows<\/a>. You can launch an app in one of two ways:<\/span>\n<\/p>\n

      \n
    1. Tapping on the app tile in the apps list<\/span><\/li>\n
    2. Using the XamlWindow.Launch API. The Launch method takes <\/span>in the unique identifier for your app. Just as in big Windows, the AutomationId <\/span>for the app tile on Start screen or app item in the apps list is the unique <\/span>identifier for your app. You can obtain this string value by observing the app <\/span>tile in CUIT builder and copy\/pasting the AutomationId property of the tile<\/span>
      \ncontrol, as seen in the following screenshot:<\/span><\/li>\n<\/ol>\n

      \"\"<\/a><\/span><\/p>\n

      \n Executing Tests<\/span>\n<\/p>\n

      \n Tests can be executed <\/span>from within Visual Studio using Test Explorer or from the command-line. Coded <\/span>UI tests can be executed on the emulator or the device. When executing tests<\/span>
      from Visual Studio, use the device toolbar to specify the target device where <\/span>the tests should execute.<\/span>\n<\/p>\n

      \n \"\"\n<\/p>\n

      \n Tests can also be <\/span>executed from the command-line using vstest.console.exe. You can specify the <\/span>target device for test execution using a runsettings file.<\/span><\/span>\n<\/p>\n

      \n vstest.console.exe <\/span>\u201cpathToYourCodedUITestDll\u201d \/settings:devicetarget.runsettings<\/span>\n<\/p>\n

      \n Sample runsettings <\/span>file:<\/span>\n<\/p>\n

      \n encoding=”utf-8″?><\/span>\n<\/p>\n

      \n <\/span>\n<\/p>\n

      \n <\/span>\n<\/p>\n

      \n <\/span>\n<\/p>\n

      \n Device<\/TargetDevice><\/span>\n<\/p>\n

      \n <\/span>\n<\/p>\n

      \n <\/span>\n<\/p>\n

      <\/MSPhoneTest><\/span><\/p>\n

      <\/RunSettings><\/span><\/p>\n

      \n Data driving a Coded UI Test Method<\/span>\n<\/p>\n

      \n Once you have written a scenario test, you might <\/span>want to run the same test multiple times with different sets of data to test\u00a0<\/span>different conditions. Data-driving comes in handy for such cases. Data-driven <\/span>Coded UI tests for Windows Phone can be defined using the DataRow attribute on <\/span>a test method.<\/span>\n<\/p>\n

      \n [DataRow<\/span>(1, 2, DisplayName = “Add <\/span><\/span>positive numbers<\/span>“)]<\/span>\n<\/p>\n

      \n [DataRow<\/span>(-1, -2, DisplayName = “Add <\/span><\/span>negative numbers<\/span>“)]<\/span>\n<\/p>\n

      \n [TestMethod<\/span>]<\/span>\n<\/p>\n

      \n public void <\/span>DataDrivingDemo_MyTestMethod(int<\/span> x, int<\/span> y)<\/strong><\/span><\/span>\n<\/p>\n

      \n Data that drives your test is defined inline using <\/span>the DataRow attribute. In the above example, x and y would obtain the values of <\/span>1 and 2 respectively for the first iteration and -1 and -2 resp. for the second <\/span>iteration of the test.\u00a0\u00a0<\/span>\n<\/p>\n

      \n Differences between Coded UI for XAML-based apps for Windows and Windows Phone<\/span>\n<\/p>\n

      \n While Coded UI test <\/span>for XAML apps on big Windows and Windows Phone is largely the same in <\/span>capabilities, the table below indicates the differences between them.<\/span><\/span>\n<\/p>\n\n\n\n\n\n\n\n\n\n
      \n

      \n Feature<\/strong><\/span>\n <\/p>\n<\/td>\n

      		\n

      \n Coded\u00a0UI for apps on Windows<\/strong><\/span>\n <\/p>\n<\/td>\n

      		\n

      \n Coded\u00a0UI for apps on Windows Phone<\/strong><\/span>\n <\/p>\n<\/td>\n<\/tr>\n

      \n

      \n Target for running tests<\/span>\n <\/p>\n<\/td>\n

      		\n

      \n Local or remote computer.<\/span>\n <\/p>\n

      \n Remote computers can be specified<\/span>
      \u00a0 when running tests using the TC\/TA.<\/span>\n <\/p>\n<\/td>\n

      		\n

      \n \u00a0Emulator or Phone<\/span>\n <\/p>\n<\/td>\n<\/tr>\n

      \n

      \n Execute from the command-line<\/span>\n <\/p>\n<\/td>\n

      		\n

      \n Settings file not required to specify<\/span>
      \u00a0 target<\/span>\n <\/p>\n<\/td>\n

      		\n

      \n runsettings file required to specify<\/span>
      \u00a0 target<\/span>\n <\/p>\n<\/td>\n<\/tr>\n

      \n

      \n Specialized classes for Shell<\/span>
      \u00a0 Controls<\/span>\n <\/p>\n<\/td>\n

      		\n

      \n DirectUI class<\/span>\n <\/p>\n<\/td>\n

      		\n

      \n UITestControl class<\/span>\n <\/p>\n<\/td>\n<\/tr>\n

      \n

      \n WebView control in a XAML app<\/span>\n <\/p>\n<\/td>\n

      		\n

      \n Supported, HTML elements can be<\/span>
      \u00a0 interacted with using Html* specialized classes<\/span>\n <\/p>\n<\/td>\n

      		\n

      \n Not supported.<\/span>\n <\/p>\n<\/td>\n<\/tr>\n

      \n

      \n Execute automated tests from MTM<\/span>\n <\/p>\n<\/td>\n

      		\n

      \n Supported<\/span>\n <\/p>\n<\/td>\n

      		\n

      \n Not supported.<\/span>\n <\/p>\n<\/td>\n<\/tr>\n

      \n

      \n Data-driving tests<\/span>\n <\/p>\n<\/td>\n

      		\n

      \n Using external
      \u00a0 data-sources<\/a>, using DataSource attribute on a test method.<\/span>\n <\/p>\n<\/td>\n

      		\n

      \n Data is specified inline, using DataRow<\/span>
      \u00a0 attribute on a test method, as indicated earlier.<\/span>\n <\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

      \n \u00a0Limitations<\/span>\n<\/p>\n

      \n 1. Recording of action steps to create Coded <\/span>UI test for XAML based Phone apps is not supported.<\/span><\/span>\n<\/p>\n

      \n 2. <\/span>Only XAML based store apps are supported. Silverlight <\/span>and HTML 5 based apps cannot be tested using Coded UI.<\/span><\/span>\n<\/p>\n

      \n \u00a0\n<\/p>\n

      \n \u00a0<\/p>\n","protected":false},"excerpt":{"rendered":"

      In order to ship a great quality app to the Store, it is essential that you test it and flush out the bugs. End to end scenario tests when automated can help you ensure that any regressions in the app are caught early. With Visual Studio 2013 Update 2, you can now write automated end-to-end […]<\/p>\n","protected":false},"author":86,"featured_media":45953,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[226,1,252],"tags":[],"class_list":["post-1473","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-ci","category-devops","category-testing"],"acf":[],"blog_post_summary":"

      In order to ship a great quality app to the Store, it is essential that you test it and flush out the bugs. End to end scenario tests when automated can help you ensure that any regressions in the app are caught early. With Visual Studio 2013 Update 2, you can now write automated end-to-end […]<\/p>\n","_links":{"self":[{"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/posts\/1473","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/users\/86"}],"replies":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/comments?post=1473"}],"version-history":[{"count":0,"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/posts\/1473\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/media\/45953"}],"wp:attachment":[{"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/media?parent=1473"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/categories?post=1473"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/tags?post=1473"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}