tests: add isValidConnection prop test

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

tests/cypress/support/component.ts

@@ -1,28 +1,8 @@
-// ***********************************************************
-// This example support/component.ts is processed and
-// loaded automatically before your test files.
-//
-// This is a great place to put global configuration and
-// behavior that modifies Cypress.
-//
-// You can change the location of this file or turn off
-// automatically serving support files with the
-// 'supportFile' configuration option.
-//
-// You can read more here:
-// https://on.cypress.io/configuration
-// ***********************************************************
-
-// Import necessary styles
 import '@vue-flow/core/dist/style.css'
 import '@vue-flow/core/dist/theme-default.css'
 
-// Import commands.js using ES2015 syntax:
 import './commands'
 
-// Alternatively you can use CommonJS syntax:
-// require('./commands')
-
 import { mount } from 'cypress/vue'
 import { VueFlow } from '@vue-flow/core'
 import type { FlowProps } from '@vue-flow/core'
@@ -98,10 +78,14 @@ const dragConnection = (from: string, to: string) => {
   })
 }
 
-// Augment the Cypress namespace to include type definitions for
-// your custom command.
-// Alternatively, can be defined in cypress/support/component.d.ts
-// with a <reference path="./component" /> at the top of your spec.
+const connect = (from: string, to: string) => {
+  const sourceHandle = cy.get(`[data-nodeid="${from}"].source`)
+  const targetHandle = cy.get(`[data-nodeid="${to}"].target`)
+
+  sourceHandle.click({ force: true })
+  targetHandle.click({ force: true })
+}
+
 declare global {
   namespace Cypress {
     interface Chainable {
@@ -110,6 +94,7 @@ declare global {
       viewPort: typeof useViewPort
       transformationPane: typeof useTransformationPane
       tryAssertion: typeof retry
+      connect: typeof connect
       dragConnection: typeof dragConnection
     }
   }
@@ -125,7 +110,6 @@ Cypress.Commands.add('transformationPane', useTransformationPane)
 
 Cypress.Commands.add('tryAssertion', retry)
 
-Cypress.Commands.add('dragConnection', dragConnection)
+Cypress.Commands.add('connect', connect)
 
-// Example use:
-// cy.mount(MyComponent)
+Cypress.Commands.add('dragConnection', dragConnection)