Commit 221a410831 for woocommerce
commit 221a4108312ed8208ce24991e0fae91224c21e09
Author: Albert Juhé Lluveras <contact@albertjuhe.com>
Date: Tue Dec 9 15:59:22 2025 +0100
Add to Cart Button: use a11y utils from script module (#62014)
* Add to Cart Button: use a11y utils from script module
* Add changelog file
* Load wordpress/a11y dynamically
* Don't wait for a11y module to load until it's used
diff --git a/plugins/woocommerce/changelog/fix-product-button-use-a11y-from-script-module b/plugins/woocommerce/changelog/fix-product-button-use-a11y-from-script-module
new file mode 100644
index 0000000000..196979ed42
--- /dev/null
+++ b/plugins/woocommerce/changelog/fix-product-button-use-a11y-from-script-module
@@ -0,0 +1,4 @@
+Significance: patch
+Type: fix
+
+Add to Cart Button: use a11y utils from script module
diff --git a/plugins/woocommerce/client/blocks/assets/js/base/stores/woocommerce/cart.ts b/plugins/woocommerce/client/blocks/assets/js/base/stores/woocommerce/cart.ts
index 30c22ed63b..9d9267026f 100644
--- a/plugins/woocommerce/client/blocks/assets/js/base/stores/woocommerce/cart.ts
+++ b/plugins/woocommerce/client/blocks/assets/js/base/stores/woocommerce/cart.ts
@@ -309,6 +309,7 @@ const { state, actions } = store< Store >(
{ id, key, quantity, variation }: ClientCartItem,
{ showCartUpdatesNotices = true }: CartUpdateOptions = {}
) {
+ const a11yModulePromise = import( '@wordpress/a11y' );
let item = state.cart.items.find( ( cartItem ) => {
if ( cartItem.type === 'variation' ) {
// If it's a variation, check that attributes match.
@@ -402,7 +403,8 @@ const { state, actions } = store< Store >(
'woocommerce'
) as WooCommerceConfig;
if ( messages?.addedToCartText ) {
- wp?.a11y?.speak( messages.addedToCartText, 'polite' );
+ const { speak } = yield a11yModulePromise;
+ speak( messages.addedToCartText, 'polite' );
}
// Dispatches the event to sync the @wordpress/data store.
@@ -421,6 +423,7 @@ const { state, actions } = store< Store >(
items: ClientCartItem[],
{ showCartUpdatesNotices = true }: CartUpdateOptions = {}
) {
+ const a11yModulePromise = import( '@wordpress/a11y' );
const previousCart = JSON.stringify( state.cart );
const quantityChanges: QuantityChanges = {};
@@ -557,10 +560,8 @@ const { state, actions } = store< Store >(
'woocommerce'
) as WooCommerceConfig;
if ( messages?.addedToCartText ) {
- wp?.a11y?.speak(
- messages.addedToCartText,
- 'polite'
- );
+ const { speak } = yield a11yModulePromise;
+ speak( messages.addedToCartText, 'polite' );
}
// Dispatches the event to sync the @wordpress/data store.
diff --git a/plugins/woocommerce/src/Blocks/BlockTypes/ProductButton.php b/plugins/woocommerce/src/Blocks/BlockTypes/ProductButton.php
index 807af84100..15aea16f24 100644
--- a/plugins/woocommerce/src/Blocks/BlockTypes/ProductButton.php
+++ b/plugins/woocommerce/src/Blocks/BlockTypes/ProductButton.php
@@ -47,7 +47,6 @@ class ProductButton extends AbstractBlock {
*/
protected function enqueue_assets( array $attributes, $content, $block ) {
parent::enqueue_assets( $attributes, $content, $block );
- wp_enqueue_script( 'wp-a11y' );
if ( wp_is_block_theme() ) {
add_action(