summaryrefslogtreecommitdiffstats
path: root/widget/reftests
diff options
context:
space:
mode:
Diffstat (limited to '')
-rw-r--r--widget/reftests/664925.xhtml1
-rw-r--r--widget/reftests/meter-fallback-default-style-ref.html57
-rw-r--r--widget/reftests/meter-fallback-default-style.html21
-rw-r--r--widget/reftests/meter-native-style-ref.html19
-rw-r--r--widget/reftests/meter-native-style.html18
-rw-r--r--widget/reftests/meter-vertical-native-style-ref.html14
-rw-r--r--widget/reftests/meter-vertical-native-style.html13
-rw-r--r--widget/reftests/progressbar-fallback-default-style-ref.html33
-rw-r--r--widget/reftests/progressbar-fallback-default-style.html20
-rw-r--r--widget/reftests/reftest.list9
-rw-r--r--widget/reftests/scaled-scrollbar.html6
-rw-r--r--widget/reftests/scrollbar-buttons.html4
12 files changed, 215 insertions, 0 deletions
diff --git a/widget/reftests/664925.xhtml b/widget/reftests/664925.xhtml
new file mode 100644
index 0000000000..b4a11a7386
--- /dev/null
+++ b/widget/reftests/664925.xhtml
@@ -0,0 +1 @@
+<html xmlns="http://www.w3.org/1999/xhtml"><div><td style="-moz-appearance: progressbar;"></td></div></html>
diff --git a/widget/reftests/meter-fallback-default-style-ref.html b/widget/reftests/meter-fallback-default-style-ref.html
new file mode 100644
index 0000000000..cf6c2e521e
--- /dev/null
+++ b/widget/reftests/meter-fallback-default-style-ref.html
@@ -0,0 +1,57 @@
+<!DOCTYPE html>
+<html>
+ <style>
+ div.meter-element {
+ /**
+ * The purpose of this test is to not show the native style.
+ * -moz-appearance: meterbar;
+ */
+ display: inline-block;
+ height: 1em;
+ width: 5em;
+ vertical-align: -0.2em;
+
+ background: linear-gradient(#e6e6e6, #e6e6e6, #eeeeee 20%, #cccccc 45%, #cccccc 55%);
+ }
+
+ div.meter-bar {
+ /**
+ * The purpose of this test is to not show the native style.
+ * -moz-appearance: meterchunk;
+ */
+
+ height: 100%;
+ width: 100%;
+
+ background: linear-gradient(#ad7, #ad7, #cea 20%, #7a3 45%, #7a3 55%);
+ }
+
+ div.meter-element { padding: 5px; }
+ body > div:nth-child(1) { -moz-appearance: none; }
+ body > div:nth-child(2) > .meter-bar { -moz-appearance: none; }
+ body > div:nth-child(3) { background: red; }
+ body > div:nth-child(4) > .meter-bar { background: red; }
+ body > div:nth-child(5) { border: 2px solid red; }
+ body > div:nth-child(6) > .meter-bar { border: 5px solid red; width: calc(100% - 10px); }
+ </style>
+ <body>
+ <div class="meter-element">
+ <div class="meter-bar"></div>
+ </div>
+ <div class="meter-element">
+ <div class="meter-bar"></div>
+ </div>
+ <div class="meter-element">
+ <div class="meter-bar"></div>
+ </div>
+ <div class="meter-element">
+ <div class="meter-bar"></div>
+ </div>
+ <div class="meter-element">
+ <div class="meter-bar"></div>
+ </div>
+ <div class="meter-element">
+ <div class="meter-bar"></div>
+ </div>
+ </body>
+</html>
diff --git a/widget/reftests/meter-fallback-default-style.html b/widget/reftests/meter-fallback-default-style.html
new file mode 100644
index 0000000000..c59fc265e4
--- /dev/null
+++ b/widget/reftests/meter-fallback-default-style.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html>
+ <style>
+ meter { padding: 5px }
+ body > meter:nth-child(1) { -moz-appearance: none; }
+ body > meter:nth-child(2)::-moz-meter-bar { -moz-appearance: none; }
+ body > meter:nth-child(3) { background: red; }
+ body > meter:nth-child(4)::-moz-meter-bar { background: red; }
+ body > meter:nth-child(5) { border: 2px solid red; }
+ body > meter:nth-child(6) { overflow: visible; }
+ body > meter:nth-child(6)::-moz-meter-bar { border: 5px solid red; }
+ </style>
+ <body>
+ <meter value=1></meter>
+ <meter value=1></meter>
+ <meter value=1></meter>
+ <meter value=1></meter>
+ <meter value=1></meter>
+ <meter value=1></meter>
+ </body>
+</html>
diff --git a/widget/reftests/meter-native-style-ref.html b/widget/reftests/meter-native-style-ref.html
new file mode 100644
index 0000000000..f54ec0bbac
--- /dev/null
+++ b/widget/reftests/meter-native-style-ref.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html>
+ <body>
+ <!-- Empty meter, no bar. -->
+ <meter></meter>
+ <!-- Full meter green colored. -->
+ <meter min=0 low=0 high=1 optimum=2 max=10 value=10></meter>
+ <!-- Full meter orange colored. -->
+ <meter min=0 low=0 high=1 optimum=1 max=10 value=10></meter>
+ <!-- Full meter red colored. -->
+ <meter min=0 low=1 high=2 optimum=0 max=10 value=10></meter>
+ <!-- Half-empty orange colored. -->
+ <meter min=0 low=0 high=1 optimum=0 max=10 value=5></meter>
+ <!-- Half-empty orange colored. -->
+ <meter min=0 low=0 high=1 optimum=0 max=10 value=5></meter>
+ <!-- With RTL, the bar should begin on the right. -->
+ <meter style="transform: scale(-1, 1);" value=0.5></meter>
+ </body>
+</html>
diff --git a/widget/reftests/meter-native-style.html b/widget/reftests/meter-native-style.html
new file mode 100644
index 0000000000..91342772fe
--- /dev/null
+++ b/widget/reftests/meter-native-style.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+ <body>
+ <meter vaue=0></meter>
+ <!-- Should be green. -->
+ <meter min=0 low=0 high=10 optimum=10 max=10 value=10></meter>
+ <!-- Should be orange. -->
+ <meter min=0 low=9 high=10 optimum=8 max=10 value=10></meter>
+ <!-- Should be red. -->
+ <meter min=0 low=8 high=9 optimum=0 max=10 value=10></meter>
+ <!-- Half-full orange. -->
+ <meter min=0 low=3 high=4 optimum=4 max=10 value=5></meter>
+ <!-- Half-full orange. -->
+ <meter min=0 low=9 high=10 optimum=10 max=10 value=5></meter>
+ <!-- Test RTL -->
+ <meter dir='rtl' value=0.5></meter>
+ </body>
+</html>
diff --git a/widget/reftests/meter-vertical-native-style-ref.html b/widget/reftests/meter-vertical-native-style-ref.html
new file mode 100644
index 0000000000..e771d3fd76
--- /dev/null
+++ b/widget/reftests/meter-vertical-native-style-ref.html
@@ -0,0 +1,14 @@
+<html>
+ <style>
+ meter:nth-child(1) { transform: rotate(-90deg) translate(-2em, -2em); }
+ meter:nth-child(2) { transform: rotate(-90deg) translate(-2em, -6em); }
+ meter:nth-child(3) { transform: rotate(-90deg) translate(-2em, -10em); }
+ meter:nth-child(4) { transform: rotate(-90deg) translate(-2em, -14em); }
+ meter:nth-child(5) { transform: rotate(-90deg) translate(-2em, -18em); }
+ meter:nth-child(6) { transform: rotate(-90deg) translate(-2em, -22em); }
+ meter:nth-child(7) { transform: rotate(-90deg) translate(-2em, -26em); }
+ </style>
+<body>
+<meter></meter><meter min=0 low=0 high=1 optimum=2 max=10 value=10></meter><meter min=0 low=0 high=1 optimum=1 max=10 value=10></meter><meter min=0 low=1 high=2 optimum=0 max=10 value=10></meter><meter min=0 low=0 high=1 optimum=0 max=10 value=5></meter><meter min=0 low=0 high=1 optimum=0 max=10 value=5></meter><meter value=0.5></meter>
+</body>
+</html>
diff --git a/widget/reftests/meter-vertical-native-style.html b/widget/reftests/meter-vertical-native-style.html
new file mode 100644
index 0000000000..ca0ca1b933
--- /dev/null
+++ b/widget/reftests/meter-vertical-native-style.html
@@ -0,0 +1,13 @@
+<html>
+ <style>
+ meter { -moz-orient: vertical; }
+ </style>
+ <body>
+<!-- For some reasons, the ref has a small offset when there are spaces between meters.
+ Given that we don't want to test transform and even a perfect match but just
+ the general rendering, we are going to keep this dirty test.
+ It's very similar to the non-vertical test with a difference, for the RTL: RTL
+ does not apply for vertical meters. -->
+<meter vaue=0></meter><meter min=0 low=0 high=10 optimum=10 max=10 value=10></meter><meter min=0 low=9 high=10 optimum=8 max=10 value=10></meter><meter min=0 low=8 high=9 optimum=0 max=10 value=10></meter><meter min=0 low=3 high=4 optimum=4 max=10 value=5></meter><meter min=0 low=9 high=10 optimum=10 max=10 value=5></meter><meter value=0.5 dir=rtl></meter>
+ </body>
+</html>
diff --git a/widget/reftests/progressbar-fallback-default-style-ref.html b/widget/reftests/progressbar-fallback-default-style-ref.html
new file mode 100644
index 0000000000..22950ec583
--- /dev/null
+++ b/widget/reftests/progressbar-fallback-default-style-ref.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html>
+ <link rel='stylesheet' href='resource://reftest/progress.css'>
+ <style>
+ div.progress-element { padding: 5px; }
+ body > div:nth-child(1) { -moz-appearance: none; }
+ body > div:nth-child(2) > .progress-bar { -moz-appearance: none; }
+ body > div:nth-child(3) { background-color: red; }
+ body > div:nth-child(4) > .progress-bar { background-color: red; }
+ body > div:nth-child(5) { border: 2px solid red; }
+ body > div:nth-child(6) > .progress-bar { border: 5px solid red; }
+ </style>
+ <body>
+ <div class="progress-element">
+ <div class="progress-bar"></div>
+ </div>
+ <div class="progress-element">
+ <div class="progress-bar"></div>
+ </div>
+ <div class="progress-element">
+ <div class="progress-bar"></div>
+ </div>
+ <div class="progress-element">
+ <div class="progress-bar"></div>
+ </div>
+ <div class="progress-element">
+ <div class="progress-bar"></div>
+ </div>
+ <div class="progress-element">
+ <div class="progress-bar"></div>
+ </div>
+ </body>
+</html>
diff --git a/widget/reftests/progressbar-fallback-default-style.html b/widget/reftests/progressbar-fallback-default-style.html
new file mode 100644
index 0000000000..7594e65556
--- /dev/null
+++ b/widget/reftests/progressbar-fallback-default-style.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html>
+ <style>
+ progress { padding: 5px }
+ body > progress:nth-child(1) { -moz-appearance: none; }
+ body > progress:nth-child(2)::-moz-progress-bar { -moz-appearance: none; }
+ body > progress:nth-child(3) { background-color: red; }
+ body > progress:nth-child(4)::-moz-progress-bar { background-color: red; }
+ body > progress:nth-child(5) { border: 2px solid red; }
+ body > progress:nth-child(6)::-moz-progress-bar { border: 5px solid red; }
+ </style>
+ <body>
+ <progress></progress>
+ <progress></progress>
+ <progress></progress>
+ <progress></progress>
+ <progress></progress>
+ <progress></progress>
+ </body>
+</html>
diff --git a/widget/reftests/reftest.list b/widget/reftests/reftest.list
new file mode 100644
index 0000000000..dc788a31aa
--- /dev/null
+++ b/widget/reftests/reftest.list
@@ -0,0 +1,9 @@
+== progressbar-fallback-default-style.html progressbar-fallback-default-style-ref.html
+fuzzy(0-31,0-67) == meter-native-style.html meter-native-style-ref.html
+fuzzy(0-11,0-342) == meter-vertical-native-style.html meter-vertical-native-style-ref.html # dithering
+== meter-fallback-default-style.html meter-fallback-default-style-ref.html
+load 664925.xhtml
+pref(apz.allow_zooming,true) pref(ui.useOverlayScrollbars,0) skip-if(!cocoaWidget) != scaled-scrollbar.html about:blank
+
+# Test that scrollbar buttons are inhibited on Linux using the non-native theme.
+skip-if(!gtkWidget) pref(widget.non-native-theme.enabled,true) test-pref(ui.scrollArrowStyle,4097) ref-pref(ui.scrollArrowStyle,0) == scrollbar-buttons.html scrollbar-buttons.html
diff --git a/widget/reftests/scaled-scrollbar.html b/widget/reftests/scaled-scrollbar.html
new file mode 100644
index 0000000000..f94df78420
--- /dev/null
+++ b/widget/reftests/scaled-scrollbar.html
@@ -0,0 +1,6 @@
+<!DOCTYPE html>
+<html reftest-resolution="2.0" style="scrollbar-width: none;">
+<div style="overflow: scroll; width: 300px; height: 300px">
+ <div style="width: 1000px; height: 1000px"></div>
+</div>
+</html>
diff --git a/widget/reftests/scrollbar-buttons.html b/widget/reftests/scrollbar-buttons.html
new file mode 100644
index 0000000000..d54218272d
--- /dev/null
+++ b/widget/reftests/scrollbar-buttons.html
@@ -0,0 +1,4 @@
+<!DOCTYPE html>
+<div style="width: 200px; height: 200px; overflow: scroll;">
+ <div style="width: 400px; height: 400px;"></div>
+</div>
generated by cgit v1.2.3 (git 2.39.1) at 2024-11-27 06:00:27 +0000