diff --git a/packages/editor-ui/src/components/mixins/nodeBase.ts b/packages/editor-ui/src/components/mixins/nodeBase.ts
index 0c5420ca23..b2513d925f 100644
--- a/packages/editor-ui/src/components/mixins/nodeBase.ts
+++ b/packages/editor-ui/src/components/mixins/nodeBase.ts
@@ -60,9 +60,6 @@ const anchorPositions: {
 	},
 };
 
-const INPUT_UUID_KEY = '-input';
-const OUTPUT_UUID_KEY = '-output';
-
 const getInputEndpointStyle = (nodeTypeData: INodeTypeDescription, color: string) => ({
 	width: 8,
 	height: nodeTypeData && nodeTypeData.outputs.length > 2 ? 18 : 20,
@@ -148,7 +145,7 @@ export const nodeBase = mixins(
 				const anchorPosition = anchorPositions.input[nodeTypeData.inputs.length][index];
 
 				const newEndpointData: IEndpointOptions = {
-					uuid: `${this.nodeIndex}` + INPUT_UUID_KEY + index,
+					uuid: CanvasHelpers.getInputEndpointUUID(this.nodeIndex, index),
 					anchor: anchorPosition,
 					maxConnections: -1,
 					endpoint: 'Rectangle',
@@ -213,7 +210,7 @@ export const nodeBase = mixins(
 				const anchorPosition = anchorPositions.output[nodeTypeData.outputs.length][index];
 
 				const newEndpointData: IEndpointOptions = {
-					uuid: `${this.nodeIndex}` + OUTPUT_UUID_KEY + index,
+					uuid: CanvasHelpers.getInputEndpointUUID(this.nodeIndex, index),
 					anchor: anchorPosition,
 					maxConnections: -1,
 					endpoint: 'Dot',
diff --git a/packages/editor-ui/src/views/NodeView.vue b/packages/editor-ui/src/views/NodeView.vue
index a7de4c0761..e02bb12adc 100644
--- a/packages/editor-ui/src/views/NodeView.vue
+++ b/packages/editor-ui/src/views/NodeView.vue
@@ -1644,17 +1644,14 @@ export default mixins(
 					}
 				});
 			},
-			getOutputEndpointUUID(nodeName: string, index: number) {
-				return `${this.getNodeIndex(nodeName)}-output${index}`;
-			},
-			getInputEndpointUUID(nodeName: string, index: number) {
-				return `${this.getNodeIndex(nodeName)}-input${index}`;
-			},
 			__addConnection (connection: [IConnection, IConnection], addVisualConnection = false) {
 				if (addVisualConnection === true) {
+					const sourceIndex = this.getNodeIndex(connection[0].node);
+					const targetIndex = this.getNodeIndex(connection[1].node);
+
 					const uuid: [string, string] = [
-						this.getOutputEndpointUUID(connection[0].node, connection[0].index),
-						this.getInputEndpointUUID(connection[1].node, connection[1].index),
+						CanvasHelpers.getOutputEndpointUUID(sourceIndex, connection[0].index),
+						CanvasHelpers.getInputEndpointUUID(targetIndex, connection[1].index),
 					];
 
 					// Create connections in DOM
@@ -1762,8 +1759,8 @@ export default mixins(
 				const targetIndex = this.getNodeIndex(targetNodeName);
 				const targetId = `${NODE_NAME_PREFIX}${targetIndex}`;
 
-				const sourceEndpoint = `${sourceIndex}-output${sourceOutputIndex}`;
-				const targetEndpoint = `${targetIndex}-input${targetInputIndex}`;
+				const sourceEndpoint = CanvasHelpers.getOutputEndpointUUID(sourceIndex, sourceOutputIndex);
+				const targetEndpoint = CanvasHelpers.getInputEndpointUUID(targetIndex, targetInputIndex);
 
 				// @ts-ignore
 				const connections = this.instance.getConnections({
diff --git a/packages/editor-ui/src/views/canvasHelpers.ts b/packages/editor-ui/src/views/canvasHelpers.ts
index 4574344130..20ebd93d72 100644
--- a/packages/editor-ui/src/views/canvasHelpers.ts
+++ b/packages/editor-ui/src/views/canvasHelpers.ts
@@ -637,3 +637,11 @@ export const addConnectionActionsOverlay = (connection: Connection, onDelete: Fu
 	]);
 };
 
+export const getOutputEndpointUUID = (nodeIndex: string, outputIndex: number): string => {
+	return `${nodeIndex}-output${outputIndex}`;
+};
+
+export const getInputEndpointUUID = (nodeIndex: string, inputIndex: number): string => {
+	return `${nodeIndex}-input${inputIndex}`;
+};
+