tests: update tests to work with removed store property

e2e/cypress/integration/1-store/setElements.spec.ts

@@ -1,37 +1,36 @@
-import { useVueFlow, isEdge, isNode, Edge, Store, Node } from '@braks/vue-flow'
+import { useVueFlow, isEdge, isNode, Edge, Node, SetState, VueFlowStore } from '@braks/vue-flow'
 import { getElements } from '../../../../examples/src/Stress/utils'
 
 describe('test store action setElements', () => {
-  const setElements = async (store: Store) => {
+  const setElements = async (setState: SetState) => {
     const nodes: Node[] = [
       { id: '1', type: 'input', data: { label: 'Node 1' }, position: { x: 250, y: 5 } },
       { id: '2', data: { label: 'Node 2' }, position: { x: 100, y: 100 } },
     ]
     const edges: Edge[] = [{ id: 'e1-2', source: '1', target: '2', animated: true }]
-    store.setState({
+    setState({
       nodes,
       edges,
     })
   }
 
   it('sets elements', async () => {
-    const { store } = useVueFlow()
+    const { setState, nodes, edges } = useVueFlow()
-    await setElements(store)
+    await setElements(setState)
-    expect(store.nodes).to.have.length(2)
+    expect(nodes.value).to.have.length(2)
-    expect(store.edges).to.have.length(1)
+    expect(edges.value).to.have.length(1)
   })
 
   context('elements pre-set', () => {
-    let store: Store
+    let store: VueFlowStore
     beforeEach(async () => {
-      const { store: flowStore } = useVueFlow()
+      store = useVueFlow()
-      store = flowStore
+      await setElements(store.setState)
-      await setElements(store)
     })
 
     it('parses elements to flow-elements', () => {
-      store.getEdges.forEach((edge) => expect(isEdge(edge)).to.be.true)
+      store.getEdges.value.forEach((edge) => expect(isEdge(edge)).to.be.true)
-      store.getNodes.forEach((node) => expect(isNode(node)).to.be.true)
+      store.getNodes.value.forEach((node) => expect(isNode(node)).to.be.true)
     })
 
     it('parses elements to flow-elements (199 elements - stress test)', async () => {
@@ -40,49 +39,49 @@ describe('test store action setElements', () => {
         nodes,
         edges,
       })
-      store.getEdges.forEach((edge) => expect(isEdge(edge)).to.be.true)
+      store.getEdges.value.forEach((edge) => expect(isEdge(edge)).to.be.true)
-      store.getNodes.forEach((node) => expect(isNode(node)).to.be.true)
+      store.getNodes.value.forEach((node) => expect(isNode(node)).to.be.true)
     })
 
     it('has correct element ids', () => {
-      store.nodes.forEach((el) => expect(['1', '2']).to.include(el.id))
+      store.nodes.value.forEach((el) => expect(['1', '2']).to.include(el.id))
-      store.edges.forEach((el) => expect(['e1-2']).to.include(el.id))
+      store.edges.value.forEach((el) => expect(['e1-2']).to.include(el.id))
     })
 
     it('has correct element types', () => {
-      store.nodes.forEach((el) => expect(['input', 'default']).to.include(el.type))
+      store.nodes.value.forEach((el) => expect(['input', 'default']).to.include(el.type))
     })
 
     it('nodes have correct label', () => {
-      store.getNodes.forEach((el) => {
+      store.getNodes.value.forEach((el) => {
         if (el.id === '1') expect(el.data.label).to.eq('Node 1')
         else expect(el.data.label).to.eq('Node 2')
       })
     })
 
     it('nodes have correct position', () => {
-      store.getNodes.forEach((el) => {
+      store.getNodes.value.forEach((el) => {
         if (el.id === '1') expect(JSON.stringify(el.position)).to.eq(JSON.stringify({ x: 250, y: 5 }))
         else expect(JSON.stringify(el.position)).to.eq(JSON.stringify({ x: 100, y: 100 }))
       })
     })
 
     it('edge has correct target and source', () => {
-      store.getEdges.forEach((el) => {
+      store.getEdges.value.forEach((el) => {
         expect(el.source).to.eq('1')
         expect(el.target).to.eq('2')
       })
     })
 
     it('edge has correct targetnode and sourceNode', () => {
-      store.getEdges.forEach((el) => {
+      store.getEdges.value.forEach((el) => {
         expect(el.sourceNode.id).to.eq('1')
         expect(el.targetNode.id).to.eq('2')
       })
     })
 
     it('edge is animated', () => {
-      store.getEdges.forEach((el) => expect(el.animated).to.eq(true))
+      store.getEdges.value.forEach((el) => expect(el.animated).to.eq(true))
     })
   })
 })

e2e/cypress/integration/1-store/setState.spec.ts

@@ -1,19 +1,29 @@
-import { useVueFlow, State, Store } from '@braks/vue-flow'
+import { isRef } from 'vue'
+import { useVueFlow, State } from '@braks/vue-flow'
 
 describe('test store state', () => {
-  let store: Store
+  let store = useVueFlow()
 
-  const { store: initial } = useVueFlow()
+  const initial = useVueFlow({ id: 'initial' })
-  beforeEach(() => ({ store } = useVueFlow()))
+
+  beforeEach(() => (store = useVueFlow()))
 
   it('has any initial state', () => expect(store).to.exist)
 
   it('has default initial state', () => {
     Object.keys(store).forEach((state) => {
-      const storedState = store[<keyof State>state]
+      const storedState = store[<keyof State>state]?.value
-      const initialVal = initial[<keyof State>state]
+      const initialVal = initial[<keyof State>state]?.value
+
       if (state === 'initialized') return expect(storedState).to.be.true
-      expect(JSON.stringify(storedState)).to.eq(JSON.stringify(initialVal))
+
+      if (state === 'getEdgeTypes' || state === 'getNodeTypes' || state === 'nodeTypes' || state === 'edgeTypes') return
+
+      if (Array.isArray(initialVal)) return expect((storedState as any[]).length).to.eq(initialVal.length)
+
+      if (!(initialVal instanceof Function) && !isRef(initialVal)) {
+        return expect(JSON.stringify(storedState)).to.eq(JSON.stringify(initialVal))
+      }
     })
   })
 
@@ -21,14 +31,14 @@ describe('test store state', () => {
     store.setState({
       zoomOnScroll: false,
     })
-    expect(store.zoomOnScroll).to.eq(false)
+    expect(store.zoomOnScroll.value).to.eq(false)
   })
 
   it('takes initial options', () => {
-    const { store } = useVueFlow({
+    store = useVueFlow({
       zoomOnScroll: false,
     })
-    expect(store.zoomOnScroll).to.eq(false)
+    expect(store.zoomOnScroll.value).to.eq(false)
   })
 
   it('gets custom node types', () => {
@@ -41,7 +51,7 @@ describe('test store state', () => {
         },
       ],
     })
-    expect(Object.keys(store.getNodeTypes)).to.contain('custom')
+    expect(Object.keys(store.getNodeTypes.value)).to.contain('custom')
   })
 
   it('gets custom edge types', () => {
@@ -65,6 +75,6 @@ describe('test store state', () => {
         },
       ],
     })
-    expect(Object.keys(store.getEdgeTypes)).to.contain('custom')
+    expect(Object.keys(store.getEdgeTypes.value)).to.contain('custom')
   })
 })