From 6f138fc6a7cbbd09a7922738aabfe99b91f70bbd Mon Sep 17 00:00:00 2001 From: Abdelhafidh Belalia <16493223+s77rt@users.noreply.github.com> Date: Wed, 29 Mar 2023 20:06:28 +0100 Subject: [PATCH 1/3] Render text freely for measurement --- src/styles/getTooltipStyles.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/styles/getTooltipStyles.js b/src/styles/getTooltipStyles.js index cb024f98d6b0..52a896f787ca 100644 --- a/src/styles/getTooltipStyles.js +++ b/src/styles/getTooltipStyles.js @@ -194,6 +194,10 @@ export default function getTooltipStyles( fontSize: tooltipFontSize, overflow: 'hidden', lineHeight: variables.lineHeightSmall, + + // To correctly measure the text width it should be rendered freely and not to be bound with parent's width. + // More info: https://github.com/Expensify/App/issues/15949#issuecomment-1483011998 + whiteSpace: tooltipContentWidth ? undefined : 'pre', }, pointerWrapperStyle: { position: 'fixed', From ecd1e19f85803f6e9f97567512c53de84fe04bfe Mon Sep 17 00:00:00 2001 From: Abdelhafidh Belalia <16493223+s77rt@users.noreply.github.com> Date: Wed, 29 Mar 2023 20:35:10 +0100 Subject: [PATCH 2/3] Update comment --- src/styles/getTooltipStyles.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/styles/getTooltipStyles.js b/src/styles/getTooltipStyles.js index 52a896f787ca..b67ff6b6bf88 100644 --- a/src/styles/getTooltipStyles.js +++ b/src/styles/getTooltipStyles.js @@ -195,7 +195,7 @@ export default function getTooltipStyles( overflow: 'hidden', lineHeight: variables.lineHeightSmall, - // To correctly measure the text width it should be rendered freely and not to be bound with parent's width. + // To measure tooltip text width correctly we render it freely i.e. text should not wrap to parent's boundaries. // More info: https://github.com/Expensify/App/issues/15949#issuecomment-1483011998 whiteSpace: tooltipContentWidth ? undefined : 'pre', }, From aab0765a5cdf3f4a7a36196969c39675127adff3 Mon Sep 17 00:00:00 2001 From: Abdelhafidh Belalia <16493223+s77rt@users.noreply.github.com> Date: Thu, 30 Mar 2023 16:47:09 +0100 Subject: [PATCH 3/3] Update src/styles/getTooltipStyles.js Co-authored-by: Eugene Voloshchak --- src/styles/getTooltipStyles.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/styles/getTooltipStyles.js b/src/styles/getTooltipStyles.js index b67ff6b6bf88..62b61cabcd87 100644 --- a/src/styles/getTooltipStyles.js +++ b/src/styles/getTooltipStyles.js @@ -197,7 +197,7 @@ export default function getTooltipStyles( // To measure tooltip text width correctly we render it freely i.e. text should not wrap to parent's boundaries. // More info: https://github.com/Expensify/App/issues/15949#issuecomment-1483011998 - whiteSpace: tooltipContentWidth ? undefined : 'pre', + ...(tooltipContentWidth ? {} : styles.pre), }, pointerWrapperStyle: { position: 'fixed',