@absmartly/sdk-plugins 1.0.1 → 1.1.1

package/lib/core/DOMChangesPluginLite.js

@@ -94,7 +94,7 @@ var DOMChangesPluginLite = /** @class */ (function () {
         this.persistenceObserver = null;
         this.reapplyingElements = new Set();
         this.reapplyLogThrottle = new Map();
-        this.appliedStyleChanges = new Map();
+        this.appliedChanges = new Map();
         this.antiFlickerTimeout = null;
         this.antiFlickerStyleId = 'absmartly-antiflicker';
         this.config = {
@@ -186,10 +186,45 @@ var DOMChangesPluginLite = /** @class */ (function () {
         });
     };
     DOMChangesPluginLite.prototype.setupMutationObserver = function () {
-        var observer = new MutationObserver(function () {
-            // Check for pending changes that might now be applicable
-            // Note: We don't have a centralized pending changes store in lite version,
-            // the PendingChangeManager handles this internally
+        var _this = this;
+        var observer = new MutationObserver(function (mutations) {
+            // Re-apply ALL changes to elements that were replaced by React (hydration mismatch)
+            mutations.forEach(function (mutation) {
+                if (mutation.type === 'childList') {
+                    // Check if any added nodes match our applied change selectors
+                    mutation.addedNodes.forEach(function (node) {
+                        if (node.nodeType === Node.ELEMENT_NODE) {
+                            var element_1 = node;
+                            // Check all experiments with applied changes (not just style changes)
+                            _this.appliedChanges.forEach(function (changes, experimentName) {
+                                changes.forEach(function (change) {
+                                    try {
+                                        // Check if this new element or any of its descendants match the selector
+                                        var matchingElements = element_1.matches(change.selector)
+                                            ? [element_1]
+                                            : Array.from(element_1.querySelectorAll(change.selector));
+                                        matchingElements.forEach(function (matchingEl) {
+                                            if (_this.config.debug) {
+                                                (0, debug_1.logDebug)('[SPA-REAPPLY] Re-applying change to newly added element (React hydration recovery)', {
+                                                    experimentName: experimentName,
+                                                    selector: change.selector,
+                                                    element: matchingEl.tagName,
+                                                    changeType: change.type,
+                                                });
+                                            }
+                                            // Re-apply the change to the new element (ALL types: style, class, attribute, html, text, etc.)
+                                            _this.domManipulator.applyChange(change, experimentName);
+                                        });
+                                    }
+                                    catch (e) {
+                                        // Invalid selector, skip
+                                    }
+                                });
+                            });
+                        }
+                    });
+                }
+            });
         });
         observer.observe(document.body, {
             childList: true,
@@ -261,8 +296,8 @@ var DOMChangesPluginLite = /** @class */ (function () {
                 // Clear style managers - StyleSheetManager doesn't have a remove method
                 // The stylesheets will be reused or cleared on next applyChanges
                 this.styleManagers.clear();
-                // Clear applied style changes
-                this.appliedStyleChanges.clear();
+                // Clear applied changes
+                this.appliedChanges.clear();
                 // Clear HTML injections
                 this.htmlInjector.destroy();
                 // Clear variant extractor cache to force re-extraction
@@ -345,8 +380,8 @@ var DOMChangesPluginLite = /** @class */ (function () {
     };
     DOMChangesPluginLite.prototype.applyChanges = function (experimentName) {
         return __awaiter(this, void 0, void 0, function () {
-            var startTime, currentURL, error_3, allExperiments, totalApplied, experimentStats, allExperiments_1, allExperiments_1_1, _a, expName, experimentData, currentVariant, variantData, urlFilter, globalDefaults, anyVariantMatchesURL, shouldApplyVisualChanges, changes, allVariantChanges, hasAnyChangesInAnyVariant, stats, hasImmediateTrigger, hasViewportTrigger, changes_1, changes_1_1, change, success, elements, changes_2, changes_2_1, change, hasAnyViewportTriggerInAnyVariant, hasAnyImmediateTriggerInAnyVariant, allVariantChanges_1, allVariantChanges_1_1, variantChanges, variantChanges_1, variantChanges_1_1, change, duration;
-            var e_1, _b, e_2, _c, e_3, _d, e_4, _e, e_5, _f;
+            var startTime, currentURL, error_3, allExperiments, totalApplied, experimentStats, allExperiments_1, allExperiments_1_1, _a, expName, experimentData, currentVariant, variantData, urlFilter, globalDefaults, anyVariantMatchesURL, shouldApplyVisualChanges, changes, allVariantChanges, hasAnyChangesInAnyVariant, stats, changes_1, changes_1_1, change, success, elements, hasAnyViewportTriggerInAnyVariant, hasAnyImmediateTriggerInAnyVariant, allVariantsData, allVariantsData_1, allVariantsData_1_1, _b, variantIndex, variantData_1, variantChanges, variantMatchesURL, config, urlFilterConfig, variantChanges_1, variantChanges_1_1, change, duration;
+            var e_1, _c, e_2, _d, e_3, _e, e_4, _f;
             return __generator(this, function (_g) {
                 switch (_g.label) {
                     case 0:
@@ -419,8 +454,6 @@ var DOMChangesPluginLite = /** @class */ (function () {
                                         }); })) || [],
                                     });
                                 }
-                                hasImmediateTrigger = false;
-                                hasViewportTrigger = false;
                                 // Apply visual changes only if URL matches for user's variant AND user has changes
                                 if (shouldApplyVisualChanges && changes && changes.length > 0) {
                                     try {
@@ -430,12 +463,6 @@ var DOMChangesPluginLite = /** @class */ (function () {
                                             if (success) {
                                                 totalApplied++;
                                                 stats.success++;
-                                                if (change.trigger_on_view) {
-                                                    hasViewportTrigger = true;
-                                                }
-                                                else {
-                                                    hasImmediateTrigger = true;
-                                                }
                                             }
                                             else if (change.type !== 'create' && change.type !== 'styleRules') {
                                                 // Track pending changes for stats
@@ -443,9 +470,6 @@ var DOMChangesPluginLite = /** @class */ (function () {
                                                     elements = document.querySelectorAll(change.selector);
                                                     if (elements.length === 0 && (this.config.spa || change.waitForElement)) {
                                                         stats.pending++;
-                                                        if (change.trigger_on_view) {
-                                                            hasViewportTrigger = true;
-                                                        }
                                                     }
                                                 }
                                                 catch (error) {
@@ -459,82 +483,106 @@ var DOMChangesPluginLite = /** @class */ (function () {
                                     catch (e_2_1) { e_2 = { error: e_2_1 }; }
                                     finally {
                                         try {
-                                            if (changes_1_1 && !changes_1_1.done && (_c = changes_1.return)) _c.call(changes_1);
+                                            if (changes_1_1 && !changes_1_1.done && (_d = changes_1.return)) _d.call(changes_1);
                                         }
                                         finally { if (e_2) throw e_2.error; }
                                     }
                                 }
                                 else if (changes && changes.length > 0) {
-                                    try {
-                                        // URL doesn't match for user's variant OR user has no changes
-                                        // Check if user's changes have viewport trigger (if they exist)
-                                        // We still need to set up tracking for SRM prevention
-                                        for (changes_2 = (e_3 = void 0, __values(changes)), changes_2_1 = changes_2.next(); !changes_2_1.done; changes_2_1 = changes_2.next()) {
-                                            change = changes_2_1.value;
-                                            if (change.trigger_on_view) {
-                                                hasViewportTrigger = true;
-                                            }
-                                            else {
-                                                hasImmediateTrigger = true;
-                                            }
-                                        }
-                                    }
-                                    catch (e_3_1) { e_3 = { error: e_3_1 }; }
-                                    finally {
-                                        try {
-                                            if (changes_2_1 && !changes_2_1.done && (_d = changes_2.return)) _d.call(changes_2);
-                                        }
-                                        finally { if (e_3) throw e_3.error; }
-                                    }
                                     (0, debug_1.logDebug)("[ABsmartly] Experiment '".concat(expName, "' variant ").concat(currentVariant, " doesn't match URL filter or has no changes, but setting up tracking for SRM prevention"));
                                 }
-                                hasAnyViewportTriggerInAnyVariant = hasViewportTrigger;
-                                hasAnyImmediateTriggerInAnyVariant = hasImmediateTrigger;
-                                if (!hasViewportTrigger || !hasImmediateTrigger) {
-                                    try {
-                                        for (allVariantChanges_1 = (e_4 = void 0, __values(allVariantChanges)), allVariantChanges_1_1 = allVariantChanges_1.next(); !allVariantChanges_1_1.done; allVariantChanges_1_1 = allVariantChanges_1.next()) {
-                                            variantChanges = allVariantChanges_1_1.value;
-                                            if (variantChanges && variantChanges.length > 0) {
-                                                try {
-                                                    for (variantChanges_1 = (e_5 = void 0, __values(variantChanges)), variantChanges_1_1 = variantChanges_1.next(); !variantChanges_1_1.done; variantChanges_1_1 = variantChanges_1.next()) {
-                                                        change = variantChanges_1_1.value;
-                                                        if (change.trigger_on_view) {
-                                                            hasAnyViewportTriggerInAnyVariant = true;
-                                                        }
-                                                        else {
-                                                            hasAnyImmediateTriggerInAnyVariant = true;
-                                                        }
-                                                        // Early exit if we found both types
-                                                        if (hasAnyViewportTriggerInAnyVariant && hasAnyImmediateTriggerInAnyVariant) {
-                                                            break;
-                                                        }
-                                                    }
+                                hasAnyViewportTriggerInAnyVariant = false;
+                                hasAnyImmediateTriggerInAnyVariant = false;
+                                allVariantsData = this.variantExtractor.getAllVariantsData(expName);
+                                if (this.config.debug) {
+                                    (0, debug_1.logDebug)("[ABsmartly] Checking trigger types for experiment '".concat(expName, "' on URL: ").concat(currentURL), {
+                                        allVariantsDataSize: allVariantsData.size,
+                                        allVariantChangesLength: allVariantChanges.length,
+                                    });
+                                    // Log the structure of each variant's data
+                                    allVariantsData.forEach(function (data, idx) {
+                                        (0, debug_1.logDebug)("[ABsmartly] Variant ".concat(idx, " data structure:"), {
+                                            isArray: Array.isArray(data),
+                                            isObject: typeof data === 'object',
+                                            hasUrlFilter: data && typeof data === 'object' && !Array.isArray(data) && 'urlFilter' in data,
+                                            keys: data && typeof data === 'object' && !Array.isArray(data) ? Object.keys(data) : 'N/A',
+                                        });
+                                    });
+                                }
+                                try {
+                                    // Loop through ALL variants (not just ones with changes)
+                                    // We need to check URL filters from the raw data, which includes variants without changes
+                                    for (allVariantsData_1 = (e_3 = void 0, __values(allVariantsData)), allVariantsData_1_1 = allVariantsData_1.next(); !allVariantsData_1_1.done; allVariantsData_1_1 = allVariantsData_1.next()) {
+                                        _b = __read(allVariantsData_1_1.value, 2), variantIndex = _b[0], variantData_1 = _b[1];
+                                        variantChanges = allVariantChanges[variantIndex];
+                                        if (!variantChanges || variantChanges.length === 0) {
+                                            continue;
+                                        }
+                                        variantMatchesURL = true;
+                                        if (variantData_1 && typeof variantData_1 === 'object' && !Array.isArray(variantData_1)) {
+                                            config = variantData_1;
+                                            if ('urlFilter' in config && config.urlFilter) {
+                                                urlFilterConfig = config;
+                                                variantMatchesURL = URLMatcher_1.URLMatcher.matches(urlFilterConfig.urlFilter, currentURL);
+                                                if (this.config.debug) {
+                                                    (0, debug_1.logDebug)("[ABsmartly] Variant ".concat(variantIndex, " has URL filter, matches: ").concat(variantMatchesURL));
                                                 }
-                                                catch (e_5_1) { e_5 = { error: e_5_1 }; }
-                                                finally {
-                                                    try {
-                                                        if (variantChanges_1_1 && !variantChanges_1_1.done && (_f = variantChanges_1.return)) _f.call(variantChanges_1);
+                                            }
+                                            // If no urlFilter property, variantMatchesURL stays true (legacy behavior)
+                                        }
+                                        // Only collect trigger types from variants whose URL filters match
+                                        if (variantMatchesURL) {
+                                            try {
+                                                for (variantChanges_1 = (e_4 = void 0, __values(variantChanges)), variantChanges_1_1 = variantChanges_1.next(); !variantChanges_1_1.done; variantChanges_1_1 = variantChanges_1.next()) {
+                                                    change = variantChanges_1_1.value;
+                                                    if (change.trigger_on_view) {
+                                                        hasAnyViewportTriggerInAnyVariant = true;
+                                                    }
+                                                    else {
+                                                        hasAnyImmediateTriggerInAnyVariant = true;
+                                                    }
+                                                    // Early exit if we found both types
+                                                    if (hasAnyViewportTriggerInAnyVariant && hasAnyImmediateTriggerInAnyVariant) {
+                                                        break;
                                                     }
-                                                    finally { if (e_5) throw e_5.error; }
                                                 }
                                             }
-                                            if (hasAnyViewportTriggerInAnyVariant && hasAnyImmediateTriggerInAnyVariant) {
-                                                break;
+                                            catch (e_4_1) { e_4 = { error: e_4_1 }; }
+                                            finally {
+                                                try {
+                                                    if (variantChanges_1_1 && !variantChanges_1_1.done && (_f = variantChanges_1.return)) _f.call(variantChanges_1);
+                                                }
+                                                finally { if (e_4) throw e_4.error; }
+                                            }
+                                            if (this.config.debug) {
+                                                (0, debug_1.logDebug)("[ABsmartly] Variant ".concat(variantIndex, " matches URL - hasImmediate: ").concat(hasAnyImmediateTriggerInAnyVariant, ", hasViewport: ").concat(hasAnyViewportTriggerInAnyVariant));
                                             }
                                         }
-                                    }
-                                    catch (e_4_1) { e_4 = { error: e_4_1 }; }
-                                    finally {
-                                        try {
-                                            if (allVariantChanges_1_1 && !allVariantChanges_1_1.done && (_e = allVariantChanges_1.return)) _e.call(allVariantChanges_1);
+                                        else {
+                                            if (this.config.debug) {
+                                                (0, debug_1.logDebug)("[ABsmartly] Variant ".concat(variantIndex, " does NOT match URL - skipping"));
+                                            }
+                                        }
+                                        if (hasAnyViewportTriggerInAnyVariant && hasAnyImmediateTriggerInAnyVariant) {
+                                            break;
                                         }
-                                        finally { if (e_4) throw e_4.error; }
                                     }
                                 }
+                                catch (e_3_1) { e_3 = { error: e_3_1 }; }
+                                finally {
+                                    try {
+                                        if (allVariantsData_1_1 && !allVariantsData_1_1.done && (_e = allVariantsData_1.return)) _e.call(allVariantsData_1);
+                                    }
+                                    finally { if (e_3) throw e_3.error; }
+                                }
+                                if (this.config.debug) {
+                                    (0, debug_1.logDebug)("[ABsmartly] Final trigger decision for '".concat(expName, "': hasImmediate=").concat(hasAnyImmediateTriggerInAnyVariant, ", hasViewport=").concat(hasAnyViewportTriggerInAnyVariant));
+                                }
                                 // CRITICAL: Always register experiment for tracking if ANY variant has ANY trigger type
                                 // This prevents SRM even when user's variant doesn't match URL filter
+                                // Pass the URL-filtered trigger flags to ExposureTracker
                                 if (hasAnyViewportTriggerInAnyVariant || hasAnyImmediateTriggerInAnyVariant) {
-                                    this.exposureTracker.registerExperiment(expName, currentVariant || 0, changes || [], allVariantChanges);
+                                    this.exposureTracker.registerExperiment(expName, currentVariant || 0, changes || [], allVariantChanges, hasAnyImmediateTriggerInAnyVariant, hasAnyViewportTriggerInAnyVariant);
                                 }
                                 // Note: We do NOT call treatment() here anymore to avoid duplicate calls.
                                 // The ExposureTracker.registerExperiment() will call triggerExposure() internally
@@ -547,7 +595,7 @@ var DOMChangesPluginLite = /** @class */ (function () {
                         catch (e_1_1) { e_1 = { error: e_1_1 }; }
                         finally {
                             try {
-                                if (allExperiments_1_1 && !allExperiments_1_1.done && (_b = allExperiments_1.return)) _b.call(allExperiments_1);
+                                if (allExperiments_1_1 && !allExperiments_1_1.done && (_c = allExperiments_1.return)) _c.call(allExperiments_1);
                             }
                             finally { if (e_1) throw e_1.error; }
                         }
@@ -588,7 +636,7 @@ var DOMChangesPluginLite = /** @class */ (function () {
      * Get all experiments with their variant data and metadata
      */
     DOMChangesPluginLite.prototype.getAllExperimentsData = function () {
-        var e_6, _a;
+        var e_5, _a;
         var experiments = new Map();
         var allVariants = this.variantExtractor.extractAllChanges();
         try {
@@ -622,12 +670,12 @@ var DOMChangesPluginLite = /** @class */ (function () {
                 experiments.set(expName, { variantData: variantData, urlFilter: urlFilter, globalDefaults: globalDefaults });
             }
         }
-        catch (e_6_1) { e_6 = { error: e_6_1 }; }
+        catch (e_5_1) { e_5 = { error: e_5_1 }; }
         finally {
             try {
                 if (allVariants_1_1 && !allVariants_1_1.done && (_a = allVariants_1.return)) _a.call(allVariants_1);
             }
-            finally { if (e_6) throw e_6.error; }
+            finally { if (e_5) throw e_5.error; }
         }
         return experiments;
     };
@@ -752,7 +800,7 @@ var DOMChangesPluginLite = /** @class */ (function () {
         }
     };
     DOMChangesPluginLite.prototype.emit = function (event, data) {
-        var e_7, _a;
+        var e_6, _a;
         var listeners = this.eventListeners.get(event) || [];
         try {
             for (var listeners_1 = __values(listeners), listeners_1_1 = listeners_1.next(); !listeners_1_1.done; listeners_1_1 = listeners_1.next()) {
@@ -765,12 +813,12 @@ var DOMChangesPluginLite = /** @class */ (function () {
                 }
             }
         }
-        catch (e_7_1) { e_7 = { error: e_7_1 }; }
+        catch (e_6_1) { e_6 = { error: e_6_1 }; }
         finally {
             try {
                 if (listeners_1_1 && !listeners_1_1.done && (_a = listeners_1.return)) _a.call(listeners_1);
             }
-            finally { if (e_7) throw e_7.error; }
+            finally { if (e_6) throw e_6.error; }
         }
     };
     DOMChangesPluginLite.prototype.getStyleManager = function (experimentName) {
@@ -846,7 +894,7 @@ var DOMChangesPluginLite = /** @class */ (function () {
         this.eventListeners.clear();
         this.exposedExperiments.clear();
         this.watchedElements = new WeakMap();
-        this.appliedStyleChanges.clear();
+        this.appliedChanges.clear();
         this.reapplyingElements.clear();
         this.reapplyLogThrottle.clear();
         this.unregisterFromContext();
@@ -975,20 +1023,31 @@ var DOMChangesPluginLite = /** @class */ (function () {
             this.watchedElements.set(element, experiments);
         }
         experiments.add(experimentName);
-        // Store the applied style change for this experiment
-        if (!this.appliedStyleChanges.has(experimentName)) {
-            this.appliedStyleChanges.set(experimentName, []);
+        // Store the applied change for this experiment (ALL types: style, class, attribute, html, text, etc.)
+        if (!this.appliedChanges.has(experimentName)) {
+            this.appliedChanges.set(experimentName, []);
         }
-        var changes = this.appliedStyleChanges.get(experimentName);
+        var changes = this.appliedChanges.get(experimentName);
         var isNewWatch = !changes.includes(change);
         if (isNewWatch) {
             changes.push(change);
             // Only log when actually adding a new watch, not on every reapply
             if (this.config.debug) {
-                (0, debug_1.logDebug)('[ABsmartly] Watching element for style persistence', {
+                var currentStyles_1 = {};
+                if (change.value && typeof change.value === 'object') {
+                    Object.keys(change.value).forEach(function (prop) {
+                        var cssProp = prop.replace(/([A-Z])/g, '-$1').toLowerCase();
+                        currentStyles_1[cssProp] = element.style.getPropertyValue(cssProp);
+                    });
+                }
+                (0, debug_1.logDebug)('[WATCH-ELEMENT] Started watching element for persistence/hydration recovery', {
                     experimentName: experimentName,
                     selector: change.selector,
                     element: element.tagName,
+                    changeType: change.type,
+                    value: change.value,
+                    currentStyles: change.type === 'style' ? currentStyles_1 : undefined,
+                    timestamp: Date.now(),
                 });
             }
         }
@@ -1009,10 +1068,34 @@ var DOMChangesPluginLite = /** @class */ (function () {
         var _this = this;
         if (this.persistenceObserver)
             return;
+        if (this.config.debug) {
+            (0, debug_1.logDebug)('[PERSISTENCE-OBSERVER] Setting up persistence observer', {
+                timestamp: Date.now(),
+                watchedElementsCount: this.watchedElements ? 'has WeakMap' : 'no WeakMap',
+            });
+        }
         this.persistenceObserver = new MutationObserver(function (mutations) {
+            if (_this.config.debug) {
+                (0, debug_1.logDebug)('[MUTATION-DETECTED] Persistence observer detected mutations', {
+                    mutationCount: mutations.length,
+                    timestamp: Date.now(),
+                    mutations: mutations.map(function (m) {
+                        var _a;
+                        return ({
+                            target: m.target.tagName,
+                            oldValue: (_a = m.oldValue) === null || _a === void 0 ? void 0 : _a.substring(0, 100),
+                        });
+                    }),
+                });
+            }
             mutations.forEach(function (mutation) {
                 var element = mutation.target;
                 if (_this.reapplyingElements.has(element)) {
+                    if (_this.config.debug) {
+                        (0, debug_1.logDebug)('[MUTATION-SKIP] Skipping mutation - currently reapplying', {
+                            element: element.tagName,
+                        });
+                    }
                     return;
                 }
                 var experiments = _this.watchedElements.get(element);
@@ -1023,31 +1106,37 @@ var DOMChangesPluginLite = /** @class */ (function () {
                         var now = Date.now();
                         var lastLogged = _this.reapplyLogThrottle.get(elementKey) || 0;
                         if (now - lastLogged > 5000) {
-                            (0, debug_1.logDebug)('[ABsmartly] Style mutation detected on watched element', {
+                            (0, debug_1.logDebug)('[MUTATION-ON-WATCHED] Style mutation detected on watched element', {
                                 element: element.tagName,
                                 selector: element.getAttribute('name') || element.className,
                                 oldValue: mutation.oldValue,
+                                newValue: element.getAttribute('style'),
+                                experiments: Array.from(experiments),
                             });
                             _this.reapplyLogThrottle.set(elementKey, now);
                         }
                     }
                     experiments.forEach(function (experimentName) {
-                        var appliedChanges = _this.appliedStyleChanges.get(experimentName);
+                        var appliedChanges = _this.appliedChanges.get(experimentName);
                         if (appliedChanges) {
                             appliedChanges.forEach(function (change) {
-                                var e_8, _a;
-                                if (change.type === 'style' && element.matches(change.selector)) {
+                                var e_7, _a;
+                                // Skip the .matches() check - we already know this element should have this change
+                                // because we added it to watchedElements when we applied it successfully.
+                                // The .matches() check fails for complex selectors with parent relationships (e.g., "div > p")
+                                if (change.type === 'style') {
                                     var needsReapply = _this.checkStyleOverwritten(element, change.value);
                                     if (needsReapply) {
                                         _this.reapplyingElements.add(element);
-                                        _this.domManipulator.applyChange(change, experimentName);
                                         var logKey = "".concat(experimentName, "-").concat(change.selector);
                                         var now = Date.now();
                                         var lastLogged = _this.reapplyLogThrottle.get(logKey) || 0;
                                         if (_this.config.debug && now - lastLogged > 5000) {
-                                            (0, debug_1.logDebug)('Reapplied style after mutation (React/framework conflict detected)', {
+                                            (0, debug_1.logDebug)('[REAPPLY-TRIGGERED] Reapplying style after mutation (React/framework conflict detected)', {
                                                 experimentName: experimentName,
                                                 selector: change.selector,
+                                                element: element.tagName,
+                                                timestamp: now,
                                                 note: 'This happens when the page framework (React/Vue/etc) fights with DOM changes',
                                             });
                                             _this.reapplyLogThrottle.set(logKey, now);
@@ -1062,21 +1151,22 @@ var DOMChangesPluginLite = /** @class */ (function () {
                                                         }
                                                     }
                                                 }
-                                                catch (e_8_1) { e_8 = { error: e_8_1 }; }
+                                                catch (e_7_1) { e_7 = { error: e_7_1 }; }
                                                 finally {
                                                     try {
                                                         if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
                                                     }
-                                                    finally { if (e_8) throw e_8.error; }
+                                                    finally { if (e_7) throw e_7.error; }
                                                 }
                                             }
                                         }
+                                        _this.domManipulator.applyChange(change, experimentName);
                                         setTimeout(function () {
                                             _this.reapplyingElements.delete(element);
                                         }, 0);
                                     }
                                     else if (_this.config.debug) {
-                                        (0, debug_1.logDebug)('[ABsmartly] Style mutation detected but no reapply needed', {
+                                        (0, debug_1.logDebug)('[MUTATION-NO-REAPPLY] Style mutation detected but no reapply needed', {
                                             experimentName: experimentName,
                                             selector: change.selector,
                                         });
@@ -1095,11 +1185,17 @@ var DOMChangesPluginLite = /** @class */ (function () {
             attributeOldValue: true,
         });
         if (this.config.debug) {
-            (0, debug_1.logDebug)('[ABsmartly] Style persistence observer setup complete');
+            (0, debug_1.logDebug)('[PERSISTENCE-OBSERVER] Setup complete - now observing style mutations', {
+                target: 'document.body',
+                attributeFilter: ['style'],
+                subtree: true,
+                attributeOldValue: true,
+                timestamp: Date.now(),
+            });
         }
     };
     DOMChangesPluginLite.prototype.checkStyleOverwritten = function (element, expectedStyles) {
-        var e_9, _a;
+        var e_8, _a;
         try {
             for (var _b = __values(Object.entries(expectedStyles)), _c = _b.next(); !_c.done; _c = _b.next()) {
                 var _d = __read(_c.value, 2), prop = _d[0], value = _d[1];
@@ -1111,12 +1207,12 @@ var DOMChangesPluginLite = /** @class */ (function () {
                 }
             }
         }
-        catch (e_9_1) { e_9 = { error: e_9_1 }; }
+        catch (e_8_1) { e_8 = { error: e_8_1 }; }
         finally {
             try {
                 if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
             }
-            finally { if (e_9) throw e_9.error; }
+            finally { if (e_8) throw e_8.error; }
         }
         return false;
     };