Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-08-04 21:20:23 +01:00
Code Issues Projects Releases Packages Wiki Activity

Cargoify servo

Browse source
This commit is contained in:
Jack Moffitt 2014-08-28 09:34:23 -06:00
parent db2f642c32
commit c6ab60dbfc
1761 changed files with 8423 additions and 2294 deletions
Download patch file Download diff file Expand all files Collapse all files

92
tests/content/harness.js Normal file
View file

@ -0,0 +1,92 @@
function _oneline(x) {
var i = x.indexOf("\n");
return (i == -1) ? x : (x.slice(0, i) + "...");
}
var _expectations = 0;
var _tests = 0;
function expect(num) {
_expectations = num;
}
function _fail(s, m) {
_tests++;
// string split to avoid problems with tests that end up printing the value of window._fail.
window.alert(_oneline("TEST-UNEXPECTED" + "-FAIL | " + s + ": " + m));
}
function _pass(s, m) {
_tests++;
window.alert(_oneline("TEST-PASS | " + s + ": " + m));
}
function _printer(opstr, op) {
return function (a, b, msg) {
let f = op(a,b) ? _pass : _fail;
if (!msg) msg = "";
f(a + " " + opstr + " " + b, msg);
};
}
var is = _printer("===", function (a,b) { return a === b; });
var is_not = _printer("!==", function (a,b) { return a !== b; });
var is_a = _printer("is a", function (a,b) { return a instanceof b; });
var is_not_a = _printer("is not a", function (a,b) { return !(a instanceof b); });
var is_in = _printer("is in", function (a,b) { return a in b; });
var is_not_in = _printer("is not in", function (a,b) { return !(a in b); });
var as_str_is = _printer("as string is", function (a,b) { return String(a) == b; });
var lt = _printer("<", function (a,b) { return a < b; });
var gt = _printer(">", function (a,b) { return a > b; });
var leq = _printer("<=", function (a,b) { return a <= b; });
var geq = _printer(">=", function (a,b) { return a >= b; });
var starts_with = _printer("starts with", function (a,b) { return a.indexOf(b) == 0; });
function is_function(val, name) {
starts_with(String(val), "function " + name + "(");
}
function should_throw(f) {
try {
f();
_fail("operation should have thrown but did not");
} catch (x) {
_pass("operation successfully threw an exception", x.toString());
}
}
function should_not_throw(f) {
try {
f();
_pass("operation did not throw an exception");
} catch (x) {
_fail("operation should have not thrown", x.toString());
}
}
function check_selector(elem, selector, matches) {
is(elem.matches(selector), matches);
}
function check_disabled_selector(elem, disabled) {
check_selector(elem, ":disabled", disabled);
check_selector(elem, ":enabled", !disabled);
}
var _test_complete = false;
var _test_timeout = 10000; //10 seconds
function finish() {
if (_expectations > _tests) {
_fail('expected ' + _expectations + ' tests, fullfilled ' + _tests);
}
_test_complete = true;
window.close();
}
function _test_timed_out() {
if (!_test_complete) {
_fail('test timed out (' + _test_timeout/1000 + 's)');
finish();
}
}
setTimeout(_test_timed_out, _test_timeout);

BIN
tests/content/test.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.4 KiB

BIN
tests/content/test.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.1 KiB

12
tests/content/test_DOMParser.html Normal file
View file

@ -0,0 +1,12 @@
<html>
<head>
<script src="harness.js"></script>
<script>
is_function(DOMParser, "DOMParser");
let parser = new DOMParser();
is_a(parser, DOMParser);
is_a(parser.parseFromString("", "text/html"), Document);
finish();
</script>
</head>
</html>

18
tests/content/test_Event.html Normal file
View file

@ -0,0 +1,18 @@
<html>
<head>
<script src="harness.js"></script>
<script>
is_function(Event, "Event");
let ev = new Event("foopy", {cancelable: true});
is_a(ev, Event);
is(ev.type, 'foopy');
is(ev.defaultPrevented, false);
ev.preventDefault();
is(ev.defaultPrevented, true);
finish();
</script>
</head>
</html>

18
tests/content/test_MouseEvent.html Normal file
View file

@ -0,0 +1,18 @@
<html>
<head>
<script src="harness.js"></script>
<script>
is_function(MouseEvent, "MouseEvent");
let ev = new MouseEvent("press", {bubbles: true, screenX: 150, detail: 100});
is_a(ev, Event);
is_a(ev, UIEvent);
is_a(ev, MouseEvent);
is(ev.screenX, 150);
is(ev.detail, 100);
finish();
</script>
</head>
</html>

18
tests/content/test_body_listener.html Normal file
View file

@ -0,0 +1,18 @@
<html>
<head>
<script src="harness.js"></script>
<script>
function check_onload(listener) {
is(listener, window);
var ev = new Event('click', {bubbles: true, cancelable: true});
document.body.dispatchEvent(ev);
}
function check_onclick(listener) {
is(listener, document.body);
finish();
}
</script>
</head>
<body onload="check_onload(this)" onclick="check_onclick(this)">
</body>
</html>

23
tests/content/test_caption.html Normal file
View file

@ -0,0 +1,23 @@
<html>
<head>
<script src="harness.js"></script>
</head>
<table id="t">
<caption id="tcaption">old caption</caption>
</table>
<script>
var t = document.getElementById("t");
var tcaption = document.getElementById("tcaption");
is(t.caption, tcaption);
is(t.caption.innerHTML, "old caption");
var newCaption = document.createElement("caption");
newCaption.innerHTML = "new caption";
t.caption = newCaption;
is(newCaption.parentNode, t);
is(t.caption, newCaption);
finish();
</script>
</html>

18
tests/content/test_click_prevent.html Normal file
View file

@ -0,0 +1,18 @@
<html>
<head>
<script src="./harness.js"></script>
<a id="foo" href="/nonexistent">test link</a>
<script>
var link = document.getElementById('foo');
link.addEventListener('click', function(ev) {
ev.preventDefault();
});
var ev = new Event('click', {bubbles: true, cancelable: true});
link.dispatchEvent(ev);
setTimeout(function() {
is(true, true, "load probably would have occurred by now");
finish();
}, 500);
</script>
</head>
</html>

143
tests/content/test_collections.html Normal file
View file

@ -0,0 +1,143 @@
<html>
<head>
<meta charset="utf-8">
<title>test_binding
page </title>
<base href="./"></base>
<script src="harness.js"></script>
<script>
function check_collection(obj, num, classes, name) {
is_a(obj, HTMLCollection);
is(obj.length, num);
is(obj[obj.length], undefined);
if (classes === undefined)
return;
classes = [Element, HTMLElement].concat(classes);
for (var i=0; i<obj.length; i++) {
is_not(obj[i], undefined);
is(obj[i].tagName, name);
for (var j=0; j<classes.length; j++) {
is_a(obj[i], classes[j]);
}
}
}
function check_tag(tagname, num, classes, tagname_upper) {
if (tagname_upper === undefined)
tagname_upper = tagname.toUpperCase();
check_collection(document.getElementsByTagName(tagname), num, classes, tagname_upper);
}
check_collection(document.links, 1, [HTMLAnchorElement], "A");
check_collection(document.images, 1, [HTMLImageElement], "IMG");
check_collection(document.embeds, 1, [HTMLEmbedElement], "EMBED");
check_collection(document.plugins, 1, [HTMLEmbedElement], "EMBED");
check_collection(document.scripts, 2, [HTMLScriptElement], "SCRIPT");
check_collection(document.applets, 1, [HTMLAppletElement], "APPLET");
check_collection(document.forms, 1, [HTMLFormElement], "FORM");
check_collection(document.getElementsByTagName("nosuchtag"), 0);
check_tag("section", 1, []);
check_tag("aside", 1, []);
check_tag("b", 1, []);
check_tag("i", 1, []);
check_tag("small", 1, []);
check_tag("head", 1, [HTMLHeadElement]);
check_tag("div", 3, [HTMLDivElement]);
check_tag("iframe", 1, [HTMLIFrameElement]);
check_tag("body", 1, [HTMLBodyElement]);
check_tag("area", 1, [HTMLAreaElement]);
check_tag("base", 1, [HTMLBaseElement]);
check_tag("data", 1, [HTMLDataElement]);
check_tag("ol", 1, [HTMLOListElement]);
check_tag("canvas", 1, [HTMLCanvasElement]);
check_tag("source", 2, [HTMLSourceElement]);
check_tag("time", 1, [HTMLTimeElement]);
check_tag("caption", 1, [HTMLTableCaptionElement]);
check_tag("textarea", 1, [HTMLTextAreaElement]);
check_tag("q", 1, [HTMLQuoteElement]);
check_tag("th", 1, [HTMLTableCellElement, HTMLTableHeaderCellElement]);
check_tag("td", 1, [HTMLTableCellElement, HTMLTableDataCellElement]);
check_tag("col", 1, [HTMLTableColElement]);
check_tag("colgroup", 1, [HTMLTableColElement]);
check_tag("input", 2, [HTMLInputElement]);
check_tag("li", 1, [HTMLLIElement]);
check_tag("progress", 1, [HTMLProgressElement]);
check_tag("template", 1, [HTMLTemplateElement]);
check_tag("pre", 1, [HTMLPreElement]);
check_tag("legend", 1, [HTMLLegendElement]);
check_tag("label", 1, [HTMLLabelElement]);
check_tag("track", 1, [HTMLTrackElement]);
check_tag("audio", 1, [HTMLMediaElement, HTMLAudioElement]);
check_tag("video", 1, [HTMLMediaElement, HTMLVideoElement]);
// Test non-ASCII tag names. Uppercasing is ASCII-only per spec:
// http://dom.spec.whatwg.org/#dom-element-tagname
check_tag("foo-á", 1, [HTMLUnknownElement], "FOO-á");
finish();
</script>
</head>
<body>
<div id="first" name="test">fffff<br><br><br><br>fffffffffffffffff</div>
<div id="second">ggg</div>
<span id="third" name="test">hhhhhhhh</span>
<div id="fourth">iiiiiiiiiiiiiiiiiii</div>
<a href="http://www.mozilla.org"></a>
<img src="test.jpg"/>
<embed></embed>
<form>
<fieldset>
<legend>legend</legend>
<label for="">label<input type="text" value="input" /></label>
</fieldset>
</form>
<hr />
<canvas/>
<p>pppppppppp</p>
<q>qqqqqqqqqqqqqqqqqqqqqqqqqqq</q>
<progress max="100" value="80">80%</progress>
<applet></applet>
<input type="text" value="input"/>
<iframe></iframe>
<ol type="1">
<li>li</li>
</ol>
<table>
<caption>sample table</caption>
<colgroup>
<col/>
</colgroup>
<tbody>
<tr><th>head</th></tr>
<tr><td>data</td></tr>
</tbody>
</table>
<section>section</section>
<aside>aside</aside>
<b>b</b>
<i>i</i>
<small>small</small>
<textarea>textarea</textarea>
<time datetime="2014-02-14">Valentines day</time>
<area></area>
<data></data>
<template></template>
<pre>pre</pre>
<audio>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
</audio>
<video src="">
<track></track>
</video>
<foo-á>hi</foo-á>
</body>
</html>

19
tests/content/test_create_element.html Normal file
View file

@ -0,0 +1,19 @@
<html>
<head>
<title></title>
<script src="harness.js"></script>
</head>
<body>
<script>
var elem = document.createElement("foo");
is(elem.tagName, "FOO");
var elem = document.createElement("p");
is_a(elem, HTMLParagraphElement);
var elem = document.createElement("sPAn");
is_a(elem, HTMLSpanElement);
var text = document.createTextNode("hello");
is_a(text, Text);
finish();
</script>
</body>
</html>

13
tests/content/test_documentElement.html Normal file
View file

@ -0,0 +1,13 @@
<html>
<head>
<script src="harness.js"></script>
<script>
is_a(window, Window);
is_a(document.documentElement, HTMLHtmlElement);
is_a(document.documentElement.firstChild, HTMLHeadElement);
is(document.documentElement.nextSibling, null);
is_a(document, Document);
finish();
</script>
</head>
</html>

25
tests/content/test_document_adoptNode.html Normal file
View file

@ -0,0 +1,25 @@
<!DOCTYPE html>
<html>
<head>
<script src="harness.js"></script>
<script>
let foo = document.getElementById("foo");
let doc = document.implementation.createHTMLDocument("title");
is(foo.ownerDocument, document);
let adopted_foo = doc.adoptNode(foo);
is(document.getElementById("foo"), null);
is(foo, adopted_foo);
is(foo.ownerDocument, doc);
is(foo.parentNode, null);
is(foo.childNodes.length, 1);
finish();
</script>
</head>
<body>
<div id="foo"><div id="bar"></div></div>
</body>
</html>

73
tests/content/test_document_body.html Normal file
View file

@ -0,0 +1,73 @@
<html>
<head>
<script src="harness.js"></script>
</head>
<body>
<script>
// test1: existing document's body
{
is_not(document.body, null, "test1-0, existing document's body");
is_a(document.body, HTMLBodyElement, "test1-1, exising document's body");
is(document.body && document.body.tagName, "BODY", "test1-2, existing document's body");
}
// test2: replace document's body with new body
{
let new_body = document.createElement("body");
is_not(new_body, null, "test2-0, replace document's body with new body");
document.body = new_body;
is(new_body, document.body, "test2-1, replace document's body with new body");
}
// test3: replace document's body with new frameset
{
let new_frameset = document.createElement("frameset");
is_not(new_frameset, null, "test2-0, replace document's body with new frameset");
document.body = new_frameset;
is(new_frameset, document.body, "test2-1, replace document's body with new frameset");
}
// test4: append an invalid element to a new document
{
let new_document = new Document();
new_document.appendChild(new_document.createElement("html"));
let new_div = new_document.createElement("div");
is_not(new_div, null, "test4-0, append an invalid element to a new document");
should_throw(function() {
new_document.body = new_div;
});
is(new_document.body, null, "test4-1, append an invalid element to a new document");
}
// test5: append body to a new document
{
let new_document = document.implementation.createHTMLDocument();
let new_body = new_document.createElement("body");
is_not(new_body, null, "test5-0, append body to a new document");
is_a(new_body, HTMLBodyElement, "test5-1, append body to a new document");
is(new_body && new_body.tagName, "BODY", "test5-2, append body to a new document");
new_document.body = new_body;
is(new_document.body, new_body, "test5-3, append body to a new document");
}
// test6: append frameset to a new document
{
let new_document = document.implementation.createHTMLDocument();
let new_frameset = new_document.createElement("frameset");
is_not(new_frameset, null, "test6-0, append frameset to a new document");
is_a(new_frameset, HTMLFrameSetElement, "test6-1, append frameset to a new document");
is(new_frameset && new_frameset.tagName, "FRAMESET", "test6-2, append frameset to a new document");
new_document.body = new_frameset;
is(new_document.body, new_frameset, "test6-3, append frameset to a new document");
}
finish();
</script>
</body>
</html>

21
tests/content/test_document_characterSet.html Normal file
View file

@ -0,0 +1,21 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<html>
<head>
<script src="harness.js"></script>
<script>
// test1: characterSet
{
is(document.characterSet, "utf-8", "test1-0, characterSet");
var xmldoc = new Document;
is(xmldoc.characterSet, "utf-8", "test2-1, characterSet");
var htmldoc = document.implementation.createHTMLDocument("title");
is(htmldoc.characterSet, "utf-8", "test2-2, characterSet");
}
finish();
</script>
</head>
</html>

15
tests/content/test_document_characterSet_default.html Normal file
View file

@ -0,0 +1,15 @@
<!DOCTYPE html>
<html>
<head>
<script src="harness.js"></script>
<script>
// test1: default characterSet
{
// FIXME: https://github.com/mozilla-servo/libhubbub/issues/5
is(document.characterSet, "utf-8", "test1-0, default characterSet");
}
finish();
</script>
</head>
</html>

15
tests/content/test_document_characterSet_invalid.html Normal file
View file

@ -0,0 +1,15 @@
<!DOCTYPE html>
<meta charset="unknown-charset">
<html>
<head>
<script src="harness.js"></script>
<script>
// test1: unknown charset
{
is(document.characterSet, "utf-8", "test1-0, unknown charset");
}
finish();
</script>
</head>
</html>

15
tests/content/test_document_characterSet_long.html Normal file
View file

@ -0,0 +1,15 @@
<!DOCTYPE html>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<html>
<head>
<script src="harness.js"></script>
<script>
// test1: long charset
{
is(document.characterSet, "windows-1252", "test1-0, long charset");
}
finish();
</script>
</head>
</html>

15
tests/content/test_document_characterSet_short.html Normal file
View file

@ -0,0 +1,15 @@
<!DOCTYPE html>
<meta charset="iso-8859-1">
<html>
<head>
<script src="harness.js"></script>
<script>
// test1: short charset
{
is(document.characterSet, "windows-1252", "test1-0, short charset");
}
finish();
</script>
</head>
</html>

21
tests/content/test_document_compatMode.html Normal file
View file

@ -0,0 +1,21 @@
<html>
<head>
<script src="harness.js"></script>
<script>
// test1: BackCompat
{
is(document.compatMode, "BackCompat", "test1-0, BackCompat");
}
// test2: Non-parsed documents
{
var xmldoc = new Document;
is(xmldoc.compatMode, "CSS1Compat", "test2-0, Non-parsed documents");
var htmldoc = document.implementation.createHTMLDocument("title");
is(htmldoc.compatMode, "CSS1Compat", "test2-1, Non-parsed documents");
}
finish();
</script>
</head>
</html>

13
tests/content/test_document_compatMode_loose.html Normal file
View file

@ -0,0 +1,13 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
<head>
<script src="harness.js"></script>
<script>
// test1: Loose HTML
{
is(document.compatMode, "BackCompat", "test1-0, Loose HTML");
}
finish();
</script>
</head>
</html>

13
tests/content/test_document_compatMode_strict.html Normal file
View file

@ -0,0 +1,13 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<script src="harness.js"></script>
<script>
// test1: Strict HTML
{
is(document.compatMode, "CSS1Compat", "test1-0, Strict HTML");
}
finish();
</script>
</head>
</html>

22
tests/content/test_document_contenttype.html Normal file
View file

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html>
<head>
<script src="harness.js"></script>
<script>
// test1: HTML document
{
is_a(document, Document, "test1-0, HTML document");
is(document.contentType, "text/html", "test1-1, HTML document");
}
// test2: XML document
{
var doc = new Document;
is_a(doc, Document, "test2-0, XML document");
is(doc.contentType, "application/xml", "test2-1, XML document");
}
finish();
</script>
</head>
</html>

20
tests/content/test_document_datalist_options.html Normal file
View file

@ -0,0 +1,20 @@
<html>
<head>
<script src="harness.js"></script>
</head>
<datalist id="id">
<option value="A">
<option value="B">
<p>P</p>
<div>DIV</div>
<option value="C">
</datalist>
<script>
var datalist = document.getElementById("id");
is(datalist.options.length, 3);
is_a(datalist.options[0], HTMLOptionElement);
is_a(datalist.options[1], HTMLOptionElement);
is_a(datalist.options[2], HTMLOptionElement);
finish();
</script>
</html>

26
tests/content/test_document_getElementById.html Normal file
View file

@ -0,0 +1,26 @@
<html>
<head id="foo">
<title></title>
<script src="harness.js"></script>
</head>
<body>
<div id="bar"></div>
<script>
let gBody = document.getElementsByTagName("body")[0];
// Test the assertion with inserting node with child having id into the document (mozilla#2630)
// This need not to port to WPF-test because this tests servo's internally flags.
{
let TEST_ID = "test-9";
let a = document.createElement("a");
let b = document.createElement("b");
a.appendChild(b).id = TEST_ID;
gBody.appendChild(a);
let result = document.getElementById(TEST_ID);
is(result, b, "test 9-0");
}
finish();
</script>
</body>
</html>

15
tests/content/test_document_getElementsByName.html Normal file
View file

@ -0,0 +1,15 @@
<html>
<head >
<title></title>
<script src="harness.js"></script>
</head>
<body>
<div name="foo"></div>
<script>
let nameList = document.getElementsByName("foo");
is_a(nameList, NodeList);
is_not_a(nameList, HTMLCollection);
finish();
</script>
</body>
</html>

46
tests/content/test_document_head.html Normal file
View file

@ -0,0 +1,46 @@
<html>
<head>
<script src="harness.js"></script>
</head>
<body>
<script>
// test1: existing document's head
{
is_not(document.head, null, "test1-0, existing document's head");
is_a(document.head, HTMLHeadElement, "test1-1, exising document's head");
is(document.head && document.head.tagName, "HEAD", "test1-2, existing document's head");
}
// test2: append head to a new document
{
let new_document = new Document();
new_document.appendChild(new_document.createElement("html"));
let new_head = new_document.createElement("head");
is_not(new_head, null, "test2-0, append head to a new document");
is_a(new_head, HTMLHeadElement, "test2-1, append head to a new document");
is(new_head && new_head.tagName, "head", "test2-2, append head to a new document");
// Document::head is read-only.
new_document.head = new_head;
is(new_document.head, null, "test2-3, append head to a new document");
new_document.documentElement.appendChild(new_head);
is(new_document.head, new_head, "test2-4, append head to a new document");
}
// test3: head's parent should be document element
{
let new_document = new Document();
let html = new_document.createElement("html");
let foo = new_document.createElement("foo");
let head = new_document.createElement("head");
new_document.appendChild(html);
html.appendChild(foo);
foo.appendChild(head);
is(new_document.head, null, "test3-0, head's parent should be document element");
}
finish();
</script>
</body>
</html>

81
tests/content/test_document_implementation.html Normal file
View file

@ -0,0 +1,81 @@
<html>
<head>
<script src="harness.js"></script>
<script>
// test1: basic test
{
is_not(document.implementation, null, "test1-0, basic test");
is_a(document.implementation, DOMImplementation, "test1-1, basic test");
var implementation = document.implementation;
is(document.implementation, implementation, "test1-2, basic test");
}
// test2: createDocumentType
{
is(document.doctype, null, "test2-0, createDocumentType");
var doctype = document.implementation.createDocumentType("html", null, null);
is_a(doctype && doctype, DocumentType, "test2-1, createDocumentType");
doctype = document.implementation.createDocumentType("html:html", null, null);
is_a(doctype && doctype, DocumentType, "test2-2, createDocumentType");
}
// test3: createHTMLDocument
{
var htmldoc = document.implementation.createHTMLDocument("example title");
is_not(htmldoc, null, "test3-0, createHTMLDocument");
is_a(htmldoc, Document, "test3-1, createHTMLDocument");
is(htmldoc.childNodes.length, 2, "test3-3, createHTMLDocument");
is_a(htmldoc.doctype && htmldoc.doctype, DocumentType, "test3-4, createHTMLDocument");
is(htmldoc.doctype.name, "html", "test3-5, createHTMLDocument");
is_a(htmldoc.documentElement && htmldoc.documentElement, HTMLHtmlElement, "test3-6, createHTMLDocument");
is(htmldoc.documentElement.childNodes.length, 2, "test3-7, createHTMLDocument");
is(htmldoc.documentElement.tagName, "HTML", "test3-8, createHTMLDocument");
is_a(htmldoc.head && htmldoc.head, HTMLHeadElement, "test3-9, createHTMLDocument");
is(htmldoc.head.tagName, "HEAD", "test3-10, createHTMLDocument");
is(htmldoc.head, htmldoc.documentElement.childNodes[0], "test3-11, createHTMLDocument");
is(htmldoc.head.childNodes.length, 1, "test3-12, createHTMLDocument");
is_a(htmldoc.head.childNodes[0], HTMLTitleElement, "test3-13, createHTMLDocument");
is(htmldoc.head.childNodes[0].tagName, "TITLE", "test3-14, createHTMLDocument");
is(htmldoc.title, "example title", "test3-15, createHTMLDocument");
is_a(htmldoc.body && htmldoc.body, HTMLBodyElement, "test3-16, createHTMLDocument");
is(htmldoc.body.tagName, "BODY", "test3-17, createHTMLDocument");
is(htmldoc.body, htmldoc.documentElement.childNodes[1], "test3-18, createHTMLDocument");
is(htmldoc.body.childNodes.length, 0, "test3-19, createHTMLDocument");
}
// test4: createDocument
{
var doc = document.implementation.createDocument('http://www.w3.org/1999/xhtml', 'html', null);
is_not(doc, null, "test4-0, createDocument");
is_a(doc, Document, "test4-1, createDocument");
is(doc.childNodes.length, 1, "test4-2, createDocument");
is(doc.doctype, null, "test4-3, createDocument");
is_a(doc.documentElement, HTMLHtmlElement, "test4-4, createDocument");
var doctype = document.implementation.createDocumentType("html", null, null);
doc = document.implementation.createDocument('http://www.w3.org/1999/xhtml', 'html', doctype);
is(doc.childNodes.length, 2, "test4-5, createDocument");
is(doc.doctype, doctype, "test4-6, createDocument");
is_a(doc.documentElement, HTMLHtmlElement, "test4-7, createDocument");
doctype = document.implementation.createDocumentType(
'svg:svg', '-//W3C//DTD SVG 1.1//EN',
'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd');
doc = document.implementation.createDocument('http://www.w3.org/2000/svg', 'svg:svg', doctype);
is(doc.childNodes.length, 2, "test4-8, createDocument");
is(doc.doctype, doctype, "test4-9, createDocument");
is_a(doc.documentElement, Element, "test4-10, createDocument");
}
finish();
</script>
</head>
</html>

37
tests/content/test_document_links_cache.html Normal file
View file

@ -0,0 +1,37 @@
<!DOCTYPE html>
<html>
<head>
<script src="harness.js"></script>
<script>
var links = document.links;
is(links, document.links);
is(links.length, 0);
var anchor = document.createElement("a");
anchor.id = "anchor-with-href";
anchor.setAttribute("href", "http://www.google.com");
document.body.appendChild(anchor);
is(links.length, 1);
anchor = document.createElement("a");
anchor.id = "anchor-without-href";
document.body.appendChild(anchor);
is(links.length, 1);
anchor.setAttribute("href", "http://www.google.com");
is(links.length, 2);
anchor.removeAttribute("href", "http://www.google.com");
is(links.length, 1);
document.body.removeChild(document.getElementById("anchor-without-href"));
is(links.length, 1);
document.body.removeChild(document.getElementById("anchor-with-href"));
is(links, document.links);
is(links.length, 0);
finish();
</script>
</head>
</html>

19
tests/content/test_document_set_node_value.html Normal file
View file

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html>
<script src="harness.js"></script>
<body>
<div id="div" class="div-class">A</div>
<p>P</p>
<script>
is(document.nodeValue, null);
var div = document.getElementById("div");
is(div.nodeValue, null);
is(div.firstChild.nodeValue, "A");
div.firstChild.nodeValue = "B";
is(div.firstChild.nodeValue, "B");
var commentNode = document.createComment("comment node");
is(commentNode.nodeValue, "comment node");
finish();
</script>
</body>
</html>

9
tests/content/test_document_title_nontextchildren.html Normal file
View file

@ -0,0 +1,9 @@
<html>
<title>x</title>
<script src="harness.js"></script>
<script>
document.head.firstChild.appendChild(document.createElement("foo"));
is(document.title, "x");
finish();
</script>
</html>

32
tests/content/test_document_url.html Normal file
View file

@ -0,0 +1,32 @@
<!doctype html>
<html>
<head>
<title></title>
<script src="harness.js"></script>
<script>
// test1: URL & documentURI
{
is_not(document.URL, null, "test1-0, URL & documentURI");
is_not(document.documentURI, null, "test1-1, URL & documentURI");
is(document.URL, document.documentURI, "test1-2, URL & documentURI");
}
// test2: new document
{
var doc = new Document();
is(doc.URL, "about:blank", "test2-0, new document");
}
// test3: current document
{
var url = document.URL.split("/");
is(url[0], "file:", "test3-0, current document");
is(url[url.length-1], "test_document_url.html", "test3-1, current document");
}
finish();
</script>
</head>
<body>
</body>
</html>

45
tests/content/test_domtokenlist.html Normal file
View file

@ -0,0 +1,45 @@
<!DOCTYPE html>
<html>
<head>
<script src="harness.js"></script>
<script>
var div = document.createElement("div");
var classList = div.classList;
is(classList.length, 0);
is(classList.item(0), null);
should_throw(function () {
classList.contains("");
});
should_throw(function () {
classList.contains(" ");
});
var list = ["foo", " foo", "foo ", " foo ", " foo "];
for(var i = 0; i < list.length; i++) {
div.className = list[i];
is(div.className, list[i]);
is(classList.length, 1);
is(classList.item(0), "foo");
is(classList.item(1), null);
is(classList.contains("foo"), true);
is(classList.contains("bar"), false);
}
list = ["foo bar", " foo bar", " foo bar ", " foo bar "];
for(var i = 0; i < list.length; i++) {
div.className = list[i];
is(div.className, list[i]);
is(classList.length, 2);
is(classList.item(0), "foo");
is(classList.item(1), "bar");
is(classList.item(2), null);
is(classList.contains("foo"), true);
is(classList.contains("bar"), true);
is(classList.contains("baz"), false);
}
finish();
</script>
</head>
</html>

66
tests/content/test_element_attribute.html Normal file
View file

@ -0,0 +1,66 @@
<html>
<head id="foo">
<title></title>
<script src="harness.js"></script>
</head>
<body>
<div id="test" foo="bar"></div>
<script>
let test = document.getElementById("test");
{
let r1 = test.getAttribute("id");
is(r1, "test", "test1-0, Element.getAttribute().");
let r2 = test.getAttribute("foo");
is(r2, "bar", "test1-1, Element.getAttribute().");
}
{
let NAME = "hoge";
let VALUE = "fuga";
test.setAttribute(NAME, VALUE);
let r = test.getAttribute(NAME);
is(r, VALUE, "test2. Element.setAttribute().");
}
{
let NAME = "foo";
let VALUE = "mozilla";
test.setAttribute(NAME, VALUE);
let r = test.getAttribute(NAME);
is(r, VALUE, "test3, attribute update by Element.setAttribute().")
}
{
test.setAttribute("id", "bar");
test.removeAttribute("id");
let r1 = test.hasAttribute("id");
is(r1, false, "test4-0, Element.removeAttribute().");
let r2 = test.getAttribute("id");
is(r2, null, "test4-1, Element.removeAttribute().");
}
{
test.setAttribute("xml:lang", "en");
let r1 = test.hasAttribute("xml:lang");
is(r1, true, "test5-0, Element.setAttribute('xml:lang').");
let r2 = test.getAttribute("xml:lang");
is_not(r2, null, "test5-1, Element.setAttribute('xml:lang').");
}
should_throw(function () {
test.setAttributeNS("http://example.com", "xmlns", "foo");
});
should_throw(function () {
test.setAttributeNS("http://www.w3.org/2000/xmlns/", "attr", "value");
});
should_throw(function () {
test.setAttributeNS("http://www.w3.org/2000/xmlns/", "prefix:attr", "value");
});
finish();
</script>
</body>
</html>

21
tests/content/test_element_attributes.html Normal file
View file

@ -0,0 +1,21 @@
<html>
<head id="foo">
<script src="harness.js"></script>
</head>
<body>
<div></div>
<script>
var attrs = [];
for (var i = 'a'.charCodeAt(0); i != 'z'.charCodeAt(0); i++) {
document.getElementsByTagName('div')[0].setAttribute(String.fromCharCode(i),
i.toString());
}
var attributes = document.getElementsByTagName('div')[0].attributes;
for (var i = 0; i < attributes.length; i++) {
is(attributes[i].name, String.fromCharCode(i + 'a'.charCodeAt(0)));
is(attributes[i].value, (i + 'a'.charCodeAt(0)).toString());
}
finish();
</script>
</body>
</html>

21
tests/content/test_element_classList.html Normal file
View file

@ -0,0 +1,21 @@
<!-- Remove this and update WPT metadata once DOMTokenList.toggle (#3138) is implemented. -->
<!DOCTYPE html>
<html>
<head>
<script src="harness.js"></script>
<script>
let div = document.createElement("div");
div.className = "foo bar";
let classList = div.classList;
div.className = "";
is(classList.item(0), null, "classList.item(0) must return null when all classes have been removed");
is(classList[0], undefined, "classList[0] must be undefined when all classes have been removed");
finish();
</script>
</head>
<body>
</body>
</html>

38
tests/content/test_element_className.html Normal file
View file

@ -0,0 +1,38 @@
<!DOCTYPE html>
<html>
<head>
<script src="harness.js"></script>
<script>
let foo1 = document.getElementById("foo-1");
let foo2 = document.getElementById("foo-2");
foo1.className += " bar";
is(foo1.className, "foo bar");
let foo3 = document.createElement("div");
foo3.id = "foo-3";
foo3.className = "foo";
document.body.appendChild(foo3);
is(foo3, document.getElementById("foo-3"));
let collection = document.getElementsByClassName("foo");
is(collection.length, 2);
is(collection[0].id, foo1.id);
is(collection[1].id, foo3.id);
collection = document.getElementsByClassName("bar");
is(collection.length, 1);
is(collection[0].id, foo1.id);
collection = document.getElementsByClassName("baz");
is(collection.length, 1);
is(collection[0].id, foo2.id);
finish();
</script>
</head>
<body>
<div id="foo-1" class="foo"></div>
<div id="foo-2" class="baz"></div>
</body>
</html>

18
tests/content/test_element_matches.html Normal file
View file

@ -0,0 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<script src="harness.js"></script>
</head>
<body>
<div id="foo"></div>
<script>
let test = document.getElementById("foo");
is(test.matches("#foo"), true, "test-1");
is(test.matches("#not-foo"), false, "test-2");
finish();
</script>
</body>
</html>

18
tests/content/test_empty_clientrect.html Normal file
View file

@ -0,0 +1,18 @@
<html>
<head>
<script src="harness.js"></script>
<script>
var rect = window.document.head.getBoundingClientRect();
var rects = window.document.head.getClientRects();
is_a(rect, DOMRect);
is(rect.top, 0);
is(rect.bottom, 0);
is(rect.left, 0);
is(rect.right, 0);
is(rect.width, 0);
is(rect.height, 0);
is(rects.length, 0);
finish();
</script>
</head>
</html>

181
tests/content/test_enabled_disabled_selectors.html Normal file
View file

@ -0,0 +1,181 @@
<!DOCTYPE html>
<html>
<head>
<title>Tests for :enabled and :disabled selectors</title>
<script src="harness.js"></script>
<script>
{ // Simple initialization checks.
var list, i, elem;
// Examples of elements which are never :enabled or :disabled.
list = ['div', 'p', 'body', 'head', 'span'];
for(i = 0; i < list.length; i++) {
elem = document.createElement(list[i]);
check_selector(elem, ":enabled", false);
check_selector(elem, ":disabled", false);
}
// Anchor, Area and Link are :enabled with an href, but never :disabled.
list = ["a", "area", "link"];
for(i = 0; i < list.length; i++) {
elem = document.createElement(list[i]);
check_selector(elem, ":enabled", false);
check_selector(elem, ":disabled", false);
elem.setAttribute("href", "");
check_selector(elem, ":enabled", true);
check_selector(elem, ":disabled", false);
}
// These are :enabled (and not :disabled) by default.
// XXX: Add 'menuitem' here whenever available.
list = ['button', 'input', 'select', 'textarea', 'optgroup', 'option', 'fieldset'];
for(i = 0; i < list.length; i++) {
elem = document.createElement(list[i]);
check_disabled_selector(elem, false);
}
}
{ // Document elements tests.
var click_count = 0;
var click_event = new Event('click', {bubbles: true, cancelable: true});
var list, elem1, elem2, elem3, elem4, elem5;
function on_click(ev) { click_count++; }
list = ['button', 'input', 'option', 'select', 'textarea'];
for(i = 0; i < list.length; i++) {
click_count = 0;
elem1 = document.getElementById(list[i] + "-1");
is(elem1.disabled, false);
elem1.addEventListener('click', on_click);
elem1.dispatchEvent(click_event);
is(click_count, 1);
elem2 = document.getElementById(list[i] + "-2");
is(elem2.disabled, true);
// Only user-generated click events are prevented.
elem2.addEventListener('click', on_click);
elem2.dispatchEvent(click_event);
is(click_count, 2);
// This should look disabled, though - missing UA's CSS for :disabled?
elem3 = document.getElementById(list[i] + "-3");
is(elem3.disabled, false);
if (list[i] == 'option') { continue; }
elem4 = document.getElementById(list[i] + "-4");
is(elem4.disabled, false);
// This should look disabled, though - missing UA's CSS for :disabled?
elem5 = document.getElementById(list[i] + "-5");
is(elem5.disabled, false);
}
}
{ // JS tests (Button, Input, Select, TextArea).
var list = ['button', 'input', 'select', 'textarea'];
var fieldset = document.createElement("fieldset");
fieldset.disabled = true;
var div = document.createElement("div");
var elem;
for(i = 0; i < list.length; i++) {
elem = document.createElement(list[i]);
check_disabled_selector(elem, false);
div.appendChild(elem);
check_disabled_selector(elem, false);
fieldset.appendChild(div);
check_disabled_selector(elem, true);
document.body.appendChild(fieldset);
check_disabled_selector(elem, true);
document.body.removeChild(fieldset);
check_disabled_selector(elem, true);
fieldset.removeChild(div);
check_disabled_selector(elem, false);
div.removeChild(elem);
check_disabled_selector(elem, false);
}
}
{ // JS tests (Option).
var optgroup = document.createElement("optgroup");
optgroup.disabled = true;
var option = document.createElement("option");
check_disabled_selector(option, false);
optgroup.appendChild(option);
check_disabled_selector(option, true);
document.body.appendChild(optgroup);
check_disabled_selector(option, true);
document.body.removeChild(optgroup);
check_disabled_selector(option, true);
optgroup.removeChild(option);
check_disabled_selector(option, false);
}
finish();
</script>
</head>
<body>
<button id="button-1"></button>
<button id="button-2" disabled></button>
<input id="input-1"></input>
<input id="input-2" disabled></input>
<option id="option-1"></option>
<option id="option-2" disabled></option>
<select id="select-1"></select>
<select id="select-2" disabled></select>
<textarea id="textarea-1"></textarea>
<textarea id="textarea-2" disabled></textarea>
<optgroup disabled>
<option id="option-3"></option>
</optgroup>
<fieldset disabled>
<fieldset>
<button id="button-3"></button>
<input id="input-3"></input>
<select id="select-3"></select>
<textarea id="textarea-3"></textarea>
</fieldset>
</fieldset>
<fieldset disabled>
<legend>
<button id="button-4"></button>
<input id="input-4"></input>
<select id="select-4"></select>
<textarea id="textarea-4"></textarea>
</legend>
</fieldset>
<fieldset disabled>
<legend></legend>
<legend>
<button id="button-5"></button>
<input id="input-5"></input>
<select id="select-5"></select>
<textarea id="textarea-5"></textarea>
</legend>
</fieldset>
</body>
</html>

51
tests/content/test_event_dispatch.html Normal file
View file

@ -0,0 +1,51 @@
<html>
<head>
<script src="harness.js"></script>
</head>
<body>
<span>Paragraph containing <div>event listener</div>.</span>
<script>
var bodyTimes = 0;
function bodyListener(ev) {
bodyTimes++;
is(ev.currentTarget, document.getElementsByTagName('body')[0]);
is(ev.target, document.getElementsByTagName('div')[0]);
if (bodyTimes == 1) {
is(ev.eventPhase, ev.CAPTURING_PHASE);
} else if (bodyTimes == 2) {
is(ev.eventPhase, ev.BUBBLING_PHASE);
}
}
var spanTimes = 0;
function spanListener(ev) {
is(ev.currentTarget, document.getElementsByTagName('span')[0]);
is(ev.target, document.getElementsByTagName('div')[0]);
is(ev.eventPhase, ev.BUBBLING_PHASE);
spanTimes++;
}
var divTimes = 0;
function divListener(ev) {
var self = document.getElementsByTagName('div')[0];
is(ev.currentTarget, self);
is(ev.target, self);
is(ev.eventPhase, ev.AT_TARGET);
divTimes++;
}
document.getElementsByTagName('body')[0].addEventListener("foopy", bodyListener, true);
document.getElementsByTagName('body')[0].addEventListener("foopy", bodyListener, false);
document.getElementsByTagName('span')[0].addEventListener("foopy", spanListener, false);
document.getElementsByTagName('div')[0].addEventListener("foopy", divListener, false);
var ev = new Event('foopy', {bubbles: true});
is(ev.bubbles, true);
document.getElementsByTagName('div')[0].dispatchEvent(ev);
is(bodyTimes, 2, 'body listener should be called multiple times');
is(divTimes, 1, 'target listener should be called once');
is(spanTimes, 1, 'span listener should be called while bubbling');
finish();
</script>
</body>
</html>

21
tests/content/test_event_dispatch_dynamic.html Normal file
View file

@ -0,0 +1,21 @@
<!DOCTYPE html>
<script src="harness.js"></script>
<b><b><b></b></b></b>
<script>
var sawmiddle = -1;
var sawouter = -1;
var step = 0;
var outerb = document.getElementsByTagName('b')[0];
var middleb = outerb.firstChild;
var innerb = middleb.firstChild;
outerb.addEventListener("x", function() {
middleb.addEventListener("x", function() {
sawmiddle = step++;
}, true);
sawouter = step++;
}, true);
innerb.dispatchEvent(new Event("x"));
is(sawmiddle, 1);
is(sawouter, 0);
finish();
</script>

42
tests/content/test_event_dispatch_order.html Normal file
View file

@ -0,0 +1,42 @@
<html>
<head>
<script src="harness.js"></script>
</head>
<body>
<div id="foo"></div>
<script>
var sawBubble = false;
var sawCapture = false;
var sawBubbleTwice = false;
function handler(ev) {
is(ev.eventPhase, ev.AT_TARGET);
is(sawBubble, false);
is(sawCapture, false);
sawBubble = true;
}
function handler2(ev) {
is(ev.eventPhase, ev.AT_TARGET);
is(sawBubble, true);
is(sawCapture, false);
sawCapture = true;
}
function handler3(ev) {
is(ev.eventPhase, ev.AT_TARGET);
is(sawBubble, true);
is(sawCapture, true);
sawBubbleTwice = true;
}
var target = document.getElementById('foo');
target.addEventListener('foopy', handler, false);
target.addEventListener('foopy', handler2, true);
target.addEventListener('foopy', handler3, false);
var ev = new Event('foopy', {bubbles: true});
target.dispatchEvent(ev);
is(sawBubble, true);
is(sawCapture, true);
is(sawBubbleTwice, true);
finish();
</script>
</body>
</html>

23
tests/content/test_event_handler_syntax_error.html Normal file
View file

@ -0,0 +1,23 @@
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="UTF-8">
<script src="harness.js"></script>
</head>
<body>
<a id="a" onclick="{">link</a>
<script>
var a = document.getElementById("a");
is(a.onclick, null, "invalid onclick attribute");
document.body.setAttribute("onx", "{");
document.body.setAttribute("ony", "}");
is(document.body.getAttribute("onx"), "{");
is(document.body.getAttribute("ony"), "}");
finish();
</script>
</body>
</html>

39
tests/content/test_event_listener.html Normal file
View file

@ -0,0 +1,39 @@
<html>
<head>
<script src="harness.js"></script>
</head>
<body>
<script>
function onFoopy(ev) {
window.removeEventListener('foopy', onFoopy);
is(ev instanceof expected, true);
is(ev.type, 'foopy');
}
var expected;
var events = [['HTMLEvents', Event, function(ev) { ev.initEvent('foopy', true, true); }],
['UIEvents', UIEvent, function(ev) { ev.initUIEvent('foopy', true, true, null, 0); }],
['MouseEvents', MouseEvent,
function(ev) { ev.initMouseEvent('foopy', true, true, null, 0,
0, 0, 0, 0, false, false,
false, false, 0, null); }]];
for (var i = 0; i < events.length; i++) {
addEventListener('foopy', onFoopy);
expected = events[i][1];
var ev = document.createEvent(events[i][0]);
events[i][2](ev);
window.dispatchEvent(ev);
}
var constructors = [Event, UIEvent, MouseEvent];
for (var i = 0; i < constructors.length; i++) {
addEventListener('foopy', onFoopy);
expected = constructors[i];
var ev = new constructors[i]('foopy', {cancelable: true, bubbles: true});
window.dispatchEvent(ev);
}
finish();
</script>
</body>
</html>

35
tests/content/test_getBoundingClientRect.html Normal file
View file

@ -0,0 +1,35 @@
<html>
<head>
<script src="harness.js"></script>
<script>
is_function(DOMRect, "DOMRect");
var elems = document.getElementsByTagName('div');
var rect = elems[0].getBoundingClientRect();
is_a(rect, DOMRect);
geq(rect.top, 100);
geq(rect.bottom, 200);
geq(rect.left, 100);
geq(rect.right, 200);
is(rect.width, 100);
is(rect.height, 100);
is(rect.width, rect.right - rect.left);
is(rect.height, rect.bottom - rect.top);
finish();
</script>
<style>
div {
margin-top: 100px;
margin-left: 100px;
width: 100px;
height: 100px;
}
</style>
</head>
<body>
<div>my div</div>
</body>
</html>

13
tests/content/test_global.html Normal file
View file

@ -0,0 +1,13 @@
<html>
<head>
<script src="harness.js"></script>
<script>
is(window, window.window);
is(window, this);
for (var key in this) {
is(this[key], window[key]);
}
finish();
</script>
</head>
</html>

119
tests/content/test_htmlcollection.html Normal file
View file

@ -0,0 +1,119 @@
<!DOCTYPE html>
<html>
<head>
<script src="harness.js"></script>
<script>
let foo1 = document.getElementById("foo-1");
let foo2 = document.getElementById("foo-2");
let bar = document.getElementById("bar");
let live = document.getElementById("live");
let child = document.createElement("p");
let p1 = document.getElementById("p1");
let p2 = document.getElementById("p2");
let p3 = document.getElementById("p3");
let htmlcollection = null;
// test1: HTMLCollection interface
{
htmlcollection = document.getElementsByClassName("foo");
is(htmlcollection.length, 2);
is(htmlcollection.item(0), foo1);
is(htmlcollection.item(1), foo2);
is(htmlcollection.item(2), null);
is(htmlcollection.namedItem("foo-1"), foo1);
is(htmlcollection.namedItem("bar"), null);
htmlcollection = document.getElementsByClassName("FOO");
is(htmlcollection.length, 0);
htmlcollection = document.getElementsByClassName("bar");
is(htmlcollection.length, 1);
is(htmlcollection.item(0), bar);
is(htmlcollection.item(1), null);
is(htmlcollection.namedItem("bar"), bar);
}
// test2: live HTMLCollection
{
htmlcollection = document.getElementsByClassName("live");
is(htmlcollection.length, 1);
is(htmlcollection.item(0), live);
let new_live = document.createElement("div");
new_live.className = "live";
document.body.appendChild(new_live);
is(htmlcollection.length, 2);
is(htmlcollection.item(1), new_live);
document.body.removeChild(new_live);
is(htmlcollection.length, 1);
}
// test3: getElementsByTagName
{
is(document.getElementsByTagName("DIV").length, 5);
is(document.getElementsByTagName("div").length,
document.documentElement.getElementsByTagName("div").length);
is(document.getElementsByTagName("p").length,
document.getElementById("class-example").getElementsByTagName("p").length);
}
// test4: getElementsByTagNameNS
{
htmlcollection = document.getElementsByTagNameNS("http://www.w3.org/1999/xhtml", "div");
is(htmlcollection.length, 5);
let from_element = document.documentElement.getElementsByTagNameNS("http://www.w3.org/1999/xhtml", "div");
is(htmlcollection.length, from_element.length);
htmlcollection = document.getElementsByTagNameNS("http://www.w3.org/1999/xhtml", "DIV");
is(htmlcollection.length, 0);
htmlcollection = document.getElementsByTagNameNS("", "div");
is(htmlcollection.length, 0);
htmlcollection = document.getElementsByTagNameNS("invalid", "div");
is(htmlcollection.length, 0);
from_element = document.getElementById("class-example").getElementsByTagNameNS("http://www.w3.org/1999/xhtml", "p");
is(from_element.length, 3);
}
// test5: document.getElementsByClassName
{
htmlcollection = document.getElementsByClassName("aaa");
is(htmlcollection.length, 2);
is(htmlcollection.item(0), p1);
is(htmlcollection.item(1), p2);
htmlcollection = document.getElementsByClassName("ccc bbb");
is(htmlcollection.length, 1);
is(htmlcollection.item(0), p3);
htmlcollection = document.getElementsByClassName("aaa,bbb");
is(htmlcollection.length, 0);
let from_element = document.getElementById("class-example").getElementsByClassName("bbb");
is(from_element.length, 2);
is(from_element.item(0), p1);
is(from_element.item(1), p3);
}
finish();
</script>
</head>
<body>
<div id="foo-1" class="foo"></div>
<div id="foo-2" class="foo"></div>
<div id="bar" class="bar"></div>
<div id="live" class="live"></div>
<div id="class-example">
<p id="p1" class="aaa bbb"/>
<p id="p2" class="aaa ccc"/>
<p id="p3" class="bbb ccc"/>
</div>
</body>
</html>

45
tests/content/test_htmlfieldsetelement_elements.html Normal file
View file

@ -0,0 +1,45 @@
<html>
<script src="harness.js"></script>
<fieldset id="fs">
<legend>Display</legend>
<input type=radio name=a>
<fieldset>
<button>Click!</button>
</fieldset>
<keygen name="key">
<textarea>
A
</textarea>
<select>
<option value="1"> A </option>
<option value="2" selected> B </option>
</select>
<form onsubmit="return false" oninput="o.value = a.valueAsNumber + b.valueAsNumber">
<input name=a type=number step=any> +
<input name=b type=number step=any> =
<output name=c for="a b"></output>
</form>
<figure>
<object type="application/x-java-applet">
<param name="code" value="MyJavaClass">
<p>You do not have Java available, or it is disabled.</p>
</object>
<figcaption>My Java Clock</figcaption>
</figure>
</fieldset>
<script>
var fs = document.getElementById("fs");
is(fs.elements.length, 10);
is_a(fs.elements[0], HTMLInputElement);
is_a(fs.elements[1], HTMLFieldSetElement);
is_a(fs.elements[2], HTMLButtonElement);
is_a(fs.elements[3], HTMLUnknownElement);
is_a(fs.elements[4], HTMLTextAreaElement);
is_a(fs.elements[5], HTMLSelectElement);
is_a(fs.elements[6], HTMLInputElement);
is_a(fs.elements[7], HTMLInputElement);
is_a(fs.elements[8], HTMLOutputElement);
is_a(fs.elements[9], HTMLObjectElement);
finish();
</script>
</html>

27
tests/content/test_htmlspacechars.html Normal file
View file

@ -0,0 +1,27 @@
<!DOCTYPE html>
<html>
<head>
<script src="harness.js"></script>
<script>
is(document.getElementsByClassName("foo").length, 6);
is_not(document.getElementById("bar").className, "ggg foo");
finish();
</script>
</head>
<body>
<!-- \u0020 Space -->
<div id="foo-1" class="aaa&#32;foo"></div>
<!-- \u0009 Character tabulation -->
<div id="foo-2" class="bbb&#9;foo"></div>
<!-- \u000a Line feed -->
<div id="foo-3" class="ccc&#10;foo"></div>
<!-- \u000c Form feed -->
<div id="foo-4" class="ddd&#12;foo"></div>
<!-- \u000d Carriage return -->
<div id="foo-5" class="eee&#13;foo"></div>
<!-- Space -->
<div id="foo-6" class="fff foo"></div>
<!-- Non-HTML space character -->
<div id="bar" class="ggg&#11;foo"></div>
</body>
</html>

32
tests/content/test_img_width_height.html Normal file
View file

@ -0,0 +1,32 @@
<html>
<head>
<title></title>
<script src="harness.js"></script>
</head>
<body>
<img src="test.png"/>
<script>
// Testing get/set of image width/height properties
var img = window.document.getElementsByTagName("img")[0];
function wait_for_img_load(f) {
if (img.width != 0) {
f();
} else {
window.setTimeout(function() { wait_for_img_load(f) }, 1);
}
}
wait_for_img_load(function() {
is(img.width, 500);
is(img.height, 378);
img.width = 200;
img.height = 100;
is(img.width, 200);
is(img.height, 100);
finish();
});
</script>
</body>
</html>

9
tests/content/test_inline_event_handler.html Normal file
View file

@ -0,0 +1,9 @@
<html>
<head>
<script src="harness.js"></script>
</head>
<body onload="is_a(event, Event); finish()">
<script>
</script>
</body>
</html>

11
tests/content/test_innerHTML.html Normal file
View file

@ -0,0 +1,11 @@
<html>
<head>
<script src="harness.js"></script>
<script>
var a = document.createElement("div");
a.appendChild(document.createElement("pre")).appendChild(new Text(""));
is(a.innerHTML, "<pre></pre>");
finish();
</script>
</head>
</html>

208
tests/content/test_interfaces.html Normal file
View file

@ -0,0 +1,208 @@
<!DOCTYPE HTML>
<meta charset=utf-8>
<title>Interfaces exposed on the window</title>
<script src="harness.js"></script>
<script>
// This is a list of all interfaces that are exposed to every webpage.
// Please only add things to this list with great care and proper review
// from the associated module peers.
// IMPORTANT: Do not change this list without review from
// a JavaScript Engine peer!
var ecmaGlobals = [
"Array",
"ArrayBuffer",
"Boolean",
"DataView",
"Date",
"Error",
"EvalError",
"Float32Array",
"Float64Array",
"Function",
"Infinity",
"Int16Array",
"Int32Array",
"Int8Array",
"InternalError",
"Iterator",
"JSON",
"Map",
"Math",
"NaN",
"Number",
"Object",
"Proxy",
"RangeError",
"ReferenceError",
"RegExp",
"Set",
"StopIteration",
"String",
"SyntaxError",
"TypeError",
"Uint16Array",
"Uint32Array",
"Uint8Array",
"Uint8ClampedArray",
"URIError",
"WeakMap",
];
// IMPORTANT: Do not change the list below without review from a DOM peer!
var interfaceNamesInGlobalScope = [
"Attr",
"Blob",
"CanvasRenderingContext2D",
"CharacterData",
"DOMRect",
"Comment",
"Console",
"CustomEvent",
"DedicatedWorkerGlobalScope", // #2823
"Document",
"DocumentFragment",
"DocumentType",
"DOMException",
"DOMImplementation",
"DOMParser",
"DOMTokenList",
"Element",
"Event",
"EventTarget",
"File",
"FormData",
"HTMLAnchorElement",
"HTMLAppletElement",
"HTMLAreaElement",
"HTMLAudioElement",
"HTMLBaseElement",
"HTMLBodyElement",
"HTMLBRElement",
"HTMLButtonElement",
"HTMLCanvasElement",
"HTMLCollection",
"HTMLDataElement",
"HTMLDataListElement",
"HTMLDirectoryElement",
"HTMLDivElement",
"HTMLDListElement",
"HTMLElement",
"HTMLEmbedElement",
"HTMLFieldSetElement",
"HTMLFontElement",
"HTMLFormElement",
"HTMLFrameElement",
"HTMLFrameSetElement",
"HTMLHeadElement",
"HTMLHeadingElement",
"HTMLHRElement",
"HTMLHtmlElement",
"HTMLIFrameElement",
"HTMLImageElement",
"HTMLInputElement",
"HTMLLabelElement",
"HTMLLegendElement",
"HTMLLIElement",
"HTMLLinkElement",
"HTMLMapElement",
"HTMLMediaElement",
"HTMLMetaElement",
"HTMLMeterElement",
"HTMLModElement",
"HTMLObjectElement",
"HTMLOListElement",
"HTMLOptGroupElement",
"HTMLOptionElement",
"HTMLOutputElement",
"HTMLParagraphElement",
"HTMLParamElement",
"HTMLPreElement",
"HTMLProgressElement",
"HTMLQuoteElement",
"HTMLScriptElement",
"HTMLSelectElement",
"HTMLSourceElement",
"HTMLSpanElement",
"HTMLStyleElement",
"HTMLTableCaptionElement",
"HTMLTableCellElement",
"HTMLTableColElement",
"HTMLTableDataCellElement",
"HTMLTableElement",
"HTMLTableHeaderCellElement",
"HTMLTableRowElement",
"HTMLTableSectionElement",
"HTMLTemplateElement",
"HTMLTextAreaElement",
"HTMLTimeElement",
"HTMLTitleElement",
"HTMLTrackElement",
"HTMLUListElement",
"HTMLUnknownElement",
"HTMLVideoElement",
"Location",
"MessageEvent",
"MouseEvent",
"NamedNodeMap",
"Navigator",
"Node",
"NodeIterator",
"NodeList",
"Performance",
"PerformanceTiming",
"ProcessingInstruction",
"ProgressEvent",
"Range",
"Screen",
"TestBinding", // XXX
"Text",
"TreeWalker",
"UIEvent",
"URLSearchParams",
"ValidityState",
"Window",
"Worker",
"WorkerGlobalScope", // #2823
"WorkerLocation", // #2823
"WorkerNavigator", // #2823
"XMLHttpRequest",
"XMLHttpRequestUpload",
];
function createInterfaceMap() {
var interfaceMap = {};
function addInterfaces(interfaces)
{
for (var entry of interfaces) {
interfaceMap[entry] = true;
}
}
addInterfaces(ecmaGlobals);
addInterfaces(interfaceNamesInGlobalScope);
return interfaceMap;
}
var interfaceMap = createInterfaceMap();
for (var name of Object.getOwnPropertyNames(window)) {
if (!/^[A-Z]/.test(name)) {
continue;
}
is_in(name, interfaceMap,
"If this is failing: DANGER, are you sure you want to expose the new " +
"interface " + name + " to all webpages as a property on the window? " +
"Do not make a change to this file without review from jdm or Ms2ger " +
"for that specific change!");
if (name in interfaceMap) {
delete interfaceMap[name];
}
}
for (var name of Object.keys(interfaceMap)) {
is_in(name, window, name + " should be defined on the global scope");
}
is(Object.keys(interfaceMap).length, 0,
"The following interface(s) are not enumerated: " + Object.keys(interfaceMap).join(", "));
finish();
</script>

34
tests/content/test_load_event.html Normal file
View file

@ -0,0 +1,34 @@
<html>
<head>
<script src="harness.js"></script>
</head>
<body>
<script>
var onloads = 0;
function check(ev) {
is_a(ev, Event);
ev.preventDefault();
is(ev.defaultPrevented, false);
is(ev.target, document);
is(ev.currentTarget, window);
if (onloads == 2) {
finish();
}
}
window.onload = function(ev) {
_fail("this inline handler should be overwritten");
}
window.onload = function(ev) {
onloads++;
is(onloads, 1);
check(ev);
}
addEventListener("load", function(ev) {
onloads++;
is(onloads, 2);
check(ev);
});
</script>
</body>
</html>

20
tests/content/test_navigator.html Normal file
View file

@ -0,0 +1,20 @@
<html>
<head>
<title></title>
<script src="harness.js"></script>
</head>
<body>
<script>
is(window.navigator, window.navigator);
is_a(window.navigator, Navigator);
var nav = window.navigator;
is(nav.product, "Gecko");
is(nav.taintEnabled(), false);
is(nav.appName, "Netscape");
is(nav.appCodeName, "Mozilla");
is(nav.platform, "");
finish();
</script>
</body>
</html>

233
tests/content/test_node_cloneNode.html Normal file
View file

@ -0,0 +1,233 @@
<!DOCTYPE html>
<html>
<head>
<script src="harness.js"></script>
<script>
function check_copy(orig, copy, type) {
is_not(orig, copy);
is_a(orig, type);
is_a(copy, type);
}
function create_element_and_check(localName, type) {
var element = document.createElement(localName);
var copy = element.cloneNode();
check_copy(element, copy, type);
}
// test1: createElement
{
create_element_and_check("a", HTMLAnchorElement);
create_element_and_check("abbr", HTMLElement);
create_element_and_check("acronym", HTMLElement);
create_element_and_check("address", HTMLElement);
create_element_and_check("applet", HTMLAppletElement);
create_element_and_check("area", HTMLAreaElement);
create_element_and_check("article", HTMLElement);
create_element_and_check("aside", HTMLElement);
create_element_and_check("audio", HTMLAudioElement);
create_element_and_check("b", HTMLElement);
create_element_and_check("base", HTMLBaseElement);
create_element_and_check("bdi", HTMLElement);
create_element_and_check("bdo", HTMLElement);
create_element_and_check("bgsound", HTMLElement);
create_element_and_check("big", HTMLElement);
create_element_and_check("blockquote",HTMLElement);
create_element_and_check("body", HTMLBodyElement);
create_element_and_check("br", HTMLBRElement);
create_element_and_check("button", HTMLButtonElement);
create_element_and_check("canvas", HTMLCanvasElement);
create_element_and_check("caption", HTMLTableCaptionElement);
create_element_and_check("center", HTMLElement);
create_element_and_check("cite", HTMLElement);
create_element_and_check("code", HTMLElement);
create_element_and_check("col", HTMLTableColElement);
create_element_and_check("colgroup", HTMLTableColElement);
create_element_and_check("data", HTMLDataElement);
create_element_and_check("datalist", HTMLDataListElement);
create_element_and_check("dd", HTMLElement);
create_element_and_check("del", HTMLModElement);
create_element_and_check("details", HTMLElement);
create_element_and_check("dfn", HTMLElement);
create_element_and_check("dir", HTMLDirectoryElement);
create_element_and_check("div", HTMLDivElement);
create_element_and_check("dl", HTMLDListElement);
create_element_and_check("dt", HTMLElement);
create_element_and_check("embed", HTMLEmbedElement);
create_element_and_check("fieldset", HTMLFieldSetElement);
create_element_and_check("figcaption",HTMLElement);
create_element_and_check("figure", HTMLElement);
create_element_and_check("font", HTMLFontElement);
create_element_and_check("footer", HTMLElement);
create_element_and_check("form", HTMLFormElement);
create_element_and_check("frame", HTMLFrameElement);
create_element_and_check("frameset", HTMLFrameSetElement);
create_element_and_check("h1", HTMLHeadingElement);
create_element_and_check("h2", HTMLHeadingElement);
create_element_and_check("h3", HTMLHeadingElement);
create_element_and_check("h4", HTMLHeadingElement);
create_element_and_check("h5", HTMLHeadingElement);
create_element_and_check("h6", HTMLHeadingElement);
create_element_and_check("head", HTMLHeadElement);
create_element_and_check("header", HTMLElement);
create_element_and_check("hgroup", HTMLElement);
create_element_and_check("hr", HTMLHRElement);
create_element_and_check("html", HTMLHtmlElement);
create_element_and_check("i", HTMLElement);
create_element_and_check("iframe", HTMLIFrameElement);
create_element_and_check("img", HTMLImageElement);
create_element_and_check("input", HTMLInputElement);
create_element_and_check("ins", HTMLModElement);
create_element_and_check("isindex", HTMLElement);
create_element_and_check("kbd", HTMLElement);
create_element_and_check("label", HTMLLabelElement);
create_element_and_check("legend", HTMLLegendElement);
create_element_and_check("li", HTMLLIElement);
create_element_and_check("link", HTMLLinkElement);
create_element_and_check("main", HTMLElement);
create_element_and_check("map", HTMLMapElement);
create_element_and_check("mark", HTMLElement);
create_element_and_check("marquee", HTMLElement);
create_element_and_check("meta", HTMLMetaElement);
create_element_and_check("meter", HTMLMeterElement);
create_element_and_check("nav", HTMLElement);
create_element_and_check("nobr", HTMLElement);
create_element_and_check("noframes", HTMLElement);
create_element_and_check("noscript", HTMLElement);
create_element_and_check("object", HTMLObjectElement);
create_element_and_check("ol", HTMLOListElement);
create_element_and_check("optgroup", HTMLOptGroupElement);
create_element_and_check("option", HTMLOptionElement);
create_element_and_check("output", HTMLOutputElement);
create_element_and_check("p", HTMLParagraphElement);
create_element_and_check("param", HTMLParamElement);
create_element_and_check("pre", HTMLPreElement);
create_element_and_check("progress", HTMLProgressElement);
create_element_and_check("q", HTMLQuoteElement);
create_element_and_check("rp", HTMLElement);
create_element_and_check("rt", HTMLElement);
create_element_and_check("ruby", HTMLElement);
create_element_and_check("s", HTMLElement);
create_element_and_check("samp", HTMLElement);
create_element_and_check("script", HTMLScriptElement);
create_element_and_check("section", HTMLElement);
create_element_and_check("select", HTMLSelectElement);
create_element_and_check("small", HTMLElement);
create_element_and_check("source", HTMLSourceElement);
create_element_and_check("spacer", HTMLElement);
create_element_and_check("span", HTMLSpanElement);
create_element_and_check("strike", HTMLElement);
create_element_and_check("style", HTMLStyleElement);
create_element_and_check("sub", HTMLElement);
create_element_and_check("summary", HTMLElement);
create_element_and_check("sup", HTMLElement);
create_element_and_check("table", HTMLTableElement);
create_element_and_check("tbody", HTMLTableSectionElement);
create_element_and_check("td", HTMLTableDataCellElement);
create_element_and_check("template", HTMLTemplateElement);
create_element_and_check("textarea", HTMLTextAreaElement);
create_element_and_check("th", HTMLTableHeaderCellElement);
create_element_and_check("time", HTMLTimeElement);
create_element_and_check("title", HTMLTitleElement);
create_element_and_check("tr", HTMLTableRowElement);
create_element_and_check("tt", HTMLElement);
create_element_and_check("track", HTMLTrackElement);
create_element_and_check("u", HTMLElement);
create_element_and_check("ul", HTMLUListElement);
create_element_and_check("var", HTMLElement);
create_element_and_check("video", HTMLVideoElement);
create_element_and_check("unknown", HTMLUnknownElement);
create_element_and_check("wbr", HTMLElement);
}
// test2: createDocumentFragment
{
var fragment = document.createDocumentFragment();
var copy = fragment.cloneNode();
check_copy(fragment, copy, DocumentFragment);
}
// test3: createTextNode
{
var text = document.createTextNode("hello world");
var copy = text.cloneNode();
check_copy(text, copy, Text);
is(text.data, copy.data);
is(text.wholeText, copy.wholeText);
}
// test4: createComment
{
var comment = document.createComment("a comment");
var copy = comment.cloneNode();
check_copy(comment, copy, Comment);
is(comment.data, copy.data);
}
// test5: createProcessingInstruction
{
var pi = document.createProcessingInstruction("target", "data");
var copy = pi.cloneNode();
check_copy(pi, copy, ProcessingInstruction);
is(pi.data, copy.data);
is(pi.target, pi.target);
}
// test6: implementation.createDocumentType
{
var doctype = document.implementation.createDocumentType("html", "public", "system");
var copy = doctype.cloneNode();
check_copy(doctype, copy, DocumentType);
is(doctype.name, copy.name);
is(doctype.publicId, copy.publicId);
is(doctype.systemId, copy.systemId);
}
// test7: implementation.createDocument
{
// FIXME: https://github.com/mozilla/servo/issues/1509
}
// test8: implementation.createHTMLDocument
{
var html = document.implementation.createHTMLDocument("title");
var copy = html.cloneNode();
check_copy(html, copy, Document);
is(html.title, copy.title);
}
// test9: node with children
{
var parent = document.createElement("div");
var child1 = document.createElement("div");
var child2 = document.createElement("div");
var grandChild = document.createElement("div");
child2.appendChild(grandChild);
parent.appendChild(child1);
parent.appendChild(child2);
var deep = true;
var copy = parent.cloneNode(deep);
check_copy(parent, copy, HTMLDivElement);
is(copy.childNodes.length, 2);
check_copy(child1, copy.childNodes[0], HTMLDivElement);
is(copy.childNodes[0].childNodes.length, 0);
check_copy(child2, copy.childNodes[1], HTMLDivElement);
is(copy.childNodes[1].childNodes.length, 1);
check_copy(grandChild, copy.childNodes[1].childNodes[0], HTMLDivElement);
deep = false;
copy = parent.cloneNode(deep);
check_copy(parent, copy, HTMLDivElement);
is(copy.childNodes.length, 0);
}
finish();
</script>
</head>
</html>

36
tests/content/test_node_compareDocumentPosition.html Normal file
View file

@ -0,0 +1,36 @@
<!DOCTYPE html>
<html>
<head>
<script src="harness.js"></script>
<script>
{
var elem = document.createElement("div");
var other = document.createElement("div");
is(elem.compareDocumentPosition(elem),0);
var nonTree = elem.compareDocumentPosition(other);
var prefix = Node.DOCUMENT_POSITION_DISCONNECTED + Node.DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC;
is(nonTree == prefix + Node.DOCUMENT_POSITION_FOLLOWING || nonTree == prefix + Node.DOCUMENT_POSITION_PRECEDING,
true);
elem.appendChild(other);
is(elem.compareDocumentPosition(other), Node.DOCUMENT_POSITION_CONTAINED_BY + Node.DOCUMENT_POSITION_FOLLOWING);
is(other.compareDocumentPosition(elem), Node.DOCUMENT_POSITION_CONTAINS + Node.DOCUMENT_POSITION_PRECEDING);
var another = document.createElement("div");
other.appendChild(another);
is(elem.compareDocumentPosition(another), Node.DOCUMENT_POSITION_CONTAINED_BY + Node.DOCUMENT_POSITION_FOLLOWING);
is(another.compareDocumentPosition(elem), Node.DOCUMENT_POSITION_CONTAINS + Node.DOCUMENT_POSITION_PRECEDING);
var follower = document.createElement("div");
elem.appendChild(follower);
var preceder = document.createElement("div");
another.appendChild(preceder);
is(another.compareDocumentPosition(follower), Node.DOCUMENT_POSITION_FOLLOWING);
is(follower.compareDocumentPosition(another), Node.DOCUMENT_POSITION_PRECEDING);
is(follower.compareDocumentPosition(preceder), Node.DOCUMENT_POSITION_PRECEDING);
finish();
}
</script>
</head>
</html>

25
tests/content/test_node_contains.html Normal file
View file

@ -0,0 +1,25 @@
<!DOCTYPE html>
<html>
<head>
<script src="harness.js"></script>
<script>
// test1: Node.contains
{
var parent = document.createElement("div");
var child = document.createElement("div");
var child_of_child = document.createElement("div");
var other = document.createElement("div");
child.appendChild(child_of_child);
parent.appendChild(child);
is(parent.contains(parent), true, "test1-0, Node.contains");
is(parent.contains(child), true, "test1-1, Node.contains");
is(parent.contains(child_of_child), true, "test1-2, Node.contains");
is(parent.contains(other), false, "test1-3, Node.contains");
}
finish();
</script>
</head>
</html>

25
tests/content/test_node_insertBefore.html Normal file
View file

@ -0,0 +1,25 @@
<!doctype html>
<html>
<head>
<title>Node.insertBefore</title>
<script src="harness.js"></script>
</head>
<body>
<script type="text/javascript">
// test1: insertBefore
{
var root = document.createElement("div");
var after = document.createElement("div");
var before = document.createElement("div");
root.appendChild(after);
is(root.insertBefore(before, after), before, "test1-0, insertBefore");
is(root.childNodes[0], before, "test1-1, insertBefore");
is(root.childNodes[1], after, "test1-2, insertBefore");
finish();
}
</script>
</body>
</html>

39
tests/content/test_node_isEqualNode.html Normal file
View file

@ -0,0 +1,39 @@
<!DOCTYPE html>
<html>
<head>
<script src="harness.js"></script>
<script>
// test1: simple checks
{
var elem = document.createElement("div");
var other = document.createElement("div");
is(elem.isEqualNode(elem), true);
is(elem.isEqualNode(other), true);
is(other.isEqualNode(elem), true);
is(elem.isEqualNode(document), false);
}
// test2: non-element children
{
var parent_elem = document.createElement("div");
var child_elem = document.createElement("div");
parent_elem.appendChild(child_elem);
var other_parent = document.createElement("div");
var other_child = document.createElement("div");
other_parent.appendChild(other_child);
is(parent_elem.isEqualNode(other_parent), true);
is(child_elem.isEqualNode(other_child), true);
var child_text = document.createTextNode("lorem ipsum");
child_elem.appendChild(child_text);
is(parent_elem.isEqualNode(other_parent), false);
is(child_elem.isEqualNode(other_child), false);
}
finish();
</script>
</head>
</html>

35
tests/content/test_node_normalize.html Normal file
View file

@ -0,0 +1,35 @@
<!DOCTYPE html>
<html>
<head>
<script src="harness.js"></script>
</head>
<body>
<script>
// test1: Node.normalize
var parent1 = document.createElement("div");
var child1 = document.createTextNode("aaa");
var child2 = document.createTextNode("");
var child3 = document.createTextNode("bb");
var parent2 = document.createElement("div");
parent1.appendChild(child1);
parent1.appendChild(child2);
parent1.appendChild(child3);
parent2.appendChild(document.createTextNode(""));
parent1.normalize();
parent2.normalize();
is(Array.prototype.map.call(parent1.childNodes, function(el) {return el.length}).indexOf(0), -1, "Node.normalize removes empty text nodes");
is(parent1.childNodes.length, 1, "Node.normalize merges text nodes in one");
is(parent1.childNodes[0].length, 5, "test 1-2, Node.normalize merges text nodes values");
is(parent2.childNodes.length, 0, "Node.normalize removes empty text nodes even if there is only one text node");
is(child2.textContent, "", "Node.normalize doesn't change removed children original content")
is(child3.textContent, "bb", "Node.normalize doesn't change removed children original content")
finish();
</script>
</body>
</html>

52
tests/content/test_node_replaceChild.html Normal file
View file

@ -0,0 +1,52 @@
<!doctype html>
<html>
<head>
<script src="harness.js"></script>
</head>
<body>
<script>
// test1: 1-to-1
{
var root = document.createElement("div");
var elem = document.createElement("div");
var foo = document.createTextNode("foo");
var bar = document.createTextNode("bar");
elem.appendChild(bar);
is(elem.replaceChild(bar, bar), bar, "test1-0, 1-to-1");
is(elem.childNodes[0], bar, "test1-1, 1-to-1");
root.appendChild(foo);
is(root.replaceChild(bar, foo), foo, "test1-2, 1-to-1");
is(elem.childNodes.length, 0, "test1-3, 1-to-1");
is(root.childNodes[0], bar, "test1-4, 1-to-1");
elem.appendChild(foo);
is(root.replaceChild(elem, bar), bar, "test1-5, 1-to-1");
is(root.childNodes[0].childNodes[0], foo, "test1-6, 1-to-1");
}
// test2: doctype
{
var doc_doctype = document.doctype;
var new_doctype = document.implementation.createDocumentType("html", null, null);
is_not(doc_doctype, new_doctype, "test2-0, doctype");
is(document.replaceChild(new_doctype, doc_doctype), doc_doctype, "test2-1, doctype");
is(document.doctype, new_doctype, "test2-2, doctype");
}
// test3: documentElement
{
var doc_elem = document.documentElement;
var new_elem = document.createElement("html");
is_not(doc_elem, new_elem, "test3-0, documentElement");
is(document.replaceChild(new_elem, doc_elem), doc_elem, "test3-1, documentElement");
is(document.documentElement, new_elem, "test3-2, documentElement");
}
finish();
</script>
</body>
</html>

70
tests/content/test_parentNode_querySelector.html Normal file
View file

@ -0,0 +1,70 @@
<!DOCTYPE html>
<html>
<head>
<script src="harness.js"></script>
<script>
{ // document.querySelector
let div = document.getElementById("foo");
is(document.querySelector("#foo"), div);
div = document.getElementById("foo\\bar");
is(document.querySelector("#foo\\\\bar"), div);
div = document.getElementById("foo:bar");
is(document.querySelector("#foo\\:bar"), div);
div = document.getElementById("bar");
is(document.querySelector("div.myClass"), div);
is(document.querySelector("div:nth-of-type(4)"), div);
}
{ // element.querySelector
let body = document.body;
let div = document.getElementById("foo");
is(body.querySelector("#foo"), div);
div = document.getElementById("foo\\bar");
is(body.querySelector("#foo\\\\bar"), div);
div = document.getElementById("foo:bar");
is(body.querySelector("#foo\\:bar"), div);
div = document.getElementById("bar");
is(body.querySelector("div.myClass"), div);
is(body.querySelector("div:nth-of-type(4)"), div);
}
{ // docfrag.querySelector
let docfrag = document.createDocumentFragment();
let div = document.createElement("div");
div.id = "foo";
div.className = "myClass";
let child = document.createElement("div");
div.appendChild(child);
docfrag.appendChild(div);
let p = document.createElement("p");
p.id = "bar";
p.className = "myClass";
docfrag.appendChild(p);
is(docfrag.querySelector("#foo"), div);
is(docfrag.querySelector("div.myClass"), div);
is(docfrag.querySelector("#bar"), p);
is(docfrag.querySelector("p.myClass"), p);
is(docfrag.querySelector(".myClass"), div);
is(docfrag.querySelector("div > div"), child);
}
finish();
</script>
</head>
<body>
<div id="foo"></div>
<div id="foo\bar"></div>
<div id="foo:bar"></div>
<div id="bar" class="myClass"></p>
</body>
</html>

59
tests/content/test_parentNode_querySelectorAll.html Normal file
View file

@ -0,0 +1,59 @@
<!DOCTYPE html>
<html>
<head>
<script src="harness.js"></script>
<script>
let foo = document.getElementById("foo");
let bar = document.getElementById("bar");
let baz = document.getElementById("baz");
{ // document.querySelector
let nodelist = document.querySelectorAll(".test");
is_a(nodelist, NodeList);
is(nodelist.length, 3);
is(nodelist.item(0), foo);
is(nodelist.item(1), bar);
is(nodelist.item(2), baz);
nodelist = document.querySelectorAll("div > .test");
is(nodelist.length, 3);
}
{ // element.querySelector
let div = document.getElementById("parent");
let nodelist = div.querySelectorAll(".test");
is(nodelist.length, 3);
nodelist = div.querySelectorAll("div:nth-of-type(1)");
is(nodelist.item(0), div);
}
{ // docfrag.querySelector
let docfrag = document.createDocumentFragment();
let div = document.createElement("div");
div.id = "foo";
div.className = "myClass";
let child = document.createElement("div");
div.appendChild(child);
docfrag.appendChild(div);
let nodelist = docfrag.querySelectorAll("#foo");
is(nodelist.item(0), div);
nodelist = docfrag.querySelectorAll("#foo:nth-child(1)");
is(nodelist.item(0), div);
}
finish();
</script>
</head>
<body>
<div id="parent">
<div id="foo" class="test"></div>
<div id="bar" class="test"></div>
<div id="baz" class="test"></div>
</div>
</body>
</html>

25
tests/content/test_parentnodes.html Normal file
View file

@ -0,0 +1,25 @@
<html>
<head>
<title></title>
<script src="harness.js"></script>
</head>
<body>
<div id="div1"></div>
<script>
is_a(document.documentElement.parentNode, Document);
is(document.documentElement.parentElement, null);
var elem = document.createElement("p");
is(elem.parentNode, null);
is(elem.parentElement, null);
var child = document.createElement("p");
elem.appendChild(child);
is(child.parentNode, elem);
is(child.parentElement, elem);
finish();
</script>
</body>
</html>

24
tests/content/test_prototypes.html Normal file
View file

@ -0,0 +1,24 @@
<html>
<head>
<meta charset="utf-8">
<script src="harness.js"></script>
</head>
<body>
<foo-á>foo</foo-á>
<script>
is_a(window.document, Node);
gc(); // ensure that our document rooting works; subsequent accesses should be valid.
is_a(window.document, Node);
is(window.document.nodeType, Node.DOCUMENT_NODE);
is_a(window.document.documentElement, Node);
is_a(window.document.documentElement, Element);
is_a(window.document.documentElement, HTMLElement);
is_a(window.document.documentElement, HTMLHtmlElement);
is_a(window.document, Document);
is(window.document.documentElement.tagName, "HTML");
is_a(window.document.getElementsByTagName('foo-á')[0], HTMLUnknownElement);
is(window.document.getElementsByTagName('foo-á')[0].tagName, "FOO-á");
finish();
</script>
</body>
</html>

14
tests/content/test_proxy_setter.html Normal file
View file

@ -0,0 +1,14 @@
<html>
<head>
<title></title>
<script src="harness.js"></script>
</head>
<body>
<script>
is(window.document.title, '');
window.document.title = 'foo';
is(window.document.title, 'foo');
finish();
</script>
</body>
</html>

18
tests/content/test_script_src_attribute.html Normal file
View file

@ -0,0 +1,18 @@
<html>
<head id="foo">
<title></title>
<script src="harness.js"></script>
</head>
<script>
let script = document.getElementById("test");
{
is(script.src, "/x.js");
}
finish();
</script>
<body>
<script src="/x.js" id="test"/>
</body>
</html>

101
tests/content/test_script_type.html Normal file
View file

@ -0,0 +1,101 @@
<html>
<head>
<title></title>
<script src="harness.js"></script>
</head>
<body>
<script>
expect(22);
function ok(msg) { _pass(msg, ""); }
function fail(msg) { _fail(msg, ""); }
</script>
<script type="">
ok('type is empty string');
</script>
<script language="">
ok('language is empty string');
</script>
<script type="text/javascript" language="vbscript">
ok('type is text/javascript, language ignored');
</script>
<script type="" language="fooscript">
ok('type is empty string, language ingored');
</script>
<script language="javascript">
ok('language is javascript');
</script>
<script language="ecmascript">
ok('language is ecmascript');
</script>
<!-- list found at http://www.whatwg.org/specs/web-apps/current-work/multipage/scripting.html#support-the-scripting-language -->
<script type="application/ecmascript">
ok('type is application/ecmascript');
</script>
<script type="application/javascript">
ok('type is application/javascript');
</script>
<script type="application/x-ecmascript">
ok('type is application/x-ecmascript');
</script>
<script type="application/x-javascript">
ok('type is application/x-javascript');
</script>
<script type="text/ecmascript">
ok('type is text/ecmascript');
</script>
<script type="text/javascript">
ok('type is text/javascript');
</script>
<script type="text/javascript1.0">
ok('type is text/javascript1.0');
</script>
<script type="text/javascript1.1">
ok('type is text/javascript1.1');
</script>
<script type="text/javascript1.2">
ok('type is text/javascript1.2');
</script>
<script type="text/javascript1.3">
ok('type is text/javascript1.3');
</script>
<script type="text/javascript1.4">
ok('type is text/javascript1.4');
</script>
<script type="text/javascript1.5">
ok('type is text/javascript1.5');
</script>
<script type="text/jscript">
ok('type is text/jsscript');
</script>
<script type="text/livescript">
ok('type is text/livescript');
</script>
<script type="text/x-ecmascript">
ok('type is text/x-ecmascript');
</script>
<script type="text/x-javascript">
ok('type is text/x-javascript');
</script>
<!-- should not execute -->
<script type=" ">
fail('type is space');
</script>
<script type="foo">
fail('type is unknown');
</script>
<script type="text/javascript1.6">
fail('type is unknown');
</script>
<script language="text/javascript">
fail('language is text/javascript');
</script>
<script>
finish();
</script>
</body>
</html>

17
tests/content/test_textcontent.html Normal file
View file

@ -0,0 +1,17 @@
<html>
<head>
<script src="harness.js"></script>
<script>
var div = document.getElementsByTagName('div')[0];
is(div.textContent, "this is\n text content");
var newContent = "new text con\ntent";
div.textContent = newContent;
is(div.textContent, newContent);
finish();
</script>
</head>
<body>
<div>this is
text content</div>
</body>
</html>

12
tests/content/test_title.html Normal file
View file

@ -0,0 +1,12 @@
<html>
<head>
<title>starting title</title>
<script src="harness.js"></script>
<script>
is(document.title, "starting title");
document.title = "new title";
is(document.title, "new title");
finish();
</script>
</head>
</html>

7
tests/content/test_trace_null.html Normal file
View file

@ -0,0 +1,7 @@
<!-- crashtest -->
<script src=harness.js></script>
<script>
new CustomEvent("foo", { detail: null });
gc();
finish();
</script>

26
tests/content/test_union.html Normal file
View file

@ -0,0 +1,26 @@
<html>
<head>
<script src="harness.js"></script>
<select id="sel"></select>
<script>
var div = document.createElement('div');
var optgroup = document.createElement('optgroup');
var sel = document.getElementById('sel');
should_not_throw(function() {
var opt = document.createElement('option');
sel.add(opt);
sel.add(optgroup);
sel.add(opt, div);
sel.add(optgroup, div);
sel.add(opt, 5);
sel.add(optgroup, 5);
});
should_throw(function() { sel.add(div) });
should_not_throw(function() { sel.add(optgroup, function() {}) });
finish();
</script>
</head>
</html>

13
tests/content/test_window.html Normal file
View file

@ -0,0 +1,13 @@
<html>
<head>
<title></title>
<script src="harness.js"></script>
</head>
<body>
<script>
is(window, window.self);
is_a(window.self, Window);
finish();
</script>
</body>
</html>

28
tests/content/test_window_performance.html Normal file
View file

@ -0,0 +1,28 @@
<html>
<head>
<title></title>
<script src="harness.js"></script>
</head>
<body>
<script>
is_not(window.performance, undefined);
is_a(window.performance, Performance);
is_not(window.performance.timing, undefined);
is_a(window.performance.timing, PerformanceTiming);
gt(window.performance.timing.navigationStart, 0);
var last = window.performance.now();
gt(last, 0);
// Check that window.performance.now() is monotonically increasing
for (var i = 0; i < 100; i++) {
var next = window.performance.now();
gt(next, last);
last = next;
}
finish();
</script>
</body>
</html>

20
tests/content/test_window_setInterval.html Normal file
View file

@ -0,0 +1,20 @@
<html>
<head>
<script src="harness.js"></script>
</head>
<body>
<script>
var x = 0;
var intervalID = setInterval(function() {
x += 1;
if (x == 2) {
clearInterval(intervalID);
setTimeout(function() {
is(x, 2);
finish();
}, 300);
}
}, 10);
</script>
</body>
</html>

134
tests/contenttest.rs Normal file
View file

@ -0,0 +1,134 @@
// Copyright 2013 The Servo Project Developers. See the COPYRIGHT
// file at the top-level directory of this distribution.
//
// Licensed under the Apache License, Version 2.0 <LICENSE-APACHE or
// http://www.apache.org/licenses/LICENSE-2.0> or the MIT license
// <LICENSE-MIT or http://opensource.org/licenses/MIT>, at your
// option. This file may not be copied, modified, or distributed
// except according to those terms.
extern crate std;
extern crate getopts;
extern crate regex;
extern crate test;
use test::{AutoColor, TestOpts, run_tests_console, TestDesc, TestDescAndFn, DynTestFn, DynTestName};
use getopts::{getopts, reqopt};
use std::{os, str};
use std::io::fs;
use std::io::Reader;
use std::io::process::{Command, Ignored, CreatePipe, InheritFd, ExitStatus};
use regex::Regex;
#[deriving(Clone)]
struct Config {
source_dir: String,
filter: Option<Regex>
}
fn main() {
let args = os::args();
let config = parse_config(args.move_iter().collect());
let opts = test_options(config.clone());
let tests = find_tests(config);
match run_tests_console(&opts, tests) {
Ok(false) => os::set_exit_status(1), // tests failed
Err(_) => os::set_exit_status(2), // I/O-related failure
_ => (),
}
}
fn parse_config(args: Vec<String>) -> Config {
let args = args.tail();
let opts = vec!(reqopt("s", "source-dir", "source-dir", "source-dir"));
let matches = match getopts(args, opts.as_slice()) {
Ok(m) => m,
Err(f) => fail!(format!("{}", f))
};
Config {
source_dir: matches.opt_str("source-dir").unwrap(),
filter: matches.free.as_slice().head().map(|s| Regex::new(s.as_slice()).unwrap())
}
}
fn test_options(config: Config) -> TestOpts {
TestOpts {
filter: config.filter,
run_ignored: false,
run_tests: true,
run_benchmarks: false,
ratchet_metrics: None,
ratchet_noise_percent: None,
save_metrics: None,
test_shard: None,
logfile: None,
nocapture: false,
color: AutoColor
}
}
fn find_tests(config: Config) -> Vec<TestDescAndFn> {
let files_res = fs::readdir(&Path::new(config.source_dir));
let mut files = match files_res {
Ok(files) => files,
_ => fail!("Error reading directory."),
};
files.retain(|file| file.extension_str() == Some("html") );
return files.iter().map(|file| make_test(format!("{}", file.display()))).collect();
}
fn make_test(file: String) -> TestDescAndFn {
TestDescAndFn {
desc: TestDesc {
name: DynTestName(file.clone()),
ignore: false,
should_fail: false
},
testfn: DynTestFn(proc() { run_test(file) })
}
}
fn run_test(file: String) {
let path = os::make_absolute(&Path::new(file));
// FIXME (#1094): not the right way to transform a path
let infile = format!("file://{}", path.display());
let stdout = CreatePipe(false, true);
let stderr = InheritFd(2);
let args = ["-z", "-f", infile.as_slice()];
let mut prc = match Command::new("target/servo")
.args(args)
.stdin(Ignored)
.stdout(stdout)
.stderr(stderr)
.spawn()
{
Ok(p) => p,
_ => fail!("Unable to spawn process."),
};
let mut output = Vec::new();
loop {
let byte = prc.stdout.get_mut_ref().read_byte();
match byte {
Ok(byte) => {
print!("{}", byte as char);
output.push(byte);
}
_ => break
}
}
let out = str::from_utf8(output.as_slice());
let lines: Vec<&str> = out.unwrap().split('\n').collect();
for &line in lines.iter() {
if line.contains("TEST-UNEXPECTED-FAIL") {
fail!(line.to_string());
}
}
let retval = prc.wait();
if retval != Ok(ExitStatus(0)) {
fail!("Servo exited with non-zero status {}", retval);
}
}

54
tests/html/about-mozilla.html Normal file
View file

@ -0,0 +1,54 @@
<!DOCTYPE html>
<html>
<head>
<title>The Book of Mozilla, 11:9</title>
<style type="text/css">
html {
background: maroon;
color: white;
font-style: italic;
}
#moztext {
margin-top: 15%;
font-size: 1.1em;
font-family: serif;
text-align: center;
line-height: 1.5;
}
#from {
font-size: 1.95em;
font-family: serif;
text-align: right;
}
em {
font-size: 1.3em;
line-height: 0;
}
a {
text-decoration: none;
color: white;
}
</style>
</head>
<body>
<p id="moztext">
Mammon slept. And the <em>beast reborn</em> spread over the earth and its numbers
grew legion. And they proclaimed the times and <em>sacrificed</em> crops unto the
fire, with the <em>cunning of foxes</em>. And they built a new world in their own
image as promised by the <em><a href="http://www.mozilla.org/about/mozilla-manifesto.html">
sacred words</a></em>, and <em><a href="http://wiki.mozilla.org/About:mozilla">spoke
</a></em> of the beast with their children. Mammon awoke, and lo! it was
<em>naught</em> but a follower.
</p>
<p id="from">
from <strong>The Book of Mozilla,</strong> 11:9<br/><small>(10th Edition)</small>
</p>
</body>
</html>

183
tests/html/acid1.html Normal file
View file

@ -0,0 +1,183 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
<html><head>
<meta http-equiv="content-type" content="text/html; charset=windows-1252">
<title>
display/box/float/clear test
</title>
<style type="text/css">
/* last modified: 1 Dec 98 */
html {
font: 10px/1 Verdana, sans-serif;
background-color: blue;
color: white;
}
body {
margin: 1.5em;
border: .5em solid black;
padding: 0;
width: 48em;
background-color: white;
}
dl {
margin: 0;
border: 0;
padding: .5em;
}
dt {
background-color: rgb(204,0,0);
margin: 0;
padding: 1em;
width: 10.638%; /* refers to parent element's width of 47em. = 5em or 50px */
height: 28em;
border: .5em solid black;
float: left;
}
dd {
float: right;
margin: 0 0 0 1em;
border: 1em solid black;
padding: 1em;
width: 34em;
height: 27em;
}
ul {
margin: 0;
border: 0;
padding: 0;
}
li {
display: block; /* i.e., suppress marker */
color: black;
height: 9em;
width: 5em;
margin: 0;
border: .5em solid black;
padding: 1em;
float: left;
background-color: #FC0;
}
#bar {
background-color: black;
color: white;
width: 41.17%; /* = 14em */
border: 0;
margin: 0 1em;
}
#baz {
margin: 1em 0;
border: 0;
padding: 1em;
width: 10em;
height: 10em;
background-color: black;
color: white;
}
form {
margin: 0;
display: inline;
}
p {
margin: 0;
}
form p {
line-height: 1.9;
}
blockquote {
margin: 1em 1em 1em 2em;
border-width: 1em 1.5em 2em .5em;
border-style: solid;
border-color: black;
padding: 1em 0;
width: 5em;
height: 9em;
float: left;
background-color: #FC0;
color: black;
}
address {
font-style: normal;
}
h1 {
background-color: black;
color: white;
float: left;
margin: 1em 0;
border: 0;
padding: 1em;
width: 10em;
height: 10em;
font-weight: normal;
font-size: 1em;
}
</style>
</head>
<body>
<dl>
<dt>
toggle
</dt>
<dd>
<ul>
<li>
the way
</li>
<li id="bar">
<p>
the world ends
</p>
<form action="./" method="get">
<p>
bang
<input name="foo" value="off" type="radio">
</p>
<p>
whimper
<input name="foo2" value="on" type="radio">
</p>
</form>
</li>
<li>
i grow old
</li>
<li id="baz">
pluot?
</li>
</ul>
<blockquote>
<address>
bar maids,
</address>
</blockquote>
<h1>
sing to me, erbarme dich
</h1>
</dd>
</dl>
<p style="color: black; font-size: 1em; line-height: 1.3em; clear: both">
This is a nonsensical document, but syntactically valid HTML 4.0. All
100%-conformant CSS1 agents should be able to render the document
elements above this paragraph indistinguishably (to the pixel) from this
<a href="http://www.w3.org/Style/CSS/Test/CSS1/current/sec5526c.gif">reference rendering,</a>
(except font rasterization and form widgets). All discrepancies
should be traceable to CSS1 implementation shortcomings. Once you have
finished evaluating this test, you can return to the <a href="http://www.w3.org/Style/CSS/Test/CSS1/current/sec5526c.htm">parent page</a>.
</p>
</body></html>

145
tests/html/acid2.html Executable file
View file

@ -0,0 +1,145 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<title>The Second Acid Test</title>
<style type="text/css">
/* section numbers refer to CSS2.1 */
/* page setup */
html { font: 12px sans-serif; margin: 0; padding: 0; overflow: hidden; /* hides scrollbars on viewport, see 11.1.1:3 */ background: white; color: red; }
body { margin: 0; padding: 0; }
/* introduction message */
.intro { font: 2em sans-serif; margin: 3.5em 2em; padding: 0.5em; border: solid thin; background: white; color: black; position: relative; z-index: 2; /* should cover the black and red bars that are fixed-positioned */ }
.intro * { font: inherit; margin: 0; padding: 0; }
.intro h1 { font-size: 1em; font-weight: bolder; margin: 0; padding: 0; }
.intro :link { color: blue; }
.intro :visited { color: purple; }
/* picture setup */
#top { margin: 100em 3em 0; padding: 2em 0 0 .5em; text-align: left; font: 2em/24px sans-serif; color: navy; white-space: pre; } /* "Hello World!" text */
.picture { position: relative; border: 1em solid transparent; margin: 0 0 100em 3em; } /* containing block for face */
.picture { background: red; } /* overriden by preferred stylesheet below */
/* top line of face (scalp): fixed positioning and min/max height/width */
.picture p { position: fixed; margin: 0; padding: 0; border: 0; top: 9em; left: 11em; width: 140%; max-width: 4em; height: 8px; min-height: 1em; max-height: 2mm; /* min-height overrides max-height, see 10.7 */ background: black; border-bottom: 0.5em yellow solid; }
/* bits that shouldn't be part of the top line (and shouldn't be visible at all): HTML parsing, "+" combinator, stacking order */
.picture p.bad { border-bottom: red solid; /* shouldn't matter, because the "p + table + p" rule below should match it too, thus hiding it */ }
.picture p + p { background: maroon; z-index: 1; } /* shouldn't match anything */
.picture p + table + p { margin-top: 3em; /* should end up under the absolutely positioned table below, and thus not be visible */ }
/* second line of face: attribute selectors, float positioning */
[class~=one].first.one { position: absolute; top: 0; margin: 36px 0 0 60px; padding: 0; border: black 2em; border-style: none solid; /* shrink wraps around float */ }
[class~=one][class~=first] [class=second\ two][class="second two"] { float: right; width: 48px; height: 12px; background: yellow; margin: 0; padding: 0; } /* only content of abs pos block */
/* third line of face: width and overflow */
.forehead { margin: 4em; width: 8em; border-left: solid black 1em; border-right: solid black 1em; background: red url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAADElEQVR42mP4%2F58BAAT%2FAf9jgNErAAAAAElFTkSuQmCC); /* that's a 1x1 yellow pixel PNG */ }
.forehead * { width: 12em; line-height: 1em; }
/* class selectors headache */
.two.error.two { background: maroon; } /* shouldn't match */
.forehead.error.forehead { background: red; } /* shouldn't match */
[class=second two] { background: red; } /* this should be ignored (invalid selector -- grammar says it only accepts IDENTs or STRINGs) */
/* fourth and fifth lines of face, with eyes: paint order test (see appendix E) and fixed backgrounds */
/* the two images are identical: 2-by-2 squares with the top left
and bottom right pixels set to yellow and the other two set to
transparent. Since they are offset by one pixel from each other,
the second one paints exactly over the transparent parts of the
first one, thus creating a solid yellow block. */
.eyes { position: absolute; top: 5em; left: 3em; margin: 0; padding: 0; background: red; }
#eyes-a { height: 0; line-height: 2em; text-align: right; } /* contents should paint top-most because they're inline */
#eyes-a object { display: inline; vertical-align: bottom; }
#eyes-a object[type] { width: 7.5em; height: 2.5em; } /* should have no effect since that object should fallback to being inline (height/width don't apply to inlines) */
#eyes-a object object object { border-right: solid 1em black; padding: 0 12px 0 11px; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAIAAAD91JpzAAAABnRSTlMAAAAAAABupgeRAAAABmJLR0QA%2FwD%2FAP%2BgvaeTAAAAEUlEQVR42mP4%2F58BCv7%2FZwAAHfAD%2FabwPj4AAAAASUVORK5CYII%3D) fixed 1px 0; }
#eyes-b { float: left; width: 10em; height: 2em; background: fixed url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAIAAAD91JpzAAAABnRSTlMAAAAAAABupgeRAAAABmJLR0QA%2FwD%2FAP%2BgvaeTAAAAEUlEQVR42mP4%2F58BCv7%2FZwAAHfAD%2FabwPj4AAAAASUVORK5CYII%3D); border-left: solid 1em black; border-right: solid 1em red; } /* should paint in the middle layer because it is a float */
#eyes-c { display: block; background: red; border-left: 2em solid yellow; width: 10em; height: 2em; } /* should paint bottom most because it is a block */
/* lines six to nine, with nose: auto margins */
.nose { float: left; margin: -2em 2em -1em; border: solid 1em black; border-top: 0; min-height: 80%; height: 60%; max-height: 3em; /* percentages become auto (see 10.5 and 10.7) and intrinsic height is more than 3em, so 3em wins */ padding: 0; width: 12em; }
.nose > div { padding: 1em 1em 3em; height: 0; background: yellow; }
.nose div div { width: 2em; height: 2em; background: red; margin: auto; }
.nose :hover div { border-color: blue; }
.nose div:hover :before { border-bottom-color: inherit; }
.nose div:hover :after { border-top-color: inherit; }
.nose div div:before { display: block; border-style: none solid solid; border-color: red yellow black yellow; border-width: 1em; content: ''; height: 0; }
.nose div :after { display: block; border-style: solid solid none; border-color: black yellow red yellow; border-width: 1em; content: ''; height: 0; }
/* between lines nine and ten: margin collapsing with 'float' and 'clear' */
.empty { margin: 6.25em; height: 10%; /* computes to auto which makes it empty per 8.3.1:7 (own margins) */ }
.empty div { margin: 0 2em -6em 4em; }
.smile { margin: 5em 3em; clear: both; /* clearance is negative (see 8.3.1 and 9.5.1) */ }
/* line ten and eleven: containing block for abs pos */
.smile div { margin-top: 0.25em; background: black; width: 12em; height: 2em; position: relative; bottom: -1em; }
.smile div div { position: absolute; top: 0; right: 1em; width: auto; height: 0; margin: 0; border: yellow solid 1em; }
/* smile (over lines ten and eleven): backgrounds behind borders, inheritance of 'float', nested floats, negative heights */
.smile div div span { display: inline; margin: -1em 0 0 0; border: solid 1em transparent; border-style: none solid; float: right; background: black; height: 1em; }
.smile div div span em { float: inherit; border-top: solid yellow 1em; border-bottom: solid black 1em; } /* zero-height block; width comes from (zero-height) child. */
.smile div div span em strong { width: 6em; display: block; margin-bottom: -1em; /* should have no effect, since parent has top&bottom borders, so this margin doesn't collapse */ }
/* line twelve: line-height */
.chin { margin: -4em 4em 0; width: 8em; line-height: 1em; border-left: solid 1em black; border-right: solid 1em black; background: yellow url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAIAAAFSDNYfAAAAaklEQVR42u3XQQrAIAwAQeP%2F%2F6wf8CJBJTK9lnQ7FpHGaOurt1I34nfH9pMMZAZ8BwMGEvvh%2BBsJCAgICLwIOA8EBAQEBAQEBAQEBK79H5RfIQAAAAAAAAAAAAAAAAAAAAAAAAAAAID%2FABMSqAfj%2FsLmvAAAAABJRU5ErkJggg%3D%3D) /* 64x64 red square */ no-repeat fixed /* shouldn't be visible unless the smiley is moved to the top left of the viewport */; }
.chin div { display: inline; font: 2px/4px serif; }
/* line thirteen: cascade and selector tests */
.parser-container div { color: maroon; border: solid; color: orange; } /* setup */
div.parser-container * { border-color: black; /* overrides (implied) border-color on previous line */ } /* setup */
* div.parser { border-width: 0 2em; /* overrides (implied) declarations on earlier line */ } /* setup */
/* line thirteen continued: parser tests */
.parser { /* comment parsing test -- comment ends before the end of this line, the backslash should have no effect: \*/ }
.parser { margin: 0 5em 1em; padding: 0 1em; width: 2em; height: 1em; error: \}; background: yellow; } /* setup with parsing test */
* html .parser { background: gray; }
\.parser { padding: 2em; }
.parser { m\argin: 2em; };
.parser { height: 3em; }
.parser { width: 200; }
.parser { border: 5em solid red ! error; }
.parser { background: red pink; }
/* line fourteen (last line of face): table */
ul { display: table; padding: 0; margin: -1em 7em 0; background: red; }
ul li { padding: 0; margin: 0; }
ul li.first-part { display: table-cell; height: 1em; width: 1em; background: black; }
ul li.second-part { display: table; height: 1em; width: 1em; background: black; } /* anonymous table cell wraps around this */
ul li.third-part { display: table-cell; height: 0.5em; /* gets stretched to fit row */ width: 1em; background: black; }
ul li.fourth-part { list-style: none; height: 1em; width: 1em; background: black; } /* anonymous table cell wraps around this */
/* bits that shouldn't appear: inline alignment in cells */
.image-height-test { height: 10px; overflow: hidden; font: 20em serif; } /* only the area between the top of the line box and the top of the image should be visible */
table { margin: 0; border-spacing: 0; }
td { padding: 0; }
</style>
<link rel="appendix stylesheet" href="data:text/css,.picture%20%7B%20background%3A%20none%3B%20%7D"> <!-- this stylesheet should be applied by default -->
</head>
<body>
<div class="intro">
<h1>Standards compliant?</h1>
<p><a href="#top">Take The Acid2 Test</a> and compare it to <a
href="reference.html">the reference rendering</a>.</p>
</div>
<h2 id="top">Hello World!</h2>
<div class="picture">
<p><table><tr><td></table><p class="bad"> <!-- <table> closes <p> per the HTML4 DTD -->
<blockquote class="first one"><address class="second two"></address></blockquote>
<div class="forehead"><div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div></div>
<div class="eyes"><div id="eyes-a"><object data="data:application/x-unknown,ERROR"><object data="http://www.damowmow.com/404/" type="text/html"><object data="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAAAYCAYAAAFy7sgCAAAGsUlEQVRo3u2ZbWwcZxHHf3s%2B7LNbO3ZjXBtowprGODRX0qpNQCjmJKuVKhMl1P2AkCwhFOIKkCBSm9IXavGFKAixIAECwkmWo5MrhRI3Ub40IEwQgp6aIDg3Cd6eEqyIHEteah%2B1E69vhw%2BZtTaX8704ZzkKjHS6271nZ56ZZ%2BY%2F%2F%2BdZKF%2FCwYshx3EkkggLsD1v4FQkEZZYLCbAKyG9%2Ba9EIsG6hnUAf8x74K3aUC3j4%2BM54HcsR2oAIomwZOezkv%2FnSHpYNh%2BNCmAE7xv94zvFdd1bHsjMZmQkPSxAJP%2B%2FfuBLwK54PC7JZFKAVJmzXLBt2w%2FMvcDLwIb8QS8CeJ4nkURYIomw7J%2FYJ8BvSiiXptGGxWds2%2Fa9%2Bnaxh%2BYAD%2Bgt04NDgABTpQY2cvvSFLzw86gWeBVwC8SzlOSv2YeBPfmDBoBHgKmR9LBEEmHZfDTqGykqfkUE0nA78BzQGfSgUeP3wNeTXwXg7MwZDhw4UHL6ra2ti79%2FOvljgG8AZ4H64Lhm4MvAocxsRppGG%2FxcXihlwLIs6R%2FfKV2HO%2F26uA94pdDYUKUZUU7W1RQYXA98Gnhaf5%2FXWX0HeAHYoQonqa4sZSOsSWMCWeC9Yko%2BCQwBe4E6oNc0Tc91XTl1%2BaTsn9gnI%2Blhyc5nZWxsrBIkKSbl2tiic3tW53YDEwOKaoFBrcOfqKee53lG9xsPMjV784r%2F4lO%2FpPvyJ9iyZcuvFSaXK5XYeAZ4CDgGvB3MS4B54LQuWYPeuy4iRFsevsXqpuYoqVQKIH2bK1CuDQNo11o4XUzh%2FcDWYIe1LEtyuZx4niee54njOGKapgfsqlL%2Bl2OjEXg8nxrc1dJ0h3hbtL%2BGCtz7KPBF4CuBe9uB15VafE8hr9qylI3HgG8C2%2FK7VyHZoJj7MrBRm30qFotJMpkU27YlHo%2F7Ha5a%2BV%2FKRkSJ4KuKRLVLKapTjB1SzAVIjY2NSXY%2BKyPpYdk%2FsU9OXT4pruv6BdZbBQfKsVGnvWlIe1VB6VQO8JxC1vZYLCbZ%2BaxsPhpdZDyRRFhG0sPiOE6ldKBg2lRg4xF1YCDIIIKN7DGgD3gH%2BBXwejKZfPrs2tPs%2FvPN2bKuYR1nd7xLKBSSJeqoXKnERjPwNWAG%2BLn2rZuM%2B4Tpml6vaWlp4eLcxVusZq5lCgVgOVKJjRqdX86ffL4D5wIoZACnTpw4wRMdT96i%2FImOJxERAs4uVyqxUacF%2FPdiCj%2BjdRBRGFtwXVdG0sPSdbhTmkYbpH98p2RmM2JZlig1vl0GWo4NQ%2Fn%2Bs5pKRXfwjweaxy7TND3HcRZbfC6X8xVPVQlGy7WxVWlO5XRXFXm6EZmrQuSXYyPE3SiVoEhE6Wyr0u2rumO6zv%2B21AFdQAswC1wCMuUCXCmyWQus103Qg8qlDO0lxwOb%2Fl4FiK3AB3VS%2FuKKLtK%2FgbeAnwG%2FvUODuRw%2FFrR0H1UC75fwu8oJ%2FhFsW5VIG%2FBUgEIN6Y65O4AHu4Ap0zQ9y7LEcZyb9lRBUHQcRyzL8unZVBW5bFWAvAp%2BhDQ2g4F47dUYtlU6obXA54DnVdFLekjUGGifh4AFy7LEdV3xj3X9I66m0QZpGm2QrsOd0j%2B%2BU0bSw5KZzYjrun6HWlAd961i4FfCj0aN1Usau%2Bc1lmuXPFwvAEumUut7tQQvAb%2FXb%2FT0bCAej9cODg7yt%2Bm%2F8q2%2F7OUHZ76PnZ1k2p0mJzlykmPancbOTnL0whHs7CQfb%2B5mx2d3sH79%2BtCRI0c6FeaOr9ICrIQfLvA%2B8BGNXxi4R6HrisJVUWrxAVW2oMFf0Aczim8o3kV6enowDIPjF9%2Fk%2BMU3S3rrjzMMg56eHr%2BxP7qKFbASfojG6kpeDGs1tiW53RxwWT%2Bin5q8w4xpQK5evQpAR30H7ZH2khNvj7TTUd8BgD4rqmu1ZKX8qNeY%2BfHz4zlXDgT5E8tpCTUq7XSBC4Euv8227TV9fX1E73%2BYtvo27BmbS9cvFVTY3bSRFza9yOcf6Gfmygy7d%2B%2Fm%2FPnzF4DvrsBLhnJlJfwIKXxv1PheAE4qK6p4H9AGbNKTuhngBPBPXYRe4IemaT5kWZbR19fHNbmGnZ1k4r3U4glDR30Hm5qjbGjsImJEOHbsGHv27JFz5869o0eFq01Jq%2BmHAXwI6FFKagMTgHM7GzFDS%2BoeLSMv7zjzC9x4Y7gxFovVDAwMEI1GaWlpWSzRVCrFwYMH%2FXfxZ4AfAa8B%2F7lDaGg1%2FQgp43lfK0yqtRMuJa3ceKe5DfgYsCYAZ2ngD8CfAkzqTpW7xY%2F%2FSznyX%2FVeUb2kVmX4AAAAAElFTkSuQmCC">ERROR</object></object></object></div><div id="eyes-b"></div><div id="eyes-c"></div></div> <!-- that's a PNG with 8bit alpha containing two eyes -->
<div class="nose"><div><div></div></div></div>
<div class="empty"><div></div></div>
<div class="smile"><div><div><span><em><strong></strong></em></span></div></div></div>
<div class="chin"><div>&nbsp;</div></div>
<div class="parser-container"><div class="parser"><!-- ->ERROR<!- --></div></div> <!-- two dashes is what delimits a comment, so the text "->ERROR<!-" earlier on this line is actually part of a comment -->
<ul>
<li class="first-part"></li>
<li class="second-part"></li>
<li class="third-part"></li>
<li class="fourth-part"></li>
</ul>
<div class="image-height-test"><table><tr><td><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAIAAAFSDNYfAAAAaklEQVR42u3XQQrAIAwAQeP%2F%2F6wf8CJBJTK9lnQ7FpHGaOurt1I34nfH9pMMZAZ8BwMGEvvh%2BBsJCAgICLwIOA8EBAQEBAQEBAQEBK79H5RfIQAAAAAAAAAAAAAAAAAAAAAAAAAAAID%2FABMSqAfj%2FsLmvAAAAABJRU5ErkJggg%3D%3D" alt=""></td></tr></table></div>
</div>
</body>
</html>

BIN
tests/html/andreas.jpeg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 93 KiB

46
tests/html/anonymous_table.html Normal file
View file

@ -0,0 +1,46 @@
<!DOCTYPE html>
<html>
<head>
<title>Fixed Table</title>
<style>
.table {
display: table;
table-layout: fixed;
width: 600px;
border: solid black 2px;
}
.colgroup {
display: table-column-group;
}
.column {
display: table-column;
}
.row {
display: table-row;
}
.cell {
display: table-cell;
border: solid red 1px;
}
</style>
</head>
<body>
<p> This test checks Anonymous table objects(CSS 2.1, Section 17.2.1) </p>
<p> 1. Remove irrelevant boxes</p>
<p> 2. Generate missing child wrappers: `table-row`, `table-cell` </p>
<div class="table">
<span class="column"> inline child box of table-column. NOT Shown </span>
<span class="colgroup">
<span>inline child box of table-column-group</span> NOT Shown
</span>
<span class="cell">Cell1</span>
<span class="cell">Cell2</span>
<span class="row">
2nd Row
<span>Cell4</span>
<span class="cell">Cell3</span>
Cell5
</span>
</div>
</body>
<html>

20
tests/html/background.html Normal file
View file

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<style>
.test { background: url(rust-0.png) gray; }
</style>
<body>
<div class="test" style="width:200px; height:200px; color:red;">
background: url(rust-0.png) gray; width:200px; height:200px;
</div>
<div class="test" style="background-image: url(rust-45.png); width:200px; height:200px; color:red;">
background-image: url(rust-45.png); width:200px; height:200px;
</div>
<div style="background: url(rust-90.png) yellow; width:200px; height:200px; border: 5px solid #000; color:blue;">
background: url(rust-90.png) yellow; width:200px; height:200px; border: 5px solid #000;
</div>
</body>
</html>

1
tests/html/bad-line-ends.html Normal file
View file

@ -0,0 +1 @@
<html> <head> <style> p { color: white; } p.blue { background-color: blue; } p.red { background-color: red; } </style> </head> <body> <p class="blue"> I am a paragraph. My background color is blue. </p> <p class="red"> I am a paragraph. My background color is red. </p> </body> </html>

25
tests/html/box-model-smoketest.html Normal file
View file

@ -0,0 +1,25 @@
<!DOCTYPE html>
<html>
<head>
<title>box model smoketest</title>
<style>
body {
margin: 0;
}
#outer {
background-color: red;
margin: 0;
padding: 0;
}
#inner {
margin: 16px;
border: solid green 16px;
padding: 16px;
background-color: blue;
color: white;
}
</style>
</head>
<body><div id=outer><div id=inner>Ten points for Gryffindor</div></div></body>
</html>

20
tests/html/color-change-text.html Normal file
View file

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<style>
.red { color: red; }
.blue { color: blue; }
</style>
<script>
window.setTimeout(function () {
window.document.getElementsByTagName('div')[0].setAttribute('class', 'blue');
window.document.getElementsByTagName('div')[1].setAttribute('style', 'color:red;');
}, 1000);
</script>
</head>
<body>
<div id="change" class="red">Hello, World!</div>
<div id="change" style="color:blue;">Hello, Servo!</div>
</body>
</html>

15
tests/html/combining-character-sequences.html Normal file
View file

@ -0,0 +1,15 @@
<head>
<body>
<div>
Here come the combining character sequences:
&#168;
A&#776; = &#196;
a&#776; = &#228;
O&#776; = &#214;
o&#776; = &#246;
U&#776; = &#220;
u&#776; = &#252;
Z&#776;
z&#776;
</div>
</body>

43
tests/html/demo.css Normal file
View file

@ -0,0 +1,43 @@
body {
background-color: rgb(200, 255, 255)
}
#hello {
background-color: blue;
color: red
}
#kitty {
position: absolute;
top: 200px;
left: 100px;
border-color: rgb(0, 0, 0);
border-width: 10px
}
#boxa {
position: absolute;
top: 50px;
left: 500px;
width: 100px;
height: 100px;
background-color: rgba(255, 0, 0, 0.5)
}
#boxb {
position: absolute;
top: 70px;
left: 580px;
width: 100px;
height: 100px;
background-color: rgba(0, 255, 0, 0.5)
}
#boxc {
position: absolute;
top: 130px;
left: 550px;
width: 100px;
height: 100px;
background-color: rgba(0, 0, 255, 0.5)
}

22
tests/html/demo.html Normal file
View file

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="demo.css" />
</head>
<body>
<div id="hello">hello, world</div>
<div id="lipsum">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc volutpat feugiat fermentum. Curabitur luctus consequat urna a tincidunt. Nullam vitae velit eu arcu congue volutpat in a diam. Pellentesque lacus ipsum, gravida et tristique sit amet, varius eu ipsum. Duis venenatis sem id nibh commodo tempor. Curabitur risus tellus, cursus quis pellentesque sed, elementum eget neque. Sed ultricies, orci et adipiscing dapibus, mauris nisi condimentum felis, ac euismod tellus nunc vel felis. Aliquam egestas accumsan turpis, a volutpat dui fermentum id. Aliquam erat volutpat. Nunc vel auctor odio. Donec eu posuere dolor. Donec vitae justo purus, nec bibendum lectus. Quisque elit tortor, tristique vel ultricies sed, euismod sed tellus. Nullam dolor purus, porta et hendrerit id, rhoncus eu lectus. Nam vel lorem at dui mattis pretium eget a nisi.
</div>
<div id="boxa">HEA</div>
<div id="boxb">HEA</div>
<div id="boxc">HEA</div>
<img id="kitty" src="test.jpeg"></img>
</body>
</html>

8
tests/html/doge-servo.html Normal file
View file

@ -0,0 +1,8 @@
<html>
<head>
<title>Such browser</title>
</head>
<body>
<img src="doge-servo.jpg"/>
</body>
</html>

BIN
tests/html/doge-servo.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 228 KiB

8
tests/html/failure.html Normal file
View file

@ -0,0 +1,8 @@
<html>
<head>
<title>about:failure</title>
</head>
<body>
<img src="itried.jpg"/>
</body>
</html>

20
tests/html/filmstrip.html Normal file
View file

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html>
<head>
<title>Filmstrip</title>
</head>
<body>
<p><img src="longcattop.png"></p>
<p><img src="longcatbot.png"></p>
<script>
var index = 0;
function change() {
document.getElementsByTagName("img")[0].src = "rust-" + (index * 45) + ".png";
index = (index + 1) % 8;
setTimeout(change, 100);
}
change();
</script>
</body>
</html>

36
tests/html/fixed_table.html Normal file
View file

@ -0,0 +1,36 @@
<!-- This test creates one table, one caption, three rows, three header cells, and five data cells.
The table uses the fixed table layout algorithm and the table's width specified to 600px.
Each column's width will be assigned as follows:
- 1st column: 200px (because it is defined in col element)
- 2nd column: 100px (because it is defined in first row)
- 3rd column: remaining width (becuase it is not defined so the remaining width is assigned)
And table, caption, td, th elements have border. -->
<!DOCTYPE html>
<html>
<head>
<title>Fixed Table</title>
<style>
table {
table-layout: fixed;
width: 600px;
border: solid black 2px;
}
caption { border: solid blue 1px; }
td { border: solid red 1px; }
th { border: solid red 1px; }
</style>
</head>
<body>
<table>
<caption>This is a 3x3 fixed table</caption>
<colgroup>
<col style="width: 200px" />
</colgroup>
<tbody>
<tr><th style="width: 100px">Header 1</th><td style="width: 100px">Cell 1</td><td>Cell 2</td></tr>
<tr><th style="width: 300px">Header 2</th><td style="width: 300px">Cell 3</th><td>Cell 4</td></tr>
<tr><th>Header 3</th><td>Cell 5</th></tr>
</tbody>
</table>
</body>
<html>

36
tests/html/fixed_table_2.html Normal file
View file

@ -0,0 +1,36 @@
<!-- This test creates one table, one caption, three rows, three header cells, and five data cells.
The table uses the fixed table layout algorithm and the table's width specified to 600px.
Each column's width will be assigned according to their ratio of column's widths
which are defined in col elements.
And table, caption, td, th elements have border. -->
<!DOCTYPE html>
<html>
<head>
<title>Fixed Table</title>
<style>
table {
table-layout: fixed;
width: 600px;
border: solid black 2px;
}
caption { border: solid blue 1px; }
td { border: solid red 1px; }
th { border: solid red 1px; }
</style>
</head>
<body>
<table>
<caption>This is a 3x3 fixed table</caption>
<colgroup>
<col style="width: 10px" />
<col style="width: 20px" />
<col style="width: 30px" />
</colgroup>
<tbody>
<tr><th style="width: 100px">Header 1</th><td style="width: 100px">Cell 1</td><td>Cell 2</td></tr>
<tr><th style="width: 300px">Header 2</th><td style="width: 300px">Cell 3</th><td>Cell 4</td></tr>
<tr><th>Header 3</th><td>Cell 5</th></tr>
</tbody>
</table>
</body>
<html>

39
tests/html/fixed_table_additional_cols.html Normal file
View file

@ -0,0 +1,39 @@
<!-- This test creates one table, one caption, three rows, three header cells, and five data cells.
The table uses the fixed table layout algorithm and the table's width specified to 600px.
Each column's width will be assigned as follows:
- 1st & 2nd column: 200px (because it is defined in col element)
- 3rd & 4th column: remaining width / 2
(becuase it is not defined so the remaining width is equally divided)
And table, caption, td, th elements have border. -->
<!DOCTYPE html>
<html>
<head>
<title>Fixed Table</title>
<style>
table {
table-layout: fixed;
width: 600px;
border: solid black 2px;
}
caption { border: solid blue 1px; }
td { border: solid red 1px; }
th { border: solid red 1px; }
</style>
</head>
<body>
<table>
<caption>This is a 3x4 fixed table</caption>
<colgroup>
<col style="width: 200px" />
<col style="width: 200px" />
<col />
<col />
</colgroup>
<tbody>
<tr><th>Header 1</th><td>Cell 1</td><td>Cell 2</td></tr>
<tr><th>Header 2</th><td>Cell 3</th><td>Cell 4</td></tr>
<tr><th>Header 3</th><td>Cell 5</th></tr>
</tbody>
</table>
</body>
<html>

40
tests/html/fixed_table_basic_height.html Normal file
View file

@ -0,0 +1,40 @@
<!-- This test creates one table, three rows, three header cells, and six data cells.
The table uses the fixed table layout algorithm and the table's width specified to 600px.
Each column's width will be assigned as 200px.
Each table row height is decided as max(specified row height, specified cells' heights, cells' minimum content heights).
As a result, each table row height will be assigned as followings:
- 1st row: 30px (specified cell height)
- 2nd row: 50px (specified row height)
- 3rd row: minimum content height
-->
<!DOCTYPE html>
<html>
<head>
<title>Table Height Test</title>
<style>
table {
table-layout: fixed;
width: 600px;
border: solid black 2px;
}
caption {
border: solid blue 1px;
}
td, th {
border: solid red 1px;
padding: 0px;
}
</style>
</head>
<body>
<table>
<caption>This test checks table height algorithm (CSS 2.1, Section 17.5.3),
excluding `vertical-align` and percentage height</caption>
<tbody>
<tr style="height:10px"><th>Header 1</th><td style="height: 30px">Cell 1</td><td>Cell 2</td></tr>
<tr style="height:50px"><th>Header 2</th><td>Cell 3</td><td style="height:10px">Cell 4</td></tr>
<tr style="height:20px"><th>Header 3</th><td style="height:10px">Cell 5</td><td><div>Cell6</div><p>Cell6</td></tr>
</tbody>
</table>
</body>
<html>

30
tests/html/fixed_table_simple.html Normal file
View file

@ -0,0 +1,30 @@
<!-- This test creates one table, one caption, three rows, three header cells, and six data cells.
The table uses fixed table layout algorithm and the table's width specified to 600px.
Each column should have same width because the column's widths are not defined here.
And table, caption, td, th elements have border. -->
<!DOCTYPE html>
<html>
<head>
<title>Simple Fixed Table</title>
<style>
table {
table-layout: fixed;
width: 600px;
border: solid black 2px;
}
caption { border: solid blue 1px; }
td { border: solid red 1px; }
th { border: solid red 1px; }
</style>
</head>
<body>
<table>
<caption>This is a 3x3 fixed table</caption>
<tbody>
<tr><th>Header 1</th><td>Cell 1</td><td>Cell 2</td></tr>
<tr><th>Header 2</th><td>Cell 3</td><td>Cell 4</td></tr>
<tr><th>Header 3</th><td>Cell 5</td><td>Cell 6</td></tr>
</tbody>
</table>
</body>
<html>

50
tests/html/fixed_table_with_margin_padding.html Normal file
View file

@ -0,0 +1,50 @@
<!-- This test creates one table, one caption, three rows, three header cells, and five data cells.
The table uses the fixed table layout algorithm and the table's width specified to 600px.
Each column's width will be assigned as follows:
- 1st column: 200px (because it is defined in col element)
- 2nd column: 100px (because it is defined in first row)
- 3rd column: remaining width (becuase it is not defined so the remaining width is assigned)
The table and caption elements have border, margin, and padding.
The td and th elements have border and padding. -->
<!DOCTYPE html>
<html>
<head>
<title>Fixed Table with margin, border, and padding</title>
<style>
table {
table-layout: fixed;
width: 600px;
border: solid black 2px;
margin: 10px;
padding: 10px;
}
caption {
border: solid blue 1px;
margin: 5px;
padding: 5px;
}
td {
border: solid red 1px;
padding: 5px;
}
th {
border: solid red 1px;
padding: 5px;
}
</style>
</head>
<body>
<table>
<caption>This is a 3x3 fixed table with margin, border, and padding</caption>
<colgroup>
<col style="width: 200px" />
<col />
</colgroup>
<tbody>
<tr><th style="width: 100px">Header 1</th><td style="width: 100px">Cell 1</td><td>Cell 2</td></tr>
<tr><th>Header 2</th><td>Cell 3</td><td>Cell 4</td></tr>
<tr><th>Header 3</th><td>Cell 5</td></tr>
</tbody>
</table>
</body>
<html>

Some files were not shown because too many files have changed in this diff Show more