Email regex validation console warning

Question

I have inherited a B2C application and have noticed that when someone enters an email address into the login form a console error appears saying:

Pattern attribute value ^[a-zA-Z0-9.!#$%&’'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$ is not a valid regular expression: Uncaught SyntaxError: Invalid regular expression: /^[a-zA-Z0-9.!#$%&’'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/v: Invalid character in character class

I have checked the custom policies and there is an email ClaimType with a regex pattern but it is not the same regex. I cannot find the regex in the error message anywhere in the custom policies.

Is this error message coming from somewhere inside my B2C customisations or is this a bug in Microsoft's side?

Answer 1

Azure B2C uses localizations on the frontend to allow for changing text strings like the text in the Sign In button. The email validation regex is one of these localization strings and its default value is the pattern you see within that error message.

This is documented here https://learn.microsoft.com/en-us/azure/active-directory-b2c/localization-string-ids#:~:text=email_pattern,%3C%202.0.0

To change this you will need to add the following section to your custom policies:

<LocalizedResources Id="api.signuporsignin.en">
  <LocalizedStrings>
    <LocalizedString ElementType="UxElement" StringId="email_pattern">{{REGEX}}</LocalizedString>
  </LocalizedStrings>
</LocalizedResources>

This is under the assumption that you are using a content definition version < 2.0.0. So another option would be to update the content definition you are using. You can find more information here: https://learn.microsoft.com/en-us/azure/active-directory-b2c/contentdefinitions.

Hopefully this will fix the issue for you. As for if this is a bug; it is a possibility if you are using an outdated version of the content definitions. I say this as the regex shown is the default value and you do not have this regex in your custom policy.