@echoteam/signoz-react 1.2.1 → 1.2.3
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/README.md +90 -9
- package/dist/index.d.ts +3 -0
- package/dist/index.esm.js +291 -49
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +291 -49
- package/dist/index.js.map +1 -1
- package/dist/types/tracing.d.ts +3 -0
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -15338,6 +15338,8 @@ function addFetchLogging(config) {
|
|
|
15338
15338
|
// Capture current page info
|
|
15339
15339
|
const pageUrl = window.location.href;
|
|
15340
15340
|
const pagePath = window.location.pathname;
|
|
15341
|
+
// Track start time
|
|
15342
|
+
const startTime = performance.now();
|
|
15341
15343
|
const tracer = trace.getTracer('fetch-logger');
|
|
15342
15344
|
const span = tracer.startSpan(`HTTP ${method} ${url}`);
|
|
15343
15345
|
try {
|
|
@@ -15352,9 +15354,14 @@ function addFetchLogging(config) {
|
|
|
15352
15354
|
if (config.logRequestBody && (init === null || init === void 0 ? void 0 : init.body) && ['POST', 'PUT', 'PATCH'].includes(method.toUpperCase())) {
|
|
15353
15355
|
const bodyStr = truncateBody(init.body, config.maxBodyLogSize);
|
|
15354
15356
|
span.setAttribute('http.request.body', bodyStr);
|
|
15355
|
-
|
|
15357
|
+
if (config.enableConsoleLog) {
|
|
15358
|
+
console.log(`[SignOz] ${method} Request to ${url} from page ${pagePath}:`, bodyStr);
|
|
15359
|
+
}
|
|
15356
15360
|
}
|
|
15357
15361
|
const response = await originalFetch.apply(this, args);
|
|
15362
|
+
// Calculate duration
|
|
15363
|
+
const duration = performance.now() - startTime;
|
|
15364
|
+
span.setAttribute('duration_ms', Math.round(duration));
|
|
15358
15365
|
// Log response data
|
|
15359
15366
|
span.setAttribute('http.status_code', response.status);
|
|
15360
15367
|
if (config.logResponseBody && response.ok) {
|
|
@@ -15362,23 +15369,42 @@ function addFetchLogging(config) {
|
|
|
15362
15369
|
try {
|
|
15363
15370
|
const responseData = await clonedResponse.text();
|
|
15364
15371
|
const truncatedData = truncateBody(responseData, config.maxBodyLogSize);
|
|
15365
|
-
span.setAttribute('
|
|
15366
|
-
|
|
15372
|
+
span.setAttribute('response.data', truncatedData);
|
|
15373
|
+
// Try to parse JSON and extract message if exists
|
|
15374
|
+
try {
|
|
15375
|
+
const jsonData = JSON.parse(responseData);
|
|
15376
|
+
if (jsonData.message) {
|
|
15377
|
+
span.setAttribute('response.message', jsonData.message);
|
|
15378
|
+
}
|
|
15379
|
+
}
|
|
15380
|
+
catch (e) {
|
|
15381
|
+
// Not JSON or no message field, ignore
|
|
15382
|
+
}
|
|
15383
|
+
if (config.enableConsoleLog) {
|
|
15384
|
+
console.log(`[SignOz] ${method} Response from ${url} (${response.status}) on page ${pagePath} [${Math.round(duration)}ms]:`, truncatedData);
|
|
15385
|
+
}
|
|
15367
15386
|
}
|
|
15368
15387
|
catch (e) {
|
|
15369
|
-
|
|
15388
|
+
if (config.enableConsoleLog) {
|
|
15389
|
+
console.warn('[SignOz] Failed to read response body:', e);
|
|
15390
|
+
}
|
|
15370
15391
|
}
|
|
15371
15392
|
}
|
|
15372
|
-
else if (!response.ok) {
|
|
15373
|
-
console.log(`[SignOz] ${method} Request to ${url} from page ${pagePath} - Status: ${response.status}`);
|
|
15393
|
+
else if (!response.ok && config.enableConsoleLog) {
|
|
15394
|
+
console.log(`[SignOz] ${method} Request to ${url} from page ${pagePath} - Status: ${response.status} [${Math.round(duration)}ms]`);
|
|
15374
15395
|
}
|
|
15375
15396
|
span.setStatus({ code: SpanStatusCode.OK });
|
|
15376
15397
|
return response;
|
|
15377
15398
|
}
|
|
15378
15399
|
catch (error) {
|
|
15400
|
+
// Calculate duration even on error
|
|
15401
|
+
const duration = performance.now() - startTime;
|
|
15402
|
+
span.setAttribute('duration_ms', Math.round(duration));
|
|
15379
15403
|
span.recordException(error);
|
|
15380
15404
|
span.setStatus({ code: SpanStatusCode.ERROR, message: error.message });
|
|
15381
|
-
|
|
15405
|
+
if (config.enableConsoleLog) {
|
|
15406
|
+
console.error(`[SignOz] ${method} Error for ${url} on page ${pagePath} [${Math.round(duration)}ms]:`, error);
|
|
15407
|
+
}
|
|
15382
15408
|
throw error;
|
|
15383
15409
|
}
|
|
15384
15410
|
finally {
|
|
@@ -15395,6 +15421,7 @@ function addXHRLogging(config) {
|
|
|
15395
15421
|
const xhr = new OriginalXHR();
|
|
15396
15422
|
let method = '';
|
|
15397
15423
|
let url = '';
|
|
15424
|
+
let startTime = 0;
|
|
15398
15425
|
// Capture current page info when XHR is created
|
|
15399
15426
|
const pageUrl = window.location.href;
|
|
15400
15427
|
const pagePath = window.location.pathname;
|
|
@@ -15406,6 +15433,8 @@ function addXHRLogging(config) {
|
|
|
15406
15433
|
};
|
|
15407
15434
|
const originalSend = xhr.send;
|
|
15408
15435
|
xhr.send = function (body) {
|
|
15436
|
+
// Track start time
|
|
15437
|
+
startTime = performance.now();
|
|
15409
15438
|
const tracer = trace.getTracer('xhr-logger');
|
|
15410
15439
|
const span = tracer.startSpan(`HTTP ${method} ${url}`);
|
|
15411
15440
|
span.setAttribute('http.url', url);
|
|
@@ -15419,27 +15448,49 @@ function addXHRLogging(config) {
|
|
|
15419
15448
|
if (config.logRequestBody && body && ['POST', 'PUT', 'PATCH'].includes(method.toUpperCase())) {
|
|
15420
15449
|
const bodyStr = truncateBody(body, config.maxBodyLogSize);
|
|
15421
15450
|
span.setAttribute('http.request.body', bodyStr);
|
|
15422
|
-
|
|
15451
|
+
if (config.enableConsoleLog) {
|
|
15452
|
+
console.log(`[SignOz] ${method} Request to ${url} from page ${pagePath}:`, bodyStr);
|
|
15453
|
+
}
|
|
15423
15454
|
}
|
|
15424
15455
|
this.addEventListener('load', function () {
|
|
15456
|
+
// Calculate duration
|
|
15457
|
+
const duration = performance.now() - startTime;
|
|
15458
|
+
span.setAttribute('duration_ms', Math.round(duration));
|
|
15425
15459
|
span.setAttribute('http.status_code', xhr.status);
|
|
15426
15460
|
// Log response body
|
|
15427
15461
|
if (config.logResponseBody && xhr.status >= 200 && xhr.status < 300) {
|
|
15428
15462
|
const responseData = xhr.responseText;
|
|
15429
15463
|
const truncatedData = truncateBody(responseData, config.maxBodyLogSize);
|
|
15430
|
-
span.setAttribute('
|
|
15431
|
-
|
|
15464
|
+
span.setAttribute('response.data', truncatedData);
|
|
15465
|
+
// Try to parse JSON and extract message if exists
|
|
15466
|
+
try {
|
|
15467
|
+
const jsonData = JSON.parse(responseData);
|
|
15468
|
+
if (jsonData.message) {
|
|
15469
|
+
span.setAttribute('response.message', jsonData.message);
|
|
15470
|
+
}
|
|
15471
|
+
}
|
|
15472
|
+
catch (e) {
|
|
15473
|
+
// Not JSON or no message field, ignore
|
|
15474
|
+
}
|
|
15475
|
+
if (config.enableConsoleLog) {
|
|
15476
|
+
console.log(`[SignOz] ${method} Response from ${url} (${xhr.status}) on page ${pagePath} [${Math.round(duration)}ms]:`, truncatedData);
|
|
15477
|
+
}
|
|
15432
15478
|
}
|
|
15433
|
-
else if (xhr.status >= 300) {
|
|
15434
|
-
console.log(`[SignOz] ${method} Request to ${url} from page ${pagePath} - Status: ${xhr.status}`);
|
|
15479
|
+
else if (xhr.status >= 300 && config.enableConsoleLog) {
|
|
15480
|
+
console.log(`[SignOz] ${method} Request to ${url} from page ${pagePath} - Status: ${xhr.status} [${Math.round(duration)}ms]`);
|
|
15435
15481
|
}
|
|
15436
15482
|
span.setStatus({ code: SpanStatusCode.OK });
|
|
15437
15483
|
span.end();
|
|
15438
15484
|
});
|
|
15439
15485
|
this.addEventListener('error', function () {
|
|
15486
|
+
// Calculate duration even on error
|
|
15487
|
+
const duration = performance.now() - startTime;
|
|
15488
|
+
span.setAttribute('duration_ms', Math.round(duration));
|
|
15440
15489
|
span.recordException(new Error('XHR request failed'));
|
|
15441
15490
|
span.setStatus({ code: SpanStatusCode.ERROR, message: 'XHR request failed' });
|
|
15442
|
-
|
|
15491
|
+
if (config.enableConsoleLog) {
|
|
15492
|
+
console.error(`[SignOz] ${method} Error for ${url} on page ${pagePath} [${Math.round(duration)}ms]`);
|
|
15493
|
+
}
|
|
15443
15494
|
span.end();
|
|
15444
15495
|
});
|
|
15445
15496
|
return originalSend.call(this, body);
|
|
@@ -15448,7 +15499,7 @@ function addXHRLogging(config) {
|
|
|
15448
15499
|
};
|
|
15449
15500
|
}
|
|
15450
15501
|
// Fungsi untuk menambahkan error tracking
|
|
15451
|
-
function addErrorTracking() {
|
|
15502
|
+
function addErrorTracking(enableConsoleLog = false) {
|
|
15452
15503
|
// Track unhandled errors
|
|
15453
15504
|
window.addEventListener('error', (event) => {
|
|
15454
15505
|
var _a;
|
|
@@ -15464,13 +15515,15 @@ function addErrorTracking() {
|
|
|
15464
15515
|
span.setAttribute('error.stack', event.error.stack || '');
|
|
15465
15516
|
}
|
|
15466
15517
|
span.setStatus({ code: SpanStatusCode.ERROR, message: event.message });
|
|
15467
|
-
|
|
15468
|
-
|
|
15469
|
-
|
|
15470
|
-
|
|
15471
|
-
|
|
15472
|
-
|
|
15473
|
-
|
|
15518
|
+
if (enableConsoleLog) {
|
|
15519
|
+
console.error('[SignOz] Unhandled Error:', {
|
|
15520
|
+
message: event.message,
|
|
15521
|
+
filename: event.filename,
|
|
15522
|
+
lineno: event.lineno,
|
|
15523
|
+
colno: event.colno,
|
|
15524
|
+
stack: (_a = event.error) === null || _a === void 0 ? void 0 : _a.stack
|
|
15525
|
+
});
|
|
15526
|
+
}
|
|
15474
15527
|
span.end();
|
|
15475
15528
|
});
|
|
15476
15529
|
// Track unhandled promise rejections
|
|
@@ -15485,12 +15538,14 @@ function addErrorTracking() {
|
|
|
15485
15538
|
span.setAttribute('error.stack', event.reason.stack || '');
|
|
15486
15539
|
}
|
|
15487
15540
|
span.setStatus({ code: SpanStatusCode.ERROR, message: String(event.reason) });
|
|
15488
|
-
|
|
15541
|
+
if (enableConsoleLog) {
|
|
15542
|
+
console.error('[SignOz] Unhandled Promise Rejection:', event.reason);
|
|
15543
|
+
}
|
|
15489
15544
|
span.end();
|
|
15490
15545
|
});
|
|
15491
15546
|
}
|
|
15492
15547
|
// Fungsi untuk menambahkan navigation tracking
|
|
15493
|
-
function addNavigationTracking() {
|
|
15548
|
+
function addNavigationTracking(enableConsoleLog = false) {
|
|
15494
15549
|
let previousUrl = window.location.href;
|
|
15495
15550
|
// Track initial page load
|
|
15496
15551
|
const tracer = trace.getTracer('navigation-tracker');
|
|
@@ -15500,10 +15555,12 @@ function addNavigationTracking() {
|
|
|
15500
15555
|
initialSpan.setAttribute('navigation.pathname', window.location.pathname);
|
|
15501
15556
|
initialSpan.setAttribute('navigation.search', window.location.search);
|
|
15502
15557
|
initialSpan.setAttribute('navigation.hash', window.location.hash);
|
|
15503
|
-
|
|
15504
|
-
|
|
15505
|
-
|
|
15506
|
-
|
|
15558
|
+
if (enableConsoleLog) {
|
|
15559
|
+
console.log('[SignOz] Page Load:', {
|
|
15560
|
+
url: window.location.href,
|
|
15561
|
+
pathname: window.location.pathname
|
|
15562
|
+
});
|
|
15563
|
+
}
|
|
15507
15564
|
initialSpan.end();
|
|
15508
15565
|
// Track popstate (browser back/forward)
|
|
15509
15566
|
window.addEventListener('popstate', () => {
|
|
@@ -15514,11 +15571,13 @@ function addNavigationTracking() {
|
|
|
15514
15571
|
span.setAttribute('navigation.pathname', window.location.pathname);
|
|
15515
15572
|
span.setAttribute('navigation.search', window.location.search);
|
|
15516
15573
|
span.setAttribute('navigation.hash', window.location.hash);
|
|
15517
|
-
|
|
15518
|
-
|
|
15519
|
-
|
|
15520
|
-
|
|
15521
|
-
|
|
15574
|
+
if (enableConsoleLog) {
|
|
15575
|
+
console.log('[SignOz] Navigation (popstate):', {
|
|
15576
|
+
from: previousUrl,
|
|
15577
|
+
to: window.location.href,
|
|
15578
|
+
pathname: window.location.pathname
|
|
15579
|
+
});
|
|
15580
|
+
}
|
|
15522
15581
|
previousUrl = window.location.href;
|
|
15523
15582
|
span.end();
|
|
15524
15583
|
});
|
|
@@ -15533,11 +15592,13 @@ function addNavigationTracking() {
|
|
|
15533
15592
|
span.setAttribute('navigation.pathname', window.location.pathname);
|
|
15534
15593
|
span.setAttribute('navigation.search', window.location.search);
|
|
15535
15594
|
span.setAttribute('navigation.hash', window.location.hash);
|
|
15536
|
-
|
|
15537
|
-
|
|
15538
|
-
|
|
15539
|
-
|
|
15540
|
-
|
|
15595
|
+
if (enableConsoleLog) {
|
|
15596
|
+
console.log('[SignOz] Navigation (pushState):', {
|
|
15597
|
+
from: previousUrl,
|
|
15598
|
+
to: window.location.href,
|
|
15599
|
+
pathname: window.location.pathname
|
|
15600
|
+
});
|
|
15601
|
+
}
|
|
15541
15602
|
previousUrl = window.location.href;
|
|
15542
15603
|
span.end();
|
|
15543
15604
|
return result;
|
|
@@ -15552,16 +15613,181 @@ function addNavigationTracking() {
|
|
|
15552
15613
|
span.setAttribute('navigation.pathname', window.location.pathname);
|
|
15553
15614
|
span.setAttribute('navigation.search', window.location.search);
|
|
15554
15615
|
span.setAttribute('navigation.hash', window.location.hash);
|
|
15555
|
-
|
|
15556
|
-
|
|
15557
|
-
|
|
15558
|
-
|
|
15559
|
-
|
|
15616
|
+
if (enableConsoleLog) {
|
|
15617
|
+
console.log('[SignOz] Navigation (replaceState):', {
|
|
15618
|
+
from: previousUrl,
|
|
15619
|
+
to: window.location.href,
|
|
15620
|
+
pathname: window.location.pathname
|
|
15621
|
+
});
|
|
15622
|
+
}
|
|
15560
15623
|
previousUrl = window.location.href;
|
|
15561
15624
|
span.end();
|
|
15562
15625
|
return result;
|
|
15563
15626
|
};
|
|
15564
15627
|
}
|
|
15628
|
+
// Fungsi untuk menambahkan WebSocket logging
|
|
15629
|
+
function addWebSocketLogging(config) {
|
|
15630
|
+
if (!config.enableWebSocketLogging)
|
|
15631
|
+
return;
|
|
15632
|
+
const OriginalWebSocket = window.WebSocket;
|
|
15633
|
+
window.WebSocket = function (url, protocols) {
|
|
15634
|
+
const ws = new OriginalWebSocket(url, protocols);
|
|
15635
|
+
const wsUrl = typeof url === 'string' ? url : url.toString();
|
|
15636
|
+
// Capture current page info
|
|
15637
|
+
const pageUrl = window.location.href;
|
|
15638
|
+
const pagePath = window.location.pathname;
|
|
15639
|
+
const tracer = trace.getTracer('websocket-logger');
|
|
15640
|
+
let connectionSpan = tracer.startSpan('WebSocket Connection');
|
|
15641
|
+
const connectionStartTime = performance.now();
|
|
15642
|
+
connectionSpan.setAttribute('websocket.url', wsUrl);
|
|
15643
|
+
connectionSpan.setAttribute('websocket.protocols', Array.isArray(protocols) ? protocols.join(',') : (protocols || 'none'));
|
|
15644
|
+
connectionSpan.setAttribute('page.url', pageUrl);
|
|
15645
|
+
connectionSpan.setAttribute('page.pathname', pagePath);
|
|
15646
|
+
// Track connection open
|
|
15647
|
+
const originalOnOpen = ws.onopen;
|
|
15648
|
+
ws.addEventListener('open', function (event) {
|
|
15649
|
+
const duration = performance.now() - connectionStartTime;
|
|
15650
|
+
connectionSpan.setAttribute('websocket.state', 'open');
|
|
15651
|
+
connectionSpan.setAttribute('duration_ms', Math.round(duration));
|
|
15652
|
+
connectionSpan.setStatus({ code: SpanStatusCode.OK });
|
|
15653
|
+
if (config.enableConsoleLog) {
|
|
15654
|
+
console.log(`[SignOz] WebSocket Connected to ${wsUrl} from page ${pagePath} [${Math.round(duration)}ms]`);
|
|
15655
|
+
}
|
|
15656
|
+
connectionSpan.end();
|
|
15657
|
+
if (originalOnOpen) {
|
|
15658
|
+
originalOnOpen.call(ws, event);
|
|
15659
|
+
}
|
|
15660
|
+
});
|
|
15661
|
+
// Track messages sent
|
|
15662
|
+
const originalSend = ws.send;
|
|
15663
|
+
ws.send = function (data) {
|
|
15664
|
+
if (config.logWebSocketMessages) {
|
|
15665
|
+
const messageSpan = tracer.startSpan('WebSocket Send');
|
|
15666
|
+
const sendStartTime = performance.now();
|
|
15667
|
+
messageSpan.setAttribute('websocket.url', wsUrl);
|
|
15668
|
+
messageSpan.setAttribute('websocket.direction', 'send');
|
|
15669
|
+
messageSpan.setAttribute('page.url', pageUrl);
|
|
15670
|
+
messageSpan.setAttribute('page.pathname', pagePath);
|
|
15671
|
+
// Log message data
|
|
15672
|
+
if (typeof data === 'string') {
|
|
15673
|
+
const truncatedData = truncateBody(data, config.maxBodyLogSize);
|
|
15674
|
+
messageSpan.setAttribute('websocket.message', truncatedData);
|
|
15675
|
+
// Try to parse JSON and extract message if exists
|
|
15676
|
+
try {
|
|
15677
|
+
const jsonData = JSON.parse(data);
|
|
15678
|
+
if (jsonData.message) {
|
|
15679
|
+
messageSpan.setAttribute('websocket.message.text', jsonData.message);
|
|
15680
|
+
}
|
|
15681
|
+
if (jsonData.type || jsonData.event) {
|
|
15682
|
+
messageSpan.setAttribute('websocket.message.type', jsonData.type || jsonData.event);
|
|
15683
|
+
}
|
|
15684
|
+
}
|
|
15685
|
+
catch (e) {
|
|
15686
|
+
// Not JSON, ignore
|
|
15687
|
+
}
|
|
15688
|
+
if (config.enableConsoleLog) {
|
|
15689
|
+
console.log(`[SignOz] WebSocket Send to ${wsUrl} from page ${pagePath}:`, truncatedData);
|
|
15690
|
+
}
|
|
15691
|
+
}
|
|
15692
|
+
else {
|
|
15693
|
+
messageSpan.setAttribute('websocket.message', '[Binary Data]');
|
|
15694
|
+
messageSpan.setAttribute('websocket.message.type', 'binary');
|
|
15695
|
+
if (config.enableConsoleLog) {
|
|
15696
|
+
console.log(`[SignOz] WebSocket Send to ${wsUrl} from page ${pagePath}: [Binary Data]`);
|
|
15697
|
+
}
|
|
15698
|
+
}
|
|
15699
|
+
const duration = performance.now() - sendStartTime;
|
|
15700
|
+
messageSpan.setAttribute('duration_ms', Math.round(duration));
|
|
15701
|
+
messageSpan.setStatus({ code: SpanStatusCode.OK });
|
|
15702
|
+
messageSpan.end();
|
|
15703
|
+
}
|
|
15704
|
+
return originalSend.call(ws, data);
|
|
15705
|
+
};
|
|
15706
|
+
// Track messages received
|
|
15707
|
+
const originalOnMessage = ws.onmessage;
|
|
15708
|
+
ws.addEventListener('message', function (event) {
|
|
15709
|
+
if (config.logWebSocketMessages) {
|
|
15710
|
+
const messageSpan = tracer.startSpan('WebSocket Receive');
|
|
15711
|
+
messageSpan.setAttribute('websocket.url', wsUrl);
|
|
15712
|
+
messageSpan.setAttribute('websocket.direction', 'receive');
|
|
15713
|
+
messageSpan.setAttribute('page.url', pageUrl);
|
|
15714
|
+
messageSpan.setAttribute('page.pathname', pagePath);
|
|
15715
|
+
// Log message data
|
|
15716
|
+
if (typeof event.data === 'string') {
|
|
15717
|
+
const truncatedData = truncateBody(event.data, config.maxBodyLogSize);
|
|
15718
|
+
messageSpan.setAttribute('websocket.message', truncatedData);
|
|
15719
|
+
// Try to parse JSON and extract message if exists
|
|
15720
|
+
try {
|
|
15721
|
+
const jsonData = JSON.parse(event.data);
|
|
15722
|
+
if (jsonData.message) {
|
|
15723
|
+
messageSpan.setAttribute('websocket.message.text', jsonData.message);
|
|
15724
|
+
}
|
|
15725
|
+
if (jsonData.type || jsonData.event) {
|
|
15726
|
+
messageSpan.setAttribute('websocket.message.type', jsonData.type || jsonData.event);
|
|
15727
|
+
}
|
|
15728
|
+
}
|
|
15729
|
+
catch (e) {
|
|
15730
|
+
// Not JSON, ignore
|
|
15731
|
+
}
|
|
15732
|
+
if (config.enableConsoleLog) {
|
|
15733
|
+
console.log(`[SignOz] WebSocket Receive from ${wsUrl} on page ${pagePath}:`, truncatedData);
|
|
15734
|
+
}
|
|
15735
|
+
}
|
|
15736
|
+
else {
|
|
15737
|
+
messageSpan.setAttribute('websocket.message', '[Binary Data]');
|
|
15738
|
+
messageSpan.setAttribute('websocket.message.type', 'binary');
|
|
15739
|
+
if (config.enableConsoleLog) {
|
|
15740
|
+
console.log(`[SignOz] WebSocket Receive from ${wsUrl} on page ${pagePath}: [Binary Data]`);
|
|
15741
|
+
}
|
|
15742
|
+
}
|
|
15743
|
+
messageSpan.setStatus({ code: SpanStatusCode.OK });
|
|
15744
|
+
messageSpan.end();
|
|
15745
|
+
}
|
|
15746
|
+
if (originalOnMessage) {
|
|
15747
|
+
originalOnMessage.call(ws, event);
|
|
15748
|
+
}
|
|
15749
|
+
});
|
|
15750
|
+
// Track connection errors
|
|
15751
|
+
const originalOnError = ws.onerror;
|
|
15752
|
+
ws.addEventListener('error', function (event) {
|
|
15753
|
+
const errorSpan = tracer.startSpan('WebSocket Error');
|
|
15754
|
+
errorSpan.setAttribute('websocket.url', wsUrl);
|
|
15755
|
+
errorSpan.setAttribute('websocket.state', 'error');
|
|
15756
|
+
errorSpan.setAttribute('page.url', pageUrl);
|
|
15757
|
+
errorSpan.setAttribute('page.pathname', pagePath);
|
|
15758
|
+
errorSpan.recordException(new Error('WebSocket connection error'));
|
|
15759
|
+
errorSpan.setStatus({ code: SpanStatusCode.ERROR, message: 'WebSocket connection error' });
|
|
15760
|
+
if (config.enableConsoleLog) {
|
|
15761
|
+
console.error(`[SignOz] WebSocket Error for ${wsUrl} on page ${pagePath}`);
|
|
15762
|
+
}
|
|
15763
|
+
errorSpan.end();
|
|
15764
|
+
if (originalOnError) {
|
|
15765
|
+
originalOnError.call(ws, event);
|
|
15766
|
+
}
|
|
15767
|
+
});
|
|
15768
|
+
// Track connection close
|
|
15769
|
+
const originalOnClose = ws.onclose;
|
|
15770
|
+
ws.addEventListener('close', function (event) {
|
|
15771
|
+
const closeSpan = tracer.startSpan('WebSocket Close');
|
|
15772
|
+
closeSpan.setAttribute('websocket.url', wsUrl);
|
|
15773
|
+
closeSpan.setAttribute('websocket.state', 'closed');
|
|
15774
|
+
closeSpan.setAttribute('websocket.close.code', event.code);
|
|
15775
|
+
closeSpan.setAttribute('websocket.close.reason', event.reason || 'No reason provided');
|
|
15776
|
+
closeSpan.setAttribute('websocket.close.wasClean', event.wasClean);
|
|
15777
|
+
closeSpan.setAttribute('page.url', pageUrl);
|
|
15778
|
+
closeSpan.setAttribute('page.pathname', pagePath);
|
|
15779
|
+
if (config.enableConsoleLog) {
|
|
15780
|
+
console.log(`[SignOz] WebSocket Closed ${wsUrl} on page ${pagePath} - Code: ${event.code}, Reason: ${event.reason || 'No reason'}, Clean: ${event.wasClean}`);
|
|
15781
|
+
}
|
|
15782
|
+
closeSpan.setStatus({ code: SpanStatusCode.OK });
|
|
15783
|
+
closeSpan.end();
|
|
15784
|
+
if (originalOnClose) {
|
|
15785
|
+
originalOnClose.call(ws, event);
|
|
15786
|
+
}
|
|
15787
|
+
});
|
|
15788
|
+
return ws;
|
|
15789
|
+
};
|
|
15790
|
+
}
|
|
15565
15791
|
/**
|
|
15566
15792
|
* Inisialisasi SignOz tracing untuk aplikasi React
|
|
15567
15793
|
* @param config - Konfigurasi SignOz (opsional, akan menggunakan environment variables jika tidak disediakan)
|
|
@@ -15590,9 +15816,12 @@ function initializeSignOzTracing(config) {
|
|
|
15590
15816
|
logRequestBody: (config === null || config === void 0 ? void 0 : config.logRequestBody) !== undefined ? config.logRequestBody : (getConfigValue('REACT_APP_SIGNOZ_LOG_REQUEST_BODY') === 'true' || true),
|
|
15591
15817
|
logResponseBody: (config === null || config === void 0 ? void 0 : config.logResponseBody) !== undefined ? config.logResponseBody : (getConfigValue('REACT_APP_SIGNOZ_LOG_RESPONSE_BODY') === 'true' || true),
|
|
15592
15818
|
maxBodyLogSize: (config === null || config === void 0 ? void 0 : config.maxBodyLogSize) || parseInt(getConfigValue('REACT_APP_SIGNOZ_MAX_BODY_LOG_SIZE') || '10000') || 10000,
|
|
15593
|
-
enableDocumentLoad: (config === null || config === void 0 ? void 0 : config.enableDocumentLoad) !== undefined ? config.enableDocumentLoad : (getConfigValue('REACT_APP_SIGNOZ_ENABLE_DOCUMENT_LOAD')
|
|
15819
|
+
enableDocumentLoad: (config === null || config === void 0 ? void 0 : config.enableDocumentLoad) !== undefined ? config.enableDocumentLoad : (getConfigValue('REACT_APP_SIGNOZ_ENABLE_DOCUMENT_LOAD') === 'true'),
|
|
15594
15820
|
enableErrorTracking: (config === null || config === void 0 ? void 0 : config.enableErrorTracking) !== undefined ? config.enableErrorTracking : (getConfigValue('REACT_APP_SIGNOZ_ENABLE_ERROR_TRACKING') !== 'false'),
|
|
15595
|
-
enableNavigationTracking: (config === null || config === void 0 ? void 0 : config.enableNavigationTracking) !== undefined ? config.enableNavigationTracking : (getConfigValue('REACT_APP_SIGNOZ_ENABLE_NAVIGATION_TRACKING')
|
|
15821
|
+
enableNavigationTracking: (config === null || config === void 0 ? void 0 : config.enableNavigationTracking) !== undefined ? config.enableNavigationTracking : (getConfigValue('REACT_APP_SIGNOZ_ENABLE_NAVIGATION_TRACKING') === 'true'),
|
|
15822
|
+
enableConsoleLog: (config === null || config === void 0 ? void 0 : config.enableConsoleLog) !== undefined ? config.enableConsoleLog : (getConfigValue('REACT_APP_SIGNOZ_ENABLE_CONSOLE_LOG') === 'true'),
|
|
15823
|
+
enableWebSocketLogging: (config === null || config === void 0 ? void 0 : config.enableWebSocketLogging) !== undefined ? config.enableWebSocketLogging : (getConfigValue('REACT_APP_SIGNOZ_ENABLE_WEBSOCKET_LOGGING') === 'true'),
|
|
15824
|
+
logWebSocketMessages: (config === null || config === void 0 ? void 0 : config.logWebSocketMessages) !== undefined ? config.logWebSocketMessages : (getConfigValue('REACT_APP_SIGNOZ_LOG_WEBSOCKET_MESSAGES') === 'true')
|
|
15596
15825
|
};
|
|
15597
15826
|
// Validasi konfigurasi
|
|
15598
15827
|
const { isValid, missingFields } = validateConfig(effectiveConfig);
|
|
@@ -15661,22 +15890,33 @@ function initializeSignOzTracing(config) {
|
|
|
15661
15890
|
enableRequestLogging: effectiveConfig.enableRequestLogging,
|
|
15662
15891
|
logRequestBody: effectiveConfig.logRequestBody,
|
|
15663
15892
|
logResponseBody: effectiveConfig.logResponseBody,
|
|
15664
|
-
maxBodyLogSize: effectiveConfig.maxBodyLogSize
|
|
15893
|
+
maxBodyLogSize: effectiveConfig.maxBodyLogSize,
|
|
15894
|
+
enableConsoleLog: effectiveConfig.enableConsoleLog
|
|
15665
15895
|
});
|
|
15666
15896
|
addXHRLogging({
|
|
15667
15897
|
enableRequestLogging: effectiveConfig.enableRequestLogging,
|
|
15668
15898
|
logRequestBody: effectiveConfig.logRequestBody,
|
|
15669
15899
|
logResponseBody: effectiveConfig.logResponseBody,
|
|
15670
|
-
maxBodyLogSize: effectiveConfig.maxBodyLogSize
|
|
15900
|
+
maxBodyLogSize: effectiveConfig.maxBodyLogSize,
|
|
15901
|
+
enableConsoleLog: effectiveConfig.enableConsoleLog
|
|
15671
15902
|
});
|
|
15672
15903
|
}
|
|
15673
15904
|
// Tambahkan error tracking
|
|
15674
15905
|
if (effectiveConfig.enableErrorTracking) {
|
|
15675
|
-
addErrorTracking();
|
|
15906
|
+
addErrorTracking(effectiveConfig.enableConsoleLog);
|
|
15676
15907
|
}
|
|
15677
15908
|
// Tambahkan navigation tracking
|
|
15678
15909
|
if (effectiveConfig.enableNavigationTracking) {
|
|
15679
|
-
addNavigationTracking();
|
|
15910
|
+
addNavigationTracking(effectiveConfig.enableConsoleLog);
|
|
15911
|
+
}
|
|
15912
|
+
// Tambahkan WebSocket logging
|
|
15913
|
+
if (effectiveConfig.enableWebSocketLogging) {
|
|
15914
|
+
addWebSocketLogging({
|
|
15915
|
+
enableWebSocketLogging: effectiveConfig.enableWebSocketLogging,
|
|
15916
|
+
logWebSocketMessages: effectiveConfig.logWebSocketMessages,
|
|
15917
|
+
maxBodyLogSize: effectiveConfig.maxBodyLogSize,
|
|
15918
|
+
enableConsoleLog: effectiveConfig.enableConsoleLog
|
|
15919
|
+
});
|
|
15680
15920
|
}
|
|
15681
15921
|
console.log('SignOz: Konfigurasi tracing:', {
|
|
15682
15922
|
serviceName: effectiveConfig.serviceName,
|
|
@@ -15689,7 +15929,9 @@ function initializeSignOzTracing(config) {
|
|
|
15689
15929
|
maxBodyLogSize: effectiveConfig.maxBodyLogSize,
|
|
15690
15930
|
enableDocumentLoad: effectiveConfig.enableDocumentLoad,
|
|
15691
15931
|
enableErrorTracking: effectiveConfig.enableErrorTracking,
|
|
15692
|
-
enableNavigationTracking: effectiveConfig.enableNavigationTracking
|
|
15932
|
+
enableNavigationTracking: effectiveConfig.enableNavigationTracking,
|
|
15933
|
+
enableWebSocketLogging: effectiveConfig.enableWebSocketLogging,
|
|
15934
|
+
logWebSocketMessages: effectiveConfig.logWebSocketMessages
|
|
15693
15935
|
});
|
|
15694
15936
|
console.log('SignOz: Tracing berhasil diinisialisasi');
|
|
15695
15937
|
}
|