test: Add Edit Fields node helper and tests (#18726)

2025-12-17 18:12:04 +00:00 · 2025-08-25 12:08:46 +01:00
parent 0a4c3c3b53
commit b62c957c71
3 changed files with 163 additions and 0 deletions
--- a/packages/testing/playwright/pages/nodes/EditFieldsNode.ts
+++ b/packages/testing/playwright/pages/nodes/EditFieldsNode.ts
@@ -0,0 +1,111 @@
+import type { Locator, Page } from '@playwright/test';
+
+import { BasePage } from '../BasePage';
+
+export class EditFieldsNode extends BasePage {
+	constructor(page: Page) {
+		super(page);
+	}
+
+	async setFieldsValues(
+		fields: Array<{
+			name: string;
+			type: 'string' | 'number' | 'boolean' | 'array' | 'object';
+			value: string | number | boolean;
+		}>,
+		paramName = 'assignments',
+	): Promise<void> {
+		const container = this.page.getByTestId(`assignment-collection-${paramName}`);
+
+		for (let i = 0; i < fields.length; i++) {
+			await this.ensureFieldExists(container, i);
+			const assignment = container.getByTestId('assignment').nth(i);
+
+			await this.setFieldName(assignment, fields[i].name);
+			await this.setFieldType(assignment, fields[i].type);
+			await this.setFieldValue(assignment, fields[i].type, fields[i].value);
+		}
+	}
+
+	async setSingleFieldValue(
+		name: string,
+		type: 'string' | 'number' | 'boolean' | 'array' | 'object',
+		value: string | number | boolean,
+		paramName = 'assignments',
+	): Promise<void> {
+		await this.setFieldsValues([{ name, type, value }], paramName);
+	}
+
+	private async ensureFieldExists(container: Locator, index: number): Promise<void> {
+		if (index > 0) {
+			await container.getByTestId('assignment-collection-drop-area').click();
+			await container.getByTestId('assignment').nth(index).waitFor({ state: 'visible' });
+		} else {
+			const existingFields = await container.getByTestId('assignment').count();
+			if (existingFields === 0) {
+				await container.getByTestId('assignment-collection-drop-area').click();
+				await container.getByTestId('assignment').first().waitFor({ state: 'visible' });
+			}
+		}
+	}
+
+	private async setFieldName(assignment: Locator, name: string): Promise<void> {
+		const nameInput = assignment.getByTestId('assignment-name').getByRole('textbox');
+		await nameInput.waitFor({ state: 'visible' });
+		await nameInput.fill(name);
+		await nameInput.blur();
+	}
+
+	private async setFieldType(assignment: Locator, type: string): Promise<void> {
+		const typeSelect = assignment.getByTestId('assignment-type-select');
+		await typeSelect.waitFor({ state: 'visible' });
+		await typeSelect.click();
+
+		const typeOptionText = this.getTypeOptionText(type);
+		const option = this.page.getByRole('option', { name: typeOptionText });
+		await option.waitFor({ state: 'visible' });
+		await option.click();
+	}
+
+	private async setFieldValue(
+		assignment: Locator,
+		type: string,
+		value: string | number | boolean,
+	): Promise<void> {
+		const valueContainer = assignment.getByTestId('assignment-value');
+		await valueContainer.waitFor({ state: 'visible' });
+
+		if (type === 'boolean') {
+			await this.setBooleanValue(valueContainer, value as boolean);
+		} else {
+			await this.setTextValue(valueContainer, String(value));
+		}
+	}
+
+	private getTypeOptionText(type: string): string {
+		const typeMap = new Map([
+			['string', 'String'],
+			['number', 'Number'],
+			['boolean', 'Boolean'],
+			['array', 'Array'],
+			['object', 'Object'],
+		]);
+		return typeMap.get(type) ?? 'String';
+	}
+
+	private async setTextValue(valueContainer: Locator, value: string): Promise<void> {
+		const input = valueContainer
+			.getByRole('textbox')
+			.or(valueContainer.locator('input, textarea, [contenteditable]').first());
+		await input.waitFor({ state: 'visible' });
+		await input.fill(value);
+	}
+
+	private async setBooleanValue(valueContainer: Locator, value: boolean): Promise<void> {
+		await valueContainer.click();
+		const booleanValue = value ? 'True' : 'False';
+		const option = this.page.getByRole('option', { name: booleanValue });
+		await option.waitFor({ state: 'visible' });
+		await option.click();
+	}
+}