tests: use timeout to avoid cli run fails

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

@@ -1,4 +1,4 @@
-import { isEdge, useVueFlow } from '@vue-flow/core'
+import { useVueFlow } from '@vue-flow/core'
 import { getElements } from '../../../utils'
 
 const { nodes, edges } = getElements()
@@ -24,21 +24,24 @@ describe('Store Action: `addSelectedEdges`', () => {
   })
 
   it('adds `selected` class to edges', () => {
-    cy.get('.vue-flow__edge').then((els) => {
-      els.each((index, edge) => {
-        const edgeId = edge.getAttribute('data-id')
-        const storedEdge = store.findEdge(edgeId!)
+    // todo: can we avoid the timeout? without it, the test fails in ci
+    setTimeout(() => {
+      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).to.not.eq(undefined)
 
-        if (index < randomNumber) {
-          expect(!!storedEdge?.selected).to.eq(true)
-          expect(edge).to.have.class('selected')
-        } else {
-          expect(!!storedEdge?.selected).to.eq(false)
-          expect(edge).to.not.have.class('selected')
-        }
+          if (index < randomNumber) {
+            expect(!!storedEdge?.selected).to.eq(true)
+            expect(edge).to.have.class('selected')
+          } else {
+            expect(!!storedEdge?.selected).to.eq(false)
+            expect(edge).to.not.have.class('selected')
+          }
+        })
       })
-    })
+    }, 1)
   })
 })

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

@@ -29,14 +29,17 @@ describe('Store Action: `removeEdges`', () => {
   })
 
   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)
+    // todo: can we avoid the timeout? without it, the test fails in ci
+    setTimeout(() => {
+      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)
+          expect(deletedEdges).to.not.include(edgeId)
+          expect(storedEdge).to.not.eq(undefined)
+        })
       })
-    })
+    }, 1)
   })
 })

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

@@ -27,21 +27,24 @@ describe('Store Action: `removeSelectedEdges`', () => {
   })
 
   it('removes `selected` class from edges', () => {
-    cy.get('.vue-flow__edge').then((els) => {
-      els.each((index, edge) => {
-        const edgeId = edge.getAttribute('data-id')
-        const storedEdge = store.findEdge(edgeId!)
+    // todo: can we avoid the timeout? without it, the test fails in ci
+    setTimeout(() => {
+      cy.get('.vue-flow__edge').then((els) => {
+        els.each((index, edge) => {
+          const edgeId = edge.getAttribute('data-id')
+          const storedEdge = store.findEdge(edgeId!)
 
-        expect(storedEdge && isEdge(storedEdge)).to.eq(true)
+          expect(storedEdge && isEdge(storedEdge)).to.eq(true)
 
-        if (index >= randomNumber2 && index < randomNumber) {
-          expect(!!storedEdge?.selected).to.eq(true)
-          expect(edge).to.have.class('selected')
-        } else {
-          expect(!!storedEdge?.selected).to.eq(false)
-          expect(edge).to.not.have.class('selected')
-        }
+          if (index >= randomNumber2 && index < randomNumber) {
+            expect(!!storedEdge?.selected).to.eq(true)
+            expect(edge).to.have.class('selected')
+          } else {
+            expect(!!storedEdge?.selected).to.eq(false)
+            expect(edge).to.not.have.class('selected')
+          }
+        })
       })
-    })
+    }, 1)
   })
 })

tests/cypress/component/1-store/nodes/addSelectedNodes.cy.ts

@@ -24,21 +24,24 @@ describe('Store Action: `addSelectedNodes`', () => {
   })
 
   it('adds `selected` class to nodes', () => {
-    cy.get('.vue-flow__node').then((els) => {
-      els.each((index, node) => {
-        const nodeId = node.getAttribute('data-id')
-        const storedNode = store.findNode(nodeId!)
+    // todo: can we avoid the timeout? without it, the test fails in ci
+    setTimeout(() => {
+      cy.get('.vue-flow__node').then((els) => {
+        els.each((index, node) => {
+          const nodeId = node.getAttribute('data-id')
+          const storedNode = store.findNode(nodeId!)
 
-        expect(storedNode && isNode(storedNode)).to.eq(true)
+          expect(storedNode && isNode(storedNode)).to.eq(true)
 
-        if (index < randomNumber) {
-          expect(!!storedNode?.selected).to.eq(true)
-          expect(node).to.have.class('selected')
-        } else {
-          expect(!!storedNode?.selected).to.eq(false)
-          expect(node).to.not.have.class('selected')
-        }
+          if (index < randomNumber) {
+            expect(!!storedNode?.selected).to.eq(true)
+            expect(node).to.have.class('selected')
+          } else {
+            expect(!!storedNode?.selected).to.eq(false)
+            expect(node).to.not.have.class('selected')
+          }
+        })
       })
-    })
+    }, 1)
   })
 })

tests/cypress/component/1-store/nodes/removeNodes.cy.ts

@@ -29,14 +29,17 @@ describe('Store Action: `removeNodes`', () => {
   })
 
   it('removes nodes from DOM', () => {
-    cy.get('.vue-flow__node').then((els) => {
-      els.each((index, node) => {
-        const nodeId = node.getAttribute('data-id')
-        const storedNode = store.findNode(nodeId)
+    // todo: can we avoid the timeout? without it, the test fails in ci
+    setTimeout(() => {
+      cy.get('.vue-flow__node').then((els) => {
+        els.each((index, node) => {
+          const nodeId = node.getAttribute('data-id')
+          const storedNode = store.findNode(nodeId)
 
-        expect(deletedNodes).to.not.include(nodeId)
-        expect(storedNode).to.not.eq(undefined)
+          expect(deletedNodes).to.not.include(nodeId)
+          expect(storedNode).to.not.eq(undefined)
+        })
       })
-    })
+    }, 1)
   })
 })

tests/cypress/component/1-store/nodes/removeSelectedNodes.cy.ts

@@ -27,21 +27,24 @@ describe('Store Action: `removeSelectedNodes`', () => {
   })
 
   it('removes `selected` class from nodes', () => {
-    cy.get('.vue-flow__node').then((els) => {
-      els.each((index, node) => {
-        const nodeId = node.getAttribute('data-id')
-        const storedNode = store.findNode(nodeId!)
+    // todo: can we avoid the timeout? without it, the test fails in ci
+    setTimeout(() => {
+      cy.get('.vue-flow__node').then((els) => {
+        els.each((index, node) => {
+          const nodeId = node.getAttribute('data-id')
+          const storedNode = store.findNode(nodeId!)
 
-        expect(storedNode && isNode(storedNode)).to.eq(true)
+          expect(storedNode && isNode(storedNode)).to.eq(true)
 
-        if (index >= randomNumber2 && index < randomNumber) {
-          expect(!!storedNode?.selected).to.eq(true)
-          expect(node).to.have.class('selected')
-        } else {
-          expect(!!storedNode?.selected).to.eq(false)
-          expect(node).to.not.have.class('selected')
-        }
+          if (index >= randomNumber2 && index < randomNumber) {
+            expect(!!storedNode?.selected).to.eq(true)
+            expect(node).to.have.class('selected')
+          } else {
+            expect(!!storedNode?.selected).to.eq(false)
+            expect(node).to.not.have.class('selected')
+          }
+        })
       })
-    })
+    }, 1)
   })
 })

tests/package.json

@@ -5,7 +5,7 @@
   "scripts": {
     "test": "cypress run --component",
     "open": "cypress open",
-    "lint": "eslint --ext .js,.ts,.vue ./"
+    "lint": "eslint --ext .js,.ts ./"
   },
   "dependencies": {
     "@vue-flow/background": "workspace:*",
@@ -16,11 +16,11 @@
   "devDependencies": {
     "@tooling/eslint-config": "workspace:*",
     "@tooling/tsconfig": "workspace:*",
-    "@vitejs/plugin-vue": "^4.2.2",
+    "@vitejs/plugin-vue": "^4.2.3",
     "cypress": "^12.12.0",
     "eslint-plugin-cypress": "^2.13.3",
     "typescript": "^4.9.5",
-    "vite": "^4.3.5",
+    "vite": "^4.3.7",
     "vue": "^3.2.25"
   }
 }