jquery-ui
jquery-ui copied to clipboard
Resizable: Fix content shrink on resize
Fixes: #2277. This end up being a bug on "resizable", and as I have shown on the issue it's quite a weird behavior and it's not consistent across browsers.
The same bug applies to the resizable element and "alsoResize" elements, so I fixed it on both places.
Dialog widget uses "alsoResize" property to update dialog contents size (as seen on the initial issue). This PR fixes that as well.
I have added some tests for both "box-sizing: content-box" and "box-sizing: border-box".
@Daniel-Garmig do you know a way I can "MonkeyPatch" your fix on top of existing jQuery UI? We do stuff like this in our app to patch other jquery UI functions but the magic is never quite the same for all patches.
https://github.com/primefaces/primefaces/blob/master/primefaces/src/main/resources/META-INF/resources/primefaces/jquery/jquery.ui.pfextensions.js
I would like to be able to apply this patch until its accepted by jQueryUI team or (gulp) rejected.
@mgol I have changed the method to avoid using getBoundingClientRect().
Instead I get the value using parseFloat( element.css( "width" ) );, but without the scrollbars. So I disable scrollbars, get the correct computed size and set scrollbars back. (This seems kind of expensive and slow to me, but idk).
I tried to optimize it, so this calculation is only done when necessary. After a resize, width and height properties will be added as inline css to the element, so I will use those when available to avoid the expensive calculation.
I added some test for resizable elements with transform properties set. It doesn't matter after this changes but why not.
Let me know what do you think.
Changes done! @mgol Thank you for all your suggestions and comments, they were great!
Landed, thanks!
jQuery UI 1.14.1 with this change has been released.