Skip to content
This repository has been archived by the owner on Feb 23, 2024. It is now read-only.

Fix All Products block refreshing on Classic Themes. #6324

Merged
merged 1 commit into from
Apr 26, 2022

Conversation

tjcafferkey
Copy link
Contributor

@tjcafferkey tjcafferkey commented Apr 26, 2022

We set is_rendering_php_template for the frontend so we can use filter blocks with PHP rendered templates and deprecate the filters widgets in favour of them for Classic Themes such as Storefront

However, filter blocks are also used to filter the All Products block which is not rendered server-side so there is no need for a page refresh here.

This PR only sets is_rendering_php_template on WooCommerce product archive pages such as the Shop page and product category pages where the products are rendered server side. This means on non-product archive pages where the All Products block may be used, we will not refresh the page when using filter blocks.

Testing

Automated Tests

  • Changes in this PR are covered by Automated Tests.
    • Unit tests
    • E2E tests

Manual Testing

How to test the changes in this Pull Request:

  1. Activate Storefront
  2. Add the All Products block to a newly created page, along with a filter block such as Filter by Attribute
  3. Visit this page on the frontend and select some attributes to filter by.
  4. Observe the filters being applied without a page refresh.

User Facing Testing

These are steps for user testing (where "user" is someone interacting with this change that is not editing any code).

  • Same as above, or
  • See steps below.

Changelog

Fixes page refresh when using filters with the All Products block on non-product archive templates for WooCommerce.

…rce product archive templates where filters are being used.
@tjcafferkey tjcafferkey added type: bug The issue/PR concerns a confirmed bug. focus: template Related to API powering block template functionality in the Site Editor labels Apr 26, 2022
@tjcafferkey tjcafferkey self-assigned this Apr 26, 2022
@rubikuserbot rubikuserbot requested a review from a team April 26, 2022 11:05
@Aljullu Aljullu added this to the 7.5.0 milestone Apr 26, 2022
@@ -64,9 +64,14 @@ public function set_filterable_product_data() {
* This method passes the value `is_rendering_php_template` to the front-end of Classic themes,
* so that widget product filter blocks are aware of how to filter the products.
*
* This data only matters on WooCommerce product archive pages.
* On non-archive pages the merchant could be using the All Products block which is not a PHP template.
*
* @return void
*/
public function set_php_template_data() {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@github-actions
Copy link
Contributor

Size Change: 0 B

Total Size: 869 kB

ℹ️ View Unchanged
Filename Size
build/active-filters-frontend.js 6.56 kB
build/active-filters.js 7.25 kB
build/all-products-frontend.js 18.1 kB
build/all-products.js 33.4 kB
build/all-reviews.js 7.78 kB
build/attribute-filter-frontend.js 17.7 kB
build/attribute-filter.js 13.5 kB
build/blocks-checkout.js 17.4 kB
build/cart-blocks/cart-accepted-payment-methods-frontend.js 1.16 kB
build/cart-blocks/cart-express-payment-frontend.js 5.24 kB
build/cart-blocks/cart-items-frontend.js 299 B
build/cart-blocks/cart-line-items--mini-cart-contents-block/products-table-frontend.js 5.27 kB
build/cart-blocks/cart-line-items-frontend.js 433 B
build/cart-blocks/cart-order-summary-frontend.js 1.1 kB
build/cart-blocks/cart-totals-frontend.js 322 B
build/cart-blocks/empty-cart-frontend.js 346 B
build/cart-blocks/filled-cart-frontend.js 783 B
build/cart-blocks/order-summary-coupon-form-frontend.js 2.81 kB
build/cart-blocks/order-summary-discount-frontend.js 2.31 kB
build/cart-blocks/order-summary-fee-frontend.js 273 B
build/cart-blocks/order-summary-heading-frontend.js 454 B
build/cart-blocks/order-summary-shipping--checkout-blocks/order-summary-shipping-frontend.js 6.34 kB
build/cart-blocks/order-summary-shipping-frontend.js 428 B
build/cart-blocks/order-summary-subtotal-frontend.js 273 B
build/cart-blocks/order-summary-taxes-frontend.js 434 B
build/cart-blocks/proceed-to-checkout-frontend.js 1.16 kB
build/cart-frontend.js 45.5 kB
build/cart.js 44.3 kB
build/checkout-blocks/actions-frontend.js 1.41 kB
build/checkout-blocks/billing-address--checkout-blocks/shipping-address-frontend.js 4.12 kB
build/checkout-blocks/billing-address-frontend.js 892 B
build/checkout-blocks/contact-information-frontend.js 2.83 kB
build/checkout-blocks/express-payment-frontend.js 5.53 kB
build/checkout-blocks/fields-frontend.js 345 B
build/checkout-blocks/order-note-frontend.js 1.07 kB
build/checkout-blocks/order-summary-cart-items-frontend.js 3.67 kB
build/checkout-blocks/order-summary-coupon-form-frontend.js 2.96 kB
build/checkout-blocks/order-summary-discount-frontend.js 2.43 kB
build/checkout-blocks/order-summary-fee-frontend.js 275 B
build/checkout-blocks/order-summary-frontend.js 1.11 kB
build/checkout-blocks/order-summary-shipping-frontend.js 603 B
build/checkout-blocks/order-summary-subtotal-frontend.js 273 B
build/checkout-blocks/order-summary-taxes-frontend.js 433 B
build/checkout-blocks/payment-frontend.js 7.84 kB
build/checkout-blocks/shipping-address-frontend.js 997 B
build/checkout-blocks/shipping-methods-frontend.js 4.71 kB
build/checkout-blocks/terms-frontend.js 1.22 kB
build/checkout-blocks/totals-frontend.js 326 B
build/checkout-frontend.js 47.7 kB
build/checkout.js 45.6 kB
build/featured-category.js 12.1 kB
build/featured-product.js 10.6 kB
build/handpicked-products.js 7.11 kB
build/legacy-template.js 2.19 kB
build/mini-cart-component-frontend.js 16.6 kB
build/mini-cart-contents-block/empty-cart-frontend.js 328 B
build/mini-cart-contents-block/filled-cart-frontend.js 230 B
build/mini-cart-contents-block/footer--mini-cart-contents-block/products-table-frontend.js 4.69 kB
build/mini-cart-contents-block/footer-frontend.js 5.63 kB
build/mini-cart-contents-block/items-frontend.js 225 B
build/mini-cart-contents-block/products-table-frontend.js 289 B
build/mini-cart-contents-block/shopping-button-frontend.js 287 B
build/mini-cart-contents-block/title-frontend.js 366 B
build/mini-cart-contents.js 22.7 kB
build/mini-cart-frontend.js 1.72 kB
build/mini-cart.js 6.09 kB
build/price-filter-frontend.js 12.4 kB
build/price-filter.js 8.49 kB
build/price-format.js 1.19 kB
build/product-add-to-cart--product-button--product-category-list--product-image--product-price--product-r--a0326d00.js 223 B
build/product-add-to-cart--product-button--product-image--product-title.js 2.65 kB
build/product-add-to-cart--product-button.js 564 B
build/product-add-to-cart-frontend.js 6.96 kB
build/product-add-to-cart.js 6.64 kB
build/product-best-sellers.js 7.38 kB
build/product-button--product-category-list--product-image--product-price--product-rating--product-sale-b--e17c7c01.js 500 B
build/product-button-frontend.js 1.84 kB
build/product-button.js 1.08 kB
build/product-categories.js 2.78 kB
build/product-category-list-frontend.js 925 B
build/product-category-list.js 501 B
build/product-category.js 8.49 kB
build/product-image-frontend.js 1.84 kB
build/product-image.js 1.07 kB
build/product-new.js 7.68 kB
build/product-on-sale.js 7.99 kB
build/product-price-frontend.js 1.94 kB
build/product-price.js 1.5 kB
build/product-rating-frontend.js 1.15 kB
build/product-rating.js 731 B
build/product-sale-badge-frontend.js 1.09 kB
build/product-sale-badge.js 680 B
build/product-search.js 2.18 kB
build/product-sku-frontend.js 380 B
build/product-sku.js 382 B
build/product-stock-indicator-frontend.js 1.03 kB
build/product-stock-indicator.js 620 B
build/product-summary-frontend.js 1.33 kB
build/product-summary.js 919 B
build/product-tag-list-frontend.js 920 B
build/product-tag-list.js 497 B
build/product-tag.js 7.81 kB
build/product-title-frontend.js 1.3 kB
build/product-title.js 909 B
build/product-top-rated.js 7.91 kB
build/products-by-attribute.js 8.39 kB
build/reviews-by-category.js 11.2 kB
build/reviews-by-product.js 12.2 kB
build/reviews-frontend.js 7 kB
build/single-product-frontend.js 21.5 kB
build/single-product.js 10 kB
build/stock-filter-frontend.js 6.85 kB
build/stock-filter.js 6.91 kB
build/vendors--cart-blocks/cart-line-items--cart-blocks/cart-order-summary--cart-blocks/order-summary-shi--c02aad66-frontend.js 5.26 kB
build/vendors--cart-blocks/cart-line-items--checkout-blocks/order-summary-cart-items--mini-cart-contents---233ab542-frontend.js 3.14 kB
build/vendors--cart-blocks/order-summary-shipping--checkout-blocks/billing-address--checkout-blocks/order--5b8feb0b-frontend.js 4.75 kB
build/vendors--cart-blocks/order-summary-shipping--checkout-blocks/billing-address--checkout-blocks/order--decc3dc6-frontend.js 20.5 kB
build/vendors--mini-cart-contents-block/footer-frontend.js 6.86 kB
build/vendors--product-add-to-cart-frontend.js 7.53 kB
build/wc-blocks-data.js 9.87 kB
build/wc-blocks-editor-style-rtl.css 4.92 kB
build/wc-blocks-editor-style.css 4.92 kB
build/wc-blocks-google-analytics.js 1.56 kB
build/wc-blocks-middleware.js 930 B
build/wc-blocks-registry.js 2.7 kB
build/wc-blocks-shared-context.js 1.52 kB
build/wc-blocks-shared-hocs.js 1.14 kB
build/wc-blocks-style-rtl.css 22 kB
build/wc-blocks-style.css 22 kB
build/wc-blocks-vendors-style-rtl.css 1.28 kB
build/wc-blocks-vendors-style.css 1.28 kB
build/wc-blocks-vendors.js 71.4 kB
build/wc-blocks.js 2.63 kB
build/wc-payment-method-bacs.js 816 B
build/wc-payment-method-cheque.js 811 B
build/wc-payment-method-cod.js 909 B
build/wc-payment-method-paypal.js 837 B
build/wc-settings.js 2.61 kB

compressed-size-action

Copy link
Contributor

@Aljullu Aljullu left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

I just wonder if we should add testing steps for future reference.

@tjcafferkey
Copy link
Contributor Author

Failing E2E tests are unrelated. Merging anyway.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
focus: template Related to API powering block template functionality in the Site Editor type: bug The issue/PR concerns a confirmed bug.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants