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

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

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
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();
workflowPage.actions.openNode('Schedule Trigger');

View File

@@ -62,4 +62,11 @@ describe('Assignment.vue', () => {
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();
});
});

View File

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

View File

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

View File

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

View File

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