update(test): add more flow tests

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

cypress.json

@@ -2,5 +2,6 @@
   "testFiles": "cypress/**/*.spec.ts",
   "componentFolder": ".",
   "video": false,
-  "screenshotOnRunFailure": false
+  "screenshotOnRunFailure": false,
+  "retries": 2
 }

cypress/integration/2-flow/container.spec.ts

@@ -10,7 +10,7 @@ describe('Render VueFlow', () => {
     { id: 'e1-2', source: '1', target: '2', animated: true },
   ]
 
-  it('renders a Vue Flow container', () => {
+  beforeEach(() => {
     mount(VueFlow, {
       props: {
         modelValue: elements,
@@ -23,12 +23,25 @@ describe('Render VueFlow', () => {
         },
       },
     })
-
-    cy.get('.vue-flow')
-      .should('exist')
-      .get('.vue-flow__node')
-      .should('have.length', elements.filter(isNode).length)
-      .get('.vue-flow__edge')
-      .should('have.length', elements.filter(isEdge).length)
   })
+
+  it('renders a Vue Flow container', () => {
+    cy.get('.vue-flow').should('exist')
+  })
+
+  it('renders nodes', () => {
+    cy.get('.vue-flow__node').should('have.length', elements.filter(isNode).length)
+  })
+
+  it('renders edges', () => cy.get('.vue-flow__edge').should('have.length', elements.filter(isEdge).length))
+
+  it('renders correct node labels', () =>
+    cy.get('.vue-flow__node').each((node) => expect(elements.some((el) => el.data.label === node.text())).to.be.true))
+
+  it('renders nodes at correct position', () =>
+    cy.get('.vue-flow__node').each((node) => {
+      expect(
+        elements.filter(isNode).some((el) => el.position.x === node.position().left && el.position.y === node.position().top),
+      ).to.be.true
+    }))
 })

vite.config.ts

@@ -59,6 +59,6 @@ export default defineConfig({
     }),
   ],
   optimizeDeps: {
-    include: ['vue', '@vueuse/core', '@braks/revue-draggable'],
+    include: ['vue', '@vueuse/core', '@braks/revue-draggable', 'd3-zoom', 'd3-selection'],
   },
 })