361 lines
11 KiB
HTML
361 lines
11 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<script src="../../../resources/js-test-pre.js"></script>
|
|
</head>
|
|
<body>
|
|
<script>
|
|
description('Tests the classList attribute and its properties.');
|
|
|
|
var element;
|
|
|
|
function createElement(className)
|
|
{
|
|
element = document.createElement('p');
|
|
element.className = className;
|
|
}
|
|
|
|
debug('Tests from http://simon.html5.org/test/html/dom/reflecting/DOMTokenList/');
|
|
|
|
// http://simon.html5.org/test/html/dom/reflecting/DOMTokenList/setting/001.htm
|
|
createElement('x');
|
|
element.classList = 'y';
|
|
shouldBeEqualToString('String(element.classList)', 'y');
|
|
|
|
// http://simon.html5.org/test/html/dom/reflecting/DOMTokenList/getting/001.htm
|
|
createElement('');
|
|
shouldEvaluateTo('element.classList.length', 0);
|
|
|
|
// http://simon.html5.org/test/html/dom/reflecting/DOMTokenList/getting/002.htm
|
|
createElement('x');
|
|
shouldEvaluateTo('element.classList.length', 1);
|
|
|
|
// http://simon.html5.org/test/html/dom/reflecting/DOMTokenList/getting/003.htm
|
|
createElement('x x');
|
|
shouldEvaluateTo('element.classList.length', 1);
|
|
|
|
// http://simon.html5.org/test/html/dom/reflecting/DOMTokenList/getting/004.htm
|
|
createElement('x y');
|
|
shouldEvaluateTo('element.classList.length', 2);
|
|
|
|
// http://simon.html5.org/test/html/dom/reflecting/DOMTokenList/getting/005.htm
|
|
createElement('');
|
|
element.classList.add('x');
|
|
shouldBeEqualToString('element.className', 'x');
|
|
|
|
// http://simon.html5.org/test/html/dom/reflecting/DOMTokenList/getting/006.htm
|
|
createElement('x');
|
|
element.classList.add('x');
|
|
shouldBeEqualToString('element.className', 'x');
|
|
|
|
// http://simon.html5.org/test/html/dom/reflecting/DOMTokenList/getting/007.htm
|
|
createElement('x x');
|
|
element.classList.add('x');
|
|
shouldBeEqualToString('element.className', 'x');
|
|
|
|
// http://simon.html5.org/test/html/dom/reflecting/DOMTokenList/getting/008.htm
|
|
createElement('y');
|
|
element.classList.add('x');
|
|
shouldBeEqualToString('element.className', 'y x');
|
|
|
|
// http://simon.html5.org/test/html/dom/reflecting/DOMTokenList/getting/009.htm
|
|
createElement('');
|
|
element.classList.remove('x');
|
|
shouldBeEqualToString('element.className', '');
|
|
|
|
// http://simon.html5.org/test/html/dom/reflecting/DOMTokenList/getting/010.htm
|
|
createElement('x');
|
|
element.classList.remove('x');
|
|
shouldBeEqualToString('element.className', '');
|
|
|
|
// http://simon.html5.org/test/html/dom/reflecting/DOMTokenList/getting/011.htm
|
|
createElement(' y x y ');
|
|
element.classList.remove('x');
|
|
shouldBeEqualToString('element.className', 'y');
|
|
|
|
// http://simon.html5.org/test/html/dom/reflecting/DOMTokenList/getting/012.htm
|
|
createElement(' x y x ');
|
|
element.classList.remove('x');
|
|
shouldBeEqualToString('element.className', 'y');
|
|
|
|
|
|
debug('Ensure that we can handle empty class name correctly');
|
|
element = document.createElement('span');
|
|
shouldBeTrue("element.classList.toggle('x')");
|
|
shouldBeEqualToString('element.className', 'x');
|
|
shouldBeFalse("element.classList.toggle('x')");
|
|
shouldBeEqualToString('element.className', '');
|
|
|
|
element = document.createElement('span');
|
|
shouldBeFalse('element.classList.contains(\'x\')');
|
|
shouldBeUndefined('element.classList[1]');
|
|
element.classList.remove('x');
|
|
element.classList.add('x')
|
|
|
|
|
|
debug('Test toggle with force argument')
|
|
|
|
createElement('');
|
|
shouldBeTrue("element.classList.toggle('x', true)");
|
|
shouldBeEqualToString('element.className', 'x');
|
|
shouldBeTrue("element.classList.toggle('x', true)");
|
|
shouldBeEqualToString('element.className', 'x');
|
|
shouldBeFalse("element.classList.toggle('x', false)");
|
|
shouldBeEqualToString('element.className', '');
|
|
shouldBeFalse("element.classList.toggle('x', false)");
|
|
shouldBeEqualToString('element.className', '');
|
|
|
|
shouldThrowDOMException(function() {
|
|
element.classList.toggle('', true);
|
|
}, DOMException.SYNTAX_ERR);
|
|
|
|
shouldThrowDOMException(function() {
|
|
element.classList.toggle('x y', false);
|
|
}, DOMException.INVALID_CHARACTER_ERR);
|
|
|
|
|
|
debug('Testing add in presence of trailing white spaces.');
|
|
|
|
createElement('x ');
|
|
element.classList.add('y');
|
|
shouldBeEqualToString('element.className', 'x y');
|
|
|
|
createElement('x\t');
|
|
element.classList.add('y');
|
|
shouldBeEqualToString('element.className', 'x y');
|
|
|
|
createElement(' ');
|
|
element.classList.add('y');
|
|
shouldBeEqualToString('element.className', 'y');
|
|
|
|
|
|
debug('Test invalid tokens');
|
|
|
|
// Testing exception due to invalid token
|
|
|
|
// shouldThrow from js-test-pre.js is not sufficient.
|
|
function shouldThrowDOMException(f, ec)
|
|
{
|
|
try {
|
|
f();
|
|
testFailed('Expected an exception');
|
|
} catch (ex) {
|
|
if (!(ex instanceof DOMException)) {
|
|
testFailed('Exception is not an instance of DOMException, found: ' +
|
|
Object.toString.call(ex));
|
|
return;
|
|
}
|
|
if (ec !== ex.code) {
|
|
testFailed('Wrong exception code: ' + ex.code);
|
|
return;
|
|
}
|
|
}
|
|
var formattedFunction = String(f).replace(/^function.+\{\s*/m, '').
|
|
replace(/;?\s+\}/m, '');
|
|
testPassed(formattedFunction + ' threw expected DOMException with code ' + ec);
|
|
}
|
|
|
|
createElement('x');
|
|
shouldBeFalse("element.classList.contains('')");
|
|
|
|
createElement('x y');
|
|
shouldBeFalse("element.classList.contains('x y')");
|
|
|
|
createElement('');
|
|
shouldThrowDOMException(function() {
|
|
element.classList.add('');
|
|
}, DOMException.SYNTAX_ERR);
|
|
|
|
createElement('');
|
|
shouldThrowDOMException(function() {
|
|
element.classList.add('x y');
|
|
}, DOMException.INVALID_CHARACTER_ERR);
|
|
|
|
createElement('');
|
|
shouldThrowDOMException(function() {
|
|
element.classList.remove('');
|
|
}, DOMException.SYNTAX_ERR);
|
|
|
|
createElement('');
|
|
shouldThrowDOMException(function() {
|
|
element.classList.remove('x y');
|
|
}, DOMException.INVALID_CHARACTER_ERR);
|
|
|
|
|
|
|
|
createElement('');
|
|
shouldThrowDOMException(function() {
|
|
element.classList.toggle('');
|
|
}, DOMException.SYNTAX_ERR);
|
|
|
|
createElement('x y');
|
|
shouldThrowDOMException(function() {
|
|
element.classList.toggle('x y');
|
|
}, DOMException.INVALID_CHARACTER_ERR);
|
|
|
|
createElement('');
|
|
shouldThrow("element.classList.toggle()");
|
|
|
|
debug('Indexing');
|
|
|
|
createElement('x');
|
|
shouldBeEqualToString('element.classList[0]', 'x');
|
|
shouldBeEqualToString('element.classList.item(0)', 'x');
|
|
|
|
createElement('x x');
|
|
shouldBeUndefined('element.classList[1]');
|
|
shouldBeNull('element.classList.item(1)');
|
|
|
|
createElement('x y');
|
|
shouldBeEqualToString('element.classList[1]', 'y');
|
|
shouldBeEqualToString('element.classList.item(1)', 'y');
|
|
|
|
createElement('');
|
|
shouldBeUndefined('element.classList[0]');
|
|
shouldBeNull('element.classList.item(0)');
|
|
|
|
createElement('x y z');
|
|
shouldBeUndefined('element.classList[4]');
|
|
shouldBeNull('element.classList.item(4)');
|
|
shouldBeUndefined('element.classList[-1]'); // Not a valid index so should not trigger item().
|
|
shouldBeNull('element.classList.item(-1)');
|
|
shouldThrow('element.classList.item()');
|
|
|
|
debug('Test case since DOMTokenList is case sensitive');
|
|
|
|
createElement('x');
|
|
shouldBeTrue('element.classList.contains(\'x\')');
|
|
shouldBeFalse('element.classList.contains(\'X\')');
|
|
shouldBeEqualToString('element.classList[0]', 'x');
|
|
shouldThrow('element.classList.contains()');
|
|
|
|
createElement('X');
|
|
shouldBeTrue('element.classList.contains(\'X\')');
|
|
shouldBeFalse('element.classList.contains(\'x\')');
|
|
shouldBeEqualToString('element.classList[0]', 'X');
|
|
|
|
|
|
debug('Testing whitespace');
|
|
// U+0020 SPACE, U+0009 CHARACTER TABULATION (tab), U+000A LINE FEED (LF),
|
|
// U+000C FORM FEED (FF), and U+000D CARRIAGE RETURN (CR)
|
|
|
|
createElement('x\u0020y');
|
|
shouldEvaluateTo('element.classList.length', 2);
|
|
|
|
createElement('x\u0009y');
|
|
shouldEvaluateTo('element.classList.length', 2);
|
|
|
|
createElement('x\u000Ay');
|
|
shouldEvaluateTo('element.classList.length', 2);
|
|
|
|
createElement('x\u000Cy');
|
|
shouldEvaluateTo('element.classList.length', 2);
|
|
|
|
createElement('x\u000Dy');
|
|
shouldEvaluateTo('element.classList.length', 2);
|
|
|
|
|
|
debug('DOMTokenList presence and type');
|
|
|
|
|
|
// Safari returns object
|
|
// Firefox returns object
|
|
// IE8 returns object
|
|
// Chrome returns function
|
|
// assertEquals('object', typeof DOMTokenList);
|
|
shouldBeTrue('\'undefined\' != typeof DOMTokenList');
|
|
|
|
shouldBeEqualToString('typeof DOMTokenList.prototype', 'object');
|
|
|
|
createElement('x');
|
|
shouldBeEqualToString('typeof element.classList', 'object');
|
|
|
|
shouldEvaluateTo('element.classList.constructor', 'DOMTokenList');
|
|
|
|
shouldBeTrue('element.classList === element.classList');
|
|
|
|
// Bug 93628
|
|
document.body.classList.add('FAIL');
|
|
shouldBeTrue('document.body.classList.contains("FAIL")');
|
|
document.body.classList.remove('FAIL');
|
|
shouldBeEqualToString('document.body.className', '');
|
|
|
|
// Variadic
|
|
|
|
debug('Variadic calls');
|
|
|
|
createElement('');
|
|
element.classList.add('a', 'b');
|
|
shouldBeEqualToString('element.className', 'a b');
|
|
|
|
element.classList.add('a', 'b', 'c');
|
|
shouldBeEqualToString('element.className', 'a b c');
|
|
|
|
element.classList.add(null, {toString: function() { return 'd' }}, undefined, 0, false);
|
|
shouldBeEqualToString('element.className', 'a b c null d undefined 0 false');
|
|
|
|
createElement('');
|
|
element.classList.add('a', 'b', 'a');
|
|
shouldBeEqualToString('element.className', 'a b');
|
|
|
|
createElement('');
|
|
shouldThrowDOMException(function() {
|
|
element.classList.add('a', 'b', '');
|
|
}, DOMException.SYNTAX_ERR);
|
|
shouldBeEqualToString('element.className', '');
|
|
|
|
shouldThrowDOMException(function() {
|
|
element.classList.add('a', 'b', 'c d');
|
|
}, DOMException.INVALID_CHARACTER_ERR);
|
|
shouldBeEqualToString('element.className', '');
|
|
|
|
shouldThrow('element.classList.add("a", {toString: function() { throw new Error("user error"); }}, "b")', '"Error: user error"');
|
|
shouldBeEqualToString('element.className', '');
|
|
|
|
createElement('');
|
|
shouldNotThrow('element.classList.add()');
|
|
|
|
createElement('');
|
|
var observer = new WebKitMutationObserver(function() {});
|
|
observer.observe(element, {attributes: true});
|
|
element.classList.add('a', 'c');
|
|
shouldBe('observer.takeRecords().length', '1');
|
|
|
|
|
|
createElement('a b c d ');
|
|
element.classList.remove('a', 'c');
|
|
shouldBeEqualToString('element.className', 'b d');
|
|
|
|
element.classList.remove('b', 'b');
|
|
shouldBeEqualToString('element.className', 'd');
|
|
|
|
createElement('a b c null d undefined 0 false');
|
|
element.classList.remove(null, {toString: function() { return 'd' }}, undefined, 0, false);
|
|
shouldBeEqualToString('element.className', 'a b c');
|
|
|
|
createElement('a b');
|
|
shouldThrowDOMException(function() {
|
|
element.classList.remove('a', 'b', '');
|
|
}, DOMException.SYNTAX_ERR);
|
|
shouldBeEqualToString('element.className', 'a b');
|
|
|
|
shouldThrow('element.classList.remove("a", {toString: function() { throw new Error("user error"); }}, "b")', '"Error: user error"');
|
|
shouldBeEqualToString('element.className', 'a b');
|
|
|
|
shouldThrowDOMException(function() {
|
|
element.classList.remove('a', 'b', 'c d');
|
|
}, DOMException.INVALID_CHARACTER_ERR);
|
|
shouldBeEqualToString('element.className', 'a b');
|
|
|
|
shouldNotThrow('element.classList.remove()');
|
|
|
|
createElement('a b c');
|
|
observer = new WebKitMutationObserver(function() {});
|
|
observer.observe(element, {attributes: true});
|
|
element.classList.remove('a', 'c');
|
|
shouldBe('observer.takeRecords().length', '1');
|
|
</script>
|
|
<script src="../../../resources/js-test-post.js"></script>
|
|
</body>
|
|
</html>
|