Hi team,
I’ve found a bug in the quickShopVariationForm.js script that causes subscription option wrappers to stack and duplicate when switching between product variations on the shop/archive page.
**Setup:** Variable products with subscription plans enabled via “WooCommerce All Products for Subscriptions” (WCSATT) plugin v6.1.0, Woodmart 8.4.1.
**How to reproduce:**
1. Go to the shop page where variable products with swatches and subscription plans are displayed.
2. Click on the first variation swatch (e.g., “1 Box”) — the subscription options appear correctly.
3. Click on the second variation (e.g., “2 Boxes”) — a NEW subscription block is added but the previous one remains visible.
4. Click on the third variation — a third block is added. The product card keeps growing with duplicate subscription sections.
**Expected:** Switching variations should show only the subscription details for the currently selected variation.
**Root cause:** In quickShopVariationForm.js, the found_variation handler does $price.replaceWith(variation.price_html). The problem is that variation.price_html contains both the <span class="price"> AND a <div class="wcsatt-options-wrapper"> element. The replaceWith only replaces the .price span, but the .wcsatt-options-wrapper div that was inserted by the previous variation change remains in the DOM as a sibling. Each variation switch adds another wrapper without removing the old ones.
**Fix:** Add $price.siblings('.wcsatt-options-wrapper').remove() before the replaceWith call in both the found_variation and hide_variation handlers. This removes stale subscription wrappers before inserting the new price HTML.
I’ve attached a detailed technical report (MD file) with the exact code changes, DOM structure analysis, and a child theme workaround.
Thank you