Commit e3ad4582176 for woocommerce
commit e3ad45821761e7c9d8d6a3eebfcf7ce003174afe
Author: Seghir Nadir <nadir.seghir@gmail.com>
Date: Thu Oct 22 15:38:13 2026 +0200
Fix stale errors on optional address fields in the Checkout block (#69652)
* Fix stale required errors on optional checkout address fields
* Add changelog entry for checkout optional field error fix
diff --git a/plugins/woocommerce/changelog/fix-checkout-optional-field-stale-error b/plugins/woocommerce/changelog/fix-checkout-optional-field-stale-error
new file mode 100644
index 00000000000..3da8a3af7b0
--- /dev/null
+++ b/plugins/woocommerce/changelog/fix-checkout-optional-field-stale-error
@@ -0,0 +1,4 @@
+Significance: patch
+Type: fix
+
+Fix the Checkout block blocking orders with an outdated error on an optional address field, such as state/county.
diff --git a/plugins/woocommerce/client/blocks/assets/js/base/components/state-input/state-input.tsx b/plugins/woocommerce/client/blocks/assets/js/base/components/state-input/state-input.tsx
index f6446162e13..ec1237b083e 100644
--- a/plugins/woocommerce/client/blocks/assets/js/base/components/state-input/state-input.tsx
+++ b/plugins/woocommerce/client/blocks/assets/js/base/components/state-input/state-input.tsx
@@ -27,6 +27,7 @@ const optionMatcher = (
const StateInput = ( {
className,
id,
+ errorId,
states,
country,
label,
@@ -95,6 +96,7 @@ const StateInput = ( {
options={ options }
label={ label || '' }
id={ id }
+ errorId={ errorId }
onChange={ onChangeState }
value={ value }
autoComplete={ autoComplete }
@@ -107,6 +109,7 @@ const StateInput = ( {
<ValidatedTextInput
className={ className }
id={ id }
+ errorId={ errorId }
label={ label }
onChange={ onChangeState }
autoComplete={ autoComplete }
diff --git a/plugins/woocommerce/client/blocks/packages/public-api/blocks-components/text-input/validated-text-input.tsx b/plugins/woocommerce/client/blocks/packages/public-api/blocks-components/text-input/validated-text-input.tsx
index 780f5d63a92..d92f632942d 100644
--- a/plugins/woocommerce/client/blocks/packages/public-api/blocks-components/text-input/validated-text-input.tsx
+++ b/plugins/woocommerce/client/blocks/packages/public-api/blocks-components/text-input/validated-text-input.tsx
@@ -260,6 +260,21 @@ const ValidatedTextInput = forwardRef<
validateInput,
] );
+ /**
+ * Run validation again when it changes without remounting (data store level change).
+ */
+ const isRequired = !! rest.required;
+ const previousIsRequired = useRef( isRequired );
+
+ useEffect( () => {
+ if ( previousIsRequired.current === isRequired ) {
+ return;
+ }
+
+ previousIsRequired.current = isRequired;
+ validateInput( true );
+ }, [ isRequired, validateInput ] );
+
// Remove validation errors when unmounted.
useEffect( () => {
return () => {