"Excludes the scrollbars if present" -- should this be an option? Should they be included?

[ChumpChief]

Code sample specifies that scrollbars should be excluded from the clientWidth/Height measurements. I agree this aligns better with some of the scenarios we've discussed (e.g. "is in view" checks, pseudo-device-fixed, etc.), but this is a divergence from the existing innerWidth/Height API behaviors. Probably worth soliciting input on.

[dbaron]

At the very least, it's worth being clearer that the scrollbars to be excluded are only scrollbars that are outside the panning-and-zooming area, and not those inside it.

(I got here from w3ctag/design-reviews#128 .)

[bokand]

@dbaron, just to make sure, by "outside the panning-and-zooming area" we mean the scrollbars that don't zoom or scroll with the viewport, right? i.e. The window scrollbars.

[bokand]

I've clarified the spec that we should only exclude scrollbars that are fixed to the visual viewport and also that we should exclude scrollbars that are overlay.

[bokand]

I think this would be useful as I remember running into this when writing some examples/polyfill but don't think it's necessary for V1 so I'll mark this issue as an "enhancement"

[bokand]

A use case for this is presented in #23

EDIT: Actually, I think that use case wants to use exclude the scrollbar but was just surprised it has different behavior form innerWidth.

[Helmut-Emmelmann]

In response to Bokand´s question of Apr. 22, 17 in #23: The use case is to conceptually cover the complete document by an HTML Canvas element for drawing and as optimization to actually restrict the size of the canvas to the visible part of it. (to optimize canvas size and so WebGL performance)

I agree that here it is probably sufficient to use the size excluding the scroll bars, assuming that the scroll bars are indeed solid and not partially transparent or somehow overlaying the content.

On the other hand, in this particular use case, it is no problem if the canvas is slightly larger than the visible area, because the extra part of the canvas is just invisible, covered by the scroll bars or window border etc. So my current implementation on http://taccgl.org uses window.innerWidth / Height and does not care about the scroll bars and so also avoids problems with transparent and overlaying scrollbars.

I am also experimenting with a somewhat larger canvas to avoid flickering that appears on some devices during scrolling.