diff --git a/tests/cypress/component/1-store/edges/addEdges.cy.ts b/tests/cypress/component/1-store/edges/addEdges.cy.ts index 3248ff23..70df7059 100644 --- a/tests/cypress/component/1-store/edges/addEdges.cy.ts +++ b/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) + }) }) diff --git a/tests/cypress/component/1-store/edges/addSelectedEdges.cy.ts b/tests/cypress/component/1-store/edges/addSelectedEdges.cy.ts index 35b00265..cc190880 100644 --- a/tests/cypress/component/1-store/edges/addSelectedEdges.cy.ts +++ b/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') } }) }) diff --git a/tests/cypress/component/1-store/edges/connection.cy.ts b/tests/cypress/component/1-store/edges/connection.cy.ts index 02793a75..b899c48d 100644 --- a/tests/cypress/component/1-store/edges/connection.cy.ts +++ b/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') }) }) diff --git a/tests/cypress/component/1-store/edges/defaultEdgeOptions.cy.ts b/tests/cypress/component/1-store/edges/defaultEdgeOptions.cy.ts index bcdf5fac..8a71044b 100644 --- a/tests/cypress/component/1-store/edges/defaultEdgeOptions.cy.ts +++ b/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') diff --git a/tests/cypress/component/1-store/edges/findEdge.cy.ts b/tests/cypress/component/1-store/edges/findEdge.cy.ts index c3ace78b..e538b9af 100644 --- a/tests/cypress/component/1-store/edges/findEdge.cy.ts +++ b/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) }) }) diff --git a/tests/cypress/component/1-store/edges/removeEdges.cy.ts b/tests/cypress/component/1-store/edges/removeEdges.cy.ts index 37ad169b..15ff83a9 100644 --- a/tests/cypress/component/1-store/edges/removeEdges.cy.ts +++ b/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) + }) + }) }) }) diff --git a/tests/cypress/component/1-store/edges/removeSelectedEdges.cy.ts b/tests/cypress/component/1-store/edges/removeSelectedEdges.cy.ts index bcbf8f69..e832579c 100644 --- a/tests/cypress/component/1-store/edges/removeSelectedEdges.cy.ts +++ b/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') } }) }) diff --git a/tests/cypress/component/1-store/elements/removeSelectedElements.cy.ts b/tests/cypress/component/1-store/elements/removeSelectedElements.cy.ts index 6048b218..e946080c 100644 --- a/tests/cypress/component/1-store/elements/removeSelectedElements.cy.ts +++ b/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) }) })