diff --git a/cypress/e2e/5-ndv.cy.ts b/cypress/e2e/5-ndv.cy.ts index 8089a12407..4249018b89 100644 --- a/cypress/e2e/5-ndv.cy.ts +++ b/cypress/e2e/5-ndv.cy.ts @@ -490,6 +490,29 @@ describe('NDV', () => { ndv.getters.nodeVersion().should('have.text', 'Function node version 1 (Deprecated)'); ndv.actions.close(); }); + it('should properly show node execution indicator', () => { + workflowPage.actions.addInitialNodeToCanvas('Code'); + workflowPage.actions.openNode('Code'); + // Should not show run info before execution + ndv.getters.nodeRunSuccessIndicator().should('not.exist'); + ndv.getters.nodeRunErrorIndicator().should('not.exist'); + ndv.getters.nodeExecuteButton().click(); + ndv.getters.nodeRunSuccessIndicator().should('exist'); + }); + it('should properly show node execution indicator for multiple nodes', () => { + workflowPage.actions.addInitialNodeToCanvas('Code'); + workflowPage.actions.openNode('Code'); + ndv.actions.typeIntoParameterInput('jsCode', 'testets'); + ndv.getters.backToCanvas().click(); + workflowPage.actions.executeWorkflow(); + // Manual tigger node should show success indicator + workflowPage.actions.openNode('When clicking "Execute Workflow"'); + ndv.getters.nodeRunSuccessIndicator().should('exist'); + // Code node should show error + ndv.getters.backToCanvas().click(); + workflowPage.actions.openNode('Code'); + ndv.getters.nodeRunErrorIndicator().should('exist'); + }); it('Should handle mismatched option attributes', () => { workflowPage.actions.addInitialNodeToCanvas('LDAP', { keepNdvOpen: true, action: 'Create a new entry' }); // Add some attributes in Create operation diff --git a/cypress/pages/ndv.ts b/cypress/pages/ndv.ts index 8d8f5297e9..66116b0fc4 100644 --- a/cypress/pages/ndv.ts +++ b/cypress/pages/ndv.ts @@ -98,6 +98,8 @@ export class NDV extends BasePage { pagination: () => cy.getByTestId('ndv-data-pagination'), nodeVersion: () => cy.getByTestId('node-version'), nodeSettingsTab: () => cy.getByTestId('tab-settings'), + nodeRunSuccessIndicator: () => cy.getByTestId('node-run-info-success'), + nodeRunErrorIndicator: () => cy.getByTestId('node-run-info-danger'), }; actions = { diff --git a/packages/design-system/src/components/N8nInfoTip/InfoTip.vue b/packages/design-system/src/components/N8nInfoTip/InfoTip.vue index 7a81cbb0fd..394b994c8e 100644 --- a/packages/design-system/src/components/N8nInfoTip/InfoTip.vue +++ b/packages/design-system/src/components/N8nInfoTip/InfoTip.vue @@ -2,6 +2,7 @@
- - + + - + @@ -48,7 +49,7 @@ export default defineComponent({ type: String, default: 'info', validator: (value: string): boolean => - ['info', 'info-light', 'warning', 'danger'].includes(value), + ['info', 'info-light', 'warning', 'danger', 'success'].includes(value), }, type: { type: String, @@ -64,10 +65,50 @@ export default defineComponent({ default: 'top', }, }, + computed: { + iconData(): { icon: string; color: string } { + switch (this.theme) { + case 'info': + return { + icon: 'info-circle', + color: '--color-text-light)', + }; + case 'info-light': + return { + icon: 'info-circle', + color: 'var(--color-foreground-dark)', + }; + case 'warning': + return { + icon: 'exclamation-triangle', + color: 'var(--color-warning)', + }; + case 'danger': + return { + icon: 'exclamation-triangle', + color: 'var(--color-danger)', + }; + case 'success': + return { + icon: 'check-circle', + color: 'var(--color-success)', + }; + default: + return { + icon: 'info-circle', + color: '--color-text-light)', + }; + } + }, + }, }); diff --git a/packages/design-system/src/components/N8nInfoTip/__tests__/__snapshots__/InfoTip.spec.ts.snap b/packages/design-system/src/components/N8nInfoTip/__tests__/__snapshots__/InfoTip.spec.ts.snap index dc755e961d..3a49e215d5 100644 --- a/packages/design-system/src/components/N8nInfoTip/__tests__/__snapshots__/InfoTip.spec.ts.snap +++ b/packages/design-system/src/components/N8nInfoTip/__tests__/__snapshots__/InfoTip.spec.ts.snap @@ -1,9 +1,9 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html -exports[`N8nInfoTip > should render correctly as note 1`] = `"
Need help doing something?Open docs
"`; +exports[`N8nInfoTip > should render correctly as note 1`] = `"
Need help doing something?Open docs
"`; exports[`N8nInfoTip > should render correctly as tooltip 1`] = ` -"
+"
" `; diff --git a/packages/design-system/src/components/N8nTooltip/Tooltip.vue b/packages/design-system/src/components/N8nTooltip/Tooltip.vue index ee8c53683a..c49df41184 100644 --- a/packages/design-system/src/components/N8nTooltip/Tooltip.vue +++ b/packages/design-system/src/components/N8nTooltip/Tooltip.vue @@ -1,5 +1,5 @@