Skip to content

fix(flow): rerender connectors on expand nodes#170

Open
nandanmen wants to merge 13 commits intocloudflare:mainfrom
nandanmen:flow/connector-rerender
Open

fix(flow): rerender connectors on expand nodes#170
nandanmen wants to merge 13 commits intocloudflare:mainfrom
nandanmen:flow/connector-rerender

Conversation

@nandanmen
Copy link
Contributor

@nandanmen nandanmen commented Mar 3, 2026

Summary

This PR fixes a bug where connectors won't update when the size of a node changes (e.g. when we have an expandable component).

CleanShot.2026-03-03.at.10.38.07-converted.mp4
  • Add ResizeObserver to FlowNode and FlowParallelNode so connector paths update when a node's size changes without the Flow component itself re-rendering (e.g. an expandable render-prop child toggling its own state)
  • Switch measurement effects from useEffect to useLayoutEffect to avoid a stale-paint frame between DOM resize and connector recomputation
  • Add three new browser test specs: expandable node connector updates, parallel group with no preceding node, and parallel group with no following node

Test plan

New browser tests in flow.browser.test.tsx:

Test Asserts
updates connectors when an expandable node changes size After expanding a node inside a parallel group, connector paths update to match the new node position
does not render incoming connectors when there is no node before a parallel group A leading Flow.Parallel produces no incoming connector paths to its branches
does not render outgoing connectors when there is no node after a parallel group A trailing Flow.Parallel produces no outgoing connector paths from its branches

nandanmen added 13 commits March 2, 2026 11:49
- Upgrade vitest, @vitest/ui from ^3.2.4 to ^4.0.18 in pnpm catalog
- Remove @vitest/browser (replaced by vitest/browser in v4)
- Add @vitest/browser-playwright, vitest-browser-react, @vitejs/plugin-react
- Add vitest.browser.config.ts with Playwright provider and Tailwind plugin
- Add tests/setup-browser.css to load kumo styles in browser tests
- Add test:browser script scoped to *.browser.test.tsx files
- Upgrade vitest, @vitest/ui from ^3.2.4 to ^4.0.18 in pnpm catalog
- Remove @vitest/browser (replaced by vitest/browser in v4)
- Add @vitest/browser-playwright, vitest-browser-react, @vitejs/plugin-react
- Add vitest.browser.config.ts with Playwright provider and Tailwind plugin
- Add tests/setup-browser.css to load kumo styles in browser tests
- Add test:browser script scoped to *.browser.test.tsx files
- Exclude *.browser.test.tsx from unit test project
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant