PDA

View Full Version : Change in fixed table layout leads to unneeded scrollbar on array-grid



jchaffraix
12 Jul 2012, 8:32 AM
WebKit recently changed its fixed table layout algorithm to consider the cell's content-box instead of the border-box as was the case in the past. See https://bugs.webkit.org/show_bug.cgi?id=78412 and to some extend http://crbug.com/124816 (it has some reference to this bug too)

If you open http://dev.sencha.com/deploy/ext-2.3.0/examples/grid/array-grid.html in any version of Chromium above 19 (that includes the WebKit change), you will see an unneeded horizontal scrollbars.

The work-around is simple: you need to set box-sizing: border-box on your cells' style to keep the existing behavior. The following change solves the issue for me (but don't think this is a definite answer):

.x-grid3-cell {
[...]
box-sizing: border-box}

scottmartin
12 Jul 2012, 9:52 AM
Example for: ext-2.3.0

Can you verify the version of ExtJS you are using?

Scott.

jchaffraix
12 Jul 2012, 10:27 AM
> Can you verify the version of ExtJS you are using?

Note that I don't use ExtJS, I am merely reporting the issue as we keep getting them reported against Chromium and I wanted to make sure you were aware of the issue.

The people reported bugs against ExtJS 2.3.0 (http://dev.sencha.com/deploy/ext-2.3.0/examples/grid/array-grid.html) and ExtJS 3.4.0 (http://dev.sencha.com/deploy/ext-3.4.0/examples/grid/row-editor.html).

AFAICT the first link doesn't reproduce on the latest ExtJS (4.1) and I couldn't find the second link's example against ExtJS 4.1.

scottmartin
12 Jul 2012, 11:06 AM
Thank you for the report .. I will have to double check, but I believe this is a active bug for 3.4 in regards to Chrome issue.

Scott.

technospino
1 Aug 2012, 11:09 AM
This is a work around i have been using


//Issues with Grid rendering in new version of ChromeExt.grid.ColumnModel.override({
getTotalWidth:function (includeHidden) {
var off = 0;
if (!Ext.isDefined(Ext.isChrome)) {
Ext.isChrome = /\bchrome\/\b/.test(navigator.userAgent.toLowerCase());
}
;
if (Ext.isChrome) {
off = 2;
}
;
if (!this.totalWidth) {
this.totalWidth = 0;
for (var i = 0, len = this.config.length; i < len; i++) {
if (includeHidden || !this.isHidden(i)) {
this.totalWidth += this.getColumnWidth(i) + off;
}
;
}
;
}
;
return this.totalWidth;
}
});

rich02818
10 Aug 2012, 5:37 AM
@technospino is your override for v3.4 or ?

technospino
10 Aug 2012, 6:55 AM
It is for 3.4

honzakuchar
12 Aug 2012, 3:19 AM
The fix above doesn't fix it at all. Try it on this example: http://dev.sencha.com/deploy/ext-3.4.0/examples/grid/ColumnHeaderGroup.html.

But this one works perfectly (on Chrome 21) (tested on ExtJS 3.3.1)


@media screen and (-webkit-min-device-pixel-ratio:0) { .x-grid3-cell, /* normal grid cell */
.x-grid3-gcell /* grouped grid cell (esp. in head)*/
{
box-sizing: border-box;
}
}

Before applying fix:
37884

rich02818
13 Sep 2012, 6:22 AM
Thank you for the report .. I will have to double check, but I believe this is a active bug for 3.4 in regards to Chrome issue.

Scott.

What is the bug number? What build is it targeted for?

scottmartin
13 Sep 2012, 6:40 AM
Have you checked this using 3.4.1 and the latest version of Chrome?

Scott.

rich02818
13 Sep 2012, 7:17 AM
Have you checked this using 3.4.1 and the latest version of Chrome?

Scott.

Yes. There is no visible difference between 3.4.0 and 3.4.1 running from localhost. Since you have the 3.4.0 examples online you can see the problem at http://dev.sencha.com/deploy/ext-3.4.0/examples/grid/array-grid.html


(http://dev.sencha.com/deploy/ext-3.4.0/examples/grid/array-grid.html)

scottmartin
13 Sep 2012, 7:25 AM
I will talk this over with Dev and see if they have any comments as there have been several discussions about this. If it is decided, I will create a new bug report, or escalate existing.

Scott.

rich02818
13 Sep 2012, 8:27 AM
I will talk this over with Dev and see if they have any comments as there have been several discussions about this. If it is decided, I will create a new bug report, or escalate existing.

Scott.

I truly hope there isn't any question about this getting fixed...