Merge branch 'master' into N8N-5115-hide-pinned-data-in-prod-executions

* master:
  refactor: Remove Vetur config (no-changelog) (#4581)
  fix(editor): Fix expression editor variable selector filter (#4590)
  fix(editor): Curb direct item access linting (#4591)
  fix(editor): Skip optional chaining operators in Code Node editor linting (#4592)
  fix(editor): Fix for execution retry dropdown not closing (#4575)
  fix: Fix inferred type of X cannot be named error after pnpm update (no-changelog) (#4585)

packages/cli/tsconfig.json

@@ -4,6 +4,7 @@
 		"rootDir": ".",
 		"types": ["node", "jest"],
 		"noEmit": true,
+		"preserveSymlinks": true,
 		"emitDecoratorMetadata": true,
 		"experimentalDecorators": true,
 		"baseUrl": "src",

packages/design-system/src/components/N8nActionDropdown/ActionDropdown.vue

@@ -1,7 +1,7 @@
 <template>
 	<div :class="['action-dropdown-container', $style.actionDropdownContainer]">
-		<el-dropdown :placement="placement" :trigger="trigger" @command="onSelect">
-			<div :class="$style.activator" @click.prevent>
+		<el-dropdown :placement="placement" :trigger="trigger" @command="onSelect" ref="elementDropdown">
+			<div :class="$style.activator" @click.prevent @blur="onButtonBlur">
 				<n8n-icon :icon="activatorIcon"/>
 			</div>
 			<el-dropdown-menu slot="dropdown" :class="$style.userActionsMenu">
@@ -92,6 +92,13 @@ export default Vue.extend({
 		onSelect(action: string) : void {
 			this.$emit('select', action);
 		},
+		onButtonBlur(event: FocusEvent): void {
+			const elementDropdown = this.$refs.elementDropdown as Vue & { hide: () => void }  | undefined;
+			// Hide dropdown when clicking outside of current document
+			if (elementDropdown && event.relatedTarget === null) {
+				elementDropdown.hide();
+			}
+		},
 	},
 });
 

packages/editor-ui/src/components/CodeNodeEditor/linter.ts

@@ -30,6 +30,15 @@ export const linterExtension = (Vue as CodeNodeEditorMixin).extend({
 			} catch (syntaxError) {
 				let line;
 
+				try {
+					const lineAtError = editorView.state.doc.line(syntaxError.lineNumber - 1).text;
+
+					// optional chaining operators currently unsupported by esprima-next
+					if (['?.', ']?'].some((operator) => lineAtError.includes(operator))) return [];
+				} catch (_) {
+					return [];
+				}
+
 				try {
 					line = editorView.state.doc.line(syntaxError.lineNumber);
 
@@ -41,7 +50,7 @@ export const linterExtension = (Vue as CodeNodeEditorMixin).extend({
 							message: this.$locale.baseText('codeNodeEditor.linter.bothModes.syntaxError'),
 						},
 					];
-				} catch (error) {
+				} catch (_) {
 					/**
 					 * For invalid (e.g. half-written) n8n syntax, esprima errors with an off-by-one line number for the final line. In future, we should add full linting for n8n syntax before parsing JS.
 					 */
@@ -403,14 +412,19 @@ export const linterExtension = (Vue as CodeNodeEditorMixin).extend({
 					left: { declarations: Array<{ id: { type: string; name: string } }> };
 				};
 
-				const isForOfStatement = (node: Node) =>
+				const isForOfStatementOverN8nVar = (node: Node) =>
 					node.type === 'ForOfStatement' &&
 					node.left.type === 'VariableDeclaration' &&
 					node.left.declarations.length === 1 &&
 					node.left.declarations[0].type === 'VariableDeclarator' &&
-					node.left.declarations[0].id.type === 'Identifier';
-
-				const found = walk<TargetNode>(ast, isForOfStatement);
+					node.left.declarations[0].id.type === 'Identifier' &&
+					node.right.type === 'CallExpression' &&
+					node.right.callee.type === 'MemberExpression' &&
+					node.right.callee.computed === false &&
+					node.right.callee.object.type === 'Identifier' &&
+					node.right.callee.object.name.startsWith('$'); // n8n var, e.g $input
+
+				const found = walk<TargetNode>(ast, isForOfStatementOverN8nVar);
 
 				if (found.length === 1) {
 					const itemAlias = found[0].left.declarations[0].id.name;

packages/editor-ui/src/components/ExecutionsView/ExecutionPreview.vue

@@ -33,21 +33,22 @@
 				</n8n-text>
 			</div>
 			<div>
-				<el-dropdown v-if="executionUIDetails.name === 'error'" trigger="click" class="mr-xs" @command="handleRetryClick">
+				<el-dropdown v-if="executionUIDetails.name === 'error'" trigger="click" class="mr-xs" @command="handleRetryClick" ref="retryDropdown">
 					<span class="retry-button">
 						<n8n-icon-button
 							size="large"
 							type="tertiary"
 							:title="$locale.baseText('executionsList.retryExecution')"
 							icon="redo"
+							@blur="onRetryButtonBlur"
 						/>
 					</span>
 					<el-dropdown-menu slot="dropdown">
 						<el-dropdown-item command="current-workflow">
 							{{ $locale.baseText('executionsList.retryWithCurrentlySavedWorkflow') }}
 						</el-dropdown-item>
 						<el-dropdown-item command="original-workflow">
-							{{ $locale.baseText('executionsList.retryWithOriginalworkflow') }}
+							{{ $locale.baseText('executionsList.retryWithOriginalWorkflow') }}
 						</el-dropdown-item>
 					</el-dropdown-menu>
 				</el-dropdown>
@@ -67,6 +68,7 @@ import { executionHelpers, IExecutionUIData } from '../mixins/executionsHelpers'
 import { VIEWS } from '../../constants';
 import { mapStores } from 'pinia';
 import { useUIStore } from '@/stores/ui';
+import ElDropdown from 'element-ui/lib/dropdown';
 
 export default mixins(restApi, showMessage, executionHelpers).extend({
 	name: 'execution-preview',
@@ -109,6 +111,13 @@ export default mixins(restApi, showMessage, executionHelpers).extend({
 		handleRetryClick(command: string): void {
 			this.$emit('retryExecution', { execution: this.activeExecution, command });
 		},
+		onRetryButtonBlur(event: FocusEvent): void {
+			// Hide dropdown when clicking outside of current document
+			const retryDropdown = this.$refs.retryDropdown as Vue & { hide: () => void } | undefined;
+			if (retryDropdown && event.relatedTarget === null) {
+				retryDropdown.hide();
+			}
+		},
 	},
 });
 </script>
@@ -128,6 +137,9 @@ export default mixins(restApi, showMessage, executionHelpers).extend({
 	display: flex;
 	justify-content: space-between;
 	transition: all 150ms ease-in-out;
+	pointer-events: none;
+
+	& * { pointer-events: all; }
 
 	&.sidebarCollapsed {
 		width: calc(100% - 375px);

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

@@ -26,7 +26,7 @@
 import ExecutionsSidebar from '@/components/ExecutionsView/ExecutionsSidebar.vue';
 import { MODAL_CANCEL, MODAL_CLOSE, MODAL_CONFIRMED, PLACEHOLDER_EMPTY_WORKFLOW_ID, VIEWS, WEBHOOK_NODE_TYPE } from '@/constants';
 import { IExecutionsListResponse, IExecutionsSummary, INodeUi, ITag, IWorkflowDb } from '@/Interface';
-import { IConnection, IConnections, IDataObject, INodeTypeDescription, INodeTypeNameVersion, IWorkflowSettings, NodeHelpers } from 'n8n-workflow';
+import { IConnection, IConnections, IDataObject, INodeTypeDescription, INodeTypeNameVersion, NodeHelpers } from 'n8n-workflow';
 import mixins from 'vue-typed-mixins';
 import { restApi } from '../mixins/restApi';
 import { showMessage } from '../mixins/showMessage';

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

@@ -557,9 +557,7 @@ export default mixins(
 						if (pinData) {
 							const output = this.getNodePinDataOutput(parentNodeName, pinData, filterText, true);
 
-							pinDataOptions[0].options = pinDataOptions[0].options!.concat(
-								output && output[0].options ? output[0].options : [],
-							);
+							pinDataOptions[0].options = pinDataOptions[0].options!.concat(output?.[0]?.options ?? []);
 						}
 					});
 

tsconfig.json

@@ -18,7 +18,6 @@
 		"incremental": true,
 		"declaration": true,
 		"sourceMap": true,
-		"preserveSymlinks": true,
 		"skipLibCheck": true
 	},
 	"exclude": ["**/dist/**/*", "**/node_modules/**/*"]