Skip to content

Commit 3930bbb

Browse files
authored
fix(EMI-1934): address autocomplete keyboard navigation issue (#14963)
- dont pass a formik handler to onBlur - causes issues with first press of down key - fix missing onClear handler
1 parent 00f3283 commit 3930bbb

File tree

3 files changed

+10
-7
lines changed

3 files changed

+10
-7
lines changed

src/Apps/Order/Routes/Shipping/Components/FulfillmentDetailsForm.tsx

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -380,7 +380,6 @@ const FulfillmentDetailsFormLayout = (
380380
title="Address line 1"
381381
value={values.attributes.addressLine1}
382382
onChange={withBackToFulfillmentDetails(handleChange)}
383-
onBlur={handleBlur}
384383
onSelect={option => {
385384
const selectedAddress = option.address
386385
setValues({
@@ -404,8 +403,8 @@ const FulfillmentDetailsFormLayout = (
404403
?.addressLine1
405404
}
406405
data-testid="AddressForm_addressLine1"
407-
onClear={function (): void {
408-
throw new Error("Function not implemented.")
406+
onClear={() => {
407+
setFieldValue("attributes.addressLine1", "")
409408
}}
410409
/>
411410
</Column>

src/Components/Address/AddressAutocompleteInput.tsx

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,10 @@ interface AutocompleteTrackingValues {
3232
}
3333

3434
export interface AddressAutocompleteInputProps
35-
extends Partial<AutocompleteInputProps<AddressAutocompleteSuggestion>> {
35+
extends Omit<
36+
Partial<AutocompleteInputProps<AddressAutocompleteSuggestion>>,
37+
"onBlur"
38+
> {
3639
/* The address [including at least a country] to use for autocomplete suggestions */
3740
address: Partial<Address> & { country: Address["country"] }
3841

@@ -140,9 +143,11 @@ const reducer = (state: State, action: Action): State => {
140143

141144
/**
142145
* A wrapper around the Palette AutocompleteInput that handles efficiently
143-
* fetching address suggestions from an autocomplete provider. Use the
144-
* `useAddressAutocompleteTracking` hook to get pre-loaded tracking helpers.
146+
* fetching address suggestions from an autocomplete provider.
145147
* See AddressAutocompleteInput.jest.tsx for implementation examples.
148+
*
149+
* *note: The onBlur prop is disabled because it causes issues with keyboard
150+
* navigation. see https://github.com/artsy/force/pull/14963 for more info.*
146151
*/
147152
export const AddressAutocompleteInput = ({
148153
address,

src/Components/Address/AddressFormFields.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -146,7 +146,6 @@ export const AddressFormFields = <V extends FormikContextWithAddress>(
146146
title="Street address"
147147
value={values.address.addressLine1}
148148
onChange={handleChange}
149-
onBlur={handleBlur}
150149
onSelect={option => {
151150
const selectedAddress = option.address
152151
setValues({

0 commit comments

Comments
 (0)