I’ve developed this Mutation Observer to watch adjustments in a Shopify cart drawer. The logic is sort of easy:
perform callback(mutationList) {
console.log("Observer callback fired");
for (const mutation of mutationList) {
if (mutation.kind === "childList") {
var cartDrawerBody = doc.querySelector("div.cart-drawer__body");
if (cartDrawerBody) {
var kids = cartDrawerBody.querySelectorAll(".cart-item__container").size;
if (kids > 0) {
observer.disconnect(); // Disconnect the observer to forestall loop
adjustPadding();
var cartDrawerFooter = doc.querySelector(".cart-drawer__footer");
if (!cartDrawerFooter) {
console.log("No footer discovered");
return;
}
if (!$(cartDrawerFooter).discover(".post-footer-content").size) {
var postFooterContent = $(`
<div class="post-footer-content">
<!-- Simplified content material -->
<div class="post-footer-row">Content material</div>
</div>
`);
$(cartDrawerFooter).append(postFooterContent);
console.log("Content material appended to footer");
} else {
console.log("Content material already exists in footer, not appending");
}
observer.observe(doc.querySelector("#cd-cart"), {
attributes: true,
childList: true,
subtree: true,
characterData: true,
});
} else {
console.log("no kids to append");
}
} else {
console.log("no physique");
}
}
}
}
var observer = new MutationObserver(callback);
observer.observe(cartDrawer, {
attributes: true,
childList: true,
subtree: true,
characterData: true,
});
Nevertheless, no mutation is being triggered on iOS gadgets, in every single place else it really works completely, together with Safari Desktop and Android gadgets.
Has anybody encountered the same difficulty or has any concept why this is likely to be occurring? Any assist can be enormously appreciated!
Thanks!
Than you!