From acee4bd2828e0c5248541cca28bd5d9b02bf008a Mon Sep 17 00:00:00 2001
From: blessedcoolant <54517381+blessedcoolant@users.noreply.github.com>
Date: Wed, 27 Sep 2023 04:03:14 +0530
Subject: [PATCH] fix: Always use bbox bounds for Controlnet Image (canvas)

---
 .../listeners/canvasImageToControlNet.ts      |  4 ++--
 .../features/canvas/util/getBaseLayerBlob.ts  | 24 +++++++++++--------
 2 files changed, 16 insertions(+), 12 deletions(-)

diff --git a/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/canvasImageToControlNet.ts b/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/canvasImageToControlNet.ts
index 835b8246f1..7c312b78a4 100644
--- a/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/canvasImageToControlNet.ts
+++ b/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/canvasImageToControlNet.ts
@@ -3,9 +3,9 @@ import { canvasImageToControlNet } from 'features/canvas/store/actions';
 import { getBaseLayerBlob } from 'features/canvas/util/getBaseLayerBlob';
 import { controlNetImageChanged } from 'features/controlNet/store/controlNetSlice';
 import { addToast } from 'features/system/store/systemSlice';
+import { t } from 'i18next';
 import { imagesApi } from 'services/api/endpoints/images';
 import { startAppListening } from '..';
-import { t } from 'i18next';
 
 export const addCanvasImageToControlNetListener = () => {
   startAppListening({
@@ -16,7 +16,7 @@ export const addCanvasImageToControlNetListener = () => {
 
       let blob;
       try {
-        blob = await getBaseLayerBlob(state);
+        blob = await getBaseLayerBlob(state, true);
       } catch (err) {
         log.error(String(err));
         dispatch(
diff --git a/invokeai/frontend/web/src/features/canvas/util/getBaseLayerBlob.ts b/invokeai/frontend/web/src/features/canvas/util/getBaseLayerBlob.ts
index 3667acc79b..b67789e07e 100644
--- a/invokeai/frontend/web/src/features/canvas/util/getBaseLayerBlob.ts
+++ b/invokeai/frontend/web/src/features/canvas/util/getBaseLayerBlob.ts
@@ -1,11 +1,14 @@
-import { getCanvasBaseLayer } from './konvaInstanceProvider';
 import { RootState } from 'app/store/store';
+import { getCanvasBaseLayer } from './konvaInstanceProvider';
 import { konvaNodeToBlob } from './konvaNodeToBlob';
 
 /**
  * Get the canvas base layer blob, with or without bounding box according to `shouldCropToBoundingBoxOnSave`
  */
-export const getBaseLayerBlob = async (state: RootState) => {
+export const getBaseLayerBlob = async (
+  state: RootState,
+  alwaysUseBoundingBox: boolean = false
+) => {
   const canvasBaseLayer = getCanvasBaseLayer();
 
   if (!canvasBaseLayer) {
@@ -24,14 +27,15 @@ export const getBaseLayerBlob = async (state: RootState) => {
 
   const absPos = clonedBaseLayer.getAbsolutePosition();
 
-  const boundingBox = shouldCropToBoundingBoxOnSave
-    ? {
-        x: boundingBoxCoordinates.x + absPos.x,
-        y: boundingBoxCoordinates.y + absPos.y,
-        width: boundingBoxDimensions.width,
-        height: boundingBoxDimensions.height,
-      }
-    : clonedBaseLayer.getClientRect();
+  const boundingBox =
+    shouldCropToBoundingBoxOnSave || alwaysUseBoundingBox
+      ? {
+          x: boundingBoxCoordinates.x + absPos.x,
+          y: boundingBoxCoordinates.y + absPos.y,
+          width: boundingBoxDimensions.width,
+          height: boundingBoxDimensions.height,
+        }
+      : clonedBaseLayer.getClientRect();
 
   return konvaNodeToBlob(clonedBaseLayer, boundingBox);
 };