Problem with iframe inside node

[MaxCheil]

Bug report

• Package version(s): latest

Steps to reproduce

Get an iframe with url inside all your nodes.
Get 2 panels inside your mosaic.

Actual behavior

When you switch postion between 1 to the second, the panel containing the iframe is reloaded.

Expected behavior

The first node containing also an url is not reloading.
The second node should also not be reloaded.
The second node seems to be created anew after each Dnd switching position with the first one.

Is it possible to not reload the iframa each time for the second node inside the mosaic ? It seems the second node is destroy and re-created each time we make a dnd. It is a weird behavior.

[andreas-sqsh]

Hi,

not a bug, but normal React behaviour IMO.

However, this is possible by having a secondary state that keeps a reference to a DOM node within your tile.

Then use a portal that renders your iframe to the DOM node.

https://codesandbox.io/s/2xxw57k82y?file=/src/index.js:720-732

[ggdaltoso]

Your issue might be related to this StackOverflow answer:

The _Problem:
An iframe contains a completely separate window from the parent window. When a user interacts with an iframe, the parent window no longer receives user events. The browser assumes you want1 to interact with the contents of the iframe, and ignores any draggable attributes that may be on a parent of the iframe.

A Workaround:
You could position an invisible element over the iframe to prevent the user from interacting with the iframe below. Here is an example using an absolute-positioned pseudo-element.