summaryrefslogtreecommitdiffstats
path: root/layout/reftests/outline
diff options
context:
space:
mode:
Diffstat (limited to 'layout/reftests/outline')
-rw-r--r--layout/reftests/outline/outline-and-3d-transform-1-ref.html28
-rw-r--r--layout/reftests/outline/outline-and-3d-transform-1a.html40
-rw-r--r--layout/reftests/outline/outline-and-3d-transform-1b.html40
-rw-r--r--layout/reftests/outline/outline-and-3d-transform-2-ref.html36
-rw-r--r--layout/reftests/outline/outline-and-3d-transform-2.html35
-rw-r--r--layout/reftests/outline/outline-and-box-shadow-ref.html13
-rw-r--r--layout/reftests/outline/outline-and-box-shadow.html13
-rw-r--r--layout/reftests/outline/outline-auto-001-ref.html26
-rw-r--r--layout/reftests/outline/outline-auto-001-solid-ref.html26
-rw-r--r--layout/reftests/outline/outline-auto-001.html26
-rw-r--r--layout/reftests/outline/outline-initial-1-ref.html5
-rw-r--r--layout/reftests/outline/outline-initial-1a.html4
-rw-r--r--layout/reftests/outline/outline-initial-1b.html5
-rw-r--r--layout/reftests/outline/outline-overflow-block-abspos.html14
-rw-r--r--layout/reftests/outline/outline-overflow-block-float.html14
-rw-r--r--layout/reftests/outline/outline-overflow-block-ref.html12
-rw-r--r--layout/reftests/outline/outline-overflow-inlineblock-abspos.html14
-rw-r--r--layout/reftests/outline/outline-overflow-inlineblock-float.html14
-rw-r--r--layout/reftests/outline/outline-overflow-inlineblock-ref.html12
-rw-r--r--layout/reftests/outline/reftest-stylo.list15
-rw-r--r--layout/reftests/outline/reftest.list12
21 files changed, 404 insertions, 0 deletions
diff --git a/layout/reftests/outline/outline-and-3d-transform-1-ref.html b/layout/reftests/outline/outline-and-3d-transform-1-ref.html
new file mode 100644
index 000000000..30fa7eabe
--- /dev/null
+++ b/layout/reftests/outline/outline-and-3d-transform-1-ref.html
@@ -0,0 +1,28 @@
+<!DOCTYPE HTML>
+<title>Testcase for outline around 3-D transform</title>
+<style>
+
+html, body { margin: 0; padding: 0; border: none }
+
+div {
+ width: 100px;
+ height: 100px;
+}
+
+body > div {
+ margin-top: 200px;
+ margin-left: 200px;
+ transform-style: flat;
+ position: relative;
+}
+
+body > div > div {
+ position: absolute; top: 0; left: 0;
+ height: 150px; width: 150px; top: -25px; left: -25px;
+ background: rgba(255, 255, 0, 0.4);
+ outline: 2px dashed blue;
+}
+
+</style>
+
+<div><div></div></div>
diff --git a/layout/reftests/outline/outline-and-3d-transform-1a.html b/layout/reftests/outline/outline-and-3d-transform-1a.html
new file mode 100644
index 000000000..6b7926c2d
--- /dev/null
+++ b/layout/reftests/outline/outline-and-3d-transform-1a.html
@@ -0,0 +1,40 @@
+<!DOCTYPE HTML>
+<title>Testcase for outline around 3-D transform</title>
+<style>
+
+html, body { margin: 0; padding: 0; border: none }
+
+div {
+ width: 100px;
+ height: 100px;
+}
+
+body > div {
+ margin-top: 200px;
+ margin-left: 200px;
+ transform-style: flat;
+ outline: 2px dashed blue;
+}
+
+body > div > div {
+ transform: rotateX(30deg);
+ transform-origin: 50% 50%;
+ transform-style: preserve-3d;
+}
+
+body > div > div > div {
+ transform: rotateX(30deg);
+ transform-origin: 50% 50%;
+ transform-style: preserve-3d;
+}
+
+body > div > div > div > div {
+ transform: scale(1.5, 3);
+ transform-origin: 50% 50%;
+ background: rgba(255, 255, 0, 0.4);
+}
+
+
+</style>
+
+<div><div><div><div></div></div></div></div>
diff --git a/layout/reftests/outline/outline-and-3d-transform-1b.html b/layout/reftests/outline/outline-and-3d-transform-1b.html
new file mode 100644
index 000000000..d2e2316de
--- /dev/null
+++ b/layout/reftests/outline/outline-and-3d-transform-1b.html
@@ -0,0 +1,40 @@
+<!DOCTYPE HTML>
+<title>Testcase for outline around 3-D transform</title>
+<style>
+
+html, body { margin: 0; padding: 0; border: none }
+
+div {
+ width: 100px;
+ height: 100px;
+}
+
+body > div {
+ margin-top: 200px;
+ margin-left: 200px;
+ transform-style: flat;
+ outline: 2px dashed blue;
+}
+
+body > div > div {
+ transform: rotateX(90deg);
+ transform-origin: 50% 50%;
+ transform-style: preserve-3d;
+}
+
+body > div > div > div {
+ transform: rotateX(-30deg);
+ transform-origin: 50% 50%;
+ transform-style: preserve-3d;
+}
+
+body > div > div > div > div {
+ transform: scale(1.5, 3);
+ transform-origin: 50% 50%;
+ background: rgba(255, 255, 0, 0.4);
+}
+
+
+</style>
+
+<div><div><div><div></div></div></div></div>
diff --git a/layout/reftests/outline/outline-and-3d-transform-2-ref.html b/layout/reftests/outline/outline-and-3d-transform-2-ref.html
new file mode 100644
index 000000000..93a45d8f8
--- /dev/null
+++ b/layout/reftests/outline/outline-and-3d-transform-2-ref.html
@@ -0,0 +1,36 @@
+<!DOCTYPE HTML>
+<title>Testcase for outline around 3-D transform</title>
+<style>
+
+html, body { margin: 0; padding: 0; border: none }
+
+div {
+ width: 100px;
+ height: 100px;
+}
+
+body > div {
+ margin-top: 200px;
+ margin-left: 200px;
+ transform-style: flat;
+}
+
+body > div > div {
+ transform: rotateX(30deg);
+ transform-origin: 50% 50%;
+ transform-style: preserve-3d;
+ border: 5px solid green;
+ margin: -5px;
+}
+
+body > div > div > div {
+ transform: rotateX(30deg);
+ width: 50px; margin-left: 20px; margin-top: -5px;
+ transform-origin: 50% 50%;
+ transform-style: preserve-3d;
+ border: 5px solid blue;
+}
+
+</style>
+
+<div><div><div></div></div></div>
diff --git a/layout/reftests/outline/outline-and-3d-transform-2.html b/layout/reftests/outline/outline-and-3d-transform-2.html
new file mode 100644
index 000000000..724366971
--- /dev/null
+++ b/layout/reftests/outline/outline-and-3d-transform-2.html
@@ -0,0 +1,35 @@
+<!DOCTYPE HTML>
+<title>Testcase for outline around 3-D transform</title>
+<style>
+
+html, body { margin: 0; padding: 0; border: none }
+
+div {
+ width: 100px;
+ height: 100px;
+}
+
+body > div {
+ margin-top: 200px;
+ margin-left: 200px;
+ transform-style: flat;
+}
+
+body > div > div {
+ transform: rotateX(30deg);
+ transform-origin: 50% 50%;
+ transform-style: preserve-3d;
+ outline: 5px solid green;
+}
+
+body > div > div > div {
+ transform: rotateX(30deg);
+ width: 50px; margin-left: 25px;
+ transform-origin: 50% 50%;
+ transform-style: preserve-3d;
+ outline: 5px solid blue;
+}
+
+</style>
+
+<div><div><div></div></div></div>
diff --git a/layout/reftests/outline/outline-and-box-shadow-ref.html b/layout/reftests/outline/outline-and-box-shadow-ref.html
new file mode 100644
index 000000000..0d4a9ffcf
--- /dev/null
+++ b/layout/reftests/outline/outline-and-box-shadow-ref.html
@@ -0,0 +1,13 @@
+<!DOCTYPE HTML>
+<title>outline and box-shadow</title>
+<style>
+html, body { margin: 0; padding: 0 }
+p {
+ margin: 48px;
+ border: 2px solid blue;
+ padding: 5px; /* ensure no font overhang */
+ background: yellow; color: black;
+ box-shadow: 10px 10px 10px 0px black;
+}
+</style>
+<p>The outline should be adjacent to the background.</p>
diff --git a/layout/reftests/outline/outline-and-box-shadow.html b/layout/reftests/outline/outline-and-box-shadow.html
new file mode 100644
index 000000000..3bb717200
--- /dev/null
+++ b/layout/reftests/outline/outline-and-box-shadow.html
@@ -0,0 +1,13 @@
+<!DOCTYPE HTML>
+<title>outline and box-shadow</title>
+<style>
+html, body { margin: 0; padding: 0 }
+p {
+ margin: 50px;
+ outline: 2px solid blue;
+ padding: 5px; /* ensure no font overhang */
+ background: yellow; color: black;
+ box-shadow: 10px 10px 10px 2px black;
+}
+</style>
+<p>The outline should be adjacent to the background.</p>
diff --git a/layout/reftests/outline/outline-auto-001-ref.html b/layout/reftests/outline/outline-auto-001-ref.html
new file mode 100644
index 000000000..2055880eb
--- /dev/null
+++ b/layout/reftests/outline/outline-auto-001-ref.html
@@ -0,0 +1,26 @@
+<!DOCTYPE HTML>
+<html><head>
+ <title>Testcase for outline:auto</title>
+ <style type="text/css">
+
+ html,body {
+ color:black; background-color:white; padding:10px; margin:0;
+ }
+
+ .a { outline:auto; width:190px; height:10px; background:black; }
+ .w { border:solid black; border-width:5px; margin:20px; width:190px; }
+ </style>
+</head>
+<body>
+
+<div class="w"><div class="a" style="outline-width:10px; outline-offset:5px;"></div></div>
+<div class="w"><div class="a" style="outline-width:10px; outline-offset:10px;"></div></div>
+<div class="w"><div class="a" style="outline-width:10px; outline-offset:0px;"></div></div>
+<div class="w"><div class="a" style="outline-width:15px; outline-offset:6px;"></div></div>
+<div class="w"><div class="a" style="outline-width:15px; outline-offset:4px;"></div></div>
+<div class="w"><div class="a" style="outline-width:11px; outline-offset:5px;"></div></div>
+<div class="w"><div class="a" style="outline-width:11px; outline-offset:10px;"></div></div>
+<div class="w"><div class="a" style="outline-width:11px; outline-offset:0px;"></div></div>
+
+</body>
+</html>
diff --git a/layout/reftests/outline/outline-auto-001-solid-ref.html b/layout/reftests/outline/outline-auto-001-solid-ref.html
new file mode 100644
index 000000000..d9a0b851c
--- /dev/null
+++ b/layout/reftests/outline/outline-auto-001-solid-ref.html
@@ -0,0 +1,26 @@
+<!DOCTYPE HTML>
+<html><head>
+ <title>Testcase for outline:auto</title>
+ <style type="text/css">
+
+ html,body {
+ color:black; background-color:white; padding:10px; margin:0;
+ }
+
+ div { outline:solid; width:200px; margin:20px; height:20px; background:black; }
+ .b div { border:solid blue; border-width: 1px 3px 5px 7px; }
+ </style>
+</head>
+<body>
+
+<div style="outline-width:0; outline-offset:0;"></div>
+<div style="outline-width:0; outline-offset:5px;"></div>
+<div style="outline-width:0; outline-offset:-5px;"></div>
+<div style="outline-width:5px; outline-offset:1px;"></div>
+<div style="outline-width:5px; outline-offset:-1px;"></div>
+<div style="outline-width:1px; outline-offset:0;"></div>
+<div style="outline-width:1px; outline-offset:5px;"></div>
+<div style="outline-width:1px; outline-offset:-5px;"></div>
+
+</body>
+</html>
diff --git a/layout/reftests/outline/outline-auto-001.html b/layout/reftests/outline/outline-auto-001.html
new file mode 100644
index 000000000..2f15008c0
--- /dev/null
+++ b/layout/reftests/outline/outline-auto-001.html
@@ -0,0 +1,26 @@
+<!DOCTYPE HTML>
+<html><head>
+ <title>Testcase for outline:auto</title>
+ <style type="text/css">
+
+ html,body {
+ color:black; background-color:white; padding:10px; margin:0;
+ }
+
+ div { outline:auto; width:200px; margin:20px; height:20px; background:black; }
+ .b div { border:solid blue; border-width: 1px 3px 5px 7px; }
+ </style>
+</head>
+<body>
+
+<div style="outline-width:0; outline-offset:0;"></div>
+<div style="outline-width:0; outline-offset:5px;"></div>
+<div style="outline-width:0; outline-offset:-5px;"></div>
+<div style="outline-width:5px; outline-offset:1px;"></div>
+<div style="outline-width:5px; outline-offset:-1px;"></div>
+<div style="outline-width:1px; outline-offset:0;"></div>
+<div style="outline-width:1px; outline-offset:5px;"></div>
+<div style="outline-width:1px; outline-offset:-5px;"></div>
+
+</body>
+</html>
diff --git a/layout/reftests/outline/outline-initial-1-ref.html b/layout/reftests/outline/outline-initial-1-ref.html
new file mode 100644
index 000000000..53bcb0c4a
--- /dev/null
+++ b/layout/reftests/outline/outline-initial-1-ref.html
@@ -0,0 +1,5 @@
+<!DOCTYPE html>
+<span style="outline-width: 2px; outline-style: solid; color: green;
+ outline-color: green">
+ This should have a green outline.
+</span>
diff --git a/layout/reftests/outline/outline-initial-1a.html b/layout/reftests/outline/outline-initial-1a.html
new file mode 100644
index 000000000..461a8104e
--- /dev/null
+++ b/layout/reftests/outline/outline-initial-1a.html
@@ -0,0 +1,4 @@
+<!DOCTYPE html>
+<span style="outline-width: 2px; outline-style: solid; color: green">
+ This should have a green outline.
+</span>
diff --git a/layout/reftests/outline/outline-initial-1b.html b/layout/reftests/outline/outline-initial-1b.html
new file mode 100644
index 000000000..a01459af1
--- /dev/null
+++ b/layout/reftests/outline/outline-initial-1b.html
@@ -0,0 +1,5 @@
+<!DOCTYPE html>
+<span style="outline-width: 2px; outline-style: solid; color: green;
+ outline-color: initial">
+ This should have a green outline.
+</span>
diff --git a/layout/reftests/outline/outline-overflow-block-abspos.html b/layout/reftests/outline/outline-overflow-block-abspos.html
new file mode 100644
index 000000000..ed6af8cac
--- /dev/null
+++ b/layout/reftests/outline/outline-overflow-block-abspos.html
@@ -0,0 +1,14 @@
+<!DOCTYPE HTML>
+<title>outline goes around overflow, floats</title>
+<style>
+
+html, body { margin: 0; padding: 0; border: none }
+html { overflow:hidden /* avoid second reflow for scrollbars */ }
+
+body > div { margin: 100px; outline: 2px solid blue; position: relative }
+
+body > div > div { position: absolute; top: 0; left: 0; width: 100px; height: 100px }
+
+</style>
+<body>
+<div><div></div></div>
diff --git a/layout/reftests/outline/outline-overflow-block-float.html b/layout/reftests/outline/outline-overflow-block-float.html
new file mode 100644
index 000000000..19c61a287
--- /dev/null
+++ b/layout/reftests/outline/outline-overflow-block-float.html
@@ -0,0 +1,14 @@
+<!DOCTYPE HTML>
+<title>outline goes around overflow, floats</title>
+<style>
+
+html, body { margin: 0; padding: 0; border: none }
+html { overflow:hidden /* avoid second reflow for scrollbars */ }
+
+body > div { margin: 100px; outline: 2px solid blue }
+
+body > div > div { float: left; width: 100px; height: 100px }
+
+</style>
+<body>
+<div><div></div></div>
diff --git a/layout/reftests/outline/outline-overflow-block-ref.html b/layout/reftests/outline/outline-overflow-block-ref.html
new file mode 100644
index 000000000..9259a5da1
--- /dev/null
+++ b/layout/reftests/outline/outline-overflow-block-ref.html
@@ -0,0 +1,12 @@
+<!DOCTYPE HTML>
+<title>outline goes around overflow, floats</title>
+<style>
+
+html, body { margin: 0; padding: 0; border: none }
+html { overflow:hidden /* avoid second reflow for scrollbars */ }
+
+body > div { margin: 98px; border: 2px solid blue; height: 100px }
+
+</style>
+<body>
+<div></div>
diff --git a/layout/reftests/outline/outline-overflow-inlineblock-abspos.html b/layout/reftests/outline/outline-overflow-inlineblock-abspos.html
new file mode 100644
index 000000000..5d3eb67eb
--- /dev/null
+++ b/layout/reftests/outline/outline-overflow-inlineblock-abspos.html
@@ -0,0 +1,14 @@
+<!DOCTYPE HTML>
+<title>outline goes around overflow, floats</title>
+<style>
+
+html, body { margin: 0; padding: 0; border: none }
+html { overflow:hidden /* avoid second reflow for scrollbars */ }
+
+body > div { margin: 100px; outline: 2px solid blue; display: inline-block; height: 0; width: 0; position: relative }
+
+body > div > div { position: absolute; top: 0; left: 0; width: 100px; height: 100px }
+
+</style>
+<body>
+<div><div></div></div>
diff --git a/layout/reftests/outline/outline-overflow-inlineblock-float.html b/layout/reftests/outline/outline-overflow-inlineblock-float.html
new file mode 100644
index 000000000..c20a63e67
--- /dev/null
+++ b/layout/reftests/outline/outline-overflow-inlineblock-float.html
@@ -0,0 +1,14 @@
+<!DOCTYPE HTML>
+<title>outline goes around overflow, floats</title>
+<style>
+
+html, body { margin: 0; padding: 0; border: none }
+html { overflow:hidden /* avoid second reflow for scrollbars */ }
+
+body > div { margin: 100px; outline: 2px solid blue; display: inline-block; height: 0; width: 0 }
+
+body > div > div { float: left; width: 100px; height: 100px }
+
+</style>
+<body>
+<div><div></div></div>
diff --git a/layout/reftests/outline/outline-overflow-inlineblock-ref.html b/layout/reftests/outline/outline-overflow-inlineblock-ref.html
new file mode 100644
index 000000000..c7ad3174d
--- /dev/null
+++ b/layout/reftests/outline/outline-overflow-inlineblock-ref.html
@@ -0,0 +1,12 @@
+<!DOCTYPE HTML>
+<title>outline goes around overflow, floats</title>
+<style>
+
+html, body { margin: 0; padding: 0; border: none }
+html { overflow:hidden /* avoid second reflow for scrollbars */ }
+
+body > div { margin: 98px; border: 2px solid blue; height: 100px; width: 100px }
+
+</style>
+<body>
+<div></div>
diff --git a/layout/reftests/outline/reftest-stylo.list b/layout/reftests/outline/reftest-stylo.list
new file mode 100644
index 000000000..0cc5c462e
--- /dev/null
+++ b/layout/reftests/outline/reftest-stylo.list
@@ -0,0 +1,15 @@
+# DO NOT EDIT! This is a auto-generated temporary list for Stylo testing
+== outline-and-box-shadow.html outline-and-box-shadow.html
+== outline-and-3d-transform-1a.html outline-and-3d-transform-1a.html
+== outline-and-3d-transform-1b.html outline-and-3d-transform-1b.html
+fuzzy-if(Mulet||gtkWidget,136,120) fuzzy-if(Android,255,356) fuzzy-if(d2d,16,96) fuzzy-if(cocoaWidget,255,120) fuzzy-if(B2G,128,60) fuzzy-if(winWidget,255,216) == outline-and-3d-transform-2.html outline-and-3d-transform-2.html
+== outline-overflow-block-abspos.html outline-overflow-block-abspos.html
+== outline-overflow-block-float.html outline-overflow-block-float.html
+== outline-overflow-inlineblock-abspos.html outline-overflow-inlineblock-abspos.html
+== outline-overflow-inlineblock-float.html outline-overflow-inlineblock-float.html
+pref(layout.css.outline-style-auto.enabled,true) skip-if((!gtkWidget&&!winWidget&&!cocoaWidget)||Mulet) == outline-auto-001.html outline-auto-001.html
+# only works on platforms that supports NS_THEME_FOCUS_OUTLINE
+# bug 1141511: Disable some gtkWidget-dependant reftests on Mulet
+pref(layout.css.outline-style-auto.enabled,false) == outline-auto-001.html outline-auto-001.html
+== outline-initial-1a.html outline-initial-1a.html
+== outline-initial-1b.html outline-initial-1b.html
diff --git a/layout/reftests/outline/reftest.list b/layout/reftests/outline/reftest.list
new file mode 100644
index 000000000..b3fd2634f
--- /dev/null
+++ b/layout/reftests/outline/reftest.list
@@ -0,0 +1,12 @@
+== outline-and-box-shadow.html outline-and-box-shadow-ref.html
+== outline-and-3d-transform-1a.html outline-and-3d-transform-1-ref.html
+== outline-and-3d-transform-1b.html outline-and-3d-transform-1-ref.html
+fuzzy-if(gtkWidget,136,120) fuzzy-if(Android,255,356) fuzzy-if(d2d,16,96) fuzzy-if(cocoaWidget,255,120) fuzzy-if(winWidget,255,216) == outline-and-3d-transform-2.html outline-and-3d-transform-2-ref.html
+== outline-overflow-block-abspos.html outline-overflow-block-ref.html
+== outline-overflow-block-float.html outline-overflow-block-ref.html
+== outline-overflow-inlineblock-abspos.html outline-overflow-inlineblock-ref.html
+== outline-overflow-inlineblock-float.html outline-overflow-inlineblock-ref.html
+pref(layout.css.outline-style-auto.enabled,true) skip-if(!gtkWidget&&!winWidget&&!cocoaWidget) == outline-auto-001.html outline-auto-001-ref.html # only works on platforms that supports NS_THEME_FOCUS_OUTLINE
+pref(layout.css.outline-style-auto.enabled,false) == outline-auto-001.html outline-auto-001-solid-ref.html
+== outline-initial-1a.html outline-initial-1-ref.html
+== outline-initial-1b.html outline-initial-1-ref.html