Incorrect Positioning of floating Panel in addPanel and fromJson Methods

[nicolab28]

I am currently in the process of testing the JavaScript library using the dockview-core.esm.js module. During my testing, I encountered a bug related to the addPanel and fromJson methods.

The issue arises specifically when I utilize the attach(parent) function. In this context, the addPanel method with a specified floating position or the fromJson method fails to correctly position the panel as intended.

  const pane4 = dockview.addPanel({
    id: "panel_4",
    title: "Panel 4",
    component: "default",
    floating: { x: 222, y: 333, width: 300, height: 300 },
    // floating: true,
  });

Upon investigating, I noticed that the issue originates from the setBounds method within the Overlay class. This method retrieves the containerRect using the following line:

const containerRect = this.options.container.getBoundingClientRect();

However, the containerRect always seems to be returning values of 0, which affects the calculation of the panel's position (top and left) due to the subsequent clamp operation.

This leads to the panel consistently being positioned at 0, regardless of the intended position.

Thanks

[mathuo]

Thanks for the report.

I had a quick go at this using the plain-javascript version of dockview dockview-core but I couldn't seem to get the behaviour you are describing.

I've got a sandbox below which is a dockview-core example creating some floating and non-floating groups. Would you be able to adjust this sandbox to re-produce the error you see?

https://codesandbox.io/s/broken-tdd-7jd9v7?file=/src/app.ts

[nicolab28]

Indeed, it works!
I simply had a typo in my CSS... (100v instead of 100vw...)
Sorry for having wasted your time.
But still, thank you for your responsiveness!