fix: restore tooltips to units Multiselect (#33174)

Co-authored-by: Douglas Fabris <[email protected]>

.changeset/strong-rings-rush.md

@@ -0,0 +1,5 @@
+---
+"@rocket.chat/meteor": patch
+---
+
+Restored tooltips to the unit edit department field selected options

apps/meteor/client/omnichannel/units/UnitEdit.tsx

@@ -228,7 +228,7 @@ const UnitEdit = ({ unitData, unitMonitors, unitDepartments }: UnitEditProps) =>
 											value={value}
 											onChange={onChange}
 											onBlur={onBlur}
-											withTitle={false}
+											withTitle
 											filter={departmentsFilter}
 											setFilter={setDepartmentsFilter}
 											options={departmentsOptions}

apps/meteor/tests/e2e/omnichannel/omnichannel-units.spec.ts

@@ -185,11 +185,14 @@ test.describe('OC - Manage Units', () => {
 			await poOmnichannelUnits.btnSave.click();
 		});
 
-		await test.step('expect department to be in the chosen departments list', async () => {
+		await test.step('expect department to be in the chosen departments list and have title', async () => {
 			await poOmnichannelUnits.search(unit.name);
 			await poOmnichannelUnits.findRowByName(unit.name).click();
 			await expect(poOmnichannelUnits.contextualBar).toBeVisible();
-			await expect(page.getByRole('option', { name: department2.data.name })).toBeVisible();
+			await expect(poOmnichannelUnits.selectOptionChip(department2.data.name)).toBeVisible();
+			await poOmnichannelUnits.selectOptionChip(department2.data.name).hover();
+
+			await expect(page.getByRole('tooltip', { name: department2.data.name })).toBeVisible();
 			await poOmnichannelUnits.btnContextualbarClose.click();
 		});
 

apps/meteor/tests/e2e/page-objects/omnichannel-units.ts

@@ -43,6 +43,10 @@ export class OmnichannelUnits extends OmnichannelAdministration {
 		return this.page.locator(`[role=option][value="${name}"]`);
 	}
 
+	public selectOptionChip(name: string) {
+		return this.page.getByRole('option', { name });
+	}
+
 	async selectDepartment({ name, _id }: { name: string; _id: string }) {
 		await this.inputDepartments.click();
 		await this.inputDepartments.fill(name);

packages/ui-client/src/components/TooltipComponent.tsx

@@ -12,7 +12,7 @@ export const TooltipComponent = ({ title, anchor }: TooltipComponentProps): Reac
 
 	return (
 		<PositionAnimated anchor={ref} placement='top-middle' margin={8} visible={AnimatedVisibility.UNHIDING}>
-			<Tooltip>{title}</Tooltip>
+			<Tooltip role='tooltip'>{title}</Tooltip>
 		</PositionAnimated>
 	);
 };