preboot
Version:
Record server view events and play back to Angular client view
59 lines (57 loc) • 12.5 kB
JavaScript
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/common"),require("rxjs/operators")):"function"==typeof define&&define.amd?define("preboot",["exports","@angular/core","@angular/common","rxjs/operators"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).preboot={},e.ng.core,e.ng.common,e.rxjs.operators)}(this,(function(e,t,n,o){"use strict";function r(e){for(var t=[],n=e.root,o=e.node,r=o;r&&r!==n.serverNode&&r!==n.clientNode;)t.push(r),r=r.parentNode;r&&t.push(r);for(var i=o.nodeName||"unknown",a=t.length-1;a>=0;a--)if((r=t[a]).childNodes&&a>0)for(var l=0;l<r.childNodes.length;l++)if(r.childNodes[l]===t[a-1]){i+="_s"+(l+1);break}return i}
/**
* @license
* Copyright Google LLC All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://angular.io/license
*/var i=new t.InjectionToken("PrebootNonce");
/**
* @license
* Copyright Google LLC All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://angular.io/license
*/
/*! *****************************************************************************
Copyright (c) Microsoft Corporation.
Permission to use, copy, modify, and/or distribute this software for any
purpose with or without fee is hereby granted.
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
PERFORMANCE OF THIS SOFTWARE.
***************************************************************************** */Object.create;function a(e){var t="function"==typeof Symbol&&Symbol.iterator,n=t&&e[t],o=0;if(n)return n.call(e);if(e&&"number"==typeof e.length)return{next:function(){return e&&o>=e.length&&(e=void 0),{value:e&&e[o++],done:!e}}};throw new TypeError(t?"Object is not iterable.":"Symbol.iterator is not defined.")}Object.create;function l(){return{prebootData:window.prebootData,getComputedStyle:window.getComputedStyle,document:document}}var c=function(){function e(){this.clientNodeCache={},this.replayStarted=!1}return e.prototype.setWindow=function(e){this.win=e},e.prototype.getWindow=function(){return this.win||(this.win=l()),this.win},e.prototype.replayAll=function(){var e=this;if(!this.replayStarted){this.replayStarted=!0;var t=this.getWindow().prebootData||{};(t.apps||[]).forEach((function(t){return e.replayForApp(t)})),this.cleanup(t)}},e.prototype.replayForApp=function(e){var t=this;e=e||{};try{(e.events||[]).forEach((function(n){return t.replayEvent(e,n)}))}catch(e){console.error(e)}this.switchBuffer(e)},e.prototype.replayEvent=function(e,t){e=e||{};var n=(t=t||{}).event,o=t.node||{},r=t.nodeKey,i=this.findClientNode({root:e.root,node:o,nodeKey:r});i?(i.checked=o.checked,i.selected=o.selected,i.value=o.value,i.dispatchEvent(n)):console.warn("Trying to dispatch event "+n.type+" to node "+r+"\n but could not find client node. Server node is: "+o)},e.prototype.switchBuffer=function(e){var t=(e=e||{}).root||{},n=t.serverNode,o=t.clientNode;if(o&&n&&n!==o&&"BODY"!==n.nodeName)try{var r=(0,this.getWindow().getComputedStyle)(n).getPropertyValue("display")||"block";n.remove?n.remove():n.style.display="none",o.style.display=r}catch(e){console.error(e)}},e.prototype.cleanup=function(e){var t,n,o=this,r=(e=e||{}).listeners||[],i=e.activeNode;null!=i&&setTimeout((function(){return o.setFocus(i)}),1);try{for(var l=a(r),c=l.next();!c.done;c=l.next()){var s=c.value;s.node.removeEventListener(s.eventName,s.handler)}}catch(e){t={error:e}}finally{try{c&&!c.done&&(n=l.return)&&n.call(l)}finally{if(t)throw t.error}}var u=this.getWindow().document,d=u.getElementById("prebootOverlay");if(d&&(d.remove?d.remove():null!==d.parentNode?d.parentNode.removeChild(d):d.style.display="none"),e.apps=[],this.clientNodeCache={},"function"==typeof CustomEvent){var p=new CustomEvent("PrebootComplete");u.dispatchEvent(p)}else console.warn("Could not dispatch PrebootComplete event.\n You can fix this by including a polyfill for CustomEvent.")},e.prototype.setFocus=function(e){if(e&&e.node&&e.nodeKey){var t=this.findClientNode(e);if(t){t.focus();var n=e.selection;if(t.setSelectionRange&&n)try{t.setSelectionRange(n.start,n.end,n.direction)}catch(e){}}}},e.prototype.findClientNode=function(e){var t=(e=e||{}).node,n=e.root;if(!n||!n.serverNode||!n.clientNode)return null;var o=e.nodeKey||r(e);if(this.clientNodeCache[o])return this.clientNodeCache[o];var i=(t.className||"").replace("ng-binding","").trim(),a=t.tagName;t.id?a+="#"+t.id:i&&(a+="."+i.replace(/ /g,"."));var l=n.clientNode,c=l.querySelectorAll(a);c.length||(console.log("nothing found for "+a+" so using "+t.tagName),c=l.querySelectorAll(t.tagName));for(var s=c.length,u=0;u<s;u++){var d=c.item(u);if(r({root:n,node:d})===o)return this.clientNodeCache[o]=d,d}return 1===c.length?(this.clientNodeCache[o]=c[0],c[0]):(console.warn("No matching client node found for "+o+".\n You can fix this by assigning this element a unique id attribute."),null)},e}();function s(e,t){var n=t||window,o=n.prebootData={opts:e,apps:[],listeners:[]};return function(){return u(o,n)}}function u(e,t){var n=(t||window).document||{},o=n.currentScript||[].slice.call(n.getElementsByTagName("script"),-1)[0];if(o){var r=o.parentNode;if(r){r.removeChild(o);var i=(e.opts||{}).eventSelectors||[],a={root:e.opts?p(n,e.opts,r):null,events:[]};e.apps&&e.apps.push(a),(i=i.map((function(e){return e.hasOwnProperty("replay")||(e.replay=!0),e}))).forEach((function(t){return f(n,e,a,t)}))}else console.error("Preboot initialization failed, the script is detached")}else console.error("Preboot initialization failed, no currentScript has been detected.")}function d(e){var t=e.createElement("div");return t.setAttribute("id","prebootOverlay"),t.setAttribute("style","display:none;position:absolute;left:0;top:0;width:100%;height:100%;z-index:999999;background:black;opacity:.3"),e.documentElement.appendChild(t),t}function p(e,t,n){var o={serverNode:n};return o.clientNode=t.buffer?y(o):o.serverNode,t.disableOverlay||(o.overlay=d(e)),o}function f(e,t,n,o){var r=n.root.serverNode;r&&o.events.forEach((function(i){var a=v(e,t,o,n);r.addEventListener(i,a,!0),t.listeners&&t.listeners.push({node:r,eventName:i,handler:a})}))}function v(e,t,n,o){var i=["keyup","keydown","focusin","mouseup","mousedown"],a=["INPUT","TEXTAREA"],l=e.documentElement.matches||e.documentElement.msMatchesSelector,c=t.opts;return function(e){var s=e.target;if(l.call(s,n.selector)){var u=o.root,d=e.type;if(s&&d){var p=n.keyCodes;if(p&&p.length)if(!p.filter((function(t){return e.which===t})).length)return;n.preventDefault&&e.preventDefault(),n.action&&n.action(s,e);var f=r({root:u,node:s});if(i.indexOf(d)>=0){var v=a.indexOf(s.tagName?s.tagName:"")>=0;t.activeNode={root:u,node:s,nodeKey:f,selection:v?h(s):void 0}}else"change"!==d&&"focusout"!==d&&(t.activeNode=void 0);if(c&&!c.disableOverlay&&n.freeze){var y=u.overlay;y.style.display="block",setTimeout((function(){y.style.display="none"}),1e4)}n.replay&&o.events.push({node:s,nodeKey:f,event:e,name:d})}}}}function h(e){var t=(e=e||{}).value||"",n={start:t.length,end:t.length,direction:"forward"};try{(e.selectionStart||0===e.selectionStart)&&(n.start=e.selectionStart,n.end=e.selectionEnd?e.selectionEnd:0,n.direction=e.selectionDirection?e.selectionDirection:"none")}catch(e){}return n}function y(e){var t=e.serverNode;if(!t||!t.parentNode||t===document.documentElement||t===document.body)return t;var n=t.cloneNode(!1);return n.style.display="none",t.parentNode.insertBefore(n,t),t.setAttribute("ng-non-bindable",""),n}var m={start:u,createOverlay:d,getAppRoot:p,handleEvents:f,createListenHandler:v,getSelection:h,createBuffer:y},g="prebootInitFn",b={buffer:!0,replay:!0,disableOverlay:!1,eventSelectors:[{selector:"input,textarea",events:["keypress","keyup","keydown","input","change"]},{selector:"select,option",events:["change"]},{selector:"input",events:["keyup"],preventDefault:!0,keyCodes:[13],freeze:!0},{selector:"form",events:["submit"],preventDefault:!0,freeze:!0},{selector:"input,textarea",events:["focusin","focusout","mousedown","mouseup"],replay:!1},{selector:"button",events:["click"],preventDefault:!0,freeze:!0}]};function N(){var e=[];for(var t in m)if(m.hasOwnProperty(t)){var n=m[t].toString().replace("common_1.","");e.push(n)}return e.push(r.toString()),"\n\n"+e.join("\n\n")+"\n\n"}function w(e){var t=S({},b,e);O(t);var n=N(),o=C(t);return"var prebootInitFn = (function() {\n "+n+"\n return ("+s.toString().replace("common_1.","")+")("+o+");\n })();"}function E(){return"prebootInitFn();"}function O(e){if(!e.appRoot||!e.appRoot.length)throw new Error("The appRoot is missing from preboot options. This is needed to find the root of your application. Set this value in the preboot options to be a selector for the root element of your app.")}function S(e){for(var t=[],n=1;n<arguments.length;n++)t[n-1]=arguments[n];if(null==e)throw new TypeError("Cannot convert undefined or null to object");for(var o=Object(e),r=0;r<t.length;r++){var i=t[r];if(null!=i)for(var a in i)i.hasOwnProperty&&i.hasOwnProperty(a)&&(o[a]=i[a])}return o}function C(e){for(var t,n,o="START_FUNCTION_HERE",r="STOP_FUNCTION_HERE",i=JSON.stringify(e,(function(e,t){return t&&t.constructor&&t.call&&t.apply?o+t.toString()+r:t})),a=i.indexOf(o);a>=0;)t=i.indexOf(r),n=(n=i.substring(a+o.length,t)).replace(/\\n/g,"\n"),a=(i=i.substring(0,a-1)+n+i.substring(t+r.length+1)).indexOf(o);return i}
/**
* @license
* Copyright Google LLC All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://angular.io/license
*/
/**
* @license
* Copyright Google LLC All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://angular.io/license
*/var T="preboot-inline-script",P=new t.InjectionToken("PrebootOptions");function R(e,t,n){var o=e.createElement("script");return t&&(o.nonce=t),o.className=T,o.textContent=n,o}function k(e,t,r,i,a,l){return function(){if(O(t),n.isPlatformServer(i)){var c=w(t),s=R(e,r,c),u=e.getElementsByClassName(T);if(0===u.length){var d=[].concat(t.appRoot);e.head.appendChild(s),d.map((function(t){return{selector:t,appRootElem:e.querySelector(t)}})).forEach((function(t){var n=t.selector,o=t.appRootElem;if(o){var i=R(e,r,"prebootInitFn();");o.insertBefore(i,o.firstChild)}else console.log("No server node found for selector: "+n)}))}else u.length>0&&r&&(u[0].nonce=r)}n.isPlatformBrowser(i)&&((null==t.replay||t.replay)&&a.isStable.pipe(o.filter((function(e){return e})),o.take(1)).subscribe((function(){l.replayAll()})))}}var x={provide:t.APP_BOOTSTRAP_LISTENER,useFactory:k,deps:[n.DOCUMENT,P,[new t.Optional,new t.Inject(i)],t.PLATFORM_ID,t.ApplicationRef,c],multi:!0},A=function(){function e(){}return e.withConfig=function(t){return{ngModule:e,providers:[{provide:P,useValue:t}]}},e}();
/**
* @license
* Copyright Google LLC All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://angular.io/license
*/A.decorators=[{type:t.NgModule,args:[{providers:[c,x]}]}],
/**
* @license
* Copyright Google LLC All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://angular.io/license
*/
e.EventReplayer=c,e.PREBOOT_NONCE=i,e.PrebootModule=A,e._window=l,e.assign=S,e.createBuffer=y,e.createListenHandler=v,e.createOverlay=d,e.defaultOptions=b,e.getAppRoot=p,e.getEventRecorderCode=N,e.getInlineDefinition=w,e.getInlineInvocation=E,e.getNodeKeyForPreboot=r,e.getSelection=h,e.handleEvents=f,e.initAll=s,e.initFunctionName=g,e.start=u,e.stringifyWithFunctions=C,e.validateOptions=O,e.ɵa=P,e.ɵb=k,e.ɵc=x,Object.defineProperty(e,"__esModule",{value:!0})}));
//# sourceMappingURL=preboot.umd.min.js.map