diff --git a/frontend/models/primary-input.tsx b/frontend/models/primary-input.tsx index 3828b7816..7ffad2f01 100644 --- a/frontend/models/primary-input.tsx +++ b/frontend/models/primary-input.tsx @@ -22,6 +22,7 @@ export enum PrimaryInputNames { const passwordRgx: RegExp = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[^a-zA-Z\d\s]).{8,}$/ const nameRgx: RegExp = new RegExp("^[' -]*[a-z]+[a-z' -]+$", "i") const anyString: RegExp = new RegExp("[sS]*") +const phoneNumberRgx: RegExp = /^[\+]?[(]?[0-9]{3}[)]?[-\s\.]?[0-9]{3}[-\s\.]?[0-9]{4,6}$/ export const primaryInputValidation = { [PrimaryInputNames.BADGE_NUMBER]: { @@ -81,8 +82,8 @@ export const primaryInputValidation = { inputType: "text" }, [PrimaryInputNames.PHONE_NUMBER]: { - errorMessage: 'A phone number is required, formatted as "123 456 7890"', - pattern: /\d{3} \d{3} \d{4}/, + errorMessage: "A valid phone number is required", + pattern: phoneNumberRgx, inputType: "tel" }, [PrimaryInputNames.LOGIN_PASSWORD]: { diff --git a/frontend/tests/snapshots/register.test.tsx b/frontend/tests/snapshots/register.test.tsx index b9d5ab485..e4c24e99d 100644 --- a/frontend/tests/snapshots/register.test.tsx +++ b/frontend/tests/snapshots/register.test.tsx @@ -46,10 +46,10 @@ describe("behaviors", () => { } }) - it("checks phone formatting", async () => { + it("checks phone number length", async () => { const r = renderPage() act(() => { - userEvent.type(r.phoneNumber, "5555555555") + userEvent.type(r.phoneNumber, "5555555555555") userEvent.click(r.submit) }) await expect(r.findByText(/phone number is required/)).resolves.toBeInTheDocument()