summaryrefslogtreecommitdiffstats
path: root/layout/reftests/forms/input/number
diff options
context:
space:
mode:
Diffstat (limited to 'layout/reftests/forms/input/number')
-rw-r--r--layout/reftests/forms/input/number/focus-handling-ref.html26
-rw-r--r--layout/reftests/forms/input/number/focus-handling.html32
-rw-r--r--layout/reftests/forms/input/number/from-number-to-other-type-unthemed-1-ref.html6
-rw-r--r--layout/reftests/forms/input/number/from-number-to-other-type-unthemed-1.html16
-rw-r--r--layout/reftests/forms/input/number/not-other-type-unthemed-1.html6
-rw-r--r--layout/reftests/forms/input/number/not-other-type-unthemed-1a-notref.html6
-rw-r--r--layout/reftests/forms/input/number/not-other-type-unthemed-1b-notref.html6
-rw-r--r--layout/reftests/forms/input/number/number-auto-width-1-ref.html8
-rw-r--r--layout/reftests/forms/input/number/number-auto-width-1.html8
-rw-r--r--layout/reftests/forms/input/number/number-disabled-ref.html9
-rw-r--r--layout/reftests/forms/input/number/number-disabled.html9
-rw-r--r--layout/reftests/forms/input/number/number-max-height-1-ref.html17
-rw-r--r--layout/reftests/forms/input/number/number-max-height-1.html27
-rw-r--r--layout/reftests/forms/input/number/number-max-height-2-ref.html17
-rw-r--r--layout/reftests/forms/input/number/number-max-height-2.html27
-rw-r--r--layout/reftests/forms/input/number/number-min-height-1-ref.html17
-rw-r--r--layout/reftests/forms/input/number/number-min-height-1.html26
-rw-r--r--layout/reftests/forms/input/number/number-min-height-2-ref.html17
-rw-r--r--layout/reftests/forms/input/number/number-min-height-2.html26
-rw-r--r--layout/reftests/forms/input/number/number-placeholder-ref.html17
-rw-r--r--layout/reftests/forms/input/number/number-placeholder.html24
-rw-r--r--layout/reftests/forms/input/number/number-pseudo-elements-ref.html6
-rw-r--r--layout/reftests/forms/input/number/number-pseudo-elements.html20
-rw-r--r--layout/reftests/forms/input/number/number-reframe-anon-text-field-ref.html17
-rw-r--r--layout/reftests/forms/input/number/number-reframe-anon-text-field.html44
-rw-r--r--layout/reftests/forms/input/number/number-same-as-text-unthemed-ref.html6
-rw-r--r--layout/reftests/forms/input/number/number-same-as-text-unthemed.html6
-rw-r--r--layout/reftests/forms/input/number/number-selected-ref.html18
-rw-r--r--layout/reftests/forms/input/number/number-selected.html18
-rw-r--r--layout/reftests/forms/input/number/number-significant-fractional-digits-ref.html6
-rw-r--r--layout/reftests/forms/input/number/number-significant-fractional-digits.html17
-rw-r--r--layout/reftests/forms/input/number/number-similar-to-text-unthemed-ref.html8
-rw-r--r--layout/reftests/forms/input/number/number-similar-to-text-unthemed-rtl-ref.html8
-rw-r--r--layout/reftests/forms/input/number/number-similar-to-text-unthemed-rtl.html8
-rw-r--r--layout/reftests/forms/input/number/number-similar-to-text-unthemed-vertical-lr-ref.html8
-rw-r--r--layout/reftests/forms/input/number/number-similar-to-text-unthemed-vertical-lr.html8
-rw-r--r--layout/reftests/forms/input/number/number-similar-to-text-unthemed-vertical-rl-ref.html8
-rw-r--r--layout/reftests/forms/input/number/number-similar-to-text-unthemed-vertical-rl.html8
-rw-r--r--layout/reftests/forms/input/number/number-similar-to-text-unthemed.html8
-rw-r--r--layout/reftests/forms/input/number/pseudo-classes.html37
-rw-r--r--layout/reftests/forms/input/number/reftest-stylo.list65
-rw-r--r--layout/reftests/forms/input/number/reftest.list54
-rw-r--r--layout/reftests/forms/input/number/show-value-ref.html26
-rw-r--r--layout/reftests/forms/input/number/show-value.html42
-rw-r--r--layout/reftests/forms/input/number/to-number-from-other-type-unthemed-1-ref.html6
-rw-r--r--layout/reftests/forms/input/number/to-number-from-other-type-unthemed-1.html15
46 files changed, 814 insertions, 0 deletions
diff --git a/layout/reftests/forms/input/number/focus-handling-ref.html b/layout/reftests/forms/input/number/focus-handling-ref.html
new file mode 100644
index 000000000..e07f83f99
--- /dev/null
+++ b/layout/reftests/forms/input/number/focus-handling-ref.html
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+ <!-- In this case we're using reftest-wait to make sure the test doesn't
+ get snapshotted before it's been focused. We're not testing
+ invalidation so we don't need to listen for MozReftestInvalidate.
+ -->
+ <head>
+ <meta charset="utf-8">
+ <script>
+
+function end() {
+ setTimeout(function() {
+ document.documentElement.className = "";
+ }, 0);
+}
+
+ </script>
+ </head>
+ <body>
+ <input style="-moz-appearance:none;"><br>
+ <input autofocus onfocus="end();"
+ style="-moz-appearance:none;">
+ <!-- div to cover spin box area for type=number to type=text comparison -->
+ <div style="display:block; position:absolute; background-color:black; width:200px; height:100px; top:0px; left:100px;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/focus-handling.html b/layout/reftests/forms/input/number/focus-handling.html
new file mode 100644
index 000000000..b54f83a56
--- /dev/null
+++ b/layout/reftests/forms/input/number/focus-handling.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+ <!-- In this case we're using reftest-wait to make sure the test doesn't
+ get snapshotted before it's been focused. We're not testing
+ invalidation so we don't need to listen for MozReftestInvalidate.
+ -->
+ <head>
+ <meta charset="utf-8">
+ <script>
+
+function begin() {
+ document.getElementsByTagName('input')[1].focus();
+}
+
+function end() {
+ setTimeout(function() {
+ document.documentElement.className = "";
+ }, 0);
+}
+
+ </script>
+ </head>
+ <body>
+ <input type='number' autofocus onfocus="begin();"
+ style="-moz-appearance:none;"><br>
+ <input type='number' onfocus="end();"
+ style="-moz-appearance:none;">
+ <!-- div to cover spin box area for type=number to type=text comparison -->
+ <div style="display:block; position:absolute; background-color:black; width:200px; height:100px; top:0px; left:100px;">
+ </body>
+</html>
+
diff --git a/layout/reftests/forms/input/number/from-number-to-other-type-unthemed-1-ref.html b/layout/reftests/forms/input/number/from-number-to-other-type-unthemed-1-ref.html
new file mode 100644
index 000000000..ffb5ffa58
--- /dev/null
+++ b/layout/reftests/forms/input/number/from-number-to-other-type-unthemed-1-ref.html
@@ -0,0 +1,6 @@
+<!DOCTYPE html>
+<html>
+ <body>
+ <input type="checkbox" style="-moz-appearance:none;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/from-number-to-other-type-unthemed-1.html b/layout/reftests/forms/input/number/from-number-to-other-type-unthemed-1.html
new file mode 100644
index 000000000..561b39bec
--- /dev/null
+++ b/layout/reftests/forms/input/number/from-number-to-other-type-unthemed-1.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+ <!-- Test: when switching to another type, the input element should look
+ like that type (not like an input number element) -->
+ <script type="text/javascript">
+ function setToCheckbox()
+ {
+ document.getElementById('i').type='checkbox';
+ document.documentElement.className = '';
+ }
+ document.addEventListener("MozReftestInvalidate", setToCheckbox);
+ </script>
+ <body>
+ <input type='number' id='i' style="-moz-appearance:none;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/not-other-type-unthemed-1.html b/layout/reftests/forms/input/number/not-other-type-unthemed-1.html
new file mode 100644
index 000000000..7f0d427b4
--- /dev/null
+++ b/layout/reftests/forms/input/number/not-other-type-unthemed-1.html
@@ -0,0 +1,6 @@
+<!DOCTYPE html>
+<html>
+ <body>
+ <input type="number" value="1" style="-moz-appearance:none;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/not-other-type-unthemed-1a-notref.html b/layout/reftests/forms/input/number/not-other-type-unthemed-1a-notref.html
new file mode 100644
index 000000000..7c5a4dcac
--- /dev/null
+++ b/layout/reftests/forms/input/number/not-other-type-unthemed-1a-notref.html
@@ -0,0 +1,6 @@
+<!DOCTYPE html>
+<html>
+ <body>
+ <input type="text" value="1" style="-moz-appearance:none;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/not-other-type-unthemed-1b-notref.html b/layout/reftests/forms/input/number/not-other-type-unthemed-1b-notref.html
new file mode 100644
index 000000000..ffb5ffa58
--- /dev/null
+++ b/layout/reftests/forms/input/number/not-other-type-unthemed-1b-notref.html
@@ -0,0 +1,6 @@
+<!DOCTYPE html>
+<html>
+ <body>
+ <input type="checkbox" style="-moz-appearance:none;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-auto-width-1-ref.html b/layout/reftests/forms/input/number/number-auto-width-1-ref.html
new file mode 100644
index 000000000..50b7b7e04
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-auto-width-1-ref.html
@@ -0,0 +1,8 @@
+<!DOCTYPE html>
+<html>
+ <body>
+ <input type="text" style="-moz-appearance:none; width:auto;">
+ <!-- div to cover spin box area -->
+ <div style="display:block; position:absolute; background-color:black; width:2000px; height:100px; top:0px; left:100px;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-auto-width-1.html b/layout/reftests/forms/input/number/number-auto-width-1.html
new file mode 100644
index 000000000..5c9cc0abe
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-auto-width-1.html
@@ -0,0 +1,8 @@
+<!DOCTYPE html>
+<html>
+ <body>
+ <input type="number" style="-moz-appearance:none; width:auto;">
+ <!-- div to cover spin box area -->
+ <div style="display:block; position:absolute; background-color:black; width:2000px; height:100px; top:0px; left:100px;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-disabled-ref.html b/layout/reftests/forms/input/number/number-disabled-ref.html
new file mode 100644
index 000000000..f3c9d4d56
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-disabled-ref.html
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<html>
+ <body>
+ <input type="text" disabled
+ style="-moz-appearance: none"><!-- Workaround for bug 1223198 -->
+ <!-- div to cover spin box area -->
+ <div style="display:block; position:absolute; background-color:black; width:200px; height:100px; top:0px; left:100px;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-disabled.html b/layout/reftests/forms/input/number/number-disabled.html
new file mode 100644
index 000000000..b4acb20a7
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-disabled.html
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<html>
+ <body>
+ <input type="number" disabled
+ style="-moz-appearance: none"><!-- Workaround for bug 1223198 -->
+ <!-- div to cover spin box area -->
+ <div style="display:block; position:absolute; background-color:black; width:200px; height:100px; top:0px; left:100px;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-max-height-1-ref.html b/layout/reftests/forms/input/number/number-max-height-1-ref.html
new file mode 100644
index 000000000..5f17a6242
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-max-height-1-ref.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+
+div {
+ border: 3px solid black;
+ width: 308px;
+ height: 108px;
+}
+
+ </style>
+ </head>
+ <body>
+ <div></div>
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-max-height-1.html b/layout/reftests/forms/input/number/number-max-height-1.html
new file mode 100644
index 000000000..bf671a0f9
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-max-height-1.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+
+input {
+ border: 3px solid black;
+ padding: 4px;
+ width: 300px;
+ height: 300px;
+ max-height: 100px;
+ box-sizing: content-box;
+ /* hide the spin buttons: */
+ -moz-appearance: textfield;
+}
+
+* > input[type=number] {
+ /* get rid of background gradient for Firefox OS */
+ background-color: transparent ! important;
+}
+
+ </style>
+ </head>
+ <body>
+ <input type="number">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-max-height-2-ref.html b/layout/reftests/forms/input/number/number-max-height-2-ref.html
new file mode 100644
index 000000000..8b654e7f9
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-max-height-2-ref.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+
+div {
+ border: 3px solid black;
+ width: 294px;
+ height: 94px;
+}
+
+ </style>
+ </head>
+ <body>
+ <div></div>
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-max-height-2.html b/layout/reftests/forms/input/number/number-max-height-2.html
new file mode 100644
index 000000000..ff118ea23
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-max-height-2.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+
+input {
+ border: 3px solid black;
+ padding: 4px;
+ width: 300px;
+ height: 300px;
+ max-height: 100px;
+ box-sizing: border-box;
+ /* hide the spin buttons: */
+ -moz-appearance: textfield;
+}
+
+* > input[type=number] {
+ /* get rid of background gradient for Firefox OS */
+ background-color: transparent ! important;
+}
+
+ </style>
+ </head>
+ <body>
+ <input type="number">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-min-height-1-ref.html b/layout/reftests/forms/input/number/number-min-height-1-ref.html
new file mode 100644
index 000000000..5f17a6242
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-min-height-1-ref.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+
+div {
+ border: 3px solid black;
+ width: 308px;
+ height: 108px;
+}
+
+ </style>
+ </head>
+ <body>
+ <div></div>
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-min-height-1.html b/layout/reftests/forms/input/number/number-min-height-1.html
new file mode 100644
index 000000000..75923b98b
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-min-height-1.html
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+
+input {
+ border: 3px solid black;
+ padding: 4px;
+ width: 300px;
+ min-height: 100px;
+ box-sizing: content-box;
+ /* hide the spin buttons: */
+ -moz-appearance: textfield;
+}
+
+* > input[type=number] {
+ /* get rid of background gradient for Firefox OS */
+ background-color: transparent ! important;
+}
+
+ </style>
+ </head>
+ <body>
+ <input type="number">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-min-height-2-ref.html b/layout/reftests/forms/input/number/number-min-height-2-ref.html
new file mode 100644
index 000000000..8b654e7f9
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-min-height-2-ref.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+
+div {
+ border: 3px solid black;
+ width: 294px;
+ height: 94px;
+}
+
+ </style>
+ </head>
+ <body>
+ <div></div>
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-min-height-2.html b/layout/reftests/forms/input/number/number-min-height-2.html
new file mode 100644
index 000000000..9f69e1eae
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-min-height-2.html
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+
+input {
+ border: 3px solid black;
+ padding: 4px;
+ width: 300px;
+ min-height: 100px;
+ box-sizing: border-box;
+ /* hide the spin buttons: */
+ -moz-appearance: textfield;
+}
+
+* > input[type=number] {
+ /* get rid of background gradient for Firefox OS */
+ background-color: transparent ! important;
+}
+
+ </style>
+ </head>
+ <body>
+ <input type="number">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-placeholder-ref.html b/layout/reftests/forms/input/number/number-placeholder-ref.html
new file mode 100644
index 000000000..607627243
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-placeholder-ref.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+
+input {
+ width: 15em;
+ color: blue;
+ font-style: italic;
+}
+
+ </style>
+ </head>
+ <body>
+ <input type="number" value="123">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-placeholder.html b/layout/reftests/forms/input/number/number-placeholder.html
new file mode 100644
index 000000000..5018255ca
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-placeholder.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+
+input {
+ width: 15em;
+}
+
+input[type=number]::placeholder {
+ color: blue;
+ opacity: 1.0;
+}
+
+input[type=number]::-moz-placeholder {
+ font-style: italic;
+ opacity: 1.0;
+}
+ </style>
+ </head>
+ <body>
+ <input type="number" placeholder="123">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-pseudo-elements-ref.html b/layout/reftests/forms/input/number/number-pseudo-elements-ref.html
new file mode 100644
index 000000000..263aeff1f
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-pseudo-elements-ref.html
@@ -0,0 +1,6 @@
+<!DOCTYPE html>
+<html>
+ <body>
+ <input type="number" style="-moz-appearance:none;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-pseudo-elements.html b/layout/reftests/forms/input/number/number-pseudo-elements.html
new file mode 100644
index 000000000..33cf40fcf
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-pseudo-elements.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+
+/* None of these selectors should match from content */
+input[type=number]::-moz-number-wrapper,
+input[type=number]::-moz-number-text,
+input[type=number]::-moz-number-spin-box,
+input[type=number]::-moz-number-spin-up,
+input[type=number]::-moz-number-spin-down {
+ background-color: red;
+}
+
+ </style>
+ </head>
+ <body>
+ <input type="number" style="-moz-appearance:none;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-reframe-anon-text-field-ref.html b/layout/reftests/forms/input/number/number-reframe-anon-text-field-ref.html
new file mode 100644
index 000000000..aa58e491e
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-reframe-anon-text-field-ref.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+
+input {
+ font-size: 30pt;
+ background-color: lightblue;
+}
+
+ </style>
+ </head>
+ <body>
+ <input type="number">
+ </body>
+</html>
+
diff --git a/layout/reftests/forms/input/number/number-reframe-anon-text-field.html b/layout/reftests/forms/input/number/number-reframe-anon-text-field.html
new file mode 100644
index 000000000..8120b67d6
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-reframe-anon-text-field.html
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+ <head>
+ <style>
+
+input {
+ font-size: 30pt;
+ background-color: lightblue;
+}
+
+ </style>
+ <script>
+
+document.addEventListener("DOMContentLoaded", function() {
+ document.body.style.backgroundImage = "none";
+}, false);
+
+function PostRebuildAllStyleDataEvent() {
+ // trigger http://mxr.mozilla.org/mozilla-central/source/layout/base/RestyleManager.cpp?rev=a8b06549f680#1490
+ var m = document.createElementNS("http://www.w3.org/1998/Math/MathML", "math");
+ document.head.appendChild(m);
+ document.head.removeChild(m);
+}
+
+function reframe() {
+ PostRebuildAllStyleDataEvent();
+ document.documentElement.className = "";
+}
+
+document.addEventListener("MozReftestInvalidate", function() {
+ // Calling reframe now would be too early to reproduce the bug that we're
+ // testing for. Note that in the event that we start faling this test this
+ // timeout may make the failure seem intermittent when in fact we would
+ // always fail if it was longer.
+ setTimeout(reframe, 500);
+}, false);
+
+ </script>
+ </head>
+ <body>
+ <input type="number">
+ </body>
+</html>
+
diff --git a/layout/reftests/forms/input/number/number-same-as-text-unthemed-ref.html b/layout/reftests/forms/input/number/number-same-as-text-unthemed-ref.html
new file mode 100644
index 000000000..ceaa14d85
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-same-as-text-unthemed-ref.html
@@ -0,0 +1,6 @@
+<!DOCTYPE html>
+<html>
+ <body>
+ <input type="text" style="-moz-appearance:none; width:200px;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-same-as-text-unthemed.html b/layout/reftests/forms/input/number/number-same-as-text-unthemed.html
new file mode 100644
index 000000000..fddcc33eb
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-same-as-text-unthemed.html
@@ -0,0 +1,6 @@
+<!DOCTYPE html>
+<html>
+ <body>
+ <input type="number" style="-moz-appearance:none; width:200px;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-selected-ref.html b/layout/reftests/forms/input/number/number-selected-ref.html
new file mode 100644
index 000000000..10fea8f47
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-selected-ref.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+ <head>
+ <script>
+
+document.addEventListener("MozReftestInvalidate", function() {
+ document.getElementById("i").select();
+ document.documentElement.className = "";
+}, false);
+
+ </script>
+ </head>
+ <body>
+ <input id="i" type="text" value="123">
+ <!-- div to cover spin box area -->
+ <div style="display:block; position:absolute; background-color:black; width:200px; height:100px; top:0px; left:100px;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-selected.html b/layout/reftests/forms/input/number/number-selected.html
new file mode 100644
index 000000000..614b12718
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-selected.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+ <head>
+ <script>
+
+document.addEventListener("MozReftestInvalidate", function() {
+ document.getElementById("i").select();
+ document.documentElement.className = "";
+}, false);
+
+ </script>
+ </head>
+ <body>
+ <input id="i" type="number" value="123">
+ <!-- div to cover spin box area -->
+ <div style="display:block; position:absolute; background-color:black; width:200px; height:100px; top:0px; left:100px;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-significant-fractional-digits-ref.html b/layout/reftests/forms/input/number/number-significant-fractional-digits-ref.html
new file mode 100644
index 000000000..d57683025
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-significant-fractional-digits-ref.html
@@ -0,0 +1,6 @@
+<!DOCTYPE html>
+<html>
+ <body>
+ <input type="number" value="1.00100000000001" style="width:100%;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-significant-fractional-digits.html b/layout/reftests/forms/input/number/number-significant-fractional-digits.html
new file mode 100644
index 000000000..bb1654428
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-significant-fractional-digits.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+ <head>
+ <script>
+
+document.addEventListener("MozReftestInvalidate", function() {
+ document.getElementById("i").stepUp();
+ document.documentElement.className = "";
+}, false);
+
+ </script>
+ </head>
+ <body>
+ <input id="i" type="number" value="1.001" step="0.00000000000001"
+ style="width:100%;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-similar-to-text-unthemed-ref.html b/layout/reftests/forms/input/number/number-similar-to-text-unthemed-ref.html
new file mode 100644
index 000000000..abb0b240d
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-similar-to-text-unthemed-ref.html
@@ -0,0 +1,8 @@
+<!DOCTYPE html>
+<html>
+ <body>
+ <input type="text" style="-moz-appearance:none; width:200px;">
+ <!-- div to cover spin box area -->
+ <div style="display:block; position:absolute; background-color:black; width:200px; height:100px; top:0px; left:100px;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-similar-to-text-unthemed-rtl-ref.html b/layout/reftests/forms/input/number/number-similar-to-text-unthemed-rtl-ref.html
new file mode 100644
index 000000000..79644edc8
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-similar-to-text-unthemed-rtl-ref.html
@@ -0,0 +1,8 @@
+<!DOCTYPE html>
+<html>
+ <body style="direction: rtl">
+ <input type="text" style="-moz-appearance:none; width:200px;" value="1">
+ <!-- div to cover spin box area -->
+ <div style="display:block; position:absolute; background-color:black; width:200px; height:100px; top:0px; right:100px;"></div>
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-similar-to-text-unthemed-rtl.html b/layout/reftests/forms/input/number/number-similar-to-text-unthemed-rtl.html
new file mode 100644
index 000000000..36ffc0629
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-similar-to-text-unthemed-rtl.html
@@ -0,0 +1,8 @@
+<!DOCTYPE html>
+<html>
+ <body style="direction: rtl">
+ <input type="number" style="-moz-appearance:none; width:200px;" value="1">
+ <!-- div to cover spin box area -->
+ <div style="display:block; position:absolute; background-color:black; width:200px; height:100px; top:0px; right:100px;"></div>
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-similar-to-text-unthemed-vertical-lr-ref.html b/layout/reftests/forms/input/number/number-similar-to-text-unthemed-vertical-lr-ref.html
new file mode 100644
index 000000000..6deed4891
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-similar-to-text-unthemed-vertical-lr-ref.html
@@ -0,0 +1,8 @@
+<!DOCTYPE html>
+<html style="writing-mode:vertical-lr;">
+ <body>
+ <input type="text" style="-moz-appearance:none; height:200px;" value="123">
+ <!-- div to cover spin box area -->
+ <div style="position:absolute; background-color:black; width:100px; height:200px; top:100px; left:0px;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-similar-to-text-unthemed-vertical-lr.html b/layout/reftests/forms/input/number/number-similar-to-text-unthemed-vertical-lr.html
new file mode 100644
index 000000000..7a7883062
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-similar-to-text-unthemed-vertical-lr.html
@@ -0,0 +1,8 @@
+<!DOCTYPE html>
+<html style="writing-mode:vertical-lr;">
+ <body>
+ <input type="number" style="-moz-appearance:none; height:200px;" value="123">
+ <!-- div to cover spin box area -->
+ <div style="position:absolute; background-color:black; width:100px; height:200px; top:100px; left:0px;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-similar-to-text-unthemed-vertical-rl-ref.html b/layout/reftests/forms/input/number/number-similar-to-text-unthemed-vertical-rl-ref.html
new file mode 100644
index 000000000..73a537387
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-similar-to-text-unthemed-vertical-rl-ref.html
@@ -0,0 +1,8 @@
+<!DOCTYPE html>
+<html style="writing-mode:vertical-rl;">
+ <body>
+ <input type="text" style="-moz-appearance:none; height:200px;" value="123">
+ <!-- div to cover spin box area -->
+ <div style="position:absolute; background-color:black; width:100px; height:200px; top:100px; right:0px;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-similar-to-text-unthemed-vertical-rl.html b/layout/reftests/forms/input/number/number-similar-to-text-unthemed-vertical-rl.html
new file mode 100644
index 000000000..3bc3a388a
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-similar-to-text-unthemed-vertical-rl.html
@@ -0,0 +1,8 @@
+<!DOCTYPE html>
+<html style="writing-mode:vertical-rl;">
+ <body>
+ <input type="number" style="-moz-appearance:none; height:200px;" value="123">
+ <!-- div to cover spin box area -->
+ <div style="position:absolute; background-color:black; width:100px; height:200px; top:100px; right:0px;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/number-similar-to-text-unthemed.html b/layout/reftests/forms/input/number/number-similar-to-text-unthemed.html
new file mode 100644
index 000000000..f8c2ce65d
--- /dev/null
+++ b/layout/reftests/forms/input/number/number-similar-to-text-unthemed.html
@@ -0,0 +1,8 @@
+<!DOCTYPE html>
+<html>
+ <body>
+ <input type="number" style="-moz-appearance:none; width:200px;">
+ <!-- div to cover spin box area -->
+ <div style="display:block; position:absolute; background-color:black; width:200px; height:100px; top:0px; left:100px;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/pseudo-classes.html b/layout/reftests/forms/input/number/pseudo-classes.html
new file mode 100644
index 000000000..a0c62f721
--- /dev/null
+++ b/layout/reftests/forms/input/number/pseudo-classes.html
@@ -0,0 +1,37 @@
+<!DOCTYPE HTML>
+<!--
+ Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html><head>
+ <meta charset="utf-8">
+ <title>Test pseudo-classes on number controls</title>
+ <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1250315">
+ <link rel="help" href="https://drafts.csswg.org/selectors-4/#rw-pseudos">
+ <link rel="match" href="about:blank">
+ <style type="text/css">
+body,html { color:black; background:white; font-size:16px; padding:0; margin:0; }
+
+#t1:-moz-read-only { display:none; }
+#t1:-moz-read-write { display:block; }
+
+#t2:-moz-read-write { display:none; }
+#t2:-moz-read-only { display:block; }
+
+#t3:disabled { display:none; }
+#t3:enabled { display:block; }
+
+#t4:enabled { display:none; }
+#t4:disabled { display:block; }
+
+ </style>
+</head>
+<body>
+
+<input id=t1 type=number readonly>
+<input id=t2 type=number>
+<input id=t3 type=number disabled>
+<input id=t4 type=number>
+
+</body>
+</html>
diff --git a/layout/reftests/forms/input/number/reftest-stylo.list b/layout/reftests/forms/input/number/reftest-stylo.list
new file mode 100644
index 000000000..8a10476d7
--- /dev/null
+++ b/layout/reftests/forms/input/number/reftest-stylo.list
@@ -0,0 +1,65 @@
+# DO NOT EDIT! This is a auto-generated temporary list for Stylo testing
+default-preferences pref(dom.forms.number,true)
+
+# sanity checks:
+# not valid on Android/B2G where type=number looks like type=text
+skip skip-if(Android||B2G||Mulet) == not-other-type-unthemed-1.html not-other-type-unthemed-1.html
+# Initial mulet triage: parity with B2G/B2G Desktop
+skip skip-if(Android||B2G||Mulet) == not-other-type-unthemed-1.html not-other-type-unthemed-1.html
+# Initial mulet triage: parity with B2G/B2G Desktop
+# only valid on Android/B2G where type=number looks the same as type=text
+skip-if(!Android&&!B2G&&!Mulet) == number-same-as-text-unthemed.html number-same-as-text-unthemed.html
+# Initial mulet triage: parity with B2G/B2G Desktop
+
+# should look the same as type=text, except for the spin box
+skip == number-similar-to-text-unthemed.html number-similar-to-text-unthemed.html
+skip == number-similar-to-text-unthemed-rtl.html number-similar-to-text-unthemed-rtl.html
+skip == number-similar-to-text-unthemed-vertical-lr.html number-similar-to-text-unthemed-vertical-lr.html
+skip == number-similar-to-text-unthemed-vertical-rl.html number-similar-to-text-unthemed-vertical-rl.html
+
+# dynamic type changes:
+fuzzy-if(/^Windows\x20NT\x205\.1/.test(http.oscpu),64,4) fuzzy-if(cocoaWidget,63,4) fuzzy-if(skiaContent,2,5) == to-number-from-other-type-unthemed-1.html to-number-from-other-type-unthemed-1.html
+# skip fuzzy-if(skiaContent,2,5) == from-number-to-other-type-unthemed-1.html from-number-to-other-type-unthemed-1.html
+
+# dynamic value changes:
+# skip fuzzy-if(skiaContent,2,13) == show-value.html show-value.html
+
+# disabled
+skip == number-disabled.html number-disabled.html
+
+# auto width:
+skip == number-auto-width-1.html number-auto-width-1.html
+
+# min-height/max-height tests:
+skip skip-if(B2G||Mulet||Android) == number-min-height-1.html number-min-height-1.html
+# Initial mulet triage: parity with B2G/B2G Desktop
+skip skip-if(B2G||Mulet||Android) == number-min-height-2.html number-min-height-2.html
+# Initial mulet triage: parity with B2G/B2G Desktop
+skip skip-if(B2G||Mulet||Android) == number-max-height-1.html number-max-height-1.html
+# Initial mulet triage: parity with B2G/B2G Desktop
+skip skip-if(B2G||Mulet||Android) == number-max-height-2.html number-max-height-2.html
+# Initial mulet triage: parity with B2G/B2G Desktop
+
+# number of significant fractional digits:
+skip == number-significant-fractional-digits.html number-significant-fractional-digits.html
+
+# focus
+# autofocus is disabled on B2G
+# https://bugzilla.mozilla.org/show_bug.cgi?id=965763
+# skip skip-if(B2G||Mulet) fuzzy-if(skiaContent,2,5) needs-focus == focus-handling.html focus-handling.html
+# Initial mulet triage: parity with B2G/B2G Desktop
+
+# select
+skip == number-selected.html number-selected.html
+
+# pseudo-elements not usable from content:
+skip == number-pseudo-elements.html number-pseudo-elements.html
+
+skip == number-placeholder.html number-placeholder.html
+
+# check that if the anonymous text control is reframed, we reframe the whole
+# number control (the fuzzy is for the top-right and bottom-left of the border
+# bevel which gets slightly different antialiasing after invalidation):
+skip == number-reframe-anon-text-field.html number-reframe-anon-text-field.html
+
+skip == pseudo-classes.html pseudo-classes.html
diff --git a/layout/reftests/forms/input/number/reftest.list b/layout/reftests/forms/input/number/reftest.list
new file mode 100644
index 000000000..ecf05ce15
--- /dev/null
+++ b/layout/reftests/forms/input/number/reftest.list
@@ -0,0 +1,54 @@
+default-preferences pref(dom.forms.number,true)
+
+# sanity checks:
+# not valid on Android where type=number looks like type=text
+skip-if(Android) != not-other-type-unthemed-1.html not-other-type-unthemed-1a-notref.html
+skip-if(Android) != not-other-type-unthemed-1.html not-other-type-unthemed-1b-notref.html
+# only valid on Android where type=number looks the same as type=text
+skip-if(!Android) == number-same-as-text-unthemed.html number-same-as-text-unthemed-ref.html
+
+# should look the same as type=text, except for the spin box
+== number-similar-to-text-unthemed.html number-similar-to-text-unthemed-ref.html
+== number-similar-to-text-unthemed-rtl.html number-similar-to-text-unthemed-rtl-ref.html
+== number-similar-to-text-unthemed-vertical-lr.html number-similar-to-text-unthemed-vertical-lr-ref.html
+== number-similar-to-text-unthemed-vertical-rl.html number-similar-to-text-unthemed-vertical-rl-ref.html
+
+# dynamic type changes:
+fuzzy-if(/^Windows\x20NT\x205\.1/.test(http.oscpu),64,4) fuzzy-if(cocoaWidget,63,4) fuzzy-if(skiaContent,2,5) == to-number-from-other-type-unthemed-1.html to-number-from-other-type-unthemed-1-ref.html
+fuzzy-if(skiaContent,2,5) == from-number-to-other-type-unthemed-1.html from-number-to-other-type-unthemed-1-ref.html
+
+# dynamic value changes:
+fuzzy-if(skiaContent,2,13) == show-value.html show-value-ref.html
+
+# disabled
+== number-disabled.html number-disabled-ref.html
+
+# auto width:
+== number-auto-width-1.html number-auto-width-1-ref.html
+
+# min-height/max-height tests:
+skip-if(Android) == number-min-height-1.html number-min-height-1-ref.html
+skip-if(Android) == number-min-height-2.html number-min-height-2-ref.html
+skip-if(Android) == number-max-height-1.html number-max-height-1-ref.html
+skip-if(Android) == number-max-height-2.html number-max-height-2-ref.html
+
+# number of significant fractional digits:
+== number-significant-fractional-digits.html number-significant-fractional-digits-ref.html
+
+# focus
+fuzzy-if(skiaContent,2,5) needs-focus == focus-handling.html focus-handling-ref.html
+
+# select
+== number-selected.html number-selected-ref.html
+
+# pseudo-elements not usable from content:
+== number-pseudo-elements.html number-pseudo-elements-ref.html
+
+== number-placeholder.html number-placeholder-ref.html
+
+# check that if the anonymous text control is reframed, we reframe the whole
+# number control (the fuzzy is for the top-right and bottom-left of the border
+# bevel which gets slightly different antialiasing after invalidation):
+fuzzy(128,4) == number-reframe-anon-text-field.html number-reframe-anon-text-field-ref.html
+
+== pseudo-classes.html about:blank
diff --git a/layout/reftests/forms/input/number/show-value-ref.html b/layout/reftests/forms/input/number/show-value-ref.html
new file mode 100644
index 000000000..c3d2c5564
--- /dev/null
+++ b/layout/reftests/forms/input/number/show-value-ref.html
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="utf-8">
+ <style>
+
+input {
+ -moz-appearance: none;
+}
+
+ </style>
+ </head>
+ <body>
+ <input value='142'><br>
+ <input value='142'><br>
+ <input value='142'><br>
+ <input value='142'><br>
+ <input value='142'><br>
+ <form>
+ <input value='142'>
+ </form>
+ <!-- div to cover spin box area for type=number to type=text comparison -->
+ <div style="display:block; position:absolute; background-color:black; width:200px; height:400px; top:0px; left:100px;">
+ </body>
+</html>
+
diff --git a/layout/reftests/forms/input/number/show-value.html b/layout/reftests/forms/input/number/show-value.html
new file mode 100644
index 000000000..5aae9922e
--- /dev/null
+++ b/layout/reftests/forms/input/number/show-value.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<html class='reftest-wait'>
+ <head>
+ <meta charset="utf-8">
+ <style>
+
+input {
+ -moz-appearance: none;
+}
+
+ </style>
+ <script>
+// Using "142" as the magic number as "1" in a monospace font should not have
+// stray leading or trailing antialised pixels that get clipped unexpectedly.
+
+function run() {
+ var numbers = document.getElementsByTagName('input');
+ numbers[2].style.display = 'inline-block'; // none -> inline-block
+ numbers[3].setAttribute('value', '142');
+ numbers[4].value = '142';
+ numbers[5].varue = '1337'; // deliberately misspelt - should not set value
+ document.forms[0].reset(); // numbers[5] value should be 42 again.
+ document.documentElement.className = '';
+}
+
+document.addEventListener("MozReftestInvalidate", run);
+
+ </script>
+ </head>
+ <body onload="run();">
+ <input type='number' value='142'><br>
+ <input value='142' type='number'><br>
+ <input type='number' value='142' style="display: none;"><br>
+ <input type='number' value='1337'><br>
+ <input type='number' value='1337'><br>
+ <form>
+ <input type='number' value='142'>
+ </form>
+ <!-- div to cover spin box area for type=number to type=text comparison -->
+ <div style="display:block; position:absolute; background-color:black; width:200px; height:400px; top:0px; left:100px;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/to-number-from-other-type-unthemed-1-ref.html b/layout/reftests/forms/input/number/to-number-from-other-type-unthemed-1-ref.html
new file mode 100644
index 000000000..263aeff1f
--- /dev/null
+++ b/layout/reftests/forms/input/number/to-number-from-other-type-unthemed-1-ref.html
@@ -0,0 +1,6 @@
+<!DOCTYPE html>
+<html>
+ <body>
+ <input type="number" style="-moz-appearance:none;">
+ </body>
+</html>
diff --git a/layout/reftests/forms/input/number/to-number-from-other-type-unthemed-1.html b/layout/reftests/forms/input/number/to-number-from-other-type-unthemed-1.html
new file mode 100644
index 000000000..b0beffa56
--- /dev/null
+++ b/layout/reftests/forms/input/number/to-number-from-other-type-unthemed-1.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+ <!-- Test: input element changed to number state doesn't look like checkbox state -->
+ <script type="text/javascript">
+ function setToNumber()
+ {
+ document.getElementById('i').type='number';
+ document.documentElement.className = '';
+ }
+ document.addEventListener("MozReftestInvalidate", setToNumber);
+ </script>
+ <body>
+ <input type='checkbox' id='i' style="-moz-appearance:none;">
+ </body>
+</html>