Iframe on iOS bugged when interacting with its content

Hey there.
I want to show some external website in one of my tabs fullscreened. This works perfectly fine so far, all works fine in the served browser and android devices as well.
On iOS however, whether i’m using UI or the new WKWebView, interactions with the page seem to be problematic.

I have some divs that are toggled in and out (using bootstraps toggle-data), and weirdly enough, sometimes it works perfectly fine, other times the page:
sometimes scrolls instantly to the top
sometimes also changes the iframes position, so i’m no longer able to scroll down the iframe, but move the whole thing up and down. i need to switch tabs back and forth to be able to scroll again.
Maybe it has something to do with the iframe changing it’s height?
All the js debugger tells me is that self.onScroll = function() is being called when it scrolls up.

Another weird thing: if i embed the page with object or embed, this doesn’t seem to be an issue. When embedding it without an iframe however (using object instead), i can’t scroll it’s content, because it’s height has no overflow (like the iframe does).
The website itself works fine in the safari without ionic around it.

Any ideas what I can do differently here? Any workarounds you could think of?


Oh, and here’s how I embed the iframe:



Quick Update:
I changed the iframes position to absolute, so I can have a good look at it’s height.
It turns out, the iframe changes it’s height from initially ~2500px and keeps it as long as the page is working - however, when I encounter the bug, it’s height is set to 599px, the viewport height. No wonder I am no longer able to scroll! Is this a browser bug or something within ionic?

I’m running into this issue as well. Were you able to find a solution?

No. People have been talking me out of using iframes or any embedded content - so no, no fix, and I wouldn’t expect it to work anytime soon. It’s considered to be bad design.