<!DOCTYPE html>
<title>Input Email</title>
<link rel="author" title="Kazuki Kanamori" href="mailto:yogurito@gmail.com">
<link rel="author" title="Denis Ah-Kang" href="mailto:denis@w3.org">
<link rel="help" href="https://html.spec.whatwg.org/multipage/#e-mail-state-(type=email)">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<input type="email" id="single_email" value="user@example.com"/>
<input type="email" id="multiple_email" value="user1@example.com, user2@test.com" multiple/>
<div id="log"></div>

<script type="text/javascript">
  var single = document.getElementById('single_email'),
      mult = document.getElementById('multiple_email');

  test(function(){
    assert_false(single.multiple);
  }, "single_email doesn't have the multiple attribute");

  test(function(){
    single.value = 'user2@example.com\u000A';
    assert_equals(single.value, 'user2@example.com');
    single.value = 'user3@example.com\u000D';
    assert_equals(single.value, 'user3@example.com');
  }, 'value should be sanitized: strip line breaks');

  test(function(){
    single.value = 'user4@example.com';
    assert_true(single.validity.valid);
    single.value = 'example.com';
    assert_false(single.validity.valid);
  }, 'Email address validity');

  test(function(){
    single.setAttribute('multiple', true);
    single.value = '  user@example.com  , user2@example.com  ';
    assert_equals(single.value, 'user@example.com,user2@example.com');
    single.removeAttribute('multiple');
    assert_equals(single.value, 'user@example.com,user2@example.com');
  }, 'When the multiple attribute is removed, the user agent must run the value sanitization algorithm');

  test(function(){
    assert_true(mult.multiple);
  }, "multiple_email has the multiple attribute");

  test(function(){
    mult.value = '  user1@example.com  , user2@test.com, user3@test.com  ';
    assert_equals(mult.value, 'user1@example.com,user2@test.com,user3@test.com');
  }, "run the value sanitization algorithm after setting a new value");

  test(function(){
    mult.value = 'user1@example.com,user2@test.com,user3@test.com';
    assert_true(mult.validity.valid);

    mult.value = 'u,ser1@example.com,user2@test.com,user3@test.com';
    assert_false(mult.validity.valid);
  }, "valid value is a set of valid email addresses separated by a single ','");
</script>