@remote-dom/polyfill 1.4.5 → 1.4.7

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @remote-dom/polyfill
 
+## 1.4.7
+
+### Patch Changes
+
+- [#594](https://github.com/Shopify/remote-dom/pull/594) [`789a7c7`](https://github.com/Shopify/remote-dom/commit/789a7c7480a445d1e5973bd6e2aa4e8889ec6f85) Thanks [@robin-drexler](https://github.com/robin-drexler)! - add `FocusEvent`, `ClipboardEvent` and `ToggleEvent` to polyfill
+
+## 1.4.6
+
+### Patch Changes
+
+- [#590](https://github.com/Shopify/remote-dom/pull/590) [`8994a49`](https://github.com/Shopify/remote-dom/commit/8994a49913cd0122fdfbd21f971448afab3a3207) Thanks [@robin-drexler](https://github.com/robin-drexler)! - fix error events not working
+
 ## 1.4.5
 
 ### Patch Changes

package/build/cjs/ClipboardEvent.cjs

@@ -0,0 +1,15 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const Event = require('./Event.cjs');
+
+// https://w3c.github.io/clipboard-apis/#clipboardevent-interface
+class ClipboardEvent extends Event.Event {
+  constructor(type, eventInitDict = {}) {
+    super(type, eventInitDict);
+    this.clipboardData = eventInitDict.clipboardData ?? null;
+  }
+}
+
+exports.ClipboardEvent = ClipboardEvent;

package/build/cjs/ErrorEvent.cjs

@@ -0,0 +1,19 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const Event = require('./Event.cjs');
+
+// https://html.spec.whatwg.org/multipage/webappapis.html#errorevent
+class ErrorEvent extends Event.Event {
+  constructor(type, eventInitDict) {
+    super(type, eventInitDict);
+    this.message = eventInitDict.message;
+    this.filename = eventInitDict.filename;
+    this.lineno = eventInitDict.lineno;
+    this.colno = eventInitDict.colno;
+    this.error = eventInitDict.error;
+  }
+}
+
+exports.ErrorEvent = ErrorEvent;

package/build/cjs/FocusEvent.cjs

@@ -0,0 +1,15 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const Event = require('./Event.cjs');
+
+// https://w3c.github.io/uievents/#interface-focusevent
+class FocusEvent extends Event.Event {
+  constructor(type, eventInitDict = {}) {
+    super(type, eventInitDict);
+    this.relatedTarget = eventInitDict.relatedTarget ?? null;
+  }
+}
+
+exports.FocusEvent = FocusEvent;

package/build/cjs/PromiseRejectionEvent.cjs

@@ -0,0 +1,16 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const Event = require('./Event.cjs');
+
+//https://html.spec.whatwg.org/multipage/webappapis.html#promiserejectionevent
+class PromiseRejectionEvent extends Event.Event {
+  constructor(type, eventInitDict) {
+    super(type, eventInitDict);
+    this.promise = eventInitDict.promise;
+    this.reason = eventInitDict.reason;
+  }
+}
+
+exports.PromiseRejectionEvent = PromiseRejectionEvent;

package/build/cjs/ToggleEvent.cjs

@@ -0,0 +1,16 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const Event = require('./Event.cjs');
+
+// https://html.spec.whatwg.org/multipage/popover.html#toggleevent
+class ToggleEvent extends Event.Event {
+  constructor(type, eventInitDict) {
+    super(type, eventInitDict);
+    this.oldState = eventInitDict.oldState;
+    this.newState = eventInitDict.newState;
+  }
+}
+
+exports.ToggleEvent = ToggleEvent;

package/build/cjs/Window.cjs

@@ -6,6 +6,11 @@ const Document = require('./Document.cjs');
 const Event = require('./Event.cjs');
 const EventTarget = require('./EventTarget.cjs');
 const CustomEvent = require('./CustomEvent.cjs');
+const ErrorEvent = require('./ErrorEvent.cjs');
+const PromiseRejectionEvent = require('./PromiseRejectionEvent.cjs');
+const ToggleEvent = require('./ToggleEvent.cjs');
+const FocusEvent = require('./FocusEvent.cjs');
+const ClipboardEvent = require('./ClipboardEvent.cjs');
 const Node = require('./Node.cjs');
 const ParentNode = require('./ParentNode.cjs');
 const ChildNode = require('./ChildNode.cjs');
@@ -33,6 +38,11 @@ class Window extends EventTarget.EventTarget {
   location = (() => globalThis.location)();
   navigator = (() => globalThis.navigator)();
   Event = (() => Event.Event)();
+  ErrorEvent = (() => ErrorEvent.ErrorEvent)();
+  PromiseRejectionEvent = (() => PromiseRejectionEvent.PromiseRejectionEvent)();
+  ToggleEvent = (() => ToggleEvent.ToggleEvent)();
+  FocusEvent = (() => FocusEvent.FocusEvent)();
+  ClipboardEvent = (() => ClipboardEvent.ClipboardEvent)();
   EventTarget = (() => EventTarget.EventTarget)();
   CustomEvent = (() => CustomEvent.CustomEvent)();
   Node = (() => Node.Node)();
@@ -48,6 +58,46 @@ class Window extends EventTarget.EventTarget {
   SVGElement = (() => SVGElement.SVGElement)();
   HTMLTemplateElement = (() => HTMLTemplateElement.HTMLTemplateElement)();
   MutationObserver = (() => MutationObserver.MutationObserver)();
+  #currentOnErrorHandler = null;
+  #currentOriginalOnErrorHandler = null;
+  #currentOnUnhandledRejectionHandler = null;
+  get onerror() {
+    return this.#currentOriginalOnErrorHandler;
+  }
+  set onerror(handler) {
+    if (this.#currentOnErrorHandler) {
+      this.removeEventListener('error', this.#currentOnErrorHandler);
+    }
+    if (handler && typeof handler === 'function') {
+      // the event listener version receives an event object
+      // whereas winwow.onerror receives 5 arguments instead
+      // we need to wrap the handler to convert the event object to the 5 arguments
+      // and also make sure that when window.onerror is read to return the original handler
+      // https://developer.mozilla.org/en-US/docs/Web/API/Window/error_event#syntax
+      this.#currentOriginalOnErrorHandler = handler;
+      this.#currentOnErrorHandler = event => {
+        handler(event.message ?? 'Error', event.filename, event.lineno, event.colno, event.error);
+      };
+      this.addEventListener('error', this.#currentOnErrorHandler);
+    } else {
+      this.#currentOnErrorHandler = null;
+      this.#currentOriginalOnErrorHandler = null;
+    }
+  }
+  get onunhandledrejection() {
+    return this.#currentOnUnhandledRejectionHandler;
+  }
+  set onunhandledrejection(handler) {
+    if (this.#currentOnUnhandledRejectionHandler) {
+      this.removeEventListener('unhandledrejection', this.#currentOnUnhandledRejectionHandler);
+    }
+    if (handler && typeof handler === 'function') {
+      this.#currentOnUnhandledRejectionHandler = handler;
+      this.addEventListener('unhandledrejection', this.#currentOnUnhandledRejectionHandler);
+    } else {
+      this.#currentOnUnhandledRejectionHandler = null;
+    }
+  }
   static setGlobal(window) {
     const properties = Object.getOwnPropertyDescriptors(window);
     delete properties.self;

package/build/esm/ClipboardEvent.mjs

@@ -0,0 +1,11 @@
+import { Event } from './Event.mjs';
+
+// https://w3c.github.io/clipboard-apis/#clipboardevent-interface
+class ClipboardEvent extends Event {
+  constructor(type, eventInitDict = {}) {
+    super(type, eventInitDict);
+    this.clipboardData = eventInitDict.clipboardData ?? null;
+  }
+}
+
+export { ClipboardEvent };

package/build/esm/ErrorEvent.mjs

@@ -0,0 +1,15 @@
+import { Event } from './Event.mjs';
+
+// https://html.spec.whatwg.org/multipage/webappapis.html#errorevent
+class ErrorEvent extends Event {
+  constructor(type, eventInitDict) {
+    super(type, eventInitDict);
+    this.message = eventInitDict.message;
+    this.filename = eventInitDict.filename;
+    this.lineno = eventInitDict.lineno;
+    this.colno = eventInitDict.colno;
+    this.error = eventInitDict.error;
+  }
+}
+
+export { ErrorEvent };

package/build/esm/FocusEvent.mjs

@@ -0,0 +1,11 @@
+import { Event } from './Event.mjs';
+
+// https://w3c.github.io/uievents/#interface-focusevent
+class FocusEvent extends Event {
+  constructor(type, eventInitDict = {}) {
+    super(type, eventInitDict);
+    this.relatedTarget = eventInitDict.relatedTarget ?? null;
+  }
+}
+
+export { FocusEvent };

package/build/esm/PromiseRejectionEvent.mjs

@@ -0,0 +1,12 @@
+import { Event } from './Event.mjs';
+
+//https://html.spec.whatwg.org/multipage/webappapis.html#promiserejectionevent
+class PromiseRejectionEvent extends Event {
+  constructor(type, eventInitDict) {
+    super(type, eventInitDict);
+    this.promise = eventInitDict.promise;
+    this.reason = eventInitDict.reason;
+  }
+}
+
+export { PromiseRejectionEvent };

package/build/esm/ToggleEvent.mjs

@@ -0,0 +1,12 @@
+import { Event } from './Event.mjs';
+
+// https://html.spec.whatwg.org/multipage/popover.html#toggleevent
+class ToggleEvent extends Event {
+  constructor(type, eventInitDict) {
+    super(type, eventInitDict);
+    this.oldState = eventInitDict.oldState;
+    this.newState = eventInitDict.newState;
+  }
+}
+
+export { ToggleEvent };

package/build/esm/Window.mjs

@@ -2,6 +2,11 @@ import { Document } from './Document.mjs';
 import { Event } from './Event.mjs';
 import { EventTarget } from './EventTarget.mjs';
 import { CustomEvent } from './CustomEvent.mjs';
+import { ErrorEvent } from './ErrorEvent.mjs';
+import { PromiseRejectionEvent } from './PromiseRejectionEvent.mjs';
+import { ToggleEvent } from './ToggleEvent.mjs';
+import { FocusEvent } from './FocusEvent.mjs';
+import { ClipboardEvent } from './ClipboardEvent.mjs';
 import { Node } from './Node.mjs';
 import { ParentNode } from './ParentNode.mjs';
 import { ChildNode } from './ChildNode.mjs';
@@ -29,6 +34,11 @@ class Window extends EventTarget {
   location = (() => globalThis.location)();
   navigator = (() => globalThis.navigator)();
   Event = (() => Event)();
+  ErrorEvent = (() => ErrorEvent)();
+  PromiseRejectionEvent = (() => PromiseRejectionEvent)();
+  ToggleEvent = (() => ToggleEvent)();
+  FocusEvent = (() => FocusEvent)();
+  ClipboardEvent = (() => ClipboardEvent)();
   EventTarget = (() => EventTarget)();
   CustomEvent = (() => CustomEvent)();
   Node = (() => Node)();
@@ -44,6 +54,46 @@ class Window extends EventTarget {
   SVGElement = (() => SVGElement)();
   HTMLTemplateElement = (() => HTMLTemplateElement)();
   MutationObserver = (() => MutationObserver)();
+  #currentOnErrorHandler = null;
+  #currentOriginalOnErrorHandler = null;
+  #currentOnUnhandledRejectionHandler = null;
+  get onerror() {
+    return this.#currentOriginalOnErrorHandler;
+  }
+  set onerror(handler) {
+    if (this.#currentOnErrorHandler) {
+      this.removeEventListener('error', this.#currentOnErrorHandler);
+    }
+    if (handler && typeof handler === 'function') {
+      // the event listener version receives an event object
+      // whereas winwow.onerror receives 5 arguments instead
+      // we need to wrap the handler to convert the event object to the 5 arguments
+      // and also make sure that when window.onerror is read to return the original handler
+      // https://developer.mozilla.org/en-US/docs/Web/API/Window/error_event#syntax
+      this.#currentOriginalOnErrorHandler = handler;
+      this.#currentOnErrorHandler = event => {
+        handler(event.message ?? 'Error', event.filename, event.lineno, event.colno, event.error);
+      };
+      this.addEventListener('error', this.#currentOnErrorHandler);
+    } else {
+      this.#currentOnErrorHandler = null;
+      this.#currentOriginalOnErrorHandler = null;
+    }
+  }
+  get onunhandledrejection() {
+    return this.#currentOnUnhandledRejectionHandler;
+  }
+  set onunhandledrejection(handler) {
+    if (this.#currentOnUnhandledRejectionHandler) {
+      this.removeEventListener('unhandledrejection', this.#currentOnUnhandledRejectionHandler);
+    }
+    if (handler && typeof handler === 'function') {
+      this.#currentOnUnhandledRejectionHandler = handler;
+      this.addEventListener('unhandledrejection', this.#currentOnUnhandledRejectionHandler);
+    } else {
+      this.#currentOnUnhandledRejectionHandler = null;
+    }
+  }
   static setGlobal(window) {
     const properties = Object.getOwnPropertyDescriptors(window);
     delete properties.self;

package/build/esnext/ClipboardEvent.esnext

@@ -0,0 +1,11 @@
+import { Event } from './Event.esnext';
+
+class ClipboardEvent extends Event {
+  clipboardData;
+  constructor(type, eventInitDict = {}) {
+    super(type, eventInitDict);
+    this.clipboardData = eventInitDict.clipboardData ?? null;
+  }
+}
+
+export { ClipboardEvent };

package/build/esnext/ErrorEvent.esnext

@@ -0,0 +1,19 @@
+import { Event } from './Event.esnext';
+
+class ErrorEvent extends Event {
+  message;
+  filename;
+  lineno;
+  colno;
+  error;
+  constructor(type, eventInitDict) {
+    super(type, eventInitDict);
+    this.message = eventInitDict.message;
+    this.filename = eventInitDict.filename;
+    this.lineno = eventInitDict.lineno;
+    this.colno = eventInitDict.colno;
+    this.error = eventInitDict.error;
+  }
+}
+
+export { ErrorEvent };

package/build/esnext/FocusEvent.esnext

@@ -0,0 +1,11 @@
+import { Event } from './Event.esnext';
+
+class FocusEvent extends Event {
+  relatedTarget;
+  constructor(type, eventInitDict = {}) {
+    super(type, eventInitDict);
+    this.relatedTarget = eventInitDict.relatedTarget ?? null;
+  }
+}
+
+export { FocusEvent };

package/build/esnext/PromiseRejectionEvent.esnext

@@ -0,0 +1,13 @@
+import { Event } from './Event.esnext';
+
+class PromiseRejectionEvent extends Event {
+  promise;
+  reason;
+  constructor(type, eventInitDict) {
+    super(type, eventInitDict);
+    this.promise = eventInitDict.promise;
+    this.reason = eventInitDict.reason;
+  }
+}
+
+export { PromiseRejectionEvent };

package/build/esnext/ToggleEvent.esnext

@@ -0,0 +1,13 @@
+import { Event } from './Event.esnext';
+
+class ToggleEvent extends Event {
+  oldState;
+  newState;
+  constructor(type, eventInitDict) {
+    super(type, eventInitDict);
+    this.oldState = eventInitDict.oldState;
+    this.newState = eventInitDict.newState;
+  }
+}
+
+export { ToggleEvent };

package/build/esnext/Window.esnext

@@ -2,6 +2,11 @@ import { Document } from './Document.esnext';
 import { Event } from './Event.esnext';
 import { EventTarget } from './EventTarget.esnext';
 import { CustomEvent } from './CustomEvent.esnext';
+import { ErrorEvent } from './ErrorEvent.esnext';
+import { PromiseRejectionEvent } from './PromiseRejectionEvent.esnext';
+import { ToggleEvent } from './ToggleEvent.esnext';
+import { FocusEvent } from './FocusEvent.esnext';
+import { ClipboardEvent } from './ClipboardEvent.esnext';
 import { Node } from './Node.esnext';
 import { ParentNode } from './ParentNode.esnext';
 import { ChildNode } from './ChildNode.esnext';
@@ -29,6 +34,11 @@ class Window extends EventTarget {
   location = globalThis.location;
   navigator = globalThis.navigator;
   Event = Event;
+  ErrorEvent = ErrorEvent;
+  PromiseRejectionEvent = PromiseRejectionEvent;
+  ToggleEvent = ToggleEvent;
+  FocusEvent = FocusEvent;
+  ClipboardEvent = ClipboardEvent;
   EventTarget = EventTarget;
   CustomEvent = CustomEvent;
   Node = Node;
@@ -44,6 +54,53 @@ class Window extends EventTarget {
   SVGElement = SVGElement;
   HTMLTemplateElement = HTMLTemplateElement;
   MutationObserver = MutationObserver;
+  #currentOnErrorHandler = null;
+  #currentOriginalOnErrorHandler = null;
+  #currentOnUnhandledRejectionHandler = null;
+  get onerror() {
+    return this.#currentOriginalOnErrorHandler;
+  }
+  set onerror(handler) {
+    if (this.#currentOnErrorHandler) {
+      this.removeEventListener("error", this.#currentOnErrorHandler);
+    }
+    if (handler && typeof handler === "function") {
+      this.#currentOriginalOnErrorHandler = handler;
+      this.#currentOnErrorHandler = (event) => {
+        handler(
+          event.message ?? "Error",
+          event.filename,
+          event.lineno,
+          event.colno,
+          event.error
+        );
+      };
+      this.addEventListener("error", this.#currentOnErrorHandler);
+    } else {
+      this.#currentOnErrorHandler = null;
+      this.#currentOriginalOnErrorHandler = null;
+    }
+  }
+  get onunhandledrejection() {
+    return this.#currentOnUnhandledRejectionHandler;
+  }
+  set onunhandledrejection(handler) {
+    if (this.#currentOnUnhandledRejectionHandler) {
+      this.removeEventListener(
+        "unhandledrejection",
+        this.#currentOnUnhandledRejectionHandler
+      );
+    }
+    if (handler && typeof handler === "function") {
+      this.#currentOnUnhandledRejectionHandler = handler;
+      this.addEventListener(
+        "unhandledrejection",
+        this.#currentOnUnhandledRejectionHandler
+      );
+    } else {
+      this.#currentOnUnhandledRejectionHandler = null;
+    }
+  }
   static setGlobal(window) {
     const properties = Object.getOwnPropertyDescriptors(window);
     delete properties.self;