Weird DOM Changes after upgrade to 7

Something has drasticaly changed in the way the 7.x version of the scheduler control get’s rendered in the DOM.

In version 6, the dxhtml divs get rendered absolutely position and sister with my tgop level root div:

/html/body/div[7]/div
body > div:nth-child(9) > div

You can see the scrollbar works perfectly when I set scrollable:

In version 7, the divs are being rendered underneath my root element here:

html body div#root div.App div.makeStyles-root-1 main.makeStyles-content-10 div.makeStyles-root-18 div.widget-box.dhx_cal_container.dhx_scheduler_timeline

You can see that instead of making the scheduler scroll, it makes it way wider than the viewport:

The only difference between the two versions is the scheduler control. I see in the source code that there is some special handling for the material skin, but I’m not using that.

Everything works fine except for scrollable.

Has anyone encountered this? I have a paid support plan from dxhtml and they haven’t responded in a week,

Hello @rmoskal,

Regarding this part:

Has anyone encountered this? I have a paid support plan from dxhtml and they haven’t responded in a week,

I can’t find any tickets from you in our support system, looks like for some reason they were lost.

Could you please contact us by the info@dhtmlx.com with your license number?

Regarding the issue as it is - there were some styling changes, but they shouldn’t affect the scheduler layout.

Could you please reproduce the issue(in the simplest way) in the snippet below:
https://snippet.dhtmlx.com/y51h972h

(open the snippet => reproduce the issue => click the “Save” button => send me the new link)?

So I will be able to research what exactly goes wrong.

Kind regards,

The issue was fixed by changing the width of the container from 100% to this: calc(100vw - 40px) cleared up the problem.