react-activity-tracker/dist/index.cjs.js

A library to track user interactions and API activity in React apps

"use strict";var e=require("axios");let t=[];const n=(e,n)=>{const o=(new Date).toISOString();t.push({type:e,timestamp:o,...n})};function o(e){try{return"string"==typeof e?JSON.parse(e):e}catch{return e}}function r(e){try{return"string"==typeof e?JSON.parse(e):e}catch{return e}}function a(e){try{return"string"==typeof e?JSON.parse(e):e}catch{return e}}function s(e){return e.name||e.id||e.innerText&&e.innerText.trim().substring(0,50)||e.placeholder||e.className||""}exports.getEvents=()=>t,exports.initGlobalTracker=function(){const t=e=>{n(e)};!function(e){const t=window.fetch;window.fetch=async function(n,r={},a=""){const s=r.method||"GET",i=r.body?o(r.body):null;try{const c=await t(n,r),d=c.clone(),u=o(await d.text());return e({type:"api",label:a,url:n,method:s,requestBody:i,responseBody:u,status:c.status}),c}catch(t){throw e({type:"api",label:a,url:n,method:s,requestBody:i,responseBody:{error:t.message},status:"error"}),t}}}(t),function(e){const t=XMLHttpRequest.prototype.open,n=XMLHttpRequest.prototype.send;XMLHttpRequest.prototype.open=function(e,n){return this._method=e,this._url=n,t.apply(this,arguments)},XMLHttpRequest.prototype.send=function(t){const o=this,a=t?r(t):null;return o.addEventListener("loadend",(function(){const t=r(o.responseText);e({type:"api",label:"",url:o._url,method:o._method,requestBody:a,responseBody:t,status:o.status})})),n.apply(this,arguments)}}(t),function(t){e.interceptors.request.use((e=>(e.metadata={requestBody:e.data?a(e.data):null},e))),e.interceptors.response.use((e=>(t({type:"api",label:e.config.label||"",url:e.config.url,method:e.config.method,requestBody:e.config.metadata?.requestBody||null,responseBody:e.data,status:e.status}),e)),(e=>{const n=e.config||{};return t({type:"api",label:n.label||"",url:n.url,method:n.method||"UNKNOWN",requestBody:n.metadata?.requestBody||null,responseBody:{error:e.message},status:e.response?.status||"error"}),Promise.reject(e)}))}(t),function(e){const t=window.WebSocket;window.WebSocket=function(...n){const o=new t(...n),[r]=n;o.addEventListener("message",(t=>{e({type:"websocket-receive",url:r,data:t.data,time:(new Date).toISOString()})}));const a=o.send;return o.send=function(t){return e({type:"websocket-send",url:r,data:t,time:(new Date).toISOString()}),a.call(o,t)},o}}(t),function(e){const t=navigator.sendBeacon;navigator.sendBeacon=function(n,o){return e({type:"beacon",url:n,data:o,time:(new Date).toISOString()}),t.call(this,n,o)}}(t)},exports.initUserActivityTracker=function(){const e=e=>{n(e)};!function(e){document.addEventListener("click",(t=>{const n=t.target;e({type:"click",element:n.tagName,id:n.id,className:n.className,label:s(n),time:(new Date).toISOString()})})),document.addEventListener("input",(t=>{const n=t.target;e({type:"input",element:n.tagName,id:n.id,name:n.name,value:n.value,label:s(n),time:(new Date).toISOString()})}))}(e),function(e){window.addEventListener("error",(t=>{e({type:"error",message:t.message,filename:t.filename,line:t.lineno,col:t.colno,time:(new Date).toISOString()})})),window.addEventListener("unhandledrejection",(t=>{e({type:"unhandledrejection",reason:t.reason,time:(new Date).toISOString()})}))}(e),function(e){window.addEventListener("load",(()=>{const t=performance.timing;e({type:"performance",pageLoad:t.loadEventEnd-t.navigationStart,dns:t.domainLookupEnd-t.domainLookupStart,connect:t.connectEnd-t.connectStart,time:(new Date).toISOString()})}))}(e)},exports.logEvent=n,exports.sendToServer=e=>{e&&t.length>0&&fetch(e,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(t)}).then((()=>{t=[]}))};