Error monitoring tool for recording videos & screenshots of user sessions


Post by dimehb »

Some of our customers - for various reasons - cannot (or don't want to) use RootCause, which forced us to make error logging optional (i.e. configurable).

Even though it can be configured, the script is always loaded. So this effectively means we'd have to get rid of this:

<script type="text/javascript" src="https://app.therootcause.io/rootcause-full-extjs.js" defer crossorigin="anonymous"></script>

in favor of something like this:
$.getScript(https://app.therootcause.io/rootcause-full-extjs.js)
or
var head = document.getElementsByTagName('head')[0];
var script = document.createElement("script");        
script.type = 'text/javascript';
script.src = "https://app.therootcause.io/rootcause-full-extjs.js";
script.crossorigin = "anonymous";
head.appendChild(script);
But either method is returning this error:
rootcause-full-extjs.js:10 Uncaught TypeError: Singleton is not a function
at rootcause-full-extjs.js:10

For the next error, see bottom.

Is there any way we could add this script on the fly to the browser?
Uncaught Error: Mismatched anonymous define() module: function(){"use strict";function e(e){return"function"==typeof e}function t(){var e=setTimeout;return function(){return e(n,1)}}function n(){for(var e=0;e<w;e+=2){(0,k[e])(k[e+1]),k[e]=void 0,k[e+1]=void 0}w=0}function i(e,t){var n=arguments,i=this,r=new this.constructor(o);void 0===r[_]&&g(r);var s=i._state;return s?function(){var e=n[s-1];S(function(){return m(s,r,e,i._result)})}():h(i,r,e,t),r}function r(e){if(e&&"object"==typeof e&&e.constructor===this)return e;var t=new this(o);return l(t,e),t}function o(){}function s(e){try{return e.then}catch(e){return I.error=e,I}}function a(t,n,o){n.constructor===t.constructor&&o===i&&n.constructor.resolve===r?function(e,t){t._state===O?c(e,t._result):t._state===D?d(e,t._result):h(t,void 0,function(t){return l(e,t)},function(t){return d(e,t)})}(t,n):o===I?d(t,I.error):void 0===o?c(t,n):e(o)?function(e,t,n){S(function(e){var i=!1,r=function(e,t,n,i){try{e.call(t,n,i)}catch(e){return e}}(n,t,function(n){i||(i=!0,t!==n?l(e,n):c(e,n))},function(t){i||(i=!0,d(e,t))},e._label);!i&&r&&(i=!0,d(e,r))},e)}(t,n,o):c(t,n)}function l(e,t){e===t?d(e,new TypeError("You cannot resolve a promise with itself")):!function(e){return"function"==typeof e||"object"==typeof e&&null!==e}(t)?c(e,t):a(e,t,s(t))}function u(e){e._onerror&&e._onerror(e._result),p(e)}function c(e,t){e._state===N&&(e._result=t,e._state=O,0!==e._subscribers.length&&S(p,e))}function d(e,t){e._state===N&&(e._state=D,e._result=t,S(u,e))}function h(e,t,n,i){var r=e._subscribers,o=r.length;e._onerror=null,r[o]=t,r[o+O]=n,r[o+D]=i,0===o&&e._state&&S(p,e)}function p(e){var t=e._subscribers,n=e._state;if(0!==t.length){for(var i=void 0,r=void 0,o=e._result,s=0;s<t.length;s+=3)i=t[s],r=t[s+n],i?m(n,i,r,o):r(o);e._subscribers.length=0}}function f(){this.error=null}function m(t,n,i,r){var o=e(i),s=void 0,a=void 0,u=void 0,h=void 0;if(o){if((s=function(e,t){try{return e(t)}catch(e){return L.error=e,L}}(i,r))===L?(h=!0,a=s.error,s=null):u=!0,n===s)return void d(n,new TypeError("A promises callback cannot return that same promise."))}else s=r,u=!0;n._state!==N||(o&&u?l(n,s):h?d(n,a):t===O?c(n,s):t===D&&d(n,s))}function g(e){e[_]=F++,e._state=void 0,e._result=void 0,e._subscribers=[]}function v(e,t){this._instanceConstructor=e,this.promise=new e(o),this.promise[_]||g(this.promise),b(t)?(this._input=t,this.length=t.length,this._remaining=t.length,this._result=new Array(this.length),0===this.length?c(this.promise,this._result):(this.length=this.length||0,this._enumerate(),0===this._remaining&&c(this.promise,this._result))):d(this.promise,new Error("Array Methods must be provided an Array"))}function y(e){this[_]=F++,this._result=this._state=void 0,this._subscribers=[],o!==e&&("function"!=typeof e&&function(){throw new TypeError("You must pass a resolver function as the first argument to the promise constructor")}(),this instanceof y?function(e,t){try{t(function(t){l(e,t)},function(t){d(e,t)})}catch(t){d(e,t)}}(this,e):function(){throw new TypeError("Failed to construct 'Promise': Please use the 'new' operator, this object constructor cannot be called as a function.")}())}var b=Array.isArray?Array.isArray:function(e){return"[object Array]"===Object.prototype.toString.call(e)},w=0,C=void 0,E=void 0,S=function(e,t){k[w]=e,k[w+1]=t,2===(w+=2)&&(E?E(n):A())},x="undefined"!=typeof window?window:void 0,R=x||{},P=R.MutationObserver||R.WebKitMutationObserver,M="undefined"==typeof self&&"undefined"!=typeof process&&"[object process]"==={}.toString.call(process),T="undefined"!=typeof Uint8ClampedArray&&"undefined"!=typeof importScripts&&"undefined"!=typeof MessageChannel,k=new Array(1e3),A=void 0;A=M?function(){return process.nextTick(n)}:P?function(){var e=0,t=new P(n),i=document.createTextNode("");return t.observe(i,{characterData:!0}),function(){i.data=e=++e%2}}():T?function(){var e=new MessageChannel;return e.port1.onmessage=n,function(){return e.port2.postMessage(0)}}():void 0===x&&"function"==typeof require?function(){try{var e=require("vertx");return void 0!==(C=e.runOnLoop||e.runOnContext)?function(){C(n)}:t()}catch(e){return t()}}():t();var _=Math.random().toString(36).substring(16),N=void 0,O=1,D=2,I=new f,L=new f,F=0;return v.prototype._enumerate=function(){for(var e=this.length,t=this._input,n=0;this._state===N&&n<e;n++)this._eachEntry(t[n],n)},v.prototype._eachEntry=function(e,t){var n=this._instanceConstructor,l=n.resolve;if(l===r){var u=s(e);if(u===i&&e._state!==N)this._settledAt(e._state,t,e._result);else if("function"!=typeof u)this._remaining--,this._result[t]=e;else if(n===y){var c=new n(o);a(c,e,u),this._willSettleAt(c,t)}else this._willSettleAt(new n(function(t){return t(e)}),t)}else this._willSettleAt(l(e),t)},v.prototype._settledAt=function(e,t,n){var i=this.promise;i._state===N&&(this._remaining--,e===D?d(i,n):this._result[t]=n),0===this._remaining&&c(i,this._result)},v.prototype._willSettleAt=function(e,t){var n=this;h(e,void 0,function(e){return n._settledAt(O,t,e)},function(e){return n._settledAt(D,t,e)})},y.all=function(e){return new v(this,e).promise},y.race=function(e){var t=this;return b(e)?new t(function(n,i){for(var r=e.length,o=0;o<r;o++)t.resolve(e[o]).then(n,i)}):new t(function(e,t){return t(new TypeError("You must pass an array to race."))})},y.resolve=r,y.reject=function(e){var t=new this(o);return d(t,e),t},y._setScheduler=function(e){E=e},y._setAsap=function(e){S=e},y._asap=S,y.prototype={constructor:y,then:i,catch:function(e){return this.then(null,e)}},y.polyfill=function(){var e=void 0;if("undefined"!=typeof global)e=global;else if("undefined"!=typeof self)e=self;else try{e=Function("return this")()}catch(e){throw new Error("polyfill failed because global object is unavailable in this environment")}var t=e.Promise;if(t){var n=null;try{n=Object.prototype.toString.call(t.resolve())}catch(e){}if("[object Promise]"===n&&!t.cast)return}e.Promise=y},y.Promise=y,void 0===window.Promise&&y.polyfill(),y}
https://requirejs.org/docs/errors.html#mismatch
    at makeError (Index?v=2wVuzrf0hV0J74Ivv_i4ap1uinMgk8U5fnUaZE4xQ7w1:190833)
    at v (Index?v=2wVuzrf0hV0J74Ivv_i4ap1uinMgk8U5fnUaZE4xQ7w1:190833)
    at Object.o [as require] (Index?v=2wVuzrf0hV0J74Ivv_i4ap1uinMgk8U5fnUaZE4xQ7w1:190833)
    at requirejs (Index?v=2wVuzrf0hV0J74Ivv_i4ap1uinMgk8U5fnUaZE4xQ7w1:190833)
    at Function.req.config (Index?v=2wVuzrf0hV0J74Ivv_i4ap1uinMgk8U5fnUaZE4xQ7w1:190833)
Last edited by dimehb on Fri May 24, 2019 11:57 am, edited 1 time in total.

Post by mats »

It should work fine to load it as you do, it's just a JS script file like any other. Try doing it in any website, I don't see any error after loading the script by adding to HEAD, on for example www.bryntum.com.

Post by dimehb »

You're right. Turns out there was a naming conflict as I also have a Singleton class. I gave it a namespace and it works.
Maybe something you could as well to prevent this from happening with other customers.

Thanks for the reply.

Post by mats »

Yes next Siesta major version will not have this issue.

Post Reply