Automating SVG controls

Jul 19, 2013 at 8:13 PM
Hi

We recently added a SVG drawing canvas to our application. I'm trying to automate a click on it and CUITe/CUIT is having a problem.

The SVG is represented on the page using tags <avg>, <g> and <tspan>. I used the custom CUITe html control and specified the tag name but the test fails and throws an error that it can not find the control. Below is the HTML and the CUiITe code that I am trying to implement. Has anyone seem this or suggest what I might be doing wrong. Also included the error message

Thanks

Jeff

CUITe Code:
CUITe_HtmlCustom canvasDiv = Get<CUITe_HtmlCustom>("TagName=avg;id=workflow-canvas");
CUITe_HtmlCustom boxThing = canvasDiv.Get<CUITe_HtmlCustom>("TagName=g;Id=node-1000");
CUITe_HtmlCustom stepSpan = boxThing.Get<CUITe_HtmlCustom>("TagName=tspan;InnerText=" + stepName);
stepSpan.Click();
HTML:
<svg id="workflow-canvas" pointer-events="all">
<defs>
<g transform="translate(35,30) scale(1)">
<g id="node-1000" class="node" data-step-id="1000" data-bind="svgCss: { selected: vm.selectedStepId() == '1000' }" pointer-events="none" transform="translate(65,155)">
<rect pointer-events="none" x="-65" y="-35" width="130" height="70">
<g class="label" pointer-events="none" transform="translate(-60,-30)">
<rect pointer-events="all" x="-5" y="-5" width="130" height="70">
<text text-anchor="left">
<tspan x="0" dy="1.2em">Initial Step</tspan>
Error Message
Test method IDIBilling.HydraTestFramework.Wackenhut_Class.Wackenhut threw exception: 
System.Exception: Test failed on step 3 - iteration 1. ---> Microsoft.VisualStudio.TestTools.UITest.Extension.UITestControlNotFoundException: The playback failed to find the control with the given search properties. Additional Details: 
TechnologyName:  'Web'
ControlType:  'Custom'
TagName:  'TagName=avg;id=workflow-canvas'
 Failed to find any control that matched the search condition ControlType='Custom' ---> System.Runtime.InteropServices.COMException: Error HRESULT E_FAIL has been returned from a call to a COM component.
Coordinator
Jul 20, 2013 at 5:09 PM
Hi, Jeff.

I noticed a typo in your test:
TagName=avg
should be:
TagName=svg

In either case, I found this post from a Microsoft Coded UI Test user asking the same question:
http://social.msdn.microsoft.com/Forums/en-US/c9581ada-1ac5-47ee-b9e1-c9696875008c/coded-ui-test-access-to-svg-control
"Coded UI Test does not support SVG"

Since CUITe is built on top of Microsoft's Coded UI Test, CUITe does not support SVG either.

Thank you.
Jul 22, 2013 at 3:16 PM
icnocop,

Thanks for seeing the error in my code. I didn't notice that..

I made an update to the code so that the tag name is correct but it is still generating the error:
Test method IDIBilling.HydraTestFramework.Wackenhut_Class.Wackenhut threw exception: 
System.Exception: Test failed on step 3 - iteration 1. ---> Microsoft.VisualStudio.TestTools.UITest.Extension.UITestControlNotFoundException: The playback failed to find the control with the given search properties. Additional Details: 
TechnologyName:  'Web'
ControlType:  'Custom'
TagName:  'TagName=svg;id=workflow-canvas'
 Failed to find any control that matched the search condition ControlType='Custom' ---> System.Runtime.InteropServices.COMException: Error HRESULT E_FAIL has been returned from a call to a COM component.
I'll contact MS and see if there are any plans to support SVG.

Jeff