Background: I have a website that has multiple tabs running on server B. One of these tabs contains an iframe that is loading an Angularjs based site that is running on a separate server (server A). The site refreshes sections every 10 seconds to check for changes made elsewhere. When not on that tab, I want to block these calls. I need to find a way to detect whether the page is rendered and block the calls if it is not from within the server A.
Current solution: In Firefox I have got this working using getBoundingClientRect().top on an element. The value changes when another tab is loaded so can check it and block the calls. This doesn't work in Chrome though. The value doesn't change when swapping tabs.
Does anyone have any suggestions or experience with this? Need a solution that will work in all browsers.