@viibe/impulse-integration-js 2.3.4-alpha4 → 2.3.5

package/dist/index.js

@@ -1 +1 @@
-(()=>{var t={579:t=>{function e(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function n(t,e){for(var n=0;n<e.length;n++){var o=e[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}function o(t,e,o){return e&&n(t.prototype,e),o&&n(t,o),t}function i(t){return function(e){return Boolean(e.isTrusted&&0===e.origin.indexOf(t))}}function a(t){var e=new URL(t),n="".concat(e.protocol,"//").concat(e.host);console.log("opeing popup",e,"origin is",n);var o=window.screen.width/2-240,a=window.screen.height/2-300,r=["toolbar=no","location=no","directories=no","status=no","menubar=no","scrollbars=no","resizable=no","copyhistory=no","width=".concat(480),"height=".concat(600),"top=".concat(a),"left=".concat(o)];return new Promise((function(e,o){var a=window.open(t,"Authorization",r.join(", "));a||o("Failed to open window");var s=setInterval((function(){a.closed&&(l(),c())}),100),c=function(){o("User closed window")},l=function(){window.removeEventListener("message",u),clearInterval(s)},u=function(t){if(console.log("got message",t),!i(n)(t))return null;t.data.token&&(l(),e(t.data.token)),t.data.error&&(l(),o(t.data.error))};window.addEventListener("message",u)}))}var r,s,c,l=function(){function t(){var n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"auth.viibe.tech";e(this,t),this.host=n}return o(t,[{key:"loginZendesk",value:function(t){return a("https://".concat(this.host,"/auth/zendesk/login?subdomain=").concat(t))}}]),t}(),u=function(){function t(n){e(this,t),this.handlers=[],this.host=n.host,this.origin=/^localhost/.test(this.host)?"http://".concat(this.host):"https://".concat(this.host),this.source=n.source,this.isViibeEvent=i(this.origin),window.addEventListener("message",this.onMessage.bind(this))}return o(t,[{key:"createNotificationIframe",value:function(){if(!this.host)throw new Error("fillHost");if(!this.source)throw new Error("fillSource");var t=document.createElement("iframe");return t.name="viibe-"+Math.floor(1e4*Math.random()),t.style="border: 0;width: 0;",t.src="".concat(this.origin,"/integration/features/notifications"),t}},{key:"createCallIframe",value:function(){var t=this,e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};if(!this.host)throw new Error("fillHost");if(!this.source)throw new Error("fillSource");var n=this.createCallUrl(e),o=document.createElement("iframe");return o.name="viibe-"+Math.floor(1e4*Math.random()),o.style="border: 0;width: calc(100% - 1rem);margin: 0.5rem;",o.src=n,o.allow="geolocation;autoplay;microphone;camera;midi;encrypted-media;clipboard-write;",this.on(o,"document",(function(e){return t.onDocument(e)})),o}},{key:"createCallUrl",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},e=t.clipboard,n=void 0!==e&&e,o=t.components,i=t.links,a=t.o2m,r=void 0!==a&&a,s=t.ticket,c=t.token,l=t.locale,u=t.standalone,d="".concat(this.origin,"/integration/features/call"),h=new URLSearchParams({resize:"true",source:this.source});if(s&&s.title&&h.set("title",s.title),s&&s.integration&&h.set("thirdPartyId",s.integration.id),i){var f=i instanceof Array?i.map((function(t){return"".concat(t.category,":").concat(t.value)})).join(","):String(i);h.set("links",f)}if(c&&h.set("token",c),l&&h.set("locale",l),o){var v=o instanceof Array?o.join(","):String(o);h.set("components",v)}return u&&h.set("standalone",Boolean(u)),h.set("clipboard",Boolean(n)),h.set("o2m",Boolean(r)),d+"?".concat(h)}},{key:"dispatch",value:function(t,e,n){return this.handlers.filter((function(e){return e.eventName===t&&(!e.windowName||e.windowName===n)})).map((function(t){return t.func(e)}))}},{key:"onMessage",value:function(t){return this.isViibeEvent(t)?t.data&&t.data.event&&t.data.payload?this.dispatch(t.data.event,t.data.payload,t.data.windowName):t.data&&t.data.token?this.dispatch("authentication:token",t.data.token):t.data&&t.data.error?this.dispatch("authentication:error",t.data.error):null:null}},{key:"on",value:function(t,e,n){"string"==typeof t&&"function"==typeof e&&void 0===n&&(n=e,e=t,t=null);var o={eventName:e,windowName:t?t.name:null,func:n};this.handlers.push(o)}},{key:"onDocument",value:function(t){window.open(t.signed_url,"_blank")}},{key:"authenticate",value:function(t){return a("".concat(this.origin,"/api/auth/login/").concat(t))}}]),t}();c=l,(s="Auth")in(r=u)?Object.defineProperty(r,s,{value:c,enumerable:!0,configurable:!0,writable:!0}):r.Auth=c,"undefined"!=typeof window&&(window.Viibe=u),t.exports=u}},e={},n=function n(o){var i=e[o];if(void 0!==i)return i.exports;var a=e[o]={exports:{}};return t[o](a,a.exports,n),a.exports}(579);module.exports=n})();
+(()=>{var t={579:t=>{function e(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function n(t,e){for(var n=0;n<e.length;n++){var o=e[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}function o(t,e,o){return e&&n(t.prototype,e),o&&n(t,o),t}function a(t){return function(e){return Boolean(e.isTrusted&&0===e.origin.indexOf(t))}}function i(t){var e=new URL(t),n="".concat(e.protocol,"//").concat(e.host),o=window.screen.width/2-240,i=window.screen.height/2-300,r=["toolbar=no","location=no","directories=no","status=no","menubar=no","scrollbars=no","resizable=no","copyhistory=no","width=".concat(480),"height=".concat(600),"top=".concat(i),"left=".concat(o)];return new Promise((function(e,o){var i=window.open(t,"Authorization",r.join(", "));i||o("Failed to open window");var c=setInterval((function(){i.closed&&(s(),o("User closed window"))}),100);function s(){window.removeEventListener("message",u),clearInterval(c)}function u(t){if(!a(n)(t))return null;if(t.data.token&&(s(),e(t.data.token)),t.data.error&&(s(),o(t.data.error)),t.data&&t.data.event&&t.data.payload)switch(t.data.event){case"authentication:success":return s(),e(t.data);case"authentication:failure":return s(),o(t.data)}}window.addEventListener("message",u)}))}var r,c,s,u="auth.viibe.pro",l=function(){function t(){var n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:u;e(this,t),this.host=n}return o(t,[{key:"loginZendesk",value:function(t){return i("https://".concat(this.host,"/auth/zendesk/login?subdomain=").concat(t))}}]),t}(),d=function(){function t(n){e(this,t),this.handlers=[],this.host=n.host,this.origin=/^localhost/.test(this.host)?"http://".concat(this.host):"https://".concat(this.host),this.source=n.source,this.isViibeEvent=a(this.origin),window.addEventListener("message",this.onMessage.bind(this))}return o(t,[{key:"createNotificationIframe",value:function(){if(!this.host)throw new Error("fillHost");if(!this.source)throw new Error("fillSource");var t=document.createElement("iframe");return t.name="viibe-"+Math.floor(1e4*Math.random()),t.style="border: 0;width: 0;",t.src="".concat(this.origin,"/integration/features/notifications"),t}},{key:"createCallIframe",value:function(){var t=this,e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};if(!this.host)throw new Error("fillHost");if(!this.source)throw new Error("fillSource");var n=this.createCallUrl(e),o=document.createElement("iframe");return o.name="viibe-"+Math.floor(1e4*Math.random()),o.style="border: 0;width: calc(100% - 1rem);margin: 0.5rem;",o.src=n,o.allow="geolocation;autoplay;microphone;camera;midi;encrypted-media;clipboard-write;",this.on(o,"document",(function(e){return t.onDocument(e)})),o}},{key:"createCallUrl",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},e=t.clipboard,n=void 0!==e&&e,o=t.components,a=t.links,i=t.o2m,r=void 0!==i&&i,c=t.ticket,s=t.token,u=t.locale,l=t.standalone,d="".concat(this.origin,"/integration/features/call"),h=new URLSearchParams({resize:"true",source:this.source});if(c&&c.title&&h.set("title",c.title),c&&c.integration&&h.set("thirdPartyId",c.integration.id),a){var f=a instanceof Array?a.map((function(t){return"".concat(t.category,":").concat(t.value)})).join(","):String(a);h.set("links",f)}if(s&&h.set("token",s),u&&h.set("locale",u),o){var v=o instanceof Array?o.join(","):String(o);h.set("components",v)}return l&&h.set("standalone",Boolean(l)),h.set("clipboard",Boolean(n)),h.set("o2m",Boolean(r)),d+"?".concat(h)}},{key:"dispatch",value:function(t,e,n){return this.handlers.filter((function(e){return e.eventName===t&&(!e.windowName||e.windowName===n)})).map((function(t){return t.func(e)}))}},{key:"onMessage",value:function(t){return this.isViibeEvent(t)?t.data&&t.data.event&&t.data.payload?this.dispatch(t.data.event,t.data.payload,t.data.windowName):t.data&&t.data.token?this.dispatch("authentication:token",t.data.token):t.data&&t.data.error?this.dispatch("authentication:error",t.data.error):null:null}},{key:"on",value:function(t,e,n){"string"==typeof t&&"function"==typeof e&&void 0===n&&(n=e,e=t,t=null);var o={eventName:e,windowName:t?t.name:null,func:n};this.handlers.push(o)}},{key:"onDocument",value:function(t){window.open(t.signed_url,"_blank")}},{key:"authenticate",value:function(t){return i("".concat(this.origin,"/api/auth/login/").concat(t))}}]),t}();s=l,(c="Auth")in(r=d)?Object.defineProperty(r,c,{value:s,enumerable:!0,configurable:!0,writable:!0}):r.Auth=s,"undefined"!=typeof window&&(window.Viibe=d),t.exports=d}},e={},n=function n(o){var a=e[o];if(void 0!==a)return a.exports;var i=e[o]={exports:{}};return t[o](i,i.exports,n),i.exports}(579);module.exports=n})();

package/package.json

@@ -1,23 +1,27 @@
 {
   "name": "@viibe/impulse-integration-js",
-  "version": "2.3.4-alpha4",
+  "version": "2.3.5",
   "description": "ViiBE integration in js native",
   "main": "index.js",
   "publishConfig": {
-    "access":"public"
+    "access": "public"
   },
   "scripts": {
     "build": "webpack --mode production",
     "prepublish": "npm run build",
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "test": "npm run build && jest",
+    "publish:dev": "npm publish --tag dev"
   },
   "author": "Viibe",
   "license": "ISC",
   "devDependencies": {
     "@babel/core": "^7.15.8",
     "@babel/preset-env": "^7.15.8",
+    "@types/jest": "^28.1.3",
     "babel-loader": "^8.2.2",
     "core-js": "^3.18.2",
+    "jest": "^28.1.1",
+    "jest-environment-jsdom": "^28.1.1",
     "webpack": "^5.58.1",
     "webpack-cli": "^4.9.0"
   }

package/src/index.js

@@ -8,8 +8,6 @@ function openAuthPopup(src) {
   const url = new URL(src);
   const origin = `${url.protocol}//${url.host}`;
 
-  console.log('opeing popup', url, 'origin is', origin);
-
   const width = 480
   const height = 600
   const TWO = 2
@@ -48,23 +46,23 @@ function openAuthPopup(src) {
     }, 100)
 
     // triggered if the window was closed
-    const onClose = () => {
+    function onClose() {
       reject('User closed window')
     }
 
     // completes the process, either because the user closes or because the authentication completed
     // cleans intervals and event listeners
-    const destroy = () => {
+    function destroy() {
       window.removeEventListener('message', onMessage)
       clearInterval(closeCheck)
     }
 
     // triggered when a message is received on the current window
-    const onMessage = event => {
-      console.log('got message', event);
+    function onMessage(event) {
       if (!isFromOrigin(origin)(event)) {
         return null
       }
+      // legacy ViiBE iframe messages (oauth.html)
       if (event.data.token) {
         destroy();
         resolve(event.data.token)
@@ -73,16 +71,29 @@ function openAuthPopup(src) {
         destroy();
         reject(event.data.error)
       }
+
+      // events from auth.viibe.tech
+      if(event.data && event.data.event && event.data.payload) {
+        switch(event.data.event) {
+          case 'authentication:success':
+              destroy();
+              return resolve(event.data);
+          case 'authentication:failure':
+              destroy();
+              return reject(event.data);
+        }
+      }
     }
 
     window.addEventListener('message', onMessage)
   })
 }
 
+const DEFAULT_AUTH_HOST = 'auth.viibe.pro'
+
 class ViibeAuth {
 
-  // FIXME
-  constructor(host = 'auth.viibe.tech') {
+  constructor(host = DEFAULT_AUTH_HOST) {
     this.host = host;
   }
 
@@ -104,6 +115,12 @@ class Viibe {
    * @property {Function} func The function to trigger when an event is received
    */
 
+  /**
+   * 
+   * @param {object} options
+   * @param {string} options.host Target ViiBE subdomain (e.g. test.viibe.tech)
+   * @param {string} options.source Integration source (e.g. zendesk) 
+   */
   constructor(options) {
     /**
      * @type {Handler[]}

package/test/dist.test.js

@@ -0,0 +1,67 @@
+/**
+ * @jest-environment jsdom
+ */
+
+const Viibe = require('../dist');
+
+describe('dist', () => {
+  test('exposes Viibe constructor', () => {
+    expect(typeof Viibe).toBe('function')
+    expect(() => new Viibe()).toThrowError()
+    expect(new Viibe({})).toBeInstanceOf(Viibe)
+  });
+
+  test('throws errors when host or source are not defined', () => {
+    const viibe = new Viibe({});
+    expect(() => viibe.createNotificationIframe()).toThrow('fillHost')
+    expect(() => viibe.createCallIframe()).toThrow('fillHost')
+
+    const viibeWithHost = new Viibe({host: 'clement.viibe.tech'})
+    expect(() => viibeWithHost.createNotificationIframe()).toThrow('fillSource')
+    expect(() => viibeWithHost.createCallIframe()).toThrow('fillSource')
+  })
+
+  test('constructor', () => {
+    const viibe = new Viibe({
+        host: 'clement.viibe.tech',
+        source: 'jest'
+    })
+    expect(viibe.host).toBe('clement.viibe.tech')
+    expect(viibe.source).toBe('jest')
+    expect(viibe.origin).toBe('https://clement.viibe.tech')
+
+    const viibeLocalhost = new Viibe({
+        host: 'localhost:6666'
+    })
+    expect(viibeLocalhost.origin).toBe('http://localhost:6666')
+  });
+
+  test('createNotificationIframe', () => {
+    const viibe = new Viibe({
+        host: 'clement.viibe.tech',
+        source: 'jest',
+    })
+    const iframe = viibe.createNotificationIframe()
+    expect(iframe).toBeInstanceOf(HTMLIFrameElement)
+    expect(iframe.name).toMatch(/^viibe-[0-9]{1,4}$/)
+    expect(iframe.style.border).toBe('0px')
+    expect(iframe.style.width).toBe('0px')
+    expect(iframe.src).toBe('https://clement.viibe.tech/integration/features/notifications')
+  })
+
+  test('createCallIframe', () => {
+    const viibe = new Viibe({
+        host: 'clement.viibe.tech',
+        source: 'jest',
+    })
+    const iframe = viibe.createCallIframe()
+    const callUrl = viibe.createCallUrl()
+    expect(iframe).toBeInstanceOf(HTMLIFrameElement)
+    expect(iframe.name).toMatch(/^viibe-[0-9]{1,4}$/)
+    expect(iframe.allow).toBe('geolocation;autoplay;microphone;camera;midi;encrypted-media;clipboard-write;')
+    expect(iframe.style.border).toBe('0px')
+    expect(iframe.style.margin).toBe('0.5rem')
+    expect(iframe.style.width).toBe('calc(100% - 1rem)')
+    expect(iframe.src).toEqual(callUrl)
+  })
+});