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

Fix broken post/page editor screens in WordPress versions earlier than 6.2 #9090

Merged
merged 2 commits into from
Apr 19, 2023

Conversation

nerrad
Copy link
Contributor

@nerrad nerrad commented Apr 19, 2023

🤖 Generated by Copilot at 656de50

Improve block registration performance and reliability in registerBlockSingleProductTemplate. Use a local cache to prevent duplicate calls to registerBlockType and registerBlockVariation for single product blocks. This also prevents an infinite loop.

This fixes an issue that surfaced where the WordPress core post (or page) editor was broken with WooCommerce Blocks active.

Explanation of Changes

WordPress 6.2 introduces an update to the subscribe function returned by registered wp.data stores that enables passing along as an (optional) second argument the specific store that the subscribe callback should be registered to. On previous versions of WordPress, this second argument is ignored (there is no handling) which means the subscribe callback will be registered and invoked on every store change.

Where this is problematic is when the core/blocks store is updated which typically happens when registering a block or a variation. So the existing checks in this callback were insufficient for preventing an infinite loop from happening.

Edit by @tjcafferkey: In addition to the above, it looks like the store method getEditedPostContext is also not present in 6.1.1 (presumably also introduced in 6.2) resulting in a crashing Site Editor. This was replaced with getEditedPostId similar to how the Classic Template block retrieves the template Id.

Accessibility

Other Checks

  • This PR adds/removes a feature flag & I've updated this doc.
  • This PR adds/removes an experimental interfaces and I've updated this doc.
  • I tagged two reviewers because this PR makes queries to the database or I think it might have some security impact.

Testing

Automated Tests

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

User Facing Testing

Note to reviewer: Please assist with these testing notes to verify that the single product block (and inner blocks) are registered correctly and work as expected. Expand user testing notes below as necessary.

Experimental testing:

  1. Make sure your environment is WordPress 6.1.1
  2. Ensure with this branch, the Post, Page and Site editors load without issues.
  3. Verify that Single Product Block behaviour works as expected.

WC core/feature plugin testing:

  1. Make sure your environment is WordPress 6.1.1
  2. Ensure the Post, Page and Site editors load without issues.
  3. Go to Appearance > Editor > Templates > Single Product and add the Product Image Gallery block somewhere on the page.
  4. Without reloading the page, edit the Single template (or any other template unrelated to WooCommerce). Verify you can't add the Product Image Gallery block.
  • Do not include in the Testing Notes

WooCommerce Visibility

  • WooCommerce Core
  • Feature plugin
  • Experimental

Performance Impact

Changelog

Fix infinite loop with the registration of Single Product Block (and inner blocks) breaking WP Post and Page editors in WP 6.1.

@github-actions
Copy link
Contributor

github-actions bot commented Apr 19, 2023

The release ZIP for this PR is accessible via:

https://wcblocks.wpcomstaging.com/wp-content/uploads/woocommerce-gutenberg-products-block-9090.zip

Script Dependencies Report

There is no changed script dependency between this branch and trunk.

This comment was automatically generated by the ./github/compare-assets action.

TypeScript Errors Report

  • Files with errors: 452
  • Total errors: 2213

🎉 🎉 This PR does not introduce new TS errors.

comments-aggregator

@github-actions
Copy link
Contributor

github-actions bot commented Apr 19, 2023

Size Change: +29 B (0%)

Total Size: 1.11 MB

Filename Size Change
build/all-products.js 38.5 kB +14 B (0%)
build/product-query.js 11.3 kB +15 B (0%)
ℹ️ View Unchanged
Filename Size
build/active-filters-frontend.js 7.99 kB
build/active-filters-wrapper-frontend.js 5.97 kB
build/active-filters.js 7.49 kB
build/all-products-frontend.js 11.8 kB
build/all-reviews.js 7.65 kB
build/attribute-filter-frontend.js 22.4 kB
build/attribute-filter-wrapper-frontend.js 7.07 kB
build/attribute-filter.js 13.2 kB
build/blocks-checkout.js 35.1 kB
build/breadcrumbs.js 2.05 kB
build/cart-blocks/cart-accepted-payment-methods-frontend.js 1.38 kB
build/cart-blocks/cart-cross-sells-frontend.js 253 B
build/cart-blocks/cart-cross-sells-products-frontend.js 9.82 kB
build/cart-blocks/cart-express-payment--checkout-blocks/express-payment-frontend.js 5.16 kB
build/cart-blocks/cart-express-payment-frontend.js 719 B
build/cart-blocks/cart-items-frontend.js 301 B
build/cart-blocks/cart-line-items--mini-cart-contents-block/products-table-frontend.js 5.4 kB
build/cart-blocks/cart-line-items-frontend.js 1.06 kB
build/cart-blocks/cart-order-summary-frontend.js 1.27 kB
build/cart-blocks/cart-totals-frontend.js 308 B
build/cart-blocks/empty-cart-frontend.js 345 B
build/cart-blocks/filled-cart-frontend.js 657 B
build/cart-blocks/order-summary-coupon-form-frontend.js 1.62 kB
build/cart-blocks/order-summary-discount-frontend.js 2.12 kB
build/cart-blocks/order-summary-fee-frontend.js 272 B
build/cart-blocks/order-summary-heading-frontend.js 456 B
build/cart-blocks/order-summary-shipping-frontend.js 11.8 kB
build/cart-blocks/order-summary-subtotal-frontend.js 273 B
build/cart-blocks/order-summary-taxes-frontend.js 432 B
build/cart-blocks/proceed-to-checkout-frontend.js 1.33 kB
build/cart-frontend.js 29.3 kB
build/cart.js 48.7 kB
build/catalog-sorting.js 1.7 kB
build/checkout-blocks/actions-frontend.js 1.85 kB
build/checkout-blocks/billing-address-frontend.js 4.19 kB
build/checkout-blocks/contact-information-frontend.js 2.05 kB
build/checkout-blocks/express-payment-frontend.js 1.13 kB
build/checkout-blocks/fields-frontend.js 331 B
build/checkout-blocks/order-note-frontend.js 1.13 kB
build/checkout-blocks/order-summary-cart-items-frontend.js 3.71 kB
build/checkout-blocks/order-summary-coupon-form-frontend.js 1.79 kB
build/checkout-blocks/order-summary-discount-frontend.js 2.29 kB
build/checkout-blocks/order-summary-fee-frontend.js 275 B
build/checkout-blocks/order-summary-frontend.js 1.27 kB
build/checkout-blocks/order-summary-shipping-frontend.js 11.8 kB
build/checkout-blocks/order-summary-subtotal-frontend.js 273 B
build/checkout-blocks/order-summary-taxes-frontend.js 431 B
build/checkout-blocks/payment-frontend.js 8.27 kB
build/checkout-blocks/pickup-options-frontend.js 4.14 kB
build/checkout-blocks/shipping-address-frontend.js 4.14 kB
build/checkout-blocks/shipping-method-frontend.js 2.63 kB
build/checkout-blocks/shipping-methods-frontend.js 5.83 kB
build/checkout-blocks/terms-frontend.js 1.56 kB
build/checkout-blocks/totals-frontend.js 311 B
build/checkout-frontend.js 30.9 kB
build/checkout.js 46.4 kB
build/customer-account.js 3.17 kB
build/featured-category.js 14.1 kB
build/featured-product.js 14.3 kB
build/filter-wrapper-frontend.js 14 kB
build/filter-wrapper.js 2.39 kB
build/general-style-rtl.css 1.31 kB
build/general-style.css 1.31 kB
build/handpicked-products.js 7.92 kB
build/legacy-template.js 5.63 kB
build/mini-cart-component-frontend.js 29.2 kB
build/mini-cart-contents-block/cart-button-frontend.js 867 B
build/mini-cart-contents-block/checkout-button-frontend.js 870 B
build/mini-cart-contents-block/empty-cart-frontend.js 361 B
build/mini-cart-contents-block/filled-cart-frontend.js 268 B
build/mini-cart-contents-block/footer-frontend.js 3.2 kB
build/mini-cart-contents-block/items-frontend.js 237 B
build/mini-cart-contents-block/products-table-frontend.js 588 B
build/mini-cart-contents-block/shopping-button-frontend.js 760 B
build/mini-cart-contents-block/title-frontend.js 1.09 kB
build/mini-cart-contents-block/title-items-counter-frontend.js 733 B
build/mini-cart-contents-block/title-label-frontend.js 660 B
build/mini-cart-contents.js 17.8 kB
build/mini-cart-frontend.js 2.02 kB
build/mini-cart.js 4.49 kB
build/price-filter-frontend.js 13.9 kB
build/price-filter-wrapper-frontend.js 7.04 kB
build/price-filter.js 8.46 kB
build/price-format.js 1.19 kB
build/product-add-to-cart--product-button--product-image--product-price--product-rating--product-sale-bad--49d3ecb2.js 253 B
build/product-add-to-cart--product-button--product-image--product-rating--product-title.js 151 B
build/product-add-to-cart-frontend.js 6.43 kB
build/product-add-to-cart.js 8.8 kB
build/product-best-sellers.js 8.26 kB
build/product-button--product-image--product-price--product-rating--product-sale-badge--product-sku--prod--408017d2.js 262 B
build/product-button--product-image--product-price--product-rating--product-sale-badge--product-sku--prod--5bce0384.js 464 B
build/product-button-frontend.js 1.92 kB
build/product-button.js 4.17 kB
build/product-categories.js 2.37 kB
build/product-category.js 9.25 kB
build/product-image-frontend.js 1.84 kB
build/product-image.js 4.3 kB
build/product-new.js 8.26 kB
build/product-on-sale.js 8.58 kB
build/product-price-frontend.js 2.12 kB
build/product-price.js 1.67 kB
build/product-rating-frontend.js 1.33 kB
build/product-rating.js 920 B
build/product-results-count.js 1.66 kB
build/product-sale-badge-frontend.js 976 B
build/product-sale-badge.js 800 B
build/product-search.js 2.63 kB
build/product-sku-frontend.js 1 kB
build/product-sku.js 578 B
build/product-stock-indicator-frontend.js 1.19 kB
build/product-stock-indicator.js 770 B
build/product-summary-frontend.js 1.29 kB
build/product-summary.js 923 B
build/product-tag.js 8.74 kB
build/product-title-frontend.js 1.37 kB
build/product-title.js 3.73 kB
build/product-top-rated.js 8.49 kB
build/products-by-attribute.js 9.59 kB
build/rating-filter-frontend.js 20.8 kB
build/rating-filter-wrapper-frontend.js 5.59 kB
build/rating-filter.js 6.99 kB
build/reviews-by-category.js 11.9 kB
build/reviews-by-product.js 13 kB
build/reviews-frontend.js 7.1 kB
build/single-product.js 11 kB
build/stock-filter-frontend.js 21.1 kB
build/stock-filter-wrapper-frontend.js 5.83 kB
build/stock-filter.js 7.7 kB
build/store-notices.js 1.69 kB
build/vendors--attribute-filter-wrapper--cart-blocks/cart-cross-sells-products--cart-blocks/order-summary--82e4ed06-frontend.js 6.82 kB
build/vendors--attribute-filter-wrapper--rating-filter-wrapper--stock-filter-wrapper-frontend.js 7.7 kB
build/vendors--cart-blocks/cart-cross-sells-products--cart-blocks/cart-line-items--cart-blocks/cart-order--3c5fe802-frontend.js 5.26 kB
build/vendors--cart-blocks/cart-cross-sells-products--cart-blocks/order-summary-shipping--checkout-blocks--18f9376a-frontend.js 19.1 kB
build/vendors--cart-blocks/cart-cross-sells-products--product-add-to-cart-frontend.js 7.25 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/order-summary-shipping--checkout-block--24d3fc0c-frontend.js 8.25 kB
build/vendors--checkout-blocks/billing-address--checkout-blocks/shipping-address-frontend.js 5.45 kB
build/vendors--checkout-blocks/shipping-method-frontend.js 12 kB
build/wc-blocks-data.js 21.8 kB
build/wc-blocks-editor-style-rtl.css 5.87 kB
build/wc-blocks-editor-style.css 5.87 kB
build/wc-blocks-google-analytics.js 1.56 kB
build/wc-blocks-middleware.js 933 B
build/wc-blocks-registry.js 3.15 kB
build/wc-blocks-shared-context.js 1.52 kB
build/wc-blocks-shared-hocs.js 1.73 kB
build/wc-blocks-style-rtl.css 27.6 kB
build/wc-blocks-style.css 27.6 kB
build/wc-blocks-vendors-style-rtl.css 1.96 kB
build/wc-blocks-vendors-style.css 1.96 kB
build/wc-blocks-vendors.js 62.8 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.6 kB
build/wc-shipping-method-pickup-location.js 29.9 kB
build/woo-directives-runtime.js 2.73 kB
build/woo-directives-vendors.js 7.91 kB

compressed-size-action

@nerrad nerrad added type: bug The issue/PR concerns a confirmed bug. block: single product Issues related to the single product block. priority: critical The issue is critical—e.g. a fatal error, security problem affecting many customers. labels Apr 19, 2023
@nerrad nerrad requested a review from tjcafferkey April 19, 2023 02:11
@nerrad
Copy link
Contributor Author

nerrad commented Apr 19, 2023

Note As a followup, the previous subscribe callback in the same file should also implement something similar as a local cache. The same potential for infinite looping can does happen there on earlier WP versions.

…plateId from the Site Editor for 6.1.1 compatibility
@tjcafferkey tjcafferkey self-assigned this Apr 19, 2023
@tjcafferkey tjcafferkey requested a review from a team April 19, 2023 03:03
@tjcafferkey
Copy link
Contributor

tjcafferkey commented Apr 19, 2023

Note As a followup, the previous subscribe callback in the same file should also implement something similar as a local cache. The same potential for infinite looping can does happen there on earlier WP versions.

I was able to fix the Site Editor and initial testing looks good. Like @nerrad said though we should still implement this if possible in a follow-up PR unless we find this is necessary during review/testing.

Copy link
Member

@dinhtungdu dinhtungdu left a comment

Choose a reason for hiding this comment

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

Tested on WP 6.1.1 without Gutenberg, and with Woo 7.6, post/page and site editors load and work flawlessly on my end. I can't see any infinite loop as well.

@github-actions github-actions bot added this to the 10.1.0 milestone Apr 19, 2023
@Aljullu Aljullu modified the milestones: 10.1.0, 10.0.2 Apr 19, 2023
@Aljullu Aljullu merged commit 297432f into trunk Apr 19, 2023
@Aljullu Aljullu deleted the fix/broken-editor-before-wp62 branch April 19, 2023 07:08
Aljullu pushed a commit that referenced this pull request Apr 19, 2023
…n 6.2 (#9090)

* Fix infinite loop (range error) on subscribe callback.

* Replace getEditedPostContext with getEditedPostId to retrieve the templateId from the Site Editor for 6.1.1 compatibility

---------

Co-authored-by: tjcafferkey <[email protected]>
@Aljullu
Copy link
Contributor

Aljullu commented Apr 19, 2023

FYI: I added a WC core/feature plugin testing section with testing steps specially targeting the feature plugin and WC core. The Single Product block for now is only available in experimental builds.

@Marc-pi
Copy link

Marc-pi commented Apr 19, 2023

hum, i had a similar issue with Woo / Woo Blocks yesterday but with also multisite.
i noticed it worked on 6.2, not on 6.1.1
a gutenberg patch was added yesterday for multisite
WordPress/gutenberg#49861 (comment)
maybe there were a conjonction of issues about editor loading !!
thanks indeed for the fix !

@Aljullu
Copy link
Contributor

Aljullu commented Apr 19, 2023

Thanks, @Marc-pi! We just released 10.0.2 a few minutes ago that should fix this issue. You can grab it from WordPress.org and, assuming the issue is the same, it will be fixed. 🙌

Aljullu added a commit that referenced this pull request Apr 19, 2023
* Empty commit for release pull request

* Add 10.0.2 changelog

* Update versions to 10.0.2

* Fix broken post/page editor screens in WordPress versions earlier than 6.2 (#9090)

* Fix infinite loop (range error) on subscribe callback.

* Replace getEditedPostContext with getEditedPostId to retrieve the templateId from the Site Editor for 6.1.1 compatibility

---------

Co-authored-by: tjcafferkey <[email protected]>

* Add 10.0.2 testing steps

---------

Co-authored-by: github-actions <[email protected]>
Co-authored-by: Darren Ethier <[email protected]>
Co-authored-by: tjcafferkey <[email protected]>
@Marc-pi
Copy link

Marc-pi commented Apr 19, 2023

thanks for the fix
in my case, updating to 6.2 yesterday fixed the issue, then Gutenberg team added a patch for multisite, and now Woo Blocks also.
i cannot test right now with 6.1.1, but your fix should fix the issue. that was a tricky issue (a side effect of 6.2)
keep it up

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
block: single product Issues related to the single product block. priority: critical The issue is critical—e.g. a fatal error, security problem affecting many customers. type: bug The issue/PR concerns a confirmed bug.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants