fix(editor): Fix XSS issue in node error message toast

packages/editor-ui/src/components/NodeExecutionErrorMessage.vue

@@ -0,0 +1,18 @@
+<script lang="ts" setup>
+import { useI18n } from '@/composables/useI18n';
+const i18n = useI18n();
+
+defineProps<{
+	nodeName: string;
+	errorMessage?: string;
+}>();
+</script>
+
+<template>
+	<div>
+		{{ errorMessage }}<br />
+		<a data-action="openNodeDetail" :data-action-parameter-node="nodeName">{{
+			i18n.baseText('node.executionError.openNode')
+		}}</a>
+	</div>
+</template>

packages/editor-ui/src/composables/usePushConnection.ts

@@ -32,7 +32,7 @@ import { useNodeTypesStore } from '@/stores/nodeTypes.store';
 import { useCredentialsStore } from '@/stores/credentials.store';
 import { useSettingsStore } from '@/stores/settings.store';
 import { parse } from 'flatted';
-import { ref } from 'vue';
+import { h, ref } from 'vue';
 import { useOrchestrationStore } from '@/stores/orchestration.store';
 import { usePushConnectionStore } from '@/stores/pushConnection.store';
 import { useExternalHooks } from '@/composables/useExternalHooks';
@@ -42,6 +42,7 @@ import { useI18n } from '@/composables/useI18n';
 import { useTelemetry } from '@/composables/useTelemetry';
 import type { PushMessageQueueItem } from '@/types';
 import { useAssistantStore } from '@/stores/assistant.store';
+import NodeExecutionErrorMessage from '@/components/NodeExecutionErrorMessage.vue';
 
 export function usePushConnection({ router }: { router: ReturnType<typeof useRouter> }) {
 	const workflowHelpers = useWorkflowHelpers({ router });
@@ -407,16 +408,12 @@ export function usePushConnection({ router }: { router: ReturnType<typeof useRou
 
 					toast.showMessage({
 						title,
-						message:
-							(nodeError?.description ?? runDataExecutedErrorMessage) +
-							i18n.baseText('pushConnection.executionError.openNode', {
-								interpolate: {
-									node: nodeError.node.name,
-								},
-							}),
+						message: h(NodeExecutionErrorMessage, {
+							errorMessage: nodeError?.description ?? runDataExecutedErrorMessage,
+							nodeName: nodeError.node.name,
+						}),
 						type: 'error',
 						duration: 0,
-						dangerouslyUseHTMLString: true,
 					});
 				} else {
 					let title: string;

packages/editor-ui/src/plugins/i18n/locales/en.json

@@ -1003,6 +1003,7 @@
 	"node.waitingForYouToCreateAnEventIn": "Waiting for you to create an event in {nodeType}",
 	"node.discovery.pinData.canvas": "You can pin this output instead of waiting for a test event. Open node to do so.",
 	"node.discovery.pinData.ndv": "You can pin this output instead of waiting for a test event.",
+	"node.executionError.openNode": "Open node",
 	"nodeBase.clickToAddNodeOrDragToConnect": "Click to add node \n or drag to connect",
 	"nodeCreator.actionsPlaceholderNode.scheduleTrigger": "On a Schedule",
 	"nodeCreator.actionsPlaceholderNode.webhook": "On a Webhook call",