fix(core): Add empty credential value marker to show empty pw field (n8n-io#6532)

add empty credential value marker to show empty pw field

Author: flipswitchingmonkey

packages/cli/src/credentials/credentials.service.ts

@@ -7,7 +7,7 @@ import type {
 	INodeCredentialTestResult,
 	INodeProperties,
 } from 'n8n-workflow';
-import { deepCopy, LoggerProxy, NodeHelpers } from 'n8n-workflow';
+import { CREDENTIAL_EMPTY_VALUE, deepCopy, LoggerProxy, NodeHelpers } from 'n8n-workflow';
 import { Container } from 'typedi';
 import type { FindManyOptions, FindOptionsWhere } from 'typeorm';
 import { In } from 'typeorm';
@@ -300,16 +300,23 @@ export class CredentialsService {
 		for (const dataKey of Object.keys(copiedData)) {
 			// The frontend only cares that this value isn't falsy.
 			if (dataKey === 'oauthTokenData') {
-				copiedData[dataKey] = CREDENTIAL_BLANKING_VALUE;
+				if (copiedData[dataKey].toString().length > 0) {
+					copiedData[dataKey] = CREDENTIAL_BLANKING_VALUE;
+				} else {
+					copiedData[dataKey] = CREDENTIAL_EMPTY_VALUE;
+				}
 				continue;
 			}
 			const prop = properties.find((v) => v.name === dataKey);
 			if (!prop) {
 				continue;
 			}
 			if (prop.typeOptions?.password) {
-				// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-member-access
-				copiedData[dataKey] = CREDENTIAL_BLANKING_VALUE;
+				if (copiedData[dataKey].toString().length > 0) {
+					copiedData[dataKey] = CREDENTIAL_BLANKING_VALUE;
+				} else {
+					copiedData[dataKey] = CREDENTIAL_EMPTY_VALUE;
+				}
 			}
 		}
 
@@ -321,7 +328,7 @@ export class CredentialsService {
 		// eslint-disable-next-line @typescript-eslint/no-unsafe-argument
 		for (const [key, value] of Object.entries(unmerged)) {
 			// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
-			if (value === CREDENTIAL_BLANKING_VALUE) {
+			if (value === CREDENTIAL_BLANKING_VALUE || value === CREDENTIAL_EMPTY_VALUE) {
 				// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-member-access
 				unmerged[key] = replacement[key];
 			} else if (

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

@@ -367,7 +367,7 @@ import type {
 	EditorType,
 	CodeNodeEditorLanguage,
 } from 'n8n-workflow';
-import { NodeHelpers } from 'n8n-workflow';
+import { NodeHelpers, CREDENTIAL_EMPTY_VALUE } from 'n8n-workflow';
 
 import CredentialsSelect from '@/components/CredentialsSelect.vue';
 import ExpressionEdit from '@/components/ExpressionEdit.vue';
@@ -607,6 +607,11 @@ export default defineComponent({
 				return this.$locale.baseText('parameterInput.loadingOptions');
 			}
 
+			// if the value is marked as empty return empty string, to prevent displaying the asterisks
+			if (this.value === CREDENTIAL_EMPTY_VALUE) {
+				return '';
+			}
+
 			let returnValue;
 			if (this.isValueExpression === false) {
 				returnValue = this.isResourceLocatorParameter

packages/workflow/src/Constants.ts

@@ -14,3 +14,7 @@ export const NODES_WITH_RENAMABLE_CONTENT = new Set([
 	'n8n-nodes-base.function',
 	'n8n-nodes-base.functionItem',
 ]);
+
+// Arbitrary value to represent an empty credential value
+export const CREDENTIAL_EMPTY_VALUE =
+	'__n8n_EMPTY_VALUE_7b1af746-3729-4c60-9b9b-e08eb29e58da' as const;