From 3e72764c9182c40d177aa78f8a09fc6b1eb735a6 Mon Sep 17 00:00:00 2001 From: Alexandr Kazachenko Date: Fri, 10 Nov 2023 14:51:57 +0600 Subject: [PATCH] fix(widget): add a threshold for the widget height --- libs/widget-lib/src/cowSwapWidget.ts | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/libs/widget-lib/src/cowSwapWidget.ts b/libs/widget-lib/src/cowSwapWidget.ts index d48fff6555..173c68c135 100644 --- a/libs/widget-lib/src/cowSwapWidget.ts +++ b/libs/widget-lib/src/cowSwapWidget.ts @@ -10,6 +10,14 @@ const COW_SWAP_WIDGET_EVENT_KEY = 'cowSwapWidget' const DEFAULT_HEIGHT = '640px' const DEFAULT_WIDTH = '450px' +/** + * Reference: IframeResizer (apps/cowswap-frontend/src/modules/injectedWidget/updaters/IframeResizer.ts) + * Sometimes MutationObserver doesn't trigger when the height of the widget changes and the widget displays with a scrollbar. + * To avoid this we add a threshold to the height. + * 20px + */ +const HEIGHT_THRESHOLD = 20 + /** * Callback function signature for updating the CoW Swap Widget. */ @@ -126,6 +134,6 @@ function applyDynamicHeight(iframe: HTMLIFrameElement, defaultHeight = DEFAULT_H return } - iframe.style.height = event.data.height ? `${event.data.height}px` : defaultHeight + iframe.style.height = event.data.height ? `${event.data.height + HEIGHT_THRESHOLD}px` : defaultHeight }) }