From 3a37c4628c3d3929c8e76da7f2c718c1563c543e Mon Sep 17 00:00:00 2001 From: Brian Maxwell Date: Fri, 27 Sep 2024 16:33:00 -0400 Subject: [PATCH 1/4] removed Math.ceil call when calculating new width in resize handler --- src/controls/changeWidth.ts | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/src/controls/changeWidth.ts b/src/controls/changeWidth.ts index a00108e1212..a76e5e264ca 100644 --- a/src/controls/changeWidth.ts +++ b/src/controls/changeWidth.ts @@ -40,9 +40,8 @@ export const changeObjectWidth: TransformActionHandler = ( target.strokeWidth / (target.strokeUniform ? target.scaleX : 1), multiplier = isTransformCentered(transform) ? 2 : 1, oldWidth = target.width, - newWidth = Math.ceil( - Math.abs((localPoint.x * multiplier) / target.scaleX) - strokePadding, - ); + newWidth = + Math.abs((localPoint.x * multiplier) / target.scaleX) - strokePadding; target.set('width', Math.max(newWidth, 0)); // check against actual target width in case `newWidth` was rejected return oldWidth !== target.width; From 049d329a3b1e32315015f797dc229e638d436a8d Mon Sep 17 00:00:00 2001 From: Brian Maxwell Date: Thu, 3 Oct 2024 06:33:56 -0400 Subject: [PATCH 2/4] prevent newWidth from being less than 1 --- src/controls/changeWidth.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/controls/changeWidth.ts b/src/controls/changeWidth.ts index a76e5e264ca..3323019d7cc 100644 --- a/src/controls/changeWidth.ts +++ b/src/controls/changeWidth.ts @@ -42,7 +42,7 @@ export const changeObjectWidth: TransformActionHandler = ( oldWidth = target.width, newWidth = Math.abs((localPoint.x * multiplier) / target.scaleX) - strokePadding; - target.set('width', Math.max(newWidth, 0)); + target.set('width', Math.max(newWidth, 1)); // check against actual target width in case `newWidth` was rejected return oldWidth !== target.width; } From ff95419ae7f74054b49f10b83b2f3a813db11aaf Mon Sep 17 00:00:00 2001 From: Andrea Bogazzi Date: Thu, 3 Oct 2024 18:01:45 +0200 Subject: [PATCH 3/4] added a test for decimal --- src/controls/changeWidth.test.ts | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/src/controls/changeWidth.test.ts b/src/controls/changeWidth.test.ts index 50e9df1f92b..f5d201dead1 100644 --- a/src/controls/changeWidth.test.ts +++ b/src/controls/changeWidth.test.ts @@ -43,6 +43,15 @@ describe('changeWidth', () => { expect(target.top).toBe(0); }); + test('changeWidth changes the width with decimals', () => { + expect(target.width).toBe(100); + const changed = changeWidth(eventData, transform, 200.2, 300); + expect(changed).toBe(true); + expect(target.width).toBe(199.2); + expect(target.left).toBe(0); + expect(target.top).toBe(0); + }); + test('changeWidth does not change the width', () => { const target = new Rect({ width: 100, height: 100, canvas }); jest.spyOn(target, '_set').mockImplementation(function _set(this: Rect) { From 12b8e1a84dc706421c959a0082c36e0ee3df3e8b Mon Sep 17 00:00:00 2001 From: Andrea Bogazzi Date: Thu, 3 Oct 2024 18:04:04 +0200 Subject: [PATCH 4/4] changelog --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 61bc62800a2..817abea98ff 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,7 @@ ## [next] +- fix(Controls): changeWidth can change width with decimals [#10186](https://github.com/fabricjs/fabric.js/pull/10186) - ci(): Add some prebuilt fabric in the dist folder [#10178](https://github.com/fabricjs/fabric.js/pull/10178) ## [6.4.2]