diff --git a/build/app.d.ts b/build/app.d.ts index 0485c0c..2a5b04a 100644 --- a/build/app.d.ts +++ b/build/app.d.ts @@ -1,4 +1,4 @@ -declare const events: readonly ["load", "onboard", "signup", "bank_list", "bank_not_found", "bank_selected", "bank_offline", "synced", "complete", "back", "exit", "error"]; +declare const events: readonly ["load", "onboard", "signup", "bank_list", "find_my_bank", "bank_selected", "bank_offline", "synced", "complete", "back", "exit", "error"]; type EventsConnectKeys = typeof events[number]; type RenderIframeParams = { container?: HTMLElement; @@ -26,7 +26,7 @@ export type GuiabolsoConnectParams = { button: RenderButtonParams['config']; }>; data: { - cpf: string; + cpf?: string; email: string; phone: string; }; @@ -34,10 +34,7 @@ export type GuiabolsoConnectParams = { userTrackingId: string; clientId: string; callbackURL: string; - /** - * only when open a new window - */ - fallbackURL?: string; + fallbackURL: string; /** * DOM element to render iframe or button */ @@ -48,7 +45,7 @@ export type CallbackPayload = { onboard(): void; signup(): void; bank_list(): void; - bank_not_found(): void; + find_my_bank(): void; bank_selected(): void; bank_offline(): void; synced(): void; @@ -57,13 +54,13 @@ export type CallbackPayload = { }): void; back(): void; exit(params: { - reason: 'back_finished' | 'bank_not_found' | 'unknow' | 'user_cancel'; + reason: 'back_finished' | 'bank_not_found' | 'unknow' | 'user_cancel' | 'missing_params'; }): void; error(err: Error): void; }[K]; export function guiabolsoConnect({ container, config, data, clientId, userTrackingId, callbackURL, fallbackURL, environment, }: GuiabolsoConnectParams): Promise<{ - on: (event: T, cb: CallbackPayload) => void; + on: (event: T, cb: CallbackPayload) => void; openNewWindow: () => void; - events: readonly ["load", "onboard", "signup", "bank_list", "bank_not_found", "bank_selected", "bank_offline", "synced", "complete", "back", "exit", "error"]; + events: readonly ["load", "onboard", "signup", "bank_list", "find_my_bank", "bank_selected", "bank_offline", "synced", "complete", "back", "exit", "error"]; destroy: () => void; }>; diff --git a/build/app.js b/build/app.js index 97982f3..150bc0a 100644 --- a/build/app.js +++ b/build/app.js @@ -1 +1 @@ -require("regenerator-runtime/runtime");var n=function(n){return"?".concat(Object.keys(n).map((function(e){return"".concat(e,"=").concat(encodeURIComponent(n[e]))})).join("&"))};function e(n){return(e="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(n){return typeof n}:function(n){return n&&"function"==typeof Symbol&&n.constructor===Symbol&&n!==Symbol.prototype?"symbol":typeof n})(n)}var t=new Map;function o(n){if(t.has(n))return t.get(n)}function r(n,e){t.set(n,e)}function i(){t.forEach((function(n,e){t.delete(e)}))}function c(n,e){if(null==n)return{};var t,o,r=function(n,e){if(null==n)return{};var t,o,r={},i=Object.keys(n);for(o=0;o=0||(r[t]=n[t]);return r}(n,e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(n);for(o=0;o=0||Object.prototype.propertyIsEnumerable.call(n,t)&&(r[t]=n[t])}return r}function a(n){var e,t,i,a=n.window,l=void 0===a?globalThis:a,u=c(n,["window"]),s=(t=(e=u).domain,i=e.onEmmiter,function(n){var e,r=n.origin,c=n.data;if(r===t){var a=null!=c?c:{},l=a.eventName,u=a.payload,s=void 0===u?{}:u;if(l){var d=function(){var n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:function(){};i({payload:s,eventName:l}),n(s)};null===(e=o("observer")[l])||void 0===e||e.forEach(d)}}});return l.addEventListener("message",s,!1),o("observer")||r("observer",{}),{on:function(n,e){o("observer")[n]||(o("observer")[n]=[]),o("observer")[n].push(e)},destroy:function(){l.removeEventListener("message",s),r("observer",void 0)}}}"object"!==("undefined"==typeof globalThis?"undefined":e(globalThis))&&(Object.prototype.__defineGetter__("__alloc__",(function(){return this})),__alloc__.globalThis=__alloc__,delete Object.prototype.__alloc__);function l(n){var e=n.container,t=n.src,o=n.config;if(e){globalThis.document.head.insertAdjacentHTML("beforeend","\n \n "));var r=null!=o?o:{},i=r.height,c=void 0===i?800:i,a=r.width,l=void 0===a?395:a;e.innerHTML='\n \n ')}}function u(n){var e=n.container,t=n.onClick,o=n.config;if(e){var r=null!=o?o:{},i=r.allowIcon,c=void 0===i||i,a=r.label,l=void 0===a?"Conectar com Guiabolso":a;globalThis.document.head.insertAdjacentHTML("beforeend","\n \n "));var u=function(n){var e=n.iconElement,t=n.label;return'\n \n ")}({iconElement:c?'\n \n \n \n \n \n ':"",label:l});e.innerHTML=u;var s=globalThis.document.querySelector("#gbc-open");null==s||s.addEventListener("click",t)}}var s=function(n){return{production:"https://connect.guiabolso.com.br",sandbox:"https://connect.guiabolso.com.br"}[n]},d=function(n){return Boolean(/(frame-src|child-src|form-action|frame-ancestors|plugin-types|base-uri)/gim.test(null!=n?n:""))},f=function(){return Promise.race([fetch(document.location.href).then((function(n){return null==n?void 0:n.headers.get("Content-Security-Policy")})),new Promise((function(n){return document.addEventListener("securitypolicyviolation",(function(e){return n(null==e?void 0:e.originalPolicy)}))}))]).then(d)},b=["load","onboard","signup","bank_list","bank_not_found","bank_selected","bank_offline","synced","complete","back","exit","error"];function p(n,e){var t=Object.keys(n);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(n);e&&(o=o.filter((function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable}))),t.push.apply(t,o)}return t}function g(n){for(var e=1;e=0||(r[t]=n[t]);return r}(n,e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(n);for(o=0;o=0||Object.prototype.propertyIsEnumerable.call(n,t)&&(r[t]=n[t])}return r}function y(n,e,t,o,r,i,c){try{var a=n[i](c),l=a.value}catch(n){return void t(n)}a.done?e(l):Promise.resolve(l).then(o,r)}function h(n){return function(){var e=this,t=arguments;return new Promise((function(o,r){var i=n.apply(e,t);function c(n){y(i,o,r,c,a,"next",n)}function a(n){y(i,o,r,c,a,"throw",n)}c(void 0)}))}}function w(n){return O.apply(this,arguments)}function O(){return(O=h(regeneratorRuntime.mark((function e(t){var c,d,p,m,y,h,w,O,x,_,j,k,P,C,L,S,T,E,I,M,R;return regeneratorRuntime.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return c=t.container,d=t.config,p=t.data,m=t.clientId,y=t.userTrackingId,h=t.callbackURL,w=t.fallbackURL,O=void 0===w?"":w,x=t.environment,_=void 0===x?"sandbox":x,"production",j=s("production"),e.next=5,f();case 5:if(e.t0=e.sent,!e.t0){e.next=8;break}e.t0=Boolean(c);case 8:return k=e.t0,C=(P=null!=d?d:{}).iframe,L=P.button,S=P.window,T=v(P,["iframe","button","window"]),E=n(g(g(g({},p),T),{},{callbackURL:h,clientId:m,fallbackURL:O,userTrackingId:"sandbox"===_?"development":y,embedded:k})),I="".concat(j,"/#/integracao").concat(E),M=a({domain:j,onEmmiter:function(n){var e,t=n.eventName;["exit","complete"].includes(t)&&(o("windowParent")&&(null===(e=o("windowParent"))||void 0===e||e.close()))}}),R=function(){r("windowParent",window.open(I,"gbConnectWindow","width=".concat((null==S?void 0:S.width)||992,",height=").concat((null==S?void 0:S.height)||820)))},k&&l({config:C,src:I,container:c}),k||u({config:L,container:c,onClick:R}),e.abrupt("return",{on:M.on,openNewWindow:R,events:b,destroy:function(){setTimeout((function(){var n,e,t,o;i(),null===(n=globalThis.document)||void 0===n||null===(e=n.querySelector("[".concat("data-gbc-style-button","]")))||void 0===e||e.remove(),null===(t=globalThis.document)||void 0===t||null===(o=t.querySelector("[".concat("data-guiabolso-connect-embedded","]")))||void 0===o||o.remove(),null==c||c.remove(),M.destroy(),r("isDestroyed",!0)}),2e3)}});case 17:case"end":return e.stop()}}),e)})))).apply(this,arguments)}r("isDestroyed",!1),exports.guiabolsoConnect=w,globalThis.guiabolsoConnect=w; \ No newline at end of file +function n(e){return(n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(n){return typeof n}:function(n){return n&&"function"==typeof Symbol&&n.constructor===Symbol&&n!==Symbol.prototype?"symbol":typeof n})(e)}var e=new Map;function o(n){if(e.has(n))return e.get(n)}function t(n,o){e.set(n,o)}function r(n,e){if(null==n)return{};var o,t,r=function(n,e){if(null==n)return{};var o,t,r={},i=Object.keys(n);for(t=0;t=0||(r[o]=n[o]);return r}(n,e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(n);for(t=0;t=0||Object.prototype.propertyIsEnumerable.call(n,o)&&(r[o]=n[o])}return r}function i(n){var e,i,c,a=n.window,l=void 0===a?globalThis:a,s=r(n,["window"]),u=(i=(e=s).domain,c=e.onEmmiter,function(n){var e,t=n.origin,r=n.data;if(t===i){var a=null!=r?r:{},l=a.eventName,s=a.payload,u=void 0===s?{}:s;if(l){var d=function(){var n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:function(){};c({payload:u,eventName:l}),n(u)};null===(e=o("observer")[l])||void 0===e||e.forEach(d)}}});return l.addEventListener("message",u,!1),o("observer")||t("observer",{}),{on:function(n,e){o("observer")[n]||(o("observer")[n]=[]),o("observer")[n].push(e)},destroy:function(){l.removeEventListener("message",u),t("observer",void 0)}}}"object"!==("undefined"==typeof globalThis?"undefined":n(globalThis))&&(Object.prototype.__defineGetter__("__alloc__",(function(){return this})),__alloc__.globalThis=__alloc__,delete Object.prototype.__alloc__);function c(n){var e=n.container,o=n.src,t=n.config;if(e){globalThis.document.head.insertAdjacentHTML("beforeend","\n \n "));var r=null!=t?t:{},i=r.height,c=void 0===i?800:i,a=r.width,l=void 0===a?395:a;e.innerHTML='\n \n ')}}function a(n){var e=n.container,o=n.onClick,t=n.config;if(e){var r=null!=t?t:{},i=r.allowIcon,c=void 0===i||i,a=r.label,l=void 0===a?"Conectar com Guiabolso":a;globalThis.document.head.insertAdjacentHTML("beforeend","\n \n "));var s=function(n){var e=n.iconElement,o=n.label;return'\n \n ")}({iconElement:c?'\n \n \n \n \n \n ':"",label:l});e.innerHTML=s;var u=globalThis.document.querySelector("#gbc-open");null==u||u.addEventListener("click",o)}}var l=function(n){return Boolean(/(frame-src|child-src|form-action|frame-ancestors|plugin-types|base-uri)/gim.test(null!=n?n:""))},s=["load","onboard","signup","bank_list","find_my_bank","bank_selected","bank_offline","synced","complete","back","exit","error"];function u(n,e){var o=Object.keys(n);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(n);e&&(t=t.filter((function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable}))),o.push.apply(o,t)}return o}function d(n){for(var e=1;e=0||(r[o]=n[o]);return r}(n,e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(n);for(t=0;t=0||Object.prototype.propertyIsEnumerable.call(n,o)&&(r[o]=n[o])}return r}function p(n){var r=n.container,u=n.config,b=n.data,p=n.clientId,g=n.userTrackingId,m=n.callbackURL,v=n.fallbackURL,y=void 0===v?"":v,h=n.environment,w=void 0===h?"sandbox":h,O=function(n){return{production:"https://connect.guiabolso.com.br",sandbox:"https://connect.guiabolso.com.br"}[n]}("production");return Promise.race([fetch(document.location.href).then((function(n){return null==n?void 0:n.headers.get("Content-Security-Policy")})),new Promise((function(n){return document.addEventListener("securitypolicyviolation",(function(e){return n(null==e?void 0:e.originalPolicy)}))}))]).then(l).then((function(n){var l,v=n&&Boolean(r),h=null!=u?u:{},_=h.iframe,x=h.button,j=h.window,k=f(h,["iframe","button","window"]),P=(l=d(d(d({},b),k),{},{callbackURL:m,clientId:p,fallbackURL:y,userTrackingId:"sandbox"===w?"development":g,embedded:v}),"?".concat(Object.keys(l).map((function(n){return"".concat(n,"=").concat(encodeURIComponent(l[n]))})).join("&"))),C="".concat(O,"/#/integracao").concat(P),L=i({domain:O,onEmmiter:function(n){var e,t=n.eventName;["exit","complete"].includes(t)&&(o("windowParent")&&(null===(e=o("windowParent"))||void 0===e||e.close()))}}),S=function(){t("windowParent",window.open(C,"gbConnectWindow","width=".concat((null==j?void 0:j.width)||992,",height=").concat((null==j?void 0:j.height)||820)))};return v&&c({config:_,src:C,container:r}),v||a({config:x,container:r,onClick:S}),{on:L.on,openNewWindow:S,events:s,destroy:function(){setTimeout((function(){var n,o,i,c;e.forEach((function(n,o){e.delete(o)})),null===(n=globalThis.document)||void 0===n||null===(o=n.querySelector("[".concat("data-gbc-style-button","]")))||void 0===o||o.remove(),null===(i=globalThis.document)||void 0===i||null===(c=i.querySelector("[".concat("data-guiabolso-connect-embedded","]")))||void 0===c||c.remove(),null==r||r.remove(),L.destroy(),t("isDestroyed",!0)}),2e3)}}}))}t("isDestroyed",!1),exports.guiabolsoConnect=p,globalThis.guiabolsoConnect=p; \ No newline at end of file diff --git a/package.json b/package.json index 7523621..4200456 100644 --- a/package.json +++ b/package.json @@ -44,7 +44,6 @@ "@babel/preset-env": "^7.12.11", "@babel/preset-typescript": "^7.12.7", "@types/jest": "^26.0.20", - "@types/node": "^14.17.0", "@typescript-eslint/eslint-plugin": "^4.14.2", "@typescript-eslint/parser": "^4.14.2", "babel-jest": "^26.6.3", diff --git a/src/app.ts b/src/app.ts index c3a2ad1..24570ae 100644 --- a/src/app.ts +++ b/src/app.ts @@ -1,4 +1,3 @@ -import 'regenerator-runtime/runtime'; import './utils/globalthis-polyfill'; import { buildQueryParams } from './utils/build-query-params'; @@ -62,14 +61,19 @@ export declare type CallbackPayload = { complete(params: { oauthcode: string }): void; back(): void; exit(params: { - reason: 'back_finished' | 'bank_not_found' | 'unknow' | 'user_cancel'; + reason: + | 'back_finished' + | 'bank_not_found' + | 'unknow' + | 'user_cancel' + | 'missing_params'; }): void; error(err: Error): void; }[K]; setInstanceValue('isDestroyed', false); -export async function guiabolsoConnect({ +export function guiabolsoConnect({ container, config, data, @@ -82,89 +86,93 @@ export async function guiabolsoConnect({ const env = (process.env.GUIABOSLO_CONNECT_ENVIRONMENT as Envs) || environment; const domain = getOrigin(env); - const embedded = (await verifyCSP()) && Boolean(container); - - const { - iframe: iframeConfig, - button: buttonConfig, - window: windowConfig, - ...configConnect - } = config ?? {}; - - const queryString = buildQueryParams({ - ...data, - ...configConnect, - callbackURL, - clientId, - fallbackURL, - userTrackingId: environment === 'sandbox' ? 'development' : userTrackingId, - embedded, - }); - const src = - process.env.TEST_EMITTER || `${domain}/#/integracao${queryString}`; + return verifyCSP().then((hasCSP) => { + const embedded = hasCSP && Boolean(container); + + const { + iframe: iframeConfig, + button: buttonConfig, + window: windowConfig, + ...configConnect + } = config ?? {}; + + const queryString = buildQueryParams({ + ...data, + ...configConnect, + callbackURL, + clientId, + fallbackURL, + userTrackingId: + environment === 'sandbox' ? 'development' : userTrackingId, + embedded, + }); + + const src = + process.env.TEST_EMITTER || `${domain}/#/integracao${queryString}`; - const observable = observer({ - domain, - onEmmiter: ({ eventName }) => { - if (['exit', 'complete'].includes(eventName)) { - if (getInstance('windowParent')) { - getInstance('windowParent')?.close(); + const observable = observer({ + domain, + onEmmiter: ({ eventName }) => { + if (['exit', 'complete'].includes(eventName)) { + if (getInstance('windowParent')) { + getInstance('windowParent')?.close(); + } } + }, + }); + + const openNewWindow = () => { + if ( + process.env.GUIABOSLO_CONNECT_ENVIRONMENT === 'sandbox' && + getInstance('isDestroyed') + ) { + throw new Error("You executed destroy function. Events don't work"); } - }, - }); - const openNewWindow = () => { - if ( - process.env.GUIABOSLO_CONNECT_ENVIRONMENT === 'sandbox' && - getInstance('isDestroyed') - ) { - throw new Error("You executed destroy function. Events don't work"); - } + setInstanceValue( + 'windowParent', + window.open( + src, + 'gbConnectWindow', + `width=${windowConfig?.width || 992},height=${ + windowConfig?.height || 820 + }` + ) as Window & typeof globalThis + ); + }; - setInstanceValue( - 'windowParent', - window.open( + if (embedded) { + renderIframe({ + config: iframeConfig, src, - 'gbConnectWindow', - `width=${windowConfig?.width || 992},height=${ - windowConfig?.height || 820 - }` - ) as Window & typeof globalThis - ); - }; + container, + }); + } - if (embedded) { - renderIframe({ - config: iframeConfig, - src, - container, - }); - } - - if (!embedded) { - renderButton({ config: buttonConfig, container, onClick: openNewWindow }); - } - - return { - on: observable.on as ( - event: T, - cb: CallbackPayload - ) => void, - openNewWindow, - events, - destroy: () => { - setTimeout(() => { - destroyInstances(); - globalThis.document?.querySelector(`[${dataButtonStyle}]`)?.remove(); - globalThis.document?.querySelector(`[${dataStyleIframe}]`)?.remove(); - container?.remove(); - observable.destroy(); - setInstanceValue('isDestroyed', true); - }, 2000); - }, - }; + if (!embedded) { + renderButton({ config: buttonConfig, container, onClick: openNewWindow }); + } + + return { + on: observable.on as ( + event: T, + cb: CallbackPayload + ) => void, + openNewWindow, + events, + destroy: () => { + setTimeout(() => { + destroyInstances(); + globalThis.document?.querySelector(`[${dataButtonStyle}]`)?.remove(); + globalThis.document?.querySelector(`[${dataStyleIframe}]`)?.remove(); + container?.remove(); + observable.destroy(); + setInstanceValue('isDestroyed', true); + }, 2000); + }, + }; + }); } // @ts-ignore diff --git a/src/process.d.ts b/src/process.d.ts new file mode 100644 index 0000000..a0048ac --- /dev/null +++ b/src/process.d.ts @@ -0,0 +1,8 @@ +declare const process: { + env: { + NODE_ENV: string; + GUIABOSLO_CONNECT_ENVIRONMENT: string; + TEST_EMITTER: string; + ALLOW_CSP: string; + }; +}; diff --git a/src/sandbox.ts b/src/sandbox.ts index d446ba5..d761ec7 100644 --- a/src/sandbox.ts +++ b/src/sandbox.ts @@ -11,6 +11,7 @@ window.addEventListener('load', () => { hiddenHeader: false, }, data: { + cpf: '99999999999', phone: '11999999999', email: 'user@teste.com.br', }, diff --git a/tsconfig.json b/tsconfig.json index 1999d6a..be2641e 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,5 +1,6 @@ { "compilerOptions": { + "typeRoots": ["@types", "node_modules/@types", "src/process.d.ts"], "declaration": true, "target": "es5", "lib": [ @@ -7,6 +8,8 @@ "dom.iterable", "esnext" ], + "module": "esnext", + "moduleResolution": "node", "allowJs": true } }