diff --git a/apps/ui/src/components/layout/project-switcher/components/project-switcher-item.tsx b/apps/ui/src/components/layout/project-switcher/components/project-switcher-item.tsx index c1a2fa26..d269001e 100644 --- a/apps/ui/src/components/layout/project-switcher/components/project-switcher-item.tsx +++ b/apps/ui/src/components/layout/project-switcher/components/project-switcher-item.tsx @@ -37,10 +37,28 @@ export function ProjectSwitcherItem({ const IconComponent = getIconComponent(); const hasCustomIcon = !!project.customIconPath; + // Create a sanitized project name for test ID: + // - Convert to lowercase + // - Replace spaces with hyphens + // - Remove all non-alphanumeric characters except hyphens + // - Collapse multiple hyphens into single hyphen + // - Trim leading/trailing hyphens + const sanitizedName = project.name + .toLowerCase() + .replace(/\s+/g, '-') + .replace(/[^a-z0-9-]/g, '') + .replace(/-+/g, '-') + .replace(/^-|-$/g, ''); + + // Combine project.id with sanitized name for uniqueness and readability + // Format: project-switcher-{id}-{sanitizedName} + const testId = `project-switcher-${project.id}-${sanitizedName}`; + return (