DynamicForm filling a Window causes scrollbars to appear after window is resized

[Crack]

I have a DynamicForm that fills a Window, and when I change window's height using my mouse I get scrollbars, but only in Firefox and only in some themes:



Works correctly on: Chrome, Firefox 119 with Tahoe theme.
Doesn't work on: Firefox 119 with Enterprise Blue theme.

SmartClient version: v13.0p_2023-11-04/AllModules Development Only

Can be reproducet eg. at https://smartclient.com/smartclient/...sizeIncrease=2 by using this code:

isc.defineClass("CustomItem", "CanvasItem").addProperties({
  height: "*",
  canvasConstructor: isc.Canvas,
  canvasProperties: {
    backgroundColor: "red"
  }
});

isc.Button.create({
  title: "Show",
  click: function () {
    if (this.testWindow == null) {
      this.testWindow = isc.Window.create({
        ID: "testWindow",
        width: 420,
        height: 300,
        autoSize: true,
        autoCenter: true,
        isModal: true,
        showModalMask: true,
        canDragResize: true,
        showMinimizeButton: false,
        dismissOnEscape: true,
        items: [
          isc.DynamicForm.create({
            width: "100%",
            height: "100%",
            items: [
              {name: "item", editorType: "CustomItem"}
            ]
          })
        ]
      });
    } else {
      this.testWindow.show();
    }

    this.testWindow.bringToFront();
  }
})

[Isomorphic]

Hi Crack,

Are you able to reproduce this with nothing but the base skin (no other CSS at all) and with a correct HTML5 DOCTYPE?

Are you also testing without zoom? See this information on browser zoom bugs - browsers have some pretty bad bugs around getting sizes wrong (fractional pixels):

https://smartclient.com/smartclient-...p..browserZoom

There is also the ability to increase the "tolerance" that SmartClient has - basically allowing the browser to get the sizes wrong by a bit, and SmartClient won't show scrollbars. These can be dynamically adjusted if you still need to support the old Enterprise Blue skin and you are hitting browser bugs.

[Crack]

I'm testing it in your showcase, so I assume it's set up correctly. I did some more tests on Firefox 119:

* Windows is set to 150% scaling, zoom 100% (devicePixelRatio = 1.5) - works correctly
* Windows is set to 125% scaling, zoom 100% (devicePixelRatio = 1.25) - works correctly
* Windows is set to 100% scaling, zoom 110% (devicePixelRatio ~ 1.1) - works correctly
* Windows is set to 100% scaling, zoom 100% (devicePixelRatio = 1) - scrollbars appear (tested on three devices, Windows 10 and 11)
* Windows is set to 100% scaling, zoom 30%, 50%, 67%, 80%, 90%, 100% - scrollbars appear
* Windows is set to 150% scaling, zoom 67% (devicePixelRatio = 1) - scrollbars appear
* Linux (another device, devicePixelRatio = 1) - works correctly
* macOS (another device, devicePixelRatio = 1) - works correctly
* macOS (another device, devicePixelRatio = 2) - works correctly

So this bug appears only when devicePixelRatio is 1, which will be set when user:
* keeps zoom at default
* uses default Windows settings when attached to eg. 1920x1080 24" screen (Windows defaults to 100% scaling in that configuration)

[Isomorphic]

Thanks for the thorough testing. Oddly, the situation where you're experiencing oddities is the "normal" situation in which we don't usually have to compensate for rounding errors.

What happens for you if you increase the tolerance for browser bugs, as mentioned above?

[Crack]

I tried increasing tolerance for Window ("bodyProperties: {maxZoomOverflowError: 25, correctZoomOverflow: true}" + a separate test that sets "false"), but noting changed. I also verified that scrollbar belongs to this body: