Test if a string is a valid email address using the constraint validation API

validate_email.js

/**
 * Test if a string is a valid email address
 * using the constraint validation API, rather 
 * than unwieldy regular expressions
 *
 * @param {string} value
 * @returns {boolean}
 */
const validateEmail = value => Object.assign(
  document.createElement('input'),
  { type: 'email', value }
).validity.valid

EZ Email Validation

Testing if a string is a valid email address is notoriously difficult -- see this classic SO thread for some impressions. However, in a browser context we can harness the constraint validation API for an easier and more robust solution; the idea is setting the value of an <input type="email"> element and let the internals do the heavy lifting.

Of course, IRL one might reuse the same input element when doing multiple checks, rather than creating a new intermediate one on the fly; the above code is just meant to fit into one LOC (if you wanted to) for illustration purposes. For example, as an ES module:

const input = document.createElement('input')

input.type = 'email'

export const validateEmail = value => {
  input.value = value
  return input.validity.valid
}