From b838977687136711f89d9dd07b295b36c6ca8999 Mon Sep 17 00:00:00 2001
From: Braks <78412429+bcakmakoglu@users.noreply.github.com>
Date: Sat, 4 Dec 2021 12:21:54 +0100
Subject: [PATCH] feat(test): Add container.spec.ts

Signed-off-by: Braks <78412429+bcakmakoglu@users.noreply.github.com>
---
 cypress/integration/2-flow/container.spec.ts | 34 ++++++++++++++++++++
 1 file changed, 34 insertions(+)
 create mode 100644 cypress/integration/2-flow/container.spec.ts

diff --git a/cypress/integration/2-flow/container.spec.ts b/cypress/integration/2-flow/container.spec.ts
new file mode 100644
index 00000000..d8ba0b43
--- /dev/null
+++ b/cypress/integration/2-flow/container.spec.ts
@@ -0,0 +1,34 @@
+import { mount } from '@cypress/vue'
+import VueFlow from '../../../src/container/VueFlow/VueFlow.vue'
+import { Elements } from '~/types'
+import { isEdge, isNode } from '~/utils'
+
+describe('Render VueFlow', () => {
+  const elements: Elements = [
+    { id: '1', type: 'input', data: { label: 'Node 1' }, position: { x: 250, y: 5 } },
+    { id: '2', data: { label: 'Node 2' }, position: { x: 100, y: 100 } },
+    { id: 'e1-2', source: '1', target: '2', animated: true },
+  ]
+
+  it('renders a Vue Flow container', () => {
+    mount(VueFlow, {
+      props: {
+        modelValue: elements,
+      },
+      attrs: {
+        key: 'flowy',
+        style: {
+          height: '100vh',
+          width: '100vw',
+        },
+      },
+    })
+
+    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)
+  })
+})