From 75270e01b1b129ff74afda3184fded8fe9b61476 Mon Sep 17 00:00:00 2001
From: codewithvk <vivek.javiya@collabora.com>
Date: Mon, 19 May 2025 13:44:30 +0530
Subject: [PATCH] fix(CoolFrame): Init and accept postMessage for setting
 iframe height

Signed-off-by: codewithvk <vivek.javiya@collabora.com>
---
 src/components/CoolFrame.vue | 27 ++++++++++++++++++++++++++-
 1 file changed, 26 insertions(+), 1 deletion(-)

diff --git a/src/components/CoolFrame.vue b/src/components/CoolFrame.vue
index f2e18f4c67..a8e3e00ce8 100644
--- a/src/components/CoolFrame.vue
+++ b/src/components/CoolFrame.vue
@@ -28,6 +28,7 @@
 
 import { generateCSSVarTokens, getUITheme } from '../helpers/coolParameters.js'
 import { languageToBCP47 } from '../helpers/index.js'
+import PostMessageService from '../services/postMessage.tsx'
 
 export default {
 	name: 'CoolFrame',
@@ -60,9 +61,15 @@ export default {
 			cssVariables: generateCSSVarTokens(),
 			isIframeLoaded: false,
 			uiTheme: getUITheme(),
+			postMessage: null,
 		}
 	},
 	mounted() {
+		this.postMessage = new PostMessageService({
+			parent: window.parent,
+		})
+		window.addEventListener('message', this.handlePostMessage)
+
 		if (this.iframeUrl.length > 0) {
 			this.formAction = this.iframeUrl + '?lang=' + languageToBCP47()
 			this.isIframeLoaded = true
@@ -79,6 +86,22 @@ export default {
 			}
 		})
 	},
+	beforeDestroy() {
+		window.removeEventListener('message', this.handlePostMessage)
+	},
+	methods: {
+		handlePostMessage(event) {
+			try {
+				const data = event.data
+				if (data.MessageId === 'Iframe_Height') {
+					document.getElementById(this.iframeName).height = data.Values.ContentHeight
+				}
+			} catch (e) {
+				console.error('Something went wrong with post message', e)
+			}
+		},
+	},
+
 }
 </script>
 
@@ -86,7 +109,9 @@ export default {
   .cool-frame-iframe {
     width: 100%;
     border: none;
-	height: 2000px;
 	overflow-y: auto;
+	box-sizing: border-box;
+	padding: 0;
+	margin: 0;
   }
   </style>