diff options
Diffstat (limited to 'layout/reftests/forms/fieldset')
34 files changed, 1030 insertions, 0 deletions
diff --git a/layout/reftests/forms/fieldset/abs-pos-child-sizing-ref.html b/layout/reftests/forms/fieldset/abs-pos-child-sizing-ref.html new file mode 100644 index 000000000..405cfaf0a --- /dev/null +++ b/layout/reftests/forms/fieldset/abs-pos-child-sizing-ref.html @@ -0,0 +1,79 @@ +<!DOCTYPE HTML> +<html><head> + <meta charset="utf-8"> + <title>Testcase for bug 971653</title> + <style type="text/css"> + html,body { + color:black; background-color:white; font-size:16px; padding:0; margin:0; + } + +div { + position: absolute; + background: rgba(0,255,0,0.5); + top:0; bottom:0; + left:0; right:0; + z-index: 0; +} +c { + display: block; + background: blue; + height:100%; +} + +legend { height: 24px; } + +fieldset { + position: absolute; + border: 2px green solid; + width: 100px; + height: 100px; + margin-bottom:40px; +} + +#t1,#t3 { padding: 3px 5px 7px 11px; } +#t2,#t4 { padding: 0; } + +#t1 div, #t3 div { + /* same numbers as padding above */ + left: -11px; right: -5px; + top: -3px; bottom:-7px; +} + +#t2 { top: 120px; } +#t3 { top: 240px; } +#t4 { top: 360px; } + +x { + position: absolute; + width:100px; + height:100px; +} +#t1 x, #t2 x { + height:78px; /* compensate for legend */ +} + </style> +</head> +<body> + + +<fieldset id="t1"> + <legend>legend</legend> + <x><div></div><c></c></x> +</fieldset> + +<fieldset id="t2"> + <legend>legend</legend> + <x><div></div></x> +</fieldset> + +<fieldset id="t3"> + <x><div></div><c></c></x> +</fieldset> + +<fieldset id="t4"> + <x><div></div></x> +</fieldset> + + +</body> +</html> diff --git a/layout/reftests/forms/fieldset/abs-pos-child-sizing.html b/layout/reftests/forms/fieldset/abs-pos-child-sizing.html new file mode 100644 index 000000000..72d47deac --- /dev/null +++ b/layout/reftests/forms/fieldset/abs-pos-child-sizing.html @@ -0,0 +1,64 @@ +<!DOCTYPE HTML> +<html><head> + <meta charset="utf-8"> + <title>Testcase for bug 971653</title> + <style type="text/css"> + html,body { + color:black; background-color:white; font-size:16px; padding:0; margin:0; + } + +div { + position: absolute; + background: rgba(0,255,0,0.5); + top:0; bottom:0; + left:0; right:0; + z-index: 0; +} +c { + display: block; + background: blue; + height:100%; +} + +legend { height: 24px; } + +fieldset { + position: absolute; + border: 2px green solid; + width: 100px; + height: 100px; + margin-bottom:40px; +} + +#t1,#t3 { padding: 3px 5px 7px 11px; } +#t2,#t4 { padding: 0; } + +#t2 { top: 120px; } +#t3 { top: 240px; } +#t4 { top: 360px; } + </style> +</head> +<body> + + +<fieldset id="t1"> + <legend>legend</legend> + <div></div><c></c> +</fieldset> + +<fieldset id="t2"> + <legend>legend</legend> + <div></div> +</fieldset> + +<fieldset id="t3"> + <div></div><c></c> +</fieldset> + +<fieldset id="t4"> + <div></div> +</fieldset> + + +</body> +</html> diff --git a/layout/reftests/forms/fieldset/dynamic-legend-scroll-1-ref.html b/layout/reftests/forms/fieldset/dynamic-legend-scroll-1-ref.html new file mode 100644 index 000000000..4f2e7ba47 --- /dev/null +++ b/layout/reftests/forms/fieldset/dynamic-legend-scroll-1-ref.html @@ -0,0 +1,24 @@ +<!DOCTYPE HTML> +<html> +<head> +<style> +fieldset { + background:pink; + overflow:hidden; + height:100px; +} +legend::after { content:"legend"; } +p { + background:lime; + height:20px; +} +</style> +</head> +<body> +<fieldset id="f1"><legend></legend><p></p></fieldset> +<br> +<fieldset id="f2"><legend></legend><p></p></fieldset> +<br> +<fieldset id="f3"><legend></legend></fieldset> +</body> +</html> diff --git a/layout/reftests/forms/fieldset/dynamic-legend-scroll-1.html b/layout/reftests/forms/fieldset/dynamic-legend-scroll-1.html new file mode 100644 index 000000000..0870f06a0 --- /dev/null +++ b/layout/reftests/forms/fieldset/dynamic-legend-scroll-1.html @@ -0,0 +1,33 @@ +<!DOCTYPE HTML> +<html class="reftest-wait"> +<head> +<style> +fieldset { + background:pink; + overflow:hidden; + height:100px; +} +legend::after { content:"legend"; } +p { + background:lime; + height:20px; +} +</style> +</head> +<body> +<fieldset id="f1"><p></p></fieldset> +<br> +<fieldset id="f2"><p></p></fieldset> +<br> +<fieldset id="f3"></fieldset> +<script> +function doTest() { + f1.appendChild(document.createElement('legend')); + f2.insertBefore(document.createElement('legend'), f2.firstChild); + f3.appendChild(document.createElement('legend')); + document.documentElement.removeAttribute("class"); +} +window.addEventListener("MozReftestInvalidate", doTest); +</script> +</body> +</html> diff --git a/layout/reftests/forms/fieldset/fieldset-flexbox-001-ref.html b/layout/reftests/forms/fieldset/fieldset-flexbox-001-ref.html new file mode 100644 index 000000000..80b64f8f8 --- /dev/null +++ b/layout/reftests/forms/fieldset/fieldset-flexbox-001-ref.html @@ -0,0 +1,40 @@ +<!DOCTYPE HTML> +<html> +<body> +<style> +p { flex-grow: 1; } +</style> +<fieldset style="overflow:hidden; width:200px; height:200px;"> + <legend>Legend</legend> +<div style="display:flex;"> + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X +</div> +</fieldset> +<fieldset> + <legend>Legend</legend> +<div style="display:flex;"> + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X +</div> +</fieldset> +</body> +</html> diff --git a/layout/reftests/forms/fieldset/fieldset-flexbox-001.html b/layout/reftests/forms/fieldset/fieldset-flexbox-001.html new file mode 100644 index 000000000..b78d28cf5 --- /dev/null +++ b/layout/reftests/forms/fieldset/fieldset-flexbox-001.html @@ -0,0 +1,36 @@ +<!DOCTYPE HTML> +<html> +<body> +<style> +p { flex-grow: 1; } +</style> +<fieldset style="display:flex; overflow:hidden; width:200px; height:200px;"> + <legend>Legend</legend> + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X +</fieldset> +<fieldset style="display:flex;"> + <legend>Legend</legend> + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X +</fieldset> +</body> +</html> diff --git a/layout/reftests/forms/fieldset/fieldset-grid-001-ref.html b/layout/reftests/forms/fieldset/fieldset-grid-001-ref.html new file mode 100644 index 000000000..f99de2252 --- /dev/null +++ b/layout/reftests/forms/fieldset/fieldset-grid-001-ref.html @@ -0,0 +1,33 @@ +<!DOCTYPE HTML> +<html> +<body> +<fieldset style="overflow:hidden; width:200px; height:200px;"> + <legend>Legend</legend> +<div style="display:grid; grid-template-columns: repeat(4,50px); grid-auto-rows: 20px;"> + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X +</div> +</fieldset> +<fieldset> + <legend>Legend</legend> +<div style="display:grid; grid-auto-columns: 50px; grid-auto-rows: 20px;"> + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X +</div> +</fieldset> +</body> +</html> diff --git a/layout/reftests/forms/fieldset/fieldset-grid-001.html b/layout/reftests/forms/fieldset/fieldset-grid-001.html new file mode 100644 index 000000000..37bfaa6be --- /dev/null +++ b/layout/reftests/forms/fieldset/fieldset-grid-001.html @@ -0,0 +1,29 @@ +<!DOCTYPE HTML> +<html> +<body> +<fieldset style="display:grid; overflow:hidden; grid-template-columns: repeat(4,50px); grid-auto-rows: 20px; width:200px; height:200px;"> + <legend>Legend</legend> + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X +</fieldset> +<fieldset style="display:grid; grid-auto-columns: 50px; grid-auto-rows: 20px;"> + <legend>Legend</legend> + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X + <p>X +</fieldset> +</body> +</html> diff --git a/layout/reftests/forms/fieldset/fieldset-hidden-1-ref.html b/layout/reftests/forms/fieldset/fieldset-hidden-1-ref.html new file mode 100644 index 000000000..da53b994d --- /dev/null +++ b/layout/reftests/forms/fieldset/fieldset-hidden-1-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE HTML> +<html> +<body> +<fieldset style="width:200px; height:200px; padding:0"> + <legend>Legend</legend> + <div style="overflow:hidden; height:100%;"> + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + </div> +</fieldset> +</body> +</html> diff --git a/layout/reftests/forms/fieldset/fieldset-hidden-1.html b/layout/reftests/forms/fieldset/fieldset-hidden-1.html new file mode 100644 index 000000000..b1046ed72 --- /dev/null +++ b/layout/reftests/forms/fieldset/fieldset-hidden-1.html @@ -0,0 +1,19 @@ +<!DOCTYPE HTML> +<html> +<body> +<fieldset style="overflow:hidden; width:200px; height:200px; padding:0"> + <legend>Legend</legend> + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty +</fieldset> +</body> +</html> diff --git a/layout/reftests/forms/fieldset/fieldset-intrinsic-width-1-ref.html b/layout/reftests/forms/fieldset/fieldset-intrinsic-width-1-ref.html new file mode 100644 index 000000000..ec0c49ffe --- /dev/null +++ b/layout/reftests/forms/fieldset/fieldset-intrinsic-width-1-ref.html @@ -0,0 +1,8 @@ +<!DOCTYPE HTML> +<html> +<body> +<fieldset style="width:0; padding:0;"> + <div style="width:400px; height:200px;"></div> +</fieldset> +</body> +</html> diff --git a/layout/reftests/forms/fieldset/fieldset-intrinsic-width-1.html b/layout/reftests/forms/fieldset/fieldset-intrinsic-width-1.html new file mode 100644 index 000000000..3326dff9b --- /dev/null +++ b/layout/reftests/forms/fieldset/fieldset-intrinsic-width-1.html @@ -0,0 +1,8 @@ +<!DOCTYPE HTML> +<html> +<body> +<fieldset style="padding:50px; float:left;"> + <div style="width:300px; height:100px;"></div> +</fieldset> +</body> +</html> diff --git a/layout/reftests/forms/fieldset/fieldset-overflow-auto-1-ref.html b/layout/reftests/forms/fieldset/fieldset-overflow-auto-1-ref.html new file mode 100644 index 000000000..9732c7fea --- /dev/null +++ b/layout/reftests/forms/fieldset/fieldset-overflow-auto-1-ref.html @@ -0,0 +1,52 @@ +<!DOCTYPE HTML> +<html><head> + <meta charset="utf-8"> + <title>Testcase for bug 261037</title> + <style type="text/css"> +fieldset, div { + background:pink; + overflow:auto; + height:100px; + margin:0; padding:0; border:0; +} +p { + background:blue; + height:100px; + margin:0; padding:0; +} +.overflow { + height:110px; +} +.abs { + position:absolute; + width:100px; + top:250px; +} +p.abs { + top:0;left:0; +} +.b { border:10px solid black; } +.p { padding: 7px 0; } +.p p { height:114px; } + </style> +</head> +<body> + +<div><p></p></div> +<br> +<div><p class="overflow"></p></div> +<br> +<div class="abs"><p class="abs"></p></div> +<br> +<div class="abs" style="left:120px"><p class="abs overflow"></p></div> +<br> +<div class="abs b" style="left:240px"><p class="abs"></p></div> +<br> +<div class="abs b" style="left:370px"><p class="abs overflow"></p></div> +<br> +<div class="abs b p" style="left:510px"><p class="abs"></p></div> +<br> +<div class="abs b p" style="left:640px"><p class="abs overflow"></p></div> + +</body> +</html> diff --git a/layout/reftests/forms/fieldset/fieldset-overflow-auto-1.html b/layout/reftests/forms/fieldset/fieldset-overflow-auto-1.html new file mode 100644 index 000000000..d9cf97cf6 --- /dev/null +++ b/layout/reftests/forms/fieldset/fieldset-overflow-auto-1.html @@ -0,0 +1,52 @@ +<!DOCTYPE HTML> +<html><head> + <meta charset="utf-8"> + <title>Testcase for bug 261037</title> + <style type="text/css"> +fieldset, div { + background:pink; + overflow:auto; + height:100px; + margin:0; padding:0; border:0; +} +p { + background:blue; + height:100px; + margin:0; padding:0; +} +.overflow { + height:110px; +} +.abs { + position:absolute; + width:100px; + top:250px; +} +p.abs { + top:0;left:0; +} +.b { border:10px solid black; } +.p { padding: 7px 0; } +.p p { height:114px; } + </style> +</head> +<body> + +<fieldset><p></p></fieldset> +<br> +<fieldset><p class="overflow"></p></fieldset> +<br> +<fieldset class="abs"><p class="abs"></p></fieldset> +<br> +<fieldset class="abs" style="left:120px"><p class="abs overflow"></p></fieldset> +<br> +<fieldset class="abs b" style="left:240px"><p class="abs"></p></fieldset> +<br> +<fieldset class="abs b" style="left:370px"><p class="abs overflow"></p></fieldset> +<br> +<fieldset class="abs b p" style="left:510px"><p class="abs"></p></fieldset> +<br> +<fieldset class="abs b p" style="left:640px"><p class="abs overflow"></p></fieldset> + +</body> +</html> diff --git a/layout/reftests/forms/fieldset/fieldset-percentage-padding-1-ref.html b/layout/reftests/forms/fieldset/fieldset-percentage-padding-1-ref.html new file mode 100644 index 000000000..bc926d00c --- /dev/null +++ b/layout/reftests/forms/fieldset/fieldset-percentage-padding-1-ref.html @@ -0,0 +1,19 @@ +<!DOCTYPE HTML> +<html> +<body> +<div style="width:700px; border:2px solid green; overflow:hidden"> + <fieldset style="padding:140px; width:400px;"> + <legend>Legend</legend> + TextTextTextTextTextText + </fieldset> + <fieldset style="padding:140px; display:inline;"> + <legend>Legend</legend> + TextTextTextTextTextText + </fieldset> + <fieldset style="padding:140px; float:left;"> + <legend>Legend</legend> + TextTextTextTextTextText + </fieldset> +</div> +</body> +</html> diff --git a/layout/reftests/forms/fieldset/fieldset-percentage-padding-1.html b/layout/reftests/forms/fieldset/fieldset-percentage-padding-1.html new file mode 100644 index 000000000..ab9a66ab1 --- /dev/null +++ b/layout/reftests/forms/fieldset/fieldset-percentage-padding-1.html @@ -0,0 +1,19 @@ +<!DOCTYPE HTML> +<html> +<body> +<div style="width:700px; border:2px solid green; overflow:hidden"> + <fieldset style="padding:20%; width:400px;"> + <legend>Legend</legend> + TextTextTextTextTextText + </fieldset> + <fieldset style="padding:20%; display:inline;"> + <legend>Legend</legend> + TextTextTextTextTextText + </fieldset> + <fieldset style="padding:20%; float:left;"> + <legend>Legend</legend> + TextTextTextTextTextText + </fieldset> +</div> +</body> +</html> diff --git a/layout/reftests/forms/fieldset/fieldset-scroll-1-ref.html b/layout/reftests/forms/fieldset/fieldset-scroll-1-ref.html new file mode 100644 index 000000000..e8a696bd1 --- /dev/null +++ b/layout/reftests/forms/fieldset/fieldset-scroll-1-ref.html @@ -0,0 +1,9 @@ +<!DOCTYPE HTML> +<html> +<body> +<fieldset style="width:200px; height:200px; padding:0"> + <legend>Legend</legend> + <div style="overflow:scroll; height:100%"> +</fieldset> +</body> +</html> diff --git a/layout/reftests/forms/fieldset/fieldset-scroll-1.html b/layout/reftests/forms/fieldset/fieldset-scroll-1.html new file mode 100644 index 000000000..3f4d75daf --- /dev/null +++ b/layout/reftests/forms/fieldset/fieldset-scroll-1.html @@ -0,0 +1,8 @@ +<!DOCTYPE HTML> +<html> +<body> +<fieldset style="overflow:scroll; width:200px; height:200px; padding:0"> + <legend>Legend</legend> +</fieldset> +</body> +</html> diff --git a/layout/reftests/forms/fieldset/fieldset-scrolled-1-ref.html b/layout/reftests/forms/fieldset/fieldset-scrolled-1-ref.html new file mode 100644 index 000000000..dc9bcaf9e --- /dev/null +++ b/layout/reftests/forms/fieldset/fieldset-scrolled-1-ref.html @@ -0,0 +1,24 @@ +<!DOCTYPE HTML> +<html> +<body> +<fieldset style="width:200px; height:200px; padding:0"> + <legend style="overflow:hidden">Legend</legend> + <div id="d" style="overflow:hidden; height:100%;"> + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + </div> +</fieldset> +<script> +d.scrollTop = 20; +</script> +</body> +</html> diff --git a/layout/reftests/forms/fieldset/fieldset-scrolled-1.html b/layout/reftests/forms/fieldset/fieldset-scrolled-1.html new file mode 100644 index 000000000..12aac6bdd --- /dev/null +++ b/layout/reftests/forms/fieldset/fieldset-scrolled-1.html @@ -0,0 +1,27 @@ +<!DOCTYPE HTML> +<html class="reftest-wait"> +<body> +<fieldset id="f" style="overflow:hidden; width:200px; height:200px; padding:0"> + <legend style="overflow:hidden">Legend</legend> + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty + <p>Hello Kitty +</fieldset> +<script> +f.scrollTop = 0; +function doTest() { + f.scrollTop = 20; + document.documentElement.removeAttribute("class"); +} +window.addEventListener("MozReftestInvalidate", doTest); +</script> +</body> +</html> diff --git a/layout/reftests/forms/fieldset/legend-rtl-ref.html b/layout/reftests/forms/fieldset/legend-rtl-ref.html new file mode 100644 index 000000000..10fb1d1b2 --- /dev/null +++ b/layout/reftests/forms/fieldset/legend-rtl-ref.html @@ -0,0 +1,5 @@ +<!DOCTYPE html> +<html> +<fieldset><legend style="position:relative;left:20px;">Legend</legend></fieldset> +<fieldset dir="rtl"><legend style="position:relative;right:20px;">Legend</legend></fieldset> +</html> diff --git a/layout/reftests/forms/fieldset/legend-rtl.html b/layout/reftests/forms/fieldset/legend-rtl.html new file mode 100644 index 000000000..7a4f114a0 --- /dev/null +++ b/layout/reftests/forms/fieldset/legend-rtl.html @@ -0,0 +1,5 @@ +<!DOCTYPE html> +<html> +<fieldset><legend dir="rtl" style="position:relative;left:20px;">Legend</legend></fieldset> +<fieldset dir="rtl"><legend dir="ltr" style="position:relative;right:20px;">Legend</legend></fieldset> +</html> diff --git a/layout/reftests/forms/fieldset/overflow-hidden-ref.html b/layout/reftests/forms/fieldset/overflow-hidden-ref.html new file mode 100644 index 000000000..0c00977f5 --- /dev/null +++ b/layout/reftests/forms/fieldset/overflow-hidden-ref.html @@ -0,0 +1,175 @@ +<!DOCTYPE HTML> +<html><head> + <meta charset="utf-8"> + <title>Testcase for bug 971933</title> + <style type="text/css"> + html,body { + color:black; background-color:white; font-size:16px; + } +#f0 div::before { content: "f0"; } +#f1 div::before { content: "f1"; } +#f2 div::before { content: "f2"; } +#f3 div::before { content: "f3"; } +#f4 div::before { content: "f4"; } +#f5 div::before { content: "f5"; } +#f6 div::before { content: "f6"; } +#f7 div::before { content: "f7"; } +#f8 div::before { content: "f8"; } +#f9 div::before { content: "f9"; } + +legend { background:pink; height:30px; } +div { background:yellow; height:100px; overflow:hidden; } +fieldset { + border-width:0; + padding:0; + margin:0; + margin-top:6px; + outline:1px dotted black; + height:auto; + background:grey; + + padding-bottom:0px; + padding-top:5px; + border:1px solid blue; + border-top-width:7px; +} + +#f1 { } +#f2 { border-top-width:0; } +#f3 { border-width:0; } +#f4 { border-bottom-width:0; } +#f5 { border-width:0; padding:0; } +#f6 { border-width:0; padding-bottom:0; } +#f7 { border-width:0; padding-top:0; } +#f8 { padding-top:0; } +#f9 { padding-bottom:0; } +#f0 { padding:0; } + +#c2 fieldset { height:29px; } + +#c3 fieldset { height:39px; } + +#c4 fieldset { height:29px; } +#c4 legend { height: 20px; } + +#c5 legend { height:21px; } +#c5 fieldset { border-top-width:31px; } + +.col { float:left; width:10ch; margin-left:6px; } + +#c1 div { height:3px; } #c1 #f6 div, #c1 #f9 div, #c1 #f0 div { height:0; } +#c1 #f5 div { height:0px; } + +#c2 div { height:9px; } + #c2 #f1 { padding-bottom:3px; } #c2 #f1 div { height:9px;} + #c2 #f2 { padding-bottom:3px; } #c2 #f2 div { height:3px; } + #c2 #f3 { padding-bottom:3px; } #c2 #f3 div { height:3px; } + #c2 #f4 { padding-bottom:3px; } + #c2 #f5 div { height:0; } + #c2 #f6 div { height:0; } + #c2 #f7 { padding-bottom:3px; } #c2 #f7 div { height:3px; } + #c2 #f8 { padding-bottom:3px; } #c2 #f8 div { height:9px; } + #c2 #f9 div { height:6px; } + #c2 #f0 div { height:6px; } + +#c3 fieldset { padding-bottom:3px; } + #c3 #f1 div { height:19px; } + #c3 #f2 div { height:12px; } + #c3 #f3 div { height:12px; } + #c3 #f4 div { height:19px; } + #c3 #f5 { padding-bottom:0; } #c3 #f5 div { height:9px; } + #c3 #f6 { padding-bottom:0; } #c3 #f6 div { height:9px; } + #c3 #f7 div { height:12px; } + #c3 #f8 div { height:19px; } + #c3 #f9 { padding-bottom:0; } #c3 #f9 div { height:16px; } + #c3 #f0 { padding-bottom:0; } #c3 #f0 div { height:16px; } + +#c4 fieldset { padding-bottom:3px; } + #c4 #f1 div { height:19px; } + #c4 #f2 div { height:12px; } + #c4 #f3 div { height:12px; } + #c4 #f4 div { height:19px; } + #c4 #f5 { padding-bottom:0; } #c4 #f5 div { height:9px; } + #c4 #f6 { padding-bottom:0; } #c4 #f6 div { height:9px; } + #c4 #f7 div { height:12px; } + #c4 #f8 div { height:19px; } + #c4 #f9 { padding-bottom:0; } #c4 #f9 div { height:16px; } + #c4 #f0 { padding-bottom:0; } #c4 #f0 div { height:16px; } + + #c5 #f1 div { height:18px; } + #c5 #f2 div { height:18px; } + #c5 #f3 div { height:18px; } + #c5 #f4 div { height:18px; } + #c5 #f5 div { height:15px; } + #c5 #f6 div { height:15px; } + #c5 #f7 div { height:18px; } + #c5 #f8 div { height:18px; } + #c5 #f9 div { height:15px; } + #c5 #f0 div { height:15px; } + +</style> +</head> +<body> +<span id=c1 class=col>C1 + <fieldset id=f1><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f2><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f3><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f4><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f5><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f6><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f7><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f8><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f9><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f0><legend>LEGEND</legend><div></div></fieldset> +</span> +<span id=c2 class=col>C2 + <fieldset id=f1><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f2><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f3><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f4><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f5><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f6><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f7><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f8><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f9><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f0><legend>LEGEND</legend><div></div></fieldset> +</span> +<span id=c3 class=col>C3 + <fieldset id=f1><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f2><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f3><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f4><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f5><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f6><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f7><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f8><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f9><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f0><legend>LEGEND</legend><div></div></fieldset> +</span> +<span id=c4 class=col>C4 + <fieldset id=f1><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f2><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f3><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f4><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f5><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f6><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f7><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f8><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f9><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f0><legend>LEGEND</legend><div></div></fieldset> +</span> +<span id=c5 class=col>C5 + <fieldset id=f1><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f2><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f3><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f4><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f5><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f6><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f7><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f8><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f9><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f0><legend>LEGEND</legend><div></div></fieldset> +</span> + +</body> +</html> diff --git a/layout/reftests/forms/fieldset/overflow-hidden.html b/layout/reftests/forms/fieldset/overflow-hidden.html new file mode 100644 index 000000000..480134803 --- /dev/null +++ b/layout/reftests/forms/fieldset/overflow-hidden.html @@ -0,0 +1,125 @@ +<!DOCTYPE HTML> +<html><head> + <meta charset="utf-8"> + <title>Testcase for bug 971933</title> + <style type="text/css"> + html,body { + color:black; background-color:white; font-size:16px; + } +#f0 div::before { content: "f0"; } +#f1 div::before { content: "f1"; } +#f2 div::before { content: "f2"; } +#f3 div::before { content: "f3"; } +#f4 div::before { content: "f4"; } +#f5 div::before { content: "f5"; } +#f6 div::before { content: "f6"; } +#f7 div::before { content: "f7"; } +#f8 div::before { content: "f8"; } +#f9 div::before { content: "f9"; } + +legend { background:pink; height:30px; } +div { background:yellow; height:100px; } +fieldset { + border-width:0; + padding:0; + margin:0; + margin-top:6px; + outline:1px dotted black; + height:15px; + overflow:hidden; + background:grey; + + padding-bottom:3px; + padding-top:5px; + border:1px solid blue; + border-top-width:7px; +} + +#f1 {} +#f2 { border-top-width:0; } +#f3 { border-width:0; } +#f4 { border-bottom-width:0; } +#f5 { border-width:0; padding:0; } +#f6 { border-width:0; padding-bottom:0; } +#f7 { border-width:0; padding-top:0; } +#f8 { padding-top:0; } +#f9 { padding-bottom:0; } +#f0 { padding:0; } + +#c2 fieldset { height:29px; } + +#c3 fieldset { height:39px; } + +#c4 fieldset { height:29px; } +#c4 legend { height: 20px; } + +#c5 legend { height:21px; } +#c5 fieldset { border-top-width:31px; } + +.col { float:left; width:10ch; margin-left:6px; } +</style> +</head> +<body> +<span id=c1 class=col>C1 + <fieldset id=f1><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f2><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f3><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f4><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f5><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f6><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f7><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f8><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f9><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f0><legend>LEGEND</legend><div></div></fieldset> +</span> +<span id=c2 class=col>C2 + <fieldset id=f1><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f2><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f3><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f4><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f5><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f6><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f7><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f8><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f9><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f0><legend>LEGEND</legend><div></div></fieldset> +</span> +<span id=c3 class=col>C3 + <fieldset id=f1><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f2><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f3><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f4><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f5><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f6><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f7><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f8><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f9><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f0><legend>LEGEND</legend><div></div></fieldset> +</span> +<span id=c4 class=col>C4 + <fieldset id=f1><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f2><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f3><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f4><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f5><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f6><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f7><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f8><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f9><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f0><legend>LEGEND</legend><div></div></fieldset> +</span> +<span id=c5 class=col>C5 + <fieldset id=f1><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f2><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f3><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f4><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f5><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f6><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f7><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f8><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f9><legend>LEGEND</legend><div></div></fieldset> + <fieldset id=f0><legend>LEGEND</legend><div></div></fieldset> +</span> + +</body> +</html> diff --git a/layout/reftests/forms/fieldset/positioned-container-1-ref.html b/layout/reftests/forms/fieldset/positioned-container-1-ref.html new file mode 100644 index 000000000..b7988f379 --- /dev/null +++ b/layout/reftests/forms/fieldset/positioned-container-1-ref.html @@ -0,0 +1,11 @@ +<!DOCTYPE HTML> +<html> +<body> +<fieldset style="position:relative; overflow:hidden; width:500px; height:500px;"> + <legend>Legend</legend> + <div style="height:1000px;"> + <div style="position:absolute; padding:2px; left:20px; top:20px; background:yellow;">Abs-pos</div> + </div> +</fieldset> +</body> +</html> diff --git a/layout/reftests/forms/fieldset/positioned-container-1.html b/layout/reftests/forms/fieldset/positioned-container-1.html new file mode 100644 index 000000000..04e81ca6b --- /dev/null +++ b/layout/reftests/forms/fieldset/positioned-container-1.html @@ -0,0 +1,14 @@ +<!DOCTYPE HTML> +<html> +<body> +<fieldset id="f" style="position:relative; overflow:hidden; width:500px; height:500px;"> + <legend>Legend</legend> + <div style="height:1000px;"> + <div style="position:absolute; padding:2px; left:20px; top:50px; background:yellow;">Abs-pos</div> + </div> +</fieldset> +<script> +f.scrollTop = 30; +</script> +</body> +</html> diff --git a/layout/reftests/forms/fieldset/reftest-stylo.list b/layout/reftests/forms/fieldset/reftest-stylo.list new file mode 100644 index 000000000..d1dd22756 --- /dev/null +++ b/layout/reftests/forms/fieldset/reftest-stylo.list @@ -0,0 +1,19 @@ +# DO NOT EDIT! This is a auto-generated temporary list for Stylo testing +fuzzy-if(skiaContent,2,13) == dynamic-legend-scroll-1.html dynamic-legend-scroll-1.html +== fieldset-hidden-1.html fieldset-hidden-1.html +== fieldset-intrinsic-width-1.html fieldset-intrinsic-width-1.html +== fieldset-percentage-padding-1.html fieldset-percentage-padding-1.html +== fieldset-scroll-1.html fieldset-scroll-1.html +== fieldset-scrolled-1.html fieldset-scrolled-1.html +random-if(B2G||Mulet) == fieldset-overflow-auto-1.html fieldset-overflow-auto-1.html +# Initial mulet triage: parity with B2G/B2G Desktop +fuzzy-if(winWidget&&!layersGPUAccelerated,121,221) == positioned-container-1.html positioned-container-1.html +== relpos-legend-1.html relpos-legend-1.html +== relpos-legend-2.html relpos-legend-2.html +skip-if((B2G&&browserIsRemote)||Mulet) == sticky-legend-1.html sticky-legend-1.html +# Initial mulet triage: parity with B2G/B2G Desktop +fails fuzzy-if(skiaContent,1,40768) == abs-pos-child-sizing.html abs-pos-child-sizing.html +== overflow-hidden.html overflow-hidden.html +== legend-rtl.html legend-rtl.html +== fieldset-grid-001.html fieldset-grid-001.html +== fieldset-flexbox-001.html fieldset-flexbox-001.html diff --git a/layout/reftests/forms/fieldset/reftest.list b/layout/reftests/forms/fieldset/reftest.list new file mode 100644 index 000000000..fdf783053 --- /dev/null +++ b/layout/reftests/forms/fieldset/reftest.list @@ -0,0 +1,16 @@ +fuzzy-if(skiaContent,2,13) == dynamic-legend-scroll-1.html dynamic-legend-scroll-1-ref.html +== fieldset-hidden-1.html fieldset-hidden-1-ref.html +== fieldset-intrinsic-width-1.html fieldset-intrinsic-width-1-ref.html +== fieldset-percentage-padding-1.html fieldset-percentage-padding-1-ref.html +== fieldset-scroll-1.html fieldset-scroll-1-ref.html +== fieldset-scrolled-1.html fieldset-scrolled-1-ref.html +== fieldset-overflow-auto-1.html fieldset-overflow-auto-1-ref.html +fuzzy-if(winWidget&&!layersGPUAccelerated,140,276) == positioned-container-1.html positioned-container-1-ref.html +== relpos-legend-1.html relpos-legend-1-ref.html +== relpos-legend-2.html relpos-legend-2-ref.html +== sticky-legend-1.html sticky-legend-1-ref.html +fuzzy-if(skiaContent,1,40768) == abs-pos-child-sizing.html abs-pos-child-sizing-ref.html +== overflow-hidden.html overflow-hidden-ref.html +== legend-rtl.html legend-rtl-ref.html +== fieldset-grid-001.html fieldset-grid-001-ref.html +== fieldset-flexbox-001.html fieldset-flexbox-001-ref.html diff --git a/layout/reftests/forms/fieldset/relpos-legend-1-ref.html b/layout/reftests/forms/fieldset/relpos-legend-1-ref.html new file mode 100644 index 000000000..c916817dd --- /dev/null +++ b/layout/reftests/forms/fieldset/relpos-legend-1-ref.html @@ -0,0 +1,8 @@ +<!DOCTYPE HTML> +<html> +<body> +<fieldset> + <legend><div style="position:relative; top:20px">Legend</div></legend> +</fieldset> +</body> +</html> diff --git a/layout/reftests/forms/fieldset/relpos-legend-1.html b/layout/reftests/forms/fieldset/relpos-legend-1.html new file mode 100644 index 000000000..441dd9219 --- /dev/null +++ b/layout/reftests/forms/fieldset/relpos-legend-1.html @@ -0,0 +1,8 @@ +<!DOCTYPE HTML> +<html> +<body> +<fieldset> + <legend style="position:relative; top:20px">Legend</legend> +</fieldset> +</body> +</html> diff --git a/layout/reftests/forms/fieldset/relpos-legend-2-ref.html b/layout/reftests/forms/fieldset/relpos-legend-2-ref.html new file mode 100644 index 000000000..4124b074b --- /dev/null +++ b/layout/reftests/forms/fieldset/relpos-legend-2-ref.html @@ -0,0 +1,8 @@ +<!DOCTYPE HTML> +<html> +<body> +<fieldset> + <legend><span style="position:relative; top:20px">Legend</span></legend> +</fieldset> +</body> +</html> diff --git a/layout/reftests/forms/fieldset/relpos-legend-2.html b/layout/reftests/forms/fieldset/relpos-legend-2.html new file mode 100644 index 000000000..f1be56e26 --- /dev/null +++ b/layout/reftests/forms/fieldset/relpos-legend-2.html @@ -0,0 +1,8 @@ +<!DOCTYPE HTML> +<html> +<body> +<fieldset> + <legend style="display:inline; position:relative; top:20px">Legend</legend> +</fieldset> +</body> +</html> diff --git a/layout/reftests/forms/fieldset/sticky-legend-1-ref.html b/layout/reftests/forms/fieldset/sticky-legend-1-ref.html new file mode 100644 index 000000000..892fa4c29 --- /dev/null +++ b/layout/reftests/forms/fieldset/sticky-legend-1-ref.html @@ -0,0 +1,12 @@ +<!DOCTYPE HTML> +<html> +<body> +<fieldset style="overflow:hidden; height:300px;"> + <legend style="position:fixed; top:0"><div style="width:200px; height:50px; background:yellow;"></div></legend> +</fieldset> +<div style="height:5000px;"></div> +<script> +window.scrollTo(0,100); +</script> +</body> +</html> diff --git a/layout/reftests/forms/fieldset/sticky-legend-1.html b/layout/reftests/forms/fieldset/sticky-legend-1.html new file mode 100644 index 000000000..588ea521f --- /dev/null +++ b/layout/reftests/forms/fieldset/sticky-legend-1.html @@ -0,0 +1,12 @@ +<!DOCTYPE HTML> +<html> +<body> +<fieldset style="overflow:hidden; height:300px;"> + <legend style="position:sticky; top:0;"><div style="width:200px; height:50px; background:yellow;"></div></legend> +</fieldset> +<div style="height:5000px;"></div> +<script> +window.scrollTo(0,100); +</script> +</body> +</html> |