admin/n8n-enterprise-unlocked
1
0
Fork 0
mirror of https://github.com/Abdulazizzn/n8n-enterprise-unlocked.git synced 2025-12-17 18:12:04 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(editor): Only show previews if the param is an expression (#14720)

Browse Source 
Co-authored-by: Elias Meire <elias@meire.dev>
This commit is contained in:
Dana
2025-04-24 09:08:43 +02:00
committed by GitHub
parent 022f4755c2
commit db887b6f29
6 changed files with 24 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
cypress/e2e/2372-ado-prevent-clipping-params.cy.ts
View File

@@ -27,7 +27,7 @@ describe('ADO-2362 ADO-2350 NDV Prevent clipping long parameters and scrolling t
// next parameter in view should not be visible // next parameter in view should not be visible
ndv.getters.inlineExpressionEditorInput().eq(1).should('have.text', 'not visible'); ndv.getters.inlineExpressionEditorInput().eq(1).should('have.text', 'not visible');
ndv.getters.inlineExpressionEditorInput().eq(1).should('not.be.visible'); ndv.getters.inlineExpressionEditorInput().eq(1).should('be.visible');
ndv.actions.close(); ndv.actions.close();
workflowPage.actions.openNode('Schedule Trigger'); workflowPage.actions.openNode('Schedule Trigger');

7
packages/frontend/editor-ui/src/components/AssignmentCollection/Assignment.test.ts
View File

@@ -62,4 +62,11 @@ describe('Assignment.vue', () => {
expect(emitted('remove')).toEqual([[]]); expect(emitted('remove')).toEqual([[]]);
}); });
it('should not display parameter input hint if expressionOutput is not set', () => {
const { getByTestId } = renderComponent();
// Check if the parameter input hint is not displayed
expect(() => getByTestId('parameter-input-hint')).toThrow();
});
}); });

1
packages/frontend/editor-ui/src/components/AssignmentCollection/Assignment.vue
View File

@@ -188,6 +188,7 @@ const onBlur = (): void => {
@blur="onBlur" @blur="onBlur"
/> />
<ParameterInputHint <ParameterInputHint
v-if="resolvedExpressionString"
data-test-id="parameter-expression-preview-value" data-test-id="parameter-expression-preview-value"
:class="$style.hint" :class="$style.hint"
:highlight="highlightHint" :highlight="highlightHint"

16
packages/frontend/editor-ui/src/components/ParameterInputWrapper.vue
View File

@@ -121,14 +121,6 @@ const { resolvedExpression, resolvedExpressionString } = useResolvedExpression({
stringifyObject: props.parameter.type !== 'multiOptions', stringifyObject: props.parameter.type !== 'multiOptions',
}); });
const expressionOutput = computed(() => {
if (isExpression.value && resolvedExpressionString.value) {
return resolvedExpressionString.value;
}
return null;
});
const parsedParameterName = computed(() => { const parsedParameterName = computed(() => {
return parseResourceMapperFieldName(props.parameter?.name ?? ''); return parseResourceMapperFieldName(props.parameter?.name ?? '');
}); });
@@ -199,14 +191,14 @@ defineExpose({
<slot v-if="$slots.overrideButton" name="overrideButton" /> <slot v-if="$slots.overrideButton" name="overrideButton" />
</template> </template>
</ParameterInput> </ParameterInput>
<div v-if="!hideHint && (expressionOutput || parameterHint)" :class="$style.hint"> <div v-if="!hideHint && (resolvedExpressionString || parameterHint)" :class="$style.hint">
<div> <div>
<InputHint <InputHint
v-if="expressionOutput" v-if="resolvedExpressionString"
:class="{ [$style.hint]: true, 'ph-no-capture': isForCredential }" :class="{ [$style.hint]: true, 'ph-no-capture': isForCredential }"
:data-test-id="`parameter-expression-preview-${parsedParameterName}`" :data-test-id="`parameter-expression-preview-${parsedParameterName}`"
:highlight="!!(expressionOutput && targetItem) && isInputParentOfActiveNode" :highlight="!!(resolvedExpressionString && targetItem) && isInputParentOfActiveNode"
:hint="expressionOutput" :hint="resolvedExpressionString"
:single-line="true" :single-line="true"
/> />
<InputHint v-else-if="parameterHint" :render-h-t-m-l="true" :hint="parameterHint" /> <InputHint v-else-if="parameterHint" :render-h-t-m-l="true" :hint="parameterHint" />

4
packages/frontend/editor-ui/src/composables/useResolvedExpression.test.ts
View File

@@ -63,8 +63,8 @@ describe('useResolvedExpression', () => {
}); });
expect(toValue(isExpression)).toBe(false); expect(toValue(isExpression)).toBe(false);
expect(toValue(resolvedExpression)).toBe(''); expect(toValue(resolvedExpression)).toBe(null);
expect(toValue(resolvedExpressionString)).toBe('[empty]'); expect(toValue(resolvedExpressionString)).toBe('');
}); });
it('should handle errors', async () => { it('should handle errors', async () => {

13
packages/frontend/editor-ui/src/composables/useResolvedExpression.ts
View File

@@ -25,7 +25,7 @@ export function useResolvedExpression({
const router = useRouter(); const router = useRouter();
const { resolveExpression } = useWorkflowHelpers({ router }); const { resolveExpression } = useWorkflowHelpers({ router });
const resolvedExpression = ref<unknown>(); const resolvedExpression = ref<unknown>(null);
const resolvedExpressionString = ref(''); const resolvedExpressionString = ref('');
const targetItem = computed(() => ndvStore.expressionTargetItem ?? undefined); const targetItem = computed(() => ndvStore.expressionTargetItem ?? undefined);
@@ -76,9 +76,14 @@ export function useResolvedExpression({
const debouncedUpdateExpression = debounce(updateExpression, 200); const debouncedUpdateExpression = debounce(updateExpression, 200);
function updateExpression() { function updateExpression() {
const resolved = resolve(); if (isExpression.value) {
resolvedExpression.value = resolved.ok ? resolved.result : null; const resolved = resolve();
resolvedExpressionString.value = stringifyExpressionResult(resolved, hasRunData.value); resolvedExpression.value = resolved.ok ? resolved.result : null;
resolvedExpressionString.value = stringifyExpressionResult(resolved, hasRunData.value);
} else {
resolvedExpression.value = null;
resolvedExpressionString.value = '';
}
} }
watch( watch(