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.
This commit is contained in:
2025-12-11 13:50:21 +01:00
parent f60ef696de
commit 3bd101c1eb
2 changed files with 27 additions and 11 deletions

View File

@@ -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",

View File

@@ -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);
}