Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

added input[type=email] test #158

Merged
merged 3 commits into from
Jun 8, 2013
Merged

added input[type=email] test #158

Changes from 1 commit
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
5eab693
added input[type=email] test
yogurito Jun 8, 2013
dfbb97a
removed unnecessary viewport meta tags
yogurito Jun 8, 2013
260b57d
Modified not to use nested test.
yogurito Jun 8, 2013
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
128 changes: 128 additions & 0 deletions html/semantics/forms/the-input-element/email.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,128 @@
<!DOCTYPE html>
<html>
<head>
<title>Input Email</title>
<meta name=viewport content="width=device-width, maximum-scale=1.0, user-scalable=no" />
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

remove

<link rel="author" title="Kazuki Kanamori" href="mailto:yogurito@gmail.com">
<link rel="help" href="http://www.w3.org/TR/2012/CR-html5-20121217/forms.html#e-mail-state-(type=email)">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
</head>
<body>
<h1>Input email</h1>
<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">
// Regexp from http://www.w3.org/html/wg/drafts/html/master/forms.html#e-mail-state-(type=email)
var validEmailRegexp = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/;
test(function(){
assert_equals(document.getElementById('single_email').type, 'email')
}, 'email type supported on input element');
test(function(){
var attributes = document.getElementById('multiple_email').attributes;
assert_equals(attributes.length, 4);
for (var i = 0; i < attributes.length; i++) {
if (attributes[i].name === 'multiple') {
assert_true(true);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Not needed.

return;
}
}
assert_unreached();
}, '"multiple" attribute supported for input:email element');

test(function(){
var element = document.getElementsByTagName('input')[0];
test(function(){
element.value = '';
assert_equals(element.value, '');
}, 'User agents should allow the user to set the value to the empty string');
test(function(){
element.value = 'user@example.com\u000A';
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You should probably use user2@example.com to show (and test) whether it is sanitation or reverting that happens. (+ for all the other instances)

assert_equals(element.value, 'user@example.com');
}, 'User agents must not allow users to insert "LF" (U+000A) character into the value');
test(function(){
element.value = 'user@example.com\u000D';
assert_equals(element.value, 'user@example.com');
}, 'User agents must not allow users to insert "CR" (U+000D) character into the value');
test(function(){
element.value = 'user@example.com';
assert_true(validEmailRegexp.test(element.value));
}, 'The value attribute, if specified and not empty, must have a value that is a single valid e-mail address');
test(function(){
element.setAttribute('multiple', null);
element.value = ' user@example.com , user2@example.com ';
element.removeAttribute('multiple');
assert_equals(element.value, 'user@example.com');
assert_true(validEmailRegexp.test(element.value));
}, 'When the multiple attribute is removed, the user agent must run the value sanitization algorithm')
},
'When the multiple attribute is NOT specified on the element');

test(function(){
var element = document.getElementById('multiple_email');
test(function(){
var values = element.values;
assert_not_equals(typeof values, 'undefined', 'type of values');
assert_equals(values.length, 2);
assert_equals(values[0], 'user1@example.com');
assert_equals(values[1], 'user2@test.com');
}, 'The element\'s values are the result of splitting on commas the element\'s value.');
test(function(){
element.value = '';
var values = element.values;
assert_not_equals(typeof values, 'undefined', 'type of values');
values.push('user,@example.com');
assert_equals(values.length, 0);
}, 'User agents must not allow users to set any individual value to a string containing "," (U+002C) character');
test(function(){
element.value = '';
var values = element.values;
assert_not_equals(typeof values, 'undefined', 'type of values');
values.push('user@e\u000Axample.com');
assert_equals(values.length, 0);
}, 'User agents must not allow users to set any individual value to a string containing "LF" (U+000A) character');
test(function(){
element.value = '';
var values = element.values;
assert_not_equals(typeof values, 'undefined', 'type of values');
values.push('user@e\u000Dxample.com');
assert_equals(values.length, 0);
}, 'User agents must not allow users to set any individual value to a string containing "CR" (U+000D) character');
test(function(){
element.value = ' user1@example.com , user2@test.com, user3@test.com ';
var values = element.values;
assert_not_equals(typeof values, 'undefined', 'type of values');
test(function(){
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Tests inside tests is bad form, because you get different number of tests whether you pass or fail other tests. It's possible to create a wrapper around it that checks prerequisite stuff (that can actually change, no reason if not).

The reason is that some of the big testing systems expect the tests to be equal in number (they track the status of tests), if they just disappear, that's different from a new fail.

assert_equals(values.length, 3);
}, 'Let latest values be a copy of the element\'s values.');
test(function(){
assert_equals(values[0], 'user1@example.com');
assert_equals(values[1], 'user2@test.com');
assert_equals(values[2], 'user3@test.com');
}, 'Strip leading and trailing whitespace from each value in latest values')
test(function(){
assert_equals(element.value, 'user1@example.com,user2@test.com,user3@test.com');
}, 'Let the element\'s value be the result of concatenating all the values in latest values, separating each value from the next by a single "," (U+002C) character, maintaining the list\'s order.');
}, 'Whenever the user changes the element\'s values, the user agent must run the following steps');
test(function(){
element.value = ' user1@example.com , user2@test.com, user3@test.com ';
var values = element.values;
assert_not_equals(typeof values, 'undefined', 'type of values');
test(function(){
assert_equals(values[0], 'user1@example.com');
assert_equals(values[1], 'user2@test.com');
assert_equals(values[2], 'user3@test.com');
}, 'Split on commas the element\'s value, strip leading and trailing whitespace from each resulting token, if any, and let the element\'s values be the (possibly empty) resulting list of (possibly empty) tokens, maintaining the original order.');
test(function(){
assert_equals(element.value, 'user1@example.com,user2@test.com,user3@test.com');
}, 'Let the element\'s value be the result of concatenating the element\'s values, separating each value from the next by a single "," (U+002C) character, maintaining the list\'s order');
}, 'When the multiple attribute is set, the user agent must run the value sanitization algorithm');
}, 'When the mutiple attribute is specified on the element');
</script>

</body>
</html>