Bug 1119475 - tests pt 2 - More reftests for logical properties in UA stylesheets (form controls). r=heycam
authorJonathan Kew <jkew@mozilla.com>
Mon, 16 Feb 2015 11:59:31 +0000
changeset 256462 cb88a2c2b9503feabbbd3345dff70ab0fafdab0f
parent 256461 193adf744f28c73309116843c86e975421c3ec47
child 256463 44476ddac532a98ab55f15e2e0cea84434dc090c
push id4610
push userjlund@mozilla.com
push dateMon, 30 Mar 2015 18:32:55 +0000
treeherdermozilla-beta@4df54044d9ef [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersheycam
bugs1119475
milestone38.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1119475 - tests pt 2 - More reftests for logical properties in UA stylesheets (form controls). r=heycam
layout/reftests/writing-mode/reftest.list
layout/reftests/writing-mode/ua-style-sheet-button-1.html
layout/reftests/writing-mode/ua-style-sheet-button-1a-ref.html
layout/reftests/writing-mode/ua-style-sheet-checkbox-radio-1-ref.html
layout/reftests/writing-mode/ua-style-sheet-checkbox-radio-1.html
layout/reftests/writing-mode/ua-style-sheet-fieldset-1-ref.html
layout/reftests/writing-mode/ua-style-sheet-fieldset-1.html
layout/reftests/writing-mode/ua-style-sheet-input-color-1-ref.html
layout/reftests/writing-mode/ua-style-sheet-input-color-1.html
layout/reftests/writing-mode/ua-style-sheet-input-number-1-ref.html
layout/reftests/writing-mode/ua-style-sheet-input-number-1.html
layout/reftests/writing-mode/ua-style-sheet-textarea-1.html
layout/reftests/writing-mode/ua-style-sheet-textarea-1a-ref.html
--- a/layout/reftests/writing-mode/reftest.list
+++ b/layout/reftests/writing-mode/reftest.list
@@ -56,16 +56,25 @@ fuzzy(116,64) HTTP(..) == 1115916-1-vert
 == ua-style-sheet-border-1.html ua-style-sheet-border-1-ref.html
 == ua-style-sheet-border-2.html ua-style-sheet-border-2-ref.html
 == ua-style-sheet-border-3.html ua-style-sheet-border-3-ref.html
 == ua-style-sheet-border-4.html ua-style-sheet-border-4-ref.html
 == ua-style-sheet-border-5.html ua-style-sheet-border-5-ref.html
 == ua-style-sheet-border-6.html ua-style-sheet-border-6-ref.html
 == ua-style-sheet-size-1.html ua-style-sheet-size-1-ref.html
 == ua-style-sheet-size-2.html ua-style-sheet-size-2-ref.html
+
+== ua-style-sheet-fieldset-1.html ua-style-sheet-fieldset-1-ref.html
+skip-if(Android||B2G) == ua-style-sheet-textarea-1.html ua-style-sheet-textarea-1a-ref.html
+skip-if(!(Android||B2G)) == ua-style-sheet-textarea-1.html ua-style-sheet-textarea-1b-ref.html
+== ua-style-sheet-checkbox-radio-1.html ua-style-sheet-checkbox-radio-1-ref.html
+skip-if(Android||B2G) == ua-style-sheet-button-1.html ua-style-sheet-button-1a-ref.html
+skip-if(!(Android||B2G)) == ua-style-sheet-button-1.html ua-style-sheet-button-1b-ref.html
+== ua-style-sheet-input-color-1.html ua-style-sheet-input-color-1-ref.html
+fails == ua-style-sheet-input-number-1.html ua-style-sheet-input-number-1-ref.html # bug 1123299
 HTTP(..) == 1127488-align-default-horizontal-tb-ltr.html 1127488-align-top-left-ref.html
 HTTP(..) == 1127488-align-start-horizontal-tb-ltr.html 1127488-align-top-left-ref.html
 HTTP(..) == 1127488-align-end-horizontal-tb-ltr.html 1127488-align-top-right-ref.html
 HTTP(..) == 1127488-align-left-horizontal-tb-ltr.html 1127488-align-top-left-ref.html
 HTTP(..) == 1127488-align-right-horizontal-tb-ltr.html 1127488-align-top-right-ref.html
 HTTP(..) == 1127488-align-default-horizontal-tb-rtl.html 1127488-align-top-right-ref.html
 HTTP(..) == 1127488-align-start-horizontal-tb-rtl.html 1127488-align-top-right-ref.html
 HTTP(..) == 1127488-align-end-horizontal-tb-rtl.html 1127488-align-top-left-ref.html
new file mode 100644
--- /dev/null
+++ b/layout/reftests/writing-mode/ua-style-sheet-button-1.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<meta charset=utf-8>
+<title>Test for logical properties of button in the UA stylesheet</title>
+<style>
+.v-rl { writing-mode: vertical-rl; }
+.ltr, .rtl, .v-rl { border: 1px solid blue; }
+.a { -moz-appearance: none; }
+</style>
+<div class=ltr>
+  <button>one</button><br>
+  <button class=a>two</button><br>
+  <button disabled>three</button><br>
+  <button class=a disabled>four</button><br>
+  <input type="button" value="five"><br>
+  <input type="button" value="six" class=a><br>
+  <input type="button" value="seven" disabled><br>
+  <input type="button" value="eight" class=a disabled><br>
+</div>
+
+<div class=rtl dir=rtl>
+  <button>one</button><br>
+  <button class=a>two</button><br>
+  <button disabled>three</button><br>
+  <button class=a disabled>four</button><br>
+  <input type="button" value="five"><br>
+  <input type="button" value="six" class=a><br>
+  <input type="button" value="seven" disabled><br>
+  <input type="button" value="eight" class=a disabled><br>
+</div>
+
+<div class=v-rl>
+  <button>one</button><br>
+  <button class=a>two</button><br>
+  <button disabled>three</button><br>
+  <button class=a disabled>four</button><br>
+  <input type="button" value="five"><br>
+  <input type="button" value="six" class=a><br>
+  <input type="button" value="seven" disabled><br>
+  <input type="button" value="eight" class=a disabled><br>
+</div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/writing-mode/ua-style-sheet-button-1a-ref.html
@@ -0,0 +1,52 @@
+<!DOCTYPE html>
+<meta charset=utf-8>
+<title>Test for logical properties of button in the UA stylesheet</title>
+<style>
+.v-rl { writing-mode: vertical-rl; }
+.ltr, .rtl, .v-rl { border: 1px solid blue; }
+.a { -moz-appearance: none; }
+
+.ltr button,
+.rtl button,
+.ltr input[type="button"],
+.rtl input[type="button"] {
+  padding: 0px 6px;
+}
+
+.v-rl button,
+.v-rl input[type="button"] {
+  padding: 6px 0px;
+}
+</style>
+<div class=ltr>
+  <button>one</button><br>
+  <button class=a>two</button><br>
+  <button disabled>three</button><br>
+  <button class=a disabled>four</button><br>
+  <input type="button" value="five"><br>
+  <input type="button" value="six" class=a><br>
+  <input type="button" value="seven" disabled><br>
+  <input type="button" value="eight" class=a disabled><br>
+</div>
+
+<div class=rtl dir=rtl>
+  <button>one</button><br>
+  <button class=a>two</button><br>
+  <button disabled>three</button><br>
+  <button class=a disabled>four</button><br>
+  <input type="button" value="five"><br>
+  <input type="button" value="six" class=a><br>
+  <input type="button" value="seven" disabled><br>
+  <input type="button" value="eight" class=a disabled><br>
+</div>
+
+<div class=v-rl>
+  <button>one</button><br>
+  <button class=a>two</button><br>
+  <button disabled>three</button><br>
+  <button class=a disabled>four</button><br>
+  <input type="button" value="five"><br>
+  <input type="button" value="six" class=a><br>
+  <input type="button" value="seven" disabled><br>
+  <input type="button" value="eight" class=a disabled><br>
+</div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/writing-mode/ua-style-sheet-checkbox-radio-1-ref.html
@@ -0,0 +1,54 @@
+<!DOCTYPE html>
+<meta charset=utf-8>
+<title>Test for logical properties of checkbox and radio button in the UA stylesheet</title>
+<style>
+.v-rl { writing-mode: vertical-rl; }
+.ltr, .rtl, .v-rl { border: 1px solid blue; }
+
+input[type="radio"],
+input[type="checkbox"] {
+  width: 13px;
+  height: 13px;
+}
+
+.ltr input[type="radio"] {
+  margin: 3px 3px 0px 5px;
+}
+.rtl input[type="radio"] {
+  margin: 3px 5px 0px 3px;
+}
+.v-rl input[type="radio"] {
+  margin: 5px 3px 3px 0px;
+}
+
+.ltr input[type="checkbox"] {
+  margin: 3px 3px 3px 4px;
+}
+.rtl input[type="checkbox"] {
+  margin: 3px 4px 3px 3px;
+}
+.v-rl input[type="checkbox"] {
+  margin: 4px 3px 3px 3px;
+}
+
+</style>
+<div class=ltr>
+  <input type=radio checked>radio 1</input><br>
+  <input type=radio>radio 2</input><br>
+  <input type=checkbox checked>checkbox 1</input><br>
+  <input type=checkbox>checkbox 2</input><br>
+</div>
+
+<div class=rtl dir=rtl>
+  <input type=radio checked>radio 1</input><br>
+  <input type=radio>radio 2</input><br>
+  <input type=checkbox checked>checkbox 1</input><br>
+  <input type=checkbox>checkbox 2</input><br>
+</div>
+
+<div class=v-rl>
+  <input type=radio checked>radio 1</input><br>
+  <input type=radio>radio 2</input><br>
+  <input type=checkbox checked>checkbox 1</input><br>
+  <input type=checkbox>checkbox 2</input><br>
+</div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/writing-mode/ua-style-sheet-checkbox-radio-1.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<meta charset=utf-8>
+<title>Test for logical properties of checkbox and radio button in the UA stylesheet</title>
+<style>
+.v-rl { writing-mode: vertical-rl; }
+.ltr, .rtl, .v-rl { border: 1px solid blue; }
+</style>
+<div class=ltr>
+  <input type=radio checked>radio 1</input><br>
+  <input type=radio>radio 2</input><br>
+  <input type=checkbox checked>checkbox 1</input><br>
+  <input type=checkbox>checkbox 2</input><br>
+</div>
+
+<div class=rtl dir=rtl>
+  <input type=radio checked>radio 1</input><br>
+  <input type=radio>radio 2</input><br>
+  <input type=checkbox checked>checkbox 1</input><br>
+  <input type=checkbox>checkbox 2</input><br>
+</div>
+
+<div class=v-rl>
+  <input type=radio checked>radio 1</input><br>
+  <input type=radio>radio 2</input><br>
+  <input type=checkbox checked>checkbox 1</input><br>
+  <input type=checkbox>checkbox 2</input><br>
+</div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/writing-mode/ua-style-sheet-fieldset-1-ref.html
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<meta charset=utf-8>
+<title>Test for logical properties of fieldset in the UA stylesheet</title>
+<style>
+.v-rl { writing-mode: vertical-rl; }
+.ltr, .rtl, .v-rl { border: 1px solid blue; }
+
+fieldset { height: 100px; width: 100px; }
+
+.ltr .a, .rtl .a { height: 40%; background: #eee; }
+.ltr .b, .rtl .b { height: 60%; background: #ddd; }
+.v-rl .a { width: 40%; background: #eee; }
+.v-rl .b { width: 60%; background: #ddd; }
+
+.ltr fieldset, .rtl fieldset { margin: 0 2px; padding: 0.35em 0.625em 0.75em; }
+.v-rl fieldset { margin: 2px 0; padding: 0.625em 0.35em 0.625em 0.75em; }
+
+.ltr legend, .rtl legend { padding: 0 2px; }
+.v-rl legend { padding: 2px 0; }
+</style>
+<div class=ltr>
+  <fieldset>
+    <legend>Legend</legend>
+    <div class=a></div>
+    <div class=b></div>
+  </fieldset>
+</div>
+
+<div class=rtl dir=rtl>
+  <fieldset>
+    <legend>Legend</legend>
+    <div class=a></div>
+    <div class=b></div>
+  </fieldset>
+</div>
+
+<div class=v-rl>
+  <fieldset>
+    <legend>Legend</legend>
+    <div class=a></div>
+    <div class=b></div>
+  </fieldset>
+</div>
+
new file mode 100644
--- /dev/null
+++ b/layout/reftests/writing-mode/ua-style-sheet-fieldset-1.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<meta charset=utf-8>
+<title>Test for logical properties of fieldset in the UA stylesheet</title>
+<style>
+.v-rl { writing-mode: vertical-rl; }
+.ltr, .rtl, .v-rl { border: 1px solid blue; }
+
+fieldset { height: 100px; width: 100px; }
+
+.a { block-size: 40%; background: #eee; }
+.b { block-size: 60%; background: #ddd; }
+</style>
+<div class=ltr>
+  <fieldset>
+    <legend>Legend</legend>
+    <div class=a></div>
+    <div class=b></div>
+  </fieldset>
+</div>
+
+<div class=rtl dir=rtl>
+  <fieldset>
+    <legend>Legend</legend>
+    <div class=a></div>
+    <div class=b></div>
+  </fieldset>
+</div>
+
+<div class=v-rl>
+  <fieldset>
+    <legend>Legend</legend>
+    <div class=a></div>
+    <div class=b></div>
+  </fieldset>
+</div>
+
new file mode 100644
--- /dev/null
+++ b/layout/reftests/writing-mode/ua-style-sheet-input-color-1-ref.html
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<meta charset=utf-8>
+<title>Test for logical properties of input type=color in the UA stylesheet</title>
+<style>
+.v-rl { writing-mode: vertical-rl; }
+.ltr, .rtl, .v-rl { border: 1px solid blue; }
+.a { -moz-appearance: none; }
+
+.ltr input[type="color"]:-moz-system-metric(color-picker-available),
+.rtl input[type="color"]:-moz-system-metric(color-picker-available) {
+  width: 64px;
+  height: 23px;
+  padding: 0px 6px;
+}
+
+.v-rl input[type="color"]:-moz-system-metric(color-picker-available) {
+  height: 64px;
+  width: 23px;
+  padding: 6px 0px;
+}
+</style>
+<div class=ltr>
+  <input type=color><br>
+  <input type=color class=a><br>
+</div>
+
+<div class=rtl dir=rtl>
+  <input type=color><br>
+  <input type=color class=a><br>
+</div>
+
+<div class=v-rl>
+  <input type=color><br>
+  <input type=color class=a><br>
+</div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/writing-mode/ua-style-sheet-input-color-1.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<meta charset=utf-8>
+<title>Test for logical properties of input type=color in the UA stylesheet</title>
+<style>
+.v-rl { writing-mode: vertical-rl; }
+.ltr, .rtl, .v-rl { border: 1px solid blue; }
+.a { -moz-appearance: none; }
+</style>
+<div class=ltr>
+  <input type=color><br>
+  <input type=color class=a><br>
+</div>
+
+<div class=rtl dir=rtl>
+  <input type=color><br>
+  <input type=color class=a><br>
+</div>
+
+<div class=v-rl>
+  <input type=color><br>
+  <input type=color class=a><br>
+</div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/writing-mode/ua-style-sheet-input-number-1-ref.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<meta charset=utf-8>
+<title>Test for logical properties of input type=number in the UA stylesheet</title>
+<style>
+.v-rl { writing-mode: vertical-rl; }
+.ltr, .rtl, .v-rl { border: 1px solid blue; }
+div { padding: 10px; }
+.a { -moz-appearance:textfield; }
+.b { -moz-appearance:none; }
+
+.ltr input[type="number"],
+.rtl input[type="number"] {
+  width: 20ch;
+}
+
+.v-rl input[type="number"] {
+  height: 20ch;
+}
+
+</style>
+<div class=ltr>
+  <input type=number value=123><br><br>
+  <input type=number value=456 class=a><br><br>
+  <input type=number value=7890 class=b>
+</div>
+
+<div class=rtl dir=rtl>
+  <input type=number value=123><br><br>
+  <input type=number value=456 class=a><br><br>
+  <input type=number value=7890 class=b>
+</div>
+
+<!-- this will fail until bug 1123299 is fixed -->
+<div class=v-rl>
+  <input type=number value=123><br><br>
+  <input type=number value=456 class=a><br><br>
+  <input type=number value=7890 class=b>
+</div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/writing-mode/ua-style-sheet-input-number-1.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<meta charset=utf-8>
+<title>Test for logical properties of input type=number in the UA stylesheet</title>
+<style>
+.v-rl { writing-mode: vertical-rl; }
+.ltr, .rtl, .v-rl { border: 1px solid blue; }
+div { padding: 10px; }
+.a { -moz-appearance:textfield; }
+.b { -moz-appearance:none; }
+</style>
+<div class=ltr>
+  <input type=number value=123><br><br>
+  <input type=number value=456 class=a><br><br>
+  <input type=number value=7890 class=b>
+</div>
+
+<div class=rtl dir=rtl>
+  <input type=number value=123><br><br>
+  <input type=number value=456 class=a><br><br>
+  <input type=number value=7890 class=b>
+</div>
+
+<!-- this will fail until bug 1123299 is fixed -->
+<div class=v-rl>
+  <input type=number value=123><br><br>
+  <input type=number value=456 class=a><br><br>
+  <input type=number value=7890 class=b>
+</div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/writing-mode/ua-style-sheet-textarea-1.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<meta charset=utf-8>
+<title>Test for logical properties of textarea in the UA stylesheet</title>
+<style>
+.v-rl { writing-mode: vertical-rl; }
+.ltr, .rtl, .v-rl { border: 1px solid blue; }
+</style>
+<div class=ltr>
+  <textarea>hello</textarea>
+</div>
+
+<div class=rtl dir=rtl>
+  <textarea>hello</textarea>
+</div>
+
+<div class=v-rl>
+  <textarea>hello</textarea>
+</div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/writing-mode/ua-style-sheet-textarea-1a-ref.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<meta charset=utf-8>
+<title>Test for logical properties of textarea in the UA stylesheet</title>
+<style>
+.v-rl { writing-mode: vertical-rl; }
+.ltr, .rtl, .v-rl { border: 1px solid blue; }
+
+.ltr textarea, .rtl textarea {
+  margin: 1px 0;
+  padding: 0 1px;
+}
+.v-rl textarea {
+  margin: 0 1px;
+  padding: 1px 0;
+}
+</style>
+<div class=ltr>
+  <textarea>hello</textarea>
+</div>
+
+<div class=rtl dir=rtl>
+  <textarea>hello</textarea>
+</div>
+
+<div class=v-rl>
+  <textarea>hello</textarea>
+</div>