diff options
Diffstat (limited to 'testing/web-platform/tests/html/dom/elements')
197 files changed, 8785 insertions, 0 deletions
diff --git a/testing/web-platform/tests/html/dom/elements/.gitkeep b/testing/web-platform/tests/html/dom/elements/.gitkeep new file mode 100644 index 000000000..e69de29bb --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/.gitkeep diff --git a/testing/web-platform/tests/html/dom/elements/content-models/.gitkeep b/testing/web-platform/tests/html/dom/elements/content-models/.gitkeep new file mode 100644 index 000000000..e69de29bb --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/content-models/.gitkeep diff --git a/testing/web-platform/tests/html/dom/elements/content-models/contains.json b/testing/web-platform/tests/html/dom/elements/content-models/contains.json new file mode 100644 index 000000000..42f158d36 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/content-models/contains.json @@ -0,0 +1,48 @@ +[ + { + "id": "kinds-of-content", + "original_id": "kinds-of-content", + "children": [ + { + "id": "metadata-content", + "original_id": "metadata-content" + }, + { + "id": "flow-content", + "original_id": "flow-content" + }, + { + "id": "sectioning-content", + "original_id": "sectioning-content" + }, + { + "id": "heading-content", + "original_id": "heading-content" + }, + { + "id": "phrasing-content", + "original_id": "phrasing-content" + }, + { + "id": "embedded-content", + "original_id": "embedded-content" + }, + { + "id": "interactive-content", + "original_id": "interactive-content" + }, + { + "id": "palpable-content", + "original_id": "palpable-content" + } + ] + }, + { + "id": "transparent-content-models", + "original_id": "transparent-content-models" + }, + { + "id": "paragraphs", + "original_id": "paragraphs" + } +]
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/element-definitions/.gitkeep b/testing/web-platform/tests/html/dom/elements/element-definitions/.gitkeep new file mode 100644 index 000000000..e69de29bb --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/element-definitions/.gitkeep diff --git a/testing/web-platform/tests/html/dom/elements/element-definitions/contains.json b/testing/web-platform/tests/html/dom/elements/element-definitions/contains.json new file mode 100644 index 000000000..a942e85a2 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/element-definitions/contains.json @@ -0,0 +1,6 @@ +[ + { + "id": "attributes", + "original_id": "attributes" + } +]
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/elements-in-the-dom/.gitkeep b/testing/web-platform/tests/html/dom/elements/elements-in-the-dom/.gitkeep new file mode 100644 index 000000000..e69de29bb --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/elements-in-the-dom/.gitkeep diff --git a/testing/web-platform/tests/html/dom/elements/elements-in-the-dom/unknown-element.html b/testing/web-platform/tests/html/dom/elements/elements-in-the-dom/unknown-element.html new file mode 100644 index 000000000..907b14837 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/elements-in-the-dom/unknown-element.html @@ -0,0 +1,16 @@ +<!DOCTYPE html> +<title>HTMLUnknownElement</title> +<link rel="author" title="Ms2ger" href="mailto:ms2ger@gmail.com"> +<link rel="help" href="https://html.spec.whatwg.org/multipage/#htmlunknownelement"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<div id="log"></div> +<script> +test(function() { + var elt = document.createElement("xxx"); + assert_true(window.HTMLUnknownElement && elt instanceof HTMLUnknownElement, + "not an instance of HTMLUnknownElement"); + assert_true(window.HTMLSpanElement && !(elt instanceof HTMLSpanElement), + "an instance of HTMLSpanElement"); +}); +</script> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/.gitkeep b/testing/web-platform/tests/html/dom/elements/global-attributes/.gitkeep new file mode 100644 index 000000000..e69de29bb --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/.gitkeep diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/.htaccess b/testing/web-platform/tests/html/dom/elements/global-attributes/.htaccess new file mode 100644 index 000000000..94e9a4f19 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/.htaccess @@ -0,0 +1,16 @@ +AddType 'text/html; charset=UTF-8' html +<Files 'the-lang-attribute-003.html'> +AddLanguage 'ko' .html +</Files> +<Files 'the-lang-attribute-005.html'> +AddLanguage 'zh' .html +</Files> +<Files 'the-lang-attribute-006.html'> +AddLanguage 'zh' .html +</Files> +<Files 'the-lang-attribute-009.html'> +AddLanguage 'ko' .html +</Files> +<Files 'the-lang-attribute-011.html'> +AddLanguage 'ko,zh,ja' .html +</Files> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/classlist-nonstring.html b/testing/web-platform/tests/html/dom/elements/global-attributes/classlist-nonstring.html new file mode 100644 index 000000000..5b0560b31 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/classlist-nonstring.html @@ -0,0 +1,44 @@ +<!DOCTYPE html> +<title>classList: non-string contains</title> +<link rel="author" title="Ms2ger" href="mailto:ms2ger@gmail.com"> +<link rel="help" href="https://html.spec.whatwg.org/multipage/#classes"> +<link rel="help" href="https://html.spec.whatwg.org/multipage/#domtokenlist"> +<link rel="help" href="https://heycam.github.io/webidl/#es-DOMString"> +<link rel="help" href="http://www.ecma-international.org/publications/files/ECMA-ST/ECMA-262.pdf#page=57"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<div id="log"></div> +<div id="test"> +<ul> +<li class=undefined> +<li class=null> +<li class=0> +<li class=NaN> +<li class=Infinity> +<li class=-Infinity> +</ul> +<script> +var items = document.getElementById("test") + .getElementsByTagName("li"); +var tests = [undefined, null, -0, +0, NaN, +Infinity, -Infinity]; +var results = [ + [true, false, false, false, false, false, false], // "undefined" + [false, true, false, false, false, false, false], // "null" + [false, false, true, true, false, false, false], // "0" + [false, false, false, false, true, false, false], // "NaN" + [false, false, false, false, false, true, false], // "Infinity" + [false, false, false, false, false, false, true ] // "-Infinity" +]; +</script> +</div> +<script> +test(function() { + for (var i = 0, il = items.length; i < il; ++i) { + test(function() { + for (var j = 0, jl = tests.length; j < jl; ++j) { + assert_equals(items[i].classList.contains(tests[j]), results[i][j]); + } + }) + } +}) +</script> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/contains.json b/testing/web-platform/tests/html/dom/elements/global-attributes/contains.json new file mode 100644 index 000000000..c413488b5 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/contains.json @@ -0,0 +1,38 @@ +[ + { + "id": "the-id-attribute", + "original_id": "the-id-attribute" + }, + { + "id": "the-title-attribute", + "original_id": "the-title-attribute" + }, + { + "id": "the-lang-and-xml-lang-attributes", + "original_id": "the-lang-and-xml:lang-attributes" + }, + { + "id": "the-translate-attribute", + "original_id": "the-translate-attribute" + }, + { + "id": "the-xml-base-attribute-xml-only", + "original_id": "the-xml:base-attribute-(xml-only)" + }, + { + "id": "the-dir-attribute", + "original_id": "the-dir-attribute" + }, + { + "id": "classes", + "original_id": "classes" + }, + { + "id": "the-style-attribute", + "original_id": "the-style-attribute" + }, + { + "id": "embedding-custom-non-visible-data-with-the-data-attributes", + "original_id": "embedding-custom-non-visible-data-with-the-data-*-attributes" + } +]
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/custom-attrs.html b/testing/web-platform/tests/html/dom/elements/global-attributes/custom-attrs.html new file mode 100644 index 000000000..a1e41dac2 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/custom-attrs.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> + <head> + <title>Element Custom Attributes</title> + <link rel="author" title="Bruno de Oliveira Abinader" href="mailto:bruno.d@partner.samsung.com"> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#dom-dataset"> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#xml"> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + <script src="/dom/nodes/attributes.js"></script> + </head> + <body> + <h1>Element Custom Attributes</h1> + <div id="log"></div> + <script> + test(function() { + var div = document.createElement("div"); + div.setAttributeNS("foo", "data-my-custom-attr", "first"); + div.setAttributeNS("bar", "data-my-custom-attr", "second"); + div.dataset.myCustomAttr = "third"; + + assert_equals(div.attributes.length, 3); + attributes_are(div, [["data-my-custom-attr", "first", "foo"], + ["data-my-custom-attr", "second", "bar"], + ["data-my-custom-attr", "third", null]]); + }, "Setting an Element's dataset property should not interfere with namespaced attributes with same name"); + </script> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/data_unicode_attr.html b/testing/web-platform/tests/html/dom/elements/global-attributes/data_unicode_attr.html new file mode 100644 index 000000000..17077dafd --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/data_unicode_attr.html @@ -0,0 +1,22 @@ +<!DOCTYPE HTML> +<meta charset="utf-8"> +<title>HTML Test: dataset attribute</title> +<link rel="author" title="ElegantPig" href="mailto:neil.ep@hotmail.com"> +<link rel="author" title="Xiaojun Wu" href="mailto:xiaojunx.a.wu@intel.com"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<div id='log'></div> +<div id="d1" data-weapons="laser 2" data-ä¸æ–‡å±žæ€§="ä¸æ–‡"></div> +<script> + +test(function() { + var d1 = document.getElementById("d1"); + assert_equals(d1.dataset.weapons, "laser 2"); +}, "dataset - SBCS"); + +test(function() { + var d1 = document.getElementById("d1"); + assert_equals(d1.dataset.ä¸æ–‡å±žæ€§, "ä¸æ–‡"); +}, "dataset - UNICODE"); + +</script> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dataset-delete.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dataset-delete.html new file mode 100644 index 000000000..65e131f44 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dataset-delete.html @@ -0,0 +1,47 @@ +<!DOCTYPE html> +<html> + <head> + <title>Dataset - Delete</title> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + </head> + <body> + <h1>Dataset - Delete</h1> + <div id="log"></div> + <script> + function testDelete(attr, prop) + { + var d = document.createElement("div"); + d.setAttribute(attr, "value"); + delete d.dataset[prop]; + return d.hasAttribute(attr) === false && d.getAttribute(attr) != "value"; + } + + function testDeleteNoAdd(prop) + { + var d = document.createElement("div"); + delete d.dataset[prop]; + return true; + } + + test(function() { assert_true(testDelete('data-foo', 'foo')); }, + "Deleting element.dataset['foo'] should also remove an attribute with name 'data-foo' should it exist."); + test(function() { assert_true(testDelete('data-foo-bar', 'fooBar')); }, + "Deleting element.dataset['fooBar'] should also remove an attribute with name 'data-foo-bar' should it exist."); + test(function() { assert_true(testDelete('data--', '-')); }, + "Deleting element.dataset['-'] should also remove an attribute with name 'data--' should it exist."); + test(function() { assert_true(testDelete('data--foo', 'Foo')); }, + "Deleting element.dataset['Foo'] should also remove an attribute with name 'data--foo' should it exist."); + test(function() { assert_true(testDeleteNoAdd('data--foo', '-foo')); }, + "Deleting element.dataset['-foo'] should also remove an attribute with name 'data--foo' should it exist."); + test(function() { assert_true(testDelete('data---foo', '-Foo')); }, + "Deleting element.dataset['-Foo'] should also remove an attribute with name 'data---foo' should it exist."); + test(function() { assert_true(testDelete('data-', '')); }, + "Deleting element.dataset[''] should also remove an attribute with name 'data-' should it exist."); + test(function() { assert_true(testDelete('data-\xE0', '\xE0')); }, + "Deleting element.dataset['\xE0'] should also remove an attribute with name 'data-\xE0' should it exist."); + test(function() { assert_true(testDeleteNoAdd('foo')); }, + "Deleting element.dataset['foo'] should not throw if even if the element does now have an attribute with the name data-foo."); + </script> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dataset-enumeration.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dataset-enumeration.html new file mode 100644 index 000000000..4b1063379 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dataset-enumeration.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> + <head> + <title>Dataset - Enumeration</title> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + </head> + <body> + <h1>Dataset - Enumeration</h1> + <div id="log"></div> + <script> + function testEnumeration(array) + { + var d = document.createElement("div"); + for (var i = 0; i < array.length; ++i) + d.setAttribute(array[i], "value"); + + var count = 0; + for (var item in d.dataset) + count++; + + return count; + } + + test(function() { assert_equals(testEnumeration(['data-foo', 'data-bar', 'data-baz']), 3); }, + "A dataset should be enumeratable."); + test(function() { assert_equals(testEnumeration(['data-foo', 'data-bar', 'dataFoo']), 2); }, + "Only attributes who qualify as dataset properties should be enumeratable in the dataset."); + </script> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dataset-get.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dataset-get.html new file mode 100644 index 000000000..ab4078c4f --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dataset-get.html @@ -0,0 +1,57 @@ +<!DOCTYPE html> +<html> + <head> + <title>Dataset - Get</title> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + </head> + <body> + <h1>Dataset - Get</h1> + <div id="log"></div> + <script> + function testGet(attr, expected) + { + var d = document.createElement("div"); + d.setAttribute(attr, "value"); + return d.dataset[expected] == "value"; + } + + test(function() { assert_true(testGet('data-foo', 'foo')); }, + "Getting element.dataset['foo'] should return the value of element.getAttribute('data-foo')'"); + test(function() { assert_true(testGet('data-foo-bar', 'fooBar')); }, + "Getting element.dataset['fooBar'] should return the value of element.getAttribute('data-foo-bar')'"); + test(function() { assert_true(testGet('data--', '-')); }, + "Getting element.dataset['-'] should return the value of element.getAttribute('data--')'"); + test(function() { assert_true(testGet('data--foo', 'Foo')); }, + "Getting element.dataset['Foo'] should return the value of element.getAttribute('data--foo')'"); + test(function() { assert_true(testGet('data---foo', '-Foo')); }, + "Getting element.dataset['-Foo'] should return the value of element.getAttribute('data---foo')'"); + test(function() { assert_true(testGet('data-Foo', 'foo')); }, + "Getting element.dataset['foo'] should return the value of element.getAttribute('data-Foo')'"); + test(function() { assert_true(testGet('data-', '')); }, + "Getting element.dataset[''] should return the value of element.getAttribute('data-')'"); + test(function() { assert_true(testGet('data-\xE0', '\xE0')); }, + "Getting element.dataset['\xE0'] should return the value of element.getAttribute('data-\xE0')'"); + test(function() { assert_true(testGet('data-to-string', 'toString')); }, + "Getting element.dataset['toString'] should return the value of element.getAttribute('data-to-string')'"); + + function matchesNothingInDataset(attr) + { + var d = document.createElement("div"); + d.setAttribute(attr, "value"); + + if (!d.dataset) + return false; + + var count = 0; + for (var item in d.dataset) + count++; + return count == 0; + } + + test(function() { assert_true(matchesNothingInDataset('dataFoo')); }, + "Tests that an attribute named dataFoo does not make an entry in the dataset DOMStringMap."); + + </script> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dataset-prototype.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dataset-prototype.html new file mode 100644 index 000000000..6b1661846 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dataset-prototype.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> + <head> + <title>Dataset - element.dataset is an instance of DOMStringMap</title> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + </head> + <body> + <h1>Dataset - element.dataset is an instance of DOMStringMap</h1> + <div id="log"></div> + <script> + test(function() { assert_true(document.createElement("div").dataset instanceof window.DOMStringMap); }, + "An elements dataset property is an instance of a DOMStringMap"); + test(function() { + var dataset = document.createElement("div").dataset; + assert_true("toString" in dataset, '"toString" in dataset'); + assert_equals(dataset.toString, Object.prototype.toString); + assert_false("expando" in dataset, '"expando" in dataset'); + assert_equals(dataset.expando, undefined); + Object.prototype.expando = 42; + assert_true("expando" in dataset, '"expando" in dataset'); + assert_equals(dataset.expando, 42); + }, "Properties on Object.prototype should shine through."); + </script> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dataset-set.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dataset-set.html new file mode 100644 index 000000000..722b17977 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dataset-set.html @@ -0,0 +1,42 @@ +<!DOCTYPE html> +<html> + <head> + <title>Dataset - Set</title> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + </head> + <body> + <h1>Dataset - Set</h1> + <div id="log"></div> + <script> + function testSet(prop, expected) + { + var d = document.createElement("div"); + d.dataset[prop] = "value"; + return d.getAttribute(expected) == "value"; + } + + test(function() { assert_true(testSet('foo', 'data-foo')); }, + "Setting element.dataset['foo'] should also change the value of element.getAttribute('data-foo')'"); + test(function() { assert_true(testSet('fooBar', 'data-foo-bar')); }, + "Setting element.dataset['fooBar'] should also change the value of element.getAttribute('data-foo-bar')'"); + test(function() { assert_true(testSet('-', 'data--')); }, + "Setting element.dataset['-'] should also change the value of element.getAttribute('data--')'"); + test(function() { assert_true(testSet('Foo', 'data--foo')); }, + "Setting element.dataset['Foo'] should also change the value of element.getAttribute('data--foo')'"); + test(function() { assert_true(testSet('-Foo', 'data---foo')); }, + "Setting element.dataset['-Foo'] should also change the value of element.getAttribute('data---foo')'"); + test(function() { assert_true(testSet('', 'data-')); }, + "Setting element.dataset[''] should also change the value of element.getAttribute('data-')'"); + test(function() { assert_true(testSet('\xE0', 'data-\xE0')); }, + "Setting element.dataset['\xE0'] should also change the value of element.getAttribute('data-\xE0')'"); + test(function() { assert_throws('SYNTAX_ERR', function() { testSet('-foo', 'dummy') }); }, + "Setting element.dataset['-foo'] should throw a SYNTAX_ERR'"); + test(function() { assert_throws('INVALID_CHARACTER_ERR', function() { testSet('foo\x20', 'dummy') }); }, + "Setting element.dataset['foo\x20'] should throw an INVALID_CHARACTER_ERR'"); + test(function() { assert_throws('INVALID_CHARACTER_ERR', function() { testSet('foo\uF900', 'dummy') }); }, + "Setting element.dataset['foo\uF900'] should throw an INVALID_CHARACTER_ERR'"); + + </script> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dataset.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dataset.html new file mode 100644 index 000000000..a4a16d014 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dataset.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<title>dataset: should exist and work on HTML and SVG elements, but not random elements</title> +<link rel="author" title="Ms2ger" href="mailto:ms2ger@gmail.com"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<div id="log"></div> +<script> +var div = document.createElement("div"); +test(function() { + assert_true(div.dataset instanceof DOMStringMap); +}, "HTML elements should have a .dataset"); +test(function() { + assert_false("foo" in div.dataset); + assert_equals(div.dataset.foo, undefined); +}, "Should return 'undefined' before setting an attribute") +test(function() { + div.setAttribute("data-foo", "value"); + assert_true("foo" in div.dataset); + assert_equals(div.dataset.foo, "value"); +}, "Should return 'value' if that's the value") +test(function() { + div.setAttribute("data-foo", ""); + assert_true("foo" in div.dataset); + assert_equals(div.dataset.foo, ""); +}, "Should return the empty string if that's the value") +test(function() { + div.removeAttribute("data-foo"); + assert_false("foo" in div.dataset); + assert_equals(div.dataset.foo, undefined); +}, "Should return 'undefined' after removing an attribute") +test(function() { + assert_equals(document.createElementNS("test", "test").dataset, undefined); +}, "Should not have a .dataset on random elements"); +test(function() { + var svg = document.createElementNS("http://www.w3.org/2000/svg", "svg") + assert_true(svg.dataset instanceof DOMStringMap); +}, "SVG elements should have a .dataset"); +</script> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-EN-L-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-EN-L-ref.html new file mode 100644 index 000000000..de6e13b3a --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-EN-L-ref.html @@ -0,0 +1,57 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with EN, then L</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + In this test, it is the Latin letter A since digits are not strongly + directional, thus the direction must be resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <p dir="ltr">123ABCאבג.</p> + </div> + <div dir="rtl"> + <p dir="ltr">123ABCאבג.</p> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <p dir="ltr">123ABCאבג.</p> + </div> + <div dir="rtl"> + <p dir="ltr">123ABCאבג.</p> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-EN-L.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-EN-L.html new file mode 100644 index 000000000..fa8d793bd --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-EN-L.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with EN, then L</title> + <link rel="match" href="dir_auto-EN-L-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + In this test, it is the Latin letter A since digits are not strongly + directional, thus the direction must be resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <p dir="auto">123ABCאבג.</p> + </div> + <div dir="rtl"> + <p dir="auto">123ABCאבג.</p> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <p dir="ltr">123ABCאבג.</p> + </div> + <div dir="rtl"> + <p dir="ltr">123ABCאבג.</p> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-EN-R-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-EN-R-ref.html new file mode 100644 index 000000000..15bd618dc --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-EN-R-ref.html @@ -0,0 +1,57 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with EN, then R</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + In this test, it is the Hebrew letter Alef since digits are not strongly + directional, thus the direction must be resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <p dir="rtl">123אבגABC.</p> + </div> + <div dir="rtl"> + <p dir="rtl">123אבגABC.</p> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <p dir="rtl">123אבגABC.</p> + </div> + <div dir="rtl"> + <p dir="rtl">123אבגABC.</p> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-EN-R.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-EN-R.html new file mode 100644 index 000000000..7165de583 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-EN-R.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with EN, then R</title> + <link rel="match" href="dir_auto-EN-R-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + In this test, it is the Hebrew letter Alef since digits are not strongly + directional, thus the direction must be resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <p dir="auto">123אבגABC.</p> + </div> + <div dir="rtl"> + <p dir="auto">123אבגABC.</p> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <p dir="rtl">123אבגABC.</p> + </div> + <div dir="rtl"> + <p dir="rtl">123אבגABC.</p> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-L-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-L-ref.html new file mode 100644 index 000000000..23da64ed9 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-L-ref.html @@ -0,0 +1,57 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with L</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + In this test, it is the Latin letter A, thus the direction must be + resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <p dir="ltr">ABCאבג.</p> + </div> + <div dir="rtl"> + <p dir="ltr">ABCאבג.</p> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <p dir="ltr">ABCאבג.</p> + </div> + <div dir="rtl"> + <p dir="ltr">ABCאבג.</p> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-L.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-L.html new file mode 100644 index 000000000..3896bcb76 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-L.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with L</title> + <link rel="match" href="dir_auto-L-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + In this test, it is the Latin letter A, thus the direction must be + resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <p dir="auto">ABCאבג.</p> + </div> + <div dir="rtl"> + <p dir="auto">ABCאבג.</p> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <p dir="ltr">ABCאבג.</p> + </div> + <div dir="rtl"> + <p dir="ltr">ABCאבג.</p> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-EN-L-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-EN-L-ref.html new file mode 100644 index 000000000..c7977d189 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-EN-L-ref.html @@ -0,0 +1,57 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with N, then EN, then L</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + In this test, it is the Latin letter A since neutrals and digits are not + strongly directional, thus the direction must be resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <p dir="ltr">.-=123ABCאבג.</p> + </div> + <div dir="rtl"> + <p dir="ltr">.-=123ABCאבג.</p> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <p dir="ltr">.-=123ABCאבג.</p> + </div> + <div dir="rtl"> + <p dir="ltr">.-=123ABCאבג.</p> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-EN-L.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-EN-L.html new file mode 100644 index 000000000..21ca0338d --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-EN-L.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with N, then EN, then L</title> + <link rel="match" href="dir_auto-N-EN-L-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + In this test, it is the Latin letter A since neutrals and digits are not + strongly directional, thus the direction must be resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <p dir="auto">.-=123ABCאבג.</p> + </div> + <div dir="rtl"> + <p dir="auto">.-=123ABCאבג.</p> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <p dir="ltr">.-=123ABCאבג.</p> + </div> + <div dir="rtl"> + <p dir="ltr">.-=123ABCאבג.</p> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-EN-R-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-EN-R-ref.html new file mode 100644 index 000000000..aae50bc72 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-EN-R-ref.html @@ -0,0 +1,57 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with N, then EN, then R</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + In this test, it is the Hebrew letter Alef since neutrals and digits are not + strongly directional, thus the direction must be resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <p dir="rtl">.-=123אבגABC.</p> + </div> + <div dir="rtl"> + <p dir="rtl">.-=123אבגABC.</p> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <p dir="rtl">.-=123אבגABC.</p> + </div> + <div dir="rtl"> + <p dir="rtl">.-=123אבגABC.</p> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-EN-R.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-EN-R.html new file mode 100644 index 000000000..b10a52b1a --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-EN-R.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with N, then EN, then R</title> + <link rel="match" href="dir_auto-N-EN-R-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + In this test, it is the Hebrew letter Alef since neutrals and digits are not + strongly directional, thus the direction must be resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <p dir="auto">.-=123אבגABC.</p> + </div> + <div dir="rtl"> + <p dir="auto">.-=123אבגABC.</p> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <p dir="rtl">.-=123אבגABC.</p> + </div> + <div dir="rtl"> + <p dir="rtl">.-=123אבגABC.</p> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-EN-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-EN-ref.html new file mode 100644 index 000000000..154d56aaf --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-EN-ref.html @@ -0,0 +1,51 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with N, then EN, then L</title> + <link rel="match" href="dir_auto-N-EN-L-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text, ignoring neutrals and numbers. + If there is no strong character, as in this test, the direction defaults to LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="test"> + <div dir="ltr"> + <p dir="ltr">@123!</p> + </div> + <div dir="rtl"> + <p dir="ltr">@123!</p> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <p dir="ltr">@123!</p> + </div> + <div dir="rtl"> + <p dir="ltr">@123!</p> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-EN.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-EN.html new file mode 100644 index 000000000..5d948d345 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-EN.html @@ -0,0 +1,51 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with N, then EN, then L</title> + <link rel="match" href="dir_auto-N-EN-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text, ignoring neutrals and numbers. + If there is no strong character, as in this test, the direction defaults to LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="test"> + <div dir="ltr"> + <p dir="auto">@123!</p> + </div> + <div dir="rtl"> + <p dir="auto">@123!</p> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <p dir="ltr">@123!</p> + </div> + <div dir="rtl"> + <p dir="ltr">@123!</p> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-L-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-L-ref.html new file mode 100644 index 000000000..4bbaca1e3 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-L-ref.html @@ -0,0 +1,57 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with N, then L</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + In this test, it is the Latin letter A since neutrals are not + strongly directional, thus the direction must be resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <p dir="ltr">.-=ABCאבג.</p> + </div> + <div dir="rtl"> + <p dir="ltr">.-=ABCאבג.</p> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <p dir="ltr">.-=ABCאבג.</p> + </div> + <div dir="rtl"> + <p dir="ltr">.-=ABCאבג.</p> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-L.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-L.html new file mode 100644 index 000000000..945fa0677 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-L.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with N, then L</title> + <link rel="match" href="dir_auto-N-L-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + In this test, it is the Latin letter A since neutrals are not + strongly directional, thus the direction must be resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <p dir="auto">.-=ABCאבג.</p> + </div> + <div dir="rtl"> + <p dir="auto">.-=ABCאבג.</p> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <p dir="ltr">.-=ABCאבג.</p> + </div> + <div dir="rtl"> + <p dir="ltr">.-=ABCאבג.</p> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-R-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-R-ref.html new file mode 100644 index 000000000..7a1daeddd --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-R-ref.html @@ -0,0 +1,57 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with N, then R</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + In this test, it is the Hebrew letter Alef since neutrals are not + strongly directional, thus the direction must be resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <p dir="rtl">.-=אבגABC.</p> + </div> + <div dir="rtl"> + <p dir="rtl">.-=אבגABC.</p> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <p dir="rtl">.-=אבגABC.</p> + </div> + <div dir="rtl"> + <p dir="rtl">.-=אבגABC.</p> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-R.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-R.html new file mode 100644 index 000000000..bf27a16a2 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-N-R.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with N, then R</title> + <link rel="match" href="dir_auto-N-R-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + In this test, it is the Hebrew letter Alef since neutrals are not + strongly directional, thus the direction must be resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <p dir="auto">.-=אבגABC.</p> + </div> + <div dir="rtl"> + <p dir="auto">.-=אבגABC.</p> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <p dir="rtl">.-=אבגABC.</p> + </div> + <div dir="rtl"> + <p dir="rtl">.-=אבגABC.</p> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-R-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-R-ref.html new file mode 100644 index 000000000..c9dc5301b --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-R-ref.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with R</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + In this test, it is the Hebrew letter Alef, thus the direction must be + resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + </div> + <div class="test"> + <div dir="ltr"> + <p dir="rtl">אבגABC.</p> + </div> + <div dir="rtl"> + <p dir="rtl">אבגABC.</p> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <p dir="rtl">אבגABC.</p> + </div> + <div dir="rtl"> + <p dir="rtl">אבגABC.</p> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-R.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-R.html new file mode 100644 index 000000000..69a62fc63 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-R.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with R</title> + <link rel="match" href="dir_auto-R-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + In this test, it is the Hebrew letter Alef, thus the direction must be + resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <p dir="auto">אבגABC.</p> + </div> + <div dir="rtl"> + <p dir="auto">אבגABC.</p> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <p dir="rtl">אבגABC.</p> + </div> + <div dir="rtl"> + <p dir="rtl">אבגABC.</p> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-L-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-L-ref.html new file mode 100644 index 000000000..4e42a11a9 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-L-ref.html @@ -0,0 +1,61 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with L within contained element</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text, including text within contained elements. + In this test, it is the Latin letter A, thus the direction must be + resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + ד - The Hebrew letter Dalet (strongly RTL). + ה - The Hebrew letter He (strongly RTL). + ו - The Hebrew letter Vav (strongly RTL). + ז - The Hebrew letter Zayin (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="ltr"><div><div>ABCאבג.</div>דה</div>ו</div> + </div> + <div dir="rtl"> + <div dir="ltr"><div><div>ABCאבג.</div>דה</div>ו</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="ltr"><div><div>ABCאבג.</div>דה</div>ו</div> + </div> + <div dir="rtl"> + <div dir="ltr"><div><div>ABCאבג.</div>דה</div>ו</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-L.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-L.html new file mode 100644 index 000000000..f71f318bf --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-L.html @@ -0,0 +1,62 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with L within contained element</title> + <link rel="match" href="dir_auto-contained-L-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text, including text within contained elements. + In this test, it is the Latin letter A, thus the direction must be + resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + ד - The Hebrew letter Dalet (strongly RTL). + ה - The Hebrew letter He (strongly RTL). + ו - The Hebrew letter Vav (strongly RTL). + ז - The Hebrew letter Zayin (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="auto"><div><div>ABCאבג.</div>דה</div>ו</div> + </div> + <div dir="rtl"> + <div dir="auto"><div><div>ABCאבג.</div>דה</div>ו</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="ltr"><div><div>ABCאבג.</div>דה</div>ו</div> + </div> + <div dir="rtl"> + <div dir="ltr"><div><div>ABCאבג.</div>דה</div>ו</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-R-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-R-ref.html new file mode 100644 index 000000000..a3938bdf8 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-R-ref.html @@ -0,0 +1,57 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with R within contained element</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text, including text within contained elements. + In this test, it is the Hebrew letter Alef, thus the direction must be + resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="rtl"><div><div>אבגABC.</div>XY</div>Z</div> + </div> + <div dir="rtl"> + <div dir="rtl"><div><div>אבגABC.</div>XY</div>Z</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="rtl"><div><div>אבגABC.</div>XY</div>Z</div> + </div> + <div dir="rtl"> + <div dir="rtl"><div><div>אבגABC.</div>XY</div>Z</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-R.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-R.html new file mode 100644 index 000000000..2ba63426e --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-R.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with R within contained element</title> + <link rel="match" href="dir_auto-contained-R-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text, including text within contained elements. + In this test, it is the Hebrew letter Alef, thus the direction must be + resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="auto"><div><div>אבגABC.</div>XY</div>Z</div> + </div> + <div dir="rtl"> + <div dir="auto"><div><div>אבגABC.</div>XY</div>Z</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="rtl"><div><div>אבגABC.</div>XY</div>Z</div> + </div> + <div dir="rtl"> + <div dir="rtl"><div><div>אבגABC.</div>XY</div>Z</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-bdi-L-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-bdi-L-ref.html new file mode 100644 index 000000000..470220c80 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-bdi-L-ref.html @@ -0,0 +1,60 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with bdi, then L</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text while ignoring bdi elements. + In this test, it is the Latin letter A, thus the direction must be + resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + ד - The Hebrew letter Dalet (strongly RTL). + ה - The Hebrew letter He (strongly RTL). + ו - The Hebrew letter Vav (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="ltr"><bdi>דהו</bdi>ABCאבג.</div> + </div> + <div dir="rtl"> + <div dir="ltr"><bdi>דהו</bdi>ABCאבג.</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="ltr"><bdi>דהו</bdi>ABCאבג.</div> + </div> + <div dir="rtl"> + <div dir="ltr"><bdi>דהו</bdi>ABCאבג.</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-bdi-L.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-bdi-L.html new file mode 100644 index 000000000..f35abfe3f --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-bdi-L.html @@ -0,0 +1,61 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with bdi, then L</title> + <link rel="match" href="dir_auto-contained-bdi-L-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text while ignoring bdi elements. + In this test, it is the Latin letter A, thus the direction must be + resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + ד - The Hebrew letter Dalet (strongly RTL). + ה - The Hebrew letter He (strongly RTL). + ו - The Hebrew letter Vav (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="auto"><bdi>דהו</bdi>ABCאבג.</div> + </div> + <div dir="rtl"> + <div dir="auto"><bdi>דהו</bdi>ABCאבג.</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="ltr"><bdi>דהו</bdi>ABCאבג.</div> + </div> + <div dir="rtl"> + <div dir="ltr"><bdi>דהו</bdi>ABCאבג.</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-bdi-R-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-bdi-R-ref.html new file mode 100644 index 000000000..94475aaa9 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-bdi-R-ref.html @@ -0,0 +1,57 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with bdi, then R</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text while ignoring bdi elements. + In this test, it is the Hebrew letter Alef, thus the direction must be + resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="rtl"><bdi>DEF</bdi>אבגABC.</div> + </div> + <div dir="rtl"> + <div dir="rtl"><bdi>DEF</bdi>אבגABC.</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="rtl"><bdi>DEF</bdi>אבגABC.</div> + </div> + <div dir="rtl"> + <div dir="rtl"><bdi>DEF</bdi>אבגABC.</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-bdi-R.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-bdi-R.html new file mode 100644 index 000000000..8ac324461 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-bdi-R.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with bdi, then R</title> + <link rel="match" href="dir_auto-contained-bdi-R-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text while ignoring bdi elements. + In this test, it is the Hebrew letter Alef, thus the direction must be + resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="auto"><bdi>DEF</bdi>אבגABC.</div> + </div> + <div dir="rtl"> + <div dir="auto"><bdi>DEF</bdi>אבגABC.</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="rtl"><bdi>DEF</bdi>אבגABC.</div> + </div> + <div dir="rtl"> + <div dir="rtl"><bdi>DEF</bdi>אבגABC.</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-dir-L-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-dir-L-ref.html new file mode 100644 index 000000000..7c9f931d3 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-dir-L-ref.html @@ -0,0 +1,60 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with dir, then L</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text while ignoring contained elements with an explicit dir of their own. + In this test, it is the Latin letter A, thus the direction must be + resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + ד - The Hebrew letter Dalet (strongly RTL). + ה - The Hebrew letter He (strongly RTL). + ו - The Hebrew letter Vav (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="ltr"><p dir="rtl">דהו</p>ABCאבג.</div> + </div> + <div dir="rtl"> + <div dir="ltr"><p dir="rtl">דהו</p>ABCאבג.</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="ltr"><p dir="rtl">דהו</p>ABCאבג.</div> + </div> + <div dir="rtl"> + <div dir="ltr"><p dir="rtl">דהו</p>ABCאבג.</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-dir-L.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-dir-L.html new file mode 100644 index 000000000..1f424682f --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-dir-L.html @@ -0,0 +1,61 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with dir, then L</title> + <link rel="match" href="dir_auto-contained-dir-L-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text while ignoring contained elements with an explicit dir of their own. + In this test, it is the Latin letter A, thus the direction must be + resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + ד - The Hebrew letter Dalet (strongly RTL). + ה - The Hebrew letter He (strongly RTL). + ו - The Hebrew letter Vav (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="auto"><p dir="rtl">דהו</p>ABCאבג.</div> + </div> + <div dir="rtl"> + <div dir="auto"><p dir="rtl">דהו</p>ABCאבג.</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="ltr"><p dir="rtl">דהו</p>ABCאבג.</div> + </div> + <div dir="rtl"> + <div dir="ltr"><p dir="rtl">דהו</p>ABCאבג.</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-dir-R-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-dir-R-ref.html new file mode 100644 index 000000000..c6748dc85 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-dir-R-ref.html @@ -0,0 +1,57 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with dir, then R</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text while ignoring contained elements with an explicit dir of their own. + In this test, it is the Hebrew letter Alef, thus the direction must be + resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="rtl"><p dir="ltr">DEF</p>אבגABC.</div> + </div> + <div dir="rtl"> + <div dir="rtl"><p dir="ltr">DEF</p>אבגABC.</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="rtl"><p dir="ltr">DEF</p>אבגABC.</div> + </div> + <div dir="rtl"> + <div dir="rtl"><p dir="ltr">DEF</p>אבגABC.</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-dir-R.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-dir-R.html new file mode 100644 index 000000000..daab19149 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-dir-R.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with dir, then R</title> + <link rel="match" href="dir_auto-contained-dir-R-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text while ignoring contained elements with an explicit dir of their own. + In this test, it is the Hebrew letter Alef, thus the direction must be + resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="auto"><p dir="ltr">DEF</p>אבגABC.</div> + </div> + <div dir="rtl"> + <div dir="auto"><p dir="ltr">DEF</p>אבגABC.</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="rtl"><p dir="ltr">DEF</p>אבגABC.</div> + </div> + <div dir="rtl"> + <div dir="rtl"><p dir="ltr">DEF</p>אבגABC.</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-dir_auto-L-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-dir_auto-L-ref.html new file mode 100644 index 000000000..53c60421f --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-dir_auto-L-ref.html @@ -0,0 +1,60 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with dir=auto, then L</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text while ignoring contained elements with an explicit dir of their own. + In this test, it is the Latin letter A, thus the direction must be + resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + ד - The Hebrew letter Dalet (strongly RTL). + ה - The Hebrew letter He (strongly RTL). + ו - The Hebrew letter Vav (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="ltr"><p dir="rtl">דהו</p>ABCאבג.</div> + </div> + <div dir="rtl"> + <div dir="ltr"><p dir="rtl">דהו</p>ABCאבג.</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="ltr"><p dir="rtl">דהו</p>ABCאבג.</div> + </div> + <div dir="rtl"> + <div dir="ltr"><p dir="rtl">דהו</p>ABCאבג.</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-dir_auto-L.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-dir_auto-L.html new file mode 100644 index 000000000..f491f6165 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-dir_auto-L.html @@ -0,0 +1,61 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with dir=auto, then L</title> + <link rel="match" href="dir_auto-contained-dir_auto-L-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text while ignoring contained elements with an explicit dir of their own. + In this test, it is the Latin letter A, thus the direction must be + resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + ד - The Hebrew letter Dalet (strongly RTL). + ה - The Hebrew letter He (strongly RTL). + ו - The Hebrew letter Vav (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="auto"><p dir="auto">דהו</p>ABCאבג.</div> + </div> + <div dir="rtl"> + <div dir="auto"><p dir="auto">דהו</p>ABCאבג.</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="ltr"><p dir="rtl">דהו</p>ABCאבג.</div> + </div> + <div dir="rtl"> + <div dir="ltr"><p dir="rtl">דהו</p>ABCאבג.</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-dir_auto-R-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-dir_auto-R-ref.html new file mode 100644 index 000000000..41871f04a --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-dir_auto-R-ref.html @@ -0,0 +1,57 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with dir=auto, then R</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text while ignoring contained elements with an explicit dir of their own. + In this test, it is the Hebrew letter Alef, thus the direction must be + resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="rtl"><p dir="ltr">DEF</p>.-=123אבגABC.</div> + </div> + <div dir="rtl"> + <div dir="rtl"><p dir="ltr">DEF</p>.-=123אבגABC.</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="rtl"><p dir="ltr">DEF</p>.-=123אבגABC.</div> + </div> + <div dir="rtl"> + <div dir="rtl"><p dir="ltr">DEF</p>.-=123אבגABC.</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-dir_auto-R.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-dir_auto-R.html new file mode 100644 index 000000000..e3131c89b --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-dir_auto-R.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with dir=auto, then R</title> + <link rel="match" href="dir_auto-contained-dir_auto-R-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text while ignoring contained elements with an explicit dir of their own. + In this test, it is the Hebrew letter Alef, thus the direction must be + resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="auto"><p dir="auto">DEF</p>.-=123אבגABC.</div> + </div> + <div dir="rtl"> + <div dir="auto"><p dir="auto">DEF</p>.-=123אבגABC.</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="rtl"><p dir="ltr">DEF</p>.-=123אבגABC.</div> + </div> + <div dir="rtl"> + <div dir="rtl"><p dir="ltr">DEF</p>.-=123אבגABC.</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-script-L-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-script-L-ref.html new file mode 100644 index 000000000..aca07de7e --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-script-L-ref.html @@ -0,0 +1,57 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with script, then L</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of descendant text while ignoring descendant script elements. + In this test, it is the Latin letter A, thus the direction must be + resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="ltr"><script>א = 3;</script>ABCאבג.</div> + </div> + <div dir="rtl"> + <div dir="ltr"><script>א = 3;</script>ABCאבג.</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="ltr"><script>א = 3;</script>ABCאבג.</div> + </div> + <div dir="rtl"> + <div dir="ltr"><script>א = 3;</script>ABCאבג.</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-script-L.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-script-L.html new file mode 100644 index 000000000..59a2e7775 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-script-L.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with script, then L</title> + <link rel="match" href="dir_auto-contained-script-L-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of descendant text while ignoring descendant script elements. + In this test, it is the Latin letter A, thus the direction must be + resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="auto"><script>א = 3;</script>ABCאבג.</div> + </div> + <div dir="rtl"> + <div dir="auto"><script>א = 3;</script>ABCאבג.</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="ltr"><script>א = 3;</script>ABCאבג.</div> + </div> + <div dir="rtl"> + <div dir="ltr"><script>א = 3;</script>ABCאבג.</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-script-R-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-script-R-ref.html new file mode 100644 index 000000000..921f10a4c --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-script-R-ref.html @@ -0,0 +1,57 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with script, then R</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of descendant text while ignoring descendant script elements. + In this test, it is the Hebrew letter Alef, thus the direction must be + resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="rtl"><script>x = 3;</script>אבגABC.</div> + </div> + <div dir="rtl"> + <div dir="rtl"><script>x = 3;</script>אבגABC.</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="rtl"><script>x = 3;</script>אבגABC.</div> + </div> + <div dir="rtl"> + <div dir="rtl"><script>x = 3;</script>אבגABC.</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-script-R.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-script-R.html new file mode 100644 index 000000000..a76515d22 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-script-R.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with script, then R</title> + <link rel="match" href="dir_auto-contained-script-R-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of descendant text while ignoring descendant script elements. + In this test, it is the Hebrew letter Alef, thus the direction must be + resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="auto"><script>x = 3;</script>אבגABC.</div> + </div> + <div dir="rtl"> + <div dir="auto"><script>x = 3;</script>אבגABC.</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="rtl"><script>x = 3;</script>אבגABC.</div> + </div> + <div dir="rtl"> + <div dir="rtl"><script>x = 3;</script>אבגABC.</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-style-L-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-style-L-ref.html new file mode 100644 index 000000000..2ec4f02ec --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-style-L-ref.html @@ -0,0 +1,57 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with style, then L</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of descendant text while ignoring descendant style elements. + In this test, it is the Latin letter A, thus the direction must be + resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="ltr"><style>body {color:black;}</style>ABCאבג.</div> + </div> + <div dir="rtl"> + <div dir="ltr"><style>body {color:black;}</style>ABCאבג.</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="ltr"><style>body {color:black;}</style>ABCאבג.</div> + </div> + <div dir="rtl"> + <div dir="ltr"><style>body {color:black;}</style>ABCאבג.</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-style-L.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-style-L.html new file mode 100644 index 000000000..cc74d4c93 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-style-L.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with style, then L</title> + <link rel="match" href="dir_auto-contained-style-L-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of descendant text while ignoring descendant style elements. + In this test, it is the Latin letter A, thus the direction must be + resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="auto"><style>body {color:black;}</style>ABCאבג.</div> + </div> + <div dir="rtl"> + <div dir="auto"><style>body {color:black;}</style>ABCאבג.</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="ltr"><style>body {color:black;}</style>ABCאבג.</div> + </div> + <div dir="rtl"> + <div dir="ltr"><style>body {color:black;}</style>ABCאבג.</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-style-R-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-style-R-ref.html new file mode 100644 index 000000000..9ad9d7109 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-style-R-ref.html @@ -0,0 +1,57 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with style, then R</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of descendant text while ignoring descendant style elements. + In this test, it is the Hebrew letter Alef, thus the direction must be + resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="rtl"><style>body {color:black;}</style>אבגABC.</div> + </div> + <div dir="rtl"> + <div dir="rtl"><style>body {color:black;}</style>אבגABC.</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="rtl"><style>body {color:black;}</style>אבגABC.</div> + </div> + <div dir="rtl"> + <div dir="rtl"><style>body {color:black;}</style>אבגABC.</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-style-R.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-style-R.html new file mode 100644 index 000000000..4aa70cdb2 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-style-R.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with style, then R</title> + <link rel="match" href="dir_auto-contained-style-R-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of descendant text while ignoring descendant style elements. + In this test, it is the Hebrew letter Alef, thus the direction must be + resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="auto"><style>body {color:black;}</style>אבגABC.</div> + </div> + <div dir="rtl"> + <div dir="auto"><style>body {color:black;}</style>אבגABC.</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="rtl"><style>body {color:black;}</style>אבגABC.</div> + </div> + <div dir="rtl"> + <div dir="rtl"><style>body {color:black;}</style>אבגABC.</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-textarea-L-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-textarea-L-ref.html new file mode 100644 index 000000000..411099f7b --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-textarea-L-ref.html @@ -0,0 +1,60 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with textarea, then L</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of descendant text while ignoring descendant textarea elements. + In this test, it is the Latin letter A, thus the direction must be + resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + ד - The Hebrew letter Dalet (strongly RTL). + ה - The Hebrew letter He (strongly RTL). + ו - The Hebrew letter Vav (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="ltr"><textarea>דהו</textarea>ABCאבג.</div> + </div> + <div dir="rtl"> + <div dir="ltr"><textarea>דהו</textarea>ABCאבג.</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="ltr"><textarea>דהו</textarea>ABCאבג.</div> + </div> + <div dir="rtl"> + <div dir="ltr"><textarea>דהו</textarea>ABCאבג.</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-textarea-L.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-textarea-L.html new file mode 100644 index 000000000..0de041fe0 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-textarea-L.html @@ -0,0 +1,61 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with textarea, then L</title> + <link rel="match" href="dir_auto-contained-textarea-L-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of descendant text while ignoring descendant textarea elements. + In this test, it is the Latin letter A, thus the direction must be + resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + ד - The Hebrew letter Dalet (strongly RTL). + ה - The Hebrew letter He (strongly RTL). + ו - The Hebrew letter Vav (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="auto"><textarea>דהו</textarea>ABCאבג.</div> + </div> + <div dir="rtl"> + <div dir="auto"><textarea>דהו</textarea>ABCאבג.</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="ltr"><textarea>דהו</textarea>ABCאבג.</div> + </div> + <div dir="rtl"> + <div dir="ltr"><textarea>דהו</textarea>ABCאבג.</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-textarea-R-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-textarea-R-ref.html new file mode 100644 index 000000000..351431fb2 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-textarea-R-ref.html @@ -0,0 +1,57 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with textarea, then R</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of descendant text while ignoring descendant textarea elements. + In this test, it is the Hebrew letter Alef, thus the direction must be + resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="rtl"><textarea>DEF</textarea>אבגABC.</div> + </div> + <div dir="rtl"> + <div dir="rtl"><textarea>DEF</textarea>אבגABC.</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="rtl"><textarea>DEF</textarea>אבגABC.</div> + </div> + <div dir="rtl"> + <div dir="rtl"><textarea>DEF</textarea>אבגABC.</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-textarea-R.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-textarea-R.html new file mode 100644 index 000000000..852de6073 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-contained-textarea-R.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, start with textarea, then R</title> + <link rel="match" href="dir_auto-contained-textarea-R-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of descendant text while ignoring descendant textarea elements. + In this test, it is the Hebrew letter Alef, thus the direction must be + resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <div dir="auto"><textarea>DEF</textarea>אבגABC.</div> + </div> + <div dir="rtl"> + <div dir="auto"><textarea>DEF</textarea>אבגABC.</div> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <div dir="rtl"><textarea>DEF</textarea>אבגABC.</div> + </div> + <div dir="rtl"> + <div dir="rtl"><textarea>DEF</textarea>אבגABC.</div> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-EN-L-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-EN-L-ref.html new file mode 100644 index 000000000..198d081c2 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-EN-L-ref.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, start with EN+L</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Latin letter A since digits are not strongly + directional, thus the direction must be resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="ltr" value="123ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value="123ABCאבג." /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="ltr" value="123ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value="123ABCאבג." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-EN-L.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-EN-L.html new file mode 100644 index 000000000..d5ade6c09 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-EN-L.html @@ -0,0 +1,59 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, start with EN+L</title> + <link rel="match" href="dir_auto-input-EN-L-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Latin letter A since digits are not strongly + directional, thus the direction must be resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="auto" value="123ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="auto" value="123ABCאבג." /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="ltr" value="123ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value="123ABCאבג." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-EN-R-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-EN-R-ref.html new file mode 100644 index 000000000..303afc3c6 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-EN-R-ref.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, start with EN+R</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Hebrew letter Alef since digits are not strongly + directional, thus the direction must be resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="rtl" value="123אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="rtl" value="123אבגABC." /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="rtl" value="123אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="rtl" value="123אבגABC." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-EN-R.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-EN-R.html new file mode 100644 index 000000000..08ef3ecd7 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-EN-R.html @@ -0,0 +1,59 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, start with EN+R</title> + <link rel="match" href="dir_auto-input-EN-R-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Hebrew letter Alef since digits are not strongly + directional, thus the direction must be resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="auto" value="123אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="auto" value="123אבגABC." /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="rtl" value="123אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="rtl" value="123אבגABC." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-L-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-L-ref.html new file mode 100644 index 000000000..cb3621aa6 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-L-ref.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, start with L</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Latin letter A, thus the direction must be + resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="ltr" value="ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value="ABCאבג." /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="ltr" value="ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value="ABCאבג." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-L.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-L.html new file mode 100644 index 000000000..0a23f2b86 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-L.html @@ -0,0 +1,59 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, start with L</title> + <link rel="match" href="dir_auto-input-L-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Latin letter A, thus the direction must be + resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="auto" value="ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="auto" value="ABCאבג." /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="ltr" value="ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value="ABCאבג." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-EN-L-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-EN-L-ref.html new file mode 100644 index 000000000..3d0f2cf3c --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-EN-L-ref.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, start with N+EN+L</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Latin letter A since neutrals and digits are not + strongly directional, thus the direction must be resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="ltr" value=".-=123ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value=".-=123ABCאבג." /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="ltr" value=".-=123ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value=".-=123ABCאבג." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-EN-L.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-EN-L.html new file mode 100644 index 000000000..03f85526d --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-EN-L.html @@ -0,0 +1,59 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, start with N+EN+L</title> + <link rel="match" href="dir_auto-input-N-EN-L-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Latin letter A since neutrals and digits are not + strongly directional, thus the direction must be resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="auto" value=".-=123ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="auto" value=".-=123ABCאבג." /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="ltr" value=".-=123ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value=".-=123ABCאבג." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-EN-R-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-EN-R-ref.html new file mode 100644 index 000000000..26bf27d61 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-EN-R-ref.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, start with N+EN+R</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Hebrew letter Alef since neutrals and digits are not + strongly directional, thus the direction must be resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="rtl" value=".-=123אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="rtl" value=".-=123אבגABC." /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="rtl" value=".-=123אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="rtl" value=".-=123אבגABC." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-EN-R.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-EN-R.html new file mode 100644 index 000000000..13193d3d7 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-EN-R.html @@ -0,0 +1,59 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, start with N+EN+R</title> + <link rel="match" href="dir_auto-input-N-EN-R-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Hebrew letter Alef since neutrals and digits are not + strongly directional, thus the direction must be resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="auto" value=".-=123אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="auto" value=".-=123אבגABC." /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="rtl" value=".-=123אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="rtl" value=".-=123אבגABC." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-EN-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-EN-ref.html new file mode 100644 index 000000000..33f75b730 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-EN-ref.html @@ -0,0 +1,53 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, all N+EN</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value, or to LTR if there is no such + character. + In this test, there is no strongly directional character in the value, + thus the direction must be resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="ltr" value="@123!" /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value="@123!" /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="ltr" value="@123!" /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value="@123!" /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-EN.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-EN.html new file mode 100644 index 000000000..03df3c6dc --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-EN.html @@ -0,0 +1,54 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, all N+EN</title> + <link rel="match" href="dir_auto-input-N-EN-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value, or to LTR if there is no such + character. + In this test, there is no strongly directional character in the value, + thus the direction must be resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="auto" value="@123!" /> + </div> + <div dir="rtl"> + <input type="text" dir="auto" value="@123!" /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="ltr" value="@123!" /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value="@123!" /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-L-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-L-ref.html new file mode 100644 index 000000000..b6a89a1d7 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-L-ref.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, start with N+L</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Latin letter A since neutrals are not + strongly directional, thus the direction must be resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="ltr" value=".-=ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value=".-=ABCאבג." /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="ltr" value=".-=ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value=".-=ABCאבג." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-L.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-L.html new file mode 100644 index 000000000..9c1d3bcee --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-L.html @@ -0,0 +1,59 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, start with N+L</title> + <link rel="match" href="dir_auto-input-N-L-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Latin letter A since neutrals are not + strongly directional, thus the direction must be resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="auto" value=".-=ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="auto" value=".-=ABCאבג." /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="ltr" value=".-=ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value=".-=ABCאבג." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-R-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-R-ref.html new file mode 100644 index 000000000..bcd543044 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-R-ref.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, start with N+R</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Hebrew letter Alef since neutrals are not + strongly directional, thus the direction must be resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="rtl" value=".-=אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="rtl" value=".-=אבגABC." /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="rtl" value=".-=אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="rtl" value=".-=אבגABC." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-R.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-R.html new file mode 100644 index 000000000..dbf54f734 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-N-R.html @@ -0,0 +1,59 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, start with N+R</title> + <link rel="match" href="dir_auto-input-N-R-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Hebrew letter Alef since neutrals are not + strongly directional, thus the direction must be resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="auto" value=".-=אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="auto" value=".-=אבגABC." /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="rtl" value=".-=אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="rtl" value=".-=אבגABC." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-R-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-R-ref.html new file mode 100644 index 000000000..217972e82 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-R-ref.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, start with R</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Hebrew letter Alef, thus the direction must be + resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="rtl" value="אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="rtl" value="אבגABC." /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="rtl" value="אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="rtl" value="אבגABC." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-R.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-R.html new file mode 100644 index 000000000..6d2612b31 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-R.html @@ -0,0 +1,59 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, start with R</title> + <link rel="match" href="dir_auto-input-R-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Hebrew letter Alef, thus the direction must be + resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="auto" value="אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="auto" value="אבגABC." /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="rtl" value="אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="rtl" value="אבגABC." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-EN-L-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-EN-L-ref.html new file mode 100644 index 000000000..879e20d6c --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-EN-L-ref.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, script assigns to start with EN+L</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Latin letter A since digits are not strongly + directional, thus the direction must be resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="ltr" value="123ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value="123ABCאבג." /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="ltr" value="123ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value="123ABCאבג." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-EN-L.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-EN-L.html new file mode 100644 index 000000000..d0a9e2bb9 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-EN-L.html @@ -0,0 +1,70 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, script assigns to start with EN+L</title> + <link rel="match" href="dir_auto-input-script-EN-L-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Latin letter A since digits are not strongly + directional, thus the direction must be resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + This test makes sure that the direction is set correctly for an input whose value is set + dynamically by script. + </div> + <div id="test" class="test"> + <script> + window.onload = function() { + var test = document.getElementById('test'); + var inputs = test.getElementsByTagName('input'); + for (var i = 0; i != inputs.length; i++) { + inputs[i].value = '123ABC\u05D0\u05D1\u05D2.'; + } + } + </script> + <div dir="ltr"> + <input type="text" dir="auto" value="א" /> + </div> + <div dir="rtl"> + <input type="text" dir="auto" value="א" /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="ltr" value="123ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value="123ABCאבג." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-EN-R-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-EN-R-ref.html new file mode 100644 index 000000000..15781e252 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-EN-R-ref.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, script assigns to start with EN+R</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Hebrew letter Alef since digits are not strongly + directional, thus the direction must be resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="rtl" value="123אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="rtl" value="123אבגABC." /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="rtl" value="123אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="rtl" value="123אבגABC." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-EN-R.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-EN-R.html new file mode 100644 index 000000000..e444b90dc --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-EN-R.html @@ -0,0 +1,70 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, script assigns to start with EN+R</title> + <link rel="match" href="dir_auto-input-script-EN-R-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Hebrew letter Alef since digits are not strongly + directional, thus the direction must be resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + This test makes sure that the direction is set correctly for an input whose value is set + dynamically by script. + </div> + <div id="test" class="test"> + <script> + window.onload = function() { + var test = document.getElementById('test'); + var inputs = test.getElementsByTagName('input'); + for (var i = 0; i != inputs.length; i++) { + inputs[i].value = '123\u05D0\u05D1\u05D2ABC.'; + } + } + </script> + <div dir="ltr"> + <input type="text" dir="auto" value="a" /> + </div> + <div dir="rtl"> + <input type="text" dir="auto" value="a" /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="rtl" value="123אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="rtl" value="123אבגABC." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-L-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-L-ref.html new file mode 100644 index 000000000..0feef2504 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-L-ref.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, script assigns to start with L</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Latin letter A, thus the direction must be + resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="ltr" value="ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value="ABCאבג." /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="ltr" value="ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value="ABCאבג." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-L.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-L.html new file mode 100644 index 000000000..e6aa700ad --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-L.html @@ -0,0 +1,70 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, script assigns to start with L</title> + <link rel="match" href="dir_auto-input-script-L-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Latin letter A, thus the direction must be + resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + This test makes sure that the direction is set correctly for an input whose value is set + dynamically by script. + </div> + <div id="test" class="test"> + <script> + window.onload = function() { + var test = document.getElementById('test'); + var inputs = test.getElementsByTagName('input'); + for (var i = 0; i != inputs.length; i++) { + inputs[i].value = 'ABC\u05D0\u05D1\u05D2.'; + } + } + </script> + <div dir="ltr"> + <input type="text" dir="auto" value="א" /> + </div> + <div dir="rtl"> + <input type="text" dir="auto" value="א" /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="ltr" value="ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value="ABCאבג." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-EN-L-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-EN-L-ref.html new file mode 100644 index 000000000..6d6902f31 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-EN-L-ref.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, script assigns to start with N+EN+L</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Latin letter A since neutrals and digits are not + strongly directional, thus the direction must be resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="ltr" value=".-=123ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value=".-=123ABCאבג." /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="ltr" value=".-=123ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value=".-=123ABCאבג." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-EN-L.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-EN-L.html new file mode 100644 index 000000000..7905cee94 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-EN-L.html @@ -0,0 +1,70 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, script assigns to start with N+EN+L</title> + <link rel="match" href="dir_auto-input-script-N-EN-L-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Latin letter A since neutrals and digits are not + strongly directional, thus the direction must be resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + This test makes sure that the direction is set correctly for an input whose value is set + dynamically by script. + </div> + <div id="test" class="test"> + <script> + window.onload = function() { + var test = document.getElementById('test'); + var inputs = test.getElementsByTagName('input'); + for (var i = 0; i != inputs.length; i++) { + inputs[i].value = '.-=123ABC\u05D0\u05D1\u05D2.'; + } + } + </script> + <div dir="ltr"> + <input type="text" dir="auto" value="א" /> + </div> + <div dir="rtl"> + <input type="text" dir="auto" value="א" /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="ltr" value=".-=123ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value=".-=123ABCאבג." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-EN-R-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-EN-R-ref.html new file mode 100644 index 000000000..53dd89209 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-EN-R-ref.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, script assigns to start with N+EN+R</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Hebrew letter Alef since neutrals and digits are not + strongly directional, thus the direction must be resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="rtl" value=".-=123אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="rtl" value=".-=123אבגABC." /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="rtl" value=".-=123אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="rtl" value=".-=123אבגABC." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-EN-R.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-EN-R.html new file mode 100644 index 000000000..95faa72ea --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-EN-R.html @@ -0,0 +1,70 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, script assigns to start with N+EN+R</title> + <link rel="match" href="dir_auto-input-script-N-EN-R-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Hebrew letter Alef since neutrals and digits are not + strongly directional, thus the direction must be resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + This test makes sure that the direction is set correctly for an input whose value is set + dynamically by script. + </div> + <div id="test" class="test"> + <script> + window.onload = function() { + var test = document.getElementById('test'); + var inputs = test.getElementsByTagName('input'); + for (var i = 0; i != inputs.length; i++) { + inputs[i].value = '.-=123\u05D0\u05D1\u05D2ABC.'; + } + } + </script> + <div dir="ltr"> + <input type="text" dir="auto" value="a" /> + </div> + <div dir="rtl"> + <input type="text" dir="auto" value="a" /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="rtl" value=".-=123אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="rtl" value=".-=123אבגABC." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-EN-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-EN-ref.html new file mode 100644 index 000000000..11697e53e --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-EN-ref.html @@ -0,0 +1,53 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, script assigns to all N+EN</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value, or to LTR if there is no such + character. + In this test, there is no strongly directional character in the value, + thus the direction must be resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="ltr" value="@123!" /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value="@123!" /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="ltr" value="@123!" /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value="@123!" /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-EN.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-EN.html new file mode 100644 index 000000000..2721affae --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-EN.html @@ -0,0 +1,69 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, script assigns to all N+EN</title> + <link rel="match" href="dir_auto-input-script-N-EN-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value, or to LTR if there is no such + character. + In this test, there is no strongly directional character in the value, + thus the direction must be resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + This test makes sure that the direction is set correctly for an input whose value is set + dynamically by script. + </div> + <div id="test" class="test"> + <script> + window.onload = function() { + var test = document.getElementById('test'); + var inputs = test.getElementsByTagName('input'); + for (var i = 0; i != inputs.length; i++) { + inputs[i].value = '@123!'; + } + }; + </script> + <div dir="ltr"> + <input type="text" dir="auto" value="א" /> + </div> + <div dir="rtl"> + <input type="text" dir="auto" value="א" /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="ltr" value="@123!" /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value="@123!" /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-L-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-L-ref.html new file mode 100644 index 000000000..fd7cb10fb --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-L-ref.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, script assigns to start with N+L</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Latin letter A since neutrals are not + strongly directional, thus the direction must be resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="ltr" value=".-=ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value=".-=ABCאבג." /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="ltr" value=".-=ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value=".-=ABCאבג." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-L.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-L.html new file mode 100644 index 000000000..2ff24db28 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-L.html @@ -0,0 +1,70 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, script assigns to start with N+L</title> + <link rel="match" href="dir_auto-input-script-N-L-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Latin letter A since neutrals are not + strongly directional, thus the direction must be resolved as LTR." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + This test makes sure that the direction is set correctly for an input whose value is set + dynamically by script. + </div> + <div id="test" class="test"> + <script> + window.onload = function() { + var test = document.getElementById('test'); + var inputs = test.getElementsByTagName('input'); + for (var i = 0; i != inputs.length; i++) { + inputs[i].value = '.-=ABC\u05D0\u05D1\u05D2.'; + } + } + </script> + <div dir="ltr"> + <input type="text" dir="auto" value="א" /> + </div> + <div dir="rtl"> + <input type="text" dir="auto" value="א" /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="ltr" value=".-=ABCאבג." /> + </div> + <div dir="rtl"> + <input type="text" dir="ltr" value=".-=ABCאבג." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-R-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-R-ref.html new file mode 100644 index 000000000..0fa6da249 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-R-ref.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, script assigns to start with N+R</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Hebrew letter Alef since neutrals are not + strongly directional, thus the direction must be resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="rtl" value=".-=אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="rtl" value=".-=אבגABC." /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="rtl" value=".-=אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="rtl" value=".-=אבגABC." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-R.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-R.html new file mode 100644 index 000000000..0663b28ad --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-N-R.html @@ -0,0 +1,70 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, script assigns to start with N+R</title> + <link rel="match" href="dir_auto-input-script-N-R-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Hebrew letter Alef since neutrals are not + strongly directional, thus the direction must be resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + This test makes sure that the direction is set correctly for an input whose value is set + dynamically by script. + </div> + <div id="test" class="test"> + <script> + window.onload = function() { + var test = document.getElementById('test'); + var inputs = test.getElementsByTagName('input'); + for (var i = 0; i != inputs.length; i++) { + inputs[i].value = '.-=\u05D0\u05D1\u05D2ABC.'; + } + } + </script> + <div dir="ltr"> + <input type="text" dir="auto" value="a" /> + </div> + <div dir="rtl"> + <input type="text" dir="auto" value="a" /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="rtl" value=".-=אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="rtl" value=".-=אבגABC." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-R-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-R-ref.html new file mode 100644 index 000000000..12b2d1925 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-R-ref.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, script assigns to start with R</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Hebrew letter Alef, thus the direction must be + resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <input type="text" dir="rtl" value="אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="rtl" value="אבגABC." /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="rtl" value="אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="rtl" value="אבגABC." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-R.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-R.html new file mode 100644 index 000000000..07becaacc --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-input-script-R.html @@ -0,0 +1,70 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: input with dir=auto, script assigns to start with R</title> + <link rel="match" href="dir_auto-input-script-R-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="Shai Berger" href="mailto:shai@platonix.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction of an input element is set according to + the first strong character of its value. + In this test, it is the Hebrew letter Alef, thus the direction must be + resolved as RTL." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ב - The Hebrew letter Bet (strongly RTL). + ג - The Hebrew letter Gimel (strongly RTL). + This test makes sure that the direction is set correctly for an input whose value is set + dynamically by script. + </div> + <div id="test" class="test"> + <script> + window.onload = function() { + var test = document.getElementById('test'); + var inputs = test.getElementsByTagName('input'); + for (var i = 0; i != inputs.length; i++) { + inputs[i].value = '\u05D0\u05D1\u05D2ABC.'; + } + } + </script> + <div dir="ltr"> + <input type="text" dir="auto" value="a" /> + </div> + <div dir="rtl"> + <input type="text" dir="auto" value="a" /> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <input type="text" dir="rtl" value="אבגABC." /> + </div> + <div dir="rtl"> + <input type="text" dir="rtl" value="אבגABC." /> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-isolate-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-isolate-ref.html new file mode 100644 index 000000000..858a7db23 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-isolate-ref.html @@ -0,0 +1,57 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, isolated in LTR text</title> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text, but the element behaves externally as a neutral character. + In this test, it allows a preceding R to form a single directional run + with a succeeding number." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ‭ - The LRO (left-to-right override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. + </div> + <div class="test"> + <div dir="ltr"> + ‭1 a! א‬ + </div> + <div dir="rtl"> + ‭a !א 1‬ + </div> + </div> + <div class="ref"> + <div dir="ltr"> + ‭1 a! א‬ + </div> + <div dir="rtl"> + ‭a !א 1‬ + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-isolate.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-isolate.html new file mode 100644 index 000000000..14272c053 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-isolate.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: dir=auto, isolated in LTR text</title> + <link rel="match" href="dir_auto-isolate-ref.html" /> + <link rel="author" title="Matitiahu Allouche" href="mailto:matitiahu.allouche@google.com" /> + <link rel="author" title="Oren Roth" href="mailto:oren.roth@gmail.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text, but the element behaves externally as a neutral character. + In this test, it allows a preceding R to form a single directional run + with a succeeding number." /> + <style> + input, textarea { + font-size:1em; + } + body { + font-size:2em; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + ‭ - The LRO (left-to-right override) formatting character. + ‬ - The PDF (pop directional formatting) formatting character; closes LRO. + </div> + <div class="test"> + <div dir="ltr"> + א <span dir="auto">a!</span> 1 + </div> + <div dir="rtl"> + a <span dir="auto">א!</span> 1 + </div> + </div> + <div class="ref"> + <div dir="ltr"> + ‭1 a! א‬ + </div> + <div dir="rtl"> + ‭a !א 1‬ + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-pre-N-EN-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-pre-N-EN-ref.html new file mode 100644 index 000000000..c951c30b2 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-pre-N-EN-ref.html @@ -0,0 +1,49 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <link rel="author" title="Aharon Lanin" href="mailto:aharon@google.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <style> + body { + font-size:18px; + text-align:left; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="test"> + <div dir="ltr"> + <pre dir="ltr"> +@123! + </pre> + </div> + <div dir="rtl"> + <pre dir="ltr"> +@123! + </pre> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <pre dir="ltr"> +@123! + </pre> + </div> + <div dir="rtl"> + <pre dir="ltr"> +@123! + </pre> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-pre-N-EN.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-pre-N-EN.html new file mode 100644 index 000000000..cd721d725 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-pre-N-EN.html @@ -0,0 +1,66 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: pre with dir=auto, all N+EN</title> + <link rel="match" href="dir_auto-pre-N-EN-ref.html" /> + <link rel="author" title="Aharon Lanin" href="mailto:aharon@google.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <link rel="help" href="http://dev.w3.org/csswg/css3-writing-modes/#unicode-bidi0" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + For textarea and pre elements, the heuristic is applied on a per-paragraph level. + If there is no strong character, as in this test, the direction defaults to LTR." /> + <style> + body { + font-size:18px; + text-align:left; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + ‎ - LRM, the invisible left-to-right mark (strongly LTR). + ‏ - RLM, the invisible right-to-left mark (strongly RTL). + We use text-align:left because neither the dir="auto" nor the unicode-bidi:plaintext + specification states whether text-align:start and text-align:end should obey the paragraph + direction or the direction property in a unicode-bidi:plaintext element. + </div> + <div class="test"> + <div dir="ltr"> + <pre dir="auto"> +@123! + </pre> + </div> + <div dir="rtl"> + <pre dir="auto"> +@123! + </pre> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <pre dir="ltr"> +@123! + </pre> + </div> + <div dir="rtl"> + <pre dir="ltr"> +@123! + </pre> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-pre-N-between-Rs-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-pre-N-between-Rs-ref.html new file mode 100644 index 000000000..2d9caf062 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-pre-N-between-Rs-ref.html @@ -0,0 +1,61 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <link rel="author" title="Aharon Lanin" href="mailto:aharon@google.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <style> + body { + font-size:18px; + text-align:left; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <pre dir="rtl"> +א +!... +א + </pre> + </div> + <div dir="rtl"> + <pre dir="rtl"> +א +!... +א + </pre> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <pre dir="rtl"> +א +!... +א + </pre> + </div> + <div dir="rtl"> + <pre dir="rtl"> +א +!... +א + </pre> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-pre-N-between-Rs.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-pre-N-between-Rs.html new file mode 100644 index 000000000..adca24d88 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-pre-N-between-Rs.html @@ -0,0 +1,76 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: pre with dir=auto, all-N between all-Rs</title> + <link rel="match" href="dir_auto-pre-N-between-Rs-ref.html" /> + <link rel="author" title="Aharon Lanin" href="mailto:aharon@google.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <link rel="help" href="http://dev.w3.org/csswg/css3-writing-modes/#unicode-bidi0" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + For textarea and pre elements, the heuristic is applied on a per-paragraph level. + If there is no strong character, as in this test, the direction defaults to LTR." /> + <style> + body { + font-size:18px; + text-align:left; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + We use text-align:left because neither the dir="auto" nor the unicode-bidi:plaintext + specification states whether text-align:start and text-align:end should obey the paragraph + direction or the direction property in a unicode-bidi:plaintext element. + The ...! paragraph, being neutral, is supposed to be displayed LTR (i.e. as ...!, not as !...) + despite both the paragraph before it and the paragraph after it being all-RTL, which makes the + element as a whole RTL. + </div> + <div class="test"> + <div dir="ltr"> + <pre dir="auto"> +א +...! +א + </pre> + </div> + <div dir="rtl"> + <pre dir="auto"> +א +...! +א + </pre> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <pre dir="rtl"> +א +!... +א + </pre> + </div> + <div dir="rtl"> + <pre dir="rtl"> +א +!... +א + </pre> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-pre-mixed-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-pre-mixed-ref.html new file mode 100644 index 000000000..10bd02433 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-pre-mixed-ref.html @@ -0,0 +1,61 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <link rel="author" title="Aharon Lanin" href="mailto:aharon@google.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <style> + body { + font-size:18px; + text-align:left; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="test"> + <div dir="ltr"> + <pre dir="ltr"> +@123! +@123! +@123! +@123! + </pre> + </div> + <div dir="rtl"> + <pre dir="ltr"> +@123! +@123! +@123! +@123! + </pre> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <pre dir="ltr"> +@123! +@123! +@123! +@123! + </pre> + </div> + <div dir="rtl"> + <pre dir="ltr"> +@123! +@123! +@123! +@123! + </pre> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-pre-mixed.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-pre-mixed.html new file mode 100644 index 000000000..906365621 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-pre-mixed.html @@ -0,0 +1,77 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: pre with dir=auto, mixed L and R paragraphs</title> + <link rel="match" href="dir_auto-pre-mixed-ref.html" /> + <link rel="author" title="Aharon Lanin" href="mailto:aharon@google.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <link rel="help" href="http://dev.w3.org/csswg/css3-writing-modes/#unicode-bidi0" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + For textarea and pre elements, the heuristic is applied on a per-paragraph level." /> + <style> + body { + font-size:18px; + text-align:left; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + ‎ - LRM, the invisible left-to-right mark (strongly LTR). + ‏ - RLM, the invisible right-to-left mark (strongly RTL). + We use text-align:left because neither the dir="auto" nor the unicode-bidi:plaintext + specification states whether text-align:start and text-align:end should obey the paragraph + direction or the direction property in a unicode-bidi:plaintext element. + </div> + <div class="test"> + <div dir="ltr"> + <pre dir="auto"> +@‎123‏! +!‏123‎@ +@123‎‏! +!123‏‎@ + </pre> + </div> + <div dir="rtl"> + <pre dir="auto"> +@‎123‏! +!‏123‎@ +@123‎‏! +!123‏‎@ + </pre> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <pre dir="ltr"> +@123! +@123! +@123! +@123! + </pre> + </div> + <div dir="rtl"> + <pre dir="ltr"> +@123! +@123! +@123! +@123! + </pre> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-N-EN-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-N-EN-ref.html new file mode 100644 index 000000000..253b84459 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-N-EN-ref.html @@ -0,0 +1,49 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <link rel="author" title="Aharon Lanin" href="mailto:aharon@google.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <style> + body, textarea { + font-size:18px; + text-align:left; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="test"> + <div dir="ltr"> + <textarea rows="2" dir="ltr"> +@123! + </textarea> + </div> + <div dir="rtl"> + <textarea rows="2" dir="ltr"> +@123! + </textarea> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <textarea rows="2" dir="ltr"> +@123! + </textarea> + </div> + <div dir="rtl"> + <textarea rows="2" dir="ltr"> +@123! + </textarea> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-N-EN.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-N-EN.html new file mode 100644 index 000000000..f0fa2161a --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-N-EN.html @@ -0,0 +1,66 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: textarea with dir=auto, all N+EN</title> + <link rel="match" href="dir_auto-textarea-N-EN-ref.html" /> + <link rel="author" title="Aharon Lanin" href="mailto:aharon@google.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <link rel="help" href="http://dev.w3.org/csswg/css3-writing-modes/#unicode-bidi0" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + For textarea and pre elements, the heuristic is applied on a per-paragraph level. + If there is no strong character, as in this test, the direction defaults to LTR." /> + <style> + body, textarea { + font-size:18px; + text-align:left; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + ‎ - LRM, the invisible left-to-right mark (strongly LTR). + ‏ - RLM, the invisible right-to-left mark (strongly RTL). + We use text-align:left because neither the dir="auto" nor the unicode-bidi:plaintext + specification states whether text-align:start and text-align:end should obey the paragraph + direction or the direction property in a unicode-bidi:plaintext element. + </div> + <div class="test"> + <div dir="ltr"> + <textarea rows="2" dir="auto"> +@123! + </textarea> + </div> + <div dir="rtl"> + <textarea rows="2" dir="auto"> +@123! + </textarea> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <textarea rows="2" dir="ltr"> +@123! + </textarea> + </div> + <div dir="rtl"> + <textarea rows="2" dir="ltr"> +@123! + </textarea> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-N-between-Rs-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-N-between-Rs-ref.html new file mode 100644 index 000000000..afeef08cb --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-N-between-Rs-ref.html @@ -0,0 +1,64 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <link rel="author" title="Aharon Lanin" href="mailto:aharon@google.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <style> + body, textarea { + font-size:18px; + text-align:left; + } + textarea { + resize: none; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <textarea rows="4" dir="rtl"> +א +!... +א + </textarea> + </div> + <div dir="rtl"> + <textarea rows="4" dir="rtl"> +א +!... +א + </textarea> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <textarea rows="4" dir="rtl"> +א +!... +א + </textarea> + </div> + <div dir="rtl"> + <textarea rows="4" dir="rtl"> +א +!... +א + </textarea> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-N-between-Rs.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-N-between-Rs.html new file mode 100644 index 000000000..ddae91054 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-N-between-Rs.html @@ -0,0 +1,79 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: textarea with dir=auto, all-N between all-Rs</title> + <link rel="match" href="dir_auto-textarea-N-between-Rs-ref.html" /> + <link rel="author" title="Aharon Lanin" href="mailto:aharon@google.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <link rel="help" href="http://dev.w3.org/csswg/css3-writing-modes/#unicode-bidi0" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + For textarea and pre elements, the heuristic is applied on a per-paragraph level. + If there is no strong character, as in this test, the direction defaults to LTR." /> + <style> + body, textarea { + font-size:18px; + text-align:left; + } + textarea { + resize: none; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + We use text-align:left because neither the dir="auto" nor the unicode-bidi:plaintext + specification states whether text-align:start and text-align:end should obey the paragraph + direction or the direction property in a unicode-bidi:plaintext element. + The ...! paragraph, being neutral, is supposed to be displayed LTR (i.e. as ...!, not as !...) + despite both the paragraph before it and the paragraph after it being all-RTL, which makes the + element as a whole RTL. + </div> + <div class="test"> + <div dir="ltr"> + <textarea rows="4" dir="auto"> +א +...! +א + </textarea> + </div> + <div dir="rtl"> + <textarea rows="4" dir="auto"> +א +...! +א + </textarea> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <textarea rows="4" dir="rtl"> +א +!... +א + </textarea> + </div> + <div dir="rtl"> + <textarea rows="4" dir="rtl"> +א +!... +א + </textarea> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-mixed-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-mixed-ref.html new file mode 100644 index 000000000..a5a84480f --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-mixed-ref.html @@ -0,0 +1,64 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <link rel="author" title="Aharon Lanin" href="mailto:aharon@google.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <style> + body, textarea { + font-size:18px; + text-align:left; + } + textarea { + resize: none; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="test"> + <div dir="ltr"> + <textarea rows="5" dir="rtl"> +!123@ +!123@ +!123@ +!123@ + </textarea> + </div> + <div dir="rtl"> + <textarea rows="5" dir="ltr"> +@123! +@123! +@123! +@123! + </textarea> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <textarea rows="5" dir="rtl"> +!123@ +!123@ +!123@ +!123@ + </textarea> + </div> + <div dir="rtl"> + <textarea rows="5" dir="ltr"> +@123! +@123! +@123! +@123! + </textarea> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-mixed.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-mixed.html new file mode 100644 index 000000000..4947124c9 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-mixed.html @@ -0,0 +1,80 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: textarea with dir=auto, mixed L and R paragraphs</title> + <link rel="match" href="dir_auto-textarea-mixed-ref.html" /> + <link rel="author" title="Aharon Lanin" href="mailto:aharon@google.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <link rel="help" href="http://dev.w3.org/csswg/css3-writing-modes/#unicode-bidi0" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + For textarea and pre elements, the heuristic is applied on a per-paragraph level." /> + <style> + body, textarea { + font-size:18px; + text-align:left; + } + textarea { + resize: none; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + ‎ - LRM, the invisible left-to-right mark (strongly LTR). + ‏ - RLM, the invisible right-to-left mark (strongly RTL). + We use text-align:left because neither the dir="auto" nor the unicode-bidi:plaintext + specification states whether text-align:start and text-align:end should obey the paragraph + direction or the direction property in a unicode-bidi:plaintext element. + </div> + <div class="test"> + <div dir="ltr"> + <textarea rows="5" dir="auto"> +!‏123‎@ +@‎123‏! +!123‏‎@ +@123‎‏! + </textarea> + </div> + <div dir="rtl"> + <textarea rows="5" dir="auto"> +@‎123‏! +!‏123‎@ +@123‎‏! +!123‏‎@ + </textarea> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <textarea rows="5" dir="rtl"> +!123@ +!123@ +!123@ +!123@ + </textarea> + </div> + <div dir="rtl"> + <textarea rows="5" dir="ltr"> +@123! +@123! +@123! +@123! + </textarea> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-script-N-EN-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-script-N-EN-ref.html new file mode 100644 index 000000000..253b84459 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-script-N-EN-ref.html @@ -0,0 +1,49 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <link rel="author" title="Aharon Lanin" href="mailto:aharon@google.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <style> + body, textarea { + font-size:18px; + text-align:left; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="test"> + <div dir="ltr"> + <textarea rows="2" dir="ltr"> +@123! + </textarea> + </div> + <div dir="rtl"> + <textarea rows="2" dir="ltr"> +@123! + </textarea> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <textarea rows="2" dir="ltr"> +@123! + </textarea> + </div> + <div dir="rtl"> + <textarea rows="2" dir="ltr"> +@123! + </textarea> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-script-N-EN.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-script-N-EN.html new file mode 100644 index 000000000..3c674e2f8 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-script-N-EN.html @@ -0,0 +1,77 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: textarea with dir=auto, script assigns to all N+EN</title> + <link rel="match" href="dir_auto-textarea-script-N-EN-ref.html" /> + <link rel="author" title="Aharon Lanin" href="mailto:aharon@google.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <link rel="help" href="http://dev.w3.org/csswg/css3-writing-modes/#unicode-bidi0" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + For textarea and pre elements, the heuristic is applied on a per-paragraph level. + If there is no strong character, as in this test, the direction defaults to LTR." /> + <style> + body, textarea { + font-size:18px; + text-align:left; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + ‎ - LRM, the invisible left-to-right mark (strongly LTR). + ‏ - RLM, the invisible right-to-left mark (strongly RTL). + This test makes sure that the direction is set correctly for a textarea whose value is set + dynamically by script. + We use text-align:left because neither the dir="auto" nor the unicode-bidi:plaintext + specification states whether text-align:start and text-align:end should obey the paragraph + direction or the direction property in a unicode-bidi:plaintext element. + </div> + <div id="test" class="test"> + <script> + window.onload = function() { + var test = document.getElementById('test'); + var textareas = test.getElementsByTagName('textarea'); + for (var i = 0; i != textareas.length; i++) { + textareas[i].value = '@123!\n'; + } + } + </script> + <div dir="ltr"> + <textarea rows="2" dir="auto"> +‏ + </textarea> + </div> + <div dir="rtl"> + <textarea rows="2" dir="auto"> +‏ + </textarea> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <textarea rows="2" dir="ltr"> +@123! + </textarea> + </div> + <div dir="rtl"> + <textarea rows="2" dir="ltr"> +@123! + </textarea> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-script-N-between-Rs-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-script-N-between-Rs-ref.html new file mode 100644 index 000000000..814e7b656 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-script-N-between-Rs-ref.html @@ -0,0 +1,65 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <link rel="match" href="dir_auto-textarea-N-between-Rs-ref.html" /> + <link rel="author" title="Aharon Lanin" href="mailto:aharon@google.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <style> + body, textarea { + font-size:18px; + text-align:left; + } + textarea { + resize: none; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + </div> + <div class="test"> + <div dir="ltr"> + <textarea rows="4" dir="rtl"> +א +!... +א + </textarea> + </div> + <div dir="rtl"> + <textarea rows="4" dir="rtl"> +א +!... +א + </textarea> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <textarea rows="4" dir="rtl"> +א +!... +א + </textarea> + </div> + <div dir="rtl"> + <textarea rows="4" dir="rtl"> +א +!... +א + </textarea> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-script-N-between-Rs.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-script-N-between-Rs.html new file mode 100644 index 000000000..d16837b2f --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-script-N-between-Rs.html @@ -0,0 +1,86 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: textarea with dir=auto, script assigns to all-N between all-Rs</title> + <link rel="match" href="dir_auto-textarea-script-N-between-Rs-ref.html" /> + <link rel="author" title="Aharon Lanin" href="mailto:aharon@google.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <link rel="help" href="http://dev.w3.org/csswg/css3-writing-modes/#unicode-bidi0" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + For textarea and pre elements, the heuristic is applied on a per-paragraph level. + If there is no strong character, as in this test, the direction defaults to LTR." /> + <style> + body, textarea { + font-size:18px; + text-align:left; + } + textarea { + resize: none; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + א - The Hebrew letter Alef (strongly RTL). + This test makes sure that the direction is set correctly for a textarea whose value is set + dynamically by script. + We use text-align:left because neither the dir="auto" nor the unicode-bidi:plaintext + specification states whether text-align:start and text-align:end should obey the paragraph + direction or the direction property in a unicode-bidi:plaintext element. + The ...! paragraph, being neutral, is supposed to be displayed LTR (i.e. as ...!, not as !...) + despite both the paragraph before it and the paragraph after it being all-RTL, which makes the + element as a whole RTL. + </div> + <div id="test" class="test"> + <script> + window.onload = function() { + var test = document.getElementById('test'); + var textareas = test.getElementsByTagName('textarea'); + for (var i = 0; i != textareas.length; i++) { + textareas[i].value = '\u05D0\n...!\n\u05D0'; + } + } + </script> + <div dir="ltr"> + <textarea rows="4" dir="auto"> +LTR text + </textarea> + </div> + <div dir="rtl"> + <textarea rows="4" dir="auto"> +LTR text + </textarea> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <textarea rows="4" dir="rtl"> +א +!... +א + </textarea> + </div> + <div dir="rtl"> + <textarea rows="4" dir="rtl"> +א +!... +א + </textarea> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-script-mixed-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-script-mixed-ref.html new file mode 100644 index 000000000..a5a84480f --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-script-mixed-ref.html @@ -0,0 +1,64 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <link rel="author" title="Aharon Lanin" href="mailto:aharon@google.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <style> + body, textarea { + font-size:18px; + text-align:left; + } + textarea { + resize: none; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="test"> + <div dir="ltr"> + <textarea rows="5" dir="rtl"> +!123@ +!123@ +!123@ +!123@ + </textarea> + </div> + <div dir="rtl"> + <textarea rows="5" dir="ltr"> +@123! +@123! +@123! +@123! + </textarea> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <textarea rows="5" dir="rtl"> +!123@ +!123@ +!123@ +!123@ + </textarea> + </div> + <div dir="rtl"> + <textarea rows="5" dir="ltr"> +@123! +@123! +@123! +@123! + </textarea> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-script-mixed.html b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-script-mixed.html new file mode 100644 index 000000000..f0c6d4fe4 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/dir_auto-textarea-script-mixed.html @@ -0,0 +1,100 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>HTML Test: textarea with dir=auto, script assigns to mixed L and R paragraphs</title> + <link rel="match" href="dir_auto-textarea-script-mixed-ref.html" /> + <link rel="author" title="Aharon Lanin" href="mailto:aharon@google.com" /> + <link rel="author" title="HTML5 bidi test WG" href="mailto:html5bidi@googlegroups.com" /> + <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-dir-attribute" /> + <link rel="help" href="http://dev.w3.org/csswg/css3-writing-modes/#unicode-bidi0" /> + <meta name="assert" content=" + When dir='auto', the direction is set according to the first strong character + of the text. + For textarea and pre elements, the heuristic is applied on a per-paragraph level." /> + <style> + body, textarea { + font-size:18px; + text-align:left; + } + textarea { + resize: none; + } + .test, .ref { + border: medium solid gray; + width: 400px; + margin: 20px; + } + .comments { + display: none; + } + </style> + </head> + <body> + <div class="instructions"><p>Test passes if the two boxes below look exactly the same.</p></div> + <div class="comments"> + Key to entities used below: + ‎ - LRM, the invisible left-to-right mark (strongly LTR). + ‏ - RLM, the invisible right-to-left mark (strongly RTL). + This test makes sure that the direction is set correctly for a textarea whose value is set + dynamically by script. + We use text-align:left because neither the dir="auto" nor the unicode-bidi:plaintext + specification states whether text-align:start and text-align:end should obey the paragraph + direction or the direction property in a unicode-bidi:plaintext element. + </div> + <div id="test" class="test"> + <script> + window.onload = function() { + var test = document.getElementById('test'); + var textareas = test.getElementsByTagName('textarea'); + for (var i = 0; i != textareas.length; i++) { + var input = textareas[i]; + if (input.parentNode.dir == 'ltr') { + // Assign a value whose first strong is RTL. + input.value = + '!\u200F123\u200E@\n' + + '@\u200E123\u200F!\n' + + '!123\u200F\u200E@\n' + + '@123\u200E\u200F!\n'; + } else { + // Assign a value whose first strong is LTR. + input.value = + '@\u200E123\u200F!\n' + + '!\u200F123\u200E@\n' + + '@123\u200E\u200F!\n' + + '!123\u200F\u200E@\n'; + } + } + } + </script> + <div dir="ltr"> + <textarea rows="5" dir="auto"> +‎ + </textarea> + </div> + <div dir="rtl"> + <textarea rows="5" dir="auto"> +‏ + </textarea> + </div> + </div> + <div class="ref"> + <div dir="ltr"> + <textarea rows="5" dir="rtl"> +!123@ +!123@ +!123@ +!123@ + </textarea> + </div> + <div dir="rtl"> + <textarea rows="5" dir="ltr"> +@123! +@123! +@123! +@123! + </textarea> + </div> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/document-dir.html b/testing/web-platform/tests/html/dom/elements/global-attributes/document-dir.html new file mode 100644 index 000000000..675b4bc9d --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/document-dir.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html dir="LTR"> +<title>document.dir</title> +<link rel="help" href="https://html.spec.whatwg.org/multipage/#dom-document-dir"> +<link rel="help" href="https://html.spec.whatwg.org/multipage/#reflect"> +<link rel="author" title="Ms2ger" href="mailto:ms2ger@gmail.com"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<div id="log"></div> +<script> +test(function() { + assert_equals(document.dir, "ltr"); + assert_equals(document.documentElement.getAttribute("dir"), "LTR"); +}, "Markup attribute") +test(function() { + document.dir = "x-garbage"; + assert_equals(document.dir, ""); + assert_equals(document.documentElement.getAttribute("dir"), "x-garbage"); +}, "Setting the idl attribute to a garbage value") +test(function() { + document.dir = ""; + assert_true(document.documentElement.hasAttribute("dir"), "Attribute should still be around"); + assert_equals(document.dir, ""); + assert_equals(document.documentElement.getAttribute("dir"), ""); +}, "Setting the idl attribute to the empty string") +</script> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/id-attribute.html b/testing/web-platform/tests/html/dom/elements/global-attributes/id-attribute.html new file mode 100644 index 000000000..0171148fb --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/id-attribute.html @@ -0,0 +1,130 @@ +<!DOCTYPE HTML> +<html> +<head> +<title>The id attribute</title> +<meta charset=utf8> +<link rel="help" href="https://html.spec.whatwg.org/multipage/#the-id-attribute"> +<style> + +#abcd { + position: absolute; + z-index: 1; +} + +#ABCD { + position: absolute; + z-index: 2; +} + +#a\ b { + position: absolute; + z-index: 3; +} + +#xyz { + position: absolute; + z-index: 4; +} + +#foobar { + position: absolute; + z-index: 5; +} + +#åèiöú { + position: absolute; + z-index: 6; +} + +</style> +</head> +<body> +<h1>The id attribute</h1> +<div id="log"></div> +<i id="abcd"></i> +<i id="ABCD"></i> +<i id="a b"></i> +<i id="åèiöú"></i> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script> + // id is associated for purposes of getElementById + test(function() { + assert_equals(document.getElementById("abcd"), document.getElementsByTagName("i")[0]); + }, "User agents must associate the element with an id value for purposes of getElementById."); + + test(function() { + assert_equals(document.getElementById("ABCD"), document.getElementsByTagName("i")[1]); + }, "Association is exact and therefore case-sensitive for getElementById."); + + test(function() { + assert_equals(document.getElementById("a b"), document.getElementsByTagName("i")[2]); + }, "Spaces are allowed in an id and still make an association for getElementByID."); + + test(function() { + assert_equals(document.getElementById("åèiöú"), document.getElementsByTagName("i")[3]); + }, "Non-ASCII is allowed in an id and still make an association for getElementById."); + + + // id is associated for purposes of CSS + test(function() { + assert_equals(document.defaultView.getComputedStyle(document.getElementById("abcd"), false).zIndex, "1"); + }, "User agents must associate the element with an id value for purposes of CSS."); + + test(function() { + assert_equals(document.defaultView.getComputedStyle(document.getElementById("ABCD"), false).zIndex, "2"); + }, "Association for CSS is exact and therefore case-sensitive."); + + test(function() { + assert_equals(document.defaultView.getComputedStyle(document.getElementById("a b"), false).zIndex, "3"); + }, "Spaces are allowed in an id and still make an association."); + + test(function() { + assert_equals(document.defaultView.getComputedStyle(document.getElementById("åèiöú"), false).zIndex, "6"); + }, "Non-ASCII is allowed in an id and still make an association for CSS."); + + + // id IDL attribute reflects the content attribute + var firstSpan = document.getElementById("abcd"); + + test(function() { + assert_equals(firstSpan.id, "abcd"); + }, "The id IDL attribute must reflect the id content attribute, for getting."); + + test(function() { + firstSpan.id = "xyz"; + assert_equals(firstSpan.getAttribute("id"), "xyz"); + }, "The id IDL attribute must reflect the id content attribute, for setting via IDL attribute."); + + test(function() { + assert_equals(document.getElementById("xyz"), firstSpan); + }, "After setting id via id attribute, getElementById find the element by the new id."); + + test(function() { + assert_equals(document.getElementById("abcd"), null); + }, "After setting id via id attribute, getElementById doesn't find the element by the old id."); + + test(function() { + assert_equals(document.defaultView.getComputedStyle(firstSpan, false).zIndex, "4"); + }, "After setting id via id attribute, CSS association is via the new ID."); + + test(function() { + firstSpan.setAttribute("id", "foobar"); + assert_equals(firstSpan.id, "foobar"); + }, "The id IDL attribute must reflect the id content attribute, for setting via setAttribute."); + + test(function() { + assert_equals(document.getElementById("foobar"), firstSpan); + }, "After setting id via setAttribute attribute, getElementById find the element by the new id."); + + test(function() { + assert_equals(document.getElementById("xyz"), null); + }, "After setting id via setAttribute attribute, getElementById doesn't find the element by the old id."); + + test(function() { + assert_equals(document.defaultView.getComputedStyle(firstSpan, false).zIndex, "5"); + }, "After setting id via setAttribute attribute, CSS association is via the new ID."); + +</script> +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/id-name-specialcase.html b/testing/web-platform/tests/html/dom/elements/global-attributes/id-name-specialcase.html new file mode 100644 index 000000000..77e4100b7 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/id-name-specialcase.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<title>HTML5: test id with none pure alpha characters </title> +<link rel="author" title="justin.shen" href=mailto:cosmichut@msn.com"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<div id="log"></div> +<div style="display:none"> + <input id="123" value="123"></input> + <input id="1test" value="1test"></input> + <input id="_test" value="_test"></input> + <input id="." value="."></input> + <input id="ä¸å›½" value="china"></input> +</div> +<script> +test(function() { + assert_equals(document.getElementById("123").value, "123"); +}, "id with digits only"); +test(function() { + assert_equals(document.getElementById("1test").value, "1test"); +},"id start with digits"); +test(function() { + assert_equals(document.getElementById("_test").value, "_test"); +},"id start with underscore"); +test(function() { + assert_equals(document.getElementById(".").value, "."); +},"id with punctuation only"); +test(function() { + assert_equals(document.getElementById("ä¸å›½").value, "china"); +},"id with chinese character"); +</script> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/id-name.html b/testing/web-platform/tests/html/dom/elements/global-attributes/id-name.html new file mode 100644 index 000000000..7fdac993b --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/id-name.html @@ -0,0 +1,17 @@ +<!DOCTYPE html> +<title>id and name attributes and getElementById</title> +<link rel="author" title="Ms2ger" href="mailto:ms2ger@gmail.com"> +<link rel="help" href="https://html.spec.whatwg.org/multipage/#the-id-attribute"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<div id="log"></div> +<div id="test"> +<div name="abcd"></div> +<p name="abcd" id="abcd"></p> +</div> +<script> +test(function() { + assert_equals(document.getElementById("abcd").nodeName, "P"); + assert_equals(document.getElementById("abcd").localName, "p"); +}); +</script> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/lang-xmllang-01-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/lang-xmllang-01-ref.html new file mode 100644 index 000000000..1606bca21 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/lang-xmllang-01-ref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<title>Languages</title> +<link rel="author" title="Ms2ger" href="mailto:ms2ger@gmail.com"> +<link rel="help" href="https://html.spec.whatwg.org/multipage/#the-lang-and-xml:lang-attributes"> +<link tel="help" href="http://www.w3.org/TR/CSS2/selector.html#lang"> +<meta name="flags" content="css21"> +<style> +#test > * { background: limegreen; } +</style> +<body> +<p>All lines below should have a green background.</p> +<div id="test"> +<div><p>{}{lang}{en}</p></div> +<div><p>{}{xml:lang}{en}</p></div> +<div><div><p>Parent: {}{lang}{en}</p></div></div> +<div><div><p>Parent: {}{xml:lang}{en}</p></div></div> +<div><p>{xml}{lang}{en}</p></div> +<div><p>{xml}{lang}{en} - {lang}{de}</p></div> +<div><p>{xml}{lang}{de} - {lang}{en}</p></div> +</div> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/lang-xmllang-01.html b/testing/web-platform/tests/html/dom/elements/global-attributes/lang-xmllang-01.html new file mode 100644 index 000000000..9538f15ca --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/lang-xmllang-01.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<title>Languages</title> +<link rel="match" href="lang-xmllang-01-ref.html"> +<link rel="author" title="Ms2ger" href="mailto:ms2ger@gmail.com"> +<link rel="help" href="https://html.spec.whatwg.org/multipage/#the-lang-and-xml:lang-attributes"> +<link tel="help" href="http://www.w3.org/TR/CSS2/selector.html#lang"> +<meta name="flags" content="css21"> +<style> +#test #a :lang(en) { background: limegreen; } +#test #b :lang(nl) { background: limegreen; } +#test #c :lang(en) { background: limegreen; } +#test #d :lang(nl) { background: limegreen; } +#test #e :lang(en) { background: limegreen; } +#test #f :lang(en) { background: limegreen; } +#test #g :lang(de) { background: limegreen; } +</style> +<body> +<p>All lines below should have a green background.</p> +<div id="test" lang="nl"> +<div id="a"><p lang="en">{}{lang}{en}</p></div> +<div id="b"><p xml:lang="en">{}{xml:lang}{en}</p></div> +<div id="c"><div lang="en"><p>Parent: {}{lang}{en}</p></div></div> +<div id="d"><div xml:lang="en"><p>Parent: {}{xml:lang}{en}</p></div></div> +</div> +<script> +try { + var XML = "http://www.w3.org/XML/1998/namespace"; + var container = document.getElementById("test"); + + var div = document.createElement("div"); + div.id = "e"; + var testNode = document.createElement("p"); + testNode.appendChild(document.createTextNode("{xml}{lang}{en}")); + testNode.setAttributeNS(XML, "xml:lang", "en"); + div.appendChild(testNode); + container.appendChild(div); + + div = document.createElement("div"); + div.id = "f"; + testNode = document.createElement("p"); + testNode.appendChild(document.createTextNode("{xml}{lang}{en} - {lang}{de}")); + testNode.setAttributeNS(XML, "xml:lang", "en"); + testNode.setAttributeNS(null, "lang", "de"); + div.appendChild(testNode); + container.appendChild(div); + + div = document.createElement("div"); + div.id = "g"; + testNode = document.createElement("p"); + testNode.appendChild(document.createTextNode("{xml}{lang}{de} - {lang}{en}")); + testNode.setAttributeNS(XML, "xml:lang", "de"); + testNode.setAttributeNS(null, "lang", "en"); + container.appendChild(testNode); + div.appendChild(testNode); + container.appendChild(div); +} catch (e) { +} +</script> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/lang-xyzzy-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/lang-xyzzy-ref.html new file mode 100644 index 000000000..b2037182b --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/lang-xyzzy-ref.html @@ -0,0 +1,9 @@ +<!DOCTYPE html> +<title>Invalid languages</title> +<link rel="author" title="Ms2ger" href="mailto:ms2ger@gmail.com"> +<meta name="flags" content="css21"> +<style>#testp { color: green; }</style> +<body> +<div id="test"> +<p id="testp" lang="xyzzy">ABC</p> +</div> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/lang-xyzzy.html b/testing/web-platform/tests/html/dom/elements/global-attributes/lang-xyzzy.html new file mode 100644 index 000000000..d6e6aeb64 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/lang-xyzzy.html @@ -0,0 +1,12 @@ +<!DOCTYPE html> +<title>Invalid languages</title> +<link rel="match" href="lang-xyzzy-ref.html"> +<link rel="author" title="Ms2ger" href="mailto:ms2ger@gmail.com"> +<link rel="help" href="https://html.spec.whatwg.org/multipage/#the-lang-and-xml:lang-attributes"> +<link tel="help" href="http://www.w3.org/TR/CSS2/selector.html#lang"> +<meta name="flags" content="css21"> +<style>:lang(xyzzy) { color: green; }</style> +<body> +<div id="test"> +<p id="testp" lang="xyzzy">ABC</p> +</div> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/style-01-ref.html b/testing/web-platform/tests/html/dom/elements/global-attributes/style-01-ref.html new file mode 100644 index 000000000..be8175e61 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/style-01-ref.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<title>The style attribute</title> +<link rel="author" title="Ms2ger" href="mailto:ms2ger@gmail.com"> +<link rel="help" href="https://html.spec.whatwg.org/multipage/#the-style-attribute"> +<link rel="help" href="http://www.w3.org/TR/css-style-attr/#syntax"> +<link rel="help" href="http://www.w3.org/TR/CSS21/cascade.html#cascading-order"> +<link rel="help" href="http://www.w3.org/TR/CSS21/cascade.html#specificity"> +<style> +#test p { background: limegreen; } +</style> +<div id="test"> +<p>This line should have a green background. +<p>This line should have a green background. +<p>This line should have a green background. +<p>This line should have a green background. +<p>This line should have a green background. +<p>This line should have a green background. +<p>This line should have a green background. +<p>This line should have a green background. +<p>This line should have a green background. +<p>This line should have a green background. +<p>This line should have a green background. +<p>This line should have a green background. +</div> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/style-01.html b/testing/web-platform/tests/html/dom/elements/global-attributes/style-01.html new file mode 100644 index 000000000..c0e099580 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/style-01.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<title>The style attribute</title> +<link rel="match" href="style-01-ref.html"> +<link rel="author" title="Ms2ger" href="mailto:ms2ger@gmail.com"> +<link rel="help" href="https://html.spec.whatwg.org/multipage/#the-style-attribute"> +<link rel="help" href="http://www.w3.org/TR/css-style-attr/#syntax"> +<link rel="help" href="http://www.w3.org/TR/CSS21/cascade.html#cascading-order"> +<link rel="help" href="http://www.w3.org/TR/CSS21/cascade.html#specificity"> +<style> +#idsel { background: red; } +#idsel2 { background: limegreen !important; } +</style> +<div id="test"> +<p style="background:limegreen">This line should have a green background. +<p style="/**/background:limegreen">This line should have a green background. +<p style="background/**/:limegreen">This line should have a green background. +<p style="background:/**/limegreen">This line should have a green background. +<p style="background:limegreen/**/">This line should have a green background. +<p id="idsel1" style="background:limegreen">This line should have a green background. +<p id="idsel2" style="background:red">This line should have a green background. +<p style="background:limegreen; background:r/**/ed">This line should have a green background. +<p style="background:limegreen;}">This line should have a green background. +<p style="};background:limegreen">This line should have a green background. +<p style="background:red;};background:limegreen">This line should have a green background. +<p style="background:limegreen;{background:red}">This line should have a green background. +</div> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-001.html b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-001.html new file mode 100644 index 000000000..c2966f362 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-001.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<html lang="ko" > +<head> +<meta charset="utf-8"/> +<title>lang attribute in html tag</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel='help' href='https://html.spec.whatwg.org/multipage/#the-lang-and-xml:lang-attributes'> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<meta name='flags' content='dom'> +<style type='text/css'> + #colonlangcontroltest { color: red; font-weight: bold; width: 400px; } + #colonlangcontroltest:lang(xx) { display:none; } +.test div { width: 50px; } +#box:lang(ko) { width: 100px; } +</style> +</head> +<body> + + + +<div class="test"><div id="box"> </div></div> +<p lang='xx' id='colonlangcontroltest'>This test failed because it relies on :lang for results, but :lang is not supported by this browser.</p> + + +<!--Notes: + +This test uses :lang to detect whether the language has been set. If :lang is not supported, a message will appear and the test will fail. + +--> +<script> +test(function() { +assert_equals(document.getElementById('colonlangcontroltest').offsetWidth, 0) +assert_equals(document.getElementById('box').offsetWidth, 100); +}, "The browser will recognize a language declared in a lang attribute on the html tag."); +</script> + +<div id='log'></div> + +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-002.html b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-002.html new file mode 100644 index 000000000..205bc35f2 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-002.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<html xml:lang="ko" > +<head> +<meta charset="utf-8"/> +<title>xml:lang attribute in html tag</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel='help' href='https://html.spec.whatwg.org/multipage/#the-lang-and-xml:lang-attributes'> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<meta name='flags' content='dom'> +<style type='text/css'> + #colonlangcontroltest { color: red; font-weight: bold; width: 400px; } + #colonlangcontroltest:lang(xx) { display:none; } +.test div { width: 50px; } +#box:lang(ko) { width: 100px; } +</style> +</head> +<body> + + + +<div class="test"><div id="box"> </div></div> +<p lang='xx' id='colonlangcontroltest'>This test failed because it relies on :lang for results, but :lang is not supported by this browser.</p> + + +<!--Notes: + +This test uses :lang to detect whether the language has been set. If :lang is not supported, a message will appear and the test will fail. + +--> +<script> +test(function() { +assert_equals(document.getElementById('colonlangcontroltest').offsetWidth, 0) +assert_equals(document.getElementById('box').offsetWidth, 50); +}, "The browser will NOT recognize a language declared in an xml:lang attribute on the html tag."); +</script> + +<div id='log'></div> + +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-003.html b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-003.html new file mode 100644 index 000000000..717aa12e6 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-003.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<html > +<head> +<meta charset="utf-8"/> +<title>HTTP header</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel='help' href='https://html.spec.whatwg.org/multipage/#the-lang-and-xml:lang-attributes'> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<meta name='flags' content='http dom'> +<style type='text/css'> + #colonlangcontroltest { color: red; font-weight: bold; width: 400px; } + #colonlangcontroltest:lang(xx) { display:none; } +.test div { width: 50px; } +#box:lang(ko) { width: 100px; } +</style> +</head> +<body> + + + +<div class="test"><div id="box"> </div></div> +<p lang='xx' id='colonlangcontroltest'>This test failed because it relies on :lang for results, but :lang is not supported by this browser.</p> + + +<!--Notes: + +This test uses :lang to detect whether the language has been set. If :lang is not supported, a message will appear and the test will fail. + +--> +<script> +test(function() { +assert_equals(document.getElementById('colonlangcontroltest').offsetWidth, 0) +assert_equals(document.getElementById('box').offsetWidth, 100); +}, "The browser will recognize a language declared in the HTTP header, when there is no internal language declaration."); +</script> + +<div id='log'></div> + +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-003.html.headers b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-003.html.headers new file mode 100644 index 000000000..0c47ecd4f --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-003.html.headers @@ -0,0 +1 @@ +Content-Language: ko diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-004.html b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-004.html new file mode 100644 index 000000000..ff36f75ad --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-004.html @@ -0,0 +1,42 @@ +<!DOCTYPE html> +<html > +<head> +<meta charset="utf-8"/> + <meta http-equiv="Content-Language" content="ko" > +<title>pragma-set default</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel='help' href='https://html.spec.whatwg.org/multipage/#the-lang-and-xml:lang-attributes'> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<meta name='flags' content='dom'> +<style type='text/css'> + #colonlangcontroltest { color: red; font-weight: bold; width: 400px; } + #colonlangcontroltest:lang(xx) { display:none; } +.test div { width: 50px; } +#box:lang(ko) { width: 100px; } +</style> +</head> +<body> + + + +<div class="test"><div id="box"> </div></div> +<p lang='xx' id='colonlangcontroltest'>This test failed because it relies on :lang for results, but :lang is not supported by this browser.</p> + + +<!--Notes: + +This test uses :lang to detect whether the language has been set. If :lang is not supported, a message will appear and the test will fail. + +--> +<script> +test(function() { +assert_equals(document.getElementById('colonlangcontroltest').offsetWidth, 0) +assert_equals(document.getElementById('box').offsetWidth, 100); +}, "The browser will recognize a language declared in a meta element in the head using http-equiv='Content-Language' content='..' (with a single language tag value), when there is no other language declaration inside the document."); +</script> + +<div id='log'></div> + +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-005.html b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-005.html new file mode 100644 index 000000000..63fb8e3bb --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-005.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<html lang="ko" > +<head> +<meta charset="utf-8"/> +<title>HTTP header and html lang</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel='help' href='https://html.spec.whatwg.org/multipage/#the-lang-and-xml:lang-attributes'> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<meta name='flags' content='http dom'> +<style type='text/css'> + #colonlangcontroltest { color: red; font-weight: bold; width: 400px; } + #colonlangcontroltest:lang(xx) { display:none; } +.test div { width: 50px; } +#box:lang(ko) { width: 100px; } +</style> +</head> +<body> + + + +<div class="test"><div id="box"> </div></div> +<p lang='xx' id='colonlangcontroltest'>This test failed because it relies on :lang for results, but :lang is not supported by this browser.</p> + + +<!--Notes: + +This test uses :lang to detect whether the language has been set. If :lang is not supported, a message will appear and the test will fail. + +--> +<script> +test(function() { +assert_equals(document.getElementById('colonlangcontroltest').offsetWidth, 0) +assert_equals(document.getElementById('box').offsetWidth, 100); +}, "If there is a conflict between the language declarations in the HTTP header and the html element using lang, the browser will recognize the language declared in the html element."); +</script> + +<div id='log'></div> + +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-005.html.headers b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-005.html.headers new file mode 100644 index 000000000..1b971b697 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-005.html.headers @@ -0,0 +1 @@ +Content-Language: zh diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-006.html b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-006.html new file mode 100644 index 000000000..ede491202 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-006.html @@ -0,0 +1,42 @@ +<!DOCTYPE html> +<html > +<head> +<meta charset="utf-8"/> + <meta http-equiv="Content-Language" content="ko" > +<title>HTTP header and meta element</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel='help' href='https://html.spec.whatwg.org/multipage/#the-lang-and-xml:lang-attributes'> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<meta name='flags' content='http dom'> +<style type='text/css'> + #colonlangcontroltest { color: red; font-weight: bold; width: 400px; } + #colonlangcontroltest:lang(xx) { display:none; } +.test div { width: 50px; } +#box:lang(ko) { width: 100px; } +</style> +</head> +<body> + + + +<div class="test"><div id="box"> </div></div> +<p lang='xx' id='colonlangcontroltest'>This test failed because it relies on :lang for results, but :lang is not supported by this browser.</p> + + +<!--Notes: + +This test uses :lang to detect whether the language has been set. If :lang is not supported, a message will appear and the test will fail. + +--> +<script> +test(function() { +assert_equals(document.getElementById('colonlangcontroltest').offsetWidth, 0) +assert_equals(document.getElementById('box').offsetWidth, 100); +}, "If there is a conflict between the language declarations in the HTTP header and the Content-Language meta element, the UA will recognize the language declared in the meta element."); +</script> + +<div id='log'></div> + +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-006.html.headers b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-006.html.headers new file mode 100644 index 000000000..1b971b697 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-006.html.headers @@ -0,0 +1 @@ +Content-Language: zh diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-007.html b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-007.html new file mode 100644 index 000000000..8fafef036 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-007.html @@ -0,0 +1,42 @@ +<!DOCTYPE html> +<html lang="ko" > +<head> +<meta charset="utf-8"/> + <meta http-equiv="Content-Language" content="zh" > +<title>html lang and meta elements</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel='help' href='https://html.spec.whatwg.org/multipage/#the-lang-and-xml:lang-attributes'> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<meta name='flags' content='dom'> +<style type='text/css'> + #colonlangcontroltest { color: red; font-weight: bold; width: 400px; } + #colonlangcontroltest:lang(xx) { display:none; } +.test div { width: 50px; } +#box:lang(ko) { width: 100px; } +</style> +</head> +<body> + + + +<div class="test"><div id="box"> </div></div> +<p lang='xx' id='colonlangcontroltest'>This test failed because it relies on :lang for results, but :lang is not supported by this browser.</p> + + +<!--Notes: + +This test uses :lang to detect whether the language has been set. If :lang is not supported, a message will appear and the test will fail. + +--> +<script> +test(function() { +assert_equals(document.getElementById('colonlangcontroltest').offsetWidth, 0) +assert_equals(document.getElementById('box').offsetWidth, 100); +}, "If there is a conflict between the language declared using lang in the html element and that in the meta element, the UA will recognize the language declared in the html element."); +</script> + +<div id='log'></div> + +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-008.html b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-008.html new file mode 100644 index 000000000..3be54154c --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-008.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<html > +<head> +<meta charset="utf-8"/> +<title>lang="..." vs lang=""</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel='help' href='https://html.spec.whatwg.org/multipage/#the-lang-and-xml:lang-attributes'> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<meta name='flags' content='dom'> +<style type='text/css'> + #colonlangcontroltest { color: red; font-weight: bold; width: 400px; } + #colonlangcontroltest:lang(xx) { display:none; } +.test div { width: 50px; } +#box:lang(ko) { width: 100px; } +</style> +</head> +<body> + + + +<div class="test" lang="ko"><div id="box" lang=""> </div></div> +<p lang='xx' id='colonlangcontroltest'>This test failed because it relies on :lang for results, but :lang is not supported by this browser.</p> + + +<!--Notes: + +This test uses :lang to detect whether the language has been set. If :lang is not supported, a message will appear and the test will fail. + +--> +<script> +test(function() { +assert_equals(document.getElementById('colonlangcontroltest').offsetWidth, 0) +assert_equals(document.getElementById('box').offsetWidth, 50); +}, "If an element contains a lang attribute with an empty value, the value of a lang attribute higher up the document tree will no longer be applied to the content of that element."); +</script> + +<div id='log'></div> + +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-009.html b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-009.html new file mode 100644 index 000000000..3a927028e --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-009.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<html lang="" > +<head> +<meta charset="utf-8"/> +<title>lang="" vs HTTP</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel='help' href='https://html.spec.whatwg.org/multipage/#the-lang-and-xml:lang-attributes'> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<meta name='flags' content='http dom'> +<style type='text/css'> + #colonlangcontroltest { color: red; font-weight: bold; width: 400px; } + #colonlangcontroltest:lang(xx) { display:none; } +.test div { width: 50px; } +#box:lang(ko) { width: 100px; } +</style> +</head> +<body> + + + +<div class="test"><div id="box"> </div></div> +<p lang='xx' id='colonlangcontroltest'>This test failed because it relies on :lang for results, but :lang is not supported by this browser.</p> + + +<!--Notes: + +This test uses :lang to detect whether the language has been set. If :lang is not supported, a message will appear and the test will fail. + +--> +<script> +test(function() { +assert_equals(document.getElementById('colonlangcontroltest').offsetWidth, 0) +assert_equals(document.getElementById('box').offsetWidth, 50); +}, "If the HTTP header contains a language declaration but the html element uses an empty lang value, the UA will not recognize the language declared in the HTTP header."); +</script> + +<div id='log'></div> + +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-009.html.headers b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-009.html.headers new file mode 100644 index 000000000..0c47ecd4f --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-009.html.headers @@ -0,0 +1 @@ +Content-Language: ko diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-010.html b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-010.html new file mode 100644 index 000000000..2c2173747 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-010.html @@ -0,0 +1,42 @@ +<!DOCTYPE html> +<html lang="" > +<head> +<meta charset="utf-8"/> + <meta http-equiv="Content-Language" content="ko" > +<title>lang="" vs meta Content-Language</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel='help' href='https://html.spec.whatwg.org/multipage/#the-lang-and-xml:lang-attributes'> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<meta name='flags' content='dom'> +<style type='text/css'> + #colonlangcontroltest { color: red; font-weight: bold; width: 400px; } + #colonlangcontroltest:lang(xx) { display:none; } +.test div { width: 50px; } +#box:lang(ko) { width: 100px; } +</style> +</head> +<body> + + + +<div class="test"><div id="box"> </div></div> +<p lang='xx' id='colonlangcontroltest'>This test failed because it relies on :lang for results, but :lang is not supported by this browser.</p> + + +<!--Notes: + +This test uses :lang to detect whether the language has been set. If :lang is not supported, a message will appear and the test will fail. + +--> +<script> +test(function() { +assert_equals(document.getElementById('colonlangcontroltest').offsetWidth, 0) +assert_equals(document.getElementById('box').offsetWidth, 50); +}, "If the meta Content-Language element contains a language declaration but the html element uses an empty lang value, the UA will not recognize the language declared in the meta Content-Language element."); +</script> + +<div id='log'></div> + +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-011.html.headers b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-011.html.headers new file mode 100644 index 000000000..827b4348f --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/the-lang-attribute-011.html.headers @@ -0,0 +1 @@ +Content-Language: ko,zh,ja diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/the-translate-attribute-007.html b/testing/web-platform/tests/html/dom/elements/global-attributes/the-translate-attribute-007.html new file mode 100644 index 000000000..abce2858a --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/the-translate-attribute-007.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"/> +<title>no translate attribute</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel='help' href='https://html.spec.whatwg.org/multipage/#the-translate-attribute'> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<style type='text/css'> +</style> +</head> +<body> + + + +<div class="test"><div id="box"> </div></div> + + +<script> +test(function() { +assert_true(document.getElementById('box').translate); +}, "In the default case, ie. with no translate attribute in the page, javascript will detect the translation mode of text as translate-enabled."); +</script> + +<div id='log'></div> + +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/the-translate-attribute-008.html b/testing/web-platform/tests/html/dom/elements/global-attributes/the-translate-attribute-008.html new file mode 100644 index 000000000..70486fe59 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/the-translate-attribute-008.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"/> +<title>translate=yes</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel='help' href='https://html.spec.whatwg.org/multipage/#the-translate-attribute'> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<style type='text/css'> +</style> +</head> +<body> + + + +<div class="test"><div id="box" translate="yes"> </div></div> + + +<script> +test(function() { +assert_true(document.getElementById('box').translate); +}, "If the translate attribute is set to yes, javascript will detect the translation mode of text as translate-enabled."); +</script> + +<div id='log'></div> + +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/the-translate-attribute-009.html b/testing/web-platform/tests/html/dom/elements/global-attributes/the-translate-attribute-009.html new file mode 100644 index 000000000..1ab49b030 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/the-translate-attribute-009.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"/> +<title>translate=no</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel='help' href='https://html.spec.whatwg.org/multipage/#the-translate-attribute'> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<style type='text/css'> +</style> +</head> +<body> + + + +<div class="test"><div id="box" translate="no"> </div></div> + + +<script> +test(function() { +assert_false(document.getElementById('box').translate); +}, "If the translate attribute is set to no, javascript will detect the translation mode of text as no-translate."); +</script> + +<div id='log'></div> + +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/the-translate-attribute-010.html b/testing/web-platform/tests/html/dom/elements/global-attributes/the-translate-attribute-010.html new file mode 100644 index 000000000..c45965e00 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/the-translate-attribute-010.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"/> +<title>translate inherits no</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel='help' href='https://html.spec.whatwg.org/multipage/#the-translate-attribute'> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<style type='text/css'> +</style> +</head> +<body> + + + +<div class="test"><div id="box" translate="no"> <span id="spantest"> </span></div></div> + + +<script> +test(function() { +assert_false(document.getElementById('spantest').translate); +}, "If the translate attribute is set to no, javascript will detect the translation mode of elements inside that element with no translate flag as no-translate."); +</script> + +<div id='log'></div> + +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/the-translate-attribute-011.html b/testing/web-platform/tests/html/dom/elements/global-attributes/the-translate-attribute-011.html new file mode 100644 index 000000000..101f70e2e --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/the-translate-attribute-011.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"/> +<title>translate=yes inside translate=no</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel='help' href='https://html.spec.whatwg.org/multipage/#the-translate-attribute'> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<style type='text/css'> +</style> +</head> +<body> + + + +<div class="test"><div id="box" translate="no"> <span id="spantest" translate="yes"> </span></div></div> + + +<script> +test(function() { +assert_true(document.getElementById('spantest').translate); +}, "If the translate attribute is set to yes on an element inside an element with the translate attribute set to no, javascript will detect the translation mode of text in the inner element as translate-enabled."); +</script> + +<div id='log'></div> + +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/global-attributes/the-translate-attribute-012.html b/testing/web-platform/tests/html/dom/elements/global-attributes/the-translate-attribute-012.html new file mode 100644 index 000000000..1d81cfd8b --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/global-attributes/the-translate-attribute-012.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"/> +<title>translate=""</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel='help' href='https://html.spec.whatwg.org/multipage/#the-translate-attribute'> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<style type='text/css'> +</style> +</head> +<body> + + + +<div class="test"><div id="box" translate=""> </div></div> + + +<script> +test(function() { +assert_true(document.getElementById('box').translate); +}, "If the translate attribute is set to a null string, javascript will detect the translation mode of text as translate-enabled."); +</script> + +<div id='log'></div> + +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/.gitkeep b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/.gitkeep new file mode 100644 index 000000000..e69de29bb --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/.gitkeep diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-001a.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-001a.html new file mode 100644 index 000000000..16a308a2f --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-001a.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<title>The dir attribute: isolated from following number, opposite direction</title> +<link rel="author" title="Richard Ishida" href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel="match" href='reference/dir-isolation-001-ref.html'> +<meta name="assert" content='Element content with a dir attribute is treated as a neutral character and directionally isolated from a following number.'> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!--Notes: +Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> +<div class="test"> +<div dir="ltr"><span dir="rtl">א</span> 3</div> +<div dir="ltr"><span dir="rtl">a</span> 3</div> +<div dir="rtl"><span dir="ltr">א</span> 3</div> +<div dir="rtl"><span dir="ltr">a</span> 3</div> +</div> +<div class="ref"> +<div dir="ltr">‭א 3‬</div> +<div dir="ltr">‭a 3‬</div> +<div dir="rtl">‭3 א‬</div> +<div dir="rtl">‭3 a‬</div> +</div> +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-001b.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-001b.html new file mode 100644 index 000000000..197f49aa2 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-001b.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<title>The dir attribute: isolated from following number, auto</title> +<link rel="author" title="Richard Ishida" href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel="match" href='reference/dir-isolation-001-ref.html'> +<meta name="assert" content='Element content with a dir attribute is treated as a neutral character and directionally isolated from a following number.'> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!--Notes: +Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> +<div class="test"> +<div dir="ltr"><span dir="auto">א</span> 3</div> +<div dir="ltr"><span dir="auto">a</span> 3</div> +<div dir="rtl"><span dir="auto">א</span> 3</div> +<div dir="rtl"><span dir="auto">a</span> 3</div> +</div> +<div class="ref"> +<div dir="ltr">‭א 3‬</div> +<div dir="ltr">‭a 3‬</div> +<div dir="rtl">‭3 א‬</div> +<div dir="rtl">‭3 a‬</div> +</div> +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-001c.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-001c.html new file mode 100644 index 000000000..95ec6c739 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-001c.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<title>The dir attribute: isolated from following number, same direction</title> +<link rel="author" title="Richard Ishida" href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel="match" href='reference/dir-isolation-001-ref.html'> +<meta name="assert" content='Element content with a dir attribute is treated as a neutral character and directionally isolated from a following number.'> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!--Notes: +Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> +<div class="test"> +<div dir="ltr"><span dir="ltr">א</span> 3</div> +<div dir="ltr"><span dir="ltr">a</span> 3</div> +<div dir="rtl"><span dir="rtl">א</span> 3</div> +<div dir="rtl"><span dir="rtl">a</span> 3</div> +</div> +<div class="ref"> +<div dir="ltr">‭א 3‬</div> +<div dir="ltr">‭a 3‬</div> +<div dir="rtl">‭3 א‬</div> +<div dir="rtl">‭3 a‬</div> +</div> +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-002a.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-002a.html new file mode 100644 index 000000000..7b7029a26 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-002a.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<title>The dir attribute: isolated from following number with intervening neutrals, opposite direction</title> +<link rel="author" title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel='match' href='reference/dir-isolation-002a-ref.html'> +<meta name='assert' content='Element content with a dir attribute is treated as a neutral character and directionally isolated from a following number.'> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!--Notes: +Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> +<div class="test"> +<div dir="ltr"><span dir="rtl">> א ></span> > 3 ></div> +<div dir="ltr"><span dir="rtl">> a ></span> > 3 ></div> +<div dir="rtl"><span dir="ltr">> א ></span> > 3 ></div> +<div dir="rtl"><span dir="ltr">> a ></span> > 3 ></div> +</div> +<div class="ref"> +<div dir="ltr">‭< א < > 3 >‬</div> +<div dir="ltr">‭< a < > 3 >‬</div> +<div dir="rtl">‭< 3 < > א >‬</div> +<div dir="rtl">‭< 3 < > a >‬</div> +</div> +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-002b.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-002b.html new file mode 100644 index 000000000..d448de508 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-002b.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<title>The dir attribute: isolated from following number with intervening neutrals, auto</title> +<link rel="author" title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel='match' href='reference/dir-isolation-002b-ref.html'> +<meta name='assert' content='Element content with a dir attribute is treated as a neutral character and directionally isolated from a following number.'> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!--Notes: +Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> +<div class="test"> +<div dir="ltr"><span dir="auto">> א ></span> > 3 ></div> +<div dir="ltr"><span dir="auto">> a ></span> > 3 ></div> +<div dir="rtl"><span dir="auto">> א ></span> > 3 ></div> +<div dir="rtl"><span dir="auto">> a ></span> > 3 ></div> +</div> +<div class="ref"> +<div dir="ltr">‭< א < > 3 >‬</div> +<div dir="ltr">‭> a > > 3 >‬</div> +<div dir="rtl">‭< 3 < < א <‬</div> +<div dir="rtl">‭< 3 < > a >‬</div> +</div> +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-002c.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-002c.html new file mode 100644 index 000000000..e88fb1c84 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-002c.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<title>The dir attribute: isolated from following number with intervening neutrals, same direction</title> +<link rel="author" title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel='match' href='reference/dir-isolation-002c-ref.html'> +<meta name='assert' content='Element content with a dir attribute is treated as a neutral character and directionally isolated from a following number.'> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!--Notes: +Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> +<div class="test"> +<div dir="ltr"><span dir="ltr">> א ></span> > 3 ></div> +<div dir="ltr"><span dir="ltr">> a ></span> > 3 ></div> +<div dir="rtl"><span dir="rtl">> א ></span> > 3 ></div> +<div dir="rtl"><span dir="rtl">> a ></span> > 3 ></div> +</div> +<div class="ref"> +<div dir="ltr">‭> א > > 3 >‬</div> +<div dir="ltr">‭> a > > 3 >‬</div> +<div dir="rtl">‭< 3 < < א <‬</div> +<div dir="rtl">‭< 3 < < a <‬</div> +</div> +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-003a.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-003a.html new file mode 100644 index 000000000..9cf65c818 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-003a.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<title>The dir attribute: isolated from immediately following number, opposite direction</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel='match' href='reference/dir-isolation-003-ref.html'> +<meta name='assert' content='Element content with a dir attribute is treated as a neutral character and is directionally isolated from a following number, even with no intervening white space.'> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!--Notes: +Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> +<div class="test"> +<div dir="ltr"><span dir="rtl">א</span>3</div> +<div dir="ltr"><span dir="rtl">a</span>3</div> +<div dir="rtl"><span dir="ltr">א</span>3</div> +<div dir="rtl"><span dir="ltr">a</span>3</div> +</div> +<div class="ref"> +<div dir="ltr">‭א3‬</div> +<div dir="ltr">‭a3‬</div> +<div dir="rtl">‭3א‬</div> +<div dir="rtl">‭3a‬</div> +</div> +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-003b.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-003b.html new file mode 100644 index 000000000..2c6b55308 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-003b.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<title>The dir attribute: isolated from immediately following number, auto</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel='match' href='reference/dir-isolation-003-ref.html'> +<meta name='assert' content='Element content with a dir attribute is treated as a neutral character and is directionally isolated from a following number, even with no intervening white space.'> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!--Notes: +Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> +<div class="test"> +<div dir="ltr"><span dir="auto">א</span>3</div> +<div dir="ltr"><span dir="auto">a</span>3</div> +<div dir="rtl"><span dir="auto">א</span>3</div> +<div dir="rtl"><span dir="auto">a</span>3</div> +</div> +<div class="ref"> +<div dir="ltr">‭א3‬</div> +<div dir="ltr">‭a3‬</div> +<div dir="rtl">‭3א‬</div> +<div dir="rtl">‭3a‬</div> +</div> +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-003c.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-003c.html new file mode 100644 index 000000000..ac8735122 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-003c.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<title>The dir attribute: isolated from immediately following number, same direction</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel='match' href='reference/dir-isolation-003-ref.html'> +<meta name='assert' content='Element content with a dir attribute is treated as a neutral character and is directionally isolated from a following number, even with no intervening white space.'> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!--Notes: +Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> +<div class="test"> +<div dir="ltr"><span dir="ltr">א</span>3</div> +<div dir="ltr"><span dir="ltr">a</span>3</div> +<div dir="rtl"><span dir="rtl">א</span>3</div> +<div dir="rtl"><span dir="rtl">a</span>3</div> +</div> +<div class="ref"> +<div dir="ltr">‭א3‬</div> +<div dir="ltr">‭a3‬</div> +<div dir="rtl">‭3א‬</div> +<div dir="rtl">‭3a‬</div> +</div> +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-004a.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-004a.html new file mode 100644 index 000000000..27a674ccd --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-004a.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<title>The dir attribute: numbers isolated from preceding text, opposite direction</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel='match' href='reference/dir-isolation-004-ref.html'> +<meta name='assert' content='Numeric element content with a dir attribute is treated as a neutral character and directionally isolated from preceding text.'> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!--Notes: +Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> +<div class="test"> +<div dir="ltr">א <span dir="rtl">3</span></div> +<div dir="ltr">a <span dir="rtl">3</span></div> +<div dir="rtl">א <span dir="ltr">3</span></div> +<div dir="rtl">a <span dir="ltr">3</span></div> +</div> +<div class="ref"> +<div dir="ltr">‭א 3‬</div> +<div dir="ltr">‭a 3‬</div> +<div dir="rtl">‭3 א‬</div> +<div dir="rtl">‭3 a‬</div> +</div> +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-004b.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-004b.html new file mode 100644 index 000000000..6fe74393a --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-004b.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<title>The dir attribute: numbers isolated from preceding text, auto</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel='match' href='reference/dir-isolation-004-ref.html'> +<meta name='assert' content='Numeric element content with a dir attribute is treated as a neutral character and directionally isolated from preceding text.'> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!--Notes: +Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> +<div class="test"> +<div dir="ltr">א <span dir="auto">3</span></div> +<div dir="ltr">a <span dir="auto">3</span></div> +<div dir="rtl">א <span dir="auto">3</span></div> +<div dir="rtl">a <span dir="auto">3</span></div> +</div> +<div class="ref"> +<div dir="ltr">‭א 3‬</div> +<div dir="ltr">‭a 3‬</div> +<div dir="rtl">‭3 א‬</div> +<div dir="rtl">‭3 a‬</div> +</div> +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-004c.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-004c.html new file mode 100644 index 000000000..43d994b2f --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-004c.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<title>The dir attribute: numbers isolated from preceding text, same direction</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel='match' href='reference/dir-isolation-004-ref.html'> +<meta name='assert' content='Numeric element content with a dir attribute is treated as a neutral character and directionally isolated from preceding text.'> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!--Notes: +Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> +<div class="test"> +<div dir="ltr">א <span dir="ltr">3</span></div> +<div dir="ltr">a <span dir="ltr">3</span></div> +<div dir="rtl">א <span dir="rtl">3</span></div> +<div dir="rtl">a <span dir="rtl">3</span></div> +</div> +<div class="ref"> +<div dir="ltr">‭א 3‬</div> +<div dir="ltr">‭a 3‬</div> +<div dir="rtl">‭3 א‬</div> +<div dir="rtl">‭3 a‬</div> +</div> +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-005a.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-005a.html new file mode 100644 index 000000000..2fbddbd71 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-005a.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<title>The dir attribute: isolated from following text, opposite direction</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel='match' href='reference/dir-isolation-005-ref.html'> +<meta name='assert' content='Element content with a dir attribute is treated as a neutral character and directionally isolated from following text.'> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!--Notes: +Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> +<div class="test"> +<div dir="ltr"><span dir="rtl">א</span> ב...</div> +<div dir="ltr"><span dir="rtl">a</span> b...</div> +<div dir="rtl"><span dir="ltr">a</span> b...</div> +<div dir="rtl"><span dir="ltr">א</span> ב...</div> +</div> +<div class="ref"> +<div dir="ltr">‭א ב...‬</div> +<div dir="ltr">‭a b...‬</div> +<div dir="rtl">‭...b a‬</div> +<div dir="rtl">‭...ב א‬</div> +</div> +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-005b.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-005b.html new file mode 100644 index 000000000..d61e258f2 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-005b.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<title>The dir attribute: isolated from following text, auto</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel='match' href='reference/dir-isolation-005-ref.html'> +<meta name='assert' content='Element content with a dir attribute is treated as a neutral character and directionally isolated from following text.'> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!--Notes: +Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> +<div class="test"> +<div dir="ltr"><span dir="auto">א</span> ב...</div> +<div dir="ltr"><span dir="auto">a</span> b...</div> +<div dir="rtl"><span dir="auto">a</span> b...</div> +<div dir="rtl"><span dir="auto">א</span> ב...</div> +</div> +<div class="ref"> +<div dir="ltr">‭א ב...‬</div> +<div dir="ltr">‭a b...‬</div> +<div dir="rtl">‭...b a‬</div> +<div dir="rtl">‭...ב א‬</div> +</div> +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-005c.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-005c.html new file mode 100644 index 000000000..d544275b2 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-005c.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<title>The dir attribute: isolated from following text, same direction</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel='match' href='reference/dir-isolation-005-ref.html'> +<meta name='assert' content='Element content with a dir attribute is treated as a neutral character and directionally isolated from following text.'> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!--Notes: +Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> +<div class="test"> +<div dir="ltr"><span dir="ltr">א</span> ב...</div> +<div dir="ltr"><span dir="ltr">a</span> b...</div> +<div dir="rtl"><span dir="rtl">a</span> b...</div> +<div dir="rtl"><span dir="rtl">א</span> ב...</div> +</div> +<div class="ref"> +<div dir="ltr">‭א ב...‬</div> +<div dir="ltr">‭a b...‬</div> +<div dir="rtl">‭...b a‬</div> +<div dir="rtl">‭...ב א‬</div> +</div> +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-006a.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-006a.html new file mode 100644 index 000000000..430df00d9 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-006a.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<title>The dir attribute: isolated from following text with intervening neutrals, opposite direction</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel='match' href='reference/dir-isolation-006-ref.html'> +<meta name='assert' content='Element content with a dir attribute is treated as a neutral character and directionally isolated from following text despite intervening neutrals.'> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!--Notes: +Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> +<div class="test"> +<div dir="ltr"><span dir="rtl">> א ></span> > ב >...</div> +<div dir="rtl"><span dir="ltr">> a ></span> > b >...</div> +</div> +<div class="ref"> +<div dir="ltr">‭< א < > ב >...‬</div> +<div dir="rtl">‭...< b < > a >‬</div> +</div> +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-006b.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-006b.html new file mode 100644 index 000000000..a6da48715 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-006b.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<title>The dir attribute: isolated from following text with intervening neutrals, auto</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel='match' href='reference/dir-isolation-006-ref.html'> +<meta name='assert' content='Element content with a dir attribute is treated as a neutral character and directionally isolated from following text despite intervening neutrals.'> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!--Notes: +Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> +<div class="test"> +<div dir="ltr"><span dir="auto">> א ></span> > ב >...</div> +<div dir="rtl"><span dir="auto">> a ></span> > b >...</div> +</div> +<div class="ref"> +<div dir="ltr">‭< א < > ב >...‬</div> +<div dir="rtl">‭...< b < > a >‬</div> +</div> +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-006c.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-006c.html new file mode 100644 index 000000000..3407d37f3 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-006c.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<title>The dir attribute: isolated from following text with intervening neutrals, same direction</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel='match' href='reference/dir-isolation-006c-ref.html'> +<meta name='assert' content='Element content with a dir attribute is treated as a neutral character and directionally isolated from following text despite intervening neutrals.'> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!--Notes: +Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> +<div class="test"> +<div dir="ltr"><span dir="ltr">> א ></span> > ב >...</div> +<div dir="rtl"><span dir="rtl">> a ></span> > b >...</div> +</div> +<div class="ref"> +<div dir="ltr">‭> א > > ב >...‬</div> +<div dir="rtl">‭...< b < < a <‬</div> +</div> +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-007a.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-007a.html new file mode 100644 index 000000000..e8b37b1b9 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-007a.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<title>The dir attribute: isolated from immediately following text, opposite direction</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel='match' href='reference/dir-isolation-007-ref.html'> +<meta name='assert' content='Element content with a dir attribute is treated as a neutral character and directionally isolated from following text even with no intervening white space.'> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!--Notes: +Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> +<div class="test"> +<div dir="ltr"><span dir="rtl">א</span>ב...</div> +<div dir="ltr"><span dir="rtl">a</span>b...</div> +<div dir="rtl"><span dir="ltr">a</span>b...</div> +<div dir="rtl"><span dir="ltr">א</span>ב...</div> +</div> +<div class="ref"> +<div dir="ltr">‭אב...‬</div> +<div dir="ltr">‭ab...‬</div> +<div dir="rtl">‭...ba‬</div> +<div dir="rtl">‭...בא‬</div> +</div> +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-007b.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-007b.html new file mode 100644 index 000000000..c54e63de7 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-007b.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<title>The dir attribute: isolated from immediately following text, auto</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel='match' href='reference/dir-isolation-007-ref.html'> +<meta name='assert' content='Element content with a dir attribute is treated as a neutral character and directionally isolated from following text even with no intervening white space.'> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!--Notes: +Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> +<div class="test"> +<div dir="ltr"><span dir="auto">א</span>ב...</div> +<div dir="ltr"><span dir="auto">a</span>b...</div> +<div dir="rtl"><span dir="auto">a</span>b...</div> +<div dir="rtl"><span dir="auto">א</span>ב...</div> +</div> +<div class="ref"> +<div dir="ltr">‭אב...‬</div> +<div dir="ltr">‭ab...‬</div> +<div dir="rtl">‭...ba‬</div> +<div dir="rtl">‭...בא‬</div> +</div> +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-007c.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-007c.html new file mode 100644 index 000000000..b9c5219b8 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-007c.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<title>The dir attribute: isolated from immediately following text, same direction</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel='match' href='reference/dir-isolation-007-ref.html'> +<meta name='assert' content='Element content with a dir attribute is treated as a neutral character and directionally isolated from following text even with no intervening white space.'> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!--Notes: +Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> +<div class="test"> +<div dir="ltr"><span dir="ltr">א</span>ב...</div> +<div dir="ltr"><span dir="ltr">a</span>b...</div> +<div dir="rtl"><span dir="rtl">a</span>b...</div> +<div dir="rtl"><span dir="rtl">א</span>ב...</div> +</div> +<div class="ref"> +<div dir="ltr">‭אב...‬</div> +<div dir="ltr">‭ab...‬</div> +<div dir="rtl">‭...ba‬</div> +<div dir="rtl">‭...בא‬</div> +</div> +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-008a.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-008a.html new file mode 100644 index 000000000..1455fd552 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-008a.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<title>The dir attribute: isolated from preceding text, opposite direction</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel='match' href='reference/dir-isolation-008-ref.html'> +<meta name='assert' content='Element content with a dir attribute is treated as a neutral character and directionally isolated from preceding text.'> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!--Notes: +Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> +<div class="test"> +<div dir="ltr">א <span dir="rtl">ב</span></div> +<div dir="ltr">a <span dir="rtl">b</span></div> +<div dir="rtl">א <span dir="ltr">ב</span></div> +<div dir="rtl">a <span dir="ltr">b</span></div> +</div> +<div class="ref"> +<div dir="ltr">‭א ב‬</div> +<div dir="ltr">‭a b‬</div> +<div dir="rtl">‭ב א‬</div> +<div dir="rtl">‭b a‬</div> +</div> +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-008b.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-008b.html new file mode 100644 index 000000000..f12e6d67b --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-008b.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<title>The dir attribute: isolated from preceding text, auto</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel='match' href='reference/dir-isolation-008-ref.html'> +<meta name='assert' content='Element content with a dir attribute is treated as a neutral character and directionally isolated from preceding text.'> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!--Notes: +Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> +<div class="test"> +<div dir="ltr">א <span dir="auto">ב</span></div> +<div dir="ltr">a <span dir="auto">b</span></div> +<div dir="rtl">א <span dir="auto">ב</span></div> +<div dir="rtl">a <span dir="auto">b</span></div> +</div> +<div class="ref"> +<div dir="ltr">‭א ב‬</div> +<div dir="ltr">‭a b‬</div> +<div dir="rtl">‭ב א‬</div> +<div dir="rtl">‭b a‬</div> +</div> +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-008c.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-008c.html new file mode 100644 index 000000000..b1754cf23 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-008c.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<title>The dir attribute: isolated from preceding text, same direction</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel='match' href='reference/dir-isolation-008-ref.html'> +<meta name='assert' content='Element content with a dir attribute is treated as a neutral character and directionally isolated from preceding text.'> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!--Notes: +Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +The punctuation is moved around in the source to make it easier to do visual comparisons when the test is run. +--> +<div class="test"> +<div dir="ltr">א <span dir="ltr">ב</span></div> +<div dir="ltr">a <span dir="ltr">b</span></div> +<div dir="rtl">א <span dir="rtl">ב</span></div> +<div dir="rtl">a <span dir="rtl">b</span></div> +</div> +<div class="ref"> +<div dir="ltr">‭א ב‬</div> +<div dir="ltr">‭a b‬</div> +<div dir="rtl">‭ב א‬</div> +<div dir="rtl">‭b a‬</div> +</div> +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-009a.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-009a.html new file mode 100644 index 000000000..63a9706ba --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-009a.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"/> +<title>The dir attribute: isolated from surrounding text, opposite direction</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel='match' href='reference/dir-isolation-009-ref.html'> +<meta name='assert' content="Element content with a dir attribute is treated as a neutral character and directionally isolated from surrounding text."> +<style type='text/css'> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!-- Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +If the BDI in the test's first DIV were a SPAN, its b would prevent the א and the ב +from forming a single RTL run and thus keep the >s between from being mirrored into <s. +--> +<div class="test"> +<div dir="ltr">א > <span dir="rtl">> b ></span> > ג...</div> +<div dir="rtl">a > <span dir="ltr">> ב ></span> > c...</div> +</div> +<div class="ref"> +<div dir="ltr">‭ג < < b < < א...‬</div> +<div dir="rtl">‭...a > > ב > > c‬</div> +</div> +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-009b.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-009b.html new file mode 100644 index 000000000..57098fa75 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-009b.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"/> +<title>The dir attribute: isolated from surrounding text, auto</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel='match' href='reference/dir-isolation-009b-ref.html'> +<meta name='assert' content="Element content with a dir attribute is treated as a neutral character and directionally isolated from surrounding text."> +<style type='text/css'> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!-- Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +If the BDI in the test's first DIV were a SPAN, its b would prevent the א and the ב +from forming a single RTL run and thus keep the >s between from being mirrored into <s. +--> +<div class="test"> +<div dir="ltr">א > <span dir="auto">> b ></span> > ג...</div> +<div dir="rtl">a > <span dir="auto">> ב ></span> > c...</div> +</div> +<div class="ref"> +<div dir="ltr">‭ג < > b > < א...‬</div> +<div dir="rtl">‭...a > < ב < > c‬</div> +</div> +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-009c.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-009c.html new file mode 100644 index 000000000..4aac3184e --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/dir-isolation-009c.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"/> +<title>The dir attribute: isolated from surrounding text, same direction</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<link rel="help" href='http://www.w3.org/TR/html5/dom.html#requirements-relating-to-the-bidirectional-algorithm'> +<link rel='match' href='reference/dir-isolation-009b-ref.html'> +<meta name='assert' content="Element content with a dir attribute is treated as a neutral character and directionally isolated from surrounding text."> +<style type='text/css'> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<!-- Key to entities used below: +א ... ו - The first six Hebrew letters (strongly RTL). +‭ - The LRO (left-to-right-override) formatting character. +‬ - The PDF (pop directional formatting) formatting character; closes LRO. +If the BDI in the test's first DIV were a SPAN, its b would prevent the א and the ב +from forming a single RTL run and thus keep the >s between from being mirrored into <s. +--> +<div class="test"> +<div dir="ltr">א > <span dir="ltr">> b ></span> > ג...</div> +<div dir="rtl">a > <span dir="rtl">> ב ></span> > c...</div> +</div> +<div class="ref"> +<div dir="ltr">‭ג < > b > < א...‬</div> +<div dir="rtl">‭...a > < ב < > c‬</div> +</div> +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-001-ref.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-001-ref.html new file mode 100644 index 000000000..b5882eb7a --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-001-ref.html @@ -0,0 +1,16 @@ +<!doctype html> +<html> +<head> +<meta charset="utf-8"/> +<title>The dir attribute: isolated from following number, opposite direction</title> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<div class="ref"><div dir="ltr">‭א 3‬</div><div dir="ltr">‭a 3‬</div><div dir="rtl">‭3 א‬</div><div dir="rtl">‭3 a‬</div></div> +<div class="ref"><div dir="ltr">‭א 3‬</div><div dir="ltr">‭a 3‬</div><div dir="rtl">‭3 א‬</div><div dir="rtl">‭3 a‬</div></div> +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-002a-ref.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-002a-ref.html new file mode 100644 index 000000000..f28559b5a --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-002a-ref.html @@ -0,0 +1,16 @@ +<!doctype html> +<html> +<head> +<meta charset="utf-8"/> +<title>The dir attribute: isolated from following number with intervening neutrals, opposite direction</title> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<div class="ref"><div dir="ltr">‭< א < > 3 >‬</div><div dir="ltr">‭< a < > 3 >‬</div><div dir="rtl">‭< 3 < > א >‬</div><div dir="rtl">‭< 3 < > a >‬</div></div> +<div class="ref"><div dir="ltr">‭< א < > 3 >‬</div><div dir="ltr">‭< a < > 3 >‬</div><div dir="rtl">‭< 3 < > א >‬</div><div dir="rtl">‭< 3 < > a >‬</div></div> +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-002b-ref.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-002b-ref.html new file mode 100644 index 000000000..d4eda2189 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-002b-ref.html @@ -0,0 +1,16 @@ +<!doctype html> +<html> +<head> +<meta charset="utf-8"/> +<title>The dir attribute: isolated from following number with intervening neutrals, auto</title> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<div class="ref"><div dir="ltr">‭< א < > 3 >‬</div><div dir="ltr">‭> a > > 3 >‬</div><div dir="rtl">‭< 3 < < א <‬</div><div dir="rtl">‭< 3 < > a >‬</div></div> +<div class="ref"><div dir="ltr">‭< א < > 3 >‬</div><div dir="ltr">‭> a > > 3 >‬</div><div dir="rtl">‭< 3 < < א <‬</div><div dir="rtl">‭< 3 < > a >‬</div></div> +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-002c-ref.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-002c-ref.html new file mode 100644 index 000000000..6c21d0147 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-002c-ref.html @@ -0,0 +1,16 @@ +<!doctype html> +<html> +<head> +<meta charset="utf-8"/> +<title>The dir attribute: isolated from following number with intervening neutrals, same direction</title> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<div class="ref"><div dir="ltr">‭> א > > 3 >‬</div><div dir="ltr">‭> a > > 3 >‬</div><div dir="rtl">‭< 3 < < א <‬</div><div dir="rtl">‭< 3 < < a <‬</div></div> +<div class="ref"><div dir="ltr">‭> א > > 3 >‬</div><div dir="ltr">‭> a > > 3 >‬</div><div dir="rtl">‭< 3 < < א <‬</div><div dir="rtl">‭< 3 < < a <‬</div></div> +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-003-ref.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-003-ref.html new file mode 100644 index 000000000..4c29838ee --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-003-ref.html @@ -0,0 +1,16 @@ +<!doctype html> +<html> +<head> +<meta charset="utf-8"/> +<title>The dir attribute: isolated from immediately following number, opposite direction</title> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<div class="ref"><div dir="ltr">‭א3‬</div><div dir="ltr">‭a3‬</div><div dir="rtl">‭3א‬</div><div dir="rtl">‭3a‬</div></div> +<div class="ref"><div dir="ltr">‭א3‬</div><div dir="ltr">‭a3‬</div><div dir="rtl">‭3א‬</div><div dir="rtl">‭3a‬</div></div> +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-004-ref.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-004-ref.html new file mode 100644 index 000000000..cb83dde58 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-004-ref.html @@ -0,0 +1,16 @@ +<!doctype html> +<html> +<head> +<meta charset="utf-8"/> +<title>The dir attribute: numbers isolated from preceding text, opposite direction</title> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<div class="ref"><div dir="ltr">‭א 3‬</div><div dir="ltr">‭a 3‬</div><div dir="rtl">‭3 א‬</div><div dir="rtl">‭3 a‬</div></div> +<div class="ref"><div dir="ltr">‭א 3‬</div><div dir="ltr">‭a 3‬</div><div dir="rtl">‭3 א‬</div><div dir="rtl">‭3 a‬</div></div> +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-005-ref.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-005-ref.html new file mode 100644 index 000000000..4a6c301aa --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-005-ref.html @@ -0,0 +1,16 @@ +<!doctype html> +<html> +<head> +<meta charset="utf-8"/> +<title>The dir attribute: isolated from following text, opposite direction</title> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<div class="ref"><div dir="ltr">‭א ב...‬</div><div dir="ltr">‭a b...‬</div><div dir="rtl">‭...b a‬</div><div dir="rtl">‭...ב א‬</div></div> +<div class="ref"><div dir="ltr">‭א ב...‬</div><div dir="ltr">‭a b...‬</div><div dir="rtl">‭...b a‬</div><div dir="rtl">‭...ב א‬</div></div> +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-006-ref.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-006-ref.html new file mode 100644 index 000000000..0f6b7bbbd --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-006-ref.html @@ -0,0 +1,16 @@ +<!doctype html> +<html> +<head> +<meta charset="utf-8"/> +<title>The dir attribute: isolated from following text with intervening neutrals, opposite direction</title> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<div class="ref"><div dir="ltr">‭< א < > ב >...‬</div><div dir="rtl">‭...< b < > a >‬</div></div> +<div class="ref"><div dir="ltr">‭< א < > ב >...‬</div><div dir="rtl">‭...< b < > a >‬</div></div> +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-006c-ref.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-006c-ref.html new file mode 100644 index 000000000..0347c0910 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-006c-ref.html @@ -0,0 +1,16 @@ +<!doctype html> +<html> +<head> +<meta charset="utf-8"/> +<title>The dir attribute: isolated from following text with intervening neutrals, same direction</title> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<div class="ref"><div dir="ltr">‭> א > > ב >...‬</div><div dir="rtl">‭...< b < < a <‬</div></div> +<div class="ref"><div dir="ltr">‭> א > > ב >...‬</div><div dir="rtl">‭...< b < < a <‬</div></div> +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-007-ref.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-007-ref.html new file mode 100644 index 000000000..665153d64 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-007-ref.html @@ -0,0 +1,16 @@ +<!doctype html> +<html> +<head> +<meta charset="utf-8"/> +<title>The dir attribute: isolated from immediately following text, opposite direction</title> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<div class="ref"><div dir="ltr">‭אב...‬</div><div dir="ltr">‭ab...‬</div><div dir="rtl">‭...ba‬</div><div dir="rtl">‭...בא‬</div></div> +<div class="ref"><div dir="ltr">‭אב...‬</div><div dir="ltr">‭ab...‬</div><div dir="rtl">‭...ba‬</div><div dir="rtl">‭...בא‬</div></div> +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-008-ref.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-008-ref.html new file mode 100644 index 000000000..8eb90f8b7 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-008-ref.html @@ -0,0 +1,16 @@ +<!doctype html> +<html> +<head> +<meta charset="utf-8"/> +<title>The dir attribute: isolated from preceding text, opposite direction</title> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<div class="ref"><div dir="ltr">‭א ב‬</div><div dir="ltr">‭a b‬</div><div dir="rtl">‭ב א‬</div><div dir="rtl">‭b a‬</div></div> +<div class="ref"><div dir="ltr">‭א ב‬</div><div dir="ltr">‭a b‬</div><div dir="rtl">‭ב א‬</div><div dir="rtl">‭b a‬</div></div> +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-009-ref.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-009-ref.html new file mode 100644 index 000000000..1d2f57c6c --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-009-ref.html @@ -0,0 +1,16 @@ +<!doctype html> +<html> +<head> +<meta charset="utf-8"/> +<title>The dir attribute: isolated from surrounding text, opposite direction</title> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<div class="ref"><div dir="ltr">‭ג < < b < < א...‬</div><div dir="rtl">‭...a > > ב > > c‬</div></div> +<div class="ref"><div dir="ltr">‭ג < < b < < א...‬</div><div dir="rtl">‭...a > > ב > > c‬</div></div> +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-009b-ref.html b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-009b-ref.html new file mode 100644 index 000000000..30ee14c6c --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/requirements-relating-to-bidirectional-algorithm-formatting-characters/reference/dir-isolation-009b-ref.html @@ -0,0 +1,16 @@ +<!doctype html> +<html> +<head> +<meta charset="utf-8"/> +<title>The dir attribute: isolated from surrounding text, auto</title> +<style type="text/css"> +.test, .ref { font-size: 150%; border: 1px solid orange; margin: 10px; margin-right: 200px; padding: 5px; clear: both; } +input { margin: 5px; } +</style> +</head> +<body> +<p class="instructions" dir="ltr">Test passes if the two boxes are identical.</p> +<div class="ref"><div dir="ltr">‭ג < > b > < א...‬</div><div dir="rtl">‭...a > < ב < > c‬</div></div> +<div class="ref"><div dir="ltr">‭ג < > b > < א...‬</div><div dir="rtl">‭...a > < ב < > c‬</div></div> +</body> +</html> diff --git a/testing/web-platform/tests/html/dom/elements/semantics-0/.gitkeep b/testing/web-platform/tests/html/dom/elements/semantics-0/.gitkeep new file mode 100644 index 000000000..e69de29bb --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/semantics-0/.gitkeep diff --git a/testing/web-platform/tests/html/dom/elements/wai-aria/.gitkeep b/testing/web-platform/tests/html/dom/elements/wai-aria/.gitkeep new file mode 100644 index 000000000..e69de29bb --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/wai-aria/.gitkeep diff --git a/testing/web-platform/tests/html/dom/elements/wai-aria/README.md b/testing/web-platform/tests/html/dom/elements/wai-aria/README.md new file mode 100644 index 000000000..bea30702d --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/wai-aria/README.md @@ -0,0 +1 @@ +The test suite for WAI-ARIA is available at: <https://www.w3.org/WAI/PF/testharness/>. diff --git a/testing/web-platform/tests/html/dom/elements/wai-aria/contains.json b/testing/web-platform/tests/html/dom/elements/wai-aria/contains.json new file mode 100644 index 000000000..031cde580 --- /dev/null +++ b/testing/web-platform/tests/html/dom/elements/wai-aria/contains.json @@ -0,0 +1,18 @@ +[ + { + "id": "aria-role-attribute", + "original_id": "aria-role-attribute" + }, + { + "id": "state-and-property-attributes", + "original_id": "state-and-property-attributes" + }, + { + "id": "sec-strong-native-semantics", + "original_id": "sec-strong-native-semantics" + }, + { + "id": "sec-implicit-aria-semantics", + "original_id": "sec-implicit-aria-semantics" + } +]
\ No newline at end of file |