new file mode 100644
--- /dev/null
+++ b/layout/reftests/border-radius/border-reduce-height-ref.html
@@ -0,0 +1,20 @@
+<html>
+ <head>
+ <style>
+ div { -moz-box-sizing: border-box;
+ box-sizing: border-box;
+ width: 60px;
+ height: 20px;
+ border: 2px solid black;
+ background: green;
+ position: absolute;
+ top: 12px;
+ left: 12px;
+ -moz-border-radius: 4px 16px 4px 16px;
+ }
+ </style>
+ </head>
+ <body>
+ <div></div>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/border-radius/border-reduce-height.html
@@ -0,0 +1,20 @@
+<html>
+ <head>
+ <style>
+ div { -moz-box-sizing: border-box;
+ box-sizing: border-box;
+ width: 60px;
+ height: 20px;
+ border: 2px solid black;
+ background: green;
+ position: absolute;
+ top: 12px;
+ left: 12px;
+ -moz-border-radius: 5px 20px 5px 20px;
+ }
+ </style>
+ </head>
+ <body>
+ <div></div>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/border-radius/border-value-interpret-ref.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<html>
+ <head>
+ <title>Test different types of values with border radius</title>
+ <!-- This bug will break when bug 451134 is fixed -->
+ <style>
+ div { width: 200px;
+ height: 200px;
+ background: green;
+ border: 10px dashed black;
+ -moz-border-radius-topleft: 2em 10px;
+ -moz-border-radius-topright: 10px 0.5em;
+ -moz-border-radius-bottomright: 3em 10px;
+ -moz-border-radius-bottomleft: 10px 0.5em;
+ }
+
+</style>
+</head>
+<body>
+ <div></div>
+</body></html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/border-radius/border-value-interpret.html
@@ -0,0 +1,18 @@
+<!doctype html>
+<html>
+ <head>
+ <title>Test different types of values with border radius</title>
+ <style>
+ div { width: 200px;
+ height: 200px;
+ background: green;
+ border: 10px dashed black}
+
+ /* Test interpreted values */
+ #test1 { -moz-border-radius: 2em 10px 3em / 10px 0.5em }
+
+</style>
+</head>
+<body>
+ <div id="test1"></div>
+</body></html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/border-radius/clipping-1-ref.html
@@ -0,0 +1,28 @@
+<!doctype html>
+<html><head>
+<title>Border clipping</title>
+<style>
+.div1 { width: 50px; height: 50px;
+ border: 10px solid black;
+ -moz-border-radius: 20px;
+ position: fixed;
+ left: 50px;
+ top: 50px;
+}
+
+.div2 {
+ width: 40px; height: 40px;
+ border: 10px solid black;
+ background: black;
+ -moz-border-radius: 10px;
+ position: fixed;
+ left: 55px;
+ top: 55px;
+}
+
+</style>
+</head>
+<body>
+ <div class="div1"/>
+ <div class="div2"/>
+</body></html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/border-radius/clipping-1.html
@@ -0,0 +1,19 @@
+<!doctype html>
+<html><head>
+<title>Border clipping</title>
+<style>
+.div1 { width: 50px; height: 50px;
+ border: 10px solid black;
+ -moz-border-radius: 20px;
+ position: absolute;
+ background: black;
+ left: 50px;
+ top: 50px;
+ -moz-background-clip: padding;
+}
+
+</style>
+</head>
+<body>
+ <div class="div1"></div>
+</body></html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/border-radius/clipping-2.html
@@ -0,0 +1,30 @@
+<!doctype html>
+<html><head>
+<title>Border clipping</title>
+<style>
+.div1 { width: 50px; height: 50px;
+ border: 4px dotted black;
+ -moz-border-radius: 10px;
+ position: fixed;
+ background: red;
+ left: 50px;
+ top: 50px;
+ -moz-background-clip: padding;
+}
+
+.div2 { width: 50px; height: 50px;
+ border: 4px dotted black;
+ -moz-border-radius: 10px;
+ position: fixed;
+ background: red;
+ left: 50px;
+ top: 140px;
+ -moz-background-clip: border;
+}
+
+</style>
+</head>
+<body>
+ <div class="div1"/>
+ <div class="div2"/>
+</body></html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/border-radius/clipping-3-ref.xhtml
@@ -0,0 +1,19 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+<body style="margin: 0">
+ <div class="div1"/>
+
+ <svg width="200px" height="200px" version="1.1"
+ xmlns="http://www.w3.org/2000/svg">
+
+ <rect style="fill: blue; stroke: none"
+ width="70" height="70"
+ x="50" y="50"/>
+
+ <rect style="fill: red; stroke: none"
+ width="70" height="70"
+ x="80" y="80"
+ rx="10" ry="10"/>
+
+ </svg>
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/border-radius/clipping-3.html
@@ -0,0 +1,27 @@
+<!doctype html>
+<html><head>
+<title>Border clipping</title>
+<style>
+.div1 { width: 50px; height: 50px;
+ border: 10px solid blue;
+ position: fixed;
+ background: blue;
+ left: 50px;
+ top: 50px;
+}
+
+.div2 { width: 50px; height: 50px;
+ border: 10px solid red;
+ position: fixed;
+ background: red;
+ left: 80px;
+ top: 80px;
+ -moz-border-radius: 10px;
+}
+
+</style>
+</head>
+<body>
+ <div class="div1"/>
+ <div class="div2"/>
+</body></html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/border-radius/corner-1-ref.svg
@@ -0,0 +1,13 @@
+<svg width="200px" height="200px" version="1.1"
+ xmlns="http://www.w3.org/2000/svg">
+ <rect style="fill: black; stroke: none"
+ width="70" height="50"
+ x="50" y="50"
+ rx="10" ry="10"/>
+
+ <rect style="fill: black; stroke: none"
+ width="70" height="40"
+ x="50" y="80"
+ rx="6" ry="6"/>
+</svg>
+
new file mode 100644
--- /dev/null
+++ b/layout/reftests/border-radius/corner-1.html
@@ -0,0 +1,18 @@
+<!doctype html>
+<html><head>
+<title>Corners different</title>
+<style>
+.div1 { width: 50px; height: 50px;
+ border: 10px solid black;
+ -moz-border-radius: 10px 10px 6px 6px;
+ position: absolute;
+ background: black;
+ left: 50px;
+ top: 50px;
+}
+
+</style>
+</head>
+<body>
+ <div class="div1"></div>
+</body></html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/border-radius/corner-2-ref.svg
@@ -0,0 +1,12 @@
+<svg width="200px" height="200px" version="1.1"
+ xmlns="http://www.w3.org/2000/svg">
+ <rect style="fill: black; stroke: none"
+ width="50" height="70"
+ x="50" y="50"
+ rx="10" ry="10"/>
+
+ <rect style="fill: black; stroke: none"
+ width="50" height="70"
+ x="70" y="50"
+ rx="6" ry="6"/>
+</svg>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/border-radius/corner-2.html
@@ -0,0 +1,18 @@
+<!doctype html>
+<html><head>
+<title>Corners different</title>
+<style>
+.div1 { width: 50px; height: 50px;
+ border: 10px solid black;
+ -moz-border-radius: 10px 6px 6px 10px;
+ position: absolute;
+ background: black;
+ left: 50px;
+ top: 50px;
+}
+
+</style>
+</head>
+<body>
+ <div class="div1"></div>
+</body></html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/border-radius/curved-borders-all-styles.html
@@ -0,0 +1,29 @@
+<html>
+
+<head>
+ <title>testcase for bug #382721</title>
+<style>
+ div {
+ background: beige;
+ margin: 1ex;
+ padding: 1ex;
+ -moz-border-radius: 3ex;
+ }
+</style>
+<script>
+ function ini() {
+ var s,i,d;
+ s=['none','hidden','dotted','dashed','solid',
+ 'double','groove','ridge','inset','outset'];
+ for (i=0; i<s.length; i++) {
+ d=document.createElement('div');
+ d.style.border=d.innerHTML=s[i];
+ document.body.appendChild(d);
+ }}
+</script>
+</head>
+
+<body onload="ini()"></body>
+
+</html>
+
new file mode 100644
--- /dev/null
+++ b/layout/reftests/border-radius/curved-stripe-border-ref.svg
@@ -0,0 +1,26 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg"
+ width="200px" height="200px">
+<title>Curved stripe border (SVG)</title>
+<style type="text/css">
+path { stroke: none; }
+</style>
+<path
+ d="M20,60 a60,40 0 0,1 60,-40
+ h60 a60,40 0 0,1 60,40
+ v100 a60,40 0 0,1 -60,40
+ h-60 a60,40 0 0,1 -60,-40 z
+ M30,160 a50,30 0 0,0 50,30
+ h60 a50,30 0 0,0 50,-30
+ v-100 a50,30 0 0,0 -50,-30
+ h-60 a50,30 0 0,0 -50,30 z"/>
+<path
+ d="M40,60 a40,20 0 0,1 40,-20
+ h60 a40,20 0 0,1 40,20
+ v100 a40,20 0 0,1 -40,20
+ h-60 a40,20 0 0,1 -40,-20 z
+ M50,160 a30,10 0 0,0 30,10
+ h60 a30,10 0 0,0 30,-10
+ v-100 a30,10 0 0,0 -30,-10
+ h-60 a30,10 0 0,0 -30,10 z"/>
+</svg>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/border-radius/curved-stripe-border.html
@@ -0,0 +1,17 @@
+<!doctype html>
+<html><head>
+<title>Curved stripe border (HTML)</title>
+<style>
+body { margin: 0 }
+div {
+ -moz-box-sizing: border-box;
+ width: 180px;
+ height: 180px;
+ border: 30px double black;
+ -moz-border-radius: 60px / 40px;
+ margin: 20px;
+}
+</style>
+</head><body>
+<div></div>
+</body></html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/border-radius/inherit-1-ref.html
@@ -0,0 +1,25 @@
+<!doctype html>
+<html><head>
+<title>Border-radius inheritance</title>
+<style>
+.div1 { width: 100px; height: 100px;
+ border: 10px solid black;
+ -moz-border-radius: 10px;
+ left: 50px;
+ top: 50px;
+}
+
+div > div {
+ width: 40px; height: 40px;
+ border: 10px solid black;
+ position: absolute;
+ -moz-border-radius: 0px;
+ left: 40px;
+ top: 40px;
+}
+
+</style>
+</head>
+<body>
+ <div class="div1"><div></div></div>
+</body></html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/border-radius/inherit-1.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<html><head>
+<title>Border-radius inheritance</title>
+<style>
+.div1 { width: 100px; height: 100px;
+ border: 10px solid black;
+ -moz-border-radius: 10px;
+ left: 50px;
+ top: 50px;
+}
+
+div > div {
+ width: 40px; height: 40px;
+ border: 10px solid black;
+ position: absolute;
+ left: 40px;
+ top: 40px;
+}
+
+</style>
+</head>
+<body>
+ <div class="div1"><div></div></div>
+</body></html>
--- a/layout/reftests/border-radius/reftest.list
+++ b/layout/reftests/border-radius/reftest.list
@@ -8,14 +8,38 @@
!= border-circle.html border-ellips.html
!= outline-square.html about:blank
!= outline-circle.html about:blank
!= outline-ellips.html about:blank
!= outline-square.html outline-circle.html
!= outline-square.html outline-ellips.html
!= outline-circle.html outline-ellips.html
+== border-value-interpret.html border-value-interpret-ref.html
+!= curved-borders-all-styles.html about:blank # no way to generate reference for dotted/dashed/inset/outset
+# ridge/groove borders
# more serious tests, using SVG reference
== border-circle-2.html border-circle-2-ref.xhtml
+fails == curved-stripe-border.html curved-stripe-border-ref.svg # bug 459945
+
+# Corners
+== corner-1.html corner-1-ref.svg # bottom corners different radius than top corners
+random == corner-2.html corner-2-ref.svg # right corners different radius than left corners; see bug 500804
+
+# Test that radii too long are reduced
+== border-reduce-height.html border-reduce-height-ref.html
+
+# Tests for border clipping
+fails == clipping-1.html clipping-1-ref.html # background color should completely fill box; bug 466572
+!= clipping-2.html about:blank # background color clipped to inner/outer border, can't get
+# great tests for this due to antialiasing problems described in bug 466572
+== clipping-3.html clipping-3-ref.xhtml # edge of border-radius clips an underlying object's background
+
+# Inheritance
+== inherit-1.html inherit-1-ref.html # border-radius shouldn't inherit
+
+# Table elements
+== table-collapse-1.html table-collapse-1-ref.html # border-radius is ignored on internal table elements
+# when border-collapse: collapse
== invalidate-1a.html invalidate-1-ref.html
== invalidate-1b.html invalidate-1-ref.html
new file mode 100644
--- /dev/null
+++ b/layout/reftests/border-radius/table-collapse-1-ref.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<html><head>
+<title>Table border collapse</title>
+<style>
+table {
+ border: 2px solid black;
+ border-collapse: collapse;
+}
+
+td {
+ border: 2px solid black;
+ width: 50px;
+ height: 50px;
+}
+
+</style>
+</head>
+<body>
+ <table>
+ <tr><td> </td><td> </td><td> </td></tr>
+ <tr><td> </td><td> </td><td> </td></tr>
+ <tr><td> </td><td> </td><td> </td></tr>
+ </table>
+</body></html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/border-radius/table-collapse-1.html
@@ -0,0 +1,25 @@
+<!doctype html>
+<html><head>
+<title>Table border collapse</title>
+<style>
+table {
+ border: 2px solid black;
+ border-collapse: collapse;
+}
+
+td {
+ border: 2px solid black;
+ width: 50px;
+ height: 50px;
+ -moz-border-radius: 4px;
+}
+
+</style>
+</head>
+<body>
+ <table>
+ <tr><td> </td><td> </td><td> </td></tr>
+ <tr><td> </td><td> </td><td> </td></tr>
+ <tr><td> </td><td> </td><td> </td></tr>
+ </table>
+</body></html>
