My ionic app provides an iframe to an ad service of different origin that loads HTML banners. When user clicks on the HTML banner it is expected to open that link in system browser. The Ad service uses window.open() and that is where following error is thrown by browser (names changed to make it simple).
Unsafe JavaScript attempt to initiate navigation for frame with URL 'http://localhost/send-money' from frame with URL 'https://sample.test.com/t17/'. The frame attempting navigation is targeting its top-level window, but is neither same-origin with its target nor has it received a user gesture.
I have whitelisted test.com in my config.xml which has allowed me to load HTML content from different origin in my ionic App's iframe. But how to permit the links from that HTML of different origin (test.com) to open in the system browser. I am looking for both Android and iOS versions, obviously.
I solved this problem by introducing sandbox attribute in the iframe element. The HTML from test.com used window.open(target) to open the link in a browser instance. There are several tokens available but the bare minimum needed were as follows to make it work on Android.
<!--incomplete line below-->
<iframe sandbox="allow-top-navigation allow-scripts allow-popups"