Fit view on workflow load without extra.ds (#3822)

Co-authored-by: github-actions <github-actions@github.com>

src/scripts/app.ts

@@ -1069,6 +1069,13 @@ export class ComfyApp {
       ) {
         this.canvas.ds.offset = graphData.extra.ds.offset
         this.canvas.ds.scale = graphData.extra.ds.scale
+      } else {
+        // @note: Set view after the graph has been rendered once. fitView uses
+        // boundingRect on nodes to calculate the view bounds, which only become
+        // available after the first render.
+        requestAnimationFrame(() => {
+          useLitegraphService().fitView()
+        })
       }
     } catch (error) {
       useDialogService().showErrorDialog(error, {

src/scripts/defaultGraph.ts

@@ -132,7 +132,12 @@ export const defaultGraph: ComfyWorkflowJSON = {
   ],
   groups: [],
   config: {},
-  extra: {},
+  extra: {
+    ds: {
+      offset: [0, 0],
+      scale: 1
+    }
+  },
   version: 0.4
 }
 

src/services/litegraphService.ts

@@ -5,7 +5,8 @@ import {
   LGraphNode,
   LiteGraph,
   RenderShape,
-  type Vector2
+  type Vector2,
+  createBounds
 } from '@comfyorg/litegraph'
 import type {
   ISerialisableNodeInput,
@@ -651,11 +652,23 @@ export const useLitegraphService = () => {
     canvas.setDirty(true, true)
   }
 
+  function fitView() {
+    const canvas = canvasStore.canvas
+    if (!canvas) return
+
+    const bounds = createBounds(app.graph.nodes)
+    if (!bounds) return
+
+    canvas.ds.fitToBounds(bounds)
+    canvas.setDirty(true, true)
+  }
+
   return {
     registerNodeDef,
     addNodeOnGraph,
     getCanvasCenter,
     goToNode,
-    resetView
+    resetView,
+    fitView
   }
 }