diff --git a/packages/core/src/components/Nodes/NodeWrapper.vue b/packages/core/src/components/Nodes/NodeWrapper.vue index c95a27e0..b990c43c 100644 --- a/packages/core/src/components/Nodes/NodeWrapper.vue +++ b/packages/core/src/components/Nodes/NodeWrapper.vue @@ -17,8 +17,6 @@ const { id, type, name, draggable, selectable, connectable, ...props } = defineP resizeObserver: ResizeObserver }>() -const nodeEmits = defineEmits(['ready']) - provide(NodeId, id) const { @@ -95,7 +93,6 @@ updatePosition( onMounted(() => { props.resizeObserver.observe(nodeElement.value) - nodeEmits('ready') }) onBeforeUnmount(() => { diff --git a/packages/core/src/container/NodeRenderer/NodeRenderer.vue b/packages/core/src/container/NodeRenderer/NodeRenderer.vue index 3c5e813f..f06011a2 100644 --- a/packages/core/src/container/NodeRenderer/NodeRenderer.vue +++ b/packages/core/src/container/NodeRenderer/NodeRenderer.vue @@ -18,12 +18,32 @@ const connectable = (c?: HandleConnectable) => (typeof c === 'undefined' ? nodes const resizeObserver = ref() onMounted(() => { + const readyNodes = [] + let initialized = false + + const isReady = (id: string) => { + readyNodes.push(id) + + if (readyNodes.length === getNodes.length) { + nextTick(() => { + initialized = true + emits.nodesInitialized() + }) + } + } + resizeObserver.value = new ResizeObserver((entries) => { - const updates = entries.map((entry: ResizeObserverEntry) => ({ - id: entry.target.getAttribute('data-id') as string, - nodeElement: entry.target as HTMLDivElement, - forceUpdate: true, - })) + const updates = entries.map((entry: ResizeObserverEntry) => { + const id = entry.target.getAttribute('data-id') as string + // if nodes initialized hasn't been emitted yet, add the node to the readyNodes array + if (!initialized) isReady(id) + + return { + id, + nodeElement: entry.target as HTMLDivElement, + forceUpdate: true, + } + }) updateNodeDimensions(updates) }) @@ -54,14 +74,6 @@ const getType = (type?: string, template?: GraphNode['template']) => { return slot } - -const readyNodes = [] -const isReady = (id: string) => { - readyNodes.push(id) - if (readyNodes.length === getNodes.length) { - emits.nodesInitialized() - } -}