Categories
blocks

WooCommerce Blocks 3.0 release notes

Today we released WooCommerce Blocks 3.0.0! It’s available for download from GitHub and WordPress.org.

Support for BACS and COD

Two of the major highlights of this release are introducing support for the Bank Transfer and Cash on Delivery payment methods to the checkout block. This work fulfills a key part of our plan to support all payment methods offered by WooCommerce core. From the feedback we’ve received so far on the blocks, it is clear that many of you use those payment methods too!

The Cash on Delivery payment method integration includes full support for what shipping methods it is available for as well as whether it is accepted for virtual orders.

Screen Recording 2020-07-20 at 02.21.55 PM.gif

Changes to payment method extension API

If you are a payment method extension developer integrating with the checkout block, please note that we have made a change to the interface. The canMakePayment property is used by integrating payment methods to indicate to checkout whether they can be displayed in the UI or not. This is useful for payment methods that might be restricted by browser, geographical area or some other requirement.

Prior to 3.0, the callback provided on this property by the payment method would only ever get invoked once during a checkout session. However, with 3.0 this could now get invoked multiple times during the checkout session. This is so payment methods have the opportunity to update whether they can show in the ui/ux or not depending on changes in the checkout itself (shipping rates selected, totals etc).

This is a considered a non-breaking change, however, if you do any expensive payment method initialization during this callback, you may want to ensure you only do that initialization once and cache the results. You can see an example of this is done for the Stripe payment request integration here.

Changelog

Here’s a changelog of the changes in this release:

  • build: Updated the automattic/jetpack-autoloader package to the 2.0 branch. #2847
  • enhancement: Add support for the Bank Transfer (BACS) payment method in the Checkout block. #2821
  • enhancement: Several improvements to make Credit Card input fields display more consistent across different themes and viewport sizes. #2869
  • enhancement: Cart and Checkout blocks show a notification for products on backorder. #2833
  • enhancement: Chip styles of the Filter Products by Attribute and Active Filters have been updated to give a more consistent experience. #2765
  • enhancement: Add protection for rogue filters on order queries when executing cleanup draft orders logic. #2874
  • enhancement: Extend payment gateway extension API so gateways (payment methods) can dynamically disable (hide), based on checkout or order data (such as cart items or shipping method). For example, Cash on Delivery can limit availability to specific shipping methods only. #2840 [DN]
  • enhancement: Support Cash on Delivery core payment gateway in the Checkout block. #2831 #2831
  • performance: Don’t load shortcode Cart and Checkout scripts when using the blocks. #2842
  • performance: Scripts only relevant to the frontend side of blocks are no longer loaded in the editor. #2788
  • performance: Lazy Loading Atomic Components #2777
  • performance: Fix unnecessary checks happening for wc_reserved_stock table in site dashboard #2895
  • refactor: Remove dashicon classes #2848

By Darren Ethier

My name is Darren Ethier. I’m the father of four children and husband of the most beautiful woman in the world. My passion is developing useful and pretty code. I also love anything to do with leadership and the wise use of words.  Currently I'm employed as a Code Wrangler with Automattic.Previous to my employment with Automattic, I had my own business, Rough Smooth Engine and my main client was Event Espresso and Event Smart.  I also am the author/founder of the popular series plugin for WordPress, Organize Series.  You may also see me hanging around working on the WordPress Gutenberg Project (currently on the core team there).

12 replies on “WooCommerce Blocks 3.0 release notes”

Thanks for the feedback @rebajaslocascom!

We’ve been iterating on the Cart and Checkout block styles to make them more compatible with themes (inheriting various things from theme styles more), but it is difficult to ensure they look really good across all the various themes in the ecosystem (not to mention the various subjective opinions on what folks consider “looks good” 😃). To a degree, there will likely still be themes that have to add their own support for the blocks to go that final mile in polishing how the blocks look.

It’s always good to touch base with the theme author to see if that’s something they wish to add support for. Keep in mind though, that the blocks are still in preview, which means things could change as we iterate, so it’s understandable that theme developers might be reluctant to invest too much time into adding support yet.

With that said, I’ve added the theme to my todo list to check out to see if there’s improvements we can make in the plugin without affecting other themes.

Liked by 4 people

Hi Darren! Thanks for answering.

When I say that the cart does not look good, I mean that the blocks that should appear in 2 columns, only appear in 1 column.

The “checkout” button in the mobile version breaks the styles and is not properly aligned.

I have already contacted the developers of GeneratePress and they told me that these problems are not theirs, the problems are from the developers of the “WooCommerce Blocks” plugin.

Check this: https://generatepress.com/forums/topic/compatibilidad-con-woocommerce-blocks/

PS: WooCommerce’s native “Cash on Delivery” payment method is definitely not showing in this latest version.

Thanks for making a better WooCommerce!

Like

PS: WooCommerce’s native “Cash on Delivery” payment method is definitely not showing in this latest version.

Hmm, that’s definitely puzzling. Would you be able to share what settings you have configured for the COD payment method? If yes, I’ve create an issue to track this (https://github.com/woocommerce/woocommerce-gutenberg-products-block/issues/2910). It’d be great if you could leave details about how COD is configured on your site and I can use that to see if I can reproduce.

Like

Hi Caley,

That’s definitely not good! You can post in the WooCommerce Blocks support forums and someone should be able to help you there. When you post there, try to be as specific as possible about what broke and various details about the environment (What plugins/themes are installed? What versions? What version of WordPress core? Did your client update from an earlier version of the WooCommerce Blocks plugin, if so what version?). The more detail you provide, the better the chance of us being able to figure out what went wrong.

Like

Hi there,

As noted in the post, the Cash on Delivery payment method definitely should be showing up in this release as we added support for it. Is the payment method you are referring to one that is included with WooCommerce core?

Like

Hey Darren,

I love the concept of the woocommerce blocks and I think it is the future but I have experienced a lot of issues as to why I haven’t published it on one of my live websites.

I am using the Kadence theme on a test website and when published the cart page block on the front end we would add a product to cart and when on the cart page we have an empty cart. Standard woocommerce cart shortcode works without any issues.
As with the previous woo cart shortcode, Paypal instant payment is shown on the cart page but with the woocommerce cart block, it doesn’t show at all except for the checkout page.

These are my 2 major issues but I am confident that you and the Woocommerce theme will get it going. Thank you

Like

Hi Larnardo👋

Thanks for taking the time to leave your comment here!

When published the cart page block on the front end we would add a product to cart and when on the cart page we have an empty cart.

This does seem odd. The cart block should show any product that has been added to the regardless of what page it is published on. I must admit however, it is a bit difficult for me to understand your exact setup as described. Do you happen to have a publicly accessible site I can see this behaviour, or are you able to share any screenshots?

Paypal instant payment is shown on the cart page but with the woocommerce cart block, it doesn’t show at all except for the checkout page.

Paypal instant payment is currently not a supported payment method for the Cart and Checkout blocks. WooCommerce payment methods have to explicitly add support as the blocks do not use the same code as the shortcode flows.

Would you be able to point me to exactly what WooCommerce extension you are using to provide Paypal Instant Payment? If that is an extension developed by the WooCommerce team then it is likely something we will be working on to add support for the blocks at some point in the future as we iterate on payment method support.

You can read more about the Cart and Checkout previews being offered through the WooCommerce Blocks feature plugin here.

Like

Hi. Thank You for your hard work. I have a problem with the button “Already have an account. Sign in” It redirects to the /wp-admin page rather than my account page. Is it my problem?

Thank You

Liked by 1 person

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.