From 38201865127dfa3f9df4cfac5b3ba01cae3a009d Mon Sep 17 00:00:00 2001
From: L-Sun <zover.v@gmail.com>
Date: Tue, 8 Apr 2025 10:48:12 +0000
Subject: [PATCH] fix(editor): incorrect brush bound with rotation and line
 width (#11524)

This transfered PR from [BS/#9058](https://github.com/toeverything/blocksuite/pull/9058) fixes an issue where the selection rectangle of a brush element was incorrect after resizing and rotating.
---
 .../affine/model/src/elements/brush/brush.ts  |  2 +-
 tests/blocksuite/e2e/edgeless/brush.spec.ts   | 19 +++++++++++++++++++
 2 files changed, 20 insertions(+), 1 deletion(-)

diff --git a/blocksuite/affine/model/src/elements/brush/brush.ts b/blocksuite/affine/model/src/elements/brush/brush.ts
index 8c78e7238d..604e08cc33 100644
--- a/blocksuite/affine/model/src/elements/brush/brush.ts
+++ b/blocksuite/affine/model/src/elements/brush/brush.ts
@@ -130,7 +130,7 @@ export class BrushElementModel extends GfxPrimitiveElementModel<BrushProps> {
     instance['_local'].delete('commands');
   })
   @derive((lineWidth: number, instance: Instance) => {
-    const oldBound = instance.elementBound;
+    const oldBound = Bound.fromXYWH(instance.deserializedXYWH);
 
     if (
       lineWidth === instance.lineWidth ||
diff --git a/tests/blocksuite/e2e/edgeless/brush.spec.ts b/tests/blocksuite/e2e/edgeless/brush.spec.ts
index a12b3e03ba..38902071f0 100644
--- a/tests/blocksuite/e2e/edgeless/brush.spec.ts
+++ b/tests/blocksuite/e2e/edgeless/brush.spec.ts
@@ -5,6 +5,7 @@ import {
   assertEdgelessTool,
   deleteAll,
   pickColorAtPoints,
+  rotateElementByHandle,
   selectBrushColor,
   selectBrushSize,
   setEdgelessTool,
@@ -195,3 +196,21 @@ test('change brush element size by component-toolbar', async ({ page }) => {
   await updateExistedBrushElementSize(page, 1);
   await assertEdgelessSelectedRect(page, [99, 99, 102, 102]);
 });
+
+test('rotate brush element and then change size', async ({ page }) => {
+  await enterPlaygroundRoom(page);
+  await initEmptyEdgelessState(page);
+  await switchEditorMode(page);
+  await zoomResetByKeyboard(page);
+
+  const start = { x: 100, y: 100 };
+  const end = { x: 200, y: 200 };
+  await addBasicBrushElement(page, start, end);
+
+  await page.mouse.click(110, 110);
+  await rotateElementByHandle(page, 45, 'bottom-right');
+
+  // change to line width 12
+  await updateExistedBrushElementSize(page, 6);
+  await assertEdgelessSelectedRect(page, [70.8, 70.8, 158.4, 158.4]);
+});