Select Item "shaking"

[acarur01]

Build SmartClient_SC_SNAPSHOT-2011-05-13
IE9, change zoom level to 150%. Click on the dropdown icon. You'll notice the list shakes.

isc.DynamicForm.create({
    width: 500,
    fields: [{
        name: "shipTo", title: "Ship to", type: "select",
        hint: "<nobr>Overnight shipping available for countries in bold</nobr>",
        valueMap: {
            "US" : "<b>United States</b>",
            "CH" : "China",
            "JA" : "<b>Japan</b>",
            "IN" : "India",
            "GM" : "Germany",
            "FR" : "France",
            "IT" : "Italy",
            "RS" : "Russia",
            "BR" : "<b>Brazil</b>",
            "CA" : "Canada",
            "MX" : "Mexico",
            "SP" : "Spain"
        },
        imageURLPrefix:"flags/16/",
        imageURLSuffix:".png",
        valueIcons: {
            "US" : "US",
            "CH" : "CH",
            "JA" : "JA",
            "IN" : "IN",
            "GM" : "GM",
            "FR" : "FR",
            "IT" : "IT",
            "RS" : "RS",
            "BR" : "BR",
            "CA" : "CA",
            "MX" : "MX",
            "SP" : "SP"
        }
    }]
});

[Isomorphic]

Wasn't able to reproduce this. Can you clarify "shakes"? Maybe a Jing video of what you're seeing would help.

[acarur01]

http://screencast.com/t/LjSLakuF

[Isomorphic]

Thanks. This isn't happening over here, but basically what we think is happening is that IE9 is reporting a size that requires scrollbars, then as soon as scrollbars are introduced, IE9 reports a size such that scrollbars are no longer required.

Since this isn't happening here, it could be a browser extension or debugging tool. But even if it's a core browser behavior, it's unlikely we'd be able to fix it pervasively (it's a native bug to do with how they implemented zoom, evidently).

[acarur01]

Its not just IE 9 - its reproduceable in IE 8 as well in another machine that has no extensions, no debugging tool.

[Isomorphic]

We were able to reproduce the problem in IE8, unfortunately, the bad news is that the reason is what we expected it would be: native sizing bugs in IE. SmartClient is not aware of the zoom and is writing out the same HTML and applying the same sizes, unfortunately, IE has a bug where it reports the sizes as 1px bigger in this particular case, leading to the previously described loop of removing and re-adding scrollbars.

If you switch on the "sizing", "redraws" and "redrawTrace" log categories and use this code you can see the whole sequence happening (the destroy() is to prevent logs growing indefinitely).

isc_DynamicForm_0.getItem("shipTo").showPickList();
isc.Timer.setTimeout(function () { 
  isc_DynamicForm_0.destroy()
}, 1000);

Removing the border on the picklist happens to correct this case.

There's really no feasible way to correct for off-by-one size reporting problems that happen at random times, with different errors at each level of zoom. Basically, for accessibility (if that's the reason for zooming) provide a skin with larger fonts and sizes, for all other users, discourage use of the built-in zoom feature.