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

Register missing C&C inner blocks and update fallback template for older C& C versions #6195

Merged
merged 10 commits into from
Apr 12, 2022

Conversation

ralucaStan
Copy link
Contributor

@ralucaStan ralucaStan commented Apr 5, 2022

This will fix the issues with missing Order summary inner blocks: Coupons (both in C & C blocks) and the Cart header.

The issue was happening because, for example, for Cart the coupons were registered on the on frontend, but it just wasn't forced in the attributes. Because it also wasn't added to the PHP fallback layout, the render function didn't include it. For the Checkout block the coupons inner block wasn't registered at all.

Fixes #6185

Other Checks

  • I've updated this doc for any feature flags or experimental interfaces implemented in this pull request.
  • I tagged two reviewers because this PR makes queries to the database or I think it might have some security impact.

Screenshots

Before After
Screenshot 2022-04-05 at 11 53 18 Screenshot 2022-04-05 at 16 55 41

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:
Test from tag v7.2.0

  1. Run git checkout tags/v7.2.0
  2. Insert fresh Cart/Checkout blocks in different pages, save them
  3. Notice that there is no inner blocks for Order summary
  4. Switch to the PR branch & build
  5. Test that Cart/Checkout blocks load fine in the frontend and the editor without crashing and the missing inner blocks are there

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.
  • Not included in user facing testing instructions

Performance Impact

@ralucaStan ralucaStan added the skip-changelog PRs that you don't want to appear in the changelog. label Apr 5, 2022
@ralucaStan ralucaStan requested a review from senadir April 5, 2022 15:04
@rubikuserbot rubikuserbot requested a review from a team April 5, 2022 15:04
@github-actions
Copy link
Contributor

github-actions bot commented Apr 5, 2022

Size Change: +5 B (0%)

Total Size: 861 kB

Filename Size Change
build/cart-blocks/order-summary-coupon-form-frontend.js 2.81 kB -1 B (0%)
build/cart-blocks/order-summary-heading-frontend.js 454 B +2 B (0%)
build/cart-blocks/order-summary-shipping--checkout-blocks/order-summary-shipping-frontend.js 6.34 kB -1 B (0%)
build/cart-blocks/order-summary-shipping-frontend.js 428 B +1 B (0%)
build/cart-blocks/order-summary-taxes-frontend.js 433 B +1 B (0%)
build/cart-frontend.js 45.5 kB +9 B (0%)
build/cart.js 44.3 kB -1 B (0%)
build/checkout-blocks/order-summary-coupon-form-frontend.js 2.96 kB -1 B (0%)
build/checkout-blocks/shipping-methods-frontend.js 4.72 kB -1 B (0%)
build/checkout-frontend.js 47.7 kB -3 B (0%)
ℹ️ View Unchanged
Filename Size
build/active-filters-frontend.js 5.92 kB
build/active-filters.js 6.59 kB
build/all-products-frontend.js 18.1 kB
build/all-products.js 33.5 kB
build/all-reviews.js 7.78 kB
build/attribute-filter-frontend.js 16.9 kB
build/attribute-filter.js 12.8 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.23 kB
build/cart-blocks/cart-items-frontend.js 298 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 430 B
build/cart-blocks/cart-order-summary-frontend.js 1.1 kB
build/cart-blocks/cart-totals-frontend.js 321 B
build/cart-blocks/empty-cart-frontend.js 345 B
build/cart-blocks/filled-cart-frontend.js 772 B
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-subtotal-frontend.js 273 B
build/cart-blocks/proceed-to-checkout-frontend.js 1.15 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 893 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.08 kB
build/checkout-blocks/order-summary-cart-items-frontend.js 3.66 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.1 kB
build/checkout-blocks/order-summary-shipping-frontend.js 606 B
build/checkout-blocks/order-summary-subtotal-frontend.js 273 B
build/checkout-blocks/order-summary-taxes-frontend.js 432 B
build/checkout-blocks/payment-frontend.js 7.82 kB
build/checkout-blocks/shipping-address-frontend.js 995 B
build/checkout-blocks/terms-frontend.js 1.22 kB
build/checkout-blocks/totals-frontend.js 326 B
build/checkout.js 45.6 kB
build/featured-category.js 8.67 kB
build/featured-product.js 9.78 kB
build/handpicked-products.js 7.14 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 327 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.68 kB
build/mini-cart-contents-block/footer-frontend.js 5.64 kB
build/mini-cart-contents-block/items-frontend.js 226 B
build/mini-cart-contents-block/products-table-frontend.js 288 B
build/mini-cart-contents-block/shopping-button-frontend.js 287 B
build/mini-cart-contents-block/title-frontend.js 367 B
build/mini-cart-contents.js 22.7 kB
build/mini-cart-frontend.js 1.72 kB
build/mini-cart.js 6.1 kB
build/price-filter-frontend.js 12.3 kB
build/price-filter.js 8.4 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 224 B
build/product-add-to-cart--product-button--product-image--product-title.js 2.65 kB
build/product-add-to-cart--product-button.js 565 B
build/product-add-to-cart-frontend.js 6.97 kB
build/product-add-to-cart.js 6.64 kB
build/product-best-sellers.js 7.41 kB
build/product-button--product-category-list--product-image--product-price--product-rating--product-sale-b--e17c7c01.js 501 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 924 B
build/product-category-list.js 500 B
build/product-category.js 8.52 kB
build/product-image-frontend.js 1.84 kB
build/product-image.js 1.07 kB
build/product-new.js 7.7 kB
build/product-on-sale.js 8.01 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 735 B
build/product-sale-badge-frontend.js 1.09 kB
build/product-sale-badge.js 679 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 918 B
build/product-tag-list-frontend.js 918 B
build/product-tag-list.js 495 B
build/product-tag.js 7.83 kB
build/product-title-frontend.js 1.29 kB
build/product-title.js 910 B
build/product-top-rated.js 7.94 kB
build/products-by-attribute.js 8.42 kB
build/reviews-by-category.js 11.2 kB
build/reviews-by-product.js 12.3 kB
build/reviews-frontend.js 7 kB
build/single-product-frontend.js 21.5 kB
build/single-product.js 10.1 kB
build/stock-filter-frontend.js 6.5 kB
build/stock-filter.js 6.56 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.74 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 21.9 kB
build/wc-blocks-style.css 21.8 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.3 kB
build/wc-blocks.js 2.62 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

@ralucaStan ralucaStan added the status: blocker Used on issues or pulls that block work from being released. label Apr 8, 2022
@ralucaStan ralucaStan force-pushed the fix/6185-order-summary-inner-blocks branch from 4f82c2e to e4ab313 Compare April 8, 2022 15:14
@ralucaStan ralucaStan marked this pull request as draft April 11, 2022 14:01
@ralucaStan ralucaStan marked this pull request as ready for review April 11, 2022 16:26
@ralucaStan ralucaStan force-pushed the fix/6185-order-summary-inner-blocks branch from bd9532d to 00a4ead Compare April 11, 2022 16:42
Copy link
Contributor

@opr opr left a comment

Choose a reason for hiding this comment

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

Testing works well! 🙌🏼 Also the code changes look mostly fine, just added a question about the taxes block.

<div data-block-name="woocommerce/checkout-order-summary-discount-block" class="wp-block-woocommerce-checkout-order-summary-discount-block"></div>' .
( $coupons_enabled ? '<div data-block-name="woocommerce/checkout-order-summary-coupon-form-block" class="wp-block-woocommerce-checkout-order-summary-coupon-form-block"></div>' : '' ) .
'<div data-block-name="woocommerce/checkout-order-summary-shipping-block" class="wp-block-woocommerce-checkout-order-summary-shipping-block"></div>
<div data-block-name="woocommerce/checkout-order-summary-taxes-block" class="wp-block-woocommerce-checkout-order-summary-taxes-block"></div>
Copy link
Contributor

Choose a reason for hiding this comment

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

Do we need to do a check for if taxes are enabled here?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Most definitely, but I don't trust myself to do this change. There is no issue if the wrapper appears when it shouldn't because it's handled on the CSS side, but we can add a ticket for this separately.

Copy link
Member

Choose a reason for hiding this comment

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

We shouldn't check for taxes being enabled, not coupons as well. That logic lives inside the actual block.

<div data-block-name="woocommerce/cart-order-summary-subtotal-block" class="wp-block-woocommerce-cart-order-summary-subtotal-block"></div>
<div data-block-name="woocommerce/cart-order-summary-fee-block" class="wp-block-woocommerce-cart-order-summary-fee-block"></div>
<div data-block-name="woocommerce/cart-order-summary-discount-block" class="wp-block-woocommerce-cart-order-summary-discount-block"></div>' .
( $coupons_enabled ? '<div data-block-name="woocommerce/cart-order-summary-coupon-form-block" class="wp-block-woocommerce-cart-order-summary-coupon-form-block"></div>' : '' ) .
Copy link
Member

Choose a reason for hiding this comment

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

This shouldn't be here and shouldn't be needed at all, the logic inside cart-order-summary-coupon-form/block.tsx should be enough. The logic to render those divs should match the logic we have inside defaultTemplate of cart-order-summary-block/edit.tsx, so if we don't have conditions inside that array, we shouldn't have logic here.

Copy link
Member

Choose a reason for hiding this comment

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

You can confirm that by inserting a V3 Cart and saving, the HTML from coupon form is always there, regardless of taxes being enabled or not.

Copy link
Member

@senadir senadir left a comment

Choose a reason for hiding this comment

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

Tested and reviewed functionality, this is looking great! 🚢

@github-actions github-actions bot added this to the 7.4.0 milestone Apr 12, 2022
…older C & C versions

This will fix the issues with missing order summary inner blocks: Coupons (both in C & C blocks) and the Cart header. The issue was happening because, for example, for Cart the coupons were registred on the on frontend, but it just wasn't forced in the attributes. Because it also wasn't added to the PHP fallback layout, the render function didn't include it. For the Checkout block the coupons inner block wasn't registered at all.
They have been written for logged in user
@senadir senadir force-pushed the fix/6185-order-summary-inner-blocks branch from 927eba1 to bb33ce4 Compare April 12, 2022 10:42
@senadir senadir merged commit 40180ae into trunk Apr 12, 2022
@senadir senadir deleted the fix/6185-order-summary-inner-blocks branch April 12, 2022 11:20
tarhi-saad pushed a commit that referenced this pull request Apr 12, 2022
…der C& C versions (#6195)

* Register missing C & C inner blocks and update fallback template for older C & C versions

This will fix the issues with missing order summary inner blocks: Coupons (both in C & C blocks) and the Cart header. The issue was happening because, for example, for Cart the coupons were registred on the on frontend, but it just wasn't forced in the attributes. Because it also wasn't added to the PHP fallback layout, the render function didn't include it. For the Checkout block the coupons inner block wasn't registered at all.

* Revert changes to Checkout.php, we don't need to test for inner blocks

* Revert "Revert changes to Checkout.php, we don't need to test for inner blocks"

This reverts commit fc39535.

* Fix the returned template for older Checkout block iterations

* Fix Cart and Checkout templates to accommodate the Summary order inner blocks

* Hide coupon form div from inner blocks if coubons are not enabled

* Fix checkout coupon tests in checkout

They have been written for logged in user

* Fix Order Summary Heading inner block's default text

* Update comments with better wording

* Revert "Hide coupon form div from inner blocks if coubons are not enabled"

This reverts commit ab09021.

(cherry picked from commit 40180ae)
tarhi-saad added a commit that referenced this pull request Apr 14, 2022
* Empty commit for release pull request

* Add Changelog to readme.txt

* Update WC tested and required versions

* Add testing notes

* Register missing C&C inner blocks and update fallback template for older C& C versions (#6195)

* Register missing C & C inner blocks and update fallback template for older C & C versions

This will fix the issues with missing order summary inner blocks: Coupons (both in C & C blocks) and the Cart header. The issue was happening because, for example, for Cart the coupons were registred on the on frontend, but it just wasn't forced in the attributes. Because it also wasn't added to the PHP fallback layout, the render function didn't include it. For the Checkout block the coupons inner block wasn't registered at all.

* Revert changes to Checkout.php, we don't need to test for inner blocks

* Revert "Revert changes to Checkout.php, we don't need to test for inner blocks"

This reverts commit fc39535.

* Fix the returned template for older Checkout block iterations

* Fix Cart and Checkout templates to accommodate the Summary order inner blocks

* Hide coupon form div from inner blocks if coubons are not enabled

* Fix checkout coupon tests in checkout

They have been written for logged in user

* Fix Order Summary Heading inner block's default text

* Update comments with better wording

* Revert "Hide coupon form div from inner blocks if coubons are not enabled"

This reverts commit ab09021.

(cherry picked from commit 40180ae)

* Update the zip file link

* Update testing instructions

* Remove experimental build related PR from testing notes

* Fix/order summary sidebar css (#6231)

* Add box sizing to Totals item

* Add some unit tests for Order summary blocks

* Fix Proceed to checkout button size

(cherry picked from commit 669aee7)

* Update the WC required/tested versions

* Mini Cart Contents: Use block pattern to make the empty cart message translatable (#6248)

* try: use block pattern to make empty cart message translatable

* Update src/BlockTypes/MiniCart.php

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>

* rename function

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
Co-authored-by: Luigi <gigitux@gmail.com>
(cherry picked from commit cfe73f1)

* Update the release's ZIP file

* Update testing notes

In #6065, for Cart only Order Summary Heading & Coupon form can
be removed, and for Checkout only the Coupon form.

* Update the testing notes

Remove #5870 testing notes because they can't be tested as a user

* Update Testing notes

Add screenshots to the #5967 testing notes

* Remove #6166 testing instructions

We reverted this PR

* Revert (#6166) (#6253)

Revert "Prevent Featured Product block from breaking when product is out of stock + hidden
from catalog (#6166)"

This reverts commit 3c0e0af

(cherry picked from commit 908526e)

* Bumping version strings to new version.

Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Saad Tarhi <saad.trh@gmail.com>
Co-authored-by: Raluca Stan <ralucastn@gmail.com>
Co-authored-by: Luigi Teschio <gigitux@gmail.com>
Co-authored-by: Tung Du <dinhtungdu@gmail.com>
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
skip-changelog PRs that you don't want to appear in the changelog. status: blocker Used on issues or pulls that block work from being released.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Not all Cart & Checkout inner blocks render when migrating to inner blocks for Order Summary
3 participants