feat: Track self serve trial (no-changelog) (#8801)

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

@@ -726,6 +726,10 @@ export default defineComponent({
 				if (this.registerForEnterpriseTrial && this.canRegisterForEnterpriseTrial) {
 					await this.usageStore.requestEnterpriseLicenseTrial();
 					licenseRequestSucceeded = true;
+					this.$telemetry.track('User registered for self serve trial', {
+						email: this.usersStore.currentUser?.email,
+						instance_id: this.rootStore.instanceId,
+					});
 				}
 			} catch (e) {
 				this.showError(

packages/editor-ui/src/components/__tests__/PersonalizationModal.spec.ts

@@ -1,31 +1,58 @@
 import PersonalizationModal from '@/components/PersonalizationModal.vue';
 import { createTestingPinia } from '@pinia/testing';
-import { PERSONALIZATION_MODAL_KEY, STORES } from '@/constants';
+import userEvent from '@testing-library/user-event';
+import { PERSONALIZATION_MODAL_KEY, STORES, VIEWS } from '@/constants';
 import { retry } from '@/__tests__/utils';
 import { createComponentRenderer } from '@/__tests__/render';
 import { fireEvent } from '@testing-library/vue';
+import { useUsersStore } from '@/stores/users.store';
+import { useUsageStore } from '@/stores/usage.store';
+
+const pinia = createTestingPinia({
+	initialState: {
+		[STORES.UI]: {
+			modals: {
+				[PERSONALIZATION_MODAL_KEY]: { open: true },
+			},
+		},
+		[STORES.SETTINGS]: {
+			settings: {
+				templates: {
+					host: '',
+				},
+			},
+		},
+		[STORES.USERS]: {
+			users: {
+				123: {
+					email: 'john@doe.com',
+					firstName: 'John',
+					lastName: 'Doe',
+					isDefaultUser: false,
+					isPendingUser: false,
+					hasRecoveryCodesLeft: true,
+					isOwner: true,
+					mfaEnabled: false,
+				},
+			},
+			currentUserId: '123',
+		},
+	},
+});
 
 const renderComponent = createComponentRenderer(PersonalizationModal, {
 	props: {
 		teleported: false,
 		appendToBody: false,
 	},
-	pinia: createTestingPinia({
+	pinia,
-		initialState: {
+	global: {
-			[STORES.UI]: {
+		mocks: {
-				modals: {
+			$route: {
-					[PERSONALIZATION_MODAL_KEY]: { open: true },
+				name: VIEWS.NEW_WORKFLOW,
-				},
-			},
-			[STORES.SETTINGS]: {
-				settings: {
-					templates: {
-						host: '',
-					},
-				},
 			},
 		},
-	}),
+	},
 });
 
 describe('PersonalizationModal.vue', () => {
@@ -61,4 +88,50 @@ describe('PersonalizationModal.vue', () => {
 			});
 		}
 	});
+
+	it('should display self serve trial option when company size is larger than 500', async () => {
+		const wrapper = renderComponent();
+
+		await retry(() =>
+			expect(wrapper.container.querySelector('.modal-content')).toBeInTheDocument(),
+		);
+
+		const select = wrapper.container.querySelectorAll('.n8n-select')[3]!;
+		await fireEvent.click(select);
+
+		const item = select.querySelectorAll('.el-select-dropdown__item')[3];
+		await fireEvent.click(item);
+
+		await retry(() => {
+			expect(wrapper.container.querySelector('.card')).not.toBeNull();
+		});
+	});
+
+	it('should display send telemetry when requesting enterprise trial', async () => {
+		const usersStore = useUsersStore(pinia);
+		vi.spyOn(usersStore, 'submitPersonalizationSurvey').mockResolvedValue();
+
+		const usageStore = useUsageStore(pinia);
+		const spyLicenseTrial = vi.spyOn(usageStore, 'requestEnterpriseLicenseTrial');
+
+		const wrapper = renderComponent();
+
+		await retry(() =>
+			expect(wrapper.container.querySelector('.modal-content')).toBeInTheDocument(),
+		);
+
+		const select = wrapper.container.querySelectorAll('.n8n-select')[3]!;
+		await fireEvent.click(select);
+
+		const item = select.querySelectorAll('.el-select-dropdown__item')[3];
+		await fireEvent.click(item);
+
+		const agreeCheckbox = wrapper.container.querySelector('.n8n-checkbox')!;
+		await fireEvent.click(agreeCheckbox);
+
+		const submitButton = wrapper.getByRole('button')!;
+		await userEvent.click(submitButton);
+
+		await retry(() => expect(spyLicenseTrial).toHaveBeenCalled());
+	});
 });