Skip to content

Canvas mis-frames / over-zooms on workflow load (fitViewWithMenuOffset reports success before nodes are measured) #150

Description

@GMMULLER

Summary

On workflow load the canvas can be left over-zoomed / mis-framed because fitViewWithMenuOffset reports success even when React Flow has not yet measured the nodes.

The helper was rewritten on the datacatalog branch to compute the viewport manually (via the deprecated getRectOfNodes + getViewportForBounds) and now returns true unconditionally once the pane is measurable — it never checks whether the nodes have been measured. The caller's retry loop (attemptFitView in useWorkflowOperations.ts) treats a true return as "fit applied" and stops retrying. When nodes are still unmeasured (node.width/height null), the computed bounds collapse to ~0, so getViewportForBounds clamps zoom to maxZoom and bakes in an over-zoomed viewport on a degenerate point.

This is a regression versus main, where the function returned React Flow's own measurement-gated result (const fitApplied = rf.fitView(options); if (!fitApplied) return false;), so the retry loop kept retrying until nodes were measured.

Steps to Reproduce

  1. Open a workflow that has nodes (ideally a larger graph, or load over a slower connection so node measurement lags the first fit attempt).
  2. Let the canvas perform its initial fit-on-load.
  3. Observe the initial framing.

Expected Result

The canvas fits to the workflow's nodes (correctly zoomed/centered) once node dimensions are measured — the retry loop waits for measurement before settling.

Actual Result

The first fit attempt fires before nodes are measured, bounds collapse to ~0, and the viewport over-zooms (clamped to maxZoom) on a near-empty point. Because the helper returned true, the retry loop stops; the single 75 ms re-fit then clears fitViewOnLoad, foreclosing the nodesInitialized-driven recovery, so the canvas can stay mis-framed.

Environment

  • Branch: datacatalog (b6979cb)
  • Frontend: urban-workflows (local dev), Chromium-based browser
  • react-flow ^11.11.4
  • Identified via static code review (not yet runtime-reproduced).

Additional Information

  • Introduced by commit 60b6161 ("Fix menu-aware fit shifting the canvas right instead of focusing").
  • Code references:
    • utk_curio/frontend/urban-workflows/src/utils/fitViewWithMenuOffset.tsreturn true; is unconditional after the pane check; only early returns are the empty-node guard and the measurable-pane fallback. No node-measurement check.
    • utk_curio/frontend/urban-workflows/src/hooks/useWorkflowOperations.tsattemptFitView retry loop gates on the boolean return; true halts retries.
  • Suggested fix: gate the true return on node measurement (e.g. return false while any target node has null width/height, or until getNodesBounds yields non-zero dimensions) so the existing retry loop keeps working; also replace the deprecated getRectOfNodes with getNodesBounds (it logs a deprecation warning on every call, and the helper is invoked in a retry loop and on every dataset-chip focus click).
  • Not associated with any of issues Catalog page Dataset-details sidebar: blank preview and non-functional Sample-data / Close buttons #137Tech-debt: efficiency & de-duplication #147 — this is collateral canvas/UX work; needs its own fix.

Metadata

Metadata

Assignees

Labels

Type

No type

Projects

Status
Todo

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions