Skip to content

Commit f9d1d46

Browse files
Add Splunk RUM custom workflow events for cart operations (#72)
* provide proper synch between image build and * chore: update test manifests to demo-for-rob-1 Services: payment Updated: - Source k8s manifests with new image references Note: .service-versions.yaml updated locally but not committed * Test build: demo-for-rob-1 Generated test manifest for Astronomy Shop - Base Version: 1.0.1 (unchanged) - Test Version: demo-for-rob-1 - Manifest: kubernetes/TEST-splunk-astronomy-shop-demo-for-rob-1.yaml - Generated by: GitHub Actions (test build) Note: SPLUNK-VERSION file was NOT modified. * chore: remove TEST manifest files Automatically removed by remove-test-manifests workflow * movd Flagd. config map to a pvc, so bit flagd and flagd read write same file * feat: add helper scripts for feature branch workflow * verion 1.4.0 of values.yaml, mostly db-mon/sql focused * feat: add custom version option for single-service builds Added ability to specify a custom version when building a single service: - New 'custom' option in version_bump dropdown - New 'custom_version' text input for specifying exact version - Validation ensures custom only works with single service (not 'all') - Custom builds don't modify SPLUNK-VERSION (single service only) - Clear PR title showing service and custom version Also updated flagd-config to set paymentServiceUnreachable default to 50% * fix: prevent 404 errors for undefined product images Guard against rendering/fetching product images before data is loaded, preventing requests to /images/products/undefined through frontend-proxy. * First Cart Custome Events * gitignore * fix: improve CartPageError to fire once per session with realistic error - Add useRef to ensure error only fires once per browser session - Update error message to simulate pricing race condition - Add detailed comments explaining the demo scenario - Add error.synthetic attribute for filtering in Splunk * chore: update test manifests to 1.4.1-b Services: frontend Updated: - Source k8s manifests with new image references Note: .service-versions.yaml updated locally but not committed * fix: create deeper stack trace for CartPageError sourcemap support Use actual function calls instead of new Error() to generate a real stack trace that sourcemaps can map back to original source code. --------- Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
1 parent fdf2ec0 commit f9d1d46

File tree

2 files changed

+58
-14
lines changed

2 files changed

+58
-14
lines changed

src/frontend/frontend-k8s.yaml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ spec:
4747
serviceAccountName: opentelemetry-demo
4848
containers:
4949
- name: frontend
50-
image: ghcr.io/splunk/opentelemetry-demo/otel-frontend:1.4.0
50+
image: ghcr.io/hagen-p/opentelemetry-demo-splunk/otel-frontend:1.4.1-b
5151
imagePullPolicy: Always
5252
ports:
5353
- containerPort: 8080

src/frontend/pages/cart/index.tsx

Lines changed: 57 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33

44
import { NextPage } from 'next';
55
import Head from 'next/head';
6-
import { useEffect } from 'react';
6+
import { useEffect, useRef } from 'react';
77
import Layout from '../../components/Layout';
88
import Recommendations from '../../components/Recommendations';
99
import * as S from '../../styles/Cart.styled';
@@ -17,20 +17,64 @@ const Cart: NextPage = () => {
1717
cart: { items },
1818
} = useCart();
1919

20-
// Simulate a CartPageError workflow for Splunk RUM demo purposes
20+
// ============================================================================
21+
// DEMO: Synthetic CartPageError for Splunk RUM training
22+
// ============================================================================
23+
// This simulates a common race condition bug: trying to access cart item
24+
// pricing data before the pricing service response is ready.
25+
//
26+
// In a real app, this could happen when:
27+
// - Component renders before async pricing data loads
28+
// - API response is delayed or partially loaded
29+
// - Cache miss causes undefined data access
30+
//
31+
// This error fires ONCE per browser session to demonstrate how JavaScript
32+
// errors appear in Splunk RUM with stack traces and workflow attribution.
33+
// ============================================================================
34+
const cartErrorSentRef = useRef(false);
35+
2136
useEffect(() => {
22-
if (items.length > 0 && typeof window !== 'undefined' && (window as any).tracer) {
23-
const tracer = (window as any).tracer;
24-
const span = tracer.startSpan('CartPageError', {
25-
attributes: {
26-
'workflow.name': 'CartPageError',
27-
'error': true,
28-
},
29-
});
30-
31-
console.error("Uncaught TypeError: Cannot read property 'Price' of undefined");
32-
span.end();
37+
// Only fire once per session, and only when cart has items
38+
if (cartErrorSentRef.current || items.length === 0) return;
39+
if (typeof window === 'undefined' || !(window as any).tracer) return;
40+
41+
cartErrorSentRef.current = true;
42+
43+
const tracer = (window as any).tracer;
44+
const span = tracer.startSpan('CartPageError', {
45+
attributes: {
46+
'workflow.name': 'CartPageError',
47+
'error': true,
48+
'error.synthetic': true, // Mark as synthetic for filtering if needed
49+
},
50+
});
51+
52+
// Create functions to generate a realistic stack trace for sourcemap mapping
53+
// These function names will appear in the stack trace in Splunk RUM
54+
function getPricingData() {
55+
const pricingResponse: any = undefined; // Simulates missing API response
56+
return pricingResponse.unitPrice; // This throws TypeError
57+
}
58+
59+
function calculateCartTotal() {
60+
return getPricingData();
3361
}
62+
63+
function renderCartPricing() {
64+
return calculateCartTotal();
65+
}
66+
67+
try {
68+
// Trigger the error through the call stack
69+
renderCartPricing();
70+
} catch (error) {
71+
// Record on span - Splunk RUM will capture the full stack trace
72+
span.recordException(error);
73+
span.setStatus({ code: 2, message: (error as Error).message });
74+
console.error('CartPageError: pricing race condition -', (error as Error).message);
75+
}
76+
77+
span.end();
3478
}, [items.length]);
3579

3680
return (

0 commit comments

Comments
 (0)