{"id":2923,"date":"2013-06-26T05:23:00","date_gmt":"2013-06-26T05:23:00","guid":{"rendered":"https:\/\/blogs.msdn.microsoft.com\/visualstudioalm\/2013\/06\/26\/using-coded-ui-to-test-xaml-based-windows-store-apps\/"},"modified":"2022-07-19T06:49:23","modified_gmt":"2022-07-19T14:49:23","slug":"using-coded-ui-to-test-xaml-based-windows-store-apps","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/devops\/using-coded-ui-to-test-xaml-based-windows-store-apps\/","title":{"rendered":"Using Coded UI to test XAML-based Windows Store apps"},"content":{"rendered":"<p><span style=\"font-size: small\"><span style=\"font-family: Calibri\">In the last few months since Windows 8 RTM\u2019ed, we have seen the number of apps on the Windows Store grow significantly. There are several different aspects to shipping a great app to the Store. One of these is testing your app to ensure that the bugs are flushed out and you have automated tests in place to ensure that you can make regression free enhancements to your app.<\/span><\/span><\/p>\n<p><span style=\"font-family: Calibri;font-size: small\">Visual Studio 2012 enabled <\/span><a href=\"http:\/\/msdn.microsoft.com\/en-us\/library\/hh405417.aspx\"><span style=\"color: #0563c1;font-family: Calibri;font-size: small\">Manual testing<\/span><\/a><span style=\"font-family: Calibri;font-size: small\"> and <\/span><a href=\"http:\/\/msdn.microsoft.com\/en-us\/library\/vstudio\/hh440545.aspx\"><span style=\"color: #0563c1;font-family: Calibri;font-size: small\">Unit testing for Store apps<\/span><\/a><span style=\"font-family: Calibri;font-size: small\">. In the <\/span><a href=\"http:\/\/blogs.msdn.com\/b\/visualstudioalm\/archive\/2013\/02\/02\/improvements-in-windows-store-unit-tests-test-exceptions-in-async-lamba-expressions-run-tests-on-the-ui-thread.aspx\"><span style=\"color: #0563c1;font-family: Calibri;font-size: small\">subsequent updates<\/span><\/a><span style=\"font-family: Calibri;font-size: small\">, we continued to enhance these features. Several customers were asking when Coded UI tests could be used for UI testing the Store apps and I am very happy to say that with <\/span><a href=\"http:\/\/blogs.msdn.com\/b\/somasegar\/archive\/2013\/06\/26\/visual-studio-2013-preview.aspx\"><span style=\"color: #0563c1;font-family: Calibri;font-size: small\">Visual Studio 2013 Preview<\/span><\/a><span style=\"font-size: small\"><span style=\"font-family: Calibri\">, you can now use Coded UI tests to test XAML based Windows Store apps. <\/span><\/span><\/p>\n<p><span style=\"font-size: small\"><span style=\"font-family: Calibri\">So let\u2019s take a look at what\u2019s new and different. Additional posts will come over the next few days to take you into more details. <\/span><\/span><\/p>\n<h2><span style=\"color: #2e74b5\"><span style=\"font-family: Calibri Light\">Getting Started<\/span><\/span><\/h2>\n<p><span style=\"font-size: small\"><span style=\"font-family: Calibri\">Writing a Coded UI test for XAML based Store app is super easy. When you install Visual Studio 2013 Preview on Windows 8.1, you will see a new template under the Windows Store node that lets you create Coded UI Test for your app. <\/span><\/span><\/p>\n<p><img decoding=\"async\" src=\"https:\/\/devblogs.microsoft.com\/devops\/wp-content\/uploads\/sites\/6\/2013\/06\/2474.new20project.png\" alt=\"\" border=\"0\" \/>\u00a0<\/p>\n<p><span style=\"font-size: small\"><span style=\"font-family: Calibri\"><span style=\"font-size: small\"><span style=\"font-family: Calibri\">After you create a new project, you will be shown the familiar Generate Code dialog. <\/span><\/span><\/span><\/span><\/p>\n<p><span style=\"font-size: small\"><span style=\"font-family: Calibri\"><span style=\"font-size: small\"><span style=\"font-family: Calibri\"><a href=\"https:\/\/devblogs.microsoft.com\/devops\/wp-content\/uploads\/sites\/6\/2013\/06\/3201.GenCode.png\"><img decoding=\"async\" src=\"https:\/\/devblogs.microsoft.com\/devops\/wp-content\/uploads\/sites\/6\/2013\/06\/3201.GenCode.png\" alt=\"\" border=\"0\" \/><\/a><\/span><\/span><\/span><\/span><\/p>\n<p><span style=\"font-size: small\"><span style=\"font-family: Calibri\">A few changes to note here: <\/span><\/span><\/p>\n<ol>\n<li><span style=\"font-size: small\"><span style=\"font-family: Calibri\">Options related to Recording are not seen. Recording action steps is currently not supported for Store apps. Likewise, you cannot create an action recording for Store apps using MTM and use that to build your Coded UI Test. You can however continue to use the cross-hair tool on the CUIT builder to build the UIMap and generate code for controls. You will need to manually write code to perform relevant actions on these controls.<\/span><\/span><\/li>\n<li><span style=\"font-size: small\"><span style=\"font-family: Calibri\">The option to manually edit the test is now explicit. So if you do not want to use the CUIT Builder to add controls to UIMap and generate code, you can choose this option and start hand editing your test.<\/span><\/span><\/li>\n<\/ol>\n<h2><span style=\"color: #2e74b5\"><span style=\"font-family: Calibri Light\">New specialized classes for XAML controls<\/span><\/span><\/h2>\n<p><span style=\"font-size: small\"><span style=\"font-family: Calibri\">Similar to the specialized classes that Coded UI test provides for testing WinForms\/WPF\/Web applications, we have a set of new specialized classes available that you can use for authoring the test.<\/span><\/span><\/p>\n<p><span style=\"font-size: small\"><span style=\"font-family: Calibri\">These are available under the Microsoft.VisualStudio.TestTools.UITesting.WindowsRuntimeControls namespace and all controls are prefixed with Xaml. So XamlButton, XamlList, XamlFlipView etc are the specialized classes to use. WinRT controls such as the Settings charm or the tiles on the start screen are not XAML controls. So when you generate code for tests that say, want to launch an app using the tile or test the Settings charm integration, classes under the namespace Microsoft.VisualStudio.TestTools.UITesting.DirectUIControls are your friend! <\/span><\/span><\/p>\n<p><span style=\"font-size: small\"><span style=\"font-family: Calibri\">And, the familiar Html* classes are available for testing scenarios that involve testing HTML content hosted inside a Webview control in the app.<\/span><\/span><\/p>\n<h2><span style=\"color: #2e74b5\"><span style=\"font-family: Calibri Light\">Support for Touch Gestures<\/span><\/span><\/h2>\n<p><span style=\"font-family: Calibri;font-size: small\">The store apps deliver a great experience with Touch and Coded UI test would be incomplete without supporting Touch Gestures. <\/span><a href=\"http:\/\/msdn.microsoft.com\/en-us\/library\/windows\/desktop\/dd940543(v=vs.85).aspx\"><span style=\"color: #0563c1;font-family: Calibri;font-size: small\">All touch gestures<\/span><\/a><span style=\"font-size: small\"><span style=\"font-family: Calibri\"> are supported and you can use the Microsoft.VisualStudio.TestTools.UITesting.Gesture class to write appropriate touch actions to act on controls of interest. For example, to Tap on a button, you can now write:<\/span><\/span><\/p>\n<p><span style=\"font-size: small\"><span style=\"font-family: Calibri\">Gesture.Tap(myButton);<\/span><\/span><\/p>\n<p><span style=\"font-size: small\"><span style=\"font-family: Calibri\">The cool thing is, you do not need a Touch monitor to be able to run tests that use these gestures. Gestures are simulated under the hood by sending appropriate messages to the input subsystem of the OS.<\/span><\/span><\/p>\n<p><span style=\"font-size: small\"><span style=\"font-family: Calibri\">Of course, Mouse actions are available as well. So, for e.g., Mouse.Click and Gesture.Tap would have the same effect of triggering an action on a control and you can use them interchangeably to suit the needs of your test.<\/span><\/span><\/p>\n<h2><span style=\"color: #2e74b5\"><span style=\"font-family: Calibri Light\">Launching an App<\/span><\/span><\/h2>\n<p><span style=\"font-size: small\"><span style=\"font-family: Calibri\">With the new app model introduced in Windows 8, you cannot launch a Store app using an executable path like you could in the desktop world. The same goes for launching an app via your test code. You can launch an app in two ways: <\/span><\/span><\/p>\n<ol>\n<li><span style=\"font-size: small\"><span style=\"font-family: Calibri\">By clicking \/ tapping on the app tile on start screen. Simply add the app tile as a control to the UIMap and write a Gesture.Tap or Mouse.Click action to launch the app in your test.<\/span><\/span><\/li>\n<li><span style=\"font-size: small\"><span style=\"font-family: Calibri\">By using the app Launch API. App launch API is available off the XamlWindow class and looks like the following:<\/span><\/span><\/li>\n<\/ol>\n<p><span style=\"font-size: small\"><span style=\"font-family: Calibri\">XamlWindow myAppWindow = XamlWindow.Launch(stringThatIdentifiesMyApp);<\/span><\/span><\/p>\n<p><span style=\"font-size: small\"><span style=\"font-family: Calibri\">where stringThatIdentifiesMyApp is the unique identifier that Windows uses to identify a Store app. You can obtain this string value by observing the app tile in CUIT builder and copy\/pasting the AutomationId property of the tile control, like so:<\/span><\/span><\/p>\n<p><span style=\"font-family: Calibri;font-size: small\">\u00a0<a href=\"https:\/\/devblogs.microsoft.com\/devops\/wp-content\/uploads\/sites\/6\/2013\/06\/3487.CUITBuilder.png\"><img decoding=\"async\" src=\"https:\/\/devblogs.microsoft.com\/devops\/wp-content\/uploads\/sites\/6\/2013\/06\/3487.CUITBuilder.png\" alt=\"\" border=\"0\" \/><\/a><\/span><\/p>\n<p>\u00a0<\/p>\n<h2><span style=\"color: #2e74b5\"><span style=\"font-family: Calibri Light\">Other concerns<\/span><\/span><\/h2>\n<p><span style=\"font-family: Calibri;font-size: small\">The rest of the CUIT experience stays the same and you can continue to use the features you are familiar with. For e.g., you can add assertions using the CUIT Builder, use the <\/span><a href=\"http:\/\/msdn.microsoft.com\/en-us\/library\/jj159363.aspx\"><span style=\"color: #0563c1;font-family: Calibri;font-size: small\">HTML Logs<\/span><\/a><span style=\"font-family: Calibri;font-size: small\"> for troubleshooting, the <\/span><a href=\"http:\/\/msdn.microsoft.com\/en-us\/library\/gg131072.aspx\"><span style=\"color: #0563c1;font-family: Calibri;font-size: small\">WaitFor*<\/span><\/a><span style=\"font-family: Calibri;font-size: small\"> to wait for specific events during playback, <\/span><a href=\"http:\/\/msdn.microsoft.com\/en-us\/library\/ee624082.aspx\"><span style=\"color: #0563c1;font-family: Calibri;font-size: small\">data drive your CUI test<\/span><\/a><span style=\"font-size: small\"><span style=\"font-family: Calibri\"> just the way you could do when testing desktop apps. <\/span><\/span><\/p>\n<h2><span style=\"color: #2e74b5\"><span style=\"font-family: Calibri Light\">Show me a sample<\/span><\/span><\/h2>\n<p><span style=\"font-family: Calibri;font-size: small\">First things first, <\/span><a href=\"http:\/\/windows.microsoft.com\/en-us\/windows-8\/preview\"><span style=\"color: #0563c1;font-family: Calibri;font-size: small\">install Windows 8.1 Preview<\/span><\/a><span style=\"font-family: Calibri;font-size: small\"> and <\/span><a href=\"http:\/\/go.microsoft.com\/fwlink\/?LinkId=306566\"><span style=\"color: #0563c1;font-family: Calibri;font-size: small\">VS 2013 Preview<\/span><\/a><span style=\"font-size: small\"><span style=\"font-family: Calibri\"> if you haven\u2019t already.<\/span><\/span><\/p>\n<p><span style=\"font-size: small\"><span style=\"font-family: Calibri\">For those of you that have not used Coded UI test before, or want to see these new features in action on a pre-canned test, I am attaching a sample Coded UI Test project I created for testing the multiply functionality of the calculator app that ships inbox with Windows 8.1. Just download and build the project and execute the test from Test Explorer.<\/span><\/span><\/p>\n<p><span style=\"font-family: Calibri;font-size: small\">Alternately, if you would like to do a walkthrough by creating a simple Store app and writing a Coded UI test for that sample app, <\/span><a href=\"http:\/\/msdn.microsoft.com\/en-us\/library\/dn305948(v=vs.120).aspx\"><span style=\"color: #0563c1;font-family: Calibri;font-size: small\">this msdn link<\/span><\/a><span style=\"font-size: small\"><span style=\"font-family: Calibri\"> can help you get started.<\/span><\/span><\/p>\n<h2><span style=\"color: #2e74b5\"><span style=\"font-family: Calibri Light\">Limitations<\/span><\/span><\/h2>\n<ol>\n<li><span style=\"font-size: small\"><span style=\"font-family: Calibri\">Recording of action steps and creating Coded UI test for XAML based store apps from an action recording is not supported. <\/span><\/span><\/li>\n<li><span style=\"font-size: small\"><span style=\"font-family: Calibri\">Only XAML based store apps are supported. WinJS apps cannot be tested using Coded UI.<\/span><\/span><\/li>\n<li><span style=\"font-size: small\"><span style=\"font-family: Calibri\">The functionality is only available when Visual Studio 2013 Preview is installed on Windows 8.1. The Coded UI Test template under the Windows Store node will not be seen if Visual Studio 2013 is installed on Windows 8. <\/span><\/span><\/li>\n<\/ol>\n<p><span style=\"font-size: small\"><span style=\"font-family: Calibri\">We are excited about our customers using Coded UI Test to test their XAML based store apps and look forward to hearing your feedback.<\/span><\/span><\/p>\n<p><span style=\"font-family: Calibri;font-size: small\">\u00a0<\/span><\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/wp-content\/uploads\/sites\/6\/2019\/02\/CalculatorCodedUITest.zip\">CalculatorCodedUITest.zip<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>In the last few months since Windows 8 RTM\u2019ed, we have seen the number of apps on the Windows Store grow significantly. There are several different aspects to shipping a great app to the Store. One of these is testing your app to ensure that the bugs are flushed out and you have automated tests [&hellip;]<\/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":[1,252],"tags":[],"class_list":["post-2923","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-devops","category-testing"],"acf":[],"blog_post_summary":"<p>In the last few months since Windows 8 RTM\u2019ed, we have seen the number of apps on the Windows Store grow significantly. There are several different aspects to shipping a great app to the Store. One of these is testing your app to ensure that the bugs are flushed out and you have automated tests [&hellip;]<\/p>\n","_links":{"self":[{"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/posts\/2923","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=2923"}],"version-history":[{"count":0,"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/posts\/2923\/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=2923"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/categories?post=2923"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/tags?post=2923"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}