fix(widget): add a threshold for the widget height

cowprotocol · Nov 10, 2023 · 3e72764 · 3e72764
1 parent c202eb0
commit 3e72764
Showing 1 changed file with 9 additions and 1 deletion.
diff --git 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
   })
 }