Fix interoperability issue regarding Event properties (#36386)

* Fix interoperability issue regarding Event properties

- make possible to re-set read-only event properties
- use hydrateObj() to set delegateTarget property

Fixes #36207

Co-authored-by: GeoSot <[email protected]>
Co-authored-by: Julien Déramond <[email protected]>

1 files changed, 12 insertions, 7 deletions

diff --git a/js/src/dom/event-handler.js b/js/src/dom/event-handler.js
index 87f936b41..0aa628c66 100644
--- a/js/src/dom/event-handler.js
+++ b/js/src/dom/event-handler.js
@@ -89,7 +89,7 @@ function getElementEvents(element) {
 
 function bootstrapHandler(element, fn) {
   return function handler(event) {
-    event.delegateTarget = element
+    hydrateObj(event, { delegateTarget: element })
 
     if (handler.oneOff) {
       EventHandler.off(element, event.type, fn)
@@ -109,7 +109,7 @@ function bootstrapDelegationHandler(element, selector, fn) {
           continue
         }
 
-        event.delegateTarget = target
+        hydrateObj(event, { delegateTarget: target })
 
         if (handler.oneOff) {
           EventHandler.off(element, event.type, selector, fn)
@@ -302,11 +302,16 @@ const EventHandler = {
 
 function hydrateObj(obj, meta) {
   for (const [key, value] of Object.entries(meta || {})) {
-    Object.defineProperty(obj, key, {
-      get() {
-        return value
-      }
-    })
+    try {
+      obj[key] = value
+    } catch {
+      Object.defineProperty(obj, key, {
+        configurable: true,
+        get() {
+          return value
+        }
+      })
+    }
   }
 
   return obj