fix: onLoad being triggered when elements aren't ready

Signed-off-by: Braks <78412429+bcakmakoglu@users.noreply.github.com>

src/container/VueFlow/VueFlow.vue

@@ -126,7 +126,6 @@ const init = (state: FlowState) => {
 }
 onBeforeUnmount(() => store?.$dispose())
 
-onMounted(() => {
 init(options)
 watch(elements, (val) => store.setElements(val), { flush: 'post', deep: true })
 watch(
@@ -147,7 +146,6 @@ onMounted(() => {
   },
   { flush: 'pre', deep: true },
 )
-})
 </script>
 <template>
   <div class="vue-flow">

src/container/ZoomPane/ZoomPane.vue

@@ -185,6 +185,7 @@ store.dimensions = {
 
 invoke(async () => {
   await until(() => !isNaN(width.value) && width.value > 0 && !isNaN(height.value) && height.value > 0).toBeTruthy()
+  await until(store.elements).toMatch((y) => y.length > 0)
   const instance: FlowInstance = {
     fitView: (params = { padding: 0.1 }) => fitView(params),
     zoomIn,