diff options
Diffstat (limited to 'layout/reftests/css-gradients')
206 files changed, 2129 insertions, 0 deletions
diff --git a/layout/reftests/css-gradients/1224761-1-ref.html b/layout/reftests/css-gradients/1224761-1-ref.html new file mode 100644 index 000000000..7b243c9a4 --- /dev/null +++ b/layout/reftests/css-gradients/1224761-1-ref.html @@ -0,0 +1,37 @@ +<!DOCTYPE html> +<html> +<head> +<style> +div { + border: 1px solid black; + width: 30px; + height: 30px; + margin: 1px; +} +.grad-5 { + background: yellow; +} +.grad0 { + background: yellow; +} +.grad30 { + /* not much of a test, but this isn't where the bug was anyway! */ + background: linear-gradient(to right, blue 30%, yellow 30%); +} +.grad100 { + background: blue; +} +.grad150 { + background: blue; +} +</style> +</head> +<body> + You shouldn't see a gradual gradient in any of the divs below. + <div class="grad-5"></div> + <div class="grad0"></div> + <div class="grad30"></div> + <div class="grad100"></div> + <div class="grad150"></div> +</body> +</html> diff --git a/layout/reftests/css-gradients/1224761-1.html b/layout/reftests/css-gradients/1224761-1.html new file mode 100644 index 000000000..97e00f7dd --- /dev/null +++ b/layout/reftests/css-gradients/1224761-1.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html> +<head> +<style> +div { + border: 1px solid black; + width: 30px; + height: 30px; + margin: 1px; +} +.grad-5 { + background: linear-gradient(to right, blue -5%, yellow -5%); +} +.grad0 { + background: linear-gradient(to right, blue 0%, yellow 0%); +} +.grad30 { + background: linear-gradient(to right, blue 30%, yellow 30%); +} +.grad100 { + background: linear-gradient(to right, blue 100%, yellow 100%); +} +.grad150 { + background: linear-gradient(to right, blue 150%, yellow 150%); +} +</style> +</head> +<body> + You shouldn't see a gradual gradient in any of the divs below. + <div class="grad-5"></div> + <div class="grad0"></div> + <div class="grad30"></div> + <div class="grad100"></div> + <div class="grad150"></div> +</body> +</html> diff --git a/layout/reftests/css-gradients/aja-linear-1-ref.html b/layout/reftests/css-gradients/aja-linear-1-ref.html new file mode 100644 index 000000000..c96ed5e38 --- /dev/null +++ b/layout/reftests/css-gradients/aja-linear-1-ref.html @@ -0,0 +1,23 @@ +<!doctype html> +<!-- Derived from http://a-ja.net/newgrad.html --> +<html class="reftest-wait"> +<head> +<script> +function doDraw() { + var ctx = document.getElementById('canvas').getContext('2d'); + + var grad = ctx.createLinearGradient(0,0,0,200); + grad.addColorStop(0, 'yellow'); + grad.addColorStop(1, 'blue'); + + ctx.fillStyle = grad; + ctx.fillRect(0,0,100,200); + + document.documentElement.removeAttribute('class'); +} +</script> +</head> +<body onload="doDraw();"> +<canvas id="canvas" width="100" height="200"></canvas> +</body> +</html> diff --git a/layout/reftests/css-gradients/aja-linear-1a.html b/layout/reftests/css-gradients/aja-linear-1a.html new file mode 100644 index 000000000..e9d639699 --- /dev/null +++ b/layout/reftests/css-gradients/aja-linear-1a.html @@ -0,0 +1,10 @@ +<!doctype html> +<!-- Derived from http://a-ja.net/newgrad.html --> +<style> +div { + height: 200px; + width: 100px; + background: -moz-linear-gradient(top, yellow, blue); +} +</style> +<div></div> diff --git a/layout/reftests/css-gradients/aja-linear-1b.html b/layout/reftests/css-gradients/aja-linear-1b.html new file mode 100644 index 000000000..44f469050 --- /dev/null +++ b/layout/reftests/css-gradients/aja-linear-1b.html @@ -0,0 +1,10 @@ +<!doctype html> +<!-- Derived from http://a-ja.net/newgrad.html --> +<style> +div { + height: 200px; + width: 100px; + background: -moz-linear-gradient(bottom, blue, yellow); +} +</style> +<div></div> diff --git a/layout/reftests/css-gradients/aja-linear-1c.html b/layout/reftests/css-gradients/aja-linear-1c.html new file mode 100644 index 000000000..cb5977f8f --- /dev/null +++ b/layout/reftests/css-gradients/aja-linear-1c.html @@ -0,0 +1,10 @@ +<!doctype html> +<!-- Derived from http://a-ja.net/newgrad.html --> +<style> +div { + height: 200px; + width: 100px; + background: linear-gradient(180deg, yellow, blue); +} +</style> +<div></div> diff --git a/layout/reftests/css-gradients/aja-linear-1d.html b/layout/reftests/css-gradients/aja-linear-1d.html new file mode 100644 index 000000000..bfc70bce9 --- /dev/null +++ b/layout/reftests/css-gradients/aja-linear-1d.html @@ -0,0 +1,10 @@ +<!doctype html> +<!-- Derived from http://a-ja.net/newgrad.html --> +<style> +div { + height: 200px; + width: 100px; + background: linear-gradient(-180deg, yellow, blue); +} +</style> +<div></div> diff --git a/layout/reftests/css-gradients/aja-linear-1e.html b/layout/reftests/css-gradients/aja-linear-1e.html new file mode 100644 index 000000000..0fa177f8e --- /dev/null +++ b/layout/reftests/css-gradients/aja-linear-1e.html @@ -0,0 +1,10 @@ +<!doctype html> +<!-- Derived from http://a-ja.net/newgrad.html --> +<style> +div { + height: 200px; + width: 100px; + background: -moz-linear-gradient(top, yellow 0%, blue 100%); +} +</style> +<div></div> diff --git a/layout/reftests/css-gradients/aja-linear-1f.html b/layout/reftests/css-gradients/aja-linear-1f.html new file mode 100644 index 000000000..dd8b4f55e --- /dev/null +++ b/layout/reftests/css-gradients/aja-linear-1f.html @@ -0,0 +1,10 @@ +<!doctype html> +<!-- Derived from http://a-ja.net/newgrad.html --> +<style> +div { + height: 200px; + width: 100px; + background: -moz-linear-gradient(center top, yellow, blue); +} +</style> +<div></div> diff --git a/layout/reftests/css-gradients/aja-linear-1g.html b/layout/reftests/css-gradients/aja-linear-1g.html new file mode 100644 index 000000000..3de0665cb --- /dev/null +++ b/layout/reftests/css-gradients/aja-linear-1g.html @@ -0,0 +1,10 @@ +<!doctype html> +<!-- Derived from http://a-ja.net/newgrad.html --> +<style> +div { + height: 200px; + width: 100px; + background: -moz-linear-gradient(yellow, blue); +} +</style> +<div></div> diff --git a/layout/reftests/css-gradients/aja-linear-2-ref.html b/layout/reftests/css-gradients/aja-linear-2-ref.html new file mode 100644 index 000000000..5ca117466 --- /dev/null +++ b/layout/reftests/css-gradients/aja-linear-2-ref.html @@ -0,0 +1,23 @@ +<!doctype html> +<!-- Derived from http://a-ja.net/newgrad.html --> +<html class="reftest-wait"> +<head> +<script> +function doDraw() { + var ctx = document.getElementById('canvas').getContext('2d'); + + var grad = ctx.createLinearGradient(0,0,100,200); + grad.addColorStop(0, 'yellow'); + grad.addColorStop(1, 'blue'); + + ctx.fillStyle = grad; + ctx.fillRect(0,0,100,200); + + document.documentElement.removeAttribute('class'); +} +</script> +</head> +<body onload="doDraw();"> +<canvas id="canvas" width="100" height="200"></canvas> +</body> +</html> diff --git a/layout/reftests/css-gradients/aja-linear-2a.html b/layout/reftests/css-gradients/aja-linear-2a.html new file mode 100644 index 000000000..5b85bf971 --- /dev/null +++ b/layout/reftests/css-gradients/aja-linear-2a.html @@ -0,0 +1,10 @@ +<!doctype html> +<!-- Derived from http://a-ja.net/newgrad.html --> +<style> +div { + height: 200px; + width: 100px; + background: -moz-linear-gradient(top left, yellow, blue); +} +</style> +<div></div> diff --git a/layout/reftests/css-gradients/aja-linear-2b.html b/layout/reftests/css-gradients/aja-linear-2b.html new file mode 100644 index 000000000..388ade074 --- /dev/null +++ b/layout/reftests/css-gradients/aja-linear-2b.html @@ -0,0 +1,10 @@ +<!doctype html> +<!-- Derived from http://a-ja.net/newgrad.html --> +<style> +div { + height: 200px; + width: 100px; + background: -moz-linear-gradient(0 0, yellow, blue); +} +</style> +<div></div> diff --git a/layout/reftests/css-gradients/aja-linear-2c.html b/layout/reftests/css-gradients/aja-linear-2c.html new file mode 100644 index 000000000..27b364d71 --- /dev/null +++ b/layout/reftests/css-gradients/aja-linear-2c.html @@ -0,0 +1,10 @@ +<!doctype html> +<!-- Derived from http://a-ja.net/newgrad.html --> +<style> +div { + height: 200px; + width: 100px; + background: -moz-linear-gradient(top 0px left 0px, yellow, blue); +} +</style> +<div></div> diff --git a/layout/reftests/css-gradients/aja-linear-2d.html b/layout/reftests/css-gradients/aja-linear-2d.html new file mode 100644 index 000000000..f8fa55973 --- /dev/null +++ b/layout/reftests/css-gradients/aja-linear-2d.html @@ -0,0 +1,10 @@ +<!doctype html> +<!-- Derived from http://a-ja.net/newgrad.html --> +<style> +div { + height: 200px; + width: 100px; + background: -moz-linear-gradient(bottom right, blue, yellow); +} +</style> +<div></div> diff --git a/layout/reftests/css-gradients/aja-linear-3-ref.html b/layout/reftests/css-gradients/aja-linear-3-ref.html new file mode 100644 index 000000000..75086eefc --- /dev/null +++ b/layout/reftests/css-gradients/aja-linear-3-ref.html @@ -0,0 +1,25 @@ +<!doctype html> +<!-- Derived from http://a-ja.net/newgrad.html --> +<html class="reftest-wait"> +<head> +<script> +function doDraw() { + var ctx = document.getElementById('canvas').getContext('2d'); + + /* this gradient goes at an angle of -45deg through the center of + the box */ + var grad = ctx.createLinearGradient(-25,25,125,175); + grad.addColorStop(0, 'yellow'); + grad.addColorStop(1, 'blue'); + + ctx.fillStyle = grad; + ctx.fillRect(0,0,100,200); + + document.documentElement.removeAttribute('class'); +} +</script> +</head> +<body onload="doDraw();"> +<canvas id="canvas" width="100" height="200"></canvas> +</body> +</html> diff --git a/layout/reftests/css-gradients/aja-linear-3a.html b/layout/reftests/css-gradients/aja-linear-3a.html new file mode 100644 index 000000000..e59acd965 --- /dev/null +++ b/layout/reftests/css-gradients/aja-linear-3a.html @@ -0,0 +1,10 @@ +<!doctype html> +<!-- Derived from http://a-ja.net/newgrad.html --> +<style> +div { + height: 200px; + width: 100px; + background: linear-gradient(135deg, yellow, blue); +} +</style> +<div></div> diff --git a/layout/reftests/css-gradients/aja-linear-3b.html b/layout/reftests/css-gradients/aja-linear-3b.html new file mode 100644 index 000000000..3ad588f22 --- /dev/null +++ b/layout/reftests/css-gradients/aja-linear-3b.html @@ -0,0 +1,10 @@ +<!doctype html> +<!-- Derived from http://a-ja.net/newgrad.html --> +<style> +div { + height: 200px; + width: 100px; + background: linear-gradient(-225deg, yellow, blue); +} +</style> +<div></div> diff --git a/layout/reftests/css-gradients/aja-linear-4-ref.html b/layout/reftests/css-gradients/aja-linear-4-ref.html new file mode 100644 index 000000000..c26d0204f --- /dev/null +++ b/layout/reftests/css-gradients/aja-linear-4-ref.html @@ -0,0 +1,24 @@ +<!doctype html> +<!-- Derived from http://a-ja.net/newgrad.html --> +<html class="reftest-wait"> +<head> +<script> +function doDraw() { + var ctx = document.getElementById('canvas').getContext('2d'); + + var grad = ctx.createLinearGradient(50, 0, 50, 200); + grad.addColorStop(0, 'yellow'); + grad.addColorStop(0.5, 'blue'); + grad.addColorStop(1, '#0f0'); + + ctx.fillStyle = grad; + ctx.fillRect(0,0,100,200); + + document.documentElement.removeAttribute('class'); +} +</script> +</head> +<body onload="doDraw();"> +<canvas id="canvas" width="100" height="200"></canvas> +</body> +</html> diff --git a/layout/reftests/css-gradients/aja-linear-4a.html b/layout/reftests/css-gradients/aja-linear-4a.html new file mode 100644 index 000000000..5acf602ee --- /dev/null +++ b/layout/reftests/css-gradients/aja-linear-4a.html @@ -0,0 +1,10 @@ +<!doctype html> +<!-- Derived from http://a-ja.net/newgrad.html --> +<style> +div { + height: 200px; + width: 100px; + background: -moz-linear-gradient(top, yellow, blue, #0f0); +} +</style> +<div></div> diff --git a/layout/reftests/css-gradients/aja-linear-4b.html b/layout/reftests/css-gradients/aja-linear-4b.html new file mode 100644 index 000000000..c83175162 --- /dev/null +++ b/layout/reftests/css-gradients/aja-linear-4b.html @@ -0,0 +1,10 @@ +<!doctype html> +<!-- Derived from http://a-ja.net/newgrad.html --> +<style> +div { + height: 200px; + width: 100px; + background: -moz-linear-gradient(top, yellow, blue 50%, #0f0); +} +</style> +<div></div> diff --git a/layout/reftests/css-gradients/aja-linear-5-ref.html b/layout/reftests/css-gradients/aja-linear-5-ref.html new file mode 100644 index 000000000..1a26fd96a --- /dev/null +++ b/layout/reftests/css-gradients/aja-linear-5-ref.html @@ -0,0 +1,24 @@ +<!doctype html> +<!-- Derived from http://a-ja.net/newgrad.html --> +<html class="reftest-wait"> +<head> +<script> +function doDraw() { + var ctx = document.getElementById('canvas').getContext('2d'); + + var grad = ctx.createLinearGradient(50, 0, 50, 200); + grad.addColorStop(0, 'yellow'); + grad.addColorStop(0.2, 'blue'); + grad.addColorStop(1, '#0f0'); + + ctx.fillStyle = grad; + ctx.fillRect(0,0,100,200); + + document.documentElement.removeAttribute('class'); +} +</script> +</head> +<body onload="doDraw();"> +<canvas id="canvas" width="100" height="200"></canvas> +</body> +</html> diff --git a/layout/reftests/css-gradients/aja-linear-5a.html b/layout/reftests/css-gradients/aja-linear-5a.html new file mode 100644 index 000000000..9358acb55 --- /dev/null +++ b/layout/reftests/css-gradients/aja-linear-5a.html @@ -0,0 +1,10 @@ +<!doctype html> +<!-- Derived from http://a-ja.net/newgrad.html --> +<style> +div { + height: 200px; + width: 100px; + background: -moz-linear-gradient(top, yellow, blue 20%, #0f0); +} +</style> +<div></div> diff --git a/layout/reftests/css-gradients/aja-linear-6-ref.html b/layout/reftests/css-gradients/aja-linear-6-ref.html new file mode 100644 index 000000000..b23496fa7 --- /dev/null +++ b/layout/reftests/css-gradients/aja-linear-6-ref.html @@ -0,0 +1,23 @@ +<!doctype html> +<!-- Derived from http://a-ja.net/newgrad.html --> +<html class="reftest-wait"> +<head> +<script> +function doDraw() { + var ctx = document.getElementById('canvas').getContext('2d'); + + var grad = ctx.createLinearGradient(20, 30, 80, 170); + grad.addColorStop(0, 'yellow'); + grad.addColorStop(1, 'blue'); + + ctx.fillStyle = grad; + ctx.fillRect(0,0,100,200); + + document.documentElement.removeAttribute('class'); +} +</script> +</head> +<body onload="doDraw();"> +<canvas id="canvas" width="100" height="200"></canvas> +</body> +</html> diff --git a/layout/reftests/css-gradients/aja-linear-6a.html b/layout/reftests/css-gradients/aja-linear-6a.html new file mode 100644 index 000000000..ef4a6e526 --- /dev/null +++ b/layout/reftests/css-gradients/aja-linear-6a.html @@ -0,0 +1,10 @@ +<!doctype html> +<!-- Derived from http://a-ja.net/newgrad.html --> +<style> +div { + height: 200px; + width: 100px; + background: -moz-linear-gradient(20px 30px, yellow, blue); +} +</style> +<div></div> diff --git a/layout/reftests/css-gradients/aja-linear-6b.html b/layout/reftests/css-gradients/aja-linear-6b.html new file mode 100644 index 000000000..0e05a0e00 --- /dev/null +++ b/layout/reftests/css-gradients/aja-linear-6b.html @@ -0,0 +1,10 @@ +<!doctype html> +<!-- Derived from http://a-ja.net/newgrad.html --> +<style> +div { + height: 200px; + width: 100px; + background: -moz-linear-gradient(left 20px top 30px, yellow, blue); +} +</style> +<div></div> diff --git a/layout/reftests/css-gradients/bug-916535-background-repeat-linear-ref.html b/layout/reftests/css-gradients/bug-916535-background-repeat-linear-ref.html new file mode 100644 index 000000000..c4c0a8b9c --- /dev/null +++ b/layout/reftests/css-gradients/bug-916535-background-repeat-linear-ref.html @@ -0,0 +1,24 @@ +<!doctype html> +<html lang="en"> + +<head> + <meta charset="utf-8"> + <title>Grid</title> + <style> + body { + background: #fff; + } + .r {background: red; width: 300px; height: 50px} + .g {background: green; width: 300px; height: 50px} + </style> +</head> + +<body> + <div class=r></div> + <div class=g></div> + <div class=r></div> + <div class=g></div> + <div class=r></div> + <div class=g></div> +</body> +</html> diff --git a/layout/reftests/css-gradients/bug-916535-background-repeat-linear.html b/layout/reftests/css-gradients/bug-916535-background-repeat-linear.html new file mode 100644 index 000000000..995c9e041 --- /dev/null +++ b/layout/reftests/css-gradients/bug-916535-background-repeat-linear.html @@ -0,0 +1,25 @@ +<!doctype html> +<html lang="en"> + +<head> + <meta charset="utf-8"> + <title>Grid</title> + <style> + body { + background: #fff; + } + div { + width: 300px; + height: 300px; + background-color: #269; + background-size: 100px 100px; + background-image: + linear-gradient( red 50px, green 50px); + } + </style> +</head> + +<body> + <div ></div> +</body> +</html> diff --git a/layout/reftests/css-gradients/height-dependence-1-ref.html b/layout/reftests/css-gradients/height-dependence-1-ref.html new file mode 100644 index 000000000..b6f5a9846 --- /dev/null +++ b/layout/reftests/css-gradients/height-dependence-1-ref.html @@ -0,0 +1,43 @@ +<!doctype html> +<html><head> +<style> +html { + background-image: -moz-linear-gradient(black, white 20%); + background-repeat: repeat-x; +} +body { + font-size: 1em; + padding: 2em; + margin: 50px auto; + width: 14em; + border: 1px solid black; + background-color: white; +} +</style> +</head><body> +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +</body> +</html> diff --git a/layout/reftests/css-gradients/height-dependence-1.html b/layout/reftests/css-gradients/height-dependence-1.html new file mode 100644 index 000000000..0190d794c --- /dev/null +++ b/layout/reftests/css-gradients/height-dependence-1.html @@ -0,0 +1,49 @@ +<!doctype html> +<html class="reftest-wait"><head> +<style> +html { + background-image: -moz-linear-gradient(black, white 20%); + background-repeat: repeat-x; +} +body { + font-size: 1em; + padding: 2em; + margin: 50px auto; + width: 28em; + border: 1px solid black; + background-color: white; +} +</style> +<script> +window.addEventListener("MozReftestInvalidate", function() { + document.body.style.width = "14em"; + document.documentElement.removeAttribute("class"); +}, false); +</script> +</head><body> +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +</body> +</html> diff --git a/layout/reftests/css-gradients/height-dependence-2-ref.html b/layout/reftests/css-gradients/height-dependence-2-ref.html new file mode 100644 index 000000000..b370614e8 --- /dev/null +++ b/layout/reftests/css-gradients/height-dependence-2-ref.html @@ -0,0 +1,44 @@ +<!doctype html> +<html><head> +<style> +html { + background-image: -moz-linear-gradient(black, white 20%); + background-repeat: repeat-x; + background-size: 1px 400px; +} +body { + font-size: 1em; + padding: 2em; + margin: 50px auto; + width: 14em; + border: 1px solid black; + background-color: white; +} +</style> +</head><body> +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +</body> +</html> diff --git a/layout/reftests/css-gradients/height-dependence-2.html b/layout/reftests/css-gradients/height-dependence-2.html new file mode 100644 index 000000000..c258f70eb --- /dev/null +++ b/layout/reftests/css-gradients/height-dependence-2.html @@ -0,0 +1,50 @@ +<!doctype html> +<html class="reftest-wait"><head> +<style> +html { + background-image: -moz-linear-gradient(black, white 20%); + background-repeat: repeat-x; + background-size: 1px 400px; +} +body { + font-size: 1em; + padding: 2em; + margin: 50px auto; + width: 28em; + border: 1px solid black; + background-color: white; +} +</style> +<script> +window.addEventListener("MozReftestInvalidate", function() { + document.body.style.width = "14em"; + document.documentElement.removeAttribute("class"); +}, false); +</script> +</head><body> +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +</body> +</html> diff --git a/layout/reftests/css-gradients/height-dependence-3-ref.html b/layout/reftests/css-gradients/height-dependence-3-ref.html new file mode 100644 index 000000000..802eef4c3 --- /dev/null +++ b/layout/reftests/css-gradients/height-dependence-3-ref.html @@ -0,0 +1,44 @@ +<!doctype html> +<html><head> +<style> +html { + background-image: -moz-linear-gradient(black, white 20%); + background-repeat: repeat-x; + background-size: 1px 80%; +} +body { + font-size: 1em; + padding: 2em; + margin: 50px auto; + width: 14em; + border: 1px solid black; + background-color: white; +} +</style> +</head><body> +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +</body> +</html> diff --git a/layout/reftests/css-gradients/height-dependence-3.html b/layout/reftests/css-gradients/height-dependence-3.html new file mode 100644 index 000000000..49ac4d4a3 --- /dev/null +++ b/layout/reftests/css-gradients/height-dependence-3.html @@ -0,0 +1,50 @@ +<!doctype html> +<html class="reftest-wait"><head> +<style> +html { + background-image: -moz-linear-gradient(black, white 20%); + background-repeat: repeat-x; + background-size: 1px 80%; +} +body { + font-size: 1em; + padding: 2em; + margin: 50px auto; + width: 28em; + border: 1px solid black; + background-color: white; +} +</style> +<script> +window.addEventListener("MozReftestInvalidate", function() { + document.body.style.width = "14em"; + document.documentElement.removeAttribute("class"); +}, false); +</script> +</head><body> +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +pad pad pad pad pad pad pad pad +</body> +</html> diff --git a/layout/reftests/css-gradients/large-gradient-1-ref.html b/layout/reftests/css-gradients/large-gradient-1-ref.html new file mode 100644 index 000000000..ddd7651e6 --- /dev/null +++ b/layout/reftests/css-gradients/large-gradient-1-ref.html @@ -0,0 +1,23 @@ +<!-- + Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ +--> +<!DOCTYPE html> +<html lang="en"> +<meta charset="utf-8"> +<title>Make sure that large gradient backgrounds are painted even at extreme scroll positions</title> + +<style> + +html { + background: white; + overflow: hidden; +} + +body { + margin: 0; + height: 1000px; + background-image: linear-gradient(rgb(210,210,210) 0px, rgb(215,215,215) 1000px); +} + +</style> diff --git a/layout/reftests/css-gradients/large-gradient-1.html b/layout/reftests/css-gradients/large-gradient-1.html new file mode 100644 index 000000000..bcba165a2 --- /dev/null +++ b/layout/reftests/css-gradients/large-gradient-1.html @@ -0,0 +1,40 @@ +<!-- + Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ +--> +<!DOCTYPE html> +<html lang="en" class="reftest-wait"> +<meta charset="utf-8"> +<title>Make sure that large gradient backgrounds are painted even at extreme scroll positions</title> +<!-- See https://bugzilla.mozilla.org/show_bug.cgi?id=1011166 --> + +<style> + +html { + background: white; + overflow: hidden; +} + +body { + margin: 0; + height: 51000px; /* = 255 * 200 */ + background-image: linear-gradient(rgb(0,0,0) 0px, rgb(255,255,255) 51000px); +} + +div { + height: 1000px; + background-color: red; +} + +</style> + +<div></div> + +<script> + +window.addEventListener("MozReftestInvalidate", function () { + document.documentElement.scrollTop = 210 * 200; // 42000 > 32768 + document.documentElement.removeAttribute("class"); +}); + +</script> diff --git a/layout/reftests/css-gradients/large-gradient-2-ref.html b/layout/reftests/css-gradients/large-gradient-2-ref.html new file mode 100644 index 000000000..ee33eedf1 --- /dev/null +++ b/layout/reftests/css-gradients/large-gradient-2-ref.html @@ -0,0 +1,17 @@ +<!-- + Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ +--> +<!DOCTYPE html> +<html lang="en"> +<meta charset="utf-8"> +<title>Make sure that large gradient backgrounds are painted even at extreme scroll positions</title> + +<style> + +html { + background: lime; + overflow: hidden; +} + +</style> diff --git a/layout/reftests/css-gradients/large-gradient-2.html b/layout/reftests/css-gradients/large-gradient-2.html new file mode 100644 index 000000000..17074badd --- /dev/null +++ b/layout/reftests/css-gradients/large-gradient-2.html @@ -0,0 +1,40 @@ +<!-- + Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ +--> +<!DOCTYPE html> +<html lang="en" class="reftest-wait"> +<meta charset="utf-8"> +<title>Make sure that large gradient backgrounds are painted even at extreme scroll positions</title> +<!-- See https://bugzilla.mozilla.org/show_bug.cgi?id=1011166 --> + +<style> + +html { + background: white; + overflow: hidden; +} + +body { + margin: 0; + height: 51000px; + background-image: linear-gradient(black 0px, lime 2000px); +} + +div { + height: 1000px; + background-color: red; +} + +</style> + +<div></div> + +<script> + +window.addEventListener("MozReftestInvalidate", function () { + document.documentElement.scrollTop = 42000; // > 32768 + document.documentElement.removeAttribute("class"); +}); + +</script> diff --git a/layout/reftests/css-gradients/large-gradient-3-ref.html b/layout/reftests/css-gradients/large-gradient-3-ref.html new file mode 100644 index 000000000..e13864ee6 --- /dev/null +++ b/layout/reftests/css-gradients/large-gradient-3-ref.html @@ -0,0 +1,23 @@ +<!-- + Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ +--> +<!DOCTYPE html> +<html lang="en"> +<meta charset="utf-8"> +<title>Make sure that large gradient backgrounds are painted even at extreme scroll positions</title> + +<style> + +html { + background: white; + overflow: hidden; +} + +body { + margin: 0; + height: 1000px; + background-image: linear-gradient(rgb(210,210,210) 0px, rgb(215,215,215) 4000px); +} + +</style> diff --git a/layout/reftests/css-gradients/large-gradient-3.html b/layout/reftests/css-gradients/large-gradient-3.html new file mode 100644 index 000000000..0c859a89b --- /dev/null +++ b/layout/reftests/css-gradients/large-gradient-3.html @@ -0,0 +1,40 @@ +<!-- + Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ +--> +<!DOCTYPE html> +<html lang="en" class="reftest-wait"> +<meta charset="utf-8"> +<title>Make sure that large gradient backgrounds are painted even at extreme scroll positions</title> +<!-- See https://bugzilla.mozilla.org/show_bug.cgi?id=1011166 --> + +<style> + +html { + background: white; + overflow: hidden; +} + +body { + margin: 0; + height: 204000px; /* = 255 * 800 */ + background-image: linear-gradient(rgb(0,0,0) 0px, rgb(255,255,255) 204000px); +} + +div { + height: 1000px; + background-color: red; +} + +</style> + +<div></div> + +<script> + +window.addEventListener("MozReftestInvalidate", function () { + document.documentElement.scrollTop = 210 * 800; // 168000 > 131072 == 2^17 + document.documentElement.removeAttribute("class"); +}); + +</script> diff --git a/layout/reftests/css-gradients/large-gradient-4-ref.html b/layout/reftests/css-gradients/large-gradient-4-ref.html new file mode 100644 index 000000000..ee33eedf1 --- /dev/null +++ b/layout/reftests/css-gradients/large-gradient-4-ref.html @@ -0,0 +1,17 @@ +<!-- + Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ +--> +<!DOCTYPE html> +<html lang="en"> +<meta charset="utf-8"> +<title>Make sure that large gradient backgrounds are painted even at extreme scroll positions</title> + +<style> + +html { + background: lime; + overflow: hidden; +} + +</style> diff --git a/layout/reftests/css-gradients/large-gradient-4.html b/layout/reftests/css-gradients/large-gradient-4.html new file mode 100644 index 000000000..dc8f15102 --- /dev/null +++ b/layout/reftests/css-gradients/large-gradient-4.html @@ -0,0 +1,40 @@ +<!-- + Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ +--> +<!DOCTYPE html> +<html lang="en" class="reftest-wait"> +<meta charset="utf-8"> +<title>Make sure that large gradient backgrounds are painted even at extreme scroll positions</title> +<!-- See https://bugzilla.mozilla.org/show_bug.cgi?id=1011166 --> + +<style> + +html { + background: white; + overflow: hidden; +} + +body { + margin: 0; + height: 204000px; /* = 255 * 800 */; + background-image: linear-gradient(black 0px, lime 2000px); +} + +div { + height: 1000px; + background-color: red; +} + +</style> + +<div></div> + +<script> + +window.addEventListener("MozReftestInvalidate", function () { + document.documentElement.scrollTop = 210 * 800; // 168000 > 131072 == 2^17 + document.documentElement.removeAttribute("class"); +}); + +</script> diff --git a/layout/reftests/css-gradients/large-gradient-5-ref.html b/layout/reftests/css-gradients/large-gradient-5-ref.html new file mode 100644 index 000000000..a0e923756 --- /dev/null +++ b/layout/reftests/css-gradients/large-gradient-5-ref.html @@ -0,0 +1,19 @@ +<!-- + Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ +--> +<!DOCTYPE html> +<html lang="en"> +<meta charset="utf-8"> +<title>Reference for: Make sure that large gradient backgrounds are painted even at extreme scroll positions</title> +<!-- See https://bugzilla.mozilla.org/show_bug.cgi?id=1271112 --> + +<style> + +html { + background-color: lime; +} + +</style> + +<body> diff --git a/layout/reftests/css-gradients/large-gradient-5.html b/layout/reftests/css-gradients/large-gradient-5.html new file mode 100644 index 000000000..d254d461e --- /dev/null +++ b/layout/reftests/css-gradients/large-gradient-5.html @@ -0,0 +1,30 @@ +<!-- + Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ +--> +<!DOCTYPE html> +<html lang="en"> +<meta charset="utf-8"> +<title>Make sure that large gradient backgrounds are painted even at extreme scroll positions</title> +<!-- See https://bugzilla.mozilla.org/show_bug.cgi?id=1271112 --> + +<style> + +html, body { + overflow: hidden; +} + +body { + margin: 0; + height: 100000px; + /* a green gradient that is not opaque on top of a red background color */ + background: repeating-linear-gradient(45deg, rgba(0, 255, 0, 1.0) 0%, rgba(0, 255, 0, 0.99) 10%, rgba(0, 255, 0, 1.0) 20%) red; +} + +</style> + +<body> + +<script> +document.documentElement.scrollTop = 35000; +</script> diff --git a/layout/reftests/css-gradients/linear-1-ref.html b/layout/reftests/css-gradients/linear-1-ref.html new file mode 100644 index 000000000..f4d209a3d --- /dev/null +++ b/layout/reftests/css-gradients/linear-1-ref.html @@ -0,0 +1,24 @@ +<html xmlns="http://www.w3.org/1999/xhtml" + class="reftest-wait"> +<head> +<script> +function doDraw() { + var ctx = document.getElementById('canvas').getContext('2d'); + + var grad = ctx.createLinearGradient(0,150,300,150); + grad.addColorStop(0, 'red'); + grad.addColorStop(1, 'rgb(100, 200, 0)'); + grad.addColorStop(0.5, '#7777FF'); + + ctx.fillStyle = grad; + ctx.fillRect(0,0,300,300); + + document.documentElement.removeAttribute('class'); +} +</script> +</head> +<body onload="doDraw();"> +<canvas id="canvas" width="300" height="300"/> +</body> +</html> + diff --git a/layout/reftests/css-gradients/linear-1a.html b/layout/reftests/css-gradients/linear-1a.html new file mode 100644 index 000000000..e4a50d779 --- /dev/null +++ b/layout/reftests/css-gradients/linear-1a.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(to right, red 0%, #7777FF 50%, rgb(100, 200, 0) 100%) no-repeat; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/linear-1b.html b/layout/reftests/css-gradients/linear-1b.html new file mode 100644 index 000000000..111fb0501 --- /dev/null +++ b/layout/reftests/css-gradients/linear-1b.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(left, red 0%, #7777FF 50%, rgb(100, 200, 0) 100%) no-repeat; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-1-ref.html b/layout/reftests/css-gradients/linear-diagonal-1-ref.html new file mode 100644 index 000000000..4aa7d3649 --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-1-ref.html @@ -0,0 +1 @@ +<div style="background: linear-gradient(to bottom right, white, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-1a.html b/layout/reftests/css-gradients/linear-diagonal-1a.html new file mode 100644 index 000000000..d59591791 --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-1a.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(top left -45deg, white, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-1b.html b/layout/reftests/css-gradients/linear-diagonal-1b.html new file mode 100644 index 000000000..382816918 --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-1b.html @@ -0,0 +1 @@ +<div style="background: linear-gradient(135deg, white, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-1c.html b/layout/reftests/css-gradients/linear-diagonal-1c.html new file mode 100644 index 000000000..ca4177f1b --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-1c.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(top left, white, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-2-ref.html b/layout/reftests/css-gradients/linear-diagonal-2-ref.html new file mode 100644 index 000000000..22cc0ab1e --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-2-ref.html @@ -0,0 +1 @@ +<div style="background: linear-gradient(to bottom left, white, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-2a.html b/layout/reftests/css-gradients/linear-diagonal-2a.html new file mode 100644 index 000000000..71c6df077 --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-2a.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(top right -135deg, white, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-2b.html b/layout/reftests/css-gradients/linear-diagonal-2b.html new file mode 100644 index 000000000..ed8281cde --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-2b.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(-135deg, white, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-2c.html b/layout/reftests/css-gradients/linear-diagonal-2c.html new file mode 100644 index 000000000..6fcab518c --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-2c.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(top right, white, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-3-ref.html b/layout/reftests/css-gradients/linear-diagonal-3-ref.html new file mode 100644 index 000000000..6a06898de --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-3-ref.html @@ -0,0 +1 @@ +<div style="background: linear-gradient(to top left, white, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-3a.html b/layout/reftests/css-gradients/linear-diagonal-3a.html new file mode 100644 index 000000000..d0d2b690e --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-3a.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(bottom right 135deg, white, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-3b.html b/layout/reftests/css-gradients/linear-diagonal-3b.html new file mode 100644 index 000000000..dd61b284b --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-3b.html @@ -0,0 +1 @@ +<div style="background: linear-gradient(-45deg, white, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-3c.html b/layout/reftests/css-gradients/linear-diagonal-3c.html new file mode 100644 index 000000000..d509bfa04 --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-3c.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(bottom right, white, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-4-ref.html b/layout/reftests/css-gradients/linear-diagonal-4-ref.html new file mode 100644 index 000000000..0ff8802b0 --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-4-ref.html @@ -0,0 +1 @@ +<div style="background: linear-gradient(to top right, white, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-4a.html b/layout/reftests/css-gradients/linear-diagonal-4a.html new file mode 100644 index 000000000..a4e8fb7fd --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-4a.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(bottom left 45deg, white, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-4b.html b/layout/reftests/css-gradients/linear-diagonal-4b.html new file mode 100644 index 000000000..05a0c31f4 --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-4b.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(45deg, white, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-4c.html b/layout/reftests/css-gradients/linear-diagonal-4c.html new file mode 100644 index 000000000..9c5e47b52 --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-4c.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(bottom left, white, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-5-ref.html b/layout/reftests/css-gradients/linear-diagonal-5-ref.html new file mode 100644 index 000000000..6e658f97d --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-5-ref.html @@ -0,0 +1 @@ +<div style="background: linear-gradient(to top left, white 75%, black); width: 400px; height: 400px;"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-5a.html b/layout/reftests/css-gradients/linear-diagonal-5a.html new file mode 100644 index 000000000..bd7b9e6be --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-5a.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(100px 100px 135deg, white, black); width: 400px; height: 400px;"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-6-ref.html b/layout/reftests/css-gradients/linear-diagonal-6-ref.html new file mode 100644 index 000000000..88580850a --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-6-ref.html @@ -0,0 +1 @@ +<div style="background: linear-gradient(to top right, white 75%, black); width: 400px; height: 400px;"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-6a.html b/layout/reftests/css-gradients/linear-diagonal-6a.html new file mode 100644 index 000000000..079fd37e0 --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-6a.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(300px 100px 45deg, white, black); width: 400px; height: 400px;"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-7-ref.html b/layout/reftests/css-gradients/linear-diagonal-7-ref.html new file mode 100644 index 000000000..aa584b982 --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-7-ref.html @@ -0,0 +1 @@ +<div style="background: linear-gradient(to bottom right, white 75%, black); width: 400px; height: 400px;"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-7a.html b/layout/reftests/css-gradients/linear-diagonal-7a.html new file mode 100644 index 000000000..c4f44fa70 --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-7a.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(300px 300px -45deg, white, black); width: 400px; height: 400px;"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-8-ref.html b/layout/reftests/css-gradients/linear-diagonal-8-ref.html new file mode 100644 index 000000000..0f914ebd7 --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-8-ref.html @@ -0,0 +1 @@ +<div style="background: linear-gradient(to bottom left, white 75%, black); width: 400px; height: 400px;"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-8a.html b/layout/reftests/css-gradients/linear-diagonal-8a.html new file mode 100644 index 000000000..96ca8b60a --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-8a.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(100px 300px -135deg, white, black); width: 400px; height: 400px;"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-9-ref.html b/layout/reftests/css-gradients/linear-diagonal-9-ref.html new file mode 100644 index 000000000..f271b0453 --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-9-ref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<style> +.x { width: 200px; height: 100px; display: inline-block; } +.a { background: -moz-linear-gradient(top -90deg, blue, white, red); } +.e { background: -moz-linear-gradient(top right -2.03444394rad, blue, white, red); } +.g { background: -moz-linear-gradient(right 180deg, blue, white, red); } +.i { background: -moz-linear-gradient(bottom right 2.03444394rad, blue, white, red); } +.k { background: -moz-linear-gradient(bottom 90deg, blue, white, red); } +.m { background: -moz-linear-gradient(bottom left 1.10714872rad, blue, white, red); } +.o { background: -moz-linear-gradient(left 0deg, blue, white, red); } +.q { background: -moz-linear-gradient(top left -1.10714872rad, blue, white, red); } +</style> +<div class="x a"></div> +<div class="x e"></div> +<div class="x g"></div> +<div class="x i"></div> +<div class="x k"></div> +<div class="x m"></div> +<div class="x o"></div> +<div class="x q"></div> diff --git a/layout/reftests/css-gradients/linear-diagonal-9a.html b/layout/reftests/css-gradients/linear-diagonal-9a.html new file mode 100644 index 000000000..33f0cece9 --- /dev/null +++ b/layout/reftests/css-gradients/linear-diagonal-9a.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<style> +.x { width: 200px; height: 100px; display: inline-block; } +.a { background: linear-gradient(to bottom, blue, white, red); } +.e { background: linear-gradient(to bottom left, blue, white, red); } +.g { background: linear-gradient(to left, blue, white, red); } +.i { background: linear-gradient(to top left, blue, white, red); } +.k { background: linear-gradient(to top, blue, white, red); } +.m { background: linear-gradient(to top right, blue, white, red); } +.o { background: linear-gradient(to right, blue, white, red); } +.q { background: linear-gradient(to bottom right, blue, white, red); } +</style> +<div class="x a"></div> +<div class="x e"></div> +<div class="x g"></div> +<div class="x i"></div> +<div class="x k"></div> +<div class="x m"></div> +<div class="x o"></div> +<div class="x q"></div> diff --git a/layout/reftests/css-gradients/linear-flipped-1-ref.html b/layout/reftests/css-gradients/linear-flipped-1-ref.html new file mode 100644 index 000000000..2817ff53a --- /dev/null +++ b/layout/reftests/css-gradients/linear-flipped-1-ref.html @@ -0,0 +1,2 @@ +<!DOCTYPE HTML> +<div style="height:100px; background:-moz-linear-gradient(bottom, black, white);"></div> diff --git a/layout/reftests/css-gradients/linear-flipped-1.html b/layout/reftests/css-gradients/linear-flipped-1.html new file mode 100644 index 000000000..260831086 --- /dev/null +++ b/layout/reftests/css-gradients/linear-flipped-1.html @@ -0,0 +1,2 @@ +<!DOCTYPE HTML>
+<div style="height:100px; background:-moz-linear-gradient(top, black, white); transform:scale(1,-1);"></div>
diff --git a/layout/reftests/css-gradients/linear-keywords-1-ref.html b/layout/reftests/css-gradients/linear-keywords-1-ref.html new file mode 100644 index 000000000..d311b3df1 --- /dev/null +++ b/layout/reftests/css-gradients/linear-keywords-1-ref.html @@ -0,0 +1,23 @@ +<html xmlns="http://www.w3.org/1999/xhtml" + class="reftest-wait"> +<head> +<script> +function doDraw() { + var ctx = document.getElementById('canvas').getContext('2d'); + + var grad = ctx.createLinearGradient(0,0,300,300); + grad.addColorStop(0, '#0000ff'); + grad.addColorStop(1, '#000000'); + + ctx.fillStyle = grad; + ctx.fillRect(0,0,300,300); + + document.documentElement.removeAttribute('class'); +} +</script> +</head> +<body onload="doDraw();"> +<canvas id="canvas" width="300" height="300"/> +</body> +</html> + diff --git a/layout/reftests/css-gradients/linear-keywords-1a.html b/layout/reftests/css-gradients/linear-keywords-1a.html new file mode 100644 index 000000000..48cf46606 --- /dev/null +++ b/layout/reftests/css-gradients/linear-keywords-1a.html @@ -0,0 +1 @@ +<div style="background: linear-gradient(to right bottom, #0000ff, #000000) no-repeat; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/linear-keywords-1b.html b/layout/reftests/css-gradients/linear-keywords-1b.html new file mode 100644 index 000000000..b4d61b351 --- /dev/null +++ b/layout/reftests/css-gradients/linear-keywords-1b.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(left top, #0000ff, #000000) no-repeat; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/linear-mix-ref.html b/layout/reftests/css-gradients/linear-mix-ref.html new file mode 100644 index 000000000..0d37fe0c1 --- /dev/null +++ b/layout/reftests/css-gradients/linear-mix-ref.html @@ -0,0 +1,34 @@ +<html xmlns="http://www.w3.org/1999/xhtml" + class="reftest-wait"> +<head> +<script> +function doDraw() { + var ctx = document.getElementById('canvas').getContext('2d'); + + var grad = ctx.createLinearGradient(120,20,300,20); + grad.addColorStop(0, '#0000ff'); + grad.addColorStop(1, '#000000'); + + ctx.fillStyle = grad; + ctx.fillRect(0,0,300,300); + + ctx = document.getElementById('canvas2').getContext('2d'); + + grad = ctx.createLinearGradient(30,300,30,0); + grad.addColorStop(0, '#00ff00'); + grad.addColorStop(1, '#000000'); + + ctx.fillStyle = grad; + ctx.fillRect(0,0,300,300); + + document.documentElement.removeAttribute('class'); +} +</script> +</head> +<body onload="doDraw();"> +<canvas id="canvas" width="300" height="300" style="position: absolute; top: 30px; left: 30px;"></canvas> +<br/><br/> +<canvas id="canvas2" width="300" height="300" style="position: absolute; top: 360px; left: 30px;"></canvas> +</body> +</html> + diff --git a/layout/reftests/css-gradients/linear-mix.html b/layout/reftests/css-gradients/linear-mix.html new file mode 100644 index 000000000..c4d5dbbc4 --- /dev/null +++ b/layout/reftests/css-gradients/linear-mix.html @@ -0,0 +1,3 @@ +<div style="background: -moz-linear-gradient(40% 20px 0deg, #0000ff, #000000) no-repeat; width: 300px; height: 300px; position: absolute; top: 30px; left: 30px;"><br></div> + +<div style="background: -moz-linear-gradient(10% bottom 90deg, #00ff00, #000000) no-repeat; width: 300px; height: 300px; position: absolute; top: 360px; left: 30px;"><br></div> diff --git a/layout/reftests/css-gradients/linear-onestopposition-1-ref.html b/layout/reftests/css-gradients/linear-onestopposition-1-ref.html new file mode 100644 index 000000000..c9fdca6b4 --- /dev/null +++ b/layout/reftests/css-gradients/linear-onestopposition-1-ref.html @@ -0,0 +1,12 @@ +<!DOCTYPE HTML> +<title>Test for linear-gradient() with all stops at the same position</title> +<style> + +div { + width: 200px; + height: 200px; + background-image: linear-gradient(to right, blue 0%, blue 25%, orange 25%, orange 100%); +} + +</style> +<div></div> diff --git a/layout/reftests/css-gradients/linear-onestopposition-1-ref2.html b/layout/reftests/css-gradients/linear-onestopposition-1-ref2.html new file mode 100644 index 000000000..51f70bcd4 --- /dev/null +++ b/layout/reftests/css-gradients/linear-onestopposition-1-ref2.html @@ -0,0 +1,21 @@ +<!DOCTYPE HTML> +<title>Test for linear-gradient() with all stops at the same position</title> +<style> + +#div1 { + float: left; + width: 50px; + height: 200px; + background: blue; +} + +#div2 { + float: left; + width: 150px; + height: 200px; + background: orange; +} + +</style> +<div id="div1"></div> +<div id="div2"></div> diff --git a/layout/reftests/css-gradients/linear-onestopposition-1.html b/layout/reftests/css-gradients/linear-onestopposition-1.html new file mode 100644 index 000000000..9a549d4a5 --- /dev/null +++ b/layout/reftests/css-gradients/linear-onestopposition-1.html @@ -0,0 +1,12 @@ +<!DOCTYPE HTML> +<title>Test for linear-gradient() with all stops at the same position</title> +<style> + +div { + width: 200px; + height: 200px; + background-image: -moz-linear-gradient(left, blue 25%, orange 25%); +} + +</style> +<div></div> diff --git a/layout/reftests/css-gradients/linear-percent-ref.html b/layout/reftests/css-gradients/linear-percent-ref.html new file mode 100644 index 000000000..e8d5d2153 --- /dev/null +++ b/layout/reftests/css-gradients/linear-percent-ref.html @@ -0,0 +1,23 @@ +<html xmlns="http://www.w3.org/1999/xhtml" + class="reftest-wait"> +<head> +<script> +function doDraw() { + var ctx = document.getElementById('canvas').getContext('2d'); + + var grad = ctx.createLinearGradient(30,60,300,60); + grad.addColorStop(0, '#0000ff'); + grad.addColorStop(1, '#000000'); + + ctx.fillStyle = grad; + ctx.fillRect(0,0,300,300); + + document.documentElement.removeAttribute('class'); +} +</script> +</head> +<body onload="doDraw();"> +<canvas id="canvas" width="300" height="300"/> +</body> +</html> + diff --git a/layout/reftests/css-gradients/linear-percent.html b/layout/reftests/css-gradients/linear-percent.html new file mode 100644 index 000000000..7a8b7e8dd --- /dev/null +++ b/layout/reftests/css-gradients/linear-percent.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(10% 20% 0deg, #0000ff, #000000) no-repeat; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/linear-position-1-ref.html b/layout/reftests/css-gradients/linear-position-1-ref.html new file mode 100644 index 000000000..cd66e6681 --- /dev/null +++ b/layout/reftests/css-gradients/linear-position-1-ref.html @@ -0,0 +1,2 @@ +<body style="margin:0;"> +<div style="background: linear-gradient(to right, white, black) no-repeat; position:relative; left:-200px; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/linear-position-1a.html b/layout/reftests/css-gradients/linear-position-1a.html new file mode 100644 index 000000000..5ad549c2a --- /dev/null +++ b/layout/reftests/css-gradients/linear-position-1a.html @@ -0,0 +1,2 @@ +<body style="margin:0;"> +<div style="background: -moz-linear-gradient(left, white, black) no-repeat; background-position:-200px 0; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/linear-premul-ref.html b/layout/reftests/css-gradients/linear-premul-ref.html new file mode 100644 index 000000000..bf0b12c33 --- /dev/null +++ b/layout/reftests/css-gradients/linear-premul-ref.html @@ -0,0 +1 @@ +<div style="background: linear-gradient(to right, rgba(255, 0, 0, .9) 0% , rgba(255, 0, 0, 0) 50%, rgba(0, 0, 255, 0) 50%, rgba(0, 0, 255, 1) 100%) no-repeat; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/linear-premul.html b/layout/reftests/css-gradients/linear-premul.html new file mode 100644 index 000000000..20c7c276a --- /dev/null +++ b/layout/reftests/css-gradients/linear-premul.html @@ -0,0 +1 @@ +<div style="background: linear-gradient(to right, rgba(255, 0, 0, .9) 0% , rgba(0, 255, 0, 0) 50%, rgba(0, 0, 255, 1) 100%) no-repeat; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/linear-repeat-1-ref.html b/layout/reftests/css-gradients/linear-repeat-1-ref.html new file mode 100644 index 000000000..f9f42811f --- /dev/null +++ b/layout/reftests/css-gradients/linear-repeat-1-ref.html @@ -0,0 +1,6 @@ +<div style="background: black; width: 300px; height: 50px;"></div> +<div style="background: white; width: 300px; height: 50px;"></div> +<div style="background: black; width: 300px; height: 50px;"></div> +<div style="background: white; width: 300px; height: 50px;"></div> +<div style="background: black; width: 300px; height: 50px;"></div> +<div style="background: white; width: 300px; height: 50px;"></div> diff --git a/layout/reftests/css-gradients/linear-repeat-1a.html b/layout/reftests/css-gradients/linear-repeat-1a.html new file mode 100644 index 000000000..e21be5c50 --- /dev/null +++ b/layout/reftests/css-gradients/linear-repeat-1a.html @@ -0,0 +1,2 @@ +<div style="background: -moz-linear-gradient(black, black 50%, white 50%, white); + background-size: 100px 100px; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-repeat-1b.html b/layout/reftests/css-gradients/linear-repeat-1b.html new file mode 100644 index 000000000..1a8f06982 --- /dev/null +++ b/layout/reftests/css-gradients/linear-repeat-1b.html @@ -0,0 +1,2 @@ +<div style="background: -moz-linear-gradient(black, black 50px, white 50px, white 100px, black 100px, black 150px, white 150px, white 200px); + background-size: 100px 200px; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-repeat-1c.html b/layout/reftests/css-gradients/linear-repeat-1c.html new file mode 100644 index 000000000..f3c2b841b --- /dev/null +++ b/layout/reftests/css-gradients/linear-repeat-1c.html @@ -0,0 +1,4 @@ +<div style="background: -moz-linear-gradient(white, white 50%, black 50%, black); + background-size: 100px 100px; + background-position: 0 -50px; + width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-repeat-1d.html b/layout/reftests/css-gradients/linear-repeat-1d.html new file mode 100644 index 000000000..5a609f1b0 --- /dev/null +++ b/layout/reftests/css-gradients/linear-repeat-1d.html @@ -0,0 +1,3 @@ +<div style="background: -moz-linear-gradient(white, white 50px, black 50px, black 100px, white 100px, white 150px, black 150px, black 200px); + background-size: 100px 200px; background-position: 0 -50px; + width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-repeat-1e.html b/layout/reftests/css-gradients/linear-repeat-1e.html new file mode 100644 index 000000000..4f7011427 --- /dev/null +++ b/layout/reftests/css-gradients/linear-repeat-1e.html @@ -0,0 +1,3 @@ +<div style="background: -moz-linear-gradient(black, black 50%, white 50%, white); + background-size: 300px 100px; background-repeat: repeat-y; + width: 500px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-repeat-1f.html b/layout/reftests/css-gradients/linear-repeat-1f.html new file mode 100644 index 000000000..253170e34 --- /dev/null +++ b/layout/reftests/css-gradients/linear-repeat-1f.html @@ -0,0 +1,10 @@ +<div style="background: -moz-linear-gradient(black, black 50px, white 50px, white 100px, black 100px, black 150px, white 150px, white 200px); + background-size: 100px 200px; background-repeat: repeat-x; + width: 300px; height: 800px; + margin-bottom: -600px;"></div> +<!-- making the gradient actually be 300px high isn't reliable since + the stop positions cannot be exactly represented and rounding errors + creep in. So just let the gradient be 200px high and pad out to match + the reference. --> +<div style="background: black; width: 300px; height: 50px;"></div> +<div style="background: white; width: 300px; height: 50px;"></div> diff --git a/layout/reftests/css-gradients/linear-repeat-1g.html b/layout/reftests/css-gradients/linear-repeat-1g.html new file mode 100644 index 000000000..1a09af726 --- /dev/null +++ b/layout/reftests/css-gradients/linear-repeat-1g.html @@ -0,0 +1,12 @@ +<body style="overflow:hidden"> +<div style="background: -moz-linear-gradient(black, black 50px, white 50px, white 100px, black 100px, black 150px, white 150px, white 200px); + background-size: 300px 200px; background-repeat: no-repeat; + width: 800px; height: 800px; + margin-bottom: -600px;"></div> +<!-- making the gradient actually be 300px high isn't reliable since + the stop positions cannot be exactly represented and rounding errors + creep in. So just let the gradient be 200px high and pad out to match + the reference. --> +<div style="background: black; width: 300px; height: 50px;"></div> +<div style="background: white; width: 300px; height: 50px;"></div> +</body> diff --git a/layout/reftests/css-gradients/linear-rotated-1-ref.html b/layout/reftests/css-gradients/linear-rotated-1-ref.html new file mode 100644 index 000000000..d22ca1bb7 --- /dev/null +++ b/layout/reftests/css-gradients/linear-rotated-1-ref.html @@ -0,0 +1,7 @@ +<!DOCTYPE HTML>
+<html>
+<body>
+<div style="width:100px; height:100px; background:linear-gradient(to left, red, green);"></div>
+<div style="width:100px; height:100px; background:linear-gradient(to right, red, green);"></div>
+</body>
+</html>
diff --git a/layout/reftests/css-gradients/linear-rotated-1.html b/layout/reftests/css-gradients/linear-rotated-1.html new file mode 100644 index 000000000..b927d1db2 --- /dev/null +++ b/layout/reftests/css-gradients/linear-rotated-1.html @@ -0,0 +1,7 @@ +<!DOCTYPE HTML>
+<html>
+<body>
+<div style="width:100px; height:100px; transform:rotate(90deg); background:linear-gradient(red, green);"></div>
+<div style="width:100px; height:100px; transform:rotate(270deg); background:linear-gradient(red, green);"></div>
+</body>
+</html>
diff --git a/layout/reftests/css-gradients/linear-size-1-ref.html b/layout/reftests/css-gradients/linear-size-1-ref.html new file mode 100644 index 000000000..32bfbde31 --- /dev/null +++ b/layout/reftests/css-gradients/linear-size-1-ref.html @@ -0,0 +1,3 @@ +<div style="background: -moz-linear-gradient(white, black) no-repeat; width: 300px; height: 100px;"></div> +<div style="background: -moz-linear-gradient(white, black) no-repeat; width: 300px; height: 100px;"></div> +<div style="background: -moz-linear-gradient(white, black) no-repeat; width: 300px; height: 100px;"></div> diff --git a/layout/reftests/css-gradients/linear-size-1a.html b/layout/reftests/css-gradients/linear-size-1a.html new file mode 100644 index 000000000..b087b6a5a --- /dev/null +++ b/layout/reftests/css-gradients/linear-size-1a.html @@ -0,0 +1,2 @@ +<div style="background: -moz-linear-gradient(white, black); + background-size: 300px 100px; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-stops-1-ref.html b/layout/reftests/css-gradients/linear-stops-1-ref.html new file mode 100644 index 000000000..0582630f2 --- /dev/null +++ b/layout/reftests/css-gradients/linear-stops-1-ref.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(white 0%, red 20%, green 40%, blue 60%, yellow 80%, black 100%) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-stops-1a.html b/layout/reftests/css-gradients/linear-stops-1a.html new file mode 100644 index 000000000..21f1f3d9c --- /dev/null +++ b/layout/reftests/css-gradients/linear-stops-1a.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(white, red, green, blue, yellow, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-stops-1b.html b/layout/reftests/css-gradients/linear-stops-1b.html new file mode 100644 index 000000000..30c703f70 --- /dev/null +++ b/layout/reftests/css-gradients/linear-stops-1b.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(white 0, red 60px, green 120px, blue 180px, yellow 240px, black 300px) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-stops-1c.html b/layout/reftests/css-gradients/linear-stops-1c.html new file mode 100644 index 000000000..4a753ee39 --- /dev/null +++ b/layout/reftests/css-gradients/linear-stops-1c.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(white, red 20%, green, blue 60%, yellow, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-stops-1d.html b/layout/reftests/css-gradients/linear-stops-1d.html new file mode 100644 index 000000000..1b79fc523 --- /dev/null +++ b/layout/reftests/css-gradients/linear-stops-1d.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(white, red, green 40%, red 40%, green 40%, blue, yellow, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-stops-1e.html b/layout/reftests/css-gradients/linear-stops-1e.html new file mode 100644 index 000000000..7215994e6 --- /dev/null +++ b/layout/reftests/css-gradients/linear-stops-1e.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(white, red, green 40%, red 20%, green 40%, blue, yellow, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-stops-1f.html b/layout/reftests/css-gradients/linear-stops-1f.html new file mode 100644 index 000000000..bd715527e --- /dev/null +++ b/layout/reftests/css-gradients/linear-stops-1f.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(white, red, green 40%, red 40%, green 20%, blue, yellow, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-vertical-1-ref.html b/layout/reftests/css-gradients/linear-vertical-1-ref.html new file mode 100644 index 000000000..4de794ac6 --- /dev/null +++ b/layout/reftests/css-gradients/linear-vertical-1-ref.html @@ -0,0 +1,16 @@ +<!DOCTYPE HTML> +<html> +<body> +<canvas id="canvas" width="300" height="300"/> +<script> +var ctx = document.getElementById('canvas').getContext('2d'); + +var grad = ctx.createLinearGradient(150,0,150,300); +grad.addColorStop(0, 'white'); +grad.addColorStop(1, 'black'); + +ctx.fillStyle = grad; +ctx.fillRect(0,0,300,300); +</script> +</body> +</html> diff --git a/layout/reftests/css-gradients/linear-vertical-1a.html b/layout/reftests/css-gradients/linear-vertical-1a.html new file mode 100644 index 000000000..79444130e --- /dev/null +++ b/layout/reftests/css-gradients/linear-vertical-1a.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(white, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-vertical-1b.html b/layout/reftests/css-gradients/linear-vertical-1b.html new file mode 100644 index 000000000..aaca30135 --- /dev/null +++ b/layout/reftests/css-gradients/linear-vertical-1b.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(top left -90deg, white, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-vertical-1c.html b/layout/reftests/css-gradients/linear-vertical-1c.html new file mode 100644 index 000000000..6ce627079 --- /dev/null +++ b/layout/reftests/css-gradients/linear-vertical-1c.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(white 0%, white 0%, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-vertical-1d.html b/layout/reftests/css-gradients/linear-vertical-1d.html new file mode 100644 index 000000000..0e8342357 --- /dev/null +++ b/layout/reftests/css-gradients/linear-vertical-1d.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(white 0%, white -20%, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-vertical-1e.html b/layout/reftests/css-gradients/linear-vertical-1e.html new file mode 100644 index 000000000..4b9ffc505 --- /dev/null +++ b/layout/reftests/css-gradients/linear-vertical-1e.html @@ -0,0 +1 @@ +<div style="background: linear-gradient(to bottom, white, black) no-repeat; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-vertical-subpixel-1-ref.html b/layout/reftests/css-gradients/linear-vertical-subpixel-1-ref.html new file mode 100644 index 000000000..6d6c3517f --- /dev/null +++ b/layout/reftests/css-gradients/linear-vertical-subpixel-1-ref.html @@ -0,0 +1,15 @@ +<!DOCTYPE html>
+<html>
+<head>
+<style>
+div {
+ margin-top: 21px;
+ height: 30px;
+ background-image: -moz-linear-gradient(center top, black, white);
+}
+</style>
+</head>
+<body>
+<div></div>
+</body>
+</html>
diff --git a/layout/reftests/css-gradients/linear-vertical-subpixel-1.html b/layout/reftests/css-gradients/linear-vertical-subpixel-1.html new file mode 100644 index 000000000..4c3e8f479 --- /dev/null +++ b/layout/reftests/css-gradients/linear-vertical-subpixel-1.html @@ -0,0 +1,15 @@ +<!DOCTYPE html>
+<html>
+<head>
+<style>
+div {
+ margin-top: 20.7px;
+ height: 30px;
+ background-image: -moz-linear-gradient(center top, black, white);
+}
+</style>
+</head>
+<body>
+<div></div>
+</body>
+</html>
diff --git a/layout/reftests/css-gradients/linear-viewport-ref.html b/layout/reftests/css-gradients/linear-viewport-ref.html new file mode 100644 index 000000000..dc0259ce0 --- /dev/null +++ b/layout/reftests/css-gradients/linear-viewport-ref.html @@ -0,0 +1 @@ +<body style="border: 0; margin: 0; padding: 0;"><div style="background: -moz-linear-gradient(blue, aqua) no-repeat; width: 100%; height: 100%;"> </div></body> diff --git a/layout/reftests/css-gradients/linear-viewport.html b/layout/reftests/css-gradients/linear-viewport.html new file mode 100644 index 000000000..8925e781b --- /dev/null +++ b/layout/reftests/css-gradients/linear-viewport.html @@ -0,0 +1,2 @@ +<!-- bug 509681 --> +<body style="background: -moz-linear-gradient(blue, aqua) fixed no-repeat;"> diff --git a/layout/reftests/css-gradients/linear-zero-length-1-ref.html b/layout/reftests/css-gradients/linear-zero-length-1-ref.html new file mode 100644 index 000000000..0379d1924 --- /dev/null +++ b/layout/reftests/css-gradients/linear-zero-length-1-ref.html @@ -0,0 +1,2 @@ +<div style="background: black; width: 300px; height: 300px;"></div> +<div style="background: black; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-zero-length-1a.html b/layout/reftests/css-gradients/linear-zero-length-1a.html new file mode 100644 index 000000000..2b8341915 --- /dev/null +++ b/layout/reftests/css-gradients/linear-zero-length-1a.html @@ -0,0 +1,2 @@ +<div style="background: -moz-linear-gradient(150px 150px, white, black); width: 300px; height: 300px;"></div> +<div style="background: -moz-repeating-linear-gradient(150px 150px, white, black); width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-zero-length-1b.html b/layout/reftests/css-gradients/linear-zero-length-1b.html new file mode 100644 index 000000000..1869e5cf8 --- /dev/null +++ b/layout/reftests/css-gradients/linear-zero-length-1b.html @@ -0,0 +1,2 @@ +<div style="background: -moz-linear-gradient(150px 150px, white, white 100px, black); width: 300px; height: 300px;"></div> +<div style="background: -moz-repeating-linear-gradient(150px 150px, white, white 100px, black); width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/linear-zero-length-1c.html b/layout/reftests/css-gradients/linear-zero-length-1c.html new file mode 100644 index 000000000..67298ce38 --- /dev/null +++ b/layout/reftests/css-gradients/linear-zero-length-1c.html @@ -0,0 +1,2 @@ +<div style="background: -moz-linear-gradient(center, white, black 50%); width: 300px; height: 300px;"></div> +<div style="background: -moz-repeating-linear-gradient(center, white, black 50%); width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/nostops.html b/layout/reftests/css-gradients/nostops.html new file mode 100644 index 000000000..9c4035365 --- /dev/null +++ b/layout/reftests/css-gradients/nostops.html @@ -0,0 +1 @@ +<div style="background: linear-gradient(to right bottom) no-repeat; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/onestop.html b/layout/reftests/css-gradients/onestop.html new file mode 100644 index 000000000..afa1ad6fb --- /dev/null +++ b/layout/reftests/css-gradients/onestop.html @@ -0,0 +1 @@ +<div style="background: linear-gradient(to right bottom, #0000ff 50%) no-repeat; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/orange-square.html b/layout/reftests/css-gradients/orange-square.html new file mode 100644 index 000000000..aa70b29fa --- /dev/null +++ b/layout/reftests/css-gradients/orange-square.html @@ -0,0 +1,12 @@ +<!DOCTYPE HTML> +<title>orange square</title> +<style> + +div { + width: 200px; + height: 200px; + background: orange; +} + +</style> +<div></div> diff --git a/layout/reftests/css-gradients/radial-1-ref.html b/layout/reftests/css-gradients/radial-1-ref.html new file mode 100644 index 000000000..b836c6c06 --- /dev/null +++ b/layout/reftests/css-gradients/radial-1-ref.html @@ -0,0 +1,22 @@ +<html xmlns="http://www.w3.org/1999/xhtml" + class="reftest-wait"> +<head> +<script> +function doDraw() { + var ctx = document.getElementById('canvas').getContext('2d'); + + var radgrad = ctx.createRadialGradient(100,100,25,100,100,50); + radgrad.addColorStop(0, '#FF0000'); + radgrad.addColorStop(1, '#0000FF'); + + ctx.fillStyle = radgrad; + ctx.fillRect(0,0,300,300); + + document.documentElement.removeAttribute('class'); +} +</script> +</head> +<body onload="doDraw();"> +<canvas id="canvas" width="300" height="300"/> +</body> +</html> diff --git a/layout/reftests/css-gradients/radial-1a.html b/layout/reftests/css-gradients/radial-1a.html new file mode 100644 index 000000000..e42e1d1ca --- /dev/null +++ b/layout/reftests/css-gradients/radial-1a.html @@ -0,0 +1 @@ +<div style="background: radial-gradient(100px 100px at 100px 100px, #ff0000 25px, #0000ff 50px) no-repeat; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/radial-1b.html b/layout/reftests/css-gradients/radial-1b.html new file mode 100644 index 000000000..450dbc959 --- /dev/null +++ b/layout/reftests/css-gradients/radial-1b.html @@ -0,0 +1 @@ +<div style="background: radial-gradient(closest-side at 100px 100px, #ff0000 25px, #0000ff 50px) no-repeat; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/radial-1c.html b/layout/reftests/css-gradients/radial-1c.html new file mode 100644 index 000000000..55dd5ffc5 --- /dev/null +++ b/layout/reftests/css-gradients/radial-1c.html @@ -0,0 +1 @@ +<div style="background: -moz-radial-gradient(100px 100px, closest-side, #ff0000 25px, #0000ff 50px) no-repeat; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/radial-2-ref.html b/layout/reftests/css-gradients/radial-2-ref.html new file mode 100644 index 000000000..71ccb53ee --- /dev/null +++ b/layout/reftests/css-gradients/radial-2-ref.html @@ -0,0 +1,22 @@ +<html xmlns="http://www.w3.org/1999/xhtml" + class="reftest-wait"> +<head> +<script> +function doDraw() { + var ctx = document.getElementById('canvas').getContext('2d'); + + var radgrad = ctx.createRadialGradient(100,100,0,100,100,50); + radgrad.addColorStop(0, '#FF0000'); + radgrad.addColorStop(1, '#0000FF'); + + ctx.fillStyle = radgrad; + ctx.fillRect(0,0,300,300); + + document.documentElement.removeAttribute('class'); +} +</script> +</head> +<body onload="doDraw();"> +<canvas id="canvas" width="300" height="300"/> +</body> +</html> diff --git a/layout/reftests/css-gradients/radial-2a.html b/layout/reftests/css-gradients/radial-2a.html new file mode 100644 index 000000000..b316e1c50 --- /dev/null +++ b/layout/reftests/css-gradients/radial-2a.html @@ -0,0 +1 @@ +<div style="background: radial-gradient(closest-side at 100px 100px, yellow -10px, #ff0000 0, #0000ff 50px); width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/radial-2b.html b/layout/reftests/css-gradients/radial-2b.html new file mode 100644 index 000000000..675cb6ecd --- /dev/null +++ b/layout/reftests/css-gradients/radial-2b.html @@ -0,0 +1,3 @@ +<!-- This test checks that adjustment of stop positions to be non-negative + happens after the calculation of implied stop positions --> +<div style="background: radial-gradient(closest-side at 100px 100px, #ff0000 -50px, #ff0000, #0000ff 50px); width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/radial-2c.html b/layout/reftests/css-gradients/radial-2c.html new file mode 100644 index 000000000..38bdcfd85 --- /dev/null +++ b/layout/reftests/css-gradients/radial-2c.html @@ -0,0 +1 @@ +<div style="background: radial-gradient(100px 100px at 100px 100px, yellow -10px, #ff0000 0, #0000ff 50px); width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/radial-2d.html b/layout/reftests/css-gradients/radial-2d.html new file mode 100644 index 000000000..152ee771b --- /dev/null +++ b/layout/reftests/css-gradients/radial-2d.html @@ -0,0 +1,3 @@ +<!-- This test checks that adjustment of stop positions to be non-negative + happens after the calculation of implied stop positions --> +<div style="background: radial-gradient(100px 100px at 100px 100px, #ff0000 -50px, #ff0000, #0000ff 50px); width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/radial-2e.html b/layout/reftests/css-gradients/radial-2e.html new file mode 100644 index 000000000..ee4052aa0 --- /dev/null +++ b/layout/reftests/css-gradients/radial-2e.html @@ -0,0 +1 @@ +<div style="background: -moz-radial-gradient(100px 100px, closest-side, yellow -10px, #ff0000 0, #0000ff 50px); width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/radial-2f.html b/layout/reftests/css-gradients/radial-2f.html new file mode 100644 index 000000000..e1b08b408 --- /dev/null +++ b/layout/reftests/css-gradients/radial-2f.html @@ -0,0 +1,3 @@ +<!-- This test checks that adjustment of stop positions to be non-negative + happens after the calculation of implied stop positions --> +<div style="background: -moz-radial-gradient(100px 100px, closest-side, #ff0000 -50px, #ff0000, #0000ff 50px); width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/radial-onestopposition-1-ref.html b/layout/reftests/css-gradients/radial-onestopposition-1-ref.html new file mode 100644 index 000000000..439e50cbd --- /dev/null +++ b/layout/reftests/css-gradients/radial-onestopposition-1-ref.html @@ -0,0 +1,12 @@ +<!DOCTYPE HTML> +<title>Test for radial-gradient() with all stops at the same position</title> +<style> + +div { + width: 200px; + height: 200px; + background-image: radial-gradient(closest-side, blue 0%, blue 25%, orange 25%, orange 100%); +} + +</style> +<div></div> diff --git a/layout/reftests/css-gradients/radial-onestopposition-1a.html b/layout/reftests/css-gradients/radial-onestopposition-1a.html new file mode 100644 index 000000000..60ad3e6a3 --- /dev/null +++ b/layout/reftests/css-gradients/radial-onestopposition-1a.html @@ -0,0 +1,12 @@ +<!DOCTYPE HTML> +<title>Test for radial-gradient() with all stops at the same position</title> +<style> + +div { + width: 200px; + height: 200px; + background-image: radial-gradient(closest-side, blue 25%, orange 25%); +} + +</style> +<div></div> diff --git a/layout/reftests/css-gradients/radial-onestopposition-1b.html b/layout/reftests/css-gradients/radial-onestopposition-1b.html new file mode 100644 index 000000000..22a00ff89 --- /dev/null +++ b/layout/reftests/css-gradients/radial-onestopposition-1b.html @@ -0,0 +1,12 @@ +<!DOCTYPE HTML> +<title>Test for radial-gradient() with all stops at the same position</title> +<style> + +div { + width: 200px; + height: 200px; + background-image: radial-gradient(100px 100px at 100px, blue 25%, orange 25%); +} + +</style> +<div></div> diff --git a/layout/reftests/css-gradients/radial-onestopposition-1c.html b/layout/reftests/css-gradients/radial-onestopposition-1c.html new file mode 100644 index 000000000..4a83ec8a0 --- /dev/null +++ b/layout/reftests/css-gradients/radial-onestopposition-1c.html @@ -0,0 +1,12 @@ +<!DOCTYPE HTML> +<title>Test for radial-gradient() with all stops at the same position</title> +<style> + +div { + width: 200px; + height: 200px; + background-image: -moz-radial-gradient(contain, blue 25%, orange 25%); +} + +</style> +<div></div> diff --git a/layout/reftests/css-gradients/radial-position-1-ref.html b/layout/reftests/css-gradients/radial-position-1-ref.html new file mode 100644 index 000000000..c94455ebe --- /dev/null +++ b/layout/reftests/css-gradients/radial-position-1-ref.html @@ -0,0 +1,2 @@ +<body style="margin:0;"> +<div style="background: radial-gradient(white, black) no-repeat; position:relative; left:-200px; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/radial-position-1a.html b/layout/reftests/css-gradients/radial-position-1a.html new file mode 100644 index 000000000..ecd4b369f --- /dev/null +++ b/layout/reftests/css-gradients/radial-position-1a.html @@ -0,0 +1,2 @@ +<body style="margin:0;"> +<div style="background: radial-gradient(white, black) no-repeat; background-position:-200px 0; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/radial-position-1b.html b/layout/reftests/css-gradients/radial-position-1b.html new file mode 100644 index 000000000..02d3ed071 --- /dev/null +++ b/layout/reftests/css-gradients/radial-position-1b.html @@ -0,0 +1,2 @@ +<body style="margin:0;"> +<div style="background: radial-gradient(212.132034px 212.132034px at center, white, black) no-repeat; background-position:-200px 0; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/radial-premul-ref.html b/layout/reftests/css-gradients/radial-premul-ref.html new file mode 100644 index 000000000..1424f4373 --- /dev/null +++ b/layout/reftests/css-gradients/radial-premul-ref.html @@ -0,0 +1 @@ +<div style="background: radial-gradient(rgba(255, 0, 0, .9) 0% , rgba(255, 0, 0, 0) 50%, rgba(0, 0, 255, 0) 50%, rgba(0, 0, 255, 1) 100%) no-repeat; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/radial-premul.html b/layout/reftests/css-gradients/radial-premul.html new file mode 100644 index 000000000..33b89c72b --- /dev/null +++ b/layout/reftests/css-gradients/radial-premul.html @@ -0,0 +1 @@ +<div style="background: radial-gradient(rgba(255, 0, 0, .9) 0% , rgba(0, 255, 0, 0) 50%, rgba(0, 0, 255, 1) 100%) no-repeat; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/radial-shape-closest-corner-1-ref.html b/layout/reftests/css-gradients/radial-shape-closest-corner-1-ref.html new file mode 100644 index 000000000..a872319b3 --- /dev/null +++ b/layout/reftests/css-gradients/radial-shape-closest-corner-1-ref.html @@ -0,0 +1,9 @@ +<style>div { position:absolute; width:200px; height:200px; }</style> +<div style="background: radial-gradient(closest-side circle at 60px 80px, white, black 100px); top:10px; left:10px;"></div> +<div style="background: radial-gradient(closest-side circle at 140px 80px, white, black 100px); top:10px; left:220px;"></div> +<div style="background: radial-gradient(closest-side circle at 80px 60px, white, black 100px); top:220px; left:10px;"></div> +<div style="background: radial-gradient(closest-side circle at 80px 140px, white, black 100px); top:220px; left:220px;"></div> +<div style="background: -moz-radial-gradient(60px 80px 90deg, closest-corner, white, black 80px); top:430px; left:10px;"></div> +<div style="background: -moz-radial-gradient(140px 80px 90deg, closest-corner, white, black 80px); top:430px; left:220px;"></div> +<div style="background: -moz-radial-gradient(80px 60px 90deg, ellipse closest-corner, white, black 60px); top:640px; left:10px;"></div> +<div style="background: -moz-radial-gradient(80px 140px 90deg, ellipse closest-corner, white, black 60px); top:640px; left:220px;"></div> diff --git a/layout/reftests/css-gradients/radial-shape-closest-corner-1a.html b/layout/reftests/css-gradients/radial-shape-closest-corner-1a.html new file mode 100644 index 000000000..508b00267 --- /dev/null +++ b/layout/reftests/css-gradients/radial-shape-closest-corner-1a.html @@ -0,0 +1,9 @@ +<style>div { position:absolute; width:200px; height:200px; }</style> +<div style="background: radial-gradient(circle closest-corner at 60px 80px, white, black); top:10px; left:10px;"></div> +<div style="background: radial-gradient(closest-corner circle at 140px 80px, white, black); top:10px; left:220px;"></div> +<div style="background: radial-gradient(circle closest-corner at 80px 60px, white, black); top:220px; left:10px;"></div> +<div style="background: radial-gradient(closest-corner circle at 80px 140px, white, black); top:220px; left:220px;"></div> +<div style="background: radial-gradient(ellipse closest-corner at 60px 80px, white, black 60px); top:430px; left:10px;"></div> +<div style="background: radial-gradient(closest-corner ellipse at 140px 80px, white, black 60px); top:430px; left:220px;"></div> +<div style="background: radial-gradient(closest-corner at 80px 60px, white, black 80px); top:640px; left:10px;"></div> +<div style="background: radial-gradient(closest-corner at 80px 140px, white, black 80px); top:640px; left:220px;"></div> diff --git a/layout/reftests/css-gradients/radial-shape-closest-corner-1b.html b/layout/reftests/css-gradients/radial-shape-closest-corner-1b.html new file mode 100644 index 000000000..e5d3dc5ee --- /dev/null +++ b/layout/reftests/css-gradients/radial-shape-closest-corner-1b.html @@ -0,0 +1,9 @@ +<style>div { position:absolute; width:200px; height:200px; }</style> +<div style="background: radial-gradient(100px 100px at 60px 80px, white, black); top:10px; left:10px;"></div> +<div style="background: radial-gradient(100px at 140px 80px, white, black); top:10px; left:220px;"></div> +<div style="background: radial-gradient(100px 100px at 80px 60px, white, black); top:220px; left:10px;"></div> +<div style="background: radial-gradient(100px at 80px 140px, white, black); top:220px; left:220px;"></div> +<div style="background: radial-gradient(84.8528137px 113.137084px at 60px 80px, white, black 60px); top:430px; left:10px;"></div> +<div style="background: radial-gradient(84.8528137px 113.137084px at 140px 80px, white, black 60px); top:430px; left:220px;"></div> +<div style="background: radial-gradient(113.137084px 84.8528137px at 80px 60px, white, black 80px); top:640px; left:10px;"></div> +<div style="background: radial-gradient(113.137084px 84.8528137px at 80px 140px, white, black 80px); top:640px; left:220px;"></div> diff --git a/layout/reftests/css-gradients/radial-shape-closest-corner-1c.html b/layout/reftests/css-gradients/radial-shape-closest-corner-1c.html new file mode 100644 index 000000000..2adde5746 --- /dev/null +++ b/layout/reftests/css-gradients/radial-shape-closest-corner-1c.html @@ -0,0 +1,9 @@ +<style>div { position:absolute; width:200px; height:200px; }</style> +<div style="background: -moz-radial-gradient(60px 80px, circle closest-corner, white, black); top:10px; left:10px;"></div> +<div style="background: -moz-radial-gradient(140px 80px, circle closest-corner, white, black); top:10px; left:220px;"></div> +<div style="background: -moz-radial-gradient(80px 60px, circle closest-corner, white, black); top:220px; left:10px;"></div> +<div style="background: -moz-radial-gradient(80px 140px, circle closest-corner, white, black); top:220px; left:220px;"></div> +<div style="background: -moz-radial-gradient(60px 80px, ellipse closest-corner, white, black 60px); top:430px; left:10px;"></div> +<div style="background: -moz-radial-gradient(140px 80px, ellipse closest-corner, white, black 60px); top:430px; left:220px;"></div> +<div style="background: -moz-radial-gradient(80px 60px, closest-corner, white, black 80px); top:640px; left:10px;"></div> +<div style="background: -moz-radial-gradient(80px 140px, closest-corner, white, black 80px); top:640px; left:220px;"></div> diff --git a/layout/reftests/css-gradients/radial-shape-closest-side-1-ref.html b/layout/reftests/css-gradients/radial-shape-closest-side-1-ref.html new file mode 100644 index 000000000..9ef6f9d32 --- /dev/null +++ b/layout/reftests/css-gradients/radial-shape-closest-side-1-ref.html @@ -0,0 +1,9 @@ +<style>div { position:absolute; width:200px; height:200px; }</style> +<div style="background: -moz-radial-gradient(50px 80px, circle closest-side, white, black 50px); top:10px; left:10px;"></div> +<div style="background: -moz-radial-gradient(150px 80px, circle closest-side, white, black 50px); top:10px; left:220px;"></div> +<div style="background: -moz-radial-gradient(80px 50px, circle closest-side, white, black 50px); top:220px; left:10px;"></div> +<div style="background: -moz-radial-gradient(80px 150px, circle closest-side, white, black 50px); top:220px; left:220px;"></div> +<div style="background: -moz-radial-gradient(20px 20px, circle closest-side, white, black 20px); height:100px; -moz-transform-origin:0 0; -moz-transform:scale(1.0, 2.0); top:430px; left:10px;"></div> +<div style="background: -moz-radial-gradient(180px 20px, circle closest-side, white, black 20px); height:100px; -moz-transform-origin:0 0; -moz-transform:scale(1.0, 2.0); top:430px; left:220px;"></div> +<div style="background: -moz-radial-gradient(20px 20px, circle closest-side, white, black 20px); width:100px; -moz-transform-origin:0 0; -moz-transform:scale(2.0, 1.0); top:640px; left:10px;"></div> +<div style="background: -moz-radial-gradient(20px 180px, circle closest-side, white, black 20px); width:100px; -moz-transform-origin:0 0; -moz-transform:scale(2.0, 1.0); top:640px; left:220px;"></div> diff --git a/layout/reftests/css-gradients/radial-shape-closest-side-1a.html b/layout/reftests/css-gradients/radial-shape-closest-side-1a.html new file mode 100644 index 000000000..a689ab036 --- /dev/null +++ b/layout/reftests/css-gradients/radial-shape-closest-side-1a.html @@ -0,0 +1,9 @@ +<style>div { position:absolute; width:200px; height:200px; }</style> +<div style="background: radial-gradient(circle closest-side at 50px 80px, white, black); top:10px; left:10px;"></div> +<div style="background: radial-gradient(closest-side circle at 150px 80px, white, black); top:10px; left:220px;"></div> +<div style="background: radial-gradient(circle closest-side at 80px 50px, white, black); top:220px; left:10px;"></div> +<div style="background: radial-gradient(closest-side circle at 80px 150px, white, black); top:220px; left:220px;"></div> +<div style="background: radial-gradient(ellipse closest-side at 20px 40px, white, black); top:430px; left:10px;"></div> +<div style="background: radial-gradient(closest-side ellipse at 180px 40px, white, black); top:430px; left:220px;"></div> +<div style="background: radial-gradient(closest-side at 40px 20px, white, black); top:640px; left:10px;"></div> +<div style="background: radial-gradient(closest-side at 40px 180px, white, black); top:640px; left:220px;"></div> diff --git a/layout/reftests/css-gradients/radial-shape-closest-side-1b.html b/layout/reftests/css-gradients/radial-shape-closest-side-1b.html new file mode 100644 index 000000000..8290b6ad1 --- /dev/null +++ b/layout/reftests/css-gradients/radial-shape-closest-side-1b.html @@ -0,0 +1,9 @@ +<style>div { position:absolute; width:200px; height:200px; }</style> +<div style="background: radial-gradient(50px 50px at 50px 80px, white, black); top:10px; left:10px;"></div> +<div style="background: radial-gradient(50px at 150px 80px, white, black); top:10px; left:220px;"></div> +<div style="background: radial-gradient(50px 50px at 80px 50px, white, black); top:220px; left:10px;"></div> +<div style="background: radial-gradient(50px at 80px 150px, white, black); top:220px; left:220px;"></div> +<div style="background: radial-gradient(20px 40px at 20px 40px, white, black); top:430px; left:10px;"></div> +<div style="background: radial-gradient(20px 40px at 180px 40px, white, black); top:430px; left:220px;"></div> +<div style="background: radial-gradient(40px 20px at 40px 20px, white, black); top:640px; left:10px;"></div> +<div style="background: radial-gradient(40px 20px at 40px 180px, white, black); top:640px; left:220px;"></div> diff --git a/layout/reftests/css-gradients/radial-shape-closest-side-1c.html b/layout/reftests/css-gradients/radial-shape-closest-side-1c.html new file mode 100644 index 000000000..3c12ccf75 --- /dev/null +++ b/layout/reftests/css-gradients/radial-shape-closest-side-1c.html @@ -0,0 +1,9 @@ +<style>div { position:absolute; width:200px; height:200px; }</style> +<div style="background: -moz-radial-gradient(50px 80px, circle closest-side, white, black); top:10px; left:10px;"></div> +<div style="background: -moz-radial-gradient(150px 80px, circle closest-side, white, black); top:10px; left:220px;"></div> +<div style="background: -moz-radial-gradient(80px 50px, circle closest-side, white, black); top:220px; left:10px;"></div> +<div style="background: -moz-radial-gradient(80px 150px, circle closest-side, white, black); top:220px; left:220px;"></div> +<div style="background: -moz-radial-gradient(20px 40px, ellipse closest-side, white, black); top:430px; left:10px;"></div> +<div style="background: -moz-radial-gradient(180px 40px, ellipse closest-side, white, black); top:430px; left:220px;"></div> +<div style="background: -moz-radial-gradient(40px 20px, closest-side, white, black); top:640px; left:10px;"></div> +<div style="background: -moz-radial-gradient(40px 180px, closest-side, white, black); top:640px; left:220px;"></div> diff --git a/layout/reftests/css-gradients/radial-shape-farthest-corner-1-ref.html b/layout/reftests/css-gradients/radial-shape-farthest-corner-1-ref.html new file mode 100644 index 000000000..2d2b4c925 --- /dev/null +++ b/layout/reftests/css-gradients/radial-shape-farthest-corner-1-ref.html @@ -0,0 +1,9 @@ +<style>div { position:absolute; width:200px; height:200px; }</style> +<div style="background: radial-gradient(circle farthest-side at 40px 80px, white, black 200px); top:10px; left:10px;"></div> +<div style="background: radial-gradient(farthest-side circle at 160px 80px, white, black 200px); top:10px; left:220px;"></div> +<div style="background: radial-gradient(circle farthest-side at 80px 40px, white, black 200px); top:220px; left:10px;"></div> +<div style="background: radial-gradient(farthest-side circle at 80px 160px, white, black 200px); top:220px; left:220px;"></div> +<div style="background: -moz-radial-gradient(60px 80px 90deg, farthest-corner, white, black 120px); top:430px; left:10px;"></div> +<div style="background: -moz-radial-gradient(140px 80px 90deg, farthest-corner, white, black 120px); top:430px; left:220px;"></div> +<div style="background: -moz-radial-gradient(80px 60px 90deg, ellipse farthest-corner, white, black 140px); top:640px; left:10px;"></div> +<div style="background: -moz-radial-gradient(80px 140px 90deg, ellipse farthest-corner, white, black 140px); top:640px; left:220px;"></div> diff --git a/layout/reftests/css-gradients/radial-shape-farthest-corner-1a.html b/layout/reftests/css-gradients/radial-shape-farthest-corner-1a.html new file mode 100644 index 000000000..6ee7b27c8 --- /dev/null +++ b/layout/reftests/css-gradients/radial-shape-farthest-corner-1a.html @@ -0,0 +1,9 @@ +<style>div { position:absolute; width:200px; height:200px; }</style> +<div style="background: radial-gradient(circle farthest-corner at 40px 80px, white, black); top:10px; left:10px;"></div> +<div style="background: radial-gradient(farthest-corner circle at 160px 80px, white, black); top:10px; left:220px;"></div> +<div style="background: radial-gradient(circle farthest-corner at 80px 40px, white, black); top:220px; left:10px;"></div> +<div style="background: radial-gradient(farthest-corner circle at 80px 160px, white, black); top:220px; left:220px;"></div> +<div style="background: radial-gradient(ellipse farthest-corner at 60px 80px, white, black 140px); top:430px; left:10px;"></div> +<div style="background: radial-gradient(farthest-corner ellipse at 140px 80px, white, black 140px); top:430px; left:220px;"></div> +<div style="background: radial-gradient(farthest-corner at 80px 60px, white, black 120px); top:640px; left:10px;"></div> +<div style="background: radial-gradient(farthest-corner at 80px 140px, white, black 120px); top:640px; left:220px;"></div> diff --git a/layout/reftests/css-gradients/radial-shape-farthest-corner-1b.html b/layout/reftests/css-gradients/radial-shape-farthest-corner-1b.html new file mode 100644 index 000000000..b095575f0 --- /dev/null +++ b/layout/reftests/css-gradients/radial-shape-farthest-corner-1b.html @@ -0,0 +1,9 @@ +<style>div { position:absolute; width:200px; height:200px; }</style> +<div style="background: radial-gradient(200px 200px at 40px 80px, white, black); top:10px; left:10px;"></div> +<div style="background: radial-gradient(200px at 160px 80px, white, black); top:10px; left:220px;"></div> +<div style="background: radial-gradient(200px 200px at 80px 40px, white, black); top:220px; left:10px;"></div> +<div style="background: radial-gradient(200px at 80px 160px, white, black); top:220px; left:220px;"></div> +<div style="background: radial-gradient(197.989898px 169.705627px at 60px 80px, white, black 140px); top:430px; left:10px;"></div> +<div style="background: radial-gradient(197.989898px 169.705627px at 140px 80px, white, black 140px); top:430px; left:220px;"></div> +<div style="background: radial-gradient(169.705627px 197.989898px at 80px 60px, white, black 120px); top:640px; left:10px;"></div> +<div style="background: radial-gradient(169.705627px 197.989898px at 80px 140px, white, black 120px); top:640px; left:220px;"></div> diff --git a/layout/reftests/css-gradients/radial-shape-farthest-corner-1c.html b/layout/reftests/css-gradients/radial-shape-farthest-corner-1c.html new file mode 100644 index 000000000..594cbbed3 --- /dev/null +++ b/layout/reftests/css-gradients/radial-shape-farthest-corner-1c.html @@ -0,0 +1,9 @@ +<style>div { position:absolute; width:200px; height:200px; }</style> +<div style="background: -moz-radial-gradient(40px 80px, circle farthest-corner, white, black); top:10px; left:10px;"></div> +<div style="background: -moz-radial-gradient(160px 80px, circle farthest-corner, white, black); top:10px; left:220px;"></div> +<div style="background: -moz-radial-gradient(80px 40px, circle farthest-corner, white, black); top:220px; left:10px;"></div> +<div style="background: -moz-radial-gradient(80px 160px, circle farthest-corner, white, black); top:220px; left:220px;"></div> +<div style="background: -moz-radial-gradient(60px 80px, ellipse farthest-corner, white, black 140px); top:430px; left:10px;"></div> +<div style="background: -moz-radial-gradient(140px 80px, ellipse farthest-corner, white, black 140px); top:430px; left:220px;"></div> +<div style="background: -moz-radial-gradient(80px 60px, farthest-corner, white, black 120px); top:640px; left:10px;"></div> +<div style="background: -moz-radial-gradient(80px 140px, farthest-corner, white, black 120px); top:640px; left:220px;"></div> diff --git a/layout/reftests/css-gradients/radial-shape-farthest-side-1-ref.html b/layout/reftests/css-gradients/radial-shape-farthest-side-1-ref.html new file mode 100644 index 000000000..12801a737 --- /dev/null +++ b/layout/reftests/css-gradients/radial-shape-farthest-side-1-ref.html @@ -0,0 +1,9 @@ +<style>div { position:absolute; width:200px; height:200px; }</style> +<div style="background: radial-gradient(circle farthest-side at 50px 80px, white, black 150px); top:10px; left:10px;"></div> +<div style="background: radial-gradient(farthest-side circle at 150px 80px, white, black 150px); top:10px; left:220px;"></div> +<div style="background: radial-gradient(circle farthest-side at 80px 50px, white, black 150px); top:220px; left:10px;"></div> +<div style="background: radial-gradient(farthest-side circle at 80px 150px, white, black 150px); top:220px; left:220px;"></div> +<div style="background: radial-gradient(circle farthest-side at 80px 80px, white, black 120px); -moz-transform-origin:0 0; -moz-transform:scale(1.0, 0.5); top:430px; left:10px;"></div> +<div style="background: radial-gradient(farthest-side circle at 120px 120px, white, black 120px); -moz-transform-origin:0 0; -moz-transform:scale(1.0, 0.5); top:430px; left:220px;"></div> +<div style="background: radial-gradient(circle farthest-side at 80px 80px, white, black 120px); -moz-transform-origin:0 0; -moz-transform:scale(0.5, 1.0); top:640px; left:10px;"></div> +<div style="background: radial-gradient(farthest-side circle at 120px 120px, white, black 120px); -moz-transform-origin:0 0; -moz-transform:scale(0.5, 1.0); top:640px; left:220px;"></div> diff --git a/layout/reftests/css-gradients/radial-shape-farthest-side-1a.html b/layout/reftests/css-gradients/radial-shape-farthest-side-1a.html new file mode 100644 index 000000000..802280dd6 --- /dev/null +++ b/layout/reftests/css-gradients/radial-shape-farthest-side-1a.html @@ -0,0 +1,9 @@ +<style>div { position:absolute; width:200px; height:200px; }</style> +<div style="background: radial-gradient(circle farthest-side at 50px 80px, white, black); top:10px; left:10px;"></div> +<div style="background: radial-gradient(farthest-side circle at 150px 80px, white, black); top:10px; left:220px;"></div> +<div style="background: radial-gradient(circle farthest-side at 80px 50px, white, black); top:220px; left:10px;"></div> +<div style="background: radial-gradient(farthest-side circle at 80px 150px, white, black); top:220px; left:220px;"></div> +<div style="background: radial-gradient(farthest-side at 80px 40px, white, black); height:100px; top:430px; left:10px;"></div> +<div style="background: radial-gradient(farthest-side at 120px 60px, white, black); height:100px; top:430px; left:220px;"></div> +<div style="background: radial-gradient(ellipse farthest-side at 40px 80px, white, black); width:100px; top:640px; left:10px;"></div> +<div style="background: radial-gradient(farthest-side ellipse at 60px 120px, white, black); width:100px; top:640px; left:220px;"></div> diff --git a/layout/reftests/css-gradients/radial-shape-farthest-side-1b.html b/layout/reftests/css-gradients/radial-shape-farthest-side-1b.html new file mode 100644 index 000000000..4ff797476 --- /dev/null +++ b/layout/reftests/css-gradients/radial-shape-farthest-side-1b.html @@ -0,0 +1,9 @@ +<style>div { position:absolute; width:200px; height:200px; }</style> +<div style="background: radial-gradient(150px 150px at 50px 80px, white, black); top:10px; left:10px;"></div> +<div style="background: radial-gradient(150px at 150px 80px, white, black); top:10px; left:220px;"></div> +<div style="background: radial-gradient(150px 150px at 80px 50px, white, black); top:220px; left:10px;"></div> +<div style="background: radial-gradient(150px at 80px 150px, white, black); top:220px; left:220px;"></div> +<div style="background: radial-gradient(120px 60px at 80px 40px, white, black); height:100px; top:430px; left:10px;"></div> +<div style="background: radial-gradient(120px 60px at 120px 60px, white, black); height:100px; top:430px; left:220px;"></div> +<div style="background: radial-gradient(60px 120px at 40px 80px, white, black); width:100px; top:640px; left:10px;"></div> +<div style="background: radial-gradient(60px 120px at 60px 120px, white, black); width:100px; top:640px; left:220px;"></div> diff --git a/layout/reftests/css-gradients/radial-shape-farthest-side-1c.html b/layout/reftests/css-gradients/radial-shape-farthest-side-1c.html new file mode 100644 index 000000000..5c291c7d5 --- /dev/null +++ b/layout/reftests/css-gradients/radial-shape-farthest-side-1c.html @@ -0,0 +1,9 @@ +<style>div { position:absolute; width:200px; height:200px; }</style> +<div style="background: -moz-radial-gradient(50px 80px, circle farthest-side, white, black); top:10px; left:10px;"></div> +<div style="background: -moz-radial-gradient(150px 80px, circle farthest-side, white, black); top:10px; left:220px;"></div> +<div style="background: -moz-radial-gradient(80px 50px, circle farthest-side, white, black); top:220px; left:10px;"></div> +<div style="background: -moz-radial-gradient(80px 150px, circle farthest-side, white, black); top:220px; left:220px;"></div> +<div style="background: -moz-radial-gradient(80px 40px, farthest-side, white, black); height:100px; top:430px; left:10px;"></div> +<div style="background: -moz-radial-gradient(120px 60px, farthest-side, white, black); height:100px; top:430px; left:220px;"></div> +<div style="background: -moz-radial-gradient(40px 80px, ellipse farthest-side, white, black); width:100px; top:640px; left:10px;"></div> +<div style="background: -moz-radial-gradient(60px 120px, ellipse farthest-side, white, black); width:100px; top:640px; left:220px;"></div> diff --git a/layout/reftests/css-gradients/radial-size-1-ref.html b/layout/reftests/css-gradients/radial-size-1-ref.html new file mode 100644 index 000000000..bb0cc963f --- /dev/null +++ b/layout/reftests/css-gradients/radial-size-1-ref.html @@ -0,0 +1,3 @@ +<div style="background: radial-gradient(white, black) no-repeat; width: 300px; height: 100px;"></div> +<div style="background: radial-gradient(white, black) no-repeat; width: 300px; height: 100px;"></div> +<div style="background: radial-gradient(white, black) no-repeat; width: 300px; height: 100px;"></div> diff --git a/layout/reftests/css-gradients/radial-size-1a.html b/layout/reftests/css-gradients/radial-size-1a.html new file mode 100644 index 000000000..ab5597205 --- /dev/null +++ b/layout/reftests/css-gradients/radial-size-1a.html @@ -0,0 +1,2 @@ +<div style="background: -moz-radial-gradient(white, black); + background-size: 300px 100px; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/radial-size-1b.html b/layout/reftests/css-gradients/radial-size-1b.html new file mode 100644 index 000000000..6095144d3 --- /dev/null +++ b/layout/reftests/css-gradients/radial-size-1b.html @@ -0,0 +1,2 @@ +<div style="background: radial-gradient(70.7106781% 70.7106781% at center, white, black); + background-size: 300px 100px; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/radial-zero-length-1-ref.html b/layout/reftests/css-gradients/radial-zero-length-1-ref.html new file mode 100644 index 000000000..0379d1924 --- /dev/null +++ b/layout/reftests/css-gradients/radial-zero-length-1-ref.html @@ -0,0 +1,2 @@ +<div style="background: black; width: 300px; height: 300px;"></div> +<div style="background: black; width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/radial-zero-length-1a.html b/layout/reftests/css-gradients/radial-zero-length-1a.html new file mode 100644 index 000000000..e1a2faee2 --- /dev/null +++ b/layout/reftests/css-gradients/radial-zero-length-1a.html @@ -0,0 +1,2 @@ +<div style="background: radial-gradient(circle closest-side at left, white, black); width: 300px; height: 300px;"></div> +<div style="background: repeating-radial-gradient(closest-side circle at left, white, black); width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/radial-zero-length-1b.html b/layout/reftests/css-gradients/radial-zero-length-1b.html new file mode 100644 index 000000000..85aa9b473 --- /dev/null +++ b/layout/reftests/css-gradients/radial-zero-length-1b.html @@ -0,0 +1,2 @@ +<div style="background: radial-gradient(circle closest-side at left, red, white 100px, black); width: 300px; height: 300px;"></div> +<div style="background: repeating-radial-gradient(closest-side circle at left, red, white 100px, black); width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/radial-zero-length-1c.html b/layout/reftests/css-gradients/radial-zero-length-1c.html new file mode 100644 index 000000000..2113caae1 --- /dev/null +++ b/layout/reftests/css-gradients/radial-zero-length-1c.html @@ -0,0 +1,2 @@ +<div style="background: radial-gradient(0 0 at left, red, white 100px, black); width: 300px; height: 300px;"></div> +<div style="background: repeating-radial-gradient(0 0 at left, red, white 100px, black); width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/radial-zero-length-1d.html b/layout/reftests/css-gradients/radial-zero-length-1d.html new file mode 100644 index 000000000..fc078321d --- /dev/null +++ b/layout/reftests/css-gradients/radial-zero-length-1d.html @@ -0,0 +1,2 @@ +<div style="background: radial-gradient(ellipse closest-side at left, red, white 100px, black); width: 300px; height: 300px;"></div> +<div style="background: repeating-radial-gradient(closest-side ellipse at left, red, white 100px, black); width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/radial-zero-length-1e.html b/layout/reftests/css-gradients/radial-zero-length-1e.html new file mode 100644 index 000000000..52341674a --- /dev/null +++ b/layout/reftests/css-gradients/radial-zero-length-1e.html @@ -0,0 +1,2 @@ +<div style="background: radial-gradient(0 150px at left, red, white 100px, black); width: 300px; height: 300px;"></div> +<div style="background: repeating-radial-gradient(0 150px at left, red, white 100px, black); width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/radial-zero-length-1f.html b/layout/reftests/css-gradients/radial-zero-length-1f.html new file mode 100644 index 000000000..64d0fafd7 --- /dev/null +++ b/layout/reftests/css-gradients/radial-zero-length-1f.html @@ -0,0 +1,2 @@ +<div style="background: radial-gradient(ellipse closest-side at top, red, white 100px, black); width: 300px; height: 300px;"></div> +<div style="background: repeating-radial-gradient(closest-side ellipse at top, red, white 100px, black); width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/radial-zero-length-1g.html b/layout/reftests/css-gradients/radial-zero-length-1g.html new file mode 100644 index 000000000..aae2da90b --- /dev/null +++ b/layout/reftests/css-gradients/radial-zero-length-1g.html @@ -0,0 +1,2 @@ +<div style="background: -moz-radial-gradient(left, circle closest-side, white, black); width: 300px; height: 300px;"></div> +<div style="background: -moz-repeating-radial-gradient(left, circle closest-side, white, black); width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/radial-zero-length-1h.html b/layout/reftests/css-gradients/radial-zero-length-1h.html new file mode 100644 index 000000000..bb4d3e38b --- /dev/null +++ b/layout/reftests/css-gradients/radial-zero-length-1h.html @@ -0,0 +1,2 @@ +<div style="background: -moz-radial-gradient(left, circle closest-side, red, white 100px, black); width: 300px; height: 300px;"></div> +<div style="background: -moz-repeating-radial-gradient(left, circle closest-side, red, white 100px, black); width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/radial-zero-length-1i.html b/layout/reftests/css-gradients/radial-zero-length-1i.html new file mode 100644 index 000000000..95b0ce243 --- /dev/null +++ b/layout/reftests/css-gradients/radial-zero-length-1i.html @@ -0,0 +1,2 @@ +<div style="background: -moz-radial-gradient(left, ellipse closest-side, red, white 100px, black); width: 300px; height: 300px;"></div> +<div style="background: -moz-repeating-radial-gradient(left, ellipse closest-side, red, white 100px, black); width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/radial-zero-length-1j.html b/layout/reftests/css-gradients/radial-zero-length-1j.html new file mode 100644 index 000000000..1ec61162a --- /dev/null +++ b/layout/reftests/css-gradients/radial-zero-length-1j.html @@ -0,0 +1,2 @@ +<div style="background: -moz-radial-gradient(top, ellipse closest-side, red, white 100px, black); width: 300px; height: 300px;"></div> +<div style="background: -moz-repeating-radial-gradient(top, ellipse closest-side, red, white 100px, black); width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/reftest-stylo.list b/layout/reftests/css-gradients/reftest-stylo.list new file mode 100644 index 000000000..2adcd4cdc --- /dev/null +++ b/layout/reftests/css-gradients/reftest-stylo.list @@ -0,0 +1,169 @@ +# DO NOT EDIT! This is a auto-generated temporary list for Stylo testing +fails fuzzy-if(!contentSameGfxBackendAsCanvas,4,88500) fuzzy-if(azureSkiaGL||skiaContent,4,89700) fuzzy-if(azureQuartz,1,34792) == linear-1a.html linear-1a.html +fails fuzzy-if(!contentSameGfxBackendAsCanvas,4,88500) fuzzy-if(azureSkiaGL||skiaContent,4,89700) fuzzy-if(azureQuartz,1,34792) == linear-1b.html linear-1b.html +fails fuzzy-if(!contentSameGfxBackendAsCanvas,2,88500) fuzzy-if(azureSkiaGL,2,89997) fuzzy-if(azureQuartz,1,11469) fuzzy-if(skiaContent,1,16000) == linear-keywords-1a.html linear-keywords-1a.html +fails fuzzy-if(!contentSameGfxBackendAsCanvas,2,88500) fuzzy-if(azureSkiaGL,2,89997) fuzzy-if(azureQuartz,1,11985) fuzzy-if(skiaContent,1,16000) == linear-keywords-1b.html linear-keywords-1b.html +fuzzy-if(!contentSameGfxBackendAsCanvas,2,88500) fuzzy-if(azureQuartz,1,10230) fuzzy-if(skiaContent,1,18000) == linear-percent.html linear-percent.html +fails fuzzy-if(!contentSameGfxBackendAsCanvas,4,92400) fuzzy-if(azureSkiaGL||skiaContent,3,143400) fuzzy-if(azureQuartz,1,27827) fuzzy-if(Android,4,93000) == linear-mix.html linear-mix.html +== linear-diagonal-1a.html linear-diagonal-1a.html +== linear-diagonal-1b.html linear-diagonal-1b.html +== linear-diagonal-1c.html linear-diagonal-1c.html +== linear-diagonal-2a.html linear-diagonal-2a.html +== linear-diagonal-2b.html linear-diagonal-2b.html +== linear-diagonal-2c.html linear-diagonal-2c.html +== linear-diagonal-3a.html linear-diagonal-3a.html +== linear-diagonal-3b.html linear-diagonal-3b.html +== linear-diagonal-3c.html linear-diagonal-3c.html +== linear-diagonal-4a.html linear-diagonal-4a.html +== linear-diagonal-4b.html linear-diagonal-4b.html +== linear-diagonal-4c.html linear-diagonal-4c.html +== linear-premul.html linear-premul.html + +# these tests uses a similar gradient over different bounds. It's perfectly +# reasonable to expect implementations to give slightly different results +# if the gradients are not being normalized. Skia uses a lookup table for +# gradients so it will have less precision when drawing a larger gradient +fails fuzzy-if(skiaContent,4,16000) == linear-diagonal-5a.html linear-diagonal-5a.html +fails fuzzy-if(azureQuartz&&OSX==1006,2,11657) fuzzy-if(skiaContent,8,20000) == linear-diagonal-6a.html linear-diagonal-6a.html +fails fuzzy-if(skiaContent,8,20000) == linear-diagonal-7a.html linear-diagonal-7a.html +fails fuzzy-if(azureQuartz&&OSX==1006,2,11443) fuzzy-if(skiaContent,4,16000) == linear-diagonal-8a.html linear-diagonal-8a.html + +fails fuzzy-if(cocoaWidget,4,29437) fuzzy-if(skiaContent,2,1700) == linear-diagonal-9a.html linear-diagonal-9a.html +== linear-flipped-1.html linear-flipped-1.html +== linear-position-1a.html linear-position-1a.html +== linear-repeat-1a.html linear-repeat-1a.html +fails-if(d2d) == linear-repeat-1b.html linear-repeat-1b.html +# bug 582236 +== linear-repeat-1c.html linear-repeat-1c.html +fails-if(d2d) == linear-repeat-1d.html linear-repeat-1d.html +# bug 582236 +== linear-repeat-1e.html linear-repeat-1e.html +fails-if(d2d) == linear-repeat-1f.html linear-repeat-1f.html +# bug 582236 +fails-if(d2d) == linear-repeat-1g.html linear-repeat-1g.html +# bug 582236 +fuzzy-if(skiaContent,1,500) == linear-rotated-1.html linear-rotated-1.html +fuzzy-if(OSX,1,45000) fuzzy-if(winWidget,1,36000) == linear-size-1a.html linear-size-1a.html +== linear-stops-1a.html linear-stops-1a.html +== linear-stops-1b.html linear-stops-1b.html +== linear-stops-1c.html linear-stops-1c.html +== linear-stops-1d.html linear-stops-1d.html +== linear-stops-1e.html linear-stops-1e.html +== linear-stops-1f.html linear-stops-1f.html +fails fuzzy-if(!contentSameGfxBackendAsCanvas,3,88500) fuzzy-if(azureSkiaGL||skiaContent,3,89700) fuzzy-if(azureQuartz,1,22367) == linear-vertical-1a.html linear-vertical-1a.html +fails fuzzy-if(!contentSameGfxBackendAsCanvas,3,88500) fuzzy-if(azureSkiaGL||skiaContent,3,89700) fuzzy-if(azureQuartz,1,22367) == linear-vertical-1b.html linear-vertical-1b.html +fails fuzzy-if(!contentSameGfxBackendAsCanvas,3,88500) fuzzy-if(azureSkiaGL||skiaContent,3,89700) fuzzy-if(azureQuartz,2,26777) == linear-vertical-1c.html linear-vertical-1c.html +fails fuzzy-if(!contentSameGfxBackendAsCanvas,3,88500) fuzzy-if(azureSkiaGL||skiaContent,3,89700) fuzzy-if(azureQuartz,2,26777) == linear-vertical-1d.html linear-vertical-1d.html +fails fuzzy-if(!contentSameGfxBackendAsCanvas,3,88500) fuzzy-if(azureSkiaGL||skiaContent,3,89700) fuzzy-if(azureQuartz,1,22367) == linear-vertical-1e.html linear-vertical-1e.html +== linear-vertical-subpixel-1.html linear-vertical-subpixel-1.html +== linear-viewport.html linear-viewport.html +skip fails-if(OSX==1010&&!skiaContent) fuzzy-if(Android,4,248) == linear-zero-length-1a.html linear-zero-length-1a.html +fails-if(OSX==1010&&!skiaContent) fuzzy-if(Android,4,248) == linear-zero-length-1b.html linear-zero-length-1b.html +fails-if(OSX==1010&&!skiaContent) fuzzy-if(Android,4,248) == linear-zero-length-1c.html linear-zero-length-1c.html +== nostops.html nostops.html +== onestop.html onestop.html +fails fuzzy-if(!contentSameGfxBackendAsCanvas,1,5884) fuzzy-if(cocoaWidget,9,87824) fuzzy-if(azureSkiaGL,6,88024) random-if(d2d) fuzzy-if(skiaContent,4,6000) == radial-1a.html radial-1a.html +fails fuzzy-if(!contentSameGfxBackendAsCanvas,1,5884) fuzzy-if(cocoaWidget,9,87824) fuzzy-if(azureSkiaGL,6,88024) random-if(d2d) fuzzy-if(skiaContent,4,6000) == radial-1b.html radial-1b.html +fails fuzzy-if(!contentSameGfxBackendAsCanvas,1,5884) fuzzy-if(cocoaWidget,9,87824) fuzzy-if(azureSkiaGL,6,88024) random-if(d2d) fuzzy-if(skiaContent,4,6000) == radial-1c.html radial-1c.html +fuzzy-if(cocoaWidget,5,89041) fuzzy-if(azureSkiaGL,4,90000) == radial-2a.html radial-2a.html +fuzzy-if(cocoaWidget,5,89041) fuzzy-if(azureSkiaGL,4,90000) == radial-2b.html radial-2b.html +fuzzy-if(cocoaWidget,5,89041) fuzzy-if(azureSkiaGL,4,90000) == radial-2c.html radial-2c.html +fuzzy-if(cocoaWidget,5,89041) fuzzy-if(azureSkiaGL,4,90000) == radial-2d.html radial-2d.html +fuzzy-if(cocoaWidget,5,89041) fuzzy-if(azureSkiaGL,4,90000) == radial-2e.html radial-2e.html +fuzzy-if(cocoaWidget,5,89041) fuzzy-if(azureSkiaGL,4,90000) == radial-2f.html radial-2f.html +== radial-position-1a.html radial-position-1a.html +fails fuzzy-if(cocoaWidget,1,28) fuzzy-if(winWidget,1,18) fuzzy-if(skiaContent,1,50) == radial-position-1b.html radial-position-1b.html +fuzzy-if(cocoaWidget,4,22317) fuzzy-if(Android,8,771) == radial-shape-closest-corner-1a.html radial-shape-closest-corner-1a.html +fails fuzzy-if(cocoaWidget,4,22608) fuzzy-if((/^Windows\x20NT\x2010\.0/.test(http.oscpu)||/^Windows\x20NT\x206\./.test(http.oscpu))&&d2d,1,336) fuzzy-if(Android,8,787) fuzzy-if(B2G,1,242) fuzzy-if(skiaContent,2,300) == radial-shape-closest-corner-1b.html radial-shape-closest-corner-1b.html +fuzzy-if(azureQuartz,2,41171) fuzzy-if(Android,8,771) == radial-shape-closest-corner-1c.html radial-shape-closest-corner-1c.html +fuzzy-if(/^Windows\x20NT\x2010\.0/.test(http.oscpu)||/^Windows\x20NT\x206\.2/.test(http.oscpu),1,5) fuzzy-if(Android,17,3880) == radial-shape-closest-side-1a.html radial-shape-closest-side-1a.html +fuzzy-if(/^Windows\x20NT\x2010\.0/.test(http.oscpu)||/^Windows\x20NT\x206\.2/.test(http.oscpu),1,5) fuzzy-if(Android,17,3880) == radial-shape-closest-side-1b.html radial-shape-closest-side-1b.html +fuzzy-if(/^Windows\x20NT\x2010\.0/.test(http.oscpu)||/^Windows\x20NT\x206\.2/.test(http.oscpu),1,5) fuzzy-if(Android,17,3880) == radial-shape-closest-side-1c.html radial-shape-closest-side-1c.html +fuzzy-if(Android,8,771) == radial-shape-farthest-corner-1a.html radial-shape-farthest-corner-1a.html +fails-if(gtkWidget&&/x86_64-/.test(xulRuntime.XPCOMABI)) fuzzy(1,1569) fuzzy-if(cocoaWidget,2,41281) fuzzy-if(Android,8,1091) fuzzy-if(skiaContent,2,500) == radial-shape-farthest-corner-1b.html radial-shape-farthest-corner-1b.html +fuzzy-if(Android,8,771) == radial-shape-farthest-corner-1c.html radial-shape-farthest-corner-1c.html +fuzzy-if(Android,17,13320) == radial-shape-farthest-side-1a.html radial-shape-farthest-side-1a.html +fuzzy-if(Android,17,13320) == radial-shape-farthest-side-1b.html radial-shape-farthest-side-1b.html +fuzzy-if(Android,17,13320) == radial-shape-farthest-side-1c.html radial-shape-farthest-side-1c.html +== radial-size-1a.html radial-size-1a.html +== radial-size-1b.html radial-size-1b.html +fuzzy-if(Android,4,248) == radial-zero-length-1a.html radial-zero-length-1a.html +fuzzy-if(Android,4,248) == radial-zero-length-1b.html radial-zero-length-1b.html +fuzzy-if(Android,4,248) == radial-zero-length-1c.html radial-zero-length-1c.html +fuzzy-if(Android,4,248) == radial-zero-length-1d.html radial-zero-length-1d.html +fuzzy-if(Android,4,248) == radial-zero-length-1e.html radial-zero-length-1e.html +fuzzy-if(Android,4,248) == radial-zero-length-1f.html radial-zero-length-1f.html +fuzzy-if(Android,4,248) == radial-zero-length-1g.html radial-zero-length-1g.html +fuzzy-if(Android,4,248) == radial-zero-length-1h.html radial-zero-length-1h.html +fuzzy-if(Android,4,248) == radial-zero-length-1i.html radial-zero-length-1i.html +fuzzy-if(Android,4,248) == radial-zero-length-1j.html radial-zero-length-1j.html +== radial-premul.html radial-premul.html +== repeated-final-stop-1.html repeated-final-stop-1.html +== repeating-linear-1a.html repeating-linear-1a.html +== repeating-linear-1b.html repeating-linear-1b.html +== repeating-linear-2a.html repeating-linear-2a.html +fuzzy-if(d2d,127,2612) == repeating-radial-1a.html repeating-radial-1a.html +== repeating-radial-1b.html repeating-radial-1b.html +fuzzy-if(d2d,127,2612) == repeating-radial-1c.html repeating-radial-1c.html +== repeating-radial-1d.html repeating-radial-1d.html +fuzzy-if(d2d,127,2612) == repeating-radial-1e.html repeating-radial-1e.html +== repeating-radial-1f.html repeating-radial-1f.html +== repeating-radial-2a.html repeating-radial-2a.html +== repeating-radial-2b.html repeating-radial-2b.html +fails fuzzy-if(skiaContent,18,600) == twostops-1a.html twostops-1a.html +fails fuzzy-if(skiaContent,18,600) == twostops-1b.html twostops-1b.html +fails fuzzy-if(skiaContent,226,600) == twostops-1c.html twostops-1c.html +fails fuzzy-if(skiaContent,141,300) == twostops-1d.html twostops-1d.html +fails fuzzy-if(skiaContent,73,900) == twostops-1e.html twostops-1e.html +fails fuzzy-if(skiaContent,18,600) == twostops-1f.html twostops-1f.html +fails fuzzy-if(skiaContent,18,600) == twostops-1g.html twostops-1g.html + +# from http://www.xanthir.com/:4bhipd by way of http://a-ja.net/newgrad.html +fuzzy-if(!contentSameGfxBackendAsCanvas,3,20000) fuzzy-if(azureSkiaGL||skiaContent&&layersGPUAccelerated,8,20000) fuzzy-if(azureQuartz&&OSX==1006,1,4646) == aja-linear-1a.html aja-linear-1a.html +== aja-linear-1b.html aja-linear-1b.html +# bug 526694 +fuzzy-if(!contentSameGfxBackendAsCanvas,3,20000) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz&&OSX==1006,1,4646) == aja-linear-1c.html aja-linear-1c.html +skip fuzzy-if(!contentSameGfxBackendAsCanvas,3,20000) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz&&OSX==1006,1,4646) == aja-linear-1d.html aja-linear-1d.html +fails fuzzy-if(!contentSameGfxBackendAsCanvas,3,20000) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz&&OSX==1006,1,4646) == aja-linear-1e.html aja-linear-1e.html +fails fuzzy-if(!contentSameGfxBackendAsCanvas,3,20000) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz&&OSX==1006,1,4646) == aja-linear-1f.html aja-linear-1f.html +fails fuzzy-if(!contentSameGfxBackendAsCanvas,3,20000) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz&&OSX==1006,1,4646) == aja-linear-1g.html aja-linear-1g.html +fails fuzzy-if(!contentSameGfxBackendAsCanvas,2,20000) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz&&OSX==1006,1,4667) == aja-linear-2a.html aja-linear-2a.html +fuzzy-if(!contentSameGfxBackendAsCanvas,2,20000) fuzzy-if(azureSkiaGL,8,20000) fuzzy-if(azureQuartz&&OSX==1006,1,4667) == aja-linear-2b.html aja-linear-2b.html +== aja-linear-2c.html aja-linear-2c.html +# bug 522607 +fails-if(!d2d&&!(skiaContent&&winWidget)) fuzzy-if(skiaContent&&!winWidget,1,200) == aja-linear-2d.html aja-linear-2d.html +# bug 526694 +skip fuzzy-if(!contentSameGfxBackendAsCanvas,2,19999) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz,1,10553) == aja-linear-3a.html aja-linear-3a.html +fuzzy-if(!contentSameGfxBackendAsCanvas,2,19999) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz,1,10553) == aja-linear-3b.html aja-linear-3b.html +fails fuzzy-if(!contentSameGfxBackendAsCanvas,4,20000) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz&&OSX==1006,1,8655) == aja-linear-4a.html aja-linear-4a.html +fails fuzzy-if(!contentSameGfxBackendAsCanvas,4,20000) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz&&OSX==1006,1,8655) == aja-linear-4b.html aja-linear-4b.html +fails fuzzy-if(!contentSameGfxBackendAsCanvas,4,20000) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz&&OSX==1006,2,7878) == aja-linear-5a.html aja-linear-5a.html +fails fuzzy-if(!contentSameGfxBackendAsCanvas,2,16500) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz,2,10163) == aja-linear-6a.html aja-linear-6a.html +# bug 526708 +== aja-linear-6b.html aja-linear-6b.html +# bug 522607 +skip-if(B2G||Mulet) fuzzy-if(Android,6,10576) == height-dependence-1.html height-dependence-1.html +# Initial mulet triage: parity with B2G/B2G Desktop +skip-if(B2G||Mulet) fuzzy-if(cocoaWidget,1,40000) fuzzy-if(Android,6,10576) == height-dependence-2.html height-dependence-2.html +# Initial mulet triage: parity with B2G/B2G Desktop +skip-if(B2G||Mulet) fuzzy-if(Android,6,10576) == height-dependence-3.html height-dependence-3.html +# Initial mulet triage: parity with B2G/B2G Desktop + +== linear-onestopposition-1.html linear-onestopposition-1.html +fuzzy-if(d2d,47,400) == linear-onestopposition-1.html linear-onestopposition-1.html +# d2d interpolates the hard stop +== radial-onestopposition-1a.html radial-onestopposition-1a.html +== radial-onestopposition-1b.html radial-onestopposition-1b.html +== radial-onestopposition-1c.html radial-onestopposition-1c.html +== repeating-linear-onestopposition-1.html repeating-linear-onestopposition-1.html +== repeating-radial-onestopposition-1a.html repeating-radial-onestopposition-1a.html +== repeating-radial-onestopposition-1b.html repeating-radial-onestopposition-1b.html +== repeating-radial-onestopposition-1c.html repeating-radial-onestopposition-1c.html +== bug-916535-background-repeat-linear.html bug-916535-background-repeat-linear.html +== large-gradient-1.html large-gradient-1.html +fuzzy-if(Android,4,1) == large-gradient-2.html large-gradient-2.html +# Bug 1182082 +== large-gradient-3.html large-gradient-3.html +== large-gradient-4.html large-gradient-4.html +== large-gradient-5.html large-gradient-5.html +== 1224761-1.html 1224761-1.html diff --git a/layout/reftests/css-gradients/reftest.list b/layout/reftests/css-gradients/reftest.list new file mode 100644 index 000000000..a93070752 --- /dev/null +++ b/layout/reftests/css-gradients/reftest.list @@ -0,0 +1,154 @@ +fuzzy-if(!contentSameGfxBackendAsCanvas,4,88500) fuzzy-if(azureSkiaGL||skiaContent,4,89700) fuzzy-if(azureQuartz,1,34792) == linear-1a.html linear-1-ref.html +fuzzy-if(!contentSameGfxBackendAsCanvas,4,88500) fuzzy-if(azureSkiaGL||skiaContent,4,89700) fuzzy-if(azureQuartz,1,34792) == linear-1b.html linear-1-ref.html +fuzzy-if(!contentSameGfxBackendAsCanvas,2,88500) fuzzy-if(azureSkiaGL,2,89997) fuzzy-if(azureQuartz,1,11469) fuzzy-if(skiaContent,1,16000) == linear-keywords-1a.html linear-keywords-1-ref.html +fuzzy-if(!contentSameGfxBackendAsCanvas,2,88500) fuzzy-if(azureSkiaGL,2,89997) fuzzy-if(azureQuartz,1,11985) fuzzy-if(skiaContent,1,16000) == linear-keywords-1b.html linear-keywords-1-ref.html +fuzzy-if(!contentSameGfxBackendAsCanvas,2,88500) fuzzy-if(azureQuartz,1,10230) fuzzy-if(skiaContent,1,18000) == linear-percent.html linear-percent-ref.html +fuzzy-if(!contentSameGfxBackendAsCanvas,4,92400) fuzzy-if(azureSkiaGL||skiaContent,3,143400) fuzzy-if(azureQuartz,1,27827) fuzzy-if(Android,4,93000) == linear-mix.html linear-mix-ref.html +== linear-diagonal-1a.html linear-diagonal-1-ref.html +== linear-diagonal-1b.html linear-diagonal-1-ref.html +== linear-diagonal-1c.html linear-diagonal-1-ref.html +== linear-diagonal-2a.html linear-diagonal-2-ref.html +== linear-diagonal-2b.html linear-diagonal-2-ref.html +== linear-diagonal-2c.html linear-diagonal-2-ref.html +== linear-diagonal-3a.html linear-diagonal-3-ref.html +== linear-diagonal-3b.html linear-diagonal-3-ref.html +== linear-diagonal-3c.html linear-diagonal-3-ref.html +== linear-diagonal-4a.html linear-diagonal-4-ref.html +== linear-diagonal-4b.html linear-diagonal-4-ref.html +== linear-diagonal-4c.html linear-diagonal-4-ref.html +== linear-premul.html linear-premul-ref.html + +# these tests uses a similar gradient over different bounds. It's perfectly +# reasonable to expect implementations to give slightly different results +# if the gradients are not being normalized. Skia uses a lookup table for +# gradients so it will have less precision when drawing a larger gradient +fuzzy(2,11410) fuzzy-if(skiaContent,4,16000) == linear-diagonal-5a.html linear-diagonal-5-ref.html +fuzzy(2,11568) fuzzy-if(azureQuartz&&OSX==1006,2,11657) fuzzy-if(skiaContent,8,20000) == linear-diagonal-6a.html linear-diagonal-6-ref.html +fuzzy(2,11605) fuzzy-if(skiaContent,8,20000) == linear-diagonal-7a.html linear-diagonal-7-ref.html +fuzzy(2,11407) fuzzy-if(azureQuartz&&OSX==1006,2,11443) fuzzy-if(skiaContent,4,16000) == linear-diagonal-8a.html linear-diagonal-8-ref.html + +fuzzy-if(cocoaWidget,4,29437) fuzzy-if(skiaContent,2,1700) == linear-diagonal-9a.html linear-diagonal-9-ref.html +fuzzy(1,800000) == linear-flipped-1.html linear-flipped-1-ref.html +== linear-position-1a.html linear-position-1-ref.html +== linear-repeat-1a.html linear-repeat-1-ref.html +fails-if(d2d) == linear-repeat-1b.html linear-repeat-1-ref.html # bug 582236 +== linear-repeat-1c.html linear-repeat-1-ref.html +fails-if(d2d) == linear-repeat-1d.html linear-repeat-1-ref.html # bug 582236 +== linear-repeat-1e.html linear-repeat-1-ref.html +fails-if(d2d) == linear-repeat-1f.html linear-repeat-1-ref.html # bug 582236 +fails-if(d2d) == linear-repeat-1g.html linear-repeat-1-ref.html # bug 582236 +fuzzy-if(skiaContent,1,500) == linear-rotated-1.html linear-rotated-1-ref.html +fuzzy-if(winWidget,1,36000) fuzzy-if(skiaContent,1,45000) == linear-size-1a.html linear-size-1-ref.html +== linear-stops-1a.html linear-stops-1-ref.html +== linear-stops-1b.html linear-stops-1-ref.html +== linear-stops-1c.html linear-stops-1-ref.html +== linear-stops-1d.html linear-stops-1-ref.html +== linear-stops-1e.html linear-stops-1-ref.html +== linear-stops-1f.html linear-stops-1-ref.html +fuzzy-if(!contentSameGfxBackendAsCanvas,3,88500) fuzzy-if(azureSkiaGL||skiaContent,3,89700) fuzzy-if(azureQuartz,1,22367) == linear-vertical-1a.html linear-vertical-1-ref.html +fuzzy-if(!contentSameGfxBackendAsCanvas,3,88500) fuzzy-if(azureSkiaGL||skiaContent,3,89700) fuzzy-if(azureQuartz,1,22367) == linear-vertical-1b.html linear-vertical-1-ref.html +fuzzy-if(!contentSameGfxBackendAsCanvas,3,88500) fuzzy-if(azureSkiaGL||skiaContent,3,89700) fuzzy-if(azureQuartz,2,26777) == linear-vertical-1c.html linear-vertical-1-ref.html +fuzzy-if(!contentSameGfxBackendAsCanvas,3,88500) fuzzy-if(azureSkiaGL||skiaContent,3,89700) fuzzy-if(azureQuartz,2,26777) == linear-vertical-1d.html linear-vertical-1-ref.html +fuzzy-if(!contentSameGfxBackendAsCanvas,3,88500) fuzzy-if(azureSkiaGL||skiaContent,3,89700) fuzzy-if(azureQuartz,1,22367) == linear-vertical-1e.html linear-vertical-1-ref.html +== linear-vertical-subpixel-1.html linear-vertical-subpixel-1-ref.html +== linear-viewport.html linear-viewport-ref.html +fails-if(OSX==1010&&!skiaContent) fuzzy-if(Android,4,248) == linear-zero-length-1a.html linear-zero-length-1-ref.html +fails-if(OSX==1010&&!skiaContent) fuzzy-if(Android,4,248) == linear-zero-length-1b.html linear-zero-length-1-ref.html +fails-if(OSX==1010&&!skiaContent) fuzzy-if(Android,4,248) == linear-zero-length-1c.html linear-zero-length-1-ref.html +== nostops.html about:blank +== onestop.html about:blank +fuzzy-if(!contentSameGfxBackendAsCanvas,1,5884) fuzzy-if(cocoaWidget,9,87824) fuzzy-if(azureSkiaGL,6,88024) random-if(d2d) fuzzy-if(skiaContent,4,6000) == radial-1a.html radial-1-ref.html +fuzzy-if(!contentSameGfxBackendAsCanvas,1,5884) fuzzy-if(cocoaWidget,9,87824) fuzzy-if(azureSkiaGL,6,88024) random-if(d2d) fuzzy-if(skiaContent,4,6000) == radial-1b.html radial-1-ref.html +fuzzy-if(!contentSameGfxBackendAsCanvas,1,5884) fuzzy-if(cocoaWidget,9,87824) fuzzy-if(azureSkiaGL,6,88024) random-if(d2d) fuzzy-if(skiaContent,4,6000) == radial-1c.html radial-1-ref.html +fuzzy(3,7860) fuzzy-if(cocoaWidget,5,89041) fuzzy-if(azureSkiaGL,4,90000) == radial-2a.html radial-2-ref.html +fuzzy(3,7860) fuzzy-if(cocoaWidget,5,89041) fuzzy-if(azureSkiaGL,4,90000) == radial-2b.html radial-2-ref.html +fuzzy(3,7860) fuzzy-if(cocoaWidget,5,89041) fuzzy-if(azureSkiaGL,4,90000) == radial-2c.html radial-2-ref.html +fuzzy(3,7860) fuzzy-if(cocoaWidget,5,89041) fuzzy-if(azureSkiaGL,4,90000) == radial-2d.html radial-2-ref.html +fuzzy(3,7860) fuzzy-if(cocoaWidget,5,89041) fuzzy-if(azureSkiaGL,4,90000) == radial-2e.html radial-2-ref.html +fuzzy(3,7860) fuzzy-if(cocoaWidget,5,89041) fuzzy-if(azureSkiaGL,4,90000) == radial-2f.html radial-2-ref.html +== radial-position-1a.html radial-position-1-ref.html +fuzzy-if(cocoaWidget,1,28) fuzzy-if(winWidget,1,18) fuzzy-if(skiaContent,1,50) == radial-position-1b.html radial-position-1-ref.html +fuzzy-if(cocoaWidget,4,22317) fuzzy-if(Android,8,771) == radial-shape-closest-corner-1a.html radial-shape-closest-corner-1-ref.html +fuzzy(1,238) fuzzy-if(cocoaWidget,4,22608) fuzzy-if((/^Windows\x20NT\x2010\.0/.test(http.oscpu)||/^Windows\x20NT\x206\./.test(http.oscpu))&&d2d,1,336) fuzzy-if(Android,8,787) fuzzy-if(skiaContent,2,300) == radial-shape-closest-corner-1b.html radial-shape-closest-corner-1-ref.html +fuzzy-if(azureQuartz,2,41171) fuzzy-if(Android,8,771) == radial-shape-closest-corner-1c.html radial-shape-closest-corner-1-ref.html +fuzzy-if(/^Windows\x20NT\x2010\.0/.test(http.oscpu)||/^Windows\x20NT\x206\.2/.test(http.oscpu),1,5) fuzzy-if(Android,17,3880) == radial-shape-closest-side-1a.html radial-shape-closest-side-1-ref.html +fuzzy-if(/^Windows\x20NT\x2010\.0/.test(http.oscpu)||/^Windows\x20NT\x206\.2/.test(http.oscpu),1,5) fuzzy-if(Android,17,3880) == radial-shape-closest-side-1b.html radial-shape-closest-side-1-ref.html +fuzzy-if(/^Windows\x20NT\x2010\.0/.test(http.oscpu)||/^Windows\x20NT\x206\.2/.test(http.oscpu),1,5) fuzzy-if(Android,17,3880) == radial-shape-closest-side-1c.html radial-shape-closest-side-1-ref.html +fuzzy-if(Android,8,771) == radial-shape-farthest-corner-1a.html radial-shape-farthest-corner-1-ref.html +fails-if(gtkWidget&&/x86_64-/.test(xulRuntime.XPCOMABI)) fuzzy(1,1569) fuzzy-if(cocoaWidget,2,41281) fuzzy-if(Android,8,1091) fuzzy-if(skiaContent,2,500) == radial-shape-farthest-corner-1b.html radial-shape-farthest-corner-1-ref.html +fuzzy-if(Android,8,771) == radial-shape-farthest-corner-1c.html radial-shape-farthest-corner-1-ref.html +fuzzy-if(Android,17,13320) == radial-shape-farthest-side-1a.html radial-shape-farthest-side-1-ref.html +fuzzy-if(Android,17,13320) == radial-shape-farthest-side-1b.html radial-shape-farthest-side-1-ref.html +fuzzy-if(Android,17,13320) == radial-shape-farthest-side-1c.html radial-shape-farthest-side-1-ref.html +== radial-size-1a.html radial-size-1-ref.html +== radial-size-1b.html radial-size-1-ref.html +fuzzy-if(Android,4,248) == radial-zero-length-1a.html radial-zero-length-1-ref.html +fuzzy-if(Android,4,248) == radial-zero-length-1b.html radial-zero-length-1-ref.html +fuzzy-if(Android,4,248) == radial-zero-length-1c.html radial-zero-length-1-ref.html +fuzzy-if(Android,4,248) == radial-zero-length-1d.html radial-zero-length-1-ref.html +fuzzy-if(Android,4,248) == radial-zero-length-1e.html radial-zero-length-1-ref.html +fuzzy-if(Android,4,248) == radial-zero-length-1f.html radial-zero-length-1-ref.html +fuzzy-if(Android,4,248) == radial-zero-length-1g.html radial-zero-length-1-ref.html +fuzzy-if(Android,4,248) == radial-zero-length-1h.html radial-zero-length-1-ref.html +fuzzy-if(Android,4,248) == radial-zero-length-1i.html radial-zero-length-1-ref.html +fuzzy-if(Android,4,248) == radial-zero-length-1j.html radial-zero-length-1-ref.html +== radial-premul.html radial-premul-ref.html +== repeated-final-stop-1.html repeated-final-stop-1-ref.html +== repeating-linear-1a.html repeating-linear-1-ref.html +== repeating-linear-1b.html repeating-linear-1-ref.html +== repeating-linear-2a.html repeating-linear-2-ref.html +fuzzy-if(d2d,127,2612) == repeating-radial-1a.html repeating-radial-1-ref.html +== repeating-radial-1b.html repeating-radial-1-ref.html +fuzzy-if(d2d,127,2612) == repeating-radial-1c.html repeating-radial-1-ref.html +== repeating-radial-1d.html repeating-radial-1-ref.html +fuzzy-if(d2d,127,2612) == repeating-radial-1e.html repeating-radial-1-ref.html +== repeating-radial-1f.html repeating-radial-1-ref.html +== repeating-radial-2a.html repeating-radial-2-ref.html +== repeating-radial-2b.html repeating-radial-2-ref.html +fuzzy-if(skiaContent,18,600) == twostops-1a.html twostops-1-ref.html +fuzzy-if(skiaContent,18,600) == twostops-1b.html twostops-1-ref.html +fuzzy-if(skiaContent,226,600) == twostops-1c.html twostops-1-ref.html +fuzzy-if(skiaContent,141,300) == twostops-1d.html twostops-1-ref.html +fuzzy-if(skiaContent,73,900) == twostops-1e.html twostops-1-ref.html +fuzzy-if(skiaContent,18,600) == twostops-1f.html twostops-1-ref.html +fuzzy-if(skiaContent,18,600) == twostops-1g.html twostops-1-ref.html + +# from http://www.xanthir.com/:4bhipd by way of http://a-ja.net/newgrad.html +fuzzy-if(!contentSameGfxBackendAsCanvas,3,20000) fuzzy-if(azureSkiaGL||skiaContent&&layersGPUAccelerated,8,20000) fuzzy-if(azureQuartz&&OSX==1006,1,4646) == aja-linear-1a.html aja-linear-1-ref.html +fails-if(!d2d&&!skiaContent) == aja-linear-1b.html aja-linear-1-ref.html # bug 526694 +fuzzy-if(!contentSameGfxBackendAsCanvas,3,20000) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz&&OSX==1006,1,4646) == aja-linear-1c.html aja-linear-1-ref.html +fuzzy-if(!contentSameGfxBackendAsCanvas,3,20000) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz&&OSX==1006,1,4646) == aja-linear-1d.html aja-linear-1-ref.html +fuzzy-if(!contentSameGfxBackendAsCanvas,3,20000) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz&&OSX==1006,1,4646) == aja-linear-1e.html aja-linear-1-ref.html +fuzzy-if(!contentSameGfxBackendAsCanvas,3,20000) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz&&OSX==1006,1,4646) == aja-linear-1f.html aja-linear-1-ref.html +fuzzy-if(!contentSameGfxBackendAsCanvas,3,20000) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz&&OSX==1006,1,4646) == aja-linear-1g.html aja-linear-1-ref.html +fuzzy-if(!contentSameGfxBackendAsCanvas,2,20000) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz&&OSX==1006,1,4667) == aja-linear-2a.html aja-linear-2-ref.html +fuzzy-if(!contentSameGfxBackendAsCanvas,2,20000) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz&&OSX==1006,1,4667) == aja-linear-2b.html aja-linear-2-ref.html +fails == aja-linear-2c.html aja-linear-2-ref.html # bug 522607 +fails-if(!d2d&&!(skiaContent&&winWidget)) fuzzy-if(skiaContent&&!winWidget,1,200) == aja-linear-2d.html aja-linear-2-ref.html # bug 526694 +fuzzy-if(!contentSameGfxBackendAsCanvas,2,19999) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz,1,10553) == aja-linear-3a.html aja-linear-3-ref.html +fuzzy-if(!contentSameGfxBackendAsCanvas,2,19999) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz,1,10553) == aja-linear-3b.html aja-linear-3-ref.html +fuzzy-if(!contentSameGfxBackendAsCanvas,4,20000) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz&&OSX==1006,1,8655) == aja-linear-4a.html aja-linear-4-ref.html +fuzzy-if(!contentSameGfxBackendAsCanvas,4,20000) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz&&OSX==1006,1,8655) == aja-linear-4b.html aja-linear-4-ref.html +fuzzy-if(!contentSameGfxBackendAsCanvas,4,20000) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz&&OSX==1006,2,7878) == aja-linear-5a.html aja-linear-5-ref.html +fuzzy-if(!contentSameGfxBackendAsCanvas,2,16500) fuzzy-if(azureSkiaGL||skiaContent,8,20000) fuzzy-if(azureQuartz,2,10163) == aja-linear-6a.html aja-linear-6-ref.html # bug 526708 +fails == aja-linear-6b.html aja-linear-6-ref.html # bug 522607 +fuzzy-if(Android,6,10576) == height-dependence-1.html height-dependence-1-ref.html +fuzzy-if(cocoaWidget,1,40000) fuzzy-if(Android,6,10576) == height-dependence-2.html height-dependence-2-ref.html +fuzzy-if(Android,6,10576) == height-dependence-3.html height-dependence-3-ref.html + +== linear-onestopposition-1.html linear-onestopposition-1-ref.html +fuzzy-if(d2d,47,400) == linear-onestopposition-1.html linear-onestopposition-1-ref2.html # d2d interpolates the hard stop +== radial-onestopposition-1a.html radial-onestopposition-1-ref.html +== radial-onestopposition-1b.html radial-onestopposition-1-ref.html +== radial-onestopposition-1c.html radial-onestopposition-1-ref.html +== repeating-linear-onestopposition-1.html orange-square.html +== repeating-radial-onestopposition-1a.html orange-square.html +== repeating-radial-onestopposition-1b.html orange-square.html +== repeating-radial-onestopposition-1c.html orange-square.html +== bug-916535-background-repeat-linear.html bug-916535-background-repeat-linear-ref.html +fuzzy(1,800000) == large-gradient-1.html large-gradient-1-ref.html +fuzzy-if(Android,4,1) == large-gradient-2.html large-gradient-2-ref.html # Bug 1182082 +fuzzy(1,800000) == large-gradient-3.html large-gradient-3-ref.html +== large-gradient-4.html large-gradient-4-ref.html +fuzzy(2,800000) == large-gradient-5.html large-gradient-5-ref.html +== 1224761-1.html 1224761-1-ref.html diff --git a/layout/reftests/css-gradients/repeated-final-stop-1-ref.html b/layout/reftests/css-gradients/repeated-final-stop-1-ref.html new file mode 100644 index 000000000..be4f97dd7 --- /dev/null +++ b/layout/reftests/css-gradients/repeated-final-stop-1-ref.html @@ -0,0 +1,19 @@ +<!DOCTYPE HTML> +<html> +<head> +<style> +html { + background: white; +} +div { + background: -moz-linear-gradient(left, 0 white, 100% orange); + background: linear-gradient(left, 0 white, 100% orange); + height: 100px; + width: 50%; +} +</style> +</head> +<body> +<div></div> +</body> +</html> diff --git a/layout/reftests/css-gradients/repeated-final-stop-1.html b/layout/reftests/css-gradients/repeated-final-stop-1.html new file mode 100644 index 000000000..35cc594b6 --- /dev/null +++ b/layout/reftests/css-gradients/repeated-final-stop-1.html @@ -0,0 +1,18 @@ +<!DOCTYPE HTML> +<html> +<head> +<style> +html { + background: white; +} +div { + background: -moz-linear-gradient(left, 0 white, 50% orange, 50% white); + background: linear-gradient(left, 0 white, 50% orange, 50% white); + height: 100px; +} +</style> +</head> +<body> +<div></div> +</body> +</html> diff --git a/layout/reftests/css-gradients/repeating-linear-1-ref.html b/layout/reftests/css-gradients/repeating-linear-1-ref.html new file mode 100644 index 000000000..74f2dcebd --- /dev/null +++ b/layout/reftests/css-gradients/repeating-linear-1-ref.html @@ -0,0 +1,8 @@ +<div style="background: black; width: 400px; height: 50px;"></div> +<div style="background: white; width: 400px; height: 50px;"></div> +<div style="background: black; width: 400px; height: 50px;"></div> +<div style="background: white; width: 400px; height: 50px;"></div> +<div style="background: black; width: 400px; height: 50px;"></div> +<div style="background: white; width: 400px; height: 50px;"></div> +<div style="background: black; width: 400px; height: 50px;"></div> +<div style="background: white; width: 400px; height: 50px;"></div> diff --git a/layout/reftests/css-gradients/repeating-linear-1a.html b/layout/reftests/css-gradients/repeating-linear-1a.html new file mode 100644 index 000000000..463554754 --- /dev/null +++ b/layout/reftests/css-gradients/repeating-linear-1a.html @@ -0,0 +1 @@ +<div style="background: -moz-repeating-linear-gradient(black 0, black 50px, white 50px, white 100px); width: 400px; height: 400px;"></div> diff --git a/layout/reftests/css-gradients/repeating-linear-1b.html b/layout/reftests/css-gradients/repeating-linear-1b.html new file mode 100644 index 000000000..1c3488743 --- /dev/null +++ b/layout/reftests/css-gradients/repeating-linear-1b.html @@ -0,0 +1 @@ +<div style="background: -moz-repeating-linear-gradient(black 100px, black 150px, white 150px, white 200px); width: 400px; height: 400px;"></div> diff --git a/layout/reftests/css-gradients/repeating-linear-2-ref.html b/layout/reftests/css-gradients/repeating-linear-2-ref.html new file mode 100644 index 000000000..50dd2d8c2 --- /dev/null +++ b/layout/reftests/css-gradients/repeating-linear-2-ref.html @@ -0,0 +1 @@ +<div style="width:300px; height:300px; background:blue;"></div>
\ No newline at end of file diff --git a/layout/reftests/css-gradients/repeating-linear-2a.html b/layout/reftests/css-gradients/repeating-linear-2a.html new file mode 100644 index 000000000..130649c9e --- /dev/null +++ b/layout/reftests/css-gradients/repeating-linear-2a.html @@ -0,0 +1 @@ +<div style="background: -moz-repeating-linear-gradient(red 20px, blue 20px); width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/repeating-linear-onestopposition-1.html b/layout/reftests/css-gradients/repeating-linear-onestopposition-1.html new file mode 100644 index 000000000..47963778f --- /dev/null +++ b/layout/reftests/css-gradients/repeating-linear-onestopposition-1.html @@ -0,0 +1,12 @@ +<!DOCTYPE HTML> +<title>Test for repeating-linear-gradient() with all stops at the same position</title> +<style> + +div { + width: 200px; + height: 200px; + background-image: repeating-linear-gradient(to right, blue 25%, orange 25%); +} + +</style> +<div></div> diff --git a/layout/reftests/css-gradients/repeating-radial-1-ref.html b/layout/reftests/css-gradients/repeating-radial-1-ref.html new file mode 100644 index 000000000..6064a9eda --- /dev/null +++ b/layout/reftests/css-gradients/repeating-radial-1-ref.html @@ -0,0 +1 @@ +<div style="background: repeating-radial-gradient(closest-side, black 0, black 50px, white 50px, white 100px); width: 400px; height: 400px;"></div> diff --git a/layout/reftests/css-gradients/repeating-radial-1a.html b/layout/reftests/css-gradients/repeating-radial-1a.html new file mode 100644 index 000000000..423789134 --- /dev/null +++ b/layout/reftests/css-gradients/repeating-radial-1a.html @@ -0,0 +1 @@ +<div style="background: repeating-radial-gradient(closest-side, black 100px, black 150px, white 150px, white 200px); width: 400px; height: 400px;"></div> diff --git a/layout/reftests/css-gradients/repeating-radial-1b.html b/layout/reftests/css-gradients/repeating-radial-1b.html new file mode 100644 index 000000000..b12365161 --- /dev/null +++ b/layout/reftests/css-gradients/repeating-radial-1b.html @@ -0,0 +1,4 @@ +<!-- Test adjustment of negative stop positions in a repeating radial gradient. + We should still get a repeating pattern, i.e., the stops cannot + naively be mapped to 0. --> +<div style="background: repeating-radial-gradient(closest-side, black -100px, black -50px, white -50px, white 0); width: 400px; height: 400px;"></div> diff --git a/layout/reftests/css-gradients/repeating-radial-1c.html b/layout/reftests/css-gradients/repeating-radial-1c.html new file mode 100644 index 000000000..c78a4d678 --- /dev/null +++ b/layout/reftests/css-gradients/repeating-radial-1c.html @@ -0,0 +1 @@ +<div style="background: repeating-radial-gradient(200px 200px at center, black 100px, black 150px, white 150px, white 200px); width: 400px; height: 400px;"></div> diff --git a/layout/reftests/css-gradients/repeating-radial-1d.html b/layout/reftests/css-gradients/repeating-radial-1d.html new file mode 100644 index 000000000..b91ac6bb3 --- /dev/null +++ b/layout/reftests/css-gradients/repeating-radial-1d.html @@ -0,0 +1,4 @@ +<!-- Test adjustment of negative stop positions in a repeating radial gradient. + We should still get a repeating pattern, i.e., the stops cannot + naively be mapped to 0. --> +<div style="background: repeating-radial-gradient(200px 200px at center, black -100px, black -50px, white -50px, white 0); width: 400px; height: 400px;"></div> diff --git a/layout/reftests/css-gradients/repeating-radial-1e.html b/layout/reftests/css-gradients/repeating-radial-1e.html new file mode 100644 index 000000000..85546da7c --- /dev/null +++ b/layout/reftests/css-gradients/repeating-radial-1e.html @@ -0,0 +1 @@ +<div style="background: -moz-repeating-radial-gradient(closest-side, black 100px, black 150px, white 150px, white 200px); width: 400px; height: 400px;"></div> diff --git a/layout/reftests/css-gradients/repeating-radial-1f.html b/layout/reftests/css-gradients/repeating-radial-1f.html new file mode 100644 index 000000000..30f2d2672 --- /dev/null +++ b/layout/reftests/css-gradients/repeating-radial-1f.html @@ -0,0 +1,4 @@ +<!-- Test adjustment of negative stop positions in a repeating radial gradient. + We should still get a repeating pattern, i.e., the stops cannot + naively be mapped to 0. --> +<div style="background: -moz-repeating-radial-gradient(closest-side, black -100px, black -50px, white -50px, white 0); width: 400px; height: 400px;"></div> diff --git a/layout/reftests/css-gradients/repeating-radial-2-ref.html b/layout/reftests/css-gradients/repeating-radial-2-ref.html new file mode 100644 index 000000000..9620cead2 --- /dev/null +++ b/layout/reftests/css-gradients/repeating-radial-2-ref.html @@ -0,0 +1 @@ +<div style="width:300px; height:300px; background:blue;"></div> diff --git a/layout/reftests/css-gradients/repeating-radial-2a.html b/layout/reftests/css-gradients/repeating-radial-2a.html new file mode 100644 index 000000000..a29371a2b --- /dev/null +++ b/layout/reftests/css-gradients/repeating-radial-2a.html @@ -0,0 +1 @@ +<div style="background: repeating-radial-gradient(red 20px, blue 20px); width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/repeating-radial-2b.html b/layout/reftests/css-gradients/repeating-radial-2b.html new file mode 100644 index 000000000..560132bdf --- /dev/null +++ b/layout/reftests/css-gradients/repeating-radial-2b.html @@ -0,0 +1 @@ +<div style="background: repeating-radial-gradient(212.1320343px 212.1320343px at center, red 20px, blue 20px); width: 300px; height: 300px;"></div> diff --git a/layout/reftests/css-gradients/repeating-radial-onestopposition-1a.html b/layout/reftests/css-gradients/repeating-radial-onestopposition-1a.html new file mode 100644 index 000000000..dcf080a94 --- /dev/null +++ b/layout/reftests/css-gradients/repeating-radial-onestopposition-1a.html @@ -0,0 +1,12 @@ +<!DOCTYPE HTML> +<title>Test for -moz-repeating-radial-gradient() with all stops at the same position</title> +<style> + +div { + width: 200px; + height: 200px; + background-image: repeating-radial-gradient(closest-side, blue 25%, orange 25%); +} + +</style> +<div></div> diff --git a/layout/reftests/css-gradients/repeating-radial-onestopposition-1b.html b/layout/reftests/css-gradients/repeating-radial-onestopposition-1b.html new file mode 100644 index 000000000..f301f8688 --- /dev/null +++ b/layout/reftests/css-gradients/repeating-radial-onestopposition-1b.html @@ -0,0 +1,12 @@ +<!DOCTYPE HTML> +<title>Test for -moz-repeating-radial-gradient() with all stops at the same position</title> +<style> + +div { + width: 200px; + height: 200px; + background-image: repeating-radial-gradient(50% 50% at 50% 50%, blue 25%, orange 25%); +} + +</style> +<div></div> diff --git a/layout/reftests/css-gradients/repeating-radial-onestopposition-1c.html b/layout/reftests/css-gradients/repeating-radial-onestopposition-1c.html new file mode 100644 index 000000000..a9cfb2aaa --- /dev/null +++ b/layout/reftests/css-gradients/repeating-radial-onestopposition-1c.html @@ -0,0 +1,12 @@ +<!DOCTYPE HTML> +<title>Test for -moz-repeating-radial-gradient() with all stops at the same position</title> +<style> + +div { + width: 200px; + height: 200px; + background-image: -moz-repeating-radial-gradient(contain, blue 25%, orange 25%); +} + +</style> +<div></div> diff --git a/layout/reftests/css-gradients/twostops-1-ref.html b/layout/reftests/css-gradients/twostops-1-ref.html new file mode 100644 index 000000000..26ab00cf2 --- /dev/null +++ b/layout/reftests/css-gradients/twostops-1-ref.html @@ -0,0 +1,7 @@ +<!DOCTYPE HTML> +<html> +<body> +<div style="background:#0000ff; width:300px; height:150px;"></div> +<div style="background:#ff0000; width:300px; height:150px;"></div> +</body> +</html> diff --git a/layout/reftests/css-gradients/twostops-1a.html b/layout/reftests/css-gradients/twostops-1a.html new file mode 100644 index 000000000..0ebe8a470 --- /dev/null +++ b/layout/reftests/css-gradients/twostops-1a.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(top, #0000ff 50%, #ff0000 50%) no-repeat; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/twostops-1b.html b/layout/reftests/css-gradients/twostops-1b.html new file mode 100644 index 000000000..f60ec838f --- /dev/null +++ b/layout/reftests/css-gradients/twostops-1b.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(bottom, #ff0000 50%, #0000ff 50%) no-repeat; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/twostops-1c.html b/layout/reftests/css-gradients/twostops-1c.html new file mode 100644 index 000000000..4a02e3d47 --- /dev/null +++ b/layout/reftests/css-gradients/twostops-1c.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(yellow -50%, #0000ff 0, #0000ff 50%, #ff0000 50%) no-repeat; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/twostops-1d.html b/layout/reftests/css-gradients/twostops-1d.html new file mode 100644 index 000000000..28943a0aa --- /dev/null +++ b/layout/reftests/css-gradients/twostops-1d.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(#0000ff 50%, #ff0000 50%, #ff0000 100%, yellow 150%) no-repeat; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/twostops-1e.html b/layout/reftests/css-gradients/twostops-1e.html new file mode 100644 index 000000000..dc584500f --- /dev/null +++ b/layout/reftests/css-gradients/twostops-1e.html @@ -0,0 +1 @@ +<div style="background: -moz-linear-gradient(yellow -50%, #0000ff 0, #0000ff 50%, #ff0000 50%, #ff0000 100%, yellow 150%) no-repeat; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/twostops-1f.html b/layout/reftests/css-gradients/twostops-1f.html new file mode 100644 index 000000000..8965d6363 --- /dev/null +++ b/layout/reftests/css-gradients/twostops-1f.html @@ -0,0 +1 @@ +<div style="background: linear-gradient(to bottom, #0000ff 50%, #ff0000 50%) no-repeat; width: 300px; height: 300px;"><br></div> diff --git a/layout/reftests/css-gradients/twostops-1g.html b/layout/reftests/css-gradients/twostops-1g.html new file mode 100644 index 000000000..f6102065b --- /dev/null +++ b/layout/reftests/css-gradients/twostops-1g.html @@ -0,0 +1 @@ +<div style="background: linear-gradient(to top, #ff0000 50%, #0000ff 50%) no-repeat; width: 300px; height: 300px;"><br></div> |