Rename and convert to ts entry-iframe script

site/source/entry-iframe.ts

@@ -10,10 +10,16 @@
  **/
 
 import { hexToHSL } from './hexToHSL'
+// @ts-ignore ignore file not exist error
 import simulationData from './public/simulation-data-title.json'
 
 const script = document.currentScript
-const moduleName = script.dataset.module || 'simulateur-embauche'
+if (!script) {
+	throw new Error('document.currentScript is null or undefined')
+}
+const moduleName =
+	(script.dataset.module as keyof typeof simulationData | undefined) ||
+	'salarié'
 
 const moduleData = simulationData[moduleName]
 
@@ -30,10 +36,10 @@ const src = new URL(
 		? import.meta.env.VITE_FR_BASE_URL
 		: import.meta.env.VITE_EN_BASE_URL) +
 		'/iframes/' +
-		moduleName
+		(moduleName as string)
 )
 
-src.searchParams.set('iframe', true)
+src.searchParams.set('iframe', 'true')
 src.searchParams.set(
 	'integratorUrl',
 	encodeURIComponent(window.location.href.toString())
@@ -49,13 +55,16 @@ const iframeAttributes = {
 	src: src.toString(),
 	style: 'border: none; width: 100%; display: block; height: 700px',
 	allow: 'clipboard-write',
-	allowfullscreen: true,
-	webkitallowfullscreen: true,
-	mozallowfullscreen: true,
+	allowfullscreen: 'true',
+	webkitallowfullscreen: 'true',
+	mozallowfullscreen: 'true',
 	title: moduleIframeTitle,
 }
-for (var key in iframeAttributes) {
-	iframe.setAttribute(key, iframeAttributes[key])
+for (const key in iframeAttributes) {
+	iframe.setAttribute(
+		key,
+		iframeAttributes[key as keyof typeof iframeAttributes]
+	)
 }
 
 const links = document.createElement('div')
@@ -67,7 +76,10 @@ const moduleToSitePath = {
 }
 
 const simulateurLink =
-	import.meta.env.VITE_FR_BASE_URL + (moduleToSitePath[moduleName] ?? '/')
+	import.meta.env.VITE_FR_BASE_URL +
+	(moduleName in moduleToSitePath
+		? moduleToSitePath[moduleName as keyof typeof moduleToSitePath]
+		: '/')
 
 const url = new URL(simulateurLink)
 
@@ -91,15 +103,18 @@ links.innerHTML = `
 script.before(iframe)
 script.before(links)
 
-window.addEventListener('message', function (evt) {
-	if (evt.data.kind === 'resize-height') {
-		iframe.style.height = evt.data.value + 'px'
+window.addEventListener(
+	'message',
+	function (evt: MessageEvent<{ kind: string; value: number }>) {
+		if (evt.data.kind === 'resize-height') {
+			iframe.style.height = `${evt.data.value}px`
+		}
+		if (evt.data.kind === 'get-offset') {
+			const iframePosition = iframe.getBoundingClientRect()
+			iframe.contentWindow?.postMessage(
+				{ kind: 'offset', value: Math.max(iframePosition.top * -1, 0) },
+				'*'
+			)
+		}
 	}
-	if (evt.data.kind === 'get-offset') {
-		const iframePosition = iframe.getBoundingClientRect()
-		iframe.contentWindow?.postMessage(
-			{ kind: 'offset', value: Math.max(iframePosition.top * -1, 0) },
-			'*'
-		)
-	}
-})
+)

site/source/pages/integration/Iframe.tsx

@@ -79,9 +79,9 @@ function IntegrationCustomizer() {
 	useEffect(() => {
 		window.addEventListener(
 			'message',
-			function (evt: MessageEvent<{ kind: string; value: string }>) {
+			function (evt: MessageEvent<{ kind: string; value: number }>) {
 				if (iframeRef.current && evt.data.kind === 'resize-height') {
-					iframeRef.current.style.height = evt.data.value + 'px'
+					iframeRef.current.style.height = `${evt.data.value}px`
 				}
 			}
 		)

site/vite-iframe-script.config.ts

@@ -9,7 +9,7 @@ export default defineConfig({
 	},
 	build: {
 		lib: {
-			entry: './source/iframe-integration-script.js',
+			entry: './source/entry-iframe.ts',
 			name: 'monEntrepriseIframe',
 			formats: ['iife'],
 			fileName: () => 'simulateur-iframe-integration.js',