feat(platform): add setPlatformHelpers() api

Allows for custom elements build to modify how CustomEvents, addEventListener and removeEventListeners are called.

src/client/client-window.ts

@@ -19,6 +19,26 @@ export const plt: d.PlatformRuntime = {
   ce: (eventName, opts) => new CustomEvent(eventName, opts),
 };
 
+export const setPlatformHelpers = (helpers: { 
+  jmp?: (c: any) => any;
+  raf?: (c: any) => number;
+  ael?: (
+    el: any,
+    eventName: string,
+    listener: any,
+    options: any,
+  ) => void;
+  rel?: (
+    el: any,
+    eventName: string,
+    listener: any,
+    options: any,
+  ) => void;
+  ce?: (eventName: string, opts?: any) => any;
+}) => {
+  Object.assign(plt, helpers);
+};
+
 export const supportsShadow = BUILD.shadowDomShim && BUILD.shadowDom ? /*@__PURE__*/ (() => (doc.head.attachShadow + '').indexOf('[native') > -1)() : true;
 
 export const supportsListenerOptions = /*@__PURE__*/ (() => {

src/compiler/transformers/update-stencil-core-import.ts

@@ -60,6 +60,7 @@ const KEEP_IMPORTS = new Set([
   'h',
   'setMode',
   'getMode',
+  'setPlatformHelpers',
   'Build',
   'Env',
   'Host',

src/declarations/stencil-public-runtime.ts

@@ -262,6 +262,24 @@ export declare const setMode: (handler: ResolutionHandler) => void;
  */
 export declare function getMode<T = string | undefined>(ref: any): T;
 
+export declare function setPlatformHelpers (helpers: { 
+  jmp?: (c: any) => any;
+  raf?: (c: any) => number;
+  ael?: (
+    el: any,
+    eventName: string,
+    listener: any,
+    options: any,
+  ) => void;
+  rel?: (
+    el: any,
+    eventName: string,
+    listener: any,
+    options: any,
+  ) => void;
+  ce?: (eventName: string, opts?: any) => any;
+}): void;
+
 /**
  * Get the base path to where the assets can be found. Use `setAssetPath(path)`
  * if the path needs to be customized.

src/hydrate/platform/index.ts

@@ -107,6 +107,26 @@ export const plt: d.PlatformRuntime = {
   ce: (eventName, opts) => new win.CustomEvent(eventName, opts),
 };
 
+export const setPlatformHelpers = (helpers: { 
+  jmp?: (c: any) => any;
+  raf?: (c: any) => number;
+  ael?: (
+    el: any,
+    eventName: string,
+    listener: any,
+    options: any,
+  ) => void;
+  rel?: (
+    el: any,
+    eventName: string,
+    listener: any,
+    options: any,
+  ) => void;
+  ce?: (eventName: string, opts?: any) => any;
+}) => {
+  Object.assign(plt, helpers);
+};
+
 export const supportsShadow = false;
 
 export const supportsListenerOptions = false;

src/internal/stencil-core/index.d.ts

@@ -42,6 +42,7 @@ export {
   readTask,
   setAssetPath,
   setMode,
+  setPlatformHelpers,
   State,
   Watch,
   writeTask,

src/internal/stencil-core/index.js

@@ -10,6 +10,7 @@ export {
   readTask,
   setMode,
   setAssetPath,
+  setPlatformHelpers,
   writeTask,
   setErrorHandler,
 } from '../client/index.js';

src/testing/platform/index.ts

@@ -6,6 +6,7 @@ export {
   isMemberInElement,
   plt,
   supportsShadow,
+  setPlatformHelpers,
   registerComponents,
   registerContext,
   registerModule,

src/testing/platform/testing-platform.ts

@@ -15,6 +15,26 @@ export const plt: d.PlatformRuntime = {
   ce: (eventName, opts) => new (win as any).CustomEvent(eventName, opts),
 };
 
+export const setPlatformHelpers = (helpers: { 
+  jmp?: (c: any) => any;
+  raf?: (c: any) => number;
+  ael?: (
+    el: any,
+    eventName: string,
+    listener: any,
+    options: any,
+  ) => void;
+  rel?: (
+    el: any,
+    eventName: string,
+    listener: any,
+    options: any,
+  ) => void;
+  ce?: (eventName: string, opts?: any) => any;
+}) => {
+  Object.assign(plt, helpers);
+};
+
 export const cssVarShim: d.CssVarShim = false as any;
 export const supportsListenerOptions = true;
 export const supportsConstructibleStylesheets = false;