Bug 559426: Replace unreliable HTML reference for boxshadow-inner-basic with an SVG file that does exactly the same drawing operations as the test. r=roc

This commit is contained in:
Zack Weinberg 2010-05-11 12:18:42 -07:00
parent e571e727e6
commit 0f97622a38
4 changed files with 49 additions and 19 deletions

View File

@ -1,12 +0,0 @@
<body style="font-size: 16px;">
<div style="background-color: grey;
width: 15em; height: 15em;
-moz-border-radius: 0.5em;
position: absolute;
top: 1em; left: 1em;">inset</div>
<div style="-moz-border-radius: 0.5em;
width: 15em; height: 15em;
background-color: white;
position: absolute;
top: 3em; left: 3em;">&nbsp;</div>
</body>

View File

@ -0,0 +1,41 @@
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
<!-- This reference SVG must perform *exactly* the same path construction,
clipping, and filling operations that PaintBoxShadowInner does for
the HTML test file. If it doesn't match perfectly, antialiased
pixels at the curved edges will not agree.
PaintBoxShadowInner defines both its second (nonrectangular)
clipping path and its fill path as the even-odd-rule compositions
of two rectangles, one with nonzero corner radius. It is
impossible to express "the path consisting of the even-odd-rule
composition of two |rect| elements" in SVG. This is a minor
nuisance because we have to write everything out using |path|,
plus a major nuisance because Gecko uses the same ellipse-to-
Bezier conversion for rounded rectangles in SVG and HTML, but the
SVG 'A' operator uses a different one. Therefore we cannot use 'A'.
The 'C' parameters here were obtained by dumping out the cairo
operations used to draw the HTML, using cairo-trace. -->
<defs>
<clipPath id="outer">
<rect x="16" y="16" width="240" height="240"/>
</clipPath>
<clipPath id="inner">
<path clip-rule="evenodd"
d="M 248 16
H 24 C 19.58468 16 16 19.58468 16 24
V 248 C 16 252.41532 19.58468 256 24 256
H 248 C 252.41532 256 256 252.41532 256 248
V 24 C 256 19.58468 252.41532 16 248 16 Z
M 48 56 H 272 V 296 H 48 Z"/>
</clipPath>
</defs>
<g clip-path="url(#outer)">
<path fill="grey" fill-rule="evenodd" clip-path="url(#inner)"
d="M 16 16 H 256 V 256 H 16 Z
M 280 48
H 56 C 51.58468 48 48 51.58468 48 56
V 280 C 48 284.41532 51.58468 288 56 288
H 280 C 284.41532 288 288 284.41532 288 280
V 56 C 288 51.58468 284.41532 48 280 48 Z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.8 KiB

View File

@ -1,7 +1,8 @@
<body style="font-size: 16px;">
<div style="-moz-box-shadow: 2em 2em grey inset;
width: 15em; height: 15em;
-moz-border-radius: .5em;
<!doctype html>
<div style="
width: 240px; height: 240px;
-moz-border-radius: 8px;
-moz-box-shadow: 32px 32px grey inset;
position: absolute;
top: 1em; left: 1em;">inset</div>
</body>
top: 16px; left: 16px;
"></div>

View File

@ -8,7 +8,7 @@
== boxshadow-rounding.html boxshadow-rounding-ref.html
== boxshadow-button.html boxshadow-button-ref.html
== boxshadow-fileupload.html boxshadow-fileupload-ref.html
== boxshadow-inner-basic.html boxshadow-inner-basic-ref.html
== boxshadow-inner-basic.html boxshadow-inner-basic-ref.svg
== boxshadow-mixed.html boxshadow-mixed-ref.html
== boxshadow-rounded-spread.html boxshadow-rounded-spread-ref.html
HTTP(..) == boxshadow-dynamic.xul boxshadow-dynamic-ref.xul