[Question] Pop-out/floating tab throws "Cannot read property getBoundingClientRect of null"

[balazs-edes-lab49]

Hello, I'm trying to use the poput/floating window. It doesn't seem to matter, but I'm triggering it like this, after ensuring there's at least 1 tab node:

model.doAction(Actions.floatTab((tabSet.getSelectedNode() as TabNode).getId()));

What I get is a quick render flash (that looks like the right component), then an error (sadly can't copy paste the text):

Could you provide any pointers on why this might be happening? Are there any conditions the tab-components should meet?

Thank you

[nealus]

looks like the layouts self ref is not defined, has the main layout rendered at this time?

[balazs-edes-lab49]

@nealus Layout is rendered in the main browser window yes. I'm actually trying to open the floating tab from a custom tabSet button added in onTabSetRender.

How does the newly opened window get access to this ref? Isn't that running in a completely different context? Can the windows communicate without a BroadcastChannel or similar alternative?

I'm running this in Chrome, and only Chrome, if that matters.

[nealus]

do popouts in the demo work for you? https://rawgit.com/caplin/FlexLayout/demos/demos/v0.5/demo/index.html

[balazs-edes-lab49]

It does indeed, that's where we got the idea to include this feature :) Do you have any error boundaries or catches that could maybe hide if our code throws? I'm gonna spend more time debugging this and let you know if I find the solution. Any pointers on where you'd start is appreciated!

[nealus]

FloatingWindowTab does have an error boundary

The popout windows use portals, see: https://medium.com/hackernoon/using-a-react-16-portal-to-do-something-cool-2a2d627b0202