Commit bee63eb51f6 for woocommerce
commit bee63eb51f613691a0f557edd9a8b319768a2a59
Author: Albert Juhé Lluveras <contact@albertjuhe.com>
Date: Fri Oct 30 17:52:50 2026 +0100
Quantity Input: Don't override quantity input aria-label with generic 'Product Quantity' (#70116)
* Don't override quantity input aria-label with generic 'Product Quantity'
* Add changelog
* Update tests
* Linting
* Update changelog
* Add changelog entry for quantity input Playwright helpers
Co-authored-by: Cursor <cursoragent@cursor.com>
---------
Co-authored-by: Cursor <cursoragent@cursor.com>
diff --git a/packages/js/e2e-utils-playwright/changelog/dev-quantity-input-product-label b/packages/js/e2e-utils-playwright/changelog/dev-quantity-input-product-label
new file mode 100644
index 00000000000..93ce78bc716
--- /dev/null
+++ b/packages/js/e2e-utils-playwright/changelog/dev-quantity-input-product-label
@@ -0,0 +1,3 @@
+Significance: patch
+Type: dev
+Comment: Locate product quantity fields by product name in Playwright helpers; no production change.
diff --git a/packages/js/e2e-utils-playwright/src/cart.ts b/packages/js/e2e-utils-playwright/src/cart.ts
index 63551930d16..6c447277092 100644
--- a/packages/js/e2e-utils-playwright/src/cart.ts
+++ b/packages/js/e2e-utils-playwright/src/cart.ts
@@ -41,7 +41,7 @@ export async function addOneOrMoreProductToCart(
`product/${ productName.replace( / /gi, '-' ).toLowerCase() }`
);
await page
- .getByLabel( 'Product quantity' )
+ .getByLabel( `${ productName } quantity`, { exact: true } )
.fill( quantityCount.toString() );
await page.locator( 'button[name="add-to-cart"]' ).click();
}
diff --git a/plugins/woocommerce/changelog/fix-69412-quantity-input-dont-override-label b/plugins/woocommerce/changelog/fix-69412-quantity-input-dont-override-label
new file mode 100644
index 00000000000..bc8a9b228b8
--- /dev/null
+++ b/plugins/woocommerce/changelog/fix-69412-quantity-input-dont-override-label
@@ -0,0 +1,4 @@
+Significance: patch
+Type: fix
+
+In the add-to-cart form, label each quantity input after its product, instead of "Product quantity"
\ No newline at end of file
diff --git a/plugins/woocommerce/templates/global/quantity-input.php b/plugins/woocommerce/templates/global/quantity-input.php
index 0a397aa7929..664b42d032d 100644
--- a/plugins/woocommerce/templates/global/quantity-input.php
+++ b/plugins/woocommerce/templates/global/quantity-input.php
@@ -12,7 +12,7 @@
*
* @see https://woocommerce.com/document/template-structure/
* @package WooCommerce\Templates
- * @version 10.1.0
+ * @version 11.4.0
*
* @var bool $readonly If the input should be set to readonly mode.
* @var string $type The input type attribute.
@@ -41,7 +41,6 @@ $label = ! empty( $args['product_name'] ) ? sprintf( esc_html__( '%s quantity',
class="<?php echo esc_attr( join( ' ', (array) $classes ) ); ?>"
name="<?php echo esc_attr( $input_name ); ?>"
value="<?php echo esc_attr( $input_value ); ?>"
- aria-label="<?php esc_attr_e( 'Product quantity', 'woocommerce' ); ?>"
<?php if ( in_array( $type, array( 'text', 'search', 'tel', 'url', 'email', 'password' ), true ) ) : ?>
size="4"
<?php endif; ?>
diff --git a/plugins/woocommerce/tests/e2e/tests/blocks/add-to-cart-form/add-to-cart-form.block_theme.spec.ts b/plugins/woocommerce/tests/e2e/tests/blocks/add-to-cart-form/add-to-cart-form.block_theme.spec.ts
index 47772ebfd53..a08a4649bd1 100644
--- a/plugins/woocommerce/tests/e2e/tests/blocks/add-to-cart-form/add-to-cart-form.block_theme.spec.ts
+++ b/plugins/woocommerce/tests/e2e/tests/blocks/add-to-cart-form/add-to-cart-form.block_theme.spec.ts
@@ -257,7 +257,9 @@ test.describe( `${ blockData.name } Block`, () => {
await expect( minusButton ).toBeVisible();
await expect( plusButton ).toBeVisible();
- const input = page.getByLabel( 'Product quantity' );
+ const input = page.getByLabel( `${ productName } quantity`, {
+ exact: true,
+ } );
await expect( input ).toHaveValue( '1' );
await input.evaluate( ( element ) => {
diff --git a/plugins/woocommerce/tests/e2e/tests/blocks/add-to-cart-with-options/add-to-cart-with-options.block_theme.spec.ts b/plugins/woocommerce/tests/e2e/tests/blocks/add-to-cart-with-options/add-to-cart-with-options.block_theme.spec.ts
index 11135cf583a..b11e507657a 100644
--- a/plugins/woocommerce/tests/e2e/tests/blocks/add-to-cart-with-options/add-to-cart-with-options.block_theme.spec.ts
+++ b/plugins/woocommerce/tests/e2e/tests/blocks/add-to-cart-with-options/add-to-cart-with-options.block_theme.spec.ts
@@ -66,7 +66,9 @@ test.describe( 'Add to Cart + Options Block', () => {
await test.step( 'allows interacting with the form in the frontend', async () => {
await page.goto( `/?p=${ customProductId }` );
- const quantityInput = page.getByLabel( 'Product quantity' );
+ const quantityInput = page.getByLabel( 'Custom Product quantity', {
+ exact: true,
+ } );
await expect( quantityInput ).toHaveValue( '1' );
await page
@@ -123,7 +125,7 @@ test.describe( 'Add to Cart + Options Block', () => {
'3 in cart, Add to cart: “Beanie”'
);
- await page.getByLabel( 'Product quantity' ).fill( '1' );
+ await page.getByLabel( 'Beanie quantity', { exact: true } ).fill( '1' );
await addToCartButton.click();
await expect( addToCartButton ).toHaveText( '4 in cart' );
@@ -238,7 +240,9 @@ test.describe( 'Add to Cart + Options Block', () => {
);
await increaseQuantityButton.click();
- const quantityInput = page.getByLabel( 'Product quantity' );
+ const quantityInput = page.getByLabel( 'Hoodie quantity', {
+ exact: true,
+ } );
await expect( quantityInput ).toHaveValue( '2' );
@@ -273,7 +277,9 @@ test.describe( 'Add to Cart + Options Block', () => {
const productPrice = page
.locator( '.wp-block-woocommerce-product-price' )
.first();
- const quantitySelector = page.getByLabel( 'Product quantity' );
+ const quantitySelector = page.getByLabel( 'Hoodie quantity', {
+ exact: true,
+ } );
const additionalInfoPanel =
wpCoreVersion >= 6.9
@@ -904,7 +910,9 @@ test.describe( 'Add to Cart + Options Block', () => {
await test.step( 'in simple products', async () => {
await page.goto( '/product/t-shirt/' );
- const quantityInput = page.getByLabel( 'Product quantity' );
+ const quantityInput = page.getByLabel( 'T-Shirt quantity', {
+ exact: true,
+ } );
await expect( quantityInput ).toHaveValue( '4' );
@@ -988,7 +996,8 @@ test.describe( 'Add to Cart + Options Block', () => {
await page.goto( '/product/hoodie/' );
const quantityInput = page.getByRole( 'spinbutton', {
- name: 'Product quantity',
+ name: 'Hoodie quantity',
+ exact: true,
} );
await expect( quantityInput ).toHaveValue( '1' );
diff --git a/plugins/woocommerce/tests/e2e/utils/cart.ts b/plugins/woocommerce/tests/e2e/utils/cart.ts
index f08dedb360c..d3a32f8ae00 100644
--- a/plugins/woocommerce/tests/e2e/utils/cart.ts
+++ b/plugins/woocommerce/tests/e2e/utils/cart.ts
@@ -29,9 +29,9 @@ export async function checkCartContentInClassicCart(
.filter( { hasText: product.data.name } );
await expect( row ).toHaveCount( 1 );
- await expect( row.getByLabel( 'Product quantity' ) ).toHaveValue(
- product.qty.toString()
- );
+ await expect(
+ row.getByLabel( `${ product.data.name } quantity`, { exact: true } )
+ ).toHaveValue( product.qty.toString() );
await expect( row.locator( 'td.product-price' ) ).toHaveText(
`$${ formatAmount( product.data.price ) }`
diff --git a/plugins/woocommerce/tests/e2e/utils/pdp.ts b/plugins/woocommerce/tests/e2e/utils/pdp.ts
index 5d0d179bb14..8bf1bbb8b94 100644
--- a/plugins/woocommerce/tests/e2e/utils/pdp.ts
+++ b/plugins/woocommerce/tests/e2e/utils/pdp.ts
@@ -22,7 +22,9 @@ export async function addProductsToCart(
await expect(
await page.getByRole( 'heading', { name: productName } ).count()
).toBeGreaterThan( 0 );
- await page.getByLabel( 'Product quantity' ).fill( quantityCount );
+ await page
+ .getByLabel( `${ productName } quantity`, { exact: true } )
+ .fill( quantityCount );
await page.locator( 'button[name="add-to-cart"]' ).click();
await expect(
page.getByText(