Prevent form submit if country is not selected (#1966)

* Prevent form submit if country is not selected

* Refactor error checking function

* Make address forms not invoke chrome's autofill

* Add a comment

* Update tests
This commit is contained in:
Wojciech Mista 2022-04-06 11:32:31 +02:00 committed by GitHub
parent 05c2efde6c
commit 168887ac3b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 83 additions and 60 deletions

View file

@ -93,7 +93,9 @@ const AddressEdit: React.FC<AddressEditProps> = props => {
value={data.firstName} value={data.firstName}
fullWidth fullWidth
InputProps={{ InputProps={{
autoComplete: "given-name" // Setting 'autoComplete: "new-password"' is the only way to
// disable Chrome's autofill on forms as of early 2022
autoComplete: "new-password"
}} }}
/> />
</div> </div>
@ -108,7 +110,7 @@ const AddressEdit: React.FC<AddressEditProps> = props => {
value={data.lastName} value={data.lastName}
fullWidth fullWidth
InputProps={{ InputProps={{
autoComplete: "family-name" autoComplete: "new-password"
}} }}
/> />
</div> </div>
@ -128,7 +130,7 @@ const AddressEdit: React.FC<AddressEditProps> = props => {
value={data.companyName} value={data.companyName}
fullWidth fullWidth
InputProps={{ InputProps={{
autoComplete: "organization" autoComplete: "new-password"
}} }}
/> />
</div> </div>
@ -145,7 +147,7 @@ const AddressEdit: React.FC<AddressEditProps> = props => {
value={data.phone} value={data.phone}
onChange={onChange} onChange={onChange}
InputProps={{ InputProps={{
autoComplete: "tel" autoComplete: "new-password"
}} }}
/> />
</div> </div>
@ -163,7 +165,7 @@ const AddressEdit: React.FC<AddressEditProps> = props => {
value={data.streetAddress1} value={data.streetAddress1}
fullWidth fullWidth
InputProps={{ InputProps={{
autoComplete: "address-line1" autoComplete: "new-password"
}} }}
/> />
<FormSpacer /> <FormSpacer />
@ -179,7 +181,7 @@ const AddressEdit: React.FC<AddressEditProps> = props => {
value={data.streetAddress2} value={data.streetAddress2}
fullWidth fullWidth
InputProps={{ InputProps={{
autoComplete: "address-line2" autoComplete: "new-password"
}} }}
/> />
<FormSpacer /> <FormSpacer />
@ -197,7 +199,7 @@ const AddressEdit: React.FC<AddressEditProps> = props => {
value={data.city} value={data.city}
fullWidth fullWidth
InputProps={{ InputProps={{
autoComplete: "address-level2" autoComplete: "new-password"
}} }}
/> />
</div> </div>
@ -214,7 +216,7 @@ const AddressEdit: React.FC<AddressEditProps> = props => {
value={data.postalCode} value={data.postalCode}
fullWidth fullWidth
InputProps={{ InputProps={{
autoComplete: "postal-code" autoComplete: "new-password"
}} }}
/> />
</div> </div>
@ -251,7 +253,7 @@ const AddressEdit: React.FC<AddressEditProps> = props => {
value={data.countryArea} value={data.countryArea}
fullWidth fullWidth
InputProps={{ InputProps={{
autoComplete: "address-level1" autoComplete: "new-password"
}} }}
/> />
</div> </div>

View file

@ -43,7 +43,11 @@ import {
OrderCustomerAddressesEditDialogOutput, OrderCustomerAddressesEditDialogOutput,
OrderCustomerSearchAddressState OrderCustomerSearchAddressState
} from "./types"; } from "./types";
import { getAddressEditProps, validateDefaultAddress } from "./utils"; import {
getAddressEditProps,
hasPreSubmitErrors,
validateDefaultAddress
} from "./utils";
export interface OrderCustomerAddressesEditDialogProps { export interface OrderCustomerAddressesEditDialogProps {
open: boolean; open: boolean;
@ -131,20 +135,22 @@ const OrderCustomerAddressesEditDialog: React.FC<OrderCustomerAddressesEditDialo
transformAddressToAddressInput( transformAddressToAddressInput(
customerAddresses.find(getById(selectedCustomerAddressID)) customerAddresses.find(getById(selectedCustomerAddressID))
); );
// async because handleShippingSubmit can return a promise
const handleAddressesSubmit = (data: OrderCustomerAddressesEditFormData) => { const handleAddressesSubmit = async (
data: OrderCustomerAddressesEditFormData
) => {
const shippingAddress = const shippingAddress =
customerAddresses.length > 0 && customerAddresses.length > 0 &&
data.shippingAddressInputOption === data.shippingAddressInputOption ===
AddressInputOptionEnum.CUSTOMER_ADDRESS AddressInputOptionEnum.CUSTOMER_ADDRESS
? getCustomerAddress(data.customerShippingAddress.id) ? getCustomerAddress(data.customerShippingAddress.id)
: handleShippingSubmit(data.shippingAddress); : await handleShippingSubmit(data.shippingAddress);
const billingAddress = const billingAddress =
customerAddresses.length > 0 && customerAddresses.length > 0 &&
data.billingAddressInputOption === AddressInputOptionEnum.CUSTOMER_ADDRESS data.billingAddressInputOption === AddressInputOptionEnum.CUSTOMER_ADDRESS
? getCustomerAddress(data.customerBillingAddress.id) ? getCustomerAddress(data.customerBillingAddress.id)
: handleBillingSubmit(data.billingAddress); : await handleBillingSubmit(data.billingAddress);
if (variant === AddressEditDialogVariant.CHANGE_SHIPPING_ADDRESS) { if (variant === AddressEditDialogVariant.CHANGE_SHIPPING_ADDRESS) {
return { return {
@ -205,12 +211,11 @@ const OrderCustomerAddressesEditDialog: React.FC<OrderCustomerAddressesEditDialo
handleSubmit(data); handleSubmit(data);
}; };
const handleSubmit = async (data: OrderCustomerAddressesEditFormData) => { const handleSubmit = async (data: OrderCustomerAddressesEditFormData) => {
const addressesInput = handleAddressesSubmit(data); const addressesInput = await handleAddressesSubmit(data);
if (addressesInput) { if (addressesInput && !hasPreSubmitErrors(addressesInput)) {
await onConfirm(addressesInput as OrderCustomerAddressesEditDialogOutput); await onConfirm(addressesInput as OrderCustomerAddressesEditDialogOutput);
setAddressSearchState(defaultSearchState); setAddressSearchState(defaultSearchState);
} }
return Promise.resolve([ return Promise.resolve([
...shippingValidationErrors, ...shippingValidationErrors,
...billingValidationErrors ...billingValidationErrors

View file

@ -221,7 +221,11 @@ const OrderCustomerAddressesEditForm: React.FC<OrderCustomerAddressesEditFormPro
rest rest
); );
return <form onSubmit={props.submit}>{children(props)}</form>; return (
<form onSubmit={props.submit} autoComplete="off">
{children(props)}
</form>
);
}; };
OrderCustomerAddressesEditForm.displayName = "OrderCustomerAddressesEditForm"; OrderCustomerAddressesEditForm.displayName = "OrderCustomerAddressesEditForm";

View file

@ -2,6 +2,7 @@ import { SingleAutocompleteChoiceType } from "@saleor/components/SingleAutocompl
import { import {
AccountErrorFragment, AccountErrorFragment,
AddressFragment, AddressFragment,
AddressInput,
AddressTypeEnum, AddressTypeEnum,
Node, Node,
OrderErrorFragment OrderErrorFragment
@ -48,6 +49,21 @@ export function validateDefaultAddress<T extends AddressFragment>(
return defaultAddress; return defaultAddress;
} }
const filterAddressErrors = (
dialogErrors: Array<OrderErrorFragment | AccountErrorFragment>,
addressType: AddressTypeEnum
) => dialogErrors.filter(error => error.addressType === addressType);
interface ShippingAddresses {
shippingAddress: AccountErrorFragment[] | AddressInput;
billingAddress: AccountErrorFragment[] | AddressInput;
}
export const hasPreSubmitErrors = (input: ShippingAddresses) =>
Object.values(input)
.flat()
.some(el => "code" in el);
export const getAddressEditProps = ( export const getAddressEditProps = (
variant: "shipping" | "billing", variant: "shipping" | "billing",
data: OrderCustomerAddressesEditData, data: OrderCustomerAddressesEditData,
@ -63,9 +79,7 @@ export const getAddressEditProps = (
return { return {
...addressEditCommonProps, ...addressEditCommonProps,
addressInputName: "shippingAddressInputOption", addressInputName: "shippingAddressInputOption",
formErrors: dialogErrors.filter( formErrors: filterAddressErrors(dialogErrors, AddressTypeEnum.SHIPPING),
error => error.addressType === AddressTypeEnum.SHIPPING
),
onEdit: () => onEdit: () =>
setAddressSearchState({ setAddressSearchState({
open: true, open: true,
@ -84,9 +98,7 @@ export const getAddressEditProps = (
return { return {
...addressEditCommonProps, ...addressEditCommonProps,
addressInputName: "billingAddressInputOption", addressInputName: "billingAddressInputOption",
formErrors: dialogErrors.filter( formErrors: filterAddressErrors(dialogErrors, AddressTypeEnum.BILLING),
error => error.addressType === AddressTypeEnum.BILLING
),
onEdit: () => onEdit: () =>
setAddressSearchState({ setAddressSearchState({
open: true, open: true,

View file

@ -3727,7 +3727,7 @@ exports[`Storyshots Generics / AddressEdit default 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="given-name" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="firstName" name="firstName"
type="text" type="text"
@ -3763,7 +3763,7 @@ exports[`Storyshots Generics / AddressEdit default 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="family-name" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="lastName" name="lastName"
type="text" type="text"
@ -3806,7 +3806,7 @@ exports[`Storyshots Generics / AddressEdit default 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="organization" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="companyName" name="companyName"
type="text" type="text"
@ -3842,7 +3842,7 @@ exports[`Storyshots Generics / AddressEdit default 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="tel" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="phone" name="phone"
type="text" type="text"
@ -3881,7 +3881,7 @@ exports[`Storyshots Generics / AddressEdit default 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="address-line1" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="streetAddress1" name="streetAddress1"
type="text" type="text"
@ -3918,7 +3918,7 @@ exports[`Storyshots Generics / AddressEdit default 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="address-line2" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="streetAddress2" name="streetAddress2"
type="text" type="text"
@ -3959,7 +3959,7 @@ exports[`Storyshots Generics / AddressEdit default 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="address-level2" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="city" name="city"
type="text" type="text"
@ -3995,7 +3995,7 @@ exports[`Storyshots Generics / AddressEdit default 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="postal-code" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="postalCode" name="postalCode"
type="text" type="text"
@ -4109,7 +4109,7 @@ exports[`Storyshots Generics / AddressEdit default 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="address-level1" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="countryArea" name="countryArea"
type="text" type="text"
@ -64796,7 +64796,7 @@ exports[`Storyshots Views / Customers / Create customer default 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="given-name" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="firstName" name="firstName"
type="text" type="text"
@ -64832,7 +64832,7 @@ exports[`Storyshots Views / Customers / Create customer default 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="family-name" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="lastName" name="lastName"
type="text" type="text"
@ -64875,7 +64875,7 @@ exports[`Storyshots Views / Customers / Create customer default 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="organization" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="companyName" name="companyName"
type="text" type="text"
@ -64911,7 +64911,7 @@ exports[`Storyshots Views / Customers / Create customer default 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="tel" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="phone" name="phone"
type="text" type="text"
@ -64950,7 +64950,7 @@ exports[`Storyshots Views / Customers / Create customer default 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="address-line1" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="streetAddress1" name="streetAddress1"
type="text" type="text"
@ -64987,7 +64987,7 @@ exports[`Storyshots Views / Customers / Create customer default 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="address-line2" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="streetAddress2" name="streetAddress2"
type="text" type="text"
@ -65028,7 +65028,7 @@ exports[`Storyshots Views / Customers / Create customer default 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="address-level2" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="city" name="city"
type="text" type="text"
@ -65064,7 +65064,7 @@ exports[`Storyshots Views / Customers / Create customer default 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="postal-code" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="postalCode" name="postalCode"
type="text" type="text"
@ -65178,7 +65178,7 @@ exports[`Storyshots Views / Customers / Create customer default 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="address-level1" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="countryArea" name="countryArea"
type="text" type="text"
@ -65490,7 +65490,7 @@ exports[`Storyshots Views / Customers / Create customer form errors 1`] = `
> >
<input <input
aria-invalid="true" aria-invalid="true"
autocomplete="given-name" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="firstName" name="firstName"
type="text" type="text"
@ -65531,7 +65531,7 @@ exports[`Storyshots Views / Customers / Create customer form errors 1`] = `
> >
<input <input
aria-invalid="true" aria-invalid="true"
autocomplete="family-name" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="lastName" name="lastName"
type="text" type="text"
@ -65579,7 +65579,7 @@ exports[`Storyshots Views / Customers / Create customer form errors 1`] = `
> >
<input <input
aria-invalid="true" aria-invalid="true"
autocomplete="organization" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="companyName" name="companyName"
type="text" type="text"
@ -65620,7 +65620,7 @@ exports[`Storyshots Views / Customers / Create customer form errors 1`] = `
> >
<input <input
aria-invalid="true" aria-invalid="true"
autocomplete="tel" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="phone" name="phone"
type="text" type="text"
@ -65664,7 +65664,7 @@ exports[`Storyshots Views / Customers / Create customer form errors 1`] = `
> >
<input <input
aria-invalid="true" aria-invalid="true"
autocomplete="address-line1" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="streetAddress1" name="streetAddress1"
type="text" type="text"
@ -65706,7 +65706,7 @@ exports[`Storyshots Views / Customers / Create customer form errors 1`] = `
> >
<input <input
aria-invalid="true" aria-invalid="true"
autocomplete="address-line2" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="streetAddress2" name="streetAddress2"
type="text" type="text"
@ -65752,7 +65752,7 @@ exports[`Storyshots Views / Customers / Create customer form errors 1`] = `
> >
<input <input
aria-invalid="true" aria-invalid="true"
autocomplete="address-level2" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="city" name="city"
type="text" type="text"
@ -65793,7 +65793,7 @@ exports[`Storyshots Views / Customers / Create customer form errors 1`] = `
> >
<input <input
aria-invalid="true" aria-invalid="true"
autocomplete="postal-code" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="postalCode" name="postalCode"
type="text" type="text"
@ -65917,7 +65917,7 @@ exports[`Storyshots Views / Customers / Create customer form errors 1`] = `
> >
<input <input
aria-invalid="true" aria-invalid="true"
autocomplete="address-level1" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id"
name="countryArea" name="countryArea"
type="text" type="text"
@ -66237,7 +66237,7 @@ exports[`Storyshots Views / Customers / Create customer loading 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="given-name" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id"
disabled="" disabled=""
name="firstName" name="firstName"
@ -66274,7 +66274,7 @@ exports[`Storyshots Views / Customers / Create customer loading 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="family-name" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id"
disabled="" disabled=""
name="lastName" name="lastName"
@ -66318,7 +66318,7 @@ exports[`Storyshots Views / Customers / Create customer loading 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="organization" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id"
disabled="" disabled=""
name="companyName" name="companyName"
@ -66355,7 +66355,7 @@ exports[`Storyshots Views / Customers / Create customer loading 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="tel" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id"
disabled="" disabled=""
name="phone" name="phone"
@ -66395,7 +66395,7 @@ exports[`Storyshots Views / Customers / Create customer loading 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="address-line1" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id"
disabled="" disabled=""
name="streetAddress1" name="streetAddress1"
@ -66433,7 +66433,7 @@ exports[`Storyshots Views / Customers / Create customer loading 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="address-line2" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id"
disabled="" disabled=""
name="streetAddress2" name="streetAddress2"
@ -66475,7 +66475,7 @@ exports[`Storyshots Views / Customers / Create customer loading 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="address-level2" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id"
disabled="" disabled=""
name="city" name="city"
@ -66512,7 +66512,7 @@ exports[`Storyshots Views / Customers / Create customer loading 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="postal-code" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id"
disabled="" disabled=""
name="postalCode" name="postalCode"
@ -66628,7 +66628,7 @@ exports[`Storyshots Views / Customers / Create customer loading 1`] = `
> >
<input <input
aria-invalid="false" aria-invalid="false"
autocomplete="address-level1" autocomplete="new-password"
class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id" class="MuiInputBase-input-id MuiOutlinedInput-input-id MuiInputBase-disabled-id MuiOutlinedInput-disabled-id"
disabled="" disabled=""
name="countryArea" name="countryArea"