From 3bd101c1ebfe52a3c2ca78eefa437723b6bb057a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Julien=20Fastr=C3=A9?= <julien.fastre@champs-libres.coop>
Date: Thu, 11 Dec 2025 13:50:21 +0100
Subject: [PATCH] Migrate editor script to TypeScript and enhance iframe
 configuration

- Renamed `index.js` to `index.ts` and updated references in the webpack configuration.
- Introduced TypeScript-specific improvements, including type annotations and stricter null checks.
- Enhanced iframe `allow` attributes to support clipboard and fullscreen permissions.
- Improved error handling for message data parsing.
---
 .../ChillWopiBundle/chill.webpack.config.js   |  2 +-
 .../public/page/editor/{index.js => index.ts} | 36 +++++++++++++------
 2 files changed, 27 insertions(+), 11 deletions(-)
 rename src/Bundle/ChillWopiBundle/src/Resources/public/page/editor/{index.js => index.ts} (52%)

diff --git a/src/Bundle/ChillWopiBundle/chill.webpack.config.js b/src/Bundle/ChillWopiBundle/chill.webpack.config.js
index 05c231f68..8580597cc 100644
--- a/src/Bundle/ChillWopiBundle/chill.webpack.config.js
+++ b/src/Bundle/ChillWopiBundle/chill.webpack.config.js
@@ -2,7 +2,7 @@
 module.exports = function (encore, entries) {
   encore.addEntry(
     "page_wopi_editor",
-    __dirname + "/src/Resources/public/page/editor/index.js",
+    __dirname + "/src/Resources/public/page/editor/index.ts",
   );
   encore.addEntry(
     "mod_reload_page",
diff --git a/src/Bundle/ChillWopiBundle/src/Resources/public/page/editor/index.js b/src/Bundle/ChillWopiBundle/src/Resources/public/page/editor/index.ts
similarity index 52%
rename from src/Bundle/ChillWopiBundle/src/Resources/public/page/editor/index.js
rename to src/Bundle/ChillWopiBundle/src/Resources/public/page/editor/index.ts
index d946977df..8b5c4146a 100644
--- a/src/Bundle/ChillWopiBundle/src/Resources/public/page/editor/index.js
+++ b/src/Bundle/ChillWopiBundle/src/Resources/public/page/editor/index.ts
@@ -1,8 +1,11 @@
-require("./index.scss");
+import "./index.scss";
+
+// Provided by the server-side template
+declare const editor_url: string;
 
 window.addEventListener("DOMContentLoaded", function () {
-  let frameholder = document.getElementById("frameholder");
-  let office_frame = document.createElement("iframe");
+  const frameholder = document.getElementById("frameholder");
+  const office_frame = document.createElement("iframe");
   office_frame.name = "office_frame";
   office_frame.id = "office_frame";
 
@@ -18,19 +21,32 @@ window.addEventListener("DOMContentLoaded", function () {
     "sandbox",
     "allow-downloads allow-scripts allow-same-origin allow-forms allow-modals allow-popups allow-top-navigation allow-popups-to-escape-sandbox",
   );
-  frameholder.appendChild(office_frame);
 
-  document.getElementById("office_form").submit();
+  office_frame.setAttribute(
+      "allow",
+      "clipboard-read *; clipboard-write *; fullscreen *"
+  );
+  if (frameholder) {
+    frameholder.appendChild(office_frame);
+  }
+
+  const officeForm = document.getElementById("office_form") as HTMLFormElement | null;
+  officeForm?.submit();
 
   const url = new URL(editor_url);
   const editor_domain = url.origin;
 
-  window.addEventListener("message", function (message) {
+  window.addEventListener("message", function (message: MessageEvent) {
     if (message.origin !== editor_domain) {
       return;
     }
 
-    let data = JSON.parse(message.data);
+    let data: any;
+    try {
+      data = typeof message.data === "string" ? JSON.parse(message.data) : message.data;
+    } catch (_e) {
+      return;
+    }
 
     if ("UI_Close" === data.MessageId) {
       closeEditor();
@@ -38,9 +54,9 @@ window.addEventListener("DOMContentLoaded", function () {
   });
 });
 
-function closeEditor() {
-  let params = new URLSearchParams(window.location.search),
-    returnPath = params.get("returnPath");
+function closeEditor(): void {
+  const params = new URLSearchParams(window.location.search);
+  const returnPath = params.get("returnPath") ?? "/";
 
   window.location.assign(returnPath);
 }