test: Test workflow and credential card for Move action visibility

packages/editor-ui/src/components/CredentialCard.test.ts

@@ -1,9 +1,12 @@
 import { setActivePinia } from 'pinia';
+import { waitFor, within } from '@testing-library/vue';
+import userEvent from '@testing-library/user-event';
 import { createTestingPinia } from '@pinia/testing';
 import { createComponentRenderer } from '@/__tests__/render';
 import CredentialCard from '@/components/CredentialCard.vue';
 import type { ICredentialsResponse } from '@/Interface';
 import type { ProjectSharingData } from '@/types/projects.types';
+import { useSettingsStore } from '@/stores/settings.store';
 
 const renderComponent = createComponentRenderer(CredentialCard);
 
@@ -19,9 +22,12 @@ const createCredential = (overrides = {}): ICredentialsResponse => ({
 });
 
 describe('CredentialCard', () => {
+	let settingsStore: ReturnType<typeof useSettingsStore>;
+
 	beforeEach(() => {
 		const pinia = createTestingPinia();
 		setActivePinia(pinia);
+		settingsStore = useSettingsStore();
 	});
 
 	it('should render name and home project name', () => {
@@ -55,4 +61,31 @@ describe('CredentialCard', () => {
 		expect(heading).toHaveTextContent(data.name);
 		expect(badge).toHaveTextContent('John Doe');
 	});
+
+	it('should show Move action only if there is resource permission and not on community plan', async () => {
+		vi.spyOn(settingsStore, 'planName', 'get').mockReturnValue('Enterprise');
+
+		const data = createCredential({
+			scopes: ['credential:move'],
+		});
+		const { getByTestId } = renderComponent({ props: { data } });
+		const cardActions = getByTestId('credential-card-actions');
+
+		expect(cardActions).toBeInTheDocument();
+
+		const cardActionsOpener = within(cardActions).getByRole('button');
+		expect(cardActionsOpener).toBeInTheDocument();
+
+		const controllingId = cardActionsOpener.getAttribute('aria-controls');
+
+		await userEvent.click(cardActions);
+		const actions = document.querySelector(`#${controllingId}`);
+		if (!actions) {
+			throw new Error('Actions menu not found');
+		}
+		await waitFor(() => {
+			expect(actions).toBeInTheDocument();
+		});
+		expect(actions).toHaveTextContent('Move');
+	});
 });

packages/editor-ui/src/components/WorkflowCard.test.ts

@@ -7,6 +7,7 @@ import { VIEWS } from '@/constants';
 import WorkflowCard from '@/components/WorkflowCard.vue';
 import type { IWorkflowDb } from '@/Interface';
 import { useRouter } from 'vue-router';
+import { useSettingsStore } from '@/stores/settings.store';
 
 vi.mock('vue-router', () => {
 	const push = vi.fn();
@@ -39,12 +40,14 @@ describe('WorkflowCard', () => {
 	let pinia: ReturnType<typeof createPinia>;
 	let windowOpenSpy: MockInstance;
 	let router: ReturnType<typeof useRouter>;
+	let settingsStore: ReturnType<typeof useSettingsStore>;
 
 	beforeEach(async () => {
 		pinia = createPinia();
 		setActivePinia(pinia);
 		router = useRouter();
-		windowOpenSpy = vi.spyOn(window, 'open');
+		settingsStore = useSettingsStore();
+		windowOpenSpy = vi.spyOn(window, 'open').mockImplementation(() => null);
 	});
 
 	afterEach(() => {
@@ -95,10 +98,14 @@ describe('WorkflowCard', () => {
 		});
 
 		const actions = document.querySelector(`#${controllingId}`);
+		if (!actions) {
+			throw new Error('Actions menu not found');
+		}
 		await waitFor(() => {
 			expect(actions).toBeInTheDocument();
 		});
-		await userEvent.click(actions!.querySelectorAll('li')[0]);
+		await userEvent.click(actions.querySelectorAll('li')[0]);
+		expect(actions).not.toHaveTextContent('Move');
 		await waitFor(() => {
 			expect(router.push).toHaveBeenCalledWith({
 				name: VIEWS.WORKFLOW,
@@ -138,4 +145,31 @@ describe('WorkflowCard', () => {
 		expect(heading).toHaveTextContent(data.name);
 		expect(badge).toHaveTextContent('John Doe');
 	});
+
+	it('should show Move action only if there is resource permission and not on community plan', async () => {
+		vi.spyOn(settingsStore, 'planName', 'get').mockReturnValue('Enterprise');
+
+		const data = createWorkflow({
+			scopes: ['workflow:move'],
+		});
+		const { getByTestId } = renderComponent({ props: { data } });
+		const cardActions = getByTestId('workflow-card-actions');
+
+		expect(cardActions).toBeInTheDocument();
+
+		const cardActionsOpener = within(cardActions).getByRole('button');
+		expect(cardActionsOpener).toBeInTheDocument();
+
+		const controllingId = cardActionsOpener.getAttribute('aria-controls');
+
+		await userEvent.click(cardActions);
+		const actions = document.querySelector(`#${controllingId}`);
+		if (!actions) {
+			throw new Error('Actions menu not found');
+		}
+		await waitFor(() => {
+			expect(actions).toBeInTheDocument();
+		});
+		expect(actions).toHaveTextContent('Move');
+	});
 });