WPF Application - Capture image of mouse hovered element in a image verification step

[Joseph]

Hello.

I need to verify that multiple elements in a WPF app are highlighted when the mouse hovers a specific WPF element. Typically, when in test recording mode, you can easily right click the element to bring up the Test Studio functions to create an image verification step of the selected element. The problem is that when I hover the element and go to right-click to capture the image of the hovered element states, the right-click removes the mouse hover applied to the element that leads to the other elements being highlighted. 

I read some other Test Studio documentation and I saw that you can upload images for use in the image verification step. The thought was that we could make our own screen grab of the desired state and upload the image file into the image verification step. The issue is that this piece of documentation is recording for a web application but my colleague and I don't have the same image preview options in our Test Studio desktop (2020.3) or VS plugin as shown in the url below. https://docs.telerik.com/devtools/teststudiodev/features/recorder/verifications/image-verification

Would someone be able to help determine how we could ensure that select WPF elements become highlighted when the mouse hovers a respective WPF element? Is this something we should consider making a coded step for?

Thank you.

[Plamen Mitrev]

Hello Joseph,

Thank you for your details explanation of the test scenario and behavior of the WPF application. I will do my best to help you automate this with Test Studio.

If I understand correctly, once you hover over a specific element in the WPF application, multiple elements' appearance is changed (they are highlighted in a way). You want to verify this changed state and you tried to do that with image verification. Let me know if anything here is not correct. 

So far, you tried to use image verification against the changed elements, but when you move the mouse away from the initial element, the changed state is reverted. The described image verification step, that you linked in your message, is applicable only for web testing and I will make sure to update that article to make this clear. Meaning that it is not possible to upload image for the image verification step.

My suggestion to automate this test scenario is to check for specific property or attribute on the changed elements that is specific to their highlighted state. It could be a border element that is now visible or has different attribute for color.

Please explore the DOM tree of the WPF application when you hover over the initial element and when you move the mouse away. Then, add wait for exists steps for all changed elements and modify the element's find expression to include the changed property or attribute. Execute the test to hover over the initial element and verify if the other elements are in the correct state.

If you experience any troubles, please share a sample WPF test, the DOM tree when you hover over the element and when you don't, and details about the current behavior, after the suggested changes.

I am certain that we can work together to find the best way to automate this test scenario, so you can continue with the test automation.

Regards,
Plamen Mitrev
Progress Telerik

[Joseph]

Thank you Plamen for the articulate response. I will be working with your suggestions to search the DOM. I appreciate it. Will report on the status later this week. I appreciate the support. Joe.

[Plamen Mitrev]

Hi Joe,

Please take your time to explore and test the suggested approach and let me know how it goes.

I remain available to continue our discussion, if you need more details or you have follow up questions. 

Regards,
Plamen Mitrev
Progress Telerik