Refactor and split up quirks tests
The unitless-length test was a flaky timeout in chromium.
https://bugs.chromium.org/p/chromium/issues/detail?id=646133
diff --git a/quirks/hashless-hex-color.html b/quirks/hashless-hex-color.html
deleted file mode 100644
index cbda90c..0000000
--- a/quirks/hashless-hex-color.html
+++ /dev/null
@@ -1,498 +0,0 @@
-<!doctype html>
-<html>
- <head>
- <title>The hashless hex color quirk</title>
- <meta name="timeout" content="long">
- <script src="/resources/testharness.js"></script>
- <script src="/resources/testharnessreport.js"></script>
- <style> iframe { width:20px; height:20px; } </style>
- </head>
- <body>
- <div id=log></div>
- <iframe id=quirks></iframe>
- <iframe id=almost></iframe>
- <iframe id=standards></iframe>
- <script>
- setup({explicit_done:true});
- onload = function() {
- var html = "<style id=style></style><div id=test></div><div id=ref></div><svg><circle id=svg /><circle id=svg_ref /></svg>";
- var a_doctype = '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">';
- var s_doctype = '<!DOCTYPE HTML>';
- var q = document.getElementById('quirks').contentWindow;
- var a = document.getElementById('almost').contentWindow;
- var s = document.getElementById('standards').contentWindow;
- q.document.open();
- q.document.write(html);
- q.document.close();
- a.document.open();
- a.document.write(a_doctype + html);
- a.document.close();
- s.document.open();
- s.document.write(s_doctype + html);
- s.document.close();
- [q, a, s].forEach(function(win) {
- ['style', 'test', 'ref', 'svg', 'svg_ref'].forEach(function(id) {
- win[id] = win.document.getElementById(id);
- });
- });
-
- var tests = [
- {input:"123", q:"#000123"},
- {input:"023", q:"#000023"},
- {input:"003", q:"#000003"},
- {input:"000", q:"#000"},
- {input:"abc", q:"#abc"},
- {input:"ABC", q:"#abc"},
- {input:"1ab", q:"#0001ab"},
- {input:"1AB", q:"#0001ab"},
- {input:"112233", q:"#123"},
- {input:"012233", q:"#012233"},
- {input:"002233", q:"#023"},
- {input:"000233", q:"#000233"},
- {input:"000033", q:"#003"},
- {input:"000003", q:"#000003"},
- {input:"000000", q:"#000000"},
- {input:"aabbcc", q:"#abc"},
- {input:"AABBCC", q:"#abc"},
- {input:"11aabb", q:"#1ab"},
- {input:"11AABB", q:"#1ab"},
- {input:"\\31 23", q:"#123"},
- {input:"\\61 bc", q:"#abc"},
- {input:"\\41 BC", q:"#abc"},
- {input:"\\31 ab", q:"#1ab"},
- {input:"\\31 AB", q:"#1ab"},
- {input:"\\31 12233", q:"#123"},
- {input:"\\61 abbcc", q:"#abc"},
- {input:"\\41 ABBCC", q:"#abc"},
- {input:"\\31 1aabb", q:"#1ab"},
- {input:"\\31 1AABB", q:"#1ab"},
- {input:"12\\33 ", q:"#000123"},
- {input:"1", q:"#000001"},
- {input:"12", q:"#000012"},
- {input:"1234", q:"#001234"},
- {input:"12345", q:"#012345"},
- {input:"1234567"},
- {input:"12345678"},
- {input:"a"},
- {input:"aa"},
- {input:"aaaa"},
- {input:"aaaaa"},
- {input:"aaaaaaa"},
- {input:"aaaaaaaa"},
- {input:"A"},
- {input:"AA"},
- {input:"AAAA"},
- {input:"AAAAA"},
- {input:"AAAAAAA"},
- {input:"AAAAAAAA"},
- {input:"1a", q:"#00001a"},
- {input:"1abc", q:"#001abc"},
- {input:"1abcd", q:"#01abcd"},
- {input:"1abcdef"},
- {input:"1abcdeff"},
- {input:"+1", q:"#000001"},
- {input:"+12", q:"#000012"},
- {input:"+123", q:"#000123"},
- {input:"+1234", q:"#001234"},
- {input:"+12345", q:"#012345"},
- {input:"+123456", q:"#123456"},
- {input:"+1234567"},
- {input:"+12345678"},
- {input:"-1"},
- {input:"-12"},
- {input:"-123"},
- {input:"-1234"},
- {input:"-12345"},
- {input:"-123456"},
- {input:"-1234567"},
- {input:"-12345678"},
- {input:"+1a", q:"#00001a"},
- {input:"+12a", q:"#00012a"},
- {input:"+123a", q:"#00123a"},
- {input:"+1234a", q:"#01234a"},
- {input:"+12345a", q:"#12345a"},
- {input:"+123456a"},
- {input:"+1234567a"},
- {input:"-1a"},
- {input:"-12a"},
- {input:"-123a"},
- {input:"-1234a"},
- {input:"-12345a"},
- {input:"-123456a"},
- {input:"-1234567a"},
- {input:"-12345678a"},
- {input:"+1A", q:"#00001a"},
- {input:"+12A", q:"#00012a"},
- {input:"+123A", q:"#00123a"},
- {input:"+1234A", q:"#01234a"},
- {input:"+12345A", q:"#12345a"},
- {input:"+123456A"},
- {input:"+1234567A"},
- {input:"-1A"},
- {input:"-12A"},
- {input:"-123A"},
- {input:"-1234A"},
- {input:"-12345A"},
- {input:"-123456A"},
- {input:"-1234567A"},
- {input:"-12345678A"},
- {input:"+a"},
- {input:"+aa"},
- {input:"+aaa"},
- {input:"+aaaa"},
- {input:"+aaaaa"},
- {input:"+aaaaaa"},
- {input:"+aaaaaaa"},
- {input:"+aaaaaaaa"},
- {input:"-a"},
- {input:"-aa"},
- {input:"-aaa"},
- {input:"-aaaa"},
- {input:"-aaaaa"},
- {input:"-aaaaaa"},
- {input:"-aaaaaaa"},
- {input:"-aaaaaaaa"},
- {input:"-aaaaaaaaa"},
- {input:"+A"},
- {input:"+AA"},
- {input:"+AAA"},
- {input:"+AAAA"},
- {input:"+AAAAA"},
- {input:"+AAAAAA"},
- {input:"+AAAAAAA"},
- {input:"+AAAAAAAA"},
- {input:"-A"},
- {input:"-AA"},
- {input:"-AAA"},
- {input:"-AAAA"},
- {input:"-AAAAA"},
- {input:"-AAAAAA"},
- {input:"-AAAAAAA"},
- {input:"-AAAAAAAA"},
- {input:"-AAAAAAAAA"},
- {input:"1.1"},
- {input:"1.11"},
- {input:"1.111"},
- {input:"1.1111"},
- {input:"1.11111"},
- {input:"1.111111"},
- {input:"1.1111111"},
- {input:"+1.1"},
- {input:"+1.11"},
- {input:"+1.111"},
- {input:"+1.1111"},
- {input:"+1.11111"},
- {input:"+1.111111"},
- {input:"+1.1111111"},
- {input:"-1.1"},
- {input:"-1.11"},
- {input:"-1.111"},
- {input:"-1.1111"},
- {input:"-1.11111"},
- {input:"-1.111111"},
- {input:"-1.1111111"},
- {input:"1.1a"},
- {input:"1.11a"},
- {input:"1.111a"},
- {input:"1.1111a"},
- {input:"1.11111a"},
- {input:"1.111111a"},
- {input:"+1.1a"},
- {input:"+1.11a"},
- {input:"+1.111a"},
- {input:"+1.1111a"},
- {input:"+1.11111a"},
- {input:"+1.111111a"},
- {input:"-1.1a"},
- {input:"-1.11a"},
- {input:"-1.111a"},
- {input:"-1.1111a"},
- {input:"-1.11111a"},
- {input:"-1.111111a"},
- {input:"1.0"},
- {input:"11.0"},
- {input:"111.0"},
- {input:"1111.0"},
- {input:"11111.0"},
- {input:"111111.0"},
- {input:"1111111.0"},
- {input:"11111111.0"},
- {input:"+1.0"},
- {input:"+11.0"},
- {input:"+111.0"},
- {input:"+1111.0"},
- {input:"+11111.0"},
- {input:"+111111.0"},
- {input:"+1111111.0"},
- {input:"+11111111.0"},
- {input:"-1.0"},
- {input:"-11.0"},
- {input:"-111.0"},
- {input:"-1111.0"},
- {input:"-11111.0"},
- {input:"-111111.0"},
- {input:"-1111111.0"},
- {input:"-11111111.0"},
- {input:"1.0a"},
- {input:"11.0a"},
- {input:"111.0a"},
- {input:"1111.0a"},
- {input:"11111.0a"},
- {input:"111111.0a"},
- {input:"1111111.0a"},
- {input:"+1.0a"},
- {input:"+11.0a"},
- {input:"+111.0a"},
- {input:"+1111.0a"},
- {input:"+11111.0a"},
- {input:"+111111.0a"},
- {input:"+1111111.0a"},
- {input:"-1.0a"},
- {input:"-11.0a"},
- {input:"-111.0a"},
- {input:"-1111.0a"},
- {input:"-11111.0a"},
- {input:"-111111.0a"},
- {input:"-1111111.0a"},
- {input:"+/**/123"},
- {input:"-/**/123"},
- {input:"+/**/123456"},
- {input:"-/**/123456"},
- {input:"+/**/abc"},
- {input:"-/**/abc"},
- {input:"+/**/abcdef"},
- {input:"-/**/abcdef"},
- {input:"+/**/12a"},
- {input:"-/**/12a"},
- {input:"+/**/12345a"},
- {input:"-/**/12345a"},
- {input:"abg"},
- {input:"aabbcg"},
- {input:"1ag"},
- {input:"1122ag"},
- {input:"ABG"},
- {input:"AABBCG"},
- {input:"1AG"},
- {input:"1122AG"},
- {input:"@a"},
- {input:"@ab"},
- {input:"@abc"},
- {input:"@abcd"},
- {input:"@abcde"},
- {input:"@abcdef"},
- {input:"@1"},
- {input:"@11"},
- {input:"@111"},
- {input:"@1111"},
- {input:"@11111"},
- {input:"@111111"},
- {input:"@1a"},
- {input:"@11a"},
- {input:"@111a"},
- {input:"@1111a"},
- {input:"@11111a"},
- {input:'"a"'},
- {input:'"ab"'},
- {input:'"abc"'},
- {input:'"abcd"'},
- {input:'"abcde"'},
- {input:'"abcdef"'},
- {input:'"1"'},
- {input:'"11"'},
- {input:'"111"'},
- {input:'"1111"'},
- {input:'"11111"'},
- {input:'"111111"'},
- {input:'"1a"'},
- {input:'"11a"'},
- {input:'"111a"'},
- {input:'"1111a"'},
- {input:'"11111a"'},
- {input:"url(a)", svg:'url(a)'},
- {input:"url(aa)", svg:'url(aa)'},
- {input:"url(aaa)", svg:'url(aaa)'},
- {input:"url(aaaa)", svg:'url(aaaa)'},
- {input:"url(aaaaa)", svg:'url(aaaaa)'},
- {input:"url(aaaaaa)", svg:'url(aaaaaa)'},
- {input:"url('a')", svg:'url(a)'},
- {input:"url('aa')", svg:'url(aa)'},
- {input:"url('aaa')", svg:'url(aaa)'},
- {input:"url('aaaa')", svg:'url(aaaa)'},
- {input:"url('aaaaa')", svg:'url(aaaaa)'},
- {input:"url('aaaaaa')", svg:'url(aaaaaa)'},
- {input:"#a"},
- {input:"#aa"},
- {input:"#aaaaa"},
- {input:"#aaaaaaa"},
- {input:"#1"},
- {input:"#11"},
- {input:"#11111"},
- {input:"#1111111"},
- {input:"#1a"},
- {input:"#1111a"},
- {input:"#111111a"},
- {input:"1%"},
- {input:"11%"},
- {input:"111%"},
- {input:"1111%"},
- {input:"11111%"},
- {input:"111111%"},
- {input:"calc(123)"},
- {input:"rgb(119, 255, 255)", q:"#7ff", s:"#7ff", svg:"#7ff"},
- {input:"rgba(119, 255, 255, 001)", q:"#7ff", s:"#7ff", svg:"#7ff"},
- {input:"hsl(100, 100%, 100%)", q:"#fff", s:"#fff", svg:"#fff"},
- {input:"hsla(100, 100%, 100%, 001)", q:"#fff", s:"#fff", svg:"#fff"},
- {input:"rgb(calc(100 + 155), 255, 255)", q:"#fff", s:"#fff", svg:"#fff"},
- {input:"rgba(calc(100 + 155), 255, 255, 001)", q:"#fff", s:"#fff", svg:"#fff"},
- {input:"hsl(calc(050 + 050), 100%, 100%)", q:"#fff", s:"#fff", svg:"#fff"},
- {input:"hsla(calc(050 + 050), 100%, 100%, 001)", q:"#fff", s:"#fff", svg:"#fff"},
- {input:"rgb(/**/255, 255, 255)", q:"#fff", s:"#fff", svg:"#fff"},
- {input:"rgb(/**/255/**/, /**/255/**/, /**/255/**/)", q:"#fff", s:"#fff", svg:"#fff"},
- {input:"rgb(calc(/**/100/**/ + /**/155/**/), 255, 255)", q:"#fff", s:"#fff", svg:"#fff"},
- {input:"#123 123 abc 12a", q:"#123 #000123 #abc #00012a", shorthand:true},
- {input:"rgb(119, 255, 255) 123", q:"#7ff #000123", shorthand:true},
- {input:"123 rgb(119, 255, 255)", q:"#000123 #7ff", shorthand:true},
- {input:"1e1"},
- {input:"11e1"},
- {input:"111e1"},
- {input:"1111e1"},
- {input:"11111e1"},
- {input:"111111e1"},
- {input:"1e+1"},
- {input:"11e+1"},
- {input:"111e+1"},
- {input:"1111e+1"},
- {input:"11111e+1"},
- {input:"111111e+1"},
- {input:"1e-0"},
- {input:"11e-0"},
- {input:"111e-0"},
- {input:"1111e-0"},
- {input:"11111e-0"},
- {input:"111111e-0"},
- {input:"1e1a"},
- {input:"11e1a"},
- {input:"111e1a"},
- {input:"1111e1a"},
- {input:"11111e1a"},
- {input:"111111e1a"},
- {desc:"1111111111...", input:"1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111"},
- {desc:"1111111111...a", input:"1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111a"},
- {desc:"a1111111111...", input:"a1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111"},
- ];
-
- var props = [
- {prop:'background-color', check:'background-color'},
- {prop:'border-color', check:'border-top-color', check_also:['border-right-color', 'border-bottom-color', 'border-left-color']},
- {prop:'border-top-color', check:'border-top-color'},
- {prop:'border-right-color', check:'border-right-color'},
- {prop:'border-bottom-color', check:'border-bottom-color'},
- {prop:'border-left-color', check:'border-left-color'},
- {prop:'color', check:'color'},
- ];
- var style_template = '#test{{prop}:{test};}' +
- '#ref{{prop}:{ref};}';
-
- tests.forEach(function(t) {
- var name = t.desc || t.input;
- var test_q = async_test(name + ' (quirks)');
- var test_a = async_test(name + ' (almost standards)');
- var test_s = async_test(name + ' (standards)');
- var test_svg = async_test(name + ' (SVG)');
- for (var i in props) {
- if (t.shorthand && !(props[i].check_also)) {
- continue;
- }
- test_q.step(function() {
- q.style.textContent = style_template.replace('{test}', t.input)
- .replace('{ref}', t.q).replace(/\{prop\}/g, props[i].prop);
- assert_equals(q.getComputedStyle(q.test).getPropertyValue(props[i].check),
- q.getComputedStyle(q.ref).getPropertyValue(props[i].check),
- props[i].prop);
- if (t.shorthand && props[i].check_also) {
- for (var j in props[i].check_also) {
- assert_equals(q.getComputedStyle(q.test).getPropertyValue(props[i].check_also[j]),
- q.getComputedStyle(q.ref).getPropertyValue(props[i].check_also[j]),
- props[i].prop + ' checking ' + props[i].check_also[j]);
- }
- }
- });
- test_a.step(function() {
- a.style.textContent = style_template.replace('{test}', t.input)
- .replace('{ref}', t.s).replace(/\{prop\}/g, props[i].prop);
- assert_equals(a.getComputedStyle(a.test).getPropertyValue(props[i].check),
- a.getComputedStyle(a.ref).getPropertyValue(props[i].check),
- props[i].prop);
- if (t.shorthand && props[i].check_also) {
- for (var j in props[i].check_also) {
- assert_equals(a.getComputedStyle(q.test).getPropertyValue(props[i].check_also[j]),
- a.getComputedStyle(q.ref).getPropertyValue(props[i].check_also[j]),
- props[i].prop + ' checking ' + props[i].check_also[j]);
- }
- }
- });
- test_s.step(function() {
- s.style.textContent = style_template.replace('{test}', t.input)
- .replace('{ref}', t.s).replace(/\{prop\}/g, props[i].prop);
- assert_equals(s.getComputedStyle(s.test).getPropertyValue(props[i].check),
- s.getComputedStyle(s.ref).getPropertyValue(props[i].check),
- props[i].prop);
- if (t.shorthand && props[i].check_also) {
- for (var j in props[i].check_also) {
- assert_equals(s.getComputedStyle(q.test).getPropertyValue(props[i].check_also[j]),
- s.getComputedStyle(q.ref).getPropertyValue(props[i].check_also[j]),
- props[i].prop + ' checking ' + props[i].check_also[j]);
- }
- }
- });
- test_svg.step(function() {
- q.svg.setAttribute('fill', t.input);
- a.svg.setAttribute('fill', t.input);
- s.svg.setAttribute('fill', t.input);
- if (t.svg) {
- q.svg_ref.setAttribute('fill', t.svg);
- a.svg_ref.setAttribute('fill', t.svg);
- s.svg_ref.setAttribute('fill', t.svg);
- } else {
- q.svg_ref.removeAttribute('fill');
- a.svg_ref.removeAttribute('fill');
- s.svg_ref.removeAttribute('fill');
- }
- assert_equals(q.getComputedStyle(q.svg).fill, q.getComputedStyle(q.svg_ref).fill, 'SVG fill="" in quirks mode');
- assert_equals(a.getComputedStyle(a.svg).fill, a.getComputedStyle(a.svg_ref).fill, 'SVG fill="" in almost standards mode');
- assert_equals(s.getComputedStyle(s.svg).fill, s.getComputedStyle(s.svg_ref).fill, 'SVG fill="" in standards mode');
- });
- }
- test_q.done();
- test_a.done();
- test_s.done();
- test_svg.done();
- });
-
- var other_tests = [
- {input:'background:abc', prop:'background-color'},
- {input:'border-top:1px solid abc', prop:'border-top-color'},
- {input:'border-right:1px solid abc', prop:'border-right-color'},
- {input:'border-bottom:1px solid abc', prop:'border-bottom-color'},
- {input:'border-left:1px solid abc', prop:'border-left-color'},
- {input:'border:1px solid abc', prop:'border-top-color'},
- {input:'outline-color:abc', prop:'outline-color'},
- {input:'outline:1px solid abc', prop:'outline-color'}
- ];
-
- var other_template = "#test{{test};}"
-
- other_tests.forEach(function(t) {
- test(function() {
- q.style.textContent = other_template.replace('{test}', t.input);
- assert_equals(q.getComputedStyle(q.test).getPropertyValue(t.prop),
- q.getComputedStyle(q.ref).getPropertyValue(t.prop),
- 'quirk was supported');
- }, document.title+', excluded property '+t.input);
- });
-
- done();
- }
- </script>
- </body>
-</html>
diff --git a/quirks/hashless-hex-color/limited-quirks.html b/quirks/hashless-hex-color/limited-quirks.html
new file mode 100644
index 0000000..f7dd7ed
--- /dev/null
+++ b/quirks/hashless-hex-color/limited-quirks.html
@@ -0,0 +1,16 @@
+<!doctype html>
+<html>
+ <head>
+ <title>The hashless hex color quirk (limited-quirks)</title>
+ <meta name="timeout" content="long">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <style> iframe { width:20px; height:20px; } </style>
+ </head>
+ <body>
+ <div id=log></div>
+ <iframe class=limited-quirks></iframe>
+ <script src=../support/test-ref-iframe.js></script>
+ <script src=support/common.js></script>
+ </body>
+</html>
diff --git a/quirks/hashless-hex-color/no-quirks.html b/quirks/hashless-hex-color/no-quirks.html
new file mode 100644
index 0000000..2ea5c66
--- /dev/null
+++ b/quirks/hashless-hex-color/no-quirks.html
@@ -0,0 +1,16 @@
+<!doctype html>
+<html>
+ <head>
+ <title>The hashless hex color quirk (no-quirks)</title>
+ <meta name="timeout" content="long">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <style> iframe { width:20px; height:20px; } </style>
+ </head>
+ <body>
+ <div id=log></div>
+ <iframe class=no-quirks></iframe>
+ <script src=../support/test-ref-iframe.js></script>
+ <script src=support/common.js></script>
+ </body>
+</html>
diff --git a/quirks/hashless-hex-color/quirks.html b/quirks/hashless-hex-color/quirks.html
new file mode 100644
index 0000000..bc45da2
--- /dev/null
+++ b/quirks/hashless-hex-color/quirks.html
@@ -0,0 +1,16 @@
+<!doctype html>
+<html>
+ <head>
+ <title>The hashless hex color quirk (quirks)</title>
+ <meta name="timeout" content="long">
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <style> iframe { width:20px; height:20px; } </style>
+ </head>
+ <body>
+ <div id=log></div>
+ <iframe class=quirks></iframe>
+ <script src=../support/test-ref-iframe.js></script>
+ <script src=support/common.js></script>
+ </body>
+</html>
diff --git a/quirks/hashless-hex-color/support/common.js b/quirks/hashless-hex-color/support/common.js
new file mode 100644
index 0000000..eea6180
--- /dev/null
+++ b/quirks/hashless-hex-color/support/common.js
@@ -0,0 +1,423 @@
+setup({explicit_done:true});
+onload = function() {
+ setupIframe();
+
+ var tests = [
+ {input:"123", q:"#000123"},
+ {input:"023", q:"#000023"},
+ {input:"003", q:"#000003"},
+ {input:"000", q:"#000"},
+ {input:"abc", q:"#abc"},
+ {input:"ABC", q:"#abc"},
+ {input:"1ab", q:"#0001ab"},
+ {input:"1AB", q:"#0001ab"},
+ {input:"112233", q:"#123"},
+ {input:"012233", q:"#012233"},
+ {input:"002233", q:"#023"},
+ {input:"000233", q:"#000233"},
+ {input:"000033", q:"#003"},
+ {input:"000003", q:"#000003"},
+ {input:"000000", q:"#000000"},
+ {input:"aabbcc", q:"#abc"},
+ {input:"AABBCC", q:"#abc"},
+ {input:"11aabb", q:"#1ab"},
+ {input:"11AABB", q:"#1ab"},
+ {input:"\\31 23", q:"#123"},
+ {input:"\\61 bc", q:"#abc"},
+ {input:"\\41 BC", q:"#abc"},
+ {input:"\\31 ab", q:"#1ab"},
+ {input:"\\31 AB", q:"#1ab"},
+ {input:"\\31 12233", q:"#123"},
+ {input:"\\61 abbcc", q:"#abc"},
+ {input:"\\41 ABBCC", q:"#abc"},
+ {input:"\\31 1aabb", q:"#1ab"},
+ {input:"\\31 1AABB", q:"#1ab"},
+ {input:"12\\33 ", q:"#000123"},
+ {input:"1", q:"#000001"},
+ {input:"12", q:"#000012"},
+ {input:"1234", q:"#001234"},
+ {input:"12345", q:"#012345"},
+ {input:"1234567"},
+ {input:"12345678"},
+ {input:"a"},
+ {input:"aa"},
+ {input:"aaaa"},
+ {input:"aaaaa"},
+ {input:"aaaaaaa"},
+ {input:"aaaaaaaa"},
+ {input:"A"},
+ {input:"AA"},
+ {input:"AAAA"},
+ {input:"AAAAA"},
+ {input:"AAAAAAA"},
+ {input:"AAAAAAAA"},
+ {input:"1a", q:"#00001a"},
+ {input:"1abc", q:"#001abc"},
+ {input:"1abcd", q:"#01abcd"},
+ {input:"1abcdef"},
+ {input:"1abcdeff"},
+ {input:"+1", q:"#000001"},
+ {input:"+12", q:"#000012"},
+ {input:"+123", q:"#000123"},
+ {input:"+1234", q:"#001234"},
+ {input:"+12345", q:"#012345"},
+ {input:"+123456", q:"#123456"},
+ {input:"+1234567"},
+ {input:"+12345678"},
+ {input:"-1"},
+ {input:"-12"},
+ {input:"-123"},
+ {input:"-1234"},
+ {input:"-12345"},
+ {input:"-123456"},
+ {input:"-1234567"},
+ {input:"-12345678"},
+ {input:"+1a", q:"#00001a"},
+ {input:"+12a", q:"#00012a"},
+ {input:"+123a", q:"#00123a"},
+ {input:"+1234a", q:"#01234a"},
+ {input:"+12345a", q:"#12345a"},
+ {input:"+123456a"},
+ {input:"+1234567a"},
+ {input:"-1a"},
+ {input:"-12a"},
+ {input:"-123a"},
+ {input:"-1234a"},
+ {input:"-12345a"},
+ {input:"-123456a"},
+ {input:"-1234567a"},
+ {input:"-12345678a"},
+ {input:"+1A", q:"#00001a"},
+ {input:"+12A", q:"#00012a"},
+ {input:"+123A", q:"#00123a"},
+ {input:"+1234A", q:"#01234a"},
+ {input:"+12345A", q:"#12345a"},
+ {input:"+123456A"},
+ {input:"+1234567A"},
+ {input:"-1A"},
+ {input:"-12A"},
+ {input:"-123A"},
+ {input:"-1234A"},
+ {input:"-12345A"},
+ {input:"-123456A"},
+ {input:"-1234567A"},
+ {input:"-12345678A"},
+ {input:"+a"},
+ {input:"+aa"},
+ {input:"+aaa"},
+ {input:"+aaaa"},
+ {input:"+aaaaa"},
+ {input:"+aaaaaa"},
+ {input:"+aaaaaaa"},
+ {input:"+aaaaaaaa"},
+ {input:"-a"},
+ {input:"-aa"},
+ {input:"-aaa"},
+ {input:"-aaaa"},
+ {input:"-aaaaa"},
+ {input:"-aaaaaa"},
+ {input:"-aaaaaaa"},
+ {input:"-aaaaaaaa"},
+ {input:"-aaaaaaaaa"},
+ {input:"+A"},
+ {input:"+AA"},
+ {input:"+AAA"},
+ {input:"+AAAA"},
+ {input:"+AAAAA"},
+ {input:"+AAAAAA"},
+ {input:"+AAAAAAA"},
+ {input:"+AAAAAAAA"},
+ {input:"-A"},
+ {input:"-AA"},
+ {input:"-AAA"},
+ {input:"-AAAA"},
+ {input:"-AAAAA"},
+ {input:"-AAAAAA"},
+ {input:"-AAAAAAA"},
+ {input:"-AAAAAAAA"},
+ {input:"-AAAAAAAAA"},
+ {input:"1.1"},
+ {input:"1.11"},
+ {input:"1.111"},
+ {input:"1.1111"},
+ {input:"1.11111"},
+ {input:"1.111111"},
+ {input:"1.1111111"},
+ {input:"+1.1"},
+ {input:"+1.11"},
+ {input:"+1.111"},
+ {input:"+1.1111"},
+ {input:"+1.11111"},
+ {input:"+1.111111"},
+ {input:"+1.1111111"},
+ {input:"-1.1"},
+ {input:"-1.11"},
+ {input:"-1.111"},
+ {input:"-1.1111"},
+ {input:"-1.11111"},
+ {input:"-1.111111"},
+ {input:"-1.1111111"},
+ {input:"1.1a"},
+ {input:"1.11a"},
+ {input:"1.111a"},
+ {input:"1.1111a"},
+ {input:"1.11111a"},
+ {input:"1.111111a"},
+ {input:"+1.1a"},
+ {input:"+1.11a"},
+ {input:"+1.111a"},
+ {input:"+1.1111a"},
+ {input:"+1.11111a"},
+ {input:"+1.111111a"},
+ {input:"-1.1a"},
+ {input:"-1.11a"},
+ {input:"-1.111a"},
+ {input:"-1.1111a"},
+ {input:"-1.11111a"},
+ {input:"-1.111111a"},
+ {input:"1.0"},
+ {input:"11.0"},
+ {input:"111.0"},
+ {input:"1111.0"},
+ {input:"11111.0"},
+ {input:"111111.0"},
+ {input:"1111111.0"},
+ {input:"11111111.0"},
+ {input:"+1.0"},
+ {input:"+11.0"},
+ {input:"+111.0"},
+ {input:"+1111.0"},
+ {input:"+11111.0"},
+ {input:"+111111.0"},
+ {input:"+1111111.0"},
+ {input:"+11111111.0"},
+ {input:"-1.0"},
+ {input:"-11.0"},
+ {input:"-111.0"},
+ {input:"-1111.0"},
+ {input:"-11111.0"},
+ {input:"-111111.0"},
+ {input:"-1111111.0"},
+ {input:"-11111111.0"},
+ {input:"1.0a"},
+ {input:"11.0a"},
+ {input:"111.0a"},
+ {input:"1111.0a"},
+ {input:"11111.0a"},
+ {input:"111111.0a"},
+ {input:"1111111.0a"},
+ {input:"+1.0a"},
+ {input:"+11.0a"},
+ {input:"+111.0a"},
+ {input:"+1111.0a"},
+ {input:"+11111.0a"},
+ {input:"+111111.0a"},
+ {input:"+1111111.0a"},
+ {input:"-1.0a"},
+ {input:"-11.0a"},
+ {input:"-111.0a"},
+ {input:"-1111.0a"},
+ {input:"-11111.0a"},
+ {input:"-111111.0a"},
+ {input:"-1111111.0a"},
+ {input:"+/**/123"},
+ {input:"-/**/123"},
+ {input:"+/**/123456"},
+ {input:"-/**/123456"},
+ {input:"+/**/abc"},
+ {input:"-/**/abc"},
+ {input:"+/**/abcdef"},
+ {input:"-/**/abcdef"},
+ {input:"+/**/12a"},
+ {input:"-/**/12a"},
+ {input:"+/**/12345a"},
+ {input:"-/**/12345a"},
+ {input:"abg"},
+ {input:"aabbcg"},
+ {input:"1ag"},
+ {input:"1122ag"},
+ {input:"ABG"},
+ {input:"AABBCG"},
+ {input:"1AG"},
+ {input:"1122AG"},
+ {input:"@a"},
+ {input:"@ab"},
+ {input:"@abc"},
+ {input:"@abcd"},
+ {input:"@abcde"},
+ {input:"@abcdef"},
+ {input:"@1"},
+ {input:"@11"},
+ {input:"@111"},
+ {input:"@1111"},
+ {input:"@11111"},
+ {input:"@111111"},
+ {input:"@1a"},
+ {input:"@11a"},
+ {input:"@111a"},
+ {input:"@1111a"},
+ {input:"@11111a"},
+ {input:'"a"'},
+ {input:'"ab"'},
+ {input:'"abc"'},
+ {input:'"abcd"'},
+ {input:'"abcde"'},
+ {input:'"abcdef"'},
+ {input:'"1"'},
+ {input:'"11"'},
+ {input:'"111"'},
+ {input:'"1111"'},
+ {input:'"11111"'},
+ {input:'"111111"'},
+ {input:'"1a"'},
+ {input:'"11a"'},
+ {input:'"111a"'},
+ {input:'"1111a"'},
+ {input:'"11111a"'},
+ {input:"url(a)", svg:'url(a)'},
+ {input:"url(aa)", svg:'url(aa)'},
+ {input:"url(aaa)", svg:'url(aaa)'},
+ {input:"url(aaaa)", svg:'url(aaaa)'},
+ {input:"url(aaaaa)", svg:'url(aaaaa)'},
+ {input:"url(aaaaaa)", svg:'url(aaaaaa)'},
+ {input:"url('a')", svg:'url(a)'},
+ {input:"url('aa')", svg:'url(aa)'},
+ {input:"url('aaa')", svg:'url(aaa)'},
+ {input:"url('aaaa')", svg:'url(aaaa)'},
+ {input:"url('aaaaa')", svg:'url(aaaaa)'},
+ {input:"url('aaaaaa')", svg:'url(aaaaaa)'},
+ {input:"#a"},
+ {input:"#aa"},
+ {input:"#aaaaa"},
+ {input:"#aaaaaaa"},
+ {input:"#1"},
+ {input:"#11"},
+ {input:"#11111"},
+ {input:"#1111111"},
+ {input:"#1a"},
+ {input:"#1111a"},
+ {input:"#111111a"},
+ {input:"1%"},
+ {input:"11%"},
+ {input:"111%"},
+ {input:"1111%"},
+ {input:"11111%"},
+ {input:"111111%"},
+ {input:"calc(123)"},
+ {input:"rgb(119, 255, 255)", q:"#7ff", s:"#7ff", svg:"#7ff"},
+ {input:"rgba(119, 255, 255, 001)", q:"#7ff", s:"#7ff", svg:"#7ff"},
+ {input:"hsl(100, 100%, 100%)", q:"#fff", s:"#fff", svg:"#fff"},
+ {input:"hsla(100, 100%, 100%, 001)", q:"#fff", s:"#fff", svg:"#fff"},
+ {input:"rgb(calc(100 + 155), 255, 255)", q:"#fff", s:"#fff", svg:"#fff"},
+ {input:"rgba(calc(100 + 155), 255, 255, 001)", q:"#fff", s:"#fff", svg:"#fff"},
+ {input:"hsl(calc(050 + 050), 100%, 100%)", q:"#fff", s:"#fff", svg:"#fff"},
+ {input:"hsla(calc(050 + 050), 100%, 100%, 001)", q:"#fff", s:"#fff", svg:"#fff"},
+ {input:"rgb(/**/255, 255, 255)", q:"#fff", s:"#fff", svg:"#fff"},
+ {input:"rgb(/**/255/**/, /**/255/**/, /**/255/**/)", q:"#fff", s:"#fff", svg:"#fff"},
+ {input:"rgb(calc(/**/100/**/ + /**/155/**/), 255, 255)", q:"#fff", s:"#fff", svg:"#fff"},
+ {input:"#123 123 abc 12a", q:"#123 #000123 #abc #00012a", shorthand:true},
+ {input:"rgb(119, 255, 255) 123", q:"#7ff #000123", shorthand:true},
+ {input:"123 rgb(119, 255, 255)", q:"#000123 #7ff", shorthand:true},
+ {input:"1e1"},
+ {input:"11e1"},
+ {input:"111e1"},
+ {input:"1111e1"},
+ {input:"11111e1"},
+ {input:"111111e1"},
+ {input:"1e+1"},
+ {input:"11e+1"},
+ {input:"111e+1"},
+ {input:"1111e+1"},
+ {input:"11111e+1"},
+ {input:"111111e+1"},
+ {input:"1e-0"},
+ {input:"11e-0"},
+ {input:"111e-0"},
+ {input:"1111e-0"},
+ {input:"11111e-0"},
+ {input:"111111e-0"},
+ {input:"1e1a"},
+ {input:"11e1a"},
+ {input:"111e1a"},
+ {input:"1111e1a"},
+ {input:"11111e1a"},
+ {input:"111111e1a"},
+ {desc:"1111111111...", input:"1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111"},
+ {desc:"1111111111...a", input:"1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111a"},
+ {desc:"a1111111111...", input:"a1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111"},
+ ];
+
+ var props = [
+ {prop:'background-color', check:'background-color'},
+ {prop:'border-color', check:'border-top-color', check_also:['border-right-color', 'border-bottom-color', 'border-left-color']},
+ {prop:'border-top-color', check:'border-top-color'},
+ {prop:'border-right-color', check:'border-right-color'},
+ {prop:'border-bottom-color', check:'border-bottom-color'},
+ {prop:'border-left-color', check:'border-left-color'},
+ {prop:'color', check:'color'},
+ ];
+ var style_template = '#test{{prop}:{test};}' +
+ '#ref{{prop}:{ref};}';
+
+ tests.forEach(function(t) {
+ var name = t.desc || t.input;
+ var test_html = async_test(name);
+ var test_svg = async_test(name + ' (SVG)');
+ for (var i in props) {
+ if (t.shorthand && !(props[i].check_also)) {
+ continue;
+ }
+ test_html.step(function() {
+ win.style.textContent = style_template.replace('{test}', t.input)
+ .replace('{ref}', quirks ? t.q : t.s).replace(/\{prop\}/g, props[i].prop);
+ assert_equals(win.getComputedStyle(win.test).getPropertyValue(props[i].check),
+ win.getComputedStyle(win.ref).getPropertyValue(props[i].check),
+ props[i].prop);
+ if (t.shorthand && props[i].check_also) {
+ for (var j in props[i].check_also) {
+ assert_equals(win.getComputedStyle(win.test).getPropertyValue(props[i].check_also[j]),
+ win.getComputedStyle(win.ref).getPropertyValue(props[i].check_also[j]),
+ props[i].prop + ' checking ' + props[i].check_also[j]);
+ }
+ }
+ });
+ test_svg.step(function() {
+ win.svg.setAttribute('fill', t.input);
+ if (t.svg) {
+ win.svg_ref.setAttribute('fill', t.svg);
+ } else {
+ win.svg_ref.removeAttribute('fill');
+ }
+ assert_equals(win.getComputedStyle(win.svg).fill, win.getComputedStyle(win.svg_ref).fill, 'SVG fill=""');
+ });
+ }
+ test_html.done();
+ test_svg.done();
+ });
+
+ if (quirks) {
+ var other_tests = [
+ {input:'background:abc', prop:'background-color'},
+ {input:'border-top:1px solid abc', prop:'border-top-color'},
+ {input:'border-right:1px solid abc', prop:'border-right-color'},
+ {input:'border-bottom:1px solid abc', prop:'border-bottom-color'},
+ {input:'border-left:1px solid abc', prop:'border-left-color'},
+ {input:'border:1px solid abc', prop:'border-top-color'},
+ {input:'outline-color:abc', prop:'outline-color'},
+ {input:'outline:1px solid abc', prop:'outline-color'}
+ ];
+
+ var other_template = "#test{{test};}"
+
+ other_tests.forEach(function(t) {
+ test(function() {
+ win.style.textContent = other_template.replace('{test}', t.input);
+ assert_equals(win.getComputedStyle(win.test).getPropertyValue(t.prop),
+ win.getComputedStyle(win.ref).getPropertyValue(t.prop),
+ 'quirk was supported');
+ }, document.title+', excluded property '+t.input);
+ });
+ }
+
+ done();
+}
diff --git a/quirks/support/test-ref-iframe.js b/quirks/support/test-ref-iframe.js
new file mode 100644
index 0000000..e5df41d
--- /dev/null
+++ b/quirks/support/test-ref-iframe.js
@@ -0,0 +1,17 @@
+function setupIframe() {
+ var iframe = document.querySelector('iframe');
+ var html = "<style id=style></style><div id=test></div><div id=ref></div><svg><circle id=svg /><circle id=svg_ref /></svg>";
+ if (iframe.className === "limited-quirks") {
+ html = '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">' + html;
+ } else if (iframe.className === "no-quirks") {
+ html = '<!DOCTYPE HTML>' + html;
+ }
+ window.quirks = iframe.className === "quirks";
+ window.win = iframe.contentWindow;
+ win.document.open();
+ win.document.write(html);
+ win.document.close();
+ ['style', 'test', 'ref', 'svg', 'svg_ref'].forEach(function(id) {
+ win[id] = win.document.getElementById(id);
+ });
+}
diff --git a/quirks/unitless-length.html b/quirks/unitless-length.html
deleted file mode 100644
index 944c91f..0000000
--- a/quirks/unitless-length.html
+++ /dev/null
@@ -1,219 +0,0 @@
-<!doctype html>
-<html>
- <head>
- <title>The unitless length quirk</title>
- <script src="/resources/testharness.js"></script>
- <script src="/resources/testharnessreport.js"></script>
- <style> iframe { width:20px; height:20px; } </style>
- </head>
- <body>
- <div id=log></div>
- <iframe id=quirks></iframe>
- <iframe id=almost></iframe>
- <iframe id=standards></iframe>
- <script>
- setup({explicit_done:true});
- onload = function() {
- var html = "<style id=style></style><div id=test></div><div id=ref></div>";
- var a_doctype = '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">';
- var s_doctype = '<!DOCTYPE HTML>';
- var q = document.getElementById('quirks').contentWindow;
- var a = document.getElementById('almost').contentWindow;
- var s = document.getElementById('standards').contentWindow;
- q.document.open();
- q.document.write(html);
- q.document.close();
- a.document.open();
- a.document.write(a_doctype + html);
- a.document.close();
- s.document.open();
- s.document.write(s_doctype + html);
- s.document.close();
- [q, a, s].forEach(function(win) {
- ['style', 'test', 'ref'].forEach(function(id) {
- win[id] = win.document.getElementById(id);
- });
- });
-
- var tests = [
- {input:"1", q:"1px"},
- {input:"+1", q:"1px"},
- {input:"-1", q:"-1px"},
- {input:"1.5", q:"1.5px"},
- {input:"+1.5", q:"1.5px"},
- {input:"-1.5", q:"-1.5px"},
- {input:"\\31 "},
- {input:"+\\31 "},
- {input:"-\\31 "},
- {input:"\\31 .5"},
- {input:"+\\31 .5"},
- {input:"-\\31 .5"},
- {input:"1\\31 "},
- {input:"+1\\31 "},
- {input:"-1\\31 "},
- {input:"1\\31 .5"},
- {input:"+1\\31 .5"},
- {input:"-1\\31 .5"},
- {input:"a"},
- {input:"A"},
- {input:"1a"},
- {input:"+1a"},
- {input:"-1a"},
- {input:"+1A"},
- {input:"-1A"},
- {input:"+a"},
- {input:"-a"},
- {input:"+A"},
- {input:"-A"},
- {input:"@a"},
- {input:"@1"},
- {input:"@1a"},
- {input:'"a"'},
- {input:'"1"'},
- {input:'"1a"'},
- {input:"url(1)"},
- {input:"url('1')"},
- {input:"#1"},
- {input:"#01"},
- {input:"#001"},
- {input:"#0001"},
- {input:"#00001"},
- {input:"#000001"},
- {input:"+/**/1"},
- {input:"-/**/1"},
- {input:"calc(1)"},
- {input:"calc(2 * 2px)", q:"4px", s:"4px"},
- {input:"1px 2", q:"1px 2px", shorthand:true},
- {input:"1 2px", q:"1px 2px", shorthand:true},
- {input:"1px calc(2)", shorthand:true},
- {input:"calc(1) 2px", shorthand:true},
- {input:"1 +2", q:"1px 2px", shorthand:true},
- {input:"1 -2", q:"1px -2px", shorthand:true},
- ];
-
- var props = [
- {prop:'background-position', check:'background-position', check_also:[]},
- {prop:'border-spacing', check:'border-spacing', check_also:[]},
- {prop:'border-top-width', check:'border-top-width'},
- {prop:'border-right-width', check:'border-right-width'},
- {prop:'border-bottom-width', check:'border-bottom-width'},
- {prop:'border-left-width', check:'border-left-width'},
- {prop:'border-width', check:'border-top-width', check_also:['border-right-width', 'border-bottom-width', 'border-left-width']},
- {prop:'bottom', check:'bottom'},
- {prop:'clip', check:'clip'},
- {prop:'font-size', check:'font-size'},
- {prop:'height', check:'height'},
- {prop:'left', check:'left'},
- {prop:'letter-spacing', check:'letter-spacing'},
- {prop:'margin-right', check:'margin-right'},
- {prop:'margin-left', check:'margin-left'},
- {prop:'margin-top', check:'margin-top'},
- {prop:'margin-bottom', check:'margin-bottom'},
- {prop:'margin', check:'margin-top', check_also:['margin-right', 'margin-bottom', 'margin-left']},
- {prop:'max-height', check:'max-height'},
- {prop:'max-width', check:'max-width'},
- {prop:'min-height', check:'min-height'},
- {prop:'min-width', check:'min-width'},
- {prop:'padding-top', check:'padding-top'},
- {prop:'padding-right', check:'padding-right'},
- {prop:'padding-bottom', check:'padding-bottom'},
- {prop:'padding-left', check:'padding-left'},
- {prop:'padding', check:'padding-top', check_also:['padding-right', 'padding-bottom', 'padding-left']},
- {prop:'right', check:'right'},
- {prop:'text-indent', check:'text-indent'},
- {prop:'top', check:'top'},
- {prop:'vertical-align', check:'vertical-align'},
- {prop:'width', check:'width'},
- {prop:'word-spacing', check:'word-spacing'},
- ];
- var style_template = '#test{border-style:solid;position:relative;{prop}:{test};}' +
- '#ref{border-style:solid;position:relative;{prop}:{ref};}';
-
- tests.forEach(function(t) {
- for (var i in props) {
- if (t.shorthand && !(props[i].check_also)) {
- continue;
- }
- test(function() {
- q.style.textContent = style_template.replace('{test}', t.input)
- .replace('{ref}', t.q).replace(/\{prop\}/g, props[i].prop)
- .replace(/clip:[^;]+/g, function(match) {
- return 'clip:rect(auto, auto, auto, ' + match.substr(5) + ')';
- });
- assert_equals(q.getComputedStyle(q.test).getPropertyValue(props[i].check),
- q.getComputedStyle(q.ref).getPropertyValue(props[i].check),
- props[i].prop);
- if (t.shorthand && props[i].check_also) {
- for (var j in props[i].check_also) {
- assert_equals(q.getComputedStyle(q.test).getPropertyValue(props[i].check_also[j]),
- q.getComputedStyle(q.ref).getPropertyValue(props[i].check_also[j]),
- props[i].prop + ', checking ' + props[i].check_also[j]);
- }
- }
- }, props[i].prop + ": " + t.input + ' (quirks)');
- test(function() {
- a.style.textContent = style_template.replace('{test}', t.input)
- .replace('{ref}', t.s).replace(/\{prop\}/g, props[i].prop)
- .replace(/clip:[^;]+/g, function(match) {
- return 'clip:rect(auto, auto, auto, ' + match.substr(5) + ')';
- });
- assert_equals(a.getComputedStyle(a.test).getPropertyValue(props[i].check),
- a.getComputedStyle(a.ref).getPropertyValue(props[i].check),
- props[i].prop + ' in almost standards mode');
- if (t.shorthand && props[i].check_also) {
- for (var j in props[i].check_also) {
- assert_equals(a.getComputedStyle(a.test).getPropertyValue(props[i].check_also[j]),
- a.getComputedStyle(a.ref).getPropertyValue(props[i].check_also[j]),
- props[i].prop + ', checking ' + props[i].check_also[j]);
- }
- }
- }, props[i].prop + ": " + t.input + ' (almost standards)');
- test(function() {
- s.style.textContent = style_template.replace('{test}', t.input)
- .replace('{ref}', t.s).replace(/\{prop\}/g, props[i].prop)
- .replace(/clip:[^;]+/g, function(match) {
- return 'clip:rect(auto, auto, auto, ' + match.substr(5) + ')';
- });
- assert_equals(s.getComputedStyle(s.test).getPropertyValue(props[i].check),
- s.getComputedStyle(s.ref).getPropertyValue(props[i].check),
- props[i].prop + ' in standards mode');
- if (t.shorthand && props[i].check_also) {
- for (var j in props[i].check_also) {
- assert_equals(s.getComputedStyle(s.test).getPropertyValue(props[i].check_also[j]),
- s.getComputedStyle(s.ref).getPropertyValue(props[i].check_also[j]),
- props[i].prop + ', checking ' + props[i].check_also[j]);
- }
- }
- }, props[i].prop + ": " + t.input + ' (standards)');
- }
- });
-
- var other_tests = [
- {input:'background:1 1', prop:'background-position'},
- {input:'border-top:red solid 1', prop:'border-top-width'},
- {input:'border-right:red solid 1', prop:'border-right-width'},
- {input:'border-bottom:red solid 1', prop:'border-bottom-width'},
- {input:'border-left:red solid 1', prop:'border-left-width'},
- {input:'border:red solid 1', prop:'border-top-width'},
- {input:'font:normal normal normal 40 sans-serif', prop:'font-size'},
- {input:'outline:red solid 1', prop:'outline-width'},
- {input:'outline-width:1', prop:'outline-width'},
- ];
-
- var other_template = "#test{position:relative;outline-style:solid;{test}}" +
- "#ref{outline-style:solid}";
-
- other_tests.forEach(function(t) {
- test(function() {
- q.style.textContent = other_template.replace('{test}', t.input);
- assert_equals(q.getComputedStyle(q.test).getPropertyValue(t.prop),
- q.getComputedStyle(q.ref).getPropertyValue(t.prop),
- 'quirk was supported');
- }, 'Excluded property '+t.input);
- });
-
- done();
- }
- </script>
- </body>
-</html>
diff --git a/quirks/unitless-length/limited-quirks.html b/quirks/unitless-length/limited-quirks.html
new file mode 100644
index 0000000..fab0b3b
--- /dev/null
+++ b/quirks/unitless-length/limited-quirks.html
@@ -0,0 +1,15 @@
+<!doctype html>
+<html>
+ <head>
+ <title>The unitless length quirk (limited-quirks)</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <style> iframe { width:20px; height:20px; } </style>
+ </head>
+ <body>
+ <div id=log></div>
+ <iframe class=limited-quirks></iframe>
+ <script src=../support/test-ref-iframe.js></script>
+ <script src=support/common.js></script>
+ </body>
+</html>
diff --git a/quirks/unitless-length/no-quirks.html b/quirks/unitless-length/no-quirks.html
new file mode 100644
index 0000000..cd19202
--- /dev/null
+++ b/quirks/unitless-length/no-quirks.html
@@ -0,0 +1,15 @@
+<!doctype html>
+<html>
+ <head>
+ <title>The unitless length quirk (no-quirks)</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <style> iframe { width:20px; height:20px; } </style>
+ </head>
+ <body>
+ <div id=log></div>
+ <iframe class=no-quirks></iframe>
+ <script src=../support/test-ref-iframe.js></script>
+ <script src=support/common.js></script>
+ </body>
+</html>
diff --git a/quirks/unitless-length/quirks.html b/quirks/unitless-length/quirks.html
new file mode 100644
index 0000000..80bda7a
--- /dev/null
+++ b/quirks/unitless-length/quirks.html
@@ -0,0 +1,15 @@
+<!doctype html>
+<html>
+ <head>
+ <title>The unitless length quirk (quirks)</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <style> iframe { width:20px; height:20px; } </style>
+ </head>
+ <body>
+ <div id=log></div>
+ <iframe class=quirks></iframe>
+ <script src=../support/test-ref-iframe.js></script>
+ <script src=support/common.js></script>
+ </body>
+</html>
diff --git a/quirks/unitless-length/support/common.js b/quirks/unitless-length/support/common.js
new file mode 100644
index 0000000..f2f7eab
--- /dev/null
+++ b/quirks/unitless-length/support/common.js
@@ -0,0 +1,152 @@
+setup({explicit_done:true});
+onload = function() {
+ setupIframe();
+
+ var tests = [
+ {input:"1", q:"1px"},
+ {input:"+1", q:"1px"},
+ {input:"-1", q:"-1px"},
+ {input:"1.5", q:"1.5px"},
+ {input:"+1.5", q:"1.5px"},
+ {input:"-1.5", q:"-1.5px"},
+ {input:"\\31 "},
+ {input:"+\\31 "},
+ {input:"-\\31 "},
+ {input:"\\31 .5"},
+ {input:"+\\31 .5"},
+ {input:"-\\31 .5"},
+ {input:"1\\31 "},
+ {input:"+1\\31 "},
+ {input:"-1\\31 "},
+ {input:"1\\31 .5"},
+ {input:"+1\\31 .5"},
+ {input:"-1\\31 .5"},
+ {input:"a"},
+ {input:"A"},
+ {input:"1a"},
+ {input:"+1a"},
+ {input:"-1a"},
+ {input:"+1A"},
+ {input:"-1A"},
+ {input:"+a"},
+ {input:"-a"},
+ {input:"+A"},
+ {input:"-A"},
+ {input:"@a"},
+ {input:"@1"},
+ {input:"@1a"},
+ {input:'"a"'},
+ {input:'"1"'},
+ {input:'"1a"'},
+ {input:"url(1)"},
+ {input:"url('1')"},
+ {input:"#1"},
+ {input:"#01"},
+ {input:"#001"},
+ {input:"#0001"},
+ {input:"#00001"},
+ {input:"#000001"},
+ {input:"+/**/1"},
+ {input:"-/**/1"},
+ {input:"calc(1)"},
+ {input:"calc(2 * 2px)", q:"4px", s:"4px"},
+ {input:"1px 2", q:"1px 2px", shorthand:true},
+ {input:"1 2px", q:"1px 2px", shorthand:true},
+ {input:"1px calc(2)", shorthand:true},
+ {input:"calc(1) 2px", shorthand:true},
+ {input:"1 +2", q:"1px 2px", shorthand:true},
+ {input:"1 -2", q:"1px -2px", shorthand:true},
+ ];
+
+ var props = [
+ {prop:'background-position', check:'background-position', check_also:[]},
+ {prop:'border-spacing', check:'border-spacing', check_also:[]},
+ {prop:'border-top-width', check:'border-top-width'},
+ {prop:'border-right-width', check:'border-right-width'},
+ {prop:'border-bottom-width', check:'border-bottom-width'},
+ {prop:'border-left-width', check:'border-left-width'},
+ {prop:'border-width', check:'border-top-width', check_also:['border-right-width', 'border-bottom-width', 'border-left-width']},
+ {prop:'bottom', check:'bottom'},
+ {prop:'clip', check:'clip'},
+ {prop:'font-size', check:'font-size'},
+ {prop:'height', check:'height'},
+ {prop:'left', check:'left'},
+ {prop:'letter-spacing', check:'letter-spacing'},
+ {prop:'margin-right', check:'margin-right'},
+ {prop:'margin-left', check:'margin-left'},
+ {prop:'margin-top', check:'margin-top'},
+ {prop:'margin-bottom', check:'margin-bottom'},
+ {prop:'margin', check:'margin-top', check_also:['margin-right', 'margin-bottom', 'margin-left']},
+ {prop:'max-height', check:'max-height'},
+ {prop:'max-width', check:'max-width'},
+ {prop:'min-height', check:'min-height'},
+ {prop:'min-width', check:'min-width'},
+ {prop:'padding-top', check:'padding-top'},
+ {prop:'padding-right', check:'padding-right'},
+ {prop:'padding-bottom', check:'padding-bottom'},
+ {prop:'padding-left', check:'padding-left'},
+ {prop:'padding', check:'padding-top', check_also:['padding-right', 'padding-bottom', 'padding-left']},
+ {prop:'right', check:'right'},
+ {prop:'text-indent', check:'text-indent'},
+ {prop:'top', check:'top'},
+ {prop:'vertical-align', check:'vertical-align'},
+ {prop:'width', check:'width'},
+ {prop:'word-spacing', check:'word-spacing'},
+ ];
+ var style_template = '#test{border-style:solid;position:relative;{prop}:{test};}' +
+ '#ref{border-style:solid;position:relative;{prop}:{ref};}';
+
+ tests.forEach(function(t) {
+ for (var i in props) {
+ if (t.shorthand && !(props[i].check_also)) {
+ continue;
+ }
+ test(function() {
+ win.style.textContent = style_template.replace('{test}', t.input)
+ .replace('{ref}', quirks ? t.q : t.s).replace(/\{prop\}/g, props[i].prop)
+ .replace(/clip:[^;]+/g, function(match) {
+ return 'clip:rect(auto, auto, auto, ' + match.substr(5) + ')';
+ });
+ assert_equals(win.getComputedStyle(win.test).getPropertyValue(props[i].check),
+ win.getComputedStyle(win.ref).getPropertyValue(props[i].check),
+ props[i].prop);
+ if (t.shorthand && props[i].check_also) {
+ for (var j in props[i].check_also) {
+ assert_equals(win.getComputedStyle(win.test).getPropertyValue(props[i].check_also[j]),
+ win.getComputedStyle(win.ref).getPropertyValue(props[i].check_also[j]),
+ props[i].prop + ', checking ' + props[i].check_also[j]);
+ }
+ }
+ }, props[i].prop + ": " + t.input);
+
+ }
+ });
+
+ if (quirks) {
+ var other_tests = [
+ {input:'background:1 1', prop:'background-position'},
+ {input:'border-top:red solid 1', prop:'border-top-width'},
+ {input:'border-right:red solid 1', prop:'border-right-width'},
+ {input:'border-bottom:red solid 1', prop:'border-bottom-width'},
+ {input:'border-left:red solid 1', prop:'border-left-width'},
+ {input:'border:red solid 1', prop:'border-top-width'},
+ {input:'font:normal normal normal 40 sans-serif', prop:'font-size'},
+ {input:'outline:red solid 1', prop:'outline-width'},
+ {input:'outline-width:1', prop:'outline-width'},
+ ];
+
+ var other_template = "#test{position:relative;outline-style:solid;{test}}" +
+ "#ref{outline-style:solid}";
+
+ other_tests.forEach(function(t) {
+ test(function() {
+ win.style.textContent = other_template.replace('{test}', t.input);
+ assert_equals(win.getComputedStyle(win.test).getPropertyValue(t.prop),
+ win.getComputedStyle(win.ref).getPropertyValue(t.prop),
+ 'quirk was supported');
+ }, 'Excluded property '+t.input);
+ });
+ }
+
+ done();
+}
