summaryrefslogtreecommitdiffstats
path: root/layout/reftests/forms/select
diff options
context:
space:
mode:
authorMatt A. Tobin <mattatobin@localhost.localdomain>2018-02-02 04:16:08 -0500
committerMatt A. Tobin <mattatobin@localhost.localdomain>2018-02-02 04:16:08 -0500
commit5f8de423f190bbb79a62f804151bc24824fa32d8 (patch)
tree10027f336435511475e392454359edea8e25895d /layout/reftests/forms/select
parent49ee0794b5d912db1f95dce6eb52d781dc210db5 (diff)
downloadUXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.gz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.lz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.xz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.zip
Add m-esr52 at 52.6.0
Diffstat (limited to 'layout/reftests/forms/select')
-rw-r--r--layout/reftests/forms/select/997709-2-ref.html4
-rw-r--r--layout/reftests/forms/select/997709-2.html4
-rw-r--r--layout/reftests/forms/select/boguskids-ref.html13
-rw-r--r--layout/reftests/forms/select/boguskids.html18
-rw-r--r--layout/reftests/forms/select/dynamic-boguskids.html31
-rw-r--r--layout/reftests/forms/select/focusring-1-ref.html37
-rw-r--r--layout/reftests/forms/select/focusring-1.html41
-rw-r--r--layout/reftests/forms/select/focusring-2-ref.html22
-rw-r--r--layout/reftests/forms/select/focusring-2.html46
-rw-r--r--layout/reftests/forms/select/focusring-3-ref.html36
-rw-r--r--layout/reftests/forms/select/focusring-3.html40
-rw-r--r--layout/reftests/forms/select/multiple-ref.html12
-rw-r--r--layout/reftests/forms/select/multiple.html12
-rw-r--r--layout/reftests/forms/select/option-children-ref.html5
-rw-r--r--layout/reftests/forms/select/option-children.html11
-rw-r--r--layout/reftests/forms/select/out-of-bounds-selectedindex-ref.html112
-rw-r--r--layout/reftests/forms/select/out-of-bounds-selectedindex.html129
-rw-r--r--layout/reftests/forms/select/padding-button-placement-ref.html10
-rw-r--r--layout/reftests/forms/select/padding-button-placement.html15
-rw-r--r--layout/reftests/forms/select/reftest-stylo.list15
-rw-r--r--layout/reftests/forms/select/reftest.list11
-rw-r--r--layout/reftests/forms/select/vertical-centering-ref.html23
-rw-r--r--layout/reftests/forms/select/vertical-centering.html19
23 files changed, 666 insertions, 0 deletions
diff --git a/layout/reftests/forms/select/997709-2-ref.html b/layout/reftests/forms/select/997709-2-ref.html
new file mode 100644
index 000000000..349abe0b7
--- /dev/null
+++ b/layout/reftests/forms/select/997709-2-ref.html
@@ -0,0 +1,4 @@
+<!DOCTYPE HTML>
+<html><body>
+<select style="display:block"><option>A</select>
+</body></html>
diff --git a/layout/reftests/forms/select/997709-2.html b/layout/reftests/forms/select/997709-2.html
new file mode 100644
index 000000000..46be45418
--- /dev/null
+++ b/layout/reftests/forms/select/997709-2.html
@@ -0,0 +1,4 @@
+<!DOCTYPE HTML>
+<html><body>
+<select style="display:flex"><option>A</select>
+</body></html>
diff --git a/layout/reftests/forms/select/boguskids-ref.html b/layout/reftests/forms/select/boguskids-ref.html
new file mode 100644
index 000000000..905b64649
--- /dev/null
+++ b/layout/reftests/forms/select/boguskids-ref.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+ <body>
+ <select size="10">
+ <option>one</option>
+ <option>two</option>
+ <optgroup>
+ <option>three</option>
+ <option>four</option>
+ </optgroup>
+ </select>
+ </body>
+</html>
diff --git a/layout/reftests/forms/select/boguskids.html b/layout/reftests/forms/select/boguskids.html
new file mode 100644
index 000000000..102f820c8
--- /dev/null
+++ b/layout/reftests/forms/select/boguskids.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+ <body>
+ <select size="10">
+ Shouldn't see me
+ <option>one</option>
+ Or me
+ <option>two</option>
+ <optgroup>
+ I should hide too
+ <option>three</option>
+ And me too
+ <option>four</option>
+ </optgroup>
+ And I
+ </select>
+ </body>
+</html>
diff --git a/layout/reftests/forms/select/dynamic-boguskids.html b/layout/reftests/forms/select/dynamic-boguskids.html
new file mode 100644
index 000000000..2a6b7c261
--- /dev/null
+++ b/layout/reftests/forms/select/dynamic-boguskids.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <script>
+ function doIt() {
+ var insertions = [
+ [ "opt1", "Shouldn't see me" ],
+ [ "opt2", "Or me" ],
+ [ "opt3", "I should hide too" ],
+ [ "opt4", "And me too" ]
+ ];
+ for (var i = 0; i < insertions.length; ++i) {
+ var next = document.getElementById(insertions[i][0]);
+ next.parentNode.insertBefore(document.createTextNode(insertions[i][1]),
+ next);
+ }
+ document.getElementById("sel").appendChild(document.createTextNode("And I"));
+ }
+ </script>
+ </head>
+ <body onload="doIt()">
+ <select size="10" id="sel">
+ <option id="opt1">one</option>
+ <option id="opt2">two</option>
+ <optgroup>
+ <option id="opt3">three</option>
+ <option id="opt4">four</option>
+ </optgroup>
+ </select>
+ </body>
+</html>
diff --git a/layout/reftests/forms/select/focusring-1-ref.html b/layout/reftests/forms/select/focusring-1-ref.html
new file mode 100644
index 000000000..9118d265e
--- /dev/null
+++ b/layout/reftests/forms/select/focusring-1-ref.html
@@ -0,0 +1,37 @@
+<!DOCTYPE HTML>
+<html class="reftest-wait"><head>
+ <meta charset="utf-8">
+ <title>Testcase #1 for bug 1253977</title>
+ <style type="text/css">
+
+* { -moz-appearance:none; }
+:focus {
+ border:2px solid black;
+}
+:-moz-focusring {
+ outline: 2px dashed black;
+}
+
+ </style>
+</head>
+<body>
+
+<select><option>1<option>2</select>
+<input>
+
+<script>
+
+function runTests() {
+ var b = document.querySelector("input");
+ b.focus();
+ document.body.offsetHeight;
+ setTimeout(function(){ document.body.offsetHeight; document.documentElement.removeAttribute("class"); }, 100);
+}
+
+window.focus();
+window.addEventListener("MozReftestInvalidate", runTests, false);
+
+</script>
+
+</body>
+</html>
diff --git a/layout/reftests/forms/select/focusring-1.html b/layout/reftests/forms/select/focusring-1.html
new file mode 100644
index 000000000..fa3bb204f
--- /dev/null
+++ b/layout/reftests/forms/select/focusring-1.html
@@ -0,0 +1,41 @@
+<!DOCTYPE HTML>
+<html class="reftest-wait"><head>
+ <meta charset="utf-8">
+ <title>Testcase #1 for bug 1253977</title>
+ <style type="text/css">
+
+* { -moz-appearance:none; }
+:focus {
+ border:2px solid black;
+}
+:-moz-focusring {
+ outline: 2px dashed black;
+}
+
+ </style>
+</head>
+<body>
+
+<select><option>1<option>2</select>
+<input>
+
+<script>
+
+function runTests() {
+ var s = document.querySelector("select");
+ var b = document.querySelector("input");
+ s.focus();
+ document.body.offsetHeight;
+ setTimeout(function(){ s.style.display = 'none'; document.body.offsetHeight; }, 2);
+ setTimeout(function(){ b.focus(); document.body.offsetHeight; }, 3);
+ setTimeout(function(){ s.style.display = 'inline'; document.body.offsetHeight; }, 4);
+ setTimeout(function(){ document.documentElement.removeAttribute("class"); }, 100);
+}
+
+window.focus();
+window.addEventListener("MozReftestInvalidate", runTests, false);
+
+</script>
+
+</body>
+</html>
diff --git a/layout/reftests/forms/select/focusring-2-ref.html b/layout/reftests/forms/select/focusring-2-ref.html
new file mode 100644
index 000000000..c7c16a5e5
--- /dev/null
+++ b/layout/reftests/forms/select/focusring-2-ref.html
@@ -0,0 +1,22 @@
+<!DOCTYPE HTML>
+<html><head>
+ <meta charset="utf-8">
+ <title>Testcase #2 for bug 1253977</title>
+ <style type="text/css">
+
+* { -moz-appearance:none; }
+:focus {
+ border:2px solid black;
+}
+:-moz-focusring {
+ outline: 2px dashed black;
+}
+
+ </style>
+</head>
+<body>
+
+<select><option>1<option>2</select>
+
+</body>
+</html>
diff --git a/layout/reftests/forms/select/focusring-2.html b/layout/reftests/forms/select/focusring-2.html
new file mode 100644
index 000000000..413ca3a83
--- /dev/null
+++ b/layout/reftests/forms/select/focusring-2.html
@@ -0,0 +1,46 @@
+<!DOCTYPE HTML>
+<html class="reftest-wait"><head>
+ <meta charset="utf-8">
+ <title>Testcase #2 for bug 1253977</title>
+ <style type="text/css">
+
+* { -moz-appearance:none; }
+:focus {
+ border:2px solid black;
+}
+:-moz-focusring {
+ outline: 2px dashed black;
+}
+
+ </style>
+</head>
+<body>
+
+<select onfocus="continueTest1()" onblur="continueTest2()"><option>1<option>2</select>
+
+<script>
+
+function continueTest2(){
+ var s = document.querySelector("select");
+ setTimeout(function(){ s.style.display = 'inline'; document.body.offsetHeight; }, 4);
+ setTimeout(function(){ document.body.offsetHeight; document.documentElement.removeAttribute("class"); }, 100);
+}
+
+function continueTest1(){
+ var s = document.querySelector("select");
+ setTimeout(function(){ s.style.display = 'none'; }, 2);
+ setTimeout(function(){ s.blur(); document.body.offsetHeight; }, 3);
+}
+
+function runTests(){
+ var s = document.querySelector("select");
+ s.focus();
+}
+
+window.focus();
+window.addEventListener("MozReftestInvalidate", runTests, false);
+
+</script>
+
+</body>
+</html>
diff --git a/layout/reftests/forms/select/focusring-3-ref.html b/layout/reftests/forms/select/focusring-3-ref.html
new file mode 100644
index 000000000..0238f8bdb
--- /dev/null
+++ b/layout/reftests/forms/select/focusring-3-ref.html
@@ -0,0 +1,36 @@
+<!DOCTYPE HTML>
+<html class="reftest-wait"><head>
+ <meta charset="utf-8">
+ <title>Testcase #3 for bug 1253977</title>
+ <style type="text/css">
+
+* { -moz-appearance:none; }
+:focus {
+ border:2px solid black;
+}
+:-moz-focusring {
+ outline: 2px dashed black;
+}
+
+ </style>
+</head>
+<body>
+
+<select><option>1<option>2</select>
+
+<script>
+
+function runTests(){
+ var s = document.querySelector("select");
+ s.focus();
+ document.body.offsetHeight;
+ setTimeout(function(){ document.documentElement.removeAttribute("class"); }, 100);
+}
+
+window.focus();
+window.addEventListener("MozReftestInvalidate", runTests, false);
+
+</script>
+
+</body>
+</html>
diff --git a/layout/reftests/forms/select/focusring-3.html b/layout/reftests/forms/select/focusring-3.html
new file mode 100644
index 000000000..4a51476db
--- /dev/null
+++ b/layout/reftests/forms/select/focusring-3.html
@@ -0,0 +1,40 @@
+<!DOCTYPE HTML>
+<html class="reftest-wait"><head>
+ <meta charset="utf-8">
+ <title>Testcase #3 for bug 1253977</title>
+ <style type="text/css">
+
+* { -moz-appearance:none; }
+:focus {
+ border:2px solid black;
+}
+:-moz-focusring {
+ outline: 2px dashed black;
+}
+
+ </style>
+</head>
+<body>
+
+<select onfocus="continueTest1()"><option>1<option>2</select>
+
+<script>
+
+function continueTest1(){
+ var s = document.querySelector("select");
+ setTimeout(function(){ s.style.display = 'none'; }, 2);
+ setTimeout(function(){ s.style.display = 'inline'; document.body.offsetHeight; }, 4);
+ setTimeout(function(){ document.documentElement.removeAttribute("class"); }, 100);
+}
+function runTests(){
+ var s = document.querySelector("select");
+ s.focus();
+}
+
+window.focus();
+window.addEventListener("MozReftestInvalidate", runTests, false);
+
+</script>
+
+</body>
+</html>
diff --git a/layout/reftests/forms/select/multiple-ref.html b/layout/reftests/forms/select/multiple-ref.html
new file mode 100644
index 000000000..70bdac6bc
--- /dev/null
+++ b/layout/reftests/forms/select/multiple-ref.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html>
+ <body>
+ <select size='4'>
+ <option>Tulip</option>
+ <option>Lily</option>
+ <option>Gagea</option>
+ <option>Snowflake</option>
+ <option>Ismene</option>
+ </select>
+ </body>
+</html>
diff --git a/layout/reftests/forms/select/multiple.html b/layout/reftests/forms/select/multiple.html
new file mode 100644
index 000000000..6b95eebc5
--- /dev/null
+++ b/layout/reftests/forms/select/multiple.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html>
+ <body>
+ <select multiple>
+ <option>Tulip</option>
+ <option>Lily</option>
+ <option>Gagea</option>
+ <option>Snowflake</option>
+ <option>Ismene</option>
+ </select>
+ </body>
+</html>
diff --git a/layout/reftests/forms/select/option-children-ref.html b/layout/reftests/forms/select/option-children-ref.html
new file mode 100644
index 000000000..09f6d19f0
--- /dev/null
+++ b/layout/reftests/forms/select/option-children-ref.html
@@ -0,0 +1,5 @@
+<!doctype html>
+<meta charset=utf-8>
+<title>Option elements with children</title>
+<body>
+<select><option>font</option></select>
diff --git a/layout/reftests/forms/select/option-children.html b/layout/reftests/forms/select/option-children.html
new file mode 100644
index 000000000..357247b56
--- /dev/null
+++ b/layout/reftests/forms/select/option-children.html
@@ -0,0 +1,11 @@
+<!doctype html>
+<meta charset=utf-8>
+<title>Option elements with children</title>
+<body>
+<script>
+document.body
+ .appendChild(document.createElement("select"))
+ .appendChild(document.createElement("option"))
+ .appendChild(document.createElement("font"))
+ .appendChild(document.createTextNode("font"))
+</script>
diff --git a/layout/reftests/forms/select/out-of-bounds-selectedindex-ref.html b/layout/reftests/forms/select/out-of-bounds-selectedindex-ref.html
new file mode 100644
index 000000000..413024176
--- /dev/null
+++ b/layout/reftests/forms/select/out-of-bounds-selectedindex-ref.html
@@ -0,0 +1,112 @@
+<html class="reftest-wait">
+<head><title>Testcase for bug 471741</title>
+<script>
+function sel(id,index) {
+ var el = document.getElementById(id)
+ el.selectedIndex = index;
+}
+
+</script>
+</head>
+<body>
+<select size="4" id="m1" multiple="multiple">
+ <option value="Item0">Item0</option>
+ <option selected="selected" value="Item1">Item1</option>
+ <option value="Item2">Item2</option>
+ <option value="Item3">Item3</option>
+ <option value="Item4">Item4</option>
+</select>
+<select size="1" id="s1">
+ <option value="Item0">Item0</option>
+ <option selected="selected" value="Item1">Item1</option>
+ <option value="Item2">Item2</option>
+ <option value="Item3">Item3</option>
+ <option value="Item4">Item4</option>
+</select>
+
+<select size="4" id="m2" multiple="multiple">
+ <option value="Item0">Item0</option>
+</select>
+<select size="1" id="s2">
+ <option value="Item0">Item0</option>
+</select>
+
+<select size="4" id="m3" multiple="multiple"></select>
+<select size="1" id="s3"></select>
+<br>
+
+<select size="4" id="r2m1" multiple="multiple">
+ <option value="Item0">Item0</option>
+ <option selected="selected" value="Item1">Item1</option>
+ <option value="Item2">Item2</option>
+ <option value="Item3">Item3</option>
+ <option value="Item4">Item4</option>
+</select>
+<select size="1" id="r2s1">
+ <option value="Item0">Item0</option>
+ <option selected="selected" value="Item1">Item1</option>
+ <option value="Item2">Item2</option>
+ <option value="Item3">Item3</option>
+ <option value="Item4">Item4</option>
+</select>
+
+<select size="4" id="r2m2" multiple="multiple">
+ <option value="Item0">Item0</option>
+</select>
+<select size="1" id="r2s2">
+ <option value="Item0">Item0</option>
+</select>
+
+<select size="4" id="r2m3" multiple="multiple"></select>
+<select size="1" id="r2s3"></select>
+<br>
+
+<select size="4" id="r3m1" multiple="multiple">
+ <option selected="selected" value="Item0">Item0</option>
+ <option value="Item1">Item1</option>
+ <option value="Item2">Item2</option>
+ <option value="Item3">Item3</option>
+ <option value="Item4">Item4</option>
+</select>
+<select size="1" id="r3s1">
+ <option selected="selected" value="Item0">Item0</option>
+ <option value="Item1">Item1</option>
+ <option value="Item2">Item2</option>
+ <option value="Item3">Item3</option>
+ <option value="Item4">Item4</option>
+</select>
+
+<select size="4" id="r3m2" multiple="multiple">
+ <option selected="selected" value="Item0">Item0</option>
+</select>
+<select size="1" id="r3s2">
+ <option selected="selected" value="Item0">Item0</option>
+</select>
+
+<select size="4" id="r3m3" multiple="multiple"></select>
+<select size="1" id="r3s3"></select>
+<br>
+
+<div id="result">Result: -1 -1 -1 -1 -1 -1 -1 -1 -1 -1 -1 -1 -1 -1 -1 -1 -1 -1 0 0 0 0 -1 -1 </div>
+
+<script>
+sel('m1', -1)
+sel('s1', -1)
+sel('m2', -1)
+sel('s2', -1)
+sel('m3', -1)
+sel('s3', -1)
+
+sel('r2m1', -1)
+sel('r2s1', -1)
+sel('r2m2', -1)
+sel('r2s2', -1)
+sel('r2m3', -1)
+sel('r2s3', -1)
+
+var flush = document.documentElement.offsetHeight;
+document.documentElement.className='';
+
+</script>
+</body>
+</html>
diff --git a/layout/reftests/forms/select/out-of-bounds-selectedindex.html b/layout/reftests/forms/select/out-of-bounds-selectedindex.html
new file mode 100644
index 000000000..4ae9ed06b
--- /dev/null
+++ b/layout/reftests/forms/select/out-of-bounds-selectedindex.html
@@ -0,0 +1,129 @@
+<html class="reftest-wait">
+<head><title>Testcase for bug 471741</title>
+<script>
+var result = "Result: "
+function sel(id,index) {
+ var el = document.getElementById(id)
+ el.selectedIndex = index;
+ result += el.selectedIndex + ' ';
+}
+
+</script>
+</head>
+<body id="body">
+<select size="4" id="m1" multiple="multiple">
+ <option value="Item0">Item0</option>
+ <option selected="selected" value="Item1">Item1</option>
+ <option value="Item2">Item2</option>
+ <option value="Item3">Item3</option>
+ <option value="Item4">Item4</option>
+</select>
+<select size="1" id="s1">
+ <option value="Item0">Item0</option>
+ <option selected="selected" value="Item1">Item1</option>
+ <option value="Item2">Item2</option>
+ <option value="Item3">Item3</option>
+ <option value="Item4">Item4</option>
+</select>
+
+<select size="4" id="m2" multiple="multiple">
+ <option value="Item0">Item0</option>
+</select>
+<select size="1" id="s2">
+ <option value="Item0">Item0</option>
+</select>
+
+<select size="4" id="m3" multiple="multiple"></select>
+<select size="1" id="s3"></select>
+<br>
+
+<select size="4" id="r2m1" multiple="multiple">
+ <option value="Item0">Item0</option>
+ <option selected="selected" value="Item1">Item1</option>
+ <option value="Item2">Item2</option>
+ <option value="Item3">Item3</option>
+ <option value="Item4">Item4</option>
+</select>
+<select size="1" id="r2s1">
+ <option value="Item0">Item0</option>
+ <option selected="selected" value="Item1">Item1</option>
+ <option value="Item2">Item2</option>
+ <option value="Item3">Item3</option>
+ <option value="Item4">Item4</option>
+</select>
+
+<select size="4" id="r2m2" multiple="multiple">
+ <option value="Item0">Item0</option>
+</select>
+<select size="1" id="r2s2">
+ <option value="Item0">Item0</option>
+</select>
+
+<select size="4" id="r2m3" multiple="multiple"></select>
+<select size="1" id="r2s3"></select>
+<br>
+
+<select size="4" id="r3m1" multiple="multiple">
+ <option value="Item0">Item0</option>
+ <option selected="selected" value="Item1">Item1</option>
+ <option value="Item2">Item2</option>
+ <option value="Item3">Item3</option>
+ <option value="Item4">Item4</option>
+</select>
+<select size="1" id="r3s1">
+ <option value="Item0">Item0</option>
+ <option selected="selected" value="Item1">Item1</option>
+ <option value="Item2">Item2</option>
+ <option value="Item3">Item3</option>
+ <option value="Item4">Item4</option>
+</select>
+
+<select size="4" id="r3m2" multiple="multiple">
+ <option value="Item0">Item0</option>
+</select>
+<select size="1" id="r3s2">
+ <option value="Item0">Item0</option>
+</select>
+
+<select size="4" id="r3m3" multiple="multiple"></select>
+<select size="1" id="r3s3"></select>
+<br>
+
+<div id="result"></div>
+
+<script>
+sel('m1', 10)
+sel('s1', 10)
+sel('m2', 99999)
+sel('s2', 99999)
+sel('m3', 10)
+sel('s3', 10)
+
+sel('r2m1', -2)
+sel('r2s1', -2)
+sel('r2m2', -12)
+sel('r2s2', -12)
+sel('r2m3', -2)
+sel('r2s3', -2)
+
+sel('r3m1', -2)
+sel('r3s1', -2)
+sel('r3m2', -12)
+sel('r3s2', -12)
+sel('r3m3', -2)
+sel('r3s3', -2)
+sel('r3m1', 0)
+sel('r3s1', 0)
+sel('r3m2', 0)
+sel('r3s2', 0)
+sel('r3m3', 0)
+sel('r3s3', 0)
+
+document.getElementById('result').innerHTML = result;
+
+var flush = document.documentElement.offsetHeight;
+document.documentElement.className='';
+
+</script>
+</body>
+</html>
diff --git a/layout/reftests/forms/select/padding-button-placement-ref.html b/layout/reftests/forms/select/padding-button-placement-ref.html
new file mode 100644
index 000000000..342b404c6
--- /dev/null
+++ b/layout/reftests/forms/select/padding-button-placement-ref.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta http-equiv="content-type" content="text/html; charset=UTF-8">
+ </head>
+ <body>
+ <div style="box-sizing:border-box; width:402px; height:202px; border:1px solid black; border-right:50px solid black;"></div>
+ <div style="box-sizing:border-box; width:402px; height:202px; border:1px solid black; border-left:50px solid black;"></div>
+ </body>
+</html>
diff --git a/layout/reftests/forms/select/padding-button-placement.html b/layout/reftests/forms/select/padding-button-placement.html
new file mode 100644
index 000000000..370715032
--- /dev/null
+++ b/layout/reftests/forms/select/padding-button-placement.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta http-equiv="content-type" content="text/html; charset=UTF-8">
+ </head>
+ <body>
+ <!-- The div's border should hide the select's button -->
+ <!-- z-index:1 works around an unrelated bug in B2G -->
+ <div style="position:absolute; z-index:1; box-sizing:border-box; width:402px; height:202px; border-right:50px solid black;"></div>
+ <div><select style="background:transparent; border-radius:0; box-sizing:content-box; padding:50px; width:300px; height:100px; border:1px solid black; direction:ltr"></select></div>
+
+ <div style="position:absolute; z-index:1; box-sizing:border-box; width:402px; height:202px; border-left:50px solid black;"></div>
+ <div><select style="background:transparent; border-radius:0; box-sizing:content-box; padding:50px; width:300px; height:100px; border:1px solid black; direction:rtl"></select></div>
+ </body>
+</html>
diff --git a/layout/reftests/forms/select/reftest-stylo.list b/layout/reftests/forms/select/reftest-stylo.list
new file mode 100644
index 000000000..998f27237
--- /dev/null
+++ b/layout/reftests/forms/select/reftest-stylo.list
@@ -0,0 +1,15 @@
+# DO NOT EDIT! This is a auto-generated temporary list for Stylo testing
+fuzzy-if(Android,2,2) skip-if(B2G||Mulet) == out-of-bounds-selectedindex.html out-of-bounds-selectedindex.html
+# test for bug 471741
+# Initial mulet triage: parity with B2G/B2G Desktop
+skip-if(B2G||Mulet) == multiple.html multiple.html
+# Initial mulet triage: parity with B2G/B2G Desktop
+== boguskids.html boguskids.html
+== dynamic-boguskids.html dynamic-boguskids.html
+== option-children.html option-children.html
+fuzzy(1,4) == padding-button-placement.html padding-button-placement.html
+HTTP(../..) == vertical-centering.html vertical-centering.html
+== 997709-2.html 997709-2.html
+needs-focus == focusring-1.html focusring-1.html
+needs-focus == focusring-2.html focusring-2.html
+needs-focus == focusring-3.html focusring-3.html
diff --git a/layout/reftests/forms/select/reftest.list b/layout/reftests/forms/select/reftest.list
new file mode 100644
index 000000000..1261dad9f
--- /dev/null
+++ b/layout/reftests/forms/select/reftest.list
@@ -0,0 +1,11 @@
+fuzzy-if(Android,4,11) == out-of-bounds-selectedindex.html out-of-bounds-selectedindex-ref.html # test for bug 471741
+== multiple.html multiple-ref.html
+== boguskids.html boguskids-ref.html
+== dynamic-boguskids.html boguskids-ref.html
+== option-children.html option-children-ref.html
+fuzzy(1,4) == padding-button-placement.html padding-button-placement-ref.html
+HTTP(../..) == vertical-centering.html vertical-centering-ref.html
+== 997709-2.html 997709-2-ref.html
+needs-focus == focusring-1.html focusring-1-ref.html
+needs-focus == focusring-2.html focusring-2-ref.html
+needs-focus == focusring-3.html focusring-3-ref.html
diff --git a/layout/reftests/forms/select/vertical-centering-ref.html b/layout/reftests/forms/select/vertical-centering-ref.html
new file mode 100644
index 000000000..f5d855456
--- /dev/null
+++ b/layout/reftests/forms/select/vertical-centering-ref.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<style>
+ @font-face {
+ font-family: "Ahem";
+ src: url(../../fonts/Ahem.ttf);
+ }
+ select {
+ -moz-appearance: none;
+ border: none;
+ font-family: Ahem;
+ font-size: 20px;
+ box-sizing: content-box;
+ /*
+ * Why are these top/bottom paddings 7px rather than 10px? 1px each is
+ * eaten up by padding on the combobox display area, but I have no idea
+ * where the extra 4px somewhere else are coming from...
+ */
+ padding: 7px 0 7px 0;
+ }
+</style>
+<select>
+ <option>X</option>
+</select>
diff --git a/layout/reftests/forms/select/vertical-centering.html b/layout/reftests/forms/select/vertical-centering.html
new file mode 100644
index 000000000..6a2daa9e7
--- /dev/null
+++ b/layout/reftests/forms/select/vertical-centering.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<style>
+ @font-face {
+ font-family: "Ahem";
+ src: url(../../fonts/Ahem.ttf);
+ }
+ select {
+ -moz-appearance: none;
+ border: none;
+ font-family: Ahem;
+ font-size: 20px;
+ padding: 0;
+ box-sizing: content-box;
+ height: 40px;
+ }
+</style>
+<select>
+ <option>X</option>
+</select>