tests: update edges tests

tests/cypress/component/1-store/edges/addEdges.cy.ts

@@ -24,7 +24,25 @@ describe('Store Action: `addEdges`', () => {
     expect(store.edges.value).to.have.length(edges.length)
   })
 
-  it('adds edges to viewpane', () => {
+  it('adds edges to view', () => {
     cy.get('.vue-flow__edge').should('have.length', edges.length)
   })
+
+  it('adds edges to DOM', () => {
+    cy.get('.vue-flow__edge').then((els) => {
+      els.each((index, edge) => {
+        const edgeId = edge.getAttribute('data-id')
+        const storedEdge = store.findEdge(edgeId)
+
+        expect(storedEdge).to.not.eq(undefined)
+        expect(storedEdge?.id).to.eq(edgeId)
+      })
+    })
+  })
+
+  it('does not add invalid edges', () => {
+    // @ts-expect-error invalid edges
+    store.addEdges([null, undefined, '', 0, false, true, {}, []])
+    expect(store.edges.value).to.have.length(edges.length)
+  })
 })

tests/cypress/component/1-store/edges/addSelectedEdges.cy.ts

@@ -20,7 +20,7 @@ describe('Store Action: `addSelectedEdges`', () => {
   })
 
   it('adds selected edges to store', () => {
-    cy.tryAssertion(() => expect(store.getSelectedEdges.value).to.have.length(randomNumber))
+    expect(store.getSelectedEdges.value).to.have.length(randomNumber)
   })
 
   it('adds `selected` class to edges', () => {
@@ -29,14 +29,14 @@ describe('Store Action: `addSelectedEdges`', () => {
         const edgeId = edge.getAttribute('data-id')
         const storedEdge = store.findEdge(edgeId!)
 
-        expect(storedEdge && isEdge(storedEdge)).to.eq(true)
+        expect(storedEdge).to.not.eq(undefined)
 
         if (index < randomNumber) {
           expect(!!storedEdge?.selected).to.eq(true)
-          cy.tryAssertion(() => expect(edge).to.have.class('selected'))
+          expect(edge).to.have.class('selected')
         } else {
           expect(!!storedEdge?.selected).to.eq(false)
-          cy.tryAssertion(() => expect(edge).to.not.have.class('selected'))
+          expect(edge).to.not.have.class('selected')
         }
       })
     })

tests/cypress/component/1-store/edges/connection.cy.ts

@@ -1,4 +1,4 @@
-import type { StartHandle } from '@vue-flow/core'
+import type { ConnectingHandle } from '@vue-flow/core'
 import { useVueFlow } from '@vue-flow/core'
 import { getElements } from '../../../utils'
 
@@ -6,12 +6,13 @@ const { nodes, edges } = getElements(2, 2)
 
 describe('Store Action: `startConnection`, `updateConnection`, `endConnection`', () => {
   const store = useVueFlow({ id: 'test' })
-  const startHandle: StartHandle = { nodeId: nodes[0].id, type: 'source', handleId: null }
+  const startHandle: ConnectingHandle = { nodeId: nodes[0].id, type: 'source', handleId: null }
 
   beforeEach(() => {
     cy.vueFlow({
       nodes,
       edges,
+      autoConnect: true,
     })
   })
 
@@ -19,9 +20,14 @@ describe('Store Action: `startConnection`, `updateConnection`, `endConnection`',
     store.startConnection(startHandle, { x: 0, y: 0 })
 
     const storedStartHandle = store.connectionStartHandle.value
-    expect(storedStartHandle?.handleId).to.equal(startHandle.handleId)
-    expect(storedStartHandle?.nodeId).to.equal(startHandle.nodeId)
-    expect(storedStartHandle?.type).to.equal(startHandle.type)
+
+    if (!storedStartHandle) {
+      throw new Error('Start handle is not found in store')
+    }
+
+    expect(storedStartHandle.handleId).to.equal(startHandle.handleId)
+    expect(storedStartHandle.nodeId).to.equal(startHandle.nodeId)
+    expect(storedStartHandle.type).to.equal(startHandle.type)
     expect(store.connectionPosition.value).to.deep.equal({ x: 0, y: 0 })
   })
 
@@ -32,7 +38,7 @@ describe('Store Action: `startConnection`, `updateConnection`, `endConnection`',
     expect(store.connectionPosition.value).to.deep.equal({ x: 100, y: 100 })
   })
 
-  it('shows connection line on viewpane', () => {
+  it('shows connection line on view', () => {
     store.startConnection(startHandle, { x: 0, y: 0 })
     store.updateConnection({ x: 100, y: 100 })
 
@@ -46,6 +52,7 @@ describe('Store Action: `startConnection`, `updateConnection`, `endConnection`',
 
     expect(store.connectionStartHandle.value).to.equal(null)
     expect(store.connectionPosition.value).to.deep.equal({ x: NaN, y: NaN })
+
     cy.viewPort().find('.vue-flow__connection').should('not.exist')
   })
 })

tests/cypress/component/1-store/edges/defaultEdgeOptions.cy.ts

@@ -36,7 +36,7 @@ describe('Default Edge Options', () => {
     cy.get('.vue-flow__edge').should('have.class', defaultEdgeOptions.class)
   })
 
-  it('does not override edge values with defaults', () => {
+  it('sets default edge options but does not overwrite options with existing values', () => {
     store.edges.value.forEach((edge) => {
       if (edge.id === 'customEdge') {
         return expect(edge.type).to.equal('custom')

tests/cypress/component/1-store/edges/findEdge.cy.ts

@@ -18,12 +18,29 @@ describe('Store Action: `findEdge`', () => {
     randomIndex = Math.floor(Math.random() * edges.length)
   })
 
-  it('finds edge in store', () => {
+  it('finds edge in store when passed a valid (string) and existing id', () => {
     const storedEdge = store.findEdge(edges[randomIndex].id)
-    expect(storedEdge?.id).to.equal(edges[randomIndex].id)
+
+    if (!storedEdge) {
+      throw new Error('Edge not found in store')
+    }
+
+    expect(storedEdge.id).to.equal(edges[randomIndex].id)
   })
 
   it('does not find edge in store when passed invalid id', () => {
-    expect(store.findEdge('-123')).to.equal(undefined)
+    expect(store.findEdge('some-invalid-id')).to.equal(undefined)
+  })
+
+  it('does not find edge in store when passed undefined', () => {
+    expect(store.findEdge(undefined)).to.equal(undefined)
+  })
+
+  it('does not find edge in store when passed empty string', () => {
+    expect(store.findEdge('')).to.equal(undefined)
+  })
+
+  it('does not find edge in store when passed number', () => {
+    expect(store.findEdge(123 as any)).to.equal(undefined)
   })
 })

tests/cypress/component/1-store/edges/removeEdges.cy.ts

@@ -5,7 +5,7 @@ const { nodes, edges } = getElements()
 
 describe('Store Action: `removeEdges`', () => {
   const store = useVueFlow({ id: 'test' })
-  let randomNumber: number
+  let deletedEdges: string[]
 
   beforeEach(() => {
     cy.vueFlow({
@@ -15,15 +15,28 @@ describe('Store Action: `removeEdges`', () => {
   })
 
   beforeEach(() => {
-    randomNumber = Math.floor(Math.random() * edges.length)
-    store.removeEdges(Array.from({ length: randomNumber }, (_, i) => edges[i].id))
+    const randomNumber = Math.floor(Math.random() * edges.length)
+    deletedEdges = Array.from({ length: randomNumber }, (_, i) => edges[i].id)
+    store.removeEdges(deletedEdges)
   })
 
   it('removes edges from store', () => {
-    expect(store.edges.value).to.have.length(edges.length - randomNumber)
+    expect(store.edges.value).to.have.length(edges.length - deletedEdges.length)
   })
 
-  it('removes edges from viewpane', () => {
-    cy.get('.vue-flow__edge').should('have.length', edges.length - randomNumber)
+  it('removes edges from view', () => {
+    cy.get('.vue-flow__edge').should('have.length', edges.length - deletedEdges.length)
+  })
+
+  it('removes edges from DOM', () => {
+    cy.get('.vue-flow__edge').then((els) => {
+      els.each((index, edge) => {
+        const edgeId = edge.getAttribute('data-id')
+        const storedEdge = store.findEdge(edgeId)
+
+        expect(deletedEdges).to.not.include(edgeId)
+        expect(storedEdge).to.not.eq(undefined)
+      })
+    })
   })
 })

tests/cypress/component/1-store/edges/removeSelectedEdges.cy.ts

@@ -36,14 +36,10 @@ describe('Store Action: `removeSelectedEdges`', () => {
 
         if (index >= randomNumber2 && index < randomNumber) {
           expect(!!storedEdge?.selected).to.eq(true)
-          cy.tryAssertion(() => {
-            expect(edge).to.have.class('selected')
-          })
+          expect(edge).to.have.class('selected')
         } else {
           expect(!!storedEdge?.selected).to.eq(false)
-          cy.tryAssertion(() => {
-            expect(edge).to.not.have.class('selected')
-          })
+          expect(edge).to.not.have.class('selected')
         }
       })
     })

tests/cypress/component/1-store/elements/removeSelectedElements.cy.ts

@@ -32,9 +32,7 @@ describe('Store Action: `removeSelectedElements`', () => {
       }, [] as Elements),
     )
 
-    await cy.tryAssertion(() => {
-      expect(store.getSelectedElements.value).to.have.length(randomNumber - randomNumber2)
-    })
+    expect(store.getSelectedElements.value).to.have.length(randomNumber - randomNumber2)
   })
 
   it('resets all selected elements in store when no argument is passed', () => {
@@ -42,8 +40,6 @@ describe('Store Action: `removeSelectedElements`', () => {
     store.addSelectedElements(Array.from({ length: randomNumber }, (_, i) => store.getElements.value[i]))
     store.removeSelectedElements()
 
-    cy.tryAssertion(() => {
-      expect(store.getSelectedElements.value).to.have.length(0)
-    })
+    expect(store.getSelectedElements.value).to.have.length(0)
   })
 })