✔️ Updating ProjectSharing tests to handle new element ui dropdown …

…value logic
n8n-io · Aug 16, 2024 · f6b9816 · f6b9816
1 parent c14b149
commit f6b9816
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 8 deletions.
diff --git a/packages/editor-ui/src/__tests__/utils.ts b/packages/editor-ui/src/__tests__/utils.ts
@@ -84,3 +84,9 @@ export const getDropdownItems = async (dropdownTriggerParent: HTMLElement) => {
 
 	return selectDropdown.querySelectorAll('.el-select-dropdown__item');
 };
+
+export const getSelectedDropdownValue = async (items: NodeListOf<Element>) => {
+	const selectedItem = Array.from(items).find((item) => item.classList.contains('selected'));
+	expect(selectedItem).toBeInTheDocument();
+	return selectedItem?.querySelector('p')?.textContent?.trim();
+};
diff --git a/packages/editor-ui/src/components/Projects/ProjectSharing.test.ts b/packages/editor-ui/src/components/Projects/ProjectSharing.test.ts
@@ -1,7 +1,7 @@
 import { within } from '@testing-library/vue';
 import userEvent from '@testing-library/user-event';
 import { createComponentRenderer } from '@/__tests__/render';
-import { getDropdownItems } from '@/__tests__/utils';
+import { getDropdownItems, getSelectedDropdownValue } from '@/__tests__/utils';
 import { createProjectListItem, createProjectSharingData } from '@/__tests__/data/projects';
 import ProjectSharing from '@/components/Projects/ProjectSharing.vue';
 
@@ -102,8 +102,7 @@ describe('ProjectSharing', () => {
 		expect(projectSelectDropdownItems).toHaveLength(3);
 	});
 
-	// TODO: Fix this test
-	it.skip('should work as a simple select when model is not an array', async () => {
+	it('should work as a simple select when model is not an array', async () => {
 		const { getByTestId, queryByTestId, emitted } = renderComponent({
 			props: {
 				projects: teamProjects,
@@ -113,7 +112,6 @@ describe('ProjectSharing', () => {
 		expect(queryByTestId('project-sharing-owner')).not.toBeInTheDocument();
 
 		const projectSelect = getByTestId('project-sharing-select');
-		const projectSelectInput = projectSelect.querySelector('input') as HTMLInputElement;
 
 		// Get the dropdown items
 		let projectSelectDropdownItems = await getDropdownItems(projectSelect);
@@ -124,11 +122,13 @@ describe('ProjectSharing', () => {
 		expect(queryByTestId('project-sharing-list-item')).not.toBeInTheDocument();
 		projectSelectDropdownItems = await getDropdownItems(projectSelect);
 		expect(projectSelectDropdownItems).toHaveLength(3);
-		expect(projectSelectDropdownItems[0].textContent).toContain(projectSelectInput.value);
+
+		const selectedValue = await getSelectedDropdownValue(projectSelectDropdownItems);
+		expect(selectedValue).toBeTruthy();
 		expect(emitted()['update:modelValue']).toEqual([
 			[
 				expect.objectContaining({
-					name: projectSelectInput.value,
+					name: selectedValue,
 				}),
 			],
 		]);
@@ -137,12 +137,13 @@ describe('ProjectSharing', () => {
 		await userEvent.click(projectSelectDropdownItems[1]);
 		projectSelectDropdownItems = await getDropdownItems(projectSelect);
 		expect(projectSelectDropdownItems).toHaveLength(3);
-		expect(projectSelectDropdownItems[1].textContent).toContain(projectSelectInput.value);
+		const newSelectedValue = await getSelectedDropdownValue(projectSelectDropdownItems);
+		expect(newSelectedValue).toBeTruthy();
 		expect(emitted()['update:modelValue']).toEqual([
 			expect.any(Array),
 			[
 				expect.objectContaining({
-					name: projectSelectInput.value,
+					name: newSelectedValue,
 				}),
 			],
 		]);