Commit fcb754a60b for woocommerce
commit fcb754a60b11be3e067ecdb7271fc98d904356f0
Author: Karol Manijak <20098064+kmanijak@users.noreply.github.com>
Date: Thu Apr 17 09:45:18 2025 +0200
Product Gallery: hide next/prev buttons on mobile (#57277)
* Simplify the SCSS
* Hide Next/prev buttons on mobile
* Add test
* Add changelog
* Add $email_object parameter to woocommerce_email_preview_placeholders filter (#57272)
* Add $email_object parameter to woocommerce_email_preview_placeholders filter for enhanced email preview functionality
* Update docblocks for get_placeholders method to clarify $email_object parameter type
Technically, WC Core emails only use WC_Order or WP_User, but an extension can register email with any object, in which case, the type hint can be misleading.
* Add @since for a newly added parameter
---------
Co-authored-by: Ján Mikláš <neosinner@gmail.com>
* Fix E2E tests after WP 6.8 release (#57320)
* Fix Accordion E2E tests after WP 6.8 release
* Add changelog
* Fix Checkout -> Attributes -> Shipping and billing addresses › Apartment input visibility and optional and required can be toggled
* [Checkout] Local Pickup rates should be available regardless of shipping restrictions (#56922)
* Update error strings for consistency
* Calculate local pickup rates for all locations
* Utils to assist with packages
* Skip country validation if collectng
* Missing local pickup ids in order class
* Widen countries display in checkout to include possible billing and shipping countries
* changelog
* Revert text change to reduce diff
* Revert tweak to reduce diff size
* Reduce diff size by using old structure
* Change validation order to reduce diff size
* Remove extra escaping to reduce diff size
* Fix indenting
* Add helper for array_all
* Use array_all helper
* Add test coverage for flows involving local pickup
* Validate allowed countries in client
* Unused variable
* undo text change to reduce diff
* Leave restrictions in place for classic checkout
* Move util
* Update tests to use pickup location shipping method
* validate_addresses escaping
* Missing docblock
* Enhance IP address retrieval in WC_Geolocation to handle multiple IPs in REMOTE_ADDR (#57284)
* Enhance IP address retrieval in WC_Geolocation to handle multiple IPs in REMOTE_ADDR. Update unit tests to verify correct IP extraction from comma-separated values.
* Add changefile(s) from automation for the following project(s): woocommerce
---------
Co-authored-by: github-actions <github-actions@github.com>
* [Additional Fields] Additional Information Step should be hidden if empty (#57041)
* Fix eslint warnings in IDE
* Export useFormFields
* Update Form so its passed fields from the parent
* TS updates
* Simplify address wrapper usage
* Update AddressWrapper usage
* Prevent interaction in editor with additional fields
* Hide addiitonal fields if fields are empty
* Undo form changes
* changelog
* Fix flaky shipping and billing e2e tests (#57326)
* Add expect().toPass() to checking and unchecking radio buttons as it's flaky
* Add changelog
* registerProductBlockType: Re-enable the test for block visibility after addressing flakiness (#57325)
* registerProductBlockType: Re-enable the test for block visibility after addressing flakiness
* Add changefile(s) from automation for the following project(s): woocommerce
---------
Co-authored-by: github-actions <github-actions@github.com>
* Add blueprint CLI initialization to 'init' hook to prevent premature translation loading in WC_CLI class (#57291)
* Add blueprint CLI initialization to 'init' hook to prevent premature translation loading in WC_CLI class
* Add changefile(s) from automation for the following project(s): woocommerce
---------
Co-authored-by: github-actions <github-actions@github.com>
* fix: Add loaded state to hand picked control (#57300)
Co-authored-by: Seghir Nadir <nadir.seghir@gmail.com>
Co-authored-by: Luigi Teschio <gigitux@gmail.com>
* Allow Password Reset for Users that are not members of the current blog of Multisite Network (#57242)
* Prevent possible fatal in 9.9 update routine (#57257)
* Prevent possible fatal in 9.9 update routine
* Add changelog
* Update Product Stock Indicator block description to explain empty state behavior (#57304)
* feat: Update description for Product Stock Indicator block to clarify functionality
* feat: Add changelog file
* Product Gallery: improve UI for Next/Prev buttons (#57135)
* Enable supports in arrows
* Provide basic supports
* Simplify the arrows structure
* Align the frontend with editor
* Add some basic styling
* Fix lint
* Fix lint
* Update icons and align them correctly
* Improve classnames and styling
* Apply changes on the frontend
* Add supports styles in editor
* Support colors in editor
* Simplify the arrows structure even more
* Change sprintf to ob_clean
* Fix styles
* Add support for shadow
* Add shadow support in StyleAttributesUtils
* Fix lint
* Change the disabled arrow opacity from 20% to 35%
* Add changelog
* Update selectors in tests
* Remove unnecessary z-index
* Fix the editor util for getting next/prev button
* Replace str_contains with strpos for PHP 7 support
---------
Co-authored-by: Oluwaseun Olorunsola <30554163+triple0t@users.noreply.github.com>
Co-authored-by: Ján Mikláš <neosinner@gmail.com>
Co-authored-by: Mike Jolley <mike.jolley@me.com>
Co-authored-by: Luigi Teschio <gigitux@gmail.com>
Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Ahmar Zaidi <71930390+AhmarZaidi@users.noreply.github.com>
Co-authored-by: Seghir Nadir <nadir.seghir@gmail.com>
Co-authored-by: Martin Neumann <75806177+martin-neumann-gurus@users.noreply.github.com>
Co-authored-by: Jorge A. Torres <jorge.torres@automattic.com>
Co-authored-by: Amit Raj <77401999+amitraj2203@users.noreply.github.com>
diff --git a/plugins/woocommerce/changelog/wooplug-3794-product-gallery-hide-nextprev-buttons-on-mobile b/plugins/woocommerce/changelog/wooplug-3794-product-gallery-hide-nextprev-buttons-on-mobile
new file mode 100644
index 0000000000..23b2ebec9f
--- /dev/null
+++ b/plugins/woocommerce/changelog/wooplug-3794-product-gallery-hide-nextprev-buttons-on-mobile
@@ -0,0 +1,4 @@
+Significance: minor
+Type: update
+
+Product Gallery: hide Next/Prev buttons on mobile
diff --git a/plugins/woocommerce/client/blocks/assets/js/blocks/product-gallery/style.scss b/plugins/woocommerce/client/blocks/assets/js/blocks/product-gallery/style.scss
index 0c7859fb0e..d304cc9566 100644
--- a/plugins/woocommerce/client/blocks/assets/js/blocks/product-gallery/style.scss
+++ b/plugins/woocommerce/client/blocks/assets/js/blocks/product-gallery/style.scss
@@ -316,6 +316,7 @@ body.wc-block-product-gallery-dialog-open {
// On mobile devices (<600px):
// - Product gallery groups are stacked vertically
// - Thumbnails appear below the main gallery image and are arranged horizontally in a row
+// - Next/Previous buttons are hidden
@include breakpoint("<600px") {
.wc-block-product-gallery {
@include horizontal-thumbnails;
@@ -324,11 +325,12 @@ body.wc-block-product-gallery-dialog-open {
flex-direction: column;
}
- .wc-block-product-gallery-thumbnails {
- order: 1;
+ .wc-block-product-gallery-large-image-next-previous {
+ display: none;
}
.wc-block-product-gallery-thumbnails {
+ order: 1;
width: 100%;
height: 20%;
aspect-ratio: 5 / 1 !important;
diff --git a/plugins/woocommerce/client/blocks/tests/e2e/tests/product-gallery/inner-blocks/product-gallery-large-image-next-previous/product-gallery-large-image-next-previous.block_theme.spec.ts b/plugins/woocommerce/client/blocks/tests/e2e/tests/product-gallery/inner-blocks/product-gallery-large-image-next-previous/product-gallery-large-image-next-previous.block_theme.spec.ts
index 5b9cd39ad3..4ec5f214d7 100644
--- a/plugins/woocommerce/client/blocks/tests/e2e/tests/product-gallery/inner-blocks/product-gallery-large-image-next-previous/product-gallery-large-image-next-previous.block_theme.spec.ts
+++ b/plugins/woocommerce/client/blocks/tests/e2e/tests/product-gallery/inner-blocks/product-gallery-large-image-next-previous/product-gallery-large-image-next-previous.block_theme.spec.ts
@@ -119,6 +119,32 @@ test.describe( `${ blockData.name }`, () => {
await expect( block ).toBeVisible();
} );
+ test( 'Next/Previous Button block is hidden on mobile', async ( {
+ admin,
+ editor,
+ page,
+ pageObject,
+ } ) => {
+ await addBlock( admin, editor );
+
+ await editor.saveSiteEditorEntities( {
+ isOnlyCurrentEntityDirty: true,
+ } );
+
+ await page.goto( blockData.productPage );
+
+ await page.setViewportSize( {
+ height: 667,
+ width: 390, // iPhone 12 Pro
+ } );
+
+ const block = await pageObject.getNextPreviousButtonsBlock( {
+ page: 'frontend',
+ } );
+
+ await expect( block ).toBeHidden();
+ } );
+
test.describe( `${ blockData.name } Settings`, () => {
test( 'Show button inside of the image', async ( {
page,