httptoolkit / react-reverse-portal

React reparenting :atom_symbol: Build an element once, move it anywhere
https://httptoolkit.com
Apache License 2.0
889 stars 32 forks source link

iframes reload from source #14

Closed evanfrawley closed 4 years ago

evanfrawley commented 4 years ago

Hi! Really cool library, thanks for building it.

I've found though that if I use an iframe to render an embedded video, changing the parent will reload the embed from source each time. The actual source URL of the iframe doesn't matter. Do you have any idea why this might be the case?

pimterry commented 4 years ago

Unfortunately, this isn't a limitation of reverse portals, this is a limitation of the DOM itself: https://stackoverflow.com/a/8318401/68051.

As far as I can tell, the iframe is being moved around the DOM totally correctly, so the DOM node in the new location is the same as the old one, but iframes have unique behaviour where they reload every time they're moved in any way.

This isn't likely to be fixable, as its core browser behaviour, so the only way to move an iframe around the page without reloading is with CSS. Sorry about that! If you do find any ways to do this I'd love to hear about them. For now though, I'm going to assume this is impossible, so I'll close this issue.

evanfrawley commented 4 years ago

Thanks @pimterry for your insightful reply :) I'll keep poking around and see if I figure out something

wyhinton commented 3 years ago

@evanfrawley did you discover anything? Struggling with getting my iframes not to reload currently.

evanfrawley commented 3 years ago

@wyhinton nope, we just didn't go down this road anymore

ryanhartwig commented 6 months ago

@pimterry This is something that could definitely be included in the Important notes section of the documentation. I've spent about half a day setting up and trying to determine why this isn't working using an iframe.

pimterry commented 6 months ago

@ryanhartwig sure, good idea, I'd accept a PR for that if you're interested