@beworke/pixel 0.1.0-rc.1

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.
Files changed (123) hide show
  1. package/CHANGELOG.md +194 -0
  2. package/README.md +163 -0
  3. package/RELEASE_CANDIDATE.md +256 -0
  4. package/dist/PixelLogger-B21lEjep.d.mts +8 -0
  5. package/dist/PixelLogger-B21lEjep.d.ts +8 -0
  6. package/dist/StorageFactory-BhpbB6Jj.d.mts +8 -0
  7. package/dist/StorageFactory-CAkJJqVD.d.ts +8 -0
  8. package/dist/config/index.cjs.js +3 -0
  9. package/dist/config/index.cjs.js.map +1 -0
  10. package/dist/config/index.d.mts +19 -0
  11. package/dist/config/index.d.ts +19 -0
  12. package/dist/config/index.esm.js +3 -0
  13. package/dist/config/index.esm.js.map +1 -0
  14. package/dist/events/index.cjs.js +3 -0
  15. package/dist/events/index.cjs.js.map +1 -0
  16. package/dist/events/index.d.mts +1 -0
  17. package/dist/events/index.d.ts +1 -0
  18. package/dist/events/index.esm.js +3 -0
  19. package/dist/events/index.esm.js.map +1 -0
  20. package/dist/examples/html-script/README.md +71 -0
  21. package/dist/examples/html-script/RELEASE_CANDIDATE.md +121 -0
  22. package/dist/examples/html-script/add-payment-info/README.md +46 -0
  23. package/dist/examples/html-script/add-payment-info/example-add-payment-info-card-autocomplete.html +494 -0
  24. package/dist/examples/html-script/add-payment-info/example-add-payment-info-card-disabled.html +478 -0
  25. package/dist/examples/html-script/add-payment-info/example-add-payment-info-card-fields.html +486 -0
  26. package/dist/examples/html-script/add-payment-info/example-add-payment-info-data-track.html +479 -0
  27. package/dist/examples/html-script/add-payment-info/example-add-payment-info-dedupe.html +492 -0
  28. package/dist/examples/html-script/add-payment-info/example-add-payment-info-manual.html +495 -0
  29. package/dist/examples/html-script/add-payment-info/example-add-payment-info-rules-card.html +469 -0
  30. package/dist/examples/html-script/add-payment-info/example-add-payment-info-security.html +489 -0
  31. package/dist/examples/html-script/add-to-cart/README.md +36 -0
  32. package/dist/examples/html-script/add-to-cart/example-add-to-cart-attribute.html +517 -0
  33. package/dist/examples/html-script/add-to-cart/example-add-to-cart-auto.html +512 -0
  34. package/dist/examples/html-script/add-to-cart/example-add-to-cart-click.html +519 -0
  35. package/dist/examples/html-script/add-to-cart/example-add-to-cart-dedupe.html +514 -0
  36. package/dist/examples/html-script/add-to-cart/example-add-to-cart-manual.html +517 -0
  37. package/dist/examples/html-script/add-to-cart/example-add-to-cart-order-bump.html +527 -0
  38. package/dist/examples/html-script/add-to-cart/example-add-to-cart-text.html +524 -0
  39. package/dist/examples/html-script/example-basic.html +350 -0
  40. package/dist/examples/html-script/example-behavior.html +435 -0
  41. package/dist/examples/html-script/example-conversion.html +479 -0
  42. package/dist/examples/html-script/example-integration.html +709 -0
  43. package/dist/examples/html-script/example-transport.html +748 -0
  44. package/dist/examples/html-script/initiate-checkout/README.md +38 -0
  45. package/dist/examples/html-script/initiate-checkout/example-initiate-checkout-attribute.html +485 -0
  46. package/dist/examples/html-script/initiate-checkout/example-initiate-checkout-auto.html +491 -0
  47. package/dist/examples/html-script/initiate-checkout/example-initiate-checkout-click.html +493 -0
  48. package/dist/examples/html-script/initiate-checkout/example-initiate-checkout-manual.html +494 -0
  49. package/dist/examples/html-script/initiate-checkout/example-initiate-checkout-snapshot.html +497 -0
  50. package/dist/examples/html-script/initiate-checkout/example-initiate-checkout-submit.html +502 -0
  51. package/dist/examples/html-script/initiate-checkout/example-initiate-checkout-text.html +496 -0
  52. package/dist/examples/html-script/lead/README.md +25 -0
  53. package/dist/examples/html-script/lead/example-lead-trigger-attribute.html +594 -0
  54. package/dist/examples/html-script/lead/example-lead-trigger-auto.html +431 -0
  55. package/dist/examples/html-script/lead/example-lead-trigger-click.html +587 -0
  56. package/dist/examples/html-script/release-candidate.html +726 -0
  57. package/dist/examples/html-script/remove-from-cart/README.md +36 -0
  58. package/dist/examples/html-script/remove-from-cart/example-remove-from-cart-attribute.html +532 -0
  59. package/dist/examples/html-script/remove-from-cart/example-remove-from-cart-css.html +524 -0
  60. package/dist/examples/html-script/remove-from-cart/example-remove-from-cart-dedupe.html +540 -0
  61. package/dist/examples/html-script/remove-from-cart/example-remove-from-cart-manual.html +533 -0
  62. package/dist/examples/html-script/remove-from-cart/example-remove-from-cart-multi.html +557 -0
  63. package/dist/examples/html-script/remove-from-cart/example-remove-from-cart-state.html +539 -0
  64. package/dist/examples/html-script/remove-from-cart/example-remove-from-cart-text.html +524 -0
  65. package/dist/examples/html-script/search/README.md +41 -0
  66. package/dist/examples/html-script/search/example-search-attribute.html +454 -0
  67. package/dist/examples/html-script/search/example-search-button-sync.html +455 -0
  68. package/dist/examples/html-script/search/example-search-dedupe.html +466 -0
  69. package/dist/examples/html-script/search/example-search-input.html +456 -0
  70. package/dist/examples/html-script/search/example-search-manual.html +473 -0
  71. package/dist/examples/html-script/search/example-search-submit.html +450 -0
  72. package/dist/examples/html-script/search/example-search-text.html +441 -0
  73. package/dist/examples/html-script/view-content/README.md +48 -0
  74. package/dist/examples/html-script/view-content/example-view-content-attribute.html +488 -0
  75. package/dist/examples/html-script/view-content/example-view-content-css.html +467 -0
  76. package/dist/examples/html-script/view-content/example-view-content-dedupe.html +485 -0
  77. package/dist/examples/html-script/view-content/example-view-content-empty.html +469 -0
  78. package/dist/examples/html-script/view-content/example-view-content-manual.html +496 -0
  79. package/dist/examples/html-script/view-content/example-view-content-product-card.html +478 -0
  80. package/dist/examples/html-script/view-content/example-view-content-text.html +473 -0
  81. package/dist/examples/release-candidate/README.md +14 -0
  82. package/dist/examples/v2/README.md +33 -0
  83. package/dist/index-DUfFzniE.d.mts +274 -0
  84. package/dist/index-DUfFzniE.d.ts +274 -0
  85. package/dist/index.cjs.js +3 -0
  86. package/dist/index.cjs.js.map +1 -0
  87. package/dist/index.d.mts +364 -0
  88. package/dist/index.d.ts +364 -0
  89. package/dist/index.esm.js +3 -0
  90. package/dist/index.esm.js.map +1 -0
  91. package/dist/logger/index.cjs.js +3 -0
  92. package/dist/logger/index.cjs.js.map +1 -0
  93. package/dist/logger/index.d.mts +12 -0
  94. package/dist/logger/index.d.ts +12 -0
  95. package/dist/logger/index.esm.js +3 -0
  96. package/dist/logger/index.esm.js.map +1 -0
  97. package/dist/pixel-CbeF25mD.d.mts +555 -0
  98. package/dist/pixel-CbeF25mD.d.ts +555 -0
  99. package/dist/pixel-default-config-1VgLFOiL.d.mts +5 -0
  100. package/dist/pixel-default-config-Bxb-Vdd8.d.ts +5 -0
  101. package/dist/runtime/index.cjs.js +3 -0
  102. package/dist/runtime/index.cjs.js.map +1 -0
  103. package/dist/runtime/index.d.mts +48 -0
  104. package/dist/runtime/index.d.ts +48 -0
  105. package/dist/runtime/index.esm.js +3 -0
  106. package/dist/runtime/index.esm.js.map +1 -0
  107. package/dist/services/index.cjs.js +3 -0
  108. package/dist/services/index.cjs.js.map +1 -0
  109. package/dist/services/index.d.mts +169 -0
  110. package/dist/services/index.d.ts +169 -0
  111. package/dist/services/index.esm.js +3 -0
  112. package/dist/services/index.esm.js.map +1 -0
  113. package/dist/types-CTpRvFKZ.d.ts +71 -0
  114. package/dist/types-DGlBdsAy.d.mts +71 -0
  115. package/dist/v2/global.global.js +3 -0
  116. package/dist/v2/global.global.js.map +1 -0
  117. package/dist/v2/index.cjs.js +3 -0
  118. package/dist/v2/index.cjs.js.map +1 -0
  119. package/dist/v2/index.d.mts +7 -0
  120. package/dist/v2/index.d.ts +7 -0
  121. package/dist/v2/index.esm.js +3 -0
  122. package/dist/v2/index.esm.js.map +1 -0
  123. package/package.json +101 -0
@@ -0,0 +1,524 @@
1
+ <!doctype html>
2
+ <html lang="pt-BR">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
+ <title>Pixel v2 — REMOVE_FROM_CART CSS class</title>
7
+ <style>
8
+ :root {
9
+ --bg: #f8fafc; --card: #fff; --border: #e2e8f0; --text: #0f172a;
10
+ --muted: #64748b; --accent: #0f766e; --accent-soft: #ccfbf1;
11
+ --warn: #9a3412; --warn-soft: #ffedd5;
12
+ }
13
+ * { box-sizing: border-box; }
14
+ body {
15
+ margin: 0;
16
+ font-family: "Segoe UI", system-ui, sans-serif;
17
+ background:
18
+ radial-gradient(circle at top left, #ecfeff 0%, transparent 40%),
19
+ linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
20
+ color: var(--text); line-height: 1.45;
21
+ }
22
+ .wrap { max-width: 980px; margin: 0 auto; padding: 1.5rem; }
23
+ h1 { font-size: 1.5rem; margin: 0 0 0.35rem; letter-spacing: -0.02em; }
24
+ h2 { font-size: 1.05rem; margin: 0 0 0.75rem; }
25
+ .sub { color: var(--muted); margin: 0 0 1rem; font-size: 0.92rem; }
26
+ .nav { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-bottom: 1rem; }
27
+ .nav a {
28
+ text-decoration: none; border: 1px solid var(--border); background: #fff;
29
+ color: var(--text); border-radius: 999px; padding: 0.3rem 0.7rem; font-size: 0.78rem;
30
+ }
31
+ .nav a.active { background: var(--accent); border-color: var(--accent); color: #fff; }
32
+ .grid { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 1rem; }
33
+ @media (max-width: 860px) { .grid { grid-template-columns: 1fr; } }
34
+ .card {
35
+ background: var(--card); border: 1px solid var(--border); border-radius: 12px;
36
+ padding: 1rem; margin-bottom: 1rem; box-shadow: 0 1px 0 rgba(15,23,42,.03);
37
+ }
38
+ .hint {
39
+ background: var(--accent-soft); border: 1px solid #99f6e4; border-radius: 10px;
40
+ padding: 0.85rem 1rem; font-size: 0.9rem; margin-bottom: 1rem;
41
+ }
42
+ .hint.warn { background: var(--warn-soft); border-color: #fdba74; color: var(--warn); }
43
+ .actions { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.75rem; }
44
+ button {
45
+ appearance: none; border: 1px solid var(--border); background: #fff; color: var(--text);
46
+ border-radius: 8px; padding: 0.5rem 0.85rem; cursor: pointer; font: inherit;
47
+ }
48
+ button.primary { background: var(--accent); border-color: var(--accent); color: #fff; }
49
+ button.danger { background: #7f1d1d; border-color: #7f1d1d; color: #fff; }
50
+ button:disabled { opacity: 0.55; cursor: not-allowed; }
51
+ label { display: block; font-size: 0.8rem; color: var(--muted); margin-bottom: 0.25rem; }
52
+ input {
53
+ width: 100%; border: 1px solid var(--border); border-radius: 8px;
54
+ padding: 0.55rem 0.7rem; font: inherit; background: #fff;
55
+ }
56
+ .row { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
57
+ @media (max-width: 560px) { .row { grid-template-columns: 1fr; } }
58
+ .status, pre {
59
+ background: #0f172a; color: #e2e8f0; border-radius: 8px; padding: 0.75rem;
60
+ font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
61
+ font-size: 0.78rem; white-space: pre-wrap; word-break: break-word;
62
+ max-height: 260px; overflow: auto;
63
+ }
64
+ .pill {
65
+ display: inline-block; border-radius: 999px; padding: 0.15rem 0.55rem;
66
+ font-size: 0.72rem; background: #e2e8f0; color: #334155; margin-left: 0.35rem;
67
+ }
68
+ .pill.ok { background: #bbf7d0; color: #166534; }
69
+ .checklist { margin: 0; padding-left: 1.1rem; font-size: 0.88rem; color: var(--muted); }
70
+ .checklist li { margin: 0.35rem 0; }
71
+ .ctx {
72
+ border-left: 3px solid var(--accent); padding-left: 0.75rem; margin-bottom: 0.85rem;
73
+ color: var(--muted); font-size: 0.88rem;
74
+ }
75
+ .product {
76
+ border: 1px dashed var(--border); border-radius: 10px; padding: 0.75rem; margin: 0.5rem 0;
77
+ }
78
+ .product strong { display: block; margin-bottom: 0.2rem; }
79
+ code { font-size: 0.85em; }
80
+ </style>
81
+ </head>
82
+ <body>
83
+ <div class="wrap">
84
+ <h1>REMOVE_FROM_CART — css · .remove-from-cart</h1>
85
+ <p class="sub">
86
+ Cenário isolado para validação do Pixel v2.
87
+ <span class="pill" id="init-pill">offline</span>
88
+ </p>
89
+ <div class="nav"><a href="example-remove-from-cart-attribute.html" class="">1. Atributo</a>
90
+ <a href="example-remove-from-cart-text.html" class="">2. Text</a>
91
+ <a href="example-remove-from-cart-css.html" class="active">3. CSS class</a>
92
+ <a href="example-remove-from-cart-manual.html" class="">4. Manual API</a>
93
+ <a href="example-remove-from-cart-state.html" class="">5. CommerceState</a>
94
+ <a href="example-remove-from-cart-dedupe.html" class="">6. Dedupe</a>
95
+ <a href="example-remove-from-cart-multi.html" class="">7. Multi item</a></div>
96
+ <div class="hint"><strong>Contexto:</strong> seletor por classe CSS
97
+ <code>.remove-from-cart</code> (padrão do plano alvo), sem depender de
98
+ <code>data-track</code>.</div>
99
+
100
+ <div class="card">
101
+ <h2>Lifecycle</h2>
102
+ <div class="actions">
103
+ <button id="btn-reinit" class="primary" type="button">Reinitialize</button>
104
+ <button id="btn-destroy" class="danger" type="button">Destroy</button>
105
+ <button id="btn-clear" type="button">Clear logs</button>
106
+ </div>
107
+ <div class="status" id="runtime-status">Aguardando init...</div>
108
+ </div>
109
+
110
+ <div class="grid">
111
+ <div>
112
+ <div class="card">
113
+ <h2>Remover por classe <span class="pill">.remove-from-cart</span></h2>
114
+ <div class="ctx">Classe dedicada no botão + data-product-id.</div>
115
+ <div class="product">
116
+ <strong>Oferta Principal</strong>
117
+ <div class="actions">
118
+ <button
119
+ type="button"
120
+ class="danger remove-from-cart"
121
+ data-product-id="main_offer"
122
+ >
123
+ Tirar do carrinho
124
+ </button>
125
+ <button
126
+ type="button"
127
+ class="danger"
128
+ data-product-id="main_offer"
129
+ id="btn-no-class"
130
+ >
131
+ Sem a classe
132
+ </button>
133
+ </div>
134
+ </div>
135
+ </div>
136
+ <div class="card">
137
+ <h2>Checklist</h2>
138
+ <ul class="checklist">
139
+ <li>[ ] Botão com classe → <code>REMOVE_FROM_CART</code></li>
140
+ <li>[ ] Botão sem classe → não dispara</li>
141
+ <li>[ ] main_offer some do mirror</li>
142
+ </ul>
143
+ </div>
144
+ </div>
145
+ <div>
146
+ <div class="card">
147
+ <h2>Event counts</h2>
148
+ <div class="status" id="event-counts">Nenhum evento ainda</div>
149
+ </div>
150
+ <div class="card">
151
+ <h2>Cart mirror (via eventos + seed)</h2>
152
+ <div class="status" id="cart-mirror">{}</div>
153
+ </div>
154
+ <div class="card">
155
+ <h2>Active detectors</h2>
156
+ <div class="status" id="detectors">—</div>
157
+ </div>
158
+
159
+ <div class="card">
160
+ <h2>Last event JSON</h2>
161
+ <pre id="last-event">null</pre>
162
+ </div>
163
+ <div class="card">
164
+ <h2>Event log</h2>
165
+ <pre id="logs">Aguardando eventos...</pre>
166
+ </div>
167
+ </div>
168
+ </div>
169
+ </div>
170
+
171
+ <script src="../../../dist/v2/global.global.js"></script>
172
+ <script>
173
+ const { Pixel, DEFAULT_PIXEL_CONFIG } = window.PixelV2;
174
+ const API_ENDPOINT =
175
+ 'https://micro-service-pixel-production-4826.up.railway.app';
176
+ const PIXEL_ID = 'pix_7315610';
177
+
178
+ const els = {
179
+ logs: document.getElementById('logs'),
180
+ last: document.getElementById('last-event'),
181
+ counts: document.getElementById('event-counts'),
182
+ cart: document.getElementById('cart-mirror'),
183
+ detectors: document.getElementById('detectors'),
184
+ dedupe: document.getElementById('dedupe-keys'),
185
+ runtime: document.getElementById('runtime-status'),
186
+ pill: document.getElementById('init-pill'),
187
+ };
188
+
189
+ let pixel = null;
190
+ let unsubscribe = null;
191
+ let initCount = 0;
192
+ let destroyCount = 0;
193
+ const counts = {};
194
+ const cartMirror = {};
195
+
196
+ function removeFromCartDetectorConfig() {
197
+ return {
198
+ enabled: true,
199
+ selector: ['.remove-from-cart'],
200
+ selectorType: 'css',
201
+ };
202
+ }
203
+
204
+ function buildConfig() {
205
+ const base = DEFAULT_PIXEL_CONFIG;
206
+ return {
207
+ ...base,
208
+ app: {
209
+ ...base.app,
210
+ source: 'custom',
211
+ environment: 'development',
212
+ debug: true,
213
+ },
214
+ transport: {
215
+ ...DEFAULT_PIXEL_CONFIG.transport,
216
+ apiEndpoint: API_ENDPOINT,
217
+ timeoutMs: 10000,
218
+ },
219
+ identity: { ...base.identity, pixelId: PIXEL_ID },
220
+ modules: {
221
+ ...base.modules,
222
+ core: {
223
+ ...base.modules.core,
224
+ enabled: false,
225
+ pageView: {
226
+ ...base.modules.core.pageView,
227
+ enabled: false,
228
+ trackInitialPageView: false,
229
+ spa: false,
230
+ },
231
+ },
232
+ behavior: { ...base.modules.behavior, enabled: false },
233
+ privacy: { ...base.modules.privacy, enabled: false },
234
+ transport: {
235
+ enabled: true,
236
+ mockSender: { enabled: false },
237
+ sender: { mode: 'http' },
238
+ persistence: { enabled: true },
239
+ replay: { enabled: true },
240
+ ordering: { enabled: true },
241
+ coordination: { enabled: true },
242
+ circuitBreaker: {
243
+ enabled: true,
244
+ failureThreshold: 5,
245
+ resetTimeoutMs: 30000,
246
+ halfOpenMaxAttempts: 2,
247
+ },
248
+ backpressure: {
249
+ enabled: true,
250
+ maxQueueSize: 500,
251
+ policy: 'drop_oldest',
252
+ sampleRate: 0.5,
253
+ },
254
+ deadLetter: { enabled: true, maxEntries: 200 },
255
+ compression: { enabled: true, strategy: 'identity' },
256
+ retry: {
257
+ enabled: true,
258
+ maxAttempts: 4,
259
+ baseDelayMs: 500,
260
+ maxDelayMs: 4000,
261
+ multiplier: 2,
262
+ },
263
+ batch: {
264
+ enabled: true,
265
+ batchSize: 10,
266
+ flushIntervalMs: 2000,
267
+ maxWaitMs: 5000,
268
+ },
269
+ timeout: { enabled: true, timeoutMs: 10000 },
270
+ offline: { enabled: true },
271
+ flush: {
272
+ enabled: true,
273
+ flushIntervalMs: 2000,
274
+ flushOnDestroy: true,
275
+ prepareUnloadHooks: true,
276
+ },
277
+ },
278
+ integrations: { ...base.modules.integrations, enabled: false },
279
+ conversion: {
280
+ enabled: true,
281
+ commerce: {
282
+ currency: 'BRL',
283
+ catalog: { products: [
284
+ {
285
+ id: 'main_offer',
286
+ name: 'Oferta Principal',
287
+ type: 'main',
288
+ price: 197,
289
+ currency: 'BRL',
290
+ quantity: 1,
291
+ },
292
+ {
293
+ id: 'order_bump_01',
294
+ name: 'Order Bump Especial',
295
+ type: 'order_bump',
296
+ price: 47,
297
+ currency: 'BRL',
298
+ quantity: 1,
299
+ },
300
+ {
301
+ id: 'upsell_01',
302
+ name: 'Upsell 01',
303
+ type: 'upsell',
304
+ price: 97,
305
+ currency: 'BRL',
306
+ quantity: 1,
307
+ },
308
+ ] },
309
+ checkout: {
310
+ mode: 'single_product',
311
+ selectedItems: [
312
+ { productId: 'main_offer', quantity: 1 },
313
+ { productId: 'order_bump_01', quantity: 1 },
314
+ ],
315
+ calculateValueFrom: 'selected_items',
316
+ allowDynamicItems: true,
317
+ },
318
+ mappings: {
319
+ attributes: {
320
+ productId: ['data-product-id', 'data-sku', 'data-offer-id'],
321
+ productName: ['data-product-name', 'data-name'],
322
+ price: ['data-product-price', 'data-price'],
323
+ quantity: ['data-quantity', 'data-qty'],
324
+ currency: ['data-currency'],
325
+ },
326
+ fields: {
327
+ productId: ['productId', 'product_id', 'offerId', 'sku'],
328
+ productName: ['productName', 'product_name'],
329
+ price: ['price', 'amount'],
330
+ quantity: ['quantity', 'qty'],
331
+ currency: ['currency'],
332
+ email: ['email', 'customerEmail'],
333
+ phone: ['phone', 'telefone', 'customerPhone'],
334
+ },
335
+ },
336
+ },
337
+ manual: {
338
+ pageView: { enabled: false },
339
+ purchase: { enabled: false },
340
+ lead: { enabled: false },
341
+ addToCart: { enabled: true },
342
+ removeFromCart: { enabled: true },
343
+ initiateCheckout: { enabled: false },
344
+ addPaymentInfo: { enabled: false },
345
+ search: { enabled: false },
346
+ viewContent: { enabled: false },
347
+ },
348
+ auto: {
349
+ enabled: true,
350
+ detectors: {
351
+ lead: { enabled: false },
352
+ purchase: { enabled: false },
353
+ addToCart: { enabled: false },
354
+ removeFromCart: removeFromCartDetectorConfig(),
355
+ initiateCheckout: { enabled: false },
356
+ addPaymentInfo: { enabled: false },
357
+ search: { enabled: false },
358
+ viewContent: { enabled: false },
359
+ },
360
+ },
361
+ rules: {
362
+ enabled: false,
363
+ selectors: [],
364
+ texts: [],
365
+ urlPatterns: [],
366
+ checkout: { enabled: false },
367
+ card: { enabled: false },
368
+ },
369
+ },
370
+ },
371
+ };
372
+ }
373
+
374
+ function appendLog(message) {
375
+ const line = '[' + new Date().toISOString() + '] ' + message;
376
+ const prev = els.logs.textContent;
377
+ els.logs.textContent =
378
+ prev === 'Aguardando eventos...' ? line : line + '\n' + prev;
379
+ }
380
+
381
+ function renderCounts() {
382
+ const lines = Object.keys(counts)
383
+ .sort()
384
+ .map(function (type) { return type + ': ' + counts[type]; });
385
+ els.counts.textContent =
386
+ lines.length > 0 ? lines.join('\n') : 'Nenhum evento ainda';
387
+ }
388
+
389
+ function renderCart() {
390
+ if (!els.cart) return;
391
+ els.cart.textContent = JSON.stringify(cartMirror, null, 2);
392
+ }
393
+
394
+ function seedCartMirror() {
395
+ Object.keys(cartMirror).forEach(function (k) { delete cartMirror[k]; });
396
+ cartMirror.main_offer = {
397
+ productId: 'main_offer',
398
+ productName: 'Oferta Principal (seed)',
399
+ price: 197,
400
+ currency: 'BRL',
401
+ quantity: 1,
402
+ };
403
+ cartMirror.order_bump_01 = {
404
+ productId: 'order_bump_01',
405
+ productName: 'Order Bump Especial (seed)',
406
+ price: 47,
407
+ currency: 'BRL',
408
+ quantity: 1,
409
+ };
410
+ renderCart();
411
+ }
412
+
413
+ function renderDebug() {
414
+ const detectors =
415
+ pixel && pixel.getDebugActiveDetectors
416
+ ? pixel.getDebugActiveDetectors()
417
+ : [];
418
+ els.detectors.textContent =
419
+ detectors.length > 0 ? detectors.join('\n') : 'Nenhum detector ativo';
420
+ if (els.dedupe) {
421
+ const keys =
422
+ pixel && pixel.getDebugDedupeKeys ? pixel.getDebugDedupeKeys() : [];
423
+ els.dedupe.textContent =
424
+ keys.length > 0 ? keys.join('\n') : 'Nenhuma chave';
425
+ }
426
+ els.runtime.textContent =
427
+ 'initialized: ' +
428
+ (pixel ? pixel.isInitialized() : false) +
429
+ '\ninit count: ' +
430
+ initCount +
431
+ '\ndestroy count: ' +
432
+ destroyCount +
433
+ '\npixelId: ' +
434
+ PIXEL_ID +
435
+ '\nscenario: css · .remove-from-cart';
436
+ els.pill.textContent =
437
+ pixel && pixel.isInitialized() ? 'ready' : 'offline';
438
+ els.pill.className =
439
+ 'pill' + (pixel && pixel.isInitialized() ? ' ok' : '');
440
+ }
441
+
442
+ function updateCartFromEvent(event) {
443
+ if (
444
+ event.type === 'ADD_TO_CART' &&
445
+ event.data &&
446
+ event.data.productId
447
+ ) {
448
+ cartMirror[event.data.productId] = {
449
+ productId: event.data.productId,
450
+ productName: event.data.productName,
451
+ price: event.data.price,
452
+ currency: event.data.currency,
453
+ quantity: event.data.quantity != null ? event.data.quantity : 1,
454
+ };
455
+ }
456
+ if (
457
+ event.type === 'REMOVE_FROM_CART' &&
458
+ event.data &&
459
+ event.data.productId
460
+ ) {
461
+ delete cartMirror[event.data.productId];
462
+ }
463
+ renderCart();
464
+ }
465
+
466
+ function onEvent(event) {
467
+ counts[event.type] = (counts[event.type] || 0) + 1;
468
+ renderCounts();
469
+ updateCartFromEvent(event);
470
+ els.last.textContent = JSON.stringify(event, null, 2);
471
+ appendLog(event.type + ' ' + JSON.stringify(event.data || {}));
472
+ renderDebug();
473
+ }
474
+
475
+ async function boot() {
476
+ if (unsubscribe) { unsubscribe(); unsubscribe = null; }
477
+ if (pixel) {
478
+ await pixel.destroy();
479
+ destroyCount += 1;
480
+ pixel = null;
481
+ }
482
+ seedCartMirror();
483
+ pixel = new Pixel(buildConfig());
484
+ await pixel.init();
485
+ initCount += 1;
486
+ const services = pixel.getDebugServices();
487
+ if (services && services.dispatcher) {
488
+ unsubscribe = services.dispatcher.subscribe(onEvent);
489
+ }
490
+ appendLog('Pixel initialized — css · .remove-from-cart');
491
+ renderDebug();
492
+ }
493
+
494
+ async function destroyPixel() {
495
+ if (unsubscribe) { unsubscribe(); unsubscribe = null; }
496
+ if (pixel) {
497
+ await pixel.destroy();
498
+ destroyCount += 1;
499
+ pixel = null;
500
+ }
501
+ appendLog('Pixel destroyed');
502
+ renderDebug();
503
+ }
504
+
505
+ document.getElementById('btn-reinit').onclick = function () { boot(); };
506
+ document.getElementById('btn-destroy').onclick = function () { destroyPixel(); };
507
+ document.getElementById('btn-clear').onclick = function () {
508
+ els.logs.textContent = 'Aguardando eventos...';
509
+ els.last.textContent = 'null';
510
+ Object.keys(counts).forEach(function (k) { delete counts[k]; });
511
+ seedCartMirror();
512
+ renderCounts();
513
+ };
514
+
515
+
516
+ document.getElementById('btn-no-class').onclick = function () {
517
+ appendLog('(playground) sem classe .remove-from-cart — esperado: nenhum REMOVE');
518
+ };
519
+
520
+
521
+ boot();
522
+ </script>
523
+ </body>
524
+ </html>