Automating Webview control using Coded UI Test

Webview control allows you to add html content to a XAML based windows store application. As part of adding automation support for XAML based windows store applications, Coded UI Test also supports automating webview and the html content inside it.

 

Authoring on (or inside) a webview control is the same as any other control. You drag and drop the cross hair of Coded UI Test Builder on top of the control or hover the mouse cursor on the control and press Ctrl+I. The hierarchy of the html controls inside webview looks like this –

 

The top most element in the hierarchy is the XamlWindow, followed by the XamlWebView which is the webview control hosting the html content. The document and the textbox are web controls. The complete set of the web controls is documented here. On these controls you will be able to see properties like innerText and tagName which are specific to web controls.

 

Hand coding on hosted html controls will require a couple of things

1.     The XamlWebView and the HtmlDocument immediately inside it are to be always added in the hierarchy of the control.

2.     Name should always be added as a search property to the XamlWebView.

3.     If there is a HTML frame in the hierarchy, the HTMLFrame and the HTMLDocument immediately below it are to be added.

 

Sample code looks like below