fix custom method unavailability issue during connect instance loadin…

…g (cherry-pick beta-> master) (#71)

* fix custom method unavailability issue during connect instance loading (cherry-pick)

* run prettier

src/shared.ts

@@ -4,6 +4,7 @@ import {
   ConnectElementTagName,
   ConnectHTMLElementRecord
 } from "../types";
+import { ConnectElementCustomMethodConfig } from "../types/config";
 
 export type LoadConnectAndInitialize = (
   initParams: IStripeConnectInitParams
@@ -108,6 +109,12 @@ export const loadScript = (): Promise<StripeConnectWrapper> => {
   return stripePromise;
 };
 
+const hasCustomMethod = (
+  tagName: ConnectElementTagName
+): tagName is keyof typeof ConnectElementCustomMethodConfig => {
+  return tagName in ConnectElementCustomMethodConfig;
+};
+
 export const initStripeConnect = (
   stripePromise: Promise<StripeConnectWrapper>,
   initParams: IStripeConnectInitParams
@@ -123,6 +130,18 @@ export const initStripeConnect = (
         htmlName = (tagName as unknown) as ConnectElementHTMLName;
       }
       const element = document.createElement(htmlName);
+
+      if (hasCustomMethod(tagName)) {
+        const methods = ConnectElementCustomMethodConfig[tagName];
+        for (const method in methods) {
+          (element as any)[method] = function(value: any) {
+            stripeConnectInstance.then(() => {
+              this[`${method}InternalOnly`](value);
+            });
+          };
+        }
+      }
+
       stripeConnectInstance.then(instance => {
         (element as any).setConnector((instance as any).connect);
       });

types/config.ts

@@ -0,0 +1,27 @@
+import { ConnectElementTagName } from "./shared.d";
+
+/* eslint-disable @typescript-eslint/no-empty-function */
+/* eslint-disable @typescript-eslint/no-unused-vars */
+
+export const ConnectElementCustomMethodConfig = {
+  "account-onboarding": {
+    setFullTermsOfServiceUrl: (
+      termOfServiceUrl: string | undefined
+    ): void => {},
+    setRecipientTermsOfServiceUrl: (
+      recipientTermsOfServiceUrl: string | undefined
+    ): void => {},
+    setPrivacyPolicyUrl: (privacyPolicyUrl: string | undefined): void => {},
+    setSkipTermsOfServiceCollection: (
+      skipTermsOfServiceCollection: boolean | undefined
+    ): void => {},
+    setOnExit: (listener: (() => void) | undefined): void => {}
+  }
+};
+
+// ensure that keys of ConnectElementCustomMethodConfig are from ConnectElementTagName
+type HasType<T, Q extends T> = Q;
+type CustomMethodConfigValidation = HasType<
+  ConnectElementTagName,
+  keyof typeof ConnectElementCustomMethodConfig
+>;

types/shared.d.ts

@@ -1,3 +1,5 @@
+import { ConnectElementCustomMethodConfig } from "./config";
+
 export declare type LoadConnectAndInitialize = (
   initParams: IStripeConnectInitParams
 ) => StripeConnectInstance;
@@ -354,28 +356,14 @@ export interface IStripeConnectInitParams {
   locale?: string;
 }
 
-type ConnectHTMLElementRecordFallback = {
-  [key in string]: HTMLElement | null;
-};
-type ConnectHTMLElementRecordBase = {
-  [tagName in ConnectElementTagName]: HTMLElement;
-};
+type ConnectElementCustomMethods = typeof ConnectElementCustomMethodConfig;
 
-interface ConnectHTMLElementRecord
-  extends ConnectHTMLElementRecordBase,
-    ConnectHTMLElementRecordFallback {
-  "account-onboarding": HTMLElement & {
-    setFullTermsOfServiceUrl: (termOfServiceUrl: string | undefined) => void;
-    setRecipientTermsOfServiceUrl: (
-      recipientTermsOfServiceUrl: string | undefined
-    ) => void;
-    setPrivacyPolicyUrl: (privacyPolicyUrl: string | undefined) => void;
-    setSkipTermsOfServiceCollection: (
-      skipTermsOfServiceCollection: boolean | undefined
-    ) => void;
-    setOnExit: (listener: () => void) => void;
-  };
-}
+type ConnectHTMLElementRecord = {
+  [K in keyof ConnectElementCustomMethods]: HTMLElement &
+    ConnectElementCustomMethods[K];
+} & {
+  [key: string]: HTMLElement;
+};
 
 export interface StripeConnectInstance {
   /**