diff --git a/packages/editor-ui/src/components/WorkflowPreview.vue b/packages/editor-ui/src/components/WorkflowPreview.vue index ec9a929267..846f1208e6 100644 --- a/packages/editor-ui/src/components/WorkflowPreview.vue +++ b/packages/editor-ui/src/components/WorkflowPreview.vue @@ -136,21 +136,22 @@ const onMouseLeave = () => { }; const receiveMessage = ({ data }: MessageEvent) => { - if (data?.includes('"command"')) { - try { - const json = JSON.parse(data); - if (json.command === 'n8nReady') { - ready.value = true; - } else if (json.command === 'openNDV') { - nodeViewDetailsOpened.value = true; - } else if (json.command === 'closeNDV') { - nodeViewDetailsOpened.value = false; - } else if (json.command === 'error') { - emit('close'); - } - } catch (e) { - console.error(e); + if (!data?.includes?.('"command"')) { + return; + } + try { + const json = JSON.parse(data); + if (json.command === 'n8nReady') { + ready.value = true; + } else if (json.command === 'openNDV') { + nodeViewDetailsOpened.value = true; + } else if (json.command === 'closeNDV') { + nodeViewDetailsOpened.value = false; + } else if (json.command === 'error') { + emit('close'); } + } catch (e) { + console.error(e); } }; const onDocumentScroll = () => { diff --git a/packages/editor-ui/src/components/__tests__/WorkflowPreview.test.ts b/packages/editor-ui/src/components/__tests__/WorkflowPreview.test.ts index 78ab1a6a41..a0cbc27c9b 100644 --- a/packages/editor-ui/src/components/__tests__/WorkflowPreview.test.ts +++ b/packages/editor-ui/src/components/__tests__/WorkflowPreview.test.ts @@ -247,4 +247,18 @@ describe('WorkflowPreview', () => { expect(emitted()).toEqual({}); }); }); + + it('should not do anything if no "command" is sent in the message and the `includes` method cannot be applied to the data', async () => { + const { emitted } = renderComponent({ + pinia, + props: {}, + }); + + window.postMessage(null, '*'); + + await waitFor(() => { + expect(console.error).not.toHaveBeenCalled(); + expect(emitted()).toEqual({}); + }); + }); }); diff --git a/packages/editor-ui/src/views/NodeView.vue b/packages/editor-ui/src/views/NodeView.vue index e06a2fbc0f..476bc41e25 100644 --- a/packages/editor-ui/src/views/NodeView.vue +++ b/packages/editor-ui/src/views/NodeView.vue @@ -4312,58 +4312,59 @@ export default defineComponent({ } }, async onPostMessageReceived(message: MessageEvent) { - if (message?.data?.includes('"command"')) { - try { - const json = JSON.parse(message.data); - if (json && json.command === 'openWorkflow') { - try { - await this.importWorkflowExact(json); - this.isExecutionPreview = false; - } catch (e) { - if (window.top) { - window.top.postMessage( - JSON.stringify({ - command: 'error', - message: this.$locale.baseText('openWorkflow.workflowImportError'), - }), - '*', - ); - } - this.showMessage({ - title: this.$locale.baseText('openWorkflow.workflowImportError'), - message: (e as Error).message, - type: 'error', - }); - } - } else if (json && json.command === 'openExecution') { - try { - // If this NodeView is used in preview mode (in iframe) it will not have access to the main app store - // so everything it needs has to be sent using post messages and passed down to child components - this.isProductionExecutionPreview = json.executionMode !== 'manual'; - - await this.openExecution(json.executionId); - this.isExecutionPreview = true; - } catch (e) { - if (window.top) { - window.top.postMessage( - JSON.stringify({ - command: 'error', - message: this.$locale.baseText('nodeView.showError.openExecution.title'), - }), - '*', - ); - } - this.showMessage({ - title: this.$locale.baseText('nodeView.showError.openExecution.title'), - message: (e as Error).message, - type: 'error', - }); - } - } else if (json?.command === 'setActiveExecution') { - this.workflowsStore.activeWorkflowExecution = json.execution; - } - } catch (e) {} + if (!message?.data?.includes?.('"command"')) { + return; } + try { + const json = JSON.parse(message.data); + if (json && json.command === 'openWorkflow') { + try { + await this.importWorkflowExact(json); + this.isExecutionPreview = false; + } catch (e) { + if (window.top) { + window.top.postMessage( + JSON.stringify({ + command: 'error', + message: this.$locale.baseText('openWorkflow.workflowImportError'), + }), + '*', + ); + } + this.showMessage({ + title: this.$locale.baseText('openWorkflow.workflowImportError'), + message: (e as Error).message, + type: 'error', + }); + } + } else if (json && json.command === 'openExecution') { + try { + // If this NodeView is used in preview mode (in iframe) it will not have access to the main app store + // so everything it needs has to be sent using post messages and passed down to child components + this.isProductionExecutionPreview = json.executionMode !== 'manual'; + + await this.openExecution(json.executionId); + this.isExecutionPreview = true; + } catch (e) { + if (window.top) { + window.top.postMessage( + JSON.stringify({ + command: 'error', + message: this.$locale.baseText('nodeView.showError.openExecution.title'), + }), + '*', + ); + } + this.showMessage({ + title: this.$locale.baseText('nodeView.showError.openExecution.title'), + message: (e as Error).message, + type: 'error', + }); + } + } else if (json?.command === 'setActiveExecution') { + this.workflowsStore.activeWorkflowExecution = json.execution; + } + } catch (e) {} }, async onImportWorkflowDataEvent(data: IDataObject) { await this.importWorkflowData(data.data as IWorkflowDataUpdate, 'file');