refactor(tests): rename e2e to tests

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

tests/cypress/component/1-store/viewpane/deleteKeyCode.cy.ts

@@ -0,0 +1,42 @@
+import { useVueFlow } from '@vue-flow/core'
+import { getElements } from '../../../utils'
+
+const { nodes, edges } = getElements()
+
+describe('Store State: `deleteKeyCode`', () => {
+  const store = useVueFlow({ id: 'test' })
+
+  beforeEach(() => {
+    cy.vueFlow({
+      nodes,
+      edges,
+    })
+  })
+
+  it('deletes node', () => {
+    cy.window().then(() => {
+      cy.get(`[data-id="${nodes[0].id}"]`).click()
+
+      cy.get('body').trigger('keydown', { key: 'Backspace' })
+
+      cy.tryAssertion(() => {
+        cy.get(`[data-id="${nodes[0].id}"]`).should('not.exist')
+        expect(store.nodes.value.some((node) => node.id === nodes[0].id)).to.equal(false)
+      })
+    })
+  })
+
+  it('changes key code', () => {
+    store.deleteKeyCode.value = 'Delete'
+    cy.window().then(() => {
+      cy.get(`[data-id="${nodes[0].id}"]`).click()
+
+      cy.get('body').trigger('keydown', { key: 'Delete' })
+
+      cy.tryAssertion(() => {
+        cy.get(`[data-id="${nodes[0].id}"]`).should('not.exist')
+        expect(store.nodes.value.some((node) => node.id === nodes[0].id)).to.equal(false)
+      })
+    })
+  })
+})

tests/cypress/component/1-store/viewpane/selectionKeyCode.cy.ts

@@ -0,0 +1,92 @@
+import { useVueFlow } from '@vue-flow/core'
+import { getElements } from '../../../utils'
+
+const { nodes, edges } = getElements()
+
+describe('Store State: `selectionKeyCode`', () => {
+  const store = useVueFlow({ id: 'test' })
+
+  beforeEach(() => {
+    cy.vueFlow({
+      nodes,
+      edges,
+    })
+  })
+
+  it('triggers selection', () => {
+    cy.window().then((win) => {
+      cy.get('body').trigger('keydown', { key: 'Shift', release: false })
+
+      cy.get('.vue-flow__pane')
+        .should('exist')
+        .trigger('mousedown', {
+          which: 1,
+          force: true,
+          view: win,
+        })
+        .trigger('mousemove', {
+          clientX: 100,
+          clientY: 100,
+          force: true,
+        })
+        .click()
+
+      cy.get('body').trigger('keyup', { key: 'Shift', release: true })
+
+      cy.tryAssertion(() => {
+        expect(store.getSelectedElements.value).to.not.have.length(0)
+      })
+    })
+  })
+
+  it('changes keycode', () => {
+    cy.window().then((win) => {
+      store.selectionKeyCode.value = 'Control'
+      cy.get('body').trigger('keydown', { key: 'Control', release: false })
+
+      cy.get('.vue-flow__pane')
+        .should('exist')
+        .trigger('mousedown', {
+          which: 1,
+          force: true,
+          view: win,
+        })
+        .trigger('mousemove', {
+          clientX: 100,
+          clientY: 100,
+          force: true,
+        })
+        .click()
+
+      cy.get('body').trigger('keyup', { key: 'Control', release: true })
+
+      cy.tryAssertion(() => {
+        expect(store.getSelectedElements.value).to.not.have.length(0)
+      })
+    })
+  })
+
+  it('allows `true` as keycode', () => {
+    cy.window().then((win) => {
+      store.selectionKeyCode.value = true
+
+      cy.get('.vue-flow__pane')
+        .should('exist')
+        .trigger('mousedown', {
+          which: 1,
+          force: true,
+          view: win,
+        })
+        .trigger('mousemove', {
+          clientX: 100,
+          clientY: 100,
+          force: true,
+        })
+        .click()
+
+      cy.tryAssertion(() => {
+        expect(store.getSelectedElements.value).to.not.have.length(0)
+      })
+    })
+  })
+})

tests/cypress/component/1-store/viewpane/setMaxZoom.cy.ts

@@ -0,0 +1,40 @@
+import { useVueFlow } from '@vue-flow/core'
+import { getElements } from '../../../utils'
+
+const { nodes } = getElements()
+
+describe('Store Action: `setMaxZoom`', () => {
+  const store = useVueFlow({ id: 'test' })
+
+  beforeEach(() => {
+    cy.vueFlow({
+      nodes,
+    })
+  })
+
+  beforeEach(() => {
+    store.setMaxZoom(2)
+  })
+
+  it('sets max-zoom in store', () => {
+    expect(store.maxZoom.value).to.eq(2)
+  })
+
+  it('sets max-zoom in viewpane', async () => {
+    cy.viewPort().trigger('wheel', {
+      deltaY: -10000,
+      wheelDelta: 0,
+      wheelDeltaX: 0,
+      wheelDeltaY: 0,
+      bubbles: true,
+    })
+
+    await cy.tryAssertion(() => {
+      cy.transformationPane().should(
+        'have.css',
+        'transform',
+        `matrix(${store.viewport.value.zoom}, 0, 0, ${store.viewport.value.zoom}, ${store.viewport.value.x}, ${store.viewport.value.y})`,
+      )
+    })
+  })
+})

tests/cypress/component/1-store/viewpane/setMinZoom.cy.ts

@@ -0,0 +1,38 @@
+import { useVueFlow } from '@vue-flow/core'
+import { getElements } from '../../../utils'
+
+const { nodes } = getElements()
+
+describe('Store Action: `setMinZoom`', () => {
+  const store = useVueFlow({ id: 'test' })
+
+  beforeEach(() => {
+    cy.vueFlow({
+      nodes,
+    })
+  })
+
+  beforeEach(() => {
+    store.setMinZoom(0.5)
+  })
+
+  it('sets min-zoom in store', () => {
+    expect(store.minZoom.value).to.eq(0.5)
+  })
+
+  it('sets min-zoom in viewpane', () => {
+    cy.viewPort().trigger('wheel', {
+      deltaY: 10000,
+      wheelDelta: 0,
+      wheelDeltaX: 0,
+      wheelDeltaY: 0,
+      bubbles: true,
+    })
+
+    cy.transformationPane().should(
+      'have.css',
+      'transform',
+      `matrix(${store.viewport.value.zoom}, 0, 0, ${store.viewport.value.zoom}, ${store.viewport.value.x}, ${store.viewport.value.y})`,
+    )
+  })
+})