Flow Graph Editor: Port to ModularTool + Fluent by ryantrem · Pull Request #18478 · BabylonJS/Babylon.js

ryantrem · 2026-05-19T16:53:04Z

This PR ports Flow Graph Editor to MakeModularTool and Fluent. More details later.

…the graph canvas still uses scss

bjsplat · 2026-05-19T16:54:48Z

Please make sure to label your PR with "bug", "new feature" or "breaking change" label(s).
To prevent this PR from going to the changelog marked it with the "skip changelog" label.

bjsplat · 2026-05-19T16:54:49Z

Reviewer - this PR has made changes to one or more package.json files.

bjsplat · 2026-05-19T17:04:43Z

Please make sure to label your PR with "bug", "new feature" or "breaking change" label(s).
To prevent this PR from going to the changelog marked it with the "skip changelog" label.

bjsplat · 2026-05-19T17:04:44Z

Reviewer - this PR has made changes to one or more package.json files.

bjsplat · 2026-05-21T17:28:39Z

You have made possible changes to the playground.
You can test the snapshot here:

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/PLAYGROUND/refs/pull/18478/merge/

The snapshot playground with the CDN snapshot (only when available):

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/PLAYGROUND/refs/pull/18478/merge/?snapshot=refs/pull/18478/merge

Note that neither Babylon scenes nor textures are uploaded to the snapshot directory, so some playgrounds won't work correctly.

bjsplat · 2026-05-21T17:29:02Z

Interaction tests

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/refs/pull/18478/merge/testResults/interactionplaywright/index.html

bjsplat · 2026-05-21T17:44:38Z

🟢 Memory Leak Test Results

13 passed, 0 leaked out of 13 scenarios

🟢 All memory leak tests passed — no leaks detected.

Passed Scenarios (13)

Scenario	Package
Core Feature Stack	@babylonjs/core
Core Rendering Materials Shadows Stack	@babylonjs/core
Core Textures Render Targets PostProcess Stack	@babylonjs/core
GUI Fullscreen UI Controls	@babylonjs/gui
GUI Mesh ADT Controls	@babylonjs/gui
Loaders Boombox Import	@babylonjs/loaders
Loaders OBJ Direct Load	@babylonjs/loaders
Loaders STL Direct Load	@babylonjs/loaders
Materials Library Stack	@babylonjs/materials
Serializers glTF Export	@babylonjs/serializers
Serializers GLB Export	@babylonjs/serializers
PostProcesses Digital Rain Stack	@babylonjs/post-processes
Procedural Textures Stack	@babylonjs/procedural-textures

bjsplat · 2026-05-21T17:45:26Z

You have made possible changes to one or more graph tools. To test the snapshots:

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/TOOLS/refs/pull/18478/merge/nodeEditor/
https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/TOOLS/refs/pull/18478/merge/nodeGeometryEditor/
https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/TOOLS/refs/pull/18478/merge/nodeParticleEditor/
https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/TOOLS/refs/pull/18478/merge/nodeRenderGraphEditor/
https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/TOOLS/refs/pull/18478/merge/flowGraphEditor/
https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/TOOLS/refs/pull/18478/merge/guiEditor/

bjsplat · 2026-05-21T17:46:01Z

Visualization tests for WebGPU

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/refs/pull/18478/merge/testResults/webgpuplaywright/index.html

bjsplat · 2026-05-21T17:47:22Z

WebGL2 visualization test reporter:

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/refs/pull/18478/merge/testResults/webgl2playwright/index.html

bjsplat · 2026-05-21T17:51:47Z

⚡ Performance Test Results

🟢 All performance tests passed — no regressions detected.

bjsplat · 2026-05-21T20:40:29Z

Reviewer - this PR has made changes to one or more package.json files.

bjsplat · 2026-05-21T21:01:31Z

You have changed file(s) that made possible changes to the sandbox.
You can test the sandbox snapshot here:

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/SANDBOX/refs/pull/18478/merge/

bjsplat · 2026-05-21T21:02:34Z

You have made possible changes to the playground.
You can test the snapshot here:

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/PLAYGROUND/refs/pull/18478/merge/

The snapshot playground with the CDN snapshot (only when available):

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/PLAYGROUND/refs/pull/18478/merge/?snapshot=refs/pull/18478/merge

Note that neither Babylon scenes nor textures are uploaded to the snapshot directory, so some playgrounds won't work correctly.

bjsplat · 2026-05-21T21:02:55Z

Interaction tests

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/refs/pull/18478/merge/testResults/interactionplaywright/index.html

bjsplat · 2026-05-21T21:18:18Z

🟢 Memory Leak Test Results

13 passed, 0 leaked out of 13 scenarios

🟢 All memory leak tests passed — no leaks detected.

Passed Scenarios (13)

Scenario	Package
Core Feature Stack	@babylonjs/core
Core Rendering Materials Shadows Stack	@babylonjs/core
Core Textures Render Targets PostProcess Stack	@babylonjs/core
GUI Fullscreen UI Controls	@babylonjs/gui
GUI Mesh ADT Controls	@babylonjs/gui
Loaders Boombox Import	@babylonjs/loaders
Loaders OBJ Direct Load	@babylonjs/loaders
Loaders STL Direct Load	@babylonjs/loaders
Materials Library Stack	@babylonjs/materials
Serializers glTF Export	@babylonjs/serializers
Serializers GLB Export	@babylonjs/serializers
PostProcesses Digital Rain Stack	@babylonjs/post-processes
Procedural Textures Stack	@babylonjs/procedural-textures

bjsplat · 2026-05-21T21:20:31Z

Graph tools CI has failed you can find the test results at:

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/TOOLS/refs/pull/18478/merge/testResults/

bjsplat · 2026-05-21T21:20:38Z

Visualization tests for WebGPU

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/refs/pull/18478/merge/testResults/webgpuplaywright/index.html

bjsplat · 2026-05-21T21:20:48Z

WebGL2 visualization test reporter:

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/refs/pull/18478/merge/testResults/webgl2playwright/index.html

bjsplat · 2026-05-21T21:24:14Z

⚡ Performance Test Results

🟢 All performance tests passed — no regressions detected.

bjsplat · 2026-05-21T21:49:55Z

Reviewer - this PR has made changes to one or more package.json files.

bjsplat · 2026-05-21T22:10:00Z

You have changed file(s) that made possible changes to the sandbox.
You can test the sandbox snapshot here:

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/SANDBOX/refs/pull/18478/merge/

bjsplat · 2026-05-21T22:11:14Z

You have made possible changes to the playground.
You can test the snapshot here:

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/PLAYGROUND/refs/pull/18478/merge/

The snapshot playground with the CDN snapshot (only when available):

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/PLAYGROUND/refs/pull/18478/merge/?snapshot=refs/pull/18478/merge

Note that neither Babylon scenes nor textures are uploaded to the snapshot directory, so some playgrounds won't work correctly.

bjsplat · 2026-05-21T22:11:21Z

Interaction tests

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/refs/pull/18478/merge/testResults/interactionplaywright/index.html

bjsplat · 2026-05-21T22:27:51Z

🟢 Memory Leak Test Results

13 passed, 0 leaked out of 13 scenarios

🟢 All memory leak tests passed — no leaks detected.

Passed Scenarios (13)

Scenario	Package
Core Feature Stack	@babylonjs/core
Core Rendering Materials Shadows Stack	@babylonjs/core
Core Textures Render Targets PostProcess Stack	@babylonjs/core
GUI Fullscreen UI Controls	@babylonjs/gui
GUI Mesh ADT Controls	@babylonjs/gui
Loaders Boombox Import	@babylonjs/loaders
Loaders OBJ Direct Load	@babylonjs/loaders
Loaders STL Direct Load	@babylonjs/loaders
Materials Library Stack	@babylonjs/materials
Serializers glTF Export	@babylonjs/serializers
Serializers GLB Export	@babylonjs/serializers
PostProcesses Digital Rain Stack	@babylonjs/post-processes
Procedural Textures Stack	@babylonjs/procedural-textures

bjsplat · 2026-05-21T22:28:44Z

You have made possible changes to one or more graph tools. To test the snapshots:

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/TOOLS/refs/pull/18478/merge/nodeEditor/
https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/TOOLS/refs/pull/18478/merge/nodeGeometryEditor/
https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/TOOLS/refs/pull/18478/merge/nodeParticleEditor/
https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/TOOLS/refs/pull/18478/merge/nodeRenderGraphEditor/
https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/TOOLS/refs/pull/18478/merge/flowGraphEditor/
https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/TOOLS/refs/pull/18478/merge/guiEditor/

bjsplat · 2026-05-21T22:30:36Z

Visualization tests for WebGPU

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/refs/pull/18478/merge/testResults/webgpuplaywright/index.html

bjsplat · 2026-05-21T22:31:59Z

WebGL2 visualization test reporter:

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/refs/pull/18478/merge/testResults/webgl2playwright/index.html

bjsplat · 2026-05-21T22:40:17Z

⚡ Performance Test Results

🟢 All performance tests passed — no regressions detected.

ryantrem added 22 commits May 6, 2026 14:02

First pass

1729724

Refactor for modern popup (child window), but still use lagacy since …

6f016ba

…the graph canvas still uses scss

More Fluent components

e18f5b0

Use Fluent context menu

1e3aaa4

Remove redundant error boundary

70fed69

Variables panel more Fluent

c4e2890

Fix matrix properties

02a7050

Add missing package

4a480aa

Fluent Tooltips

0e880cb

Fluent Dialog

f95bf4e

Use useResizeHandle for consistency

414b29a

Fix childWindow regression

ec6b85c

Fix side pane size not retained on re-dock

9635bc4

Fix scene preview on side pane dock change

8443197

Move graph controls into main toolbar

f087e96

Move variables to side pane

5421b56

Stable state button width

9f473da

Small fixes

4736863

Don't delete nodes when delete key is pressed in text input fields

14ebc5b

Merge master

a78da42

ToolContext with size=small in properties pane

b1029e3

Cleanup for self review

3813d8a

ryantrem requested review from RaananW and georginahalpern May 19, 2026 16:53

ryantrem added the flow graph label May 19, 2026

Fix flow graph editor runtime regressions

c729d27

PR feedback

1cbaab3

ryantrem enabled auto-merge (squash) May 21, 2026 20:38

Add missed test file

385a478

RaananW approved these changes May 22, 2026

View reviewed changes

ryantrem merged commit e3d1bd9 into BabylonJS:master May 22, 2026
23 checks passed

Conversation

ryantrem commented May 19, 2026

Uh oh!

bjsplat commented May 19, 2026

Uh oh!

bjsplat commented May 19, 2026

Uh oh!

bjsplat commented May 19, 2026

Uh oh!

bjsplat commented May 19, 2026

Uh oh!

bjsplat commented May 21, 2026

Uh oh!

bjsplat commented May 21, 2026

Uh oh!

bjsplat commented May 21, 2026

🟢 Memory Leak Test Results

Uh oh!

bjsplat commented May 21, 2026

Uh oh!

bjsplat commented May 21, 2026

Uh oh!

bjsplat commented May 21, 2026

Uh oh!

bjsplat commented May 21, 2026

⚡ Performance Test Results

Uh oh!

bjsplat commented May 21, 2026

Uh oh!

bjsplat commented May 21, 2026

Uh oh!

bjsplat commented May 21, 2026

Uh oh!

bjsplat commented May 21, 2026

Uh oh!

bjsplat commented May 21, 2026

🟢 Memory Leak Test Results

Uh oh!

bjsplat commented May 21, 2026

Uh oh!

bjsplat commented May 21, 2026

Uh oh!

bjsplat commented May 21, 2026

Uh oh!

bjsplat commented May 21, 2026

⚡ Performance Test Results

Uh oh!

bjsplat commented May 21, 2026

Uh oh!

bjsplat commented May 21, 2026

Uh oh!

bjsplat commented May 21, 2026

Uh oh!

bjsplat commented May 21, 2026

Uh oh!

bjsplat commented May 21, 2026

🟢 Memory Leak Test Results

Uh oh!

bjsplat commented May 21, 2026

Uh oh!

bjsplat commented May 21, 2026

Uh oh!

bjsplat commented May 21, 2026

Uh oh!

bjsplat commented May 21, 2026

⚡ Performance Test Results

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants