From 461caa1a63f5196a6f4e3e7b89d05433e26fadd9 Mon Sep 17 00:00:00 2001 From: Jacques Ikot Date: Tue, 11 Feb 2025 04:43:29 +0100 Subject: [PATCH 1/2] feat: Improve Tooltip component with preventOverflow and flip modifiers --- .../design-system/widgets-old/src/Tooltip/index.tsx | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/app/client/packages/design-system/widgets-old/src/Tooltip/index.tsx b/app/client/packages/design-system/widgets-old/src/Tooltip/index.tsx index 8555bc1cb1e5..912156e5cf5d 100644 --- a/app/client/packages/design-system/widgets-old/src/Tooltip/index.tsx +++ b/app/client/packages/design-system/widgets-old/src/Tooltip/index.tsx @@ -76,7 +76,13 @@ if (!portalContainer) { function TooltipComponent(props: TooltipProps) { const modifiers = useMemo( () => ({ - preventOverflow: { enabled: false }, + preventOverflow: { + enabled: true, + boundariesElement: "viewport", + }, + flip: { + enabled: true, + }, ...props.modifiers, }), [props.modifiers], From 1f20716e5ad8bc3fff67da40e43a245ca8a0890f Mon Sep 17 00:00:00 2001 From: Jacques Ikot Date: Thu, 13 Feb 2025 11:00:21 +0100 Subject: [PATCH 2/2] test: Add tooltip icon overflow check in Input widget test --- .../e2e/Regression/ClientSide/Widgets/Input/Input3_Spec.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/app/client/cypress/e2e/Regression/ClientSide/Widgets/Input/Input3_Spec.ts b/app/client/cypress/e2e/Regression/ClientSide/Widgets/Input/Input3_Spec.ts index 18d754517aa4..d5d7bbc7d45c 100644 --- a/app/client/cypress/e2e/Regression/ClientSide/Widgets/Input/Input3_Spec.ts +++ b/app/client/cypress/e2e/Regression/ClientSide/Widgets/Input/Input3_Spec.ts @@ -104,6 +104,7 @@ describe( ); agHelper.HoverElement(locators._tooltipIcon); agHelper.AssertPopoverTooltip("Input tooltip"); + agHelper.AssertCSS(locators._tooltipIcon, "overflow", "hidden"); agHelper.ClearNType( locators._widgetInDeployed(draggableWidgets.INPUT_V2) + " textarea", "test",