@devskin/browser-sdk 1.0.30 → 1.0.31
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/collectors/network.d.ts.map +1 -1
- package/dist/collectors/performance.d.ts.map +1 -1
- package/dist/devskin.cjs.js +49 -66
- package/dist/devskin.cjs.js.map +1 -1
- package/dist/devskin.esm.js +49 -66
- package/dist/devskin.esm.js.map +1 -1
- package/dist/devskin.umd.js +49 -66
- package/dist/devskin.umd.js.map +1 -1
- package/dist/devskin.umd.min.js +2 -2
- package/dist/devskin.umd.min.js.map +1 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/transport.d.ts +2 -0
- package/dist/transport.d.ts.map +1 -1
- package/dist/types.d.ts +8 -7
- package/dist/types.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"network.d.ts","sourceRoot":"","sources":["../../src/collectors/network.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAkB,MAAM,UAAU,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzC,qBAAa,gBAAgB;IAEzB,OAAO,CAAC,MAAM;IACd,OAAO,CAAC,SAAS;gBADT,MAAM,EAAE,aAAa,EACrB,SAAS,EAAE,SAAS;IAG9B,KAAK,IAAI,IAAI;IAKb,OAAO,CAAC,cAAc;
|
|
1
|
+
{"version":3,"file":"network.d.ts","sourceRoot":"","sources":["../../src/collectors/network.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAkB,MAAM,UAAU,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzC,qBAAa,gBAAgB;IAEzB,OAAO,CAAC,MAAM;IACd,OAAO,CAAC,SAAS;gBADT,MAAM,EAAE,aAAa,EACrB,SAAS,EAAE,SAAS;IAG9B,KAAK,IAAI,IAAI;IAKb,OAAO,CAAC,cAAc;IAqFtB,OAAO,CAAC,YAAY;IAoHpB,OAAO,CAAC,eAAe;YAiBT,eAAe;IAS7B,OAAO,CAAC,eAAe;IAQvB,OAAO,CAAC,oBAAoB;CAgB7B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"performance.d.ts","sourceRoot":"","sources":["../../src/collectors/performance.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAE7D,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzC,qBAAa,oBAAoB;IAI7B,OAAO,CAAC,MAAM;IACd,OAAO,CAAC,SAAS;IAJnB,OAAO,CAAC,OAAO,CAA0B;gBAG/B,MAAM,EAAE,aAAa,EACrB,SAAS,EAAE,SAAS;IAG9B,KAAK,IAAI,IAAI;IAoBb,OAAO,CAAC,YAAY;IAkBpB,OAAO,CAAC,wBAAwB;
|
|
1
|
+
{"version":3,"file":"performance.d.ts","sourceRoot":"","sources":["../../src/collectors/performance.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAE7D,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzC,qBAAa,oBAAoB;IAI7B,OAAO,CAAC,MAAM;IACd,OAAO,CAAC,SAAS;IAJnB,OAAO,CAAC,OAAO,CAA0B;gBAG/B,MAAM,EAAE,aAAa,EACrB,SAAS,EAAE,SAAS;IAG9B,KAAK,IAAI,IAAI;IAoBb,OAAO,CAAC,YAAY;IAkBpB,OAAO,CAAC,wBAAwB;IAgChC,OAAO,CAAC,sBAAsB;IA0C9B,OAAO,CAAC,gBAAgB;IA6BxB,UAAU,IAAI,kBAAkB;CAGjC"}
|
package/dist/devskin.cjs.js
CHANGED
|
@@ -338,12 +338,12 @@ class PerformanceCollector {
|
|
|
338
338
|
if (this.config.debug) {
|
|
339
339
|
console.log(`[DevSkin] Web Vital ${metric.name}:`, metric.value);
|
|
340
340
|
}
|
|
341
|
-
// Send metric to backend
|
|
341
|
+
// Send metric to backend - match backend schema
|
|
342
342
|
this.transport.sendPerformanceMetric({
|
|
343
|
-
|
|
343
|
+
metricName: metric.name, // Changed from 'name' to 'metricName'
|
|
344
344
|
value: metric.value,
|
|
345
345
|
rating: metric.rating,
|
|
346
|
-
|
|
346
|
+
url: window.location.href,
|
|
347
347
|
timestamp: new Date().toISOString(),
|
|
348
348
|
});
|
|
349
349
|
}
|
|
@@ -366,19 +366,9 @@ class PerformanceCollector {
|
|
|
366
366
|
});
|
|
367
367
|
}
|
|
368
368
|
this.transport.sendPerformanceMetric({
|
|
369
|
-
|
|
369
|
+
metricName: 'Navigation',
|
|
370
370
|
value: windowLoad,
|
|
371
|
-
|
|
372
|
-
domLoad,
|
|
373
|
-
windowLoad,
|
|
374
|
-
navigationType: navigation.type,
|
|
375
|
-
redirectCount: navigation.redirectCount,
|
|
376
|
-
dns: timing.domainLookupEnd - timing.domainLookupStart,
|
|
377
|
-
tcp: timing.connectEnd - timing.connectStart,
|
|
378
|
-
request: timing.responseStart - timing.requestStart,
|
|
379
|
-
response: timing.responseEnd - timing.responseStart,
|
|
380
|
-
dom: timing.domComplete - timing.domLoading,
|
|
381
|
-
},
|
|
371
|
+
url: window.location.href,
|
|
382
372
|
timestamp: new Date().toISOString(),
|
|
383
373
|
});
|
|
384
374
|
}, 0);
|
|
@@ -412,9 +402,9 @@ class PerformanceCollector {
|
|
|
412
402
|
console.log('[DevSkin] Resource Timings:', resourceStats);
|
|
413
403
|
}
|
|
414
404
|
this.transport.sendPerformanceMetric({
|
|
415
|
-
|
|
405
|
+
metricName: 'Resources',
|
|
416
406
|
value: resources.length,
|
|
417
|
-
|
|
407
|
+
url: window.location.href,
|
|
418
408
|
timestamp: new Date().toISOString(),
|
|
419
409
|
});
|
|
420
410
|
}, 1000);
|
|
@@ -431,13 +421,9 @@ class PerformanceCollector {
|
|
|
431
421
|
console.log('[DevSkin] Long Task detected:', entry);
|
|
432
422
|
}
|
|
433
423
|
this.transport.sendPerformanceMetric({
|
|
434
|
-
|
|
424
|
+
metricName: 'LongTask',
|
|
435
425
|
value: entry.duration,
|
|
436
|
-
|
|
437
|
-
name: entry.name,
|
|
438
|
-
entryType: entry.entryType,
|
|
439
|
-
startTime: entry.startTime,
|
|
440
|
-
},
|
|
426
|
+
url: window.location.href,
|
|
441
427
|
timestamp: new Date().toISOString(),
|
|
442
428
|
});
|
|
443
429
|
}
|
|
@@ -677,7 +663,7 @@ class NetworkCollector {
|
|
|
677
663
|
return;
|
|
678
664
|
const originalFetch = window.fetch;
|
|
679
665
|
window.fetch = (...args) => __awaiter$1(this, void 0, void 0, function* () {
|
|
680
|
-
var _a, _b
|
|
666
|
+
var _a, _b;
|
|
681
667
|
const [resource, config] = args;
|
|
682
668
|
const url = typeof resource === 'string'
|
|
683
669
|
? resource
|
|
@@ -703,26 +689,18 @@ class NetworkCollector {
|
|
|
703
689
|
const networkRequest = {
|
|
704
690
|
url,
|
|
705
691
|
method,
|
|
706
|
-
|
|
707
|
-
duration,
|
|
708
|
-
|
|
709
|
-
type: 'fetch',
|
|
692
|
+
statusCode: response.status,
|
|
693
|
+
durationMs: duration,
|
|
694
|
+
responseSize: yield this.getResponseSize(clonedResponse),
|
|
710
695
|
timestamp: new Date().toISOString(),
|
|
711
|
-
failed: !response.ok,
|
|
712
696
|
};
|
|
713
697
|
// Capture headers if enabled
|
|
714
698
|
if ((_b = this.config.networkRequestOptions) === null || _b === void 0 ? void 0 : _b.captureHeaders) {
|
|
715
|
-
networkRequest.
|
|
699
|
+
networkRequest.responseHeaders = this.headersToObject(response.headers);
|
|
716
700
|
}
|
|
717
|
-
// Capture
|
|
718
|
-
if (
|
|
719
|
-
|
|
720
|
-
const text = yield clonedResponse.text();
|
|
721
|
-
networkRequest.body = text.substring(0, 10000); // Limit to 10KB
|
|
722
|
-
}
|
|
723
|
-
catch (error) {
|
|
724
|
-
// Body might not be readable
|
|
725
|
-
}
|
|
701
|
+
// Capture error message for failed requests
|
|
702
|
+
if (!response.ok) {
|
|
703
|
+
networkRequest.errorMessage = `HTTP ${response.status} ${response.statusText}`;
|
|
726
704
|
}
|
|
727
705
|
if (this.config.debug) {
|
|
728
706
|
console.log('[DevSkin] Network request tracked:', networkRequest);
|
|
@@ -736,10 +714,9 @@ class NetworkCollector {
|
|
|
736
714
|
const networkRequest = {
|
|
737
715
|
url,
|
|
738
716
|
method,
|
|
739
|
-
duration,
|
|
740
|
-
type: 'fetch',
|
|
717
|
+
durationMs: duration,
|
|
741
718
|
timestamp: new Date().toISOString(),
|
|
742
|
-
|
|
719
|
+
errorMessage: error instanceof Error ? error.message : 'Network request failed',
|
|
743
720
|
};
|
|
744
721
|
if (this.config.debug) {
|
|
745
722
|
console.log('[DevSkin] Network request failed:', networkRequest);
|
|
@@ -778,7 +755,7 @@ class NetworkCollector {
|
|
|
778
755
|
const collector = window.__devskinNetworkCollector;
|
|
779
756
|
// Track when request completes
|
|
780
757
|
const handleLoad = () => {
|
|
781
|
-
var _a, _b
|
|
758
|
+
var _a, _b;
|
|
782
759
|
const duration = Date.now() - devskin.startTime;
|
|
783
760
|
// Check if should be ignored
|
|
784
761
|
if (collector === null || collector === void 0 ? void 0 : collector.shouldIgnoreUrl(devskin.url)) {
|
|
@@ -793,25 +770,17 @@ class NetworkCollector {
|
|
|
793
770
|
const networkRequest = {
|
|
794
771
|
url: devskin.url,
|
|
795
772
|
method: devskin.method,
|
|
796
|
-
|
|
797
|
-
duration,
|
|
798
|
-
type: 'xhr',
|
|
773
|
+
statusCode: xhr.status,
|
|
774
|
+
durationMs: duration,
|
|
799
775
|
timestamp: new Date().toISOString(),
|
|
800
|
-
failed: xhr.status === 0 || xhr.status >= 400,
|
|
801
776
|
};
|
|
802
777
|
// Capture headers if enabled
|
|
803
778
|
if ((_b = collector === null || collector === void 0 ? void 0 : collector.config.networkRequestOptions) === null || _b === void 0 ? void 0 : _b.captureHeaders) {
|
|
804
|
-
networkRequest.
|
|
779
|
+
networkRequest.responseHeaders = collector.parseResponseHeaders(xhr.getAllResponseHeaders());
|
|
805
780
|
}
|
|
806
|
-
// Capture
|
|
807
|
-
if (
|
|
808
|
-
networkRequest.
|
|
809
|
-
try {
|
|
810
|
-
networkRequest.body = (_d = xhr.responseText) === null || _d === void 0 ? void 0 : _d.substring(0, 10000);
|
|
811
|
-
}
|
|
812
|
-
catch (error) {
|
|
813
|
-
// Response might not be readable
|
|
814
|
-
}
|
|
781
|
+
// Capture error message for failed requests
|
|
782
|
+
if (xhr.status === 0 || xhr.status >= 400) {
|
|
783
|
+
networkRequest.errorMessage = `HTTP ${xhr.status} ${xhr.statusText}`;
|
|
815
784
|
}
|
|
816
785
|
if (collector === null || collector === void 0 ? void 0 : collector.config.debug) {
|
|
817
786
|
console.log('[DevSkin] XHR request tracked:', networkRequest);
|
|
@@ -824,10 +793,9 @@ class NetworkCollector {
|
|
|
824
793
|
const networkRequest = {
|
|
825
794
|
url: devskin.url,
|
|
826
795
|
method: devskin.method,
|
|
827
|
-
duration,
|
|
828
|
-
type: 'xhr',
|
|
796
|
+
durationMs: duration,
|
|
829
797
|
timestamp: new Date().toISOString(),
|
|
830
|
-
|
|
798
|
+
errorMessage: 'XHR request failed',
|
|
831
799
|
};
|
|
832
800
|
if (collector === null || collector === void 0 ? void 0 : collector.config.debug) {
|
|
833
801
|
console.log('[DevSkin] XHR request failed:', networkRequest);
|
|
@@ -13590,6 +13558,7 @@ class Transport {
|
|
|
13590
13558
|
this.flushInterval = null;
|
|
13591
13559
|
this.maxQueueSize = 20; // Reduced from 50
|
|
13592
13560
|
this.flushIntervalMs = 2000; // 2 seconds (reduced from 5s)
|
|
13561
|
+
this.sessionId = null;
|
|
13593
13562
|
this.apiUrl = config.apiUrl || 'https://api.devskin.com';
|
|
13594
13563
|
// Start periodic flush
|
|
13595
13564
|
this.startPeriodicFlush();
|
|
@@ -13606,6 +13575,9 @@ class Transport {
|
|
|
13606
13575
|
});
|
|
13607
13576
|
}
|
|
13608
13577
|
}
|
|
13578
|
+
setSessionId(sessionId) {
|
|
13579
|
+
this.sessionId = sessionId;
|
|
13580
|
+
}
|
|
13609
13581
|
sendEvent(event) {
|
|
13610
13582
|
this.enqueue('event', event);
|
|
13611
13583
|
}
|
|
@@ -13727,9 +13699,16 @@ class Transport {
|
|
|
13727
13699
|
}
|
|
13728
13700
|
}
|
|
13729
13701
|
enqueue(type, data) {
|
|
13730
|
-
// Add applicationId to RUM events (event, error, network, performance)
|
|
13702
|
+
// Add applicationId and sessionId to RUM events (event, error, network, performance)
|
|
13731
13703
|
// Heatmap uses apiKey/appId in payload root instead
|
|
13732
|
-
|
|
13704
|
+
let enrichedData = data;
|
|
13705
|
+
if (type !== 'heatmap') {
|
|
13706
|
+
enrichedData = Object.assign(Object.assign({}, data), { applicationId: this.config.appId });
|
|
13707
|
+
// Add sessionId to network and performance requests (required by backend)
|
|
13708
|
+
if ((type === 'network' || type === 'performance') && this.sessionId) {
|
|
13709
|
+
enrichedData.sessionId = this.sessionId;
|
|
13710
|
+
}
|
|
13711
|
+
}
|
|
13733
13712
|
this.queue.push({
|
|
13734
13713
|
type,
|
|
13735
13714
|
data: enrichedData,
|
|
@@ -14103,7 +14082,7 @@ class DevSkinSDK {
|
|
|
14103
14082
|
* Private methods
|
|
14104
14083
|
*/
|
|
14105
14084
|
startSession() {
|
|
14106
|
-
var _a, _b, _c;
|
|
14085
|
+
var _a, _b, _c, _d, _e;
|
|
14107
14086
|
// Check if there's an active session (stored in sessionStorage to persist across page navigations)
|
|
14108
14087
|
const existingSessionId = sessionStorage.getItem('devskin_session_id');
|
|
14109
14088
|
const existingSessionStart = sessionStorage.getItem('devskin_session_start');
|
|
@@ -14111,7 +14090,9 @@ class DevSkinSDK {
|
|
|
14111
14090
|
// Resume existing session
|
|
14112
14091
|
this.sessionId = existingSessionId;
|
|
14113
14092
|
this.sessionStartTime = parseInt(existingSessionStart, 10);
|
|
14114
|
-
|
|
14093
|
+
// Set sessionId in transport so it can be added to network/performance requests
|
|
14094
|
+
(_a = this.transport) === null || _a === void 0 ? void 0 : _a.setSessionId(this.sessionId);
|
|
14095
|
+
if ((_b = this.config) === null || _b === void 0 ? void 0 : _b.debug) {
|
|
14115
14096
|
console.log('[DevSkin] Resuming existing session:', this.sessionId);
|
|
14116
14097
|
}
|
|
14117
14098
|
// Send page view but DON'T create a new session
|
|
@@ -14124,9 +14105,11 @@ class DevSkinSDK {
|
|
|
14124
14105
|
// Store in sessionStorage (persists across page navigations in same tab)
|
|
14125
14106
|
sessionStorage.setItem('devskin_session_id', this.sessionId);
|
|
14126
14107
|
sessionStorage.setItem('devskin_session_start', this.sessionStartTime.toString());
|
|
14108
|
+
// Set sessionId in transport so it can be added to network/performance requests
|
|
14109
|
+
(_c = this.transport) === null || _c === void 0 ? void 0 : _c.setSessionId(this.sessionId);
|
|
14127
14110
|
const sessionData = Object.assign({ sessionId: this.sessionId, userId: this.userId || undefined, anonymousId: this.anonymousId, startedAt: new Date().toISOString(), platform: 'web' }, this.getContextData());
|
|
14128
|
-
(
|
|
14129
|
-
if ((
|
|
14111
|
+
(_d = this.transport) === null || _d === void 0 ? void 0 : _d.startSession(sessionData);
|
|
14112
|
+
if ((_e = this.config) === null || _e === void 0 ? void 0 : _e.debug) {
|
|
14130
14113
|
console.log('[DevSkin] New session created:', this.sessionId);
|
|
14131
14114
|
}
|
|
14132
14115
|
}
|