feat: Add credentials E2E test suite and page object (#4596)

* fix: Fix inferred type of X cannot be named error after pnpm update

* feat: Change page objects to expose actions and getters. Add credential creation suite

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

@@ -20,6 +20,7 @@
 						:readonly="!credentialPermissions.updateName"
 						type="Credential"
 						@input="onNameEdit"
+						data-test-id="credential-name"
 					/>
 				</div>
 				<div :class="$style.credActions">
@@ -32,6 +33,7 @@
 						:disabled="isSaving"
 						:loading="isDeleting"
 						@click="deleteCredential"
+						data-test-id="credential-delete-button"
 					/>
 					<SaveButton
 						v-if="(hasUnsavedChanges || credentialId) && credentialPermissions.save"
@@ -41,6 +43,7 @@
 							? $locale.baseText('credentialEdit.credentialEdit.testing')
 							: $locale.baseText('credentialEdit.credentialEdit.saving')"
 						@click="saveCredential"
+						data-test-id="credential-save-button"
 					/>
 				</div>
 			</div>

packages/editor-ui/src/components/CredentialEdit/CredentialInputs.vue

@@ -1,6 +1,6 @@
 <template>
 	<div @keydown.stop :class="$style.container" v-if="credentialProperties.length">
-		<form v-for="parameter in credentialProperties" :key="parameter.name" autocomplete="off">
+		<form v-for="parameter in credentialProperties" :key="parameter.name" autocomplete="off" data-test-id="credential-connection-parameter">
 			<!-- Why form? to break up inputs, to prevent Chrome autofill -->
 			<n8n-notice
 				v-if="parameter.type === 'notice'"