Skip to content
This repository has been archived by the owner on Jul 28, 2018. It is now read-only.

Permanent nodes with iframes are reloaded #511

Closed
ruigomeseu opened this issue Apr 18, 2015 · 7 comments
Closed

Permanent nodes with iframes are reloaded #511

ruigomeseu opened this issue Apr 18, 2015 · 7 comments

Comments

@ruigomeseu
Copy link

I have a very simple test node with a Youtube player that should be playing throughout all pages of my website:

<body>
<div id="player" style="position:fixed; top: 0; left: 0; z-index: 1000000;" data-turbolinks-permanent>
  <iframe width="560" height="315" src="https://www.youtube.com/embed/dz2iNkqFoKo" frameborder="0" allowfullscreen></iframe>
</div>
<div>
Rest of the site
</div>
</body>

When I change pages the iframe gets reloaded, wish shouldn't happen after the #479 fix.
@ruigomeseu ruigomeseu changed the title Permanent nodes with iFrames are reloaded Permanent nodes with iframes are reloaded Apr 18, 2015
@ruigomeseu
Copy link
Author

Here's an example for the behaviour described: https://github.com/ruigomeseu/turbolinks-permanent-bug

@Thibaut
Copy link
Collaborator

Thibaut commented Apr 19, 2015

This is a limitation of iframes — both WebKit and Firefox agree that they should be reloaded when they're moved in the DOM tree:
https://bugzilla.mozilla.org/show_bug.cgi?id=254144
https://bugs.webkit.org/show_bug.cgi?id=13574

It's even part of the spec now:
web-platform-tests/wpt#1286

So unfortunately we can't fix this in Turbolinks.

@Thibaut Thibaut mentioned this issue May 9, 2015
Closed
@Thibaut Thibaut mentioned this issue Jul 20, 2015
Closed
@pbhogan
Copy link

pbhogan commented Jul 20, 2015

Why move the node at all, though? This is an obvious case where the part of the DOM being updated is not in the direct hierarchy of the permanent node and should leave the permanent node entirely untouched. The only node that should be affected is the div containing rest of the site. The fact that Turbolinks does touch the permanent node is completely unintuitive.

@Thibaut
Copy link
Collaborator

Thibaut commented Jul 20, 2015

Why move the node at all, though?

Because we're replacing a parent of the permanent node (the <body>). When that happens, we need to move the node from its old parent (which was removed from the DOM) to its new parent.

The only node that should be affected is the div containing rest of the site.

That div is the <body>. Turbolinks doesn't let you specify a custom container. If this is your use case, check out jquery-pjax.

@pbhogan
Copy link

pbhogan commented Jul 20, 2015

Can't there be a way to specify don't replace the body itself, only children that are not marked permanent? It seems like such a common use case.

@Thibaut
Copy link
Collaborator

Thibaut commented Jul 20, 2015

That would be quite complex (what if a permanent node is nested in a div that has other children, page cache would need to be re-implemented, etc.).

@pbhogan
Copy link

pbhogan commented Jul 20, 2015

No-one said it would be easy. ;)

However, I'm talking more about a specific exception for how the body node is processed optionally. I'm not fond of the inconsistency of it, but the idea that there can be a node hanging immediately off of body that can remain untouched would at least provide a solution for everyone having an issue with this. If the permanent node is deeper down the hierarchy then it would be subject to current behavior.

@ReadmeCritic ReadmeCritic mentioned this issue Feb 19, 2016
Merged
@Kukunin Kukunin mentioned this issue Jun 15, 2021
Closed
@mrrooijen mrrooijen mentioned this issue Jul 13, 2021
Merged
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@pbhogan @Thibaut @rafaelfranca @ruigomeseu