From 14065dc23bb453b6c30138f225c9db728dd7e455 Mon Sep 17 00:00:00 2001 From: Kris Borchers Date: Tue, 15 Oct 2013 21:40:49 -0500 Subject: [PATCH] Resizable: Store size based on calculated helper size to prevent 1 pixel shifts. Fixes #9547 - Resizable: off-by-one pixel dimensions with helper and grid --- tests/unit/resizable/resizable_core.js | 15 +++++++++++++++ ui/jquery.ui.resizable.js | 2 +- 2 files changed, 16 insertions(+), 1 deletion(-) diff --git a/tests/unit/resizable/resizable_core.js b/tests/unit/resizable/resizable_core.js index 4cffea185..b02e8b4f1 100644 --- a/tests/unit/resizable/resizable_core.js +++ b/tests/unit/resizable/resizable_core.js @@ -191,4 +191,19 @@ test("resizable accounts for scroll position correctly (#3815)", function() { equal( el.css("top"), top, "css('top') stays the same when resized" ); }); +test( "resizable stores correct size when using helper and grid (#9547)", function() { + expect( 2 ); + + var handle = ".ui-resizable-se", + target = $( "#resizable1" ).resizable({ + handles: "all", + helper: "ui-resizable-helper", + grid: [ 10, 10 ] + }); + + TestHelpers.resizable.drag( handle, 1, 1 ); + equal( target.width(), 100, "compare width" ); + equal( target.height(), 100, "compare height" ); +}); + })(jQuery); diff --git a/ui/jquery.ui.resizable.js b/ui/jquery.ui.resizable.js index aab93b57f..f683e6b65 100644 --- a/ui/jquery.ui.resizable.js +++ b/ui/jquery.ui.resizable.js @@ -316,7 +316,7 @@ $.widget("ui.resizable", $.ui.mouse, { //Store needed variables this.offset = this.helper.offset(); this.position = { left: curleft, top: curtop }; - this.size = this._helper ? { width: el.outerWidth(), height: el.outerHeight() } : { width: el.width(), height: el.height() }; + this.size = this._helper ? { width: this.helper.width(), height: this.helper.height() } : { width: el.width(), height: el.height() }; this.originalSize = this._helper ? { width: el.outerWidth(), height: el.outerHeight() } : { width: el.width(), height: el.height() }; this.originalPosition = { left: curleft, top: curtop }; this.sizeDiff = { width: el.outerWidth() - el.width(), height: el.outerHeight() - el.height() };