🐛 [BUG]: VueFlow inside a modal has incorrect edge coordinates

[Eugene]

Is there an existing issue for this?

• I have searched the existing issues and this is a new bug.

Current Behavior

When VueFlow is inside a modal (i use primeVue library for this) - edges do not connect to nodes where they are supposed to (see example)

Expected Behavior

Edges should connect correctly

Steps To Reproduce

1. Create a primeVue modal
2. Put a basic VueFlow inside

Relevant log output

No response

Anything else?

a working example:
https://codesandbox.io/p/devbox/withered-snowflake-8v5c8y?file=%2Fsrc%2FApp.vue%3A40%2C12

the bug is somehow related to the modal being scaled to 1 when it appears and back to 0 when it closes.
the native html dialog doesn't have that (see example) and it works fine

[Braks]

It's not about the modal itself, it's transitions that apply transformations (such as scale-in, scale-out).
You have two options:

1. Avoid using such transitions (animations) for opening/closing a modal that shows VueFlow.
2. Call updateNodeInternals after the modal has opened to re-align edges.