Commit 5ef945a613d for woocommerce

commit 5ef945a613dabc0cbb9530224c163a5a7a0d7d21
Author: Karol Manijak <20098064+kmanijak@users.noreply.github.com>
Date:   Fri Jul 17 11:26:59 2026 +0200

    Fix product gallery swipes in in-app browsers (#66602)

    * Fix product gallery gestures in embedded browsers

    * Add changelog entry for gallery gesture fix

    * Fix Product Gallery touch gesture reliability

    * Revert Product Gallery gesture handling changes

    * Update changelog entry for classic gallery fix

    * Restore Product Gallery gesture handling fixes

    * Update changelog entry for both gallery types

    * Remove Product Gallery gesture handling changes

    * Update changelog entry for classic gallery fix

    * Fix gallery touch styles for default themes

diff --git a/plugins/woocommerce/changelog/fix-facebook-webview-gallery-gestures b/plugins/woocommerce/changelog/fix-facebook-webview-gallery-gestures
new file mode 100644
index 00000000000..308fa1f5bf9
--- /dev/null
+++ b/plugins/woocommerce/changelog/fix-facebook-webview-gallery-gestures
@@ -0,0 +1,4 @@
+Significance: patch
+Type: fix
+
+Prevent classic product image gallery swipes from closing the Facebook in-app browser.
diff --git a/plugins/woocommerce/client/legacy/css/woocommerce-layout.scss b/plugins/woocommerce/client/legacy/css/woocommerce-layout.scss
index 0012fcdfe0e..7d6cbadf93a 100644
--- a/plugins/woocommerce/client/legacy/css/woocommerce-layout.scss
+++ b/plugins/woocommerce/client/legacy/css/woocommerce-layout.scss
@@ -57,6 +57,10 @@
 		div.images {
 			float: left;
 			width: 48%;
+
+			&.woocommerce-product-gallery .flex-viewport {
+				touch-action: pan-y pinch-zoom;
+			}
 		}

 		div.thumbnails {
diff --git a/plugins/woocommerce/client/legacy/js/flexslider/jquery.flexslider.js b/plugins/woocommerce/client/legacy/js/flexslider/jquery.flexslider.js
index 543531b4968..1921304cd38 100755
--- a/plugins/woocommerce/client/legacy/js/flexslider/jquery.flexslider.js
+++ b/plugins/woocommerce/client/legacy/js/flexslider/jquery.flexslider.js
@@ -455,6 +455,7 @@
           onTouchStart,
           onTouchMove,
           onTouchEnd,
+          touchListenerOptions = { capture: true, passive: false },
           scrolling = false,
           localX = 0,
           localY = 0,
@@ -481,8 +482,8 @@
                          (reverse) ? (slider.last - slider.currentSlide + slider.cloneOffset) * cwidth : (slider.currentSlide + slider.cloneOffset) * cwidth;
                 startX = (vertical) ? localY : localX;
                 startY = (vertical) ? localX : localY;
-                el.addEventListener('touchmove', onTouchMove, false);
-                el.addEventListener('touchend', onTouchEnd, false);
+                el.addEventListener('touchmove', onTouchMove, touchListenerOptions);
+                el.addEventListener('touchend', onTouchEnd, touchListenerOptions);
               }
             };

@@ -509,7 +510,7 @@

             onTouchEnd = function(e) {
               // finish the touch by undoing the touch session
-              el.removeEventListener('touchmove', onTouchMove, false);
+              el.removeEventListener('touchmove', onTouchMove, touchListenerOptions);

               if (slider.animatingTo === slider.currentSlide && !scrolling && !(dx === null)) {
                 var updateDx = (reverse) ? -dx : dx,
@@ -521,7 +522,7 @@
                   if (!fade) { slider.flexAnimate(slider.currentSlide, slider.vars.pauseOnAction, true); }
                 }
               }
-              el.removeEventListener('touchend', onTouchEnd, false);
+              el.removeEventListener('touchend', onTouchEnd, touchListenerOptions);

               startX = null;
               startY = null;
@@ -529,7 +530,11 @@
               offset = null;
             };

-            el.addEventListener('touchstart', onTouchStart, false);
+            // Register before a gesture starts so embedded WebViews keep touchmove events cancelable.
+            el.addEventListener('touchmove', function() {
+              // Intentionally empty.
+            }, touchListenerOptions);
+            el.addEventListener('touchstart', onTouchStart, touchListenerOptions);
       },
       resize: function() {
         if (!slider.animating && slider.is(':visible')) {