{"id":5993,"date":"2011-10-28T02:16:00","date_gmt":"2011-10-28T02:16:00","guid":{"rendered":"https:\/\/blogs.msdn.microsoft.com\/visualstudioalm\/2011\/10\/28\/coded-ui-test-extension-for-3rd-party-controls-the-basics-explained\/"},"modified":"2022-07-27T03:10:38","modified_gmt":"2022-07-27T11:10:38","slug":"coded-ui-test-extension-for-3rd-party-controls-the-basics-explained","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/devops\/coded-ui-test-extension-for-3rd-party-controls-the-basics-explained\/","title":{"rendered":"Coded UI Test Extension for 3rd party controls – the basics explained"},"content":{"rendered":"

Having developed a 3rd party control, wonder what it takes to go from NO support to FULL<\/strong> support for Coded UI Test? How to make the UI elements testable by Coded UI Test \u2013 to be able to create automated tests from manual recording, record user actions, generate code from user actions, add custom code to UI Tests and finally run those coded UI Tests?<\/p>\n

Well it could be accomplished by step-by-step implementation with each step allowing access to rich features of Coded UI Test as shown below. All of this can be accomplished by leveraging the extension points of Coded UI Test framework.<\/p>\n

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

Fig 1: Shows four steps needed to get from NO support to FULL Coded UI support<\/p>\n

Level 1: Basic Record and Playback<\/span><\/strong><\/p>\n

Without<\/em><\/strong><\/p>\n

1. Recorder records co-ordinate clicks and does not recognize element in the UI hierarchy. As a result, tests would fail when application window is resized or when control is not in view during test run<\/p>\n

2. Validation tests on control properties is not possible as recorder does not recognize the element object<\/p>\n

\u00a0With<\/em><\/strong><\/p>\n

1. Recorder records co-ordinate click, sends a request to Technology Abstraction Layer (TAL) to identify the element from co-ordinate point. TAL retrieves element information from the appropriate plugin depending upon control support level and returns the element information to the recorder<\/p>\n

2. Navigation possible amongst siblings or parents or children<\/p>\n

3. Validation of basic control properties are now possible<\/p>\n

4. Can extend control code to get to Level 1; no plugins required<\/p>\n

\u00a0\"image\"<\/p>\n

Fig 2: Shows that Coded UI Test Builder crosshair identifies a cell inside a GridView and exposes basic cell properties if Level 1 is implemented<\/p>\n

Level 2: Rich Property Validation<\/span><\/strong><\/p>\n

Without<\/em><\/strong><\/p>\n

1. User not able to add assertion on custom properties of controls<\/p>\n

2. Playback engine would not be able to validate custom properties of controls during test run<\/p>\n

\u00a0With<\/em><\/strong><\/p>\n

1. User can add assertion on custom properties<\/p>\n

2. Playback engine validates properties during test run<\/p>\n

3. Extend PropertyProvider<\/em> and add plugin<\/p>\n

\u00a0\"image\"<\/p>\n

Fig 3: Shows how custom properties such as BackColor\/ForeColor\/BorderColor of Cell can be exposed through extension thus enabling assertion if Level 2 is implemented<\/p>\n

Level 3: Code Generation<\/span><\/strong><\/p>\n

Without<\/em><\/strong><\/p>\n

1. Objects and properties of auto-generated test code are derived from the base class of UI Test framework \u2013 UITestControl\u00a0<\/p>\n

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

Fig 4: Shows that auto-generated code on cell click is registered on default cell object – WinCell<\/p>\n

With<\/em><\/strong><\/p>\n

1. Specialized classes can be written for each control<\/p>\n

2. Auto-generated test code is more readable and maintainable<\/p>\n

3. Extend PropertyProvider<\/em> and add plugin\u00a0<\/p>\n

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

Fig 5: Shows that auto-generated code on a Cell click is registered on custom object \u2013 GridViewCellInfo if Level 3 is implemented<\/p>\n

Level 4: Intent Aware Actions<\/span><\/strong><\/p>\n

Without<\/em><\/strong><\/p>\n

1. Recorder records all mouse clicks and keyboard inputs<\/p>\n

2. Recordings not linked to control behavior<\/p>\n

3. E.g. Set \u201cTom Scott\u201d in table cell recorded as Click Cell \u2013> Click Cell (to enable editing) \u2013> Edit Text on edit box although the extra click is not relevant and final intent is to set cell value instead of text box\u00a0<\/p>\n

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

Fig 6: Set \u201cTom Scott\u201d in table cell recorded as Click Cell \u2013> Click Cell (to enable editing) \u2013> Type \u201cTom Scott\u201d in text box<\/p>\n

With<\/em><\/strong><\/p>\n

1. Recorder aggregates actions on action stack based on filter rules in Action Filter<\/p>\n

2. Can record only intended steps based on control behavior<\/p>\n

3. E.g. Set \u201cTom Scott\u201d in table cell recorded as Click Cell \u2013> Type \u201cTom Scott\u201d on cell<\/p>\n

4. Extend *ActionFilter *and add plugin\u00a0<\/p>\n

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

Fig 7: Set \u201cTom Scott\u201d in table cell recorded as Click Cell \u2013> Type \u201cTom Scott\u201d on cell if Level 4 is implemented<\/p>\n

Having added implementation for all the above levels, a control developer can claim FULL Coded UI Support. However, most Coded UI Test features could be used just by implementing Level 1.<\/p>\n","protected":false},"excerpt":{"rendered":"

Having developed a 3rd party control, wonder what it takes to go from NO support to FULL support for Coded UI Test? How to make the UI elements testable by Coded UI Test \u2013 to be able to create automated tests from manual recording, record user actions, generate code from user actions, add custom code […]<\/p>\n","protected":false},"author":103,"featured_media":45953,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[229,1,252],"tags":[],"class_list":["post-5993","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-community","category-devops","category-testing"],"acf":[],"blog_post_summary":"

Having developed a 3rd party control, wonder what it takes to go from NO support to FULL support for Coded UI Test? How to make the UI elements testable by Coded UI Test \u2013 to be able to create automated tests from manual recording, record user actions, generate code from user actions, add custom code […]<\/p>\n","_links":{"self":[{"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/posts\/5993","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\/103"}],"replies":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/comments?post=5993"}],"version-history":[{"count":0,"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/posts\/5993\/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=5993"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/categories?post=5993"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/devops\/wp-json\/wp\/v2\/tags?post=5993"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}