[FIXED]Temporary scrollbars affect width of resized container

[kmiyashiro]

I have a viewport with layout: fit, an hbox panel with two panels inside of it. During resizing the window smaller, horizontal and vertical scrollbars appear. Children resize themselves, but after letting go of the window the scrollbars disappear but the children are sized to leave space for it on the side.

Steps:

1. Resize browser window smaller, vertically and horizontally.
2. Let go of the browser window normally, before the scrollbars disappear
3. Scrollbars disappear, but children are not the full width of the browser window, there is space where the scrollbar used to be on the right.

Below is some sample code with different titles and no margins, but you should still see the bug. Attached are screenshots with Firefox 3.6.13, OS X 10.6. Does not happen in Chrome.

Ext.onReady(function() {
    var viewport = new Ext.container.Viewport({
        layout: 'fit',
        items: [{
            xtype: 'panel',
            title: 'HBox',
            layout: 'hbox',

            items: [{
                title: 'Stuff',
                flex: 1,
                items: [{
                    title: 'Default'
                },
                {
                    title: 'Everything but images'
                }]
            },
            {
                xtype: 'splitter',
                height: 500
            },
            {
                title: 'Other stuff',
                flex: 1,
                items: [{
                    title: 'Cookies'
                }]
            }]
        }]
    });
});

Initial:


After resizing the browser smaller:

[kmiyashiro]

Can anyone confirm this bug, or is it just my machine?

[evant]

I can confirm this, seems it only happens on FF.

[Animal]

I've committed a fix. The code to get viewport width had been changed (by me) incorrectly while looking at another layout issue. It's been reverted to how it was before.