Width and height functions are no longer symmetric for scrollable elements since 3.2.0
Description
In jQuery 3.0.0 the width and height functions were changed to respect things like css zoom. This change ended up being reverted in 3.1.0. https://github.com/jquery/jquery/issues/3193 One of the reason it was reverted was that it broke the symmetry of the API.
Then in 3.2.0 the width and height functions were changed to return the width/height without scrollbars (clientWidth/clientHeight). This too has broken the symmetry of the API: https://jsfiddle.net/JoolsCaesar/r0vxq926/ Note: I'm seeing this behaviour in Chrome, IE, Edge and Opera but not Firefox
Is this a bug? If it's an intentional change it might be worth adding something to the documentation as there's no mention of scrollbars in the width and height API and people might assume that these function still work as symmetric getters and setters. It also seems a little odd that this is no longer consistent across browsers.
Is there a way to get the old value? Previously I would call $elem.width() if I wanted the width ignoring scrollbars and $elem[0].clientWidth to get the width taking scrollbars into account. Now they both do the same thing and I'd like to know how to get at the former.
Also the API (http://api.jquery.com/width/) states:
Note that .width() will always return the content width, regardless of the value of the CSS box-sizing property.
That doesn't seem to be true, because setting box-sizing to border-box causes it to ignore the scrollbars, essentially reverting to the old behaviour: https://jsfiddle.net/JoolsCaesar/r0vxq926/5/
Link to test case
New asymmetric API: https://jsfiddle.net/JoolsCaesar/r0vxq926/ Old behaviour (jQuery 3.1.1): https://jsfiddle.net/JoolsCaesar/r0vxq926/1
Source: jquery/jquery