docs/test-tracking.html at main · velt-js/docs · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Tracking Scripts Test</title>
    <style>
        body {
            font-family: system-ui, -apple-system, sans-serif;
            max-width: 1200px;
            margin: 0 auto;
            padding: 20px;
            background: #1a1a1a;
            color: #fff;
        }
        .test-section {
            background: #2a2a2a;
            border-radius: 8px;
            padding: 20px;
            margin-bottom: 20px;
        }
        .success { color: #4ade80; }
        .error { color: #f87171; }
        .info { color: #60a5fa; }
        ul { list-style: none; padding: 0; }
        li { margin-bottom: 8px; padding: 8px; background: #1a1a1a; border-radius: 4px; }
    </style>
</head>
<body>
    <h1>🔍 Tracking Scripts Validation</h1>
    <p>Open your browser's Developer Console (F12) to see detailed results.</p>

    <div class="test-section">
        <h2>Reb2b Tracking</h2>
        <ul id="reb2b-results"></ul>
    </div>

    <div class="test-section">
        <h2>Signals Tracking</h2>
        <ul id="signals-results"></ul>
    </div>

    <!-- Include the tracking scripts -->
    <script src="./reb2b-tracking.js"></script>
    <script src="./signals-tracking.js"></script>

    <!-- Validation script -->
    <script>
        const reb2bResults = document.getElementById('reb2b-results');
        const signalsResults = document.getElementById('signals-results');

        function addResult(container, message, type = 'info') {
            const li = document.createElement('li');
            li.innerHTML = message;
            li.className = type;
            container.appendChild(li);
        }

        // Wait for scripts to initialize
        setTimeout(() => {
            console.log('=== 🔍 Tracking Scripts Validation ===\n');

            // ========== Reb2b Validation ==========
            console.log('--- Reb2b Tracking ---');

            if (typeof window.reb2b !== 'undefined') {
                addResult(reb2bResults, '✓ window.reb2b object is defined', 'success');
                console.log('✓ window.reb2b:', window.reb2b);

                if (window.reb2b.loaded) {
                    addResult(reb2bResults, '✓ Reb2b loaded successfully', 'success');
                }

                if (typeof window.reb2b.assignIdentity === 'function') {
                    addResult(reb2bResults, '✓ assignIdentity() method available', 'success');
                }

                if (typeof window.reb2b.collect === 'function') {
                    addResult(reb2bResults, '✓ collect() method available', 'success');
                }
            } else {
                addResult(reb2bResults, '✗ window.reb2b NOT defined', 'error');
                console.error('✗ window.reb2b NOT defined');
            }

            // Check for Reb2b script tag
            const scripts = document.getElementsByTagName('script');
            let reb2bScriptFound = false;

            for (let script of scripts) {
                if (script.src.includes('b2bjsstore.s3.us-west-2.amazonaws.com')) {
                    reb2bScriptFound = true;
                    addResult(reb2bResults, `✓ Script injected: ${script.src.substring(0, 60)}...`, 'success');
                    console.log('✓ Reb2b script URL:', script.src);
                    break;
                }
            }

            if (!reb2bScriptFound) {
                addResult(reb2bResults, '✗ Reb2b script tag NOT found', 'error');
            }

            console.log('');

            // ========== Signals Validation ==========
            console.log('--- Signals Tracking ---');

            if (typeof window.signals !== 'undefined') {
                addResult(signalsResults, '✓ window.signals object is defined', 'success');
                console.log('✓ window.signals:', window.signals);

                if (typeof window.signals.page === 'function') {
                    addResult(signalsResults, '✓ signals.page() method available', 'success');
                    console.log('✓ signals.page() available');
                }

                if (typeof window.signals.identify === 'function') {
                    addResult(signalsResults, '✓ signals.identify() method available', 'success');
                    console.log('✓ signals.identify() available');
                }

                if (typeof window.signals.form === 'function') {
                    addResult(signalsResults, '✓ signals.form() method available', 'success');
                    console.log('✓ signals.form() available');
                }
            } else {
                addResult(signalsResults, '✗ window.signals NOT defined', 'error');
                console.error('✗ window.signals NOT defined');
            }

            // Check for Signals script tag
            let signalsScriptFound = false;

            for (let script of scripts) {
                if (script.src.includes('cdn.cr-relay.com')) {
                    signalsScriptFound = true;
                    addResult(signalsResults, `✓ Script injected: ${script.src.substring(0, 60)}...`, 'success');
                    console.log('✓ Signals script URL:', script.src);
                    break;
                }
            }

            if (!signalsScriptFound) {
                addResult(signalsResults, '✗ Signals script tag NOT found', 'error');
            }

            console.log('');
            console.log('=== 📊 Network Tab Instructions ===');
            console.log('Check the Network tab for:');
            console.log('1. Request to b2bjsstore.s3.us-west-2.amazonaws.com (Reb2b)');
            console.log('2. Request to cdn.cr-relay.com (Signals)');
            console.log('Both should show Status 200');
            console.log('=== End Validation ===');

            // Add network instructions to page
            addResult(reb2bResults, 'ℹ Check Network tab for AWS S3 request', 'info');
            addResult(signalsResults, 'ℹ Check Network tab for cr-relay CDN request', 'info');

        }, 1000);
    </script>
</body>
</html>