`Your email address` textfield needs validation

[stephendonner]

Description

Your email address textfield needs validation

Kudos to @MadhaviSeelam for the find!

Steps to Reproduce

1. install 1.45.90
2. launch Brave
3. set up a Brave VPN connection
4. click on the VPN button in the toolbar
5. click the Gears icon
6. click on Contact technical support
7. enter aaaa into the Your email address field
8. click Submit

Actual result:

Failed to create support ticket, check your connection.

Expected result:

Should balk at the non-email-address text aaaa and throw an error saying so, with the Your email address textfield highlighted in red

Reproduces how often:

100%

Brave version (brave://version info)

Brave	1.45.90 Chromium: 106.0.5249.103 (Official Build) beta (x86_64)
Revision	182570408a1f25ab2731ef5f283b918df9b9f956-refs/branch-heads/5249_91@{#6}
OS	macOS Version 11.7 (Build 20G817)

Version/Channel Information:

• Can you reproduce this issue with the current release? N/A
• Can you reproduce this issue with the beta channel? Yes
• Can you reproduce this issue with the nightly channel? Yes

Other Additional Information:

• Does the issue resolve itself when disabling Brave Shields?
• Does the issue resolve itself when disabling Brave Rewards?
• Is the issue reproducible on the latest version of Chrome?

Miscellaneous Information:

cc @MadhaviSeelam @aguscruiz @bsclifton @spylogsster @rmcfadden3

[rmcfadden3]

@stephendonner — are you thinking an error message something like "Failed to create support ticket. Check your email address." or similar?

[stephendonner]

@stephendonner — are you thinking an error message something like "Failed to create support ticket. Check your email address." or similar?

@rmcfadden3 was thinking we should validate the email address first, and throw an error message specific to its validation, before even trying to submit, actually.

[rmcfadden3]

@stephendonner — are you thinking an error message something like "Failed to create support ticket. Check your email address." or similar?

@rmcfadden3 was thinking we should validate the email address first, and throw an error message specific to its validation, before even trying to submit, actually.

@stephendonner — so maybe something more like "Could not validate your email address. Please try again." or "Could not verify your email address. Please try again." instead?

[stephendonner]

@stephendonner — are you thinking an error message something like "Failed to create support ticket. Check your email address." or similar?

@rmcfadden3 was thinking we should validate the email address first, and throw an error message specific to its validation, before even trying to submit, actually.

@stephendonner — so maybe something more like "Could not validate your email address. Please try again." or "Could not verify your email address. Please try again." instead?

Sorry for the delay in responding; what @petemill implemented with the red error text (inline) LGMT 👍

[kjozwiak]

The above requires 1.46.87 or higher for 1.46.x verification. However, I believe we can verify the above without the need for the SKU SDK v2 to land on the server side.

[MadhaviSeelam]

Verification PASSED using

Brave | 1.46.96 Chromium: 107.0.5304.91 (Official Build) beta (64-bit)
-- | --
Revision | 3d5948960d62418160796d5831a4d2d7d6c90fa8-refs/branch-heads/5304@{#1097}
OS | Windows 11 Version 21H2 (Build 22000.1098)

Verified using original STR from the description

• Install 1.46.96
• launched Brave
• set up a Brave VPN connection
• clicked on the VPN button in the toolbar
• clicked the Gearsicon
• clicked on Contact technical support

Confirmed Your email address text field shows correct validation message Please enter a valid email address for invalid email address

Confirmed validation message Please choose a reason returned for not choosing a Subject

Confirmed validation message This field is required returned for empty body

Invalid email address	Not choosing a subject `	Empty body

[stephendonner]

Verified PASSED using

Brave	1.46.133 Chromium: 108.0.5359.71 (Official Build) (x86_64)
Revision	1e0e3868ee06e91ad636a874420e3ca3ae3756ac-refs/branch-heads/5359@{#1016}
OS	macOS Version 13.1 (Build 22C5050e)

Steps:

1. Installed 1.46.133
2. launched Brave
3. set up a Brave VPN connection via account.bravesoftware.com
4. clicked on the VPN button in the toolbar
5. clicked the Gears icon
6. clicked on Contact technical support

Confirmed Your email address text field shows correct validation message Please enter a valid email address for invalid email address

Confirmed validation message Please choose a reason returned for not choosing a Subject

Confirmed validation message This field is required returned for empty body

example	example	example	example