This is a migrated thread and some comments may be shown as answers.

Checking if an element is visible on-screen

3 Answers 731 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Darren
Top achievements
Rank 1
Darren asked on 07 Dec 2015, 03:23 PM

Hello, 

What's the recommended process for checking if an element is actually visible on-screen rather than just existing somewhere in the browsers DOM? I have an application where elements are scrolled in/out of view using the Bootstrap ScrollSpy tool - http://getbootstrap.com/javascript/#scrollspy , so would like to be able to test this.

 

Thanks,

 Darren

3 Answers, 1 is accepted

Sort by
0
Accepted
Cody
Telerik team
answered on 07 Dec 2015, 07:45 PM
Hi Darren,

I'm not sure we can meet this particular need. We do have the ability to verify an element is set to be visible as shown in the attached screenshot however that verification is only verifying the visibility property of the element. If an element is marked visible but scrolled off the current window the verification will still pass but it's not actually visible on the current screen or inside the scroll window.

Using some complicated code we might be able to calculate if an element is visible or not. It would require asking the browser for the current screen coordinates of the view window whether that's a scroll window or the browser window. Then we have to ask the browser for the current screen coordinates of the target element you want to verify. Then calculate whether or not both rectangles intersect. If the two rectangles intersect then the element is visible. If they do not intersect then the element is not visible. But that is some advanced coding that may not be worth it.

One final comment would be make sure that you're not just testing the control. Generally it's not worth your time to automate something that is built into a third-party control. You or your developers have no control over the code of a third-party control so don't waste your time testing the functionality of third-party code. Even if you find a bug all you could do is report it to the third-party vendor and wait for them to fix it for you.

You're far more productive spending time automating and verifying code that you and your developers have control over. Manually test third-party controls just once or twice to make sure that they work as expected. From then on you just assume that they are working properly. They turn into a very very low risk of containing a bug in the final released product.


Regards,
Cody
Telerik
 
The New Release of Telerik Test Studio Is Here! Download, install,
and send us your feedback!
0
Darren
Top achievements
Rank 1
answered on 08 Dec 2015, 09:14 AM
Thanks Cody. I guess I'm more interested in testing that I don't make a silly mistake and somehow associate a menu item with the wrong element,  so it scrolls to the wrong part of the page rather than testing the bootstrap tool itself.
0
Cody
Telerik team
answered on 08 Dec 2015, 03:52 PM
Hello Darren,

I'm glad I could help.

Regards,
Cody
Telerik
 
The New Release of Telerik Test Studio Is Here! Download, install,
and send us your feedback!
Tags
General Discussions
Asked by
Darren
Top achievements
Rank 1
Answers by
Cody
Telerik team
Darren
Top achievements
Rank 1
Share this question
or