search

ticlo / rc-dock

Dock Layout for React Component
https://ticlo.github.io/rc-dock/examples
Apache License 2.0
684 stars 96 forks source link

Iframe content is not persisting for cached tabs #221

Open adityatoshniwal opened 1 year ago

adityatoshniwal commented 1 year ago

I open a tab where are I have form. Once the form is submitted a page is loaded. But, as soon as I change the layout the tab goes blank. Edit: The tab content is an iframe. cached:true doesn't work with iframes.

adityatoshniwal commented 1 year ago

@rinick This is very urgent to us as our release is stuck because of this single issue only. We've completely ported pgAdmin(https://www.pgadmin.org/) to use rc-dock until we found this issue. Can you guide me? I can work on the fix.

agwidarsito commented 6 months ago

We have the same problem :(

adityatoshniwal commented 6 months ago

@agwidarsito I managed to get it working. Checkout - https://github.com/pgadmin-org/pgadmin4/blob/master/web/pgadmin/static/js/helpers/Layout/LayoutIframeTab.jsx

emman24 commented 5 months ago

@adityatoshniwal how you manage to fix the issue on floating tabs?

image

adityatoshniwal commented 5 months ago

@adityatoshniwal how you manage to fix the issue on floating tabs?

Hey, try setting zIndex as well along with other styles.

emman24 commented 5 months ago

@adityatoshniwal thanks a lot.

AlbinAndersson96 commented 4 months ago

@adityatoshniwal Hello!

Experiencing something similar, but not quite the same as you. When changing the layout in such a manner that it splits the DockBox, the Iframes in the tabs all completely reload, resulting in a flash of unloaded content.

Is this something that you see as well in your fixed version?

adityatoshniwal commented 4 months ago

Hi @AlbinAndersson96, Sharing the screen recording where we've used it. The SQL editor here is an iframe. https://github.com/ticlo/rc-dock/assets/31855755/25b7dcf4-61ff-42f4-8a00-d217c81e77ce

AlbinAndersson96 commented 4 months ago

Thanks for the recording @adityatoshniwal .

I've tried emulating what you guys did in our codebase, the major difference being that we use FluentUI instead of MUI, and thus have a different Portal component. It's very strange. What we're seeing is that the iframe completely reloads when the layout is modified (we can see it fetching from cache in the browser network tab), even though we're now rendering everything completely outside the dockbox.

Edit: Enabling the dock-cache combined with your fix fixed our issue! Thanks a ton for sharing it!