yup: yup.string().email() allows invalid email format.

Summary

The validation for yup.string().email() allows an invalid email such as user@example.com..au to be marked as valid.

Yup version 0.26.10

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Reactions: 18
  • Comments: 36 (3 by maintainers)

Most upvoted comments

It’s unlikely to make it into a release. MY option generally for email validation is that we should make it less strict. the only way to properly validate an email address is to send an email to it. More robust regex approaches, always create false positives and false negatives.

ref: https://github.com/jquense/yup/issues/386#issuecomment-450428912

I just did Yup.string().matches() and use another email regex:

/^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/

@jquense, I agree that a single regex cannot cater for all variations in email addresses. However, in this scenario, the part of the email address after the @ is well defined by the RFC spec to require a valid Internet Domain Name.

Given the specification is clear that a domain cannot have two . appearing next to each other, this rule can be added to yup base email regex.

Resources for further reading:

On Twitter, for instance, the example above user@example.com..au is invalid

Screen Shot 2019-08-05 at 23 08 10

I’ve tried another doubtful email format on Yup - user@e.c- and unfortunately string().email() also say is valid 😦 This is the result on Twitter:

Screen Shot 2019-08-05 at 23 08 42

Hello,

For people having the same issue, one solution is to rely on the validator package which have a great email validation mechanism. ==> https://github.com/validatorjs/validator.js/blob/master/src/lib/isEmail.js

To use it with yup :

  const validationSchema = yup.object({
    
    email: yup
      .string()      
      .email("Invalid email format")
      .required("Mail is required")
      .test("is-valid", (message) => `${message.path} is invalid`, (value) => value ? isEmailValidator(value) : new yup.ValidationError("Invalid value")),

  });

Don’t forget to import :

import isEmailValidator from 'validator/lib/isEmail';

And obviously to install validator and @types\validator (as a dev dependency).

is this a valid email ? email : ``@gmail.com yup.email considering it a valid email

Nevermind. I Choose zod.

import z from 'zod'

export const FieldsSchema = z.object({
  email: z.string().email()
})

Yup also considers this: someone@nowhere to be a valid email. The maintainer’s logic for it goes against every major website’s validation paradigms as well. More and more functionality seems to be weirdly implemented with this library that makes me question using it.

@Engr-Sufian that REGX doesn’t work for me… I have below code and it keeps saying invalid email even if I enter a valid one like aaa@yahoo.com

let EMAIL_REGX = `^(([^<>()\[\]\\.,;:\s@"]+(.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@(([[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}])|(([a-zA-Z-0-9]+.)+[a-zA-Z]{2,}))$/`;


let emailSchema = Yup.string()
  .matches(EMAIL_REGX, "Invalid email address");

yum.email is effectively not required here.

I’ve opened a new PR for #751. This includes the length constraints as suggested by @YashdalfTheGray.

It was not merged XD

Sorry to disappoint, @SalahAdDin. The repo maintainers did not want this change and preferred a different approach. As suggested by others, you can look to use a plugin or just use one of the well-tested regexes to validate emails instead of using .email(). Good luck.

Is this ever going to be added? I don’t want to have to make a custom email type with Yup.string().matches() just because of this.

I’ve opened a new PR for this https://github.com/jquense/yup/pull/751. This includes the length constraints as suggested by @YashdalfTheGray.

When I use an empty string or undefined (e.g: const email = "") to yup.string().email() it gets validated, shouldn’t it return a fail in email validation? Yup version: 0.27.0 Browser: Chromium 76.0.3809.100 OS: Ubuntu 18.04

No one cares about accuracy. That’s something programmers might personally care about, but what matters is practicality.

We don’t need comments, internal ips, domainless emails, etc on our websites. It’s just not the practical standard.

Implement a utility function that handles the most common use case, not every single imaginable use case. That’s not what utility/helper functions do.

My email is very simple: julian@coy.cloud. Yet it fails Yup’s current email validation. You are not thinking about your users when you claim they want email validation. You want it.

Validation doesn’t EVER help a user, so practicality is a stretch. If you want a user to be sure not to have a spelling error, make them type it twice. Validation is ONLY useful for the builders of the site.

This is a question of laziness VS doing things the right way. Validation emails are the right way, end of story.

You want a regex? Go for it, the library let’s you make mistakes, if you so choose.

goes against every major website’s validation paradigms as well

It matches how email validation is specced and implemented in every major browser.

Point being? The browser’s implementation is also useless. A utility function’s value should be measured by the utility it provides and the frequency of it’s usage.

It’s rare to need the browser’s (or official spec’s) implementation. It’s most common to need facebook, Twitter, etc implementation. So make that the utility and if people need the super ultra flexible one, make their own regex. (Or make a separate utility func)

I’ve said multiple times before but once more. Accurate email validation is not possible via a regex.

No one cares about accuracy. That’s something programmers might personally care about, but what matters is practicality.

We don’t need comments, internal ips, domainless emails, etc on our websites. It’s just not the practical standard.

Implement a utility function that handles the most common use case, not every single imaginable use case. That’s not what utility/helper functions do.

goes against every major website’s validation paradigms as well

It matches how email validation is specced and implemented in every major browser.

I’ve said multiple times before but once more. Accurate email validation is not possible via a regex. All implementations of regex based email validation fail valid cases, and pass invalid emails. There is only one way to validate an email, you need to send an email to it and have the user verify it. Yup has to have some wrong opinion about this or not offer anything at all. Given that reality we chose to at least match what native email type validation does, and be wrong in the same ways it is.

And just like native validation if you want something better suited to your needs and users, then you should add additional checks to your schema.

let EMAIL_REGX = ^(([^<>()\[\]\\.,;:\s@"]+(.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@(([[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}])|(([a-zA-Z-0-9]+.)+[a-zA-Z]{2,}))$/;

let emailSchema = Yup.string() .matches(EMAIL_REGX, “Invalid email address”);

ok, below expression worked…

let EMAIL_REGX = /^[a-zA-Z0-9_.±]+@[a-zA-Z0-9-]+.[a-zA-Z0-9-.]+$/

@Engr-Sufian that REGX doesn’t work for me… I have below code and it keeps saying invalid email even if I enter a valid one like aaa@yahoo.com

let EMAIL_REGX = `^(([^<>()\[\]\\.,;:\s@"]+(.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@(([[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}])|(([a-zA-Z-0-9]+.)+[a-zA-Z]{2,}))$/`;


let emailSchema = Yup.string()
  .matches(EMAIL_REGX, "Invalid email address");

you’re missing a / in the beginning