[Experimental] Product Filter: Price (Beta) block: Prevent invalid pr…

…ice range selection in Product Filter Price block (#45403)

* Prevent invalid price range selection in Product Filter Price block

* Add changefile(s) from automation for the following project(s): woocommerce-blocks

---------

Co-authored-by: github-actions <github-actions@github.com>

plugins/woocommerce-blocks/assets/js/blocks/product-filter/inner-blocks/price-filter/frontend.ts

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { store, getContext } from '@woocommerce/interactivity';
+import { store, getContext, getElement } from '@woocommerce/interactivity';
 import { formatPrice, getCurrency } from '@woocommerce/price-format';
 import { HTMLElementEvent } from '@woocommerce/types';
 
@@ -70,17 +70,28 @@ store< PriceFilterStore >( 'woocommerce/product-filter-price', {
 				type === 'min'
 					? Math.min(
 							Number.isNaN( value ) ? minRange : value,
-							maxRange - 1
+							maxPrice
 					  )
 					: minPrice;
 			const currentMaxPrice =
 				type === 'max'
 					? Math.max(
 							Number.isNaN( value ) ? maxRange : value,
-							minRange + 1
+							minPrice
 					  )
 					: maxPrice;
 
+			// In some occasions the input element is updated with the incorrect value.
+			// By using the element that triggered the event, we can ensure the correct value is used for the input.
+			const element = getElement();
+			if ( type === 'min' ) {
+				element.ref.value = currentMinPrice;
+			}
+
+			if ( type === 'max' ) {
+				element.ref.value = currentMaxPrice;
+			}
+
 			context.minPrice = currentMinPrice;
 			context.maxPrice = currentMaxPrice;
 

plugins/woocommerce/changelog/45403-fix-45361-invalid-price-range-selection-in-product-filter-price-block

@@ -0,0 +1,4 @@
+Significance: patch
+Type: fix
+
+Fix an issue where shoppers could select invalid price ranges in the Product Filter: Price (Beta) block