diff options
| author | Matt A. Tobin <mattatobin@localhost.localdomain> | 2018-02-02 04:16:08 -0500 |
|---|---|---|
| committer | Matt A. Tobin <mattatobin@localhost.localdomain> | 2018-02-02 04:16:08 -0500 |
| commit | 5f8de423f190bbb79a62f804151bc24824fa32d8 (patch) | |
| tree | 10027f336435511475e392454359edea8e25895d /testing/web-platform/tests/svg | |
| parent | 49ee0794b5d912db1f95dce6eb52d781dc210db5 (diff) | |
| download | UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.gz UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.lz UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.xz UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.zip | |
Add m-esr52 at 52.6.0
Diffstat (limited to 'testing/web-platform/tests/svg')
579 files changed, 60887 insertions, 0 deletions
diff --git a/testing/web-platform/tests/svg/OWNERS b/testing/web-platform/tests/svg/OWNERS new file mode 100644 index 000000000..aeee0aac3 --- /dev/null +++ b/testing/web-platform/tests/svg/OWNERS @@ -0,0 +1,2 @@ +@heycam +@Ms2ger diff --git a/testing/web-platform/tests/svg/README.md b/testing/web-platform/tests/svg/README.md new file mode 100644 index 000000000..ee86b537a --- /dev/null +++ b/testing/web-platform/tests/svg/README.md @@ -0,0 +1,27 @@ +The `import` directory contains tests imported from the [SVG 1.1 Second +Edition test suite](http://www.w3.org/Graphics/SVG/Test/20110816/), +with tests renamed to contain `-manual` in their name. These tests need +review to verify that they are still correct for the latest version of +SVG (which at the time of writing is [SVG 2](https://svgwg.org/svg2-draft/)) +and then need to be converted to reftests or testharness.js-based +tests. + +The SVG 1.1 test suite came with [reference +PNGs](http://dev.w3.org/SVG/profiles/1.1F2/test/png/) for each test, +which, while not suitable as exact reftest reference files, at least +give a rough indication of what the test should look like. For some +tests, such as those involving filters, the test pass criteria are +written with reference to the PNGs. When converting the tests to +reftests or testharness.js-based tests, you might want to consult the +reference PNG. + +Tests should be placed in a directory named after the SVG 2 chapter name +(for example in the `shapes/` directory for Basic Shapes chapter tests). +Scripted tests should be placed under a `scripted/` subdirectory and +reftests under a `reftests/` subdirectory, within the chapter directory. +Filenames for tests of DOM methods and properties should start with +*InterfaceName*.*methodOrPropertyName*, such as +`types/scripted/SVGElement.ownerSVGElement-01.html`. + +Direct questions about the imported SVG 1.1 tests to +[Cameron McCormack](mailto:cam@mcc.id.au). diff --git a/testing/web-platform/tests/svg/historical.html b/testing/web-platform/tests/svg/historical.html new file mode 100644 index 000000000..8f28002e8 --- /dev/null +++ b/testing/web-platform/tests/svg/historical.html @@ -0,0 +1,81 @@ +<!DOCTYPE html> +<title>Historical SVG features must be removed</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script> +var removedInterfaces = [ + "SVGAnimatedPathData", + "SVGColor", + "SVGDocument", + "SVGElementInstanceList", + "SVGExternalResourcesRequired", + "SVGICCColor", + "SVGLangSpace", + "SVGLocatable", + "SVGPaint", + "SVGPathSeg", + "SVGStylable", + "SVGViewSpec", + "SVGZoomEvent" +] +for (var name of removedInterfaces) { + test(function() { + assert_false(name in window) + }, name + " interface must be removed") +} + +var mixinInterfaces = [ + "GetSVGDocument", + "SVGAnimatedPoints", + "SVGElementInstance", + "SVGFilterPrimitiveStandardAttributes", + "SVGFitToViewBox", + "SVGTests", + "SVGURIReference", + "SVGUnitTypes", + "SVGZoomAndPan" +] +for (var name of mixinInterfaces) { + test(function() { + assert_false(name in window) + }, name + " mixin interface must not be exposed") +} + +var removedMembers = { + "SVGElement": [ + "getPresentationAttribute", + "xmlbase", + "xmllang", + "xmlspace" + ], + "SVGGraphicsElement": [ + "getTransformToElement", + "hasExtension", + "requiredFeatures" + ], + "SVGSVGElement": [ + "currentView", + "useCurrentView", + "viewport" + ] +} +for (var name in removedMembers) { + for (var member of removedMembers[name]) { + test(function() { + assert_false(member in window[name].prototype) + }, name + ".prototype." + member + " must be removed") + } +} + +var movedPathMembers = [ + "getPointAtLength", + "getTotalLength", + "pathLength" +] +for (var member of movedPathMembers) { + test(function() { + assert_false(SVGPathElement.prototype.hasOwnProperty(member)) + assert_true(SVGGeometryElement.prototype.hasOwnProperty(member)) + }, "SVGPathElement.prototype." + member + " must be moved to SVGGeometryElement.prototype") +} +</script> diff --git a/testing/web-platform/tests/svg/import/animate-dom-01-f-manual.svg b/testing/web-platform/tests/svg/import/animate-dom-01-f-manual.svg new file mode 100644 index 000000000..663a07faf --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-dom-01-f-manual.svg @@ -0,0 +1,190 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="DAS" author="CM" status="accepted" + version="$Revision: 1.11 $" testname="$RCSfile: animate-dom-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#InterfaceSVGAnimationElement"> + <p> + This tests the return value required for the + SVGAnimationElement.getStartTime() method, as described in + section 19.5 DOM Interfaces. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + After the loading the document, some animations that have no + visible effect will run. The text "Test running..." will + appear in the bottom right corner until the test has + completed. (This takes 2.5s.) + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if all seven rectangles are green once the animations + have stopped running (i.e., 2.5s after the document has loaded.) + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-dom-01-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text x='30' y='30'>Testing SVGAnimationElement.getStartTime()</text> + + <text x='340' y='340' display='none'>Test running... + <set attributeName='display' to='inline' begin='0s' dur='2.5s'/> + </text> + + <g id='g' display='none'/> + + <animate id='a1' attributeName='display' values='inline; inline' + calcMode='discrete' begin='1s' dur='1s'/> + <animate id='a2' attributeName='display' values='inline; inline' + calcMode='discrete' begin='1s' dur='1s' fill='freeze'/> + <animate id='a3' attributeName='display' values='inline; inline' + calcMode='discrete' begin='indefinite' dur='1s'/> + <animate id='a4' attributeName='display' values='inline; inline' + calcMode='discrete' begin='indefinite; 100s; g.click; 1s; indefinite' dur='1s'/> + <animate id='a5' attributeName='display' values='inline; inline' + calcMode='discrete' begin='100s; 1s' dur='1s'/> + <animate id='a6dep' attributeName='display' values='inline; inline' + calcMode='discrete' begin='5s' dur='1s'/> + <animate id='a6' attributeName='display' values='inline; inline' + calcMode='discrete' begin='a6dep.begin+2s' dur='1s'/> + + <animate attributeName='display' values='inline; inline' + calcMode='discrete' begin='0.5s' dur='1s' onbegin='before()'/> + <animate attributeName='display' values='inline; inline' + calcMode='discrete' begin='1.5s' dur='1s' onbegin='during()'/> + <animate attributeName='display' values='inline; inline' + calcMode='discrete' begin='2.5s' dur='1s' onbegin='after()'/> + + <g transform='translate(30,-10)'> + <rect id='r1' y='50' width='25' height='25'/> + <rect id='r2' y='80' width='25' height='25'/> + <rect id='r3' y='110' width='25' height='25'/> + <rect id='r4' y='140' width='25' height='25'/> + <rect id='r5' y='170' width='25' height='25'/> + <rect id='r6' y='200' width='25' height='25'/> + <rect id='r7' y='230' width='25' height='25'/> + <rect id='r8' y='260' width='25' height='25'/> + </g> + + <g font-size='14' transform='translate(70,-15)'> + <text y='72'>Called before a lone interval starts</text> + <text y='102'>Called on an animation with no intervals</text> + <text y='132'>Called during an interval</text> + <text y='162'>Called after a lone interval ends, fill="remove"</text> + <text y='192'>Called after a lone interval ends, fill="freeze"</text> + <text y='222'>Called with multiple begin values</text> + <text y='252'>Called with multiple begin values including "indefinite"</text> + <text y='282'>Called with syncbase begin value</text> + </g> + <script><![CDATA[ + var i, ids = 'a1 a2 a3 a4 a5 a6 r1 r2 r3 r4 r5 r6 r7 r8'.split(' '); + for (i in ids) { + this[ids[i]] = document.getElementById(ids[i]); + } + + function before() { + try { + if (a1.getStartTime() == 1) { + r1.setAttributeNS(null, 'fill', 'lime'); + } + } catch (e) { + r1.setAttributeNS(null, 'fill', 'red'); + } + + r2.setAttributeNS(null, 'fill', 'red'); + try { + a3.getStartTime(); + } catch (e) { + if (e.code == DOMException.INVALID_STATE_ERR) { + r2.setAttributeNS(null, 'fill', 'lime'); + } + } + + try { + if (a4.getStartTime() == 1) { + r6.setAttributeNS(null, 'fill', 'lime'); + } + } catch (e) { + r6.setAttributeNS(null, 'fill', 'red'); + } + + try { + if (a5.getStartTime() == 1) { + r7.setAttributeNS(null, 'fill', 'lime'); + } + } catch (e) { + r7.setAttributeNS(null, 'fill', 'red'); + } + + try { + if (a6.getStartTime() == 7) { + r8.setAttributeNS(null, 'fill', 'lime'); + } + } catch (e) { + r8.setAttributeNS(null, 'fill', 'red'); + } + } + + function during() { + try { + if (a1.getStartTime() == 1) { + r3.setAttributeNS(null, 'fill', 'lime'); + } + } catch (e) { + r3.setAttributeNS(null, 'fill', 'red'); + } + } + + function after() { + r4.setAttributeNS(null, 'fill', 'red'); + try { + a1.getStartTime(); + } catch (e) { + if (e.code == DOMException.INVALID_STATE_ERR) { + r4.setAttributeNS(null, 'fill', 'lime'); + } + } + + r5.setAttributeNS(null, 'fill', 'red'); + try { + a2.getStartTime(); + } catch (e) { + if (e.code == DOMException.INVALID_STATE_ERR) { + r5.setAttributeNS(null, 'fill', 'lime'); + } + } + } + ]]></script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.11 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-dom-02-f-manual.svg b/testing/web-platform/tests/svg/import/animate-dom-02-f-manual.svg new file mode 100644 index 000000000..c9bf32719 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-dom-02-f-manual.svg @@ -0,0 +1,83 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="DAS" author="CM" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: animate-dom-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#InterfaceSVGAnimationElement"> + <p> + This tests that the methods on the ElementTimeControl + interface return the undefined value, since the IDL + operations are declared to return void. + </p> + <p> + After the loading the document, a rectangle is shown + indicating whether all four methods from the ElementTimeControl + interface returned undefined when invoked. The rectangle + is black if the test did not run, red if the test failed + and green if the test succeeded. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the rectangle is green. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-dom-02-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text x='10' y='30'>Testing ElementTimeControl method return values</text> + + <rect id='r' x='10' y='50' width='50' height='50'/> + <animate id='a' attributeName='display' values='inline; inline' dur='10s'/> + <animate attributeName='display' values='inline; inline' onbegin='f()' dur='10s'/> + + <script><![CDATA[ + function f() { + var a = document.getElementById('a'); + var b = false; + try { + b = typeof a.beginElement() == 'undefined' + && typeof a.beginElementAt(100) == 'undefined' + && typeof a.endElement() == 'undefined' + && typeof a.endElementAt(200) == 'undefined'; + } catch (e) { + } + document.getElementById('r').setAttribute('fill', b ? 'green' : 'red'); + } + ]]></script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-02-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-02-t-manual.svg new file mode 100644 index 000000000..0dc004570 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-02-t-manual.svg @@ -0,0 +1,122 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: animate-elem-02-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test 'additive' and 'accumulate' attributes. + </p> + <p> + The four pictures show the effect with the four possible combinations of + 'additive' (either 'replace' or 'sum') and 'accumulate' (either 'none' or 'sum'). + Because two animations are animating the height, the effects of 'additive' and + 'accumulate' are sometimes different than when there is only a single animation. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test has passed if the four green rectangles each animate their height according to the following:</p> + <p>The leftmost rect:</p> + <ul> + <li>when the animation starts the height of the green rect should make it align with the bottommost red indicator line</li> + <li>after two seconds the height should jump to be 10% of the height of the gray rect it overlaps</li> + <li>after four seconds the height should jump to make the green rect align with the bottommost red indicator line</li> + <li>after six seconds the height should jump to its final position, 10% of the height of the gray rect</li> + </ul> + <p>The next to leftmost rect:</p> + <ul> + <li>when the animation starts the height of the green rect should be 110% of the height of the gray rect</li> + <li>after two seconds the height should jump to be 20% of the height of the gray rect</li> + <li>after four seconds the height should jump to be 110% of the height of the gray rect</li> + <li>after six seconds the height should jump to its final position, 20% of the height of the gray rect</li> + </ul> + <p>The next to rightmost rect:</p> + <ul> + <li>when the animation starts the height of the green rect should make it align with the bottommost red indicator line</li> + <li>after two seconds the height should jump to be 10% of the height of the gray rect</li> + <li>after four seconds the height should jump to be 110% of the height of the gray rect</li> + <li>after six seconds the height should jump to its final position, 20% of the height of the gray rect</li> + </ul> + <p>The rightmost rect:</p> + <ul> + <li>when the animation starts the height of the green rect should be 110% of the height of the gray rect</li> + <li>after two seconds the height should jump to be 20% of the height of the gray rect</li> + <li>after four seconds the height should jump to be 120% of the height of the gray rect</li> + <li>after six seconds the height should jump to its final position, 30% of the height of the gray rect</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-02-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-family="Arial" font-size="30"> + <g transform="translate(0, 0)"> + <rect x="60" y="20" width="50" height="200" fill="#dfdfdf" stroke="#dfdfdf" stroke-width="4"/> + <line x1="40" x2="100" y1="220" y2="220" fill="none" stroke="#880000" stroke-width="4"/> + <line x1="40" x2="100" y1="120" y2="120" fill="none" stroke="#880000" stroke-width="4"/> + <rect x="60" y="20" width="50" height="20" fill="#0f5" stroke="#085" stroke-width="4"> + <animate id="an5" attributeName="height" calcMode="discrete" additive="replace" accumulate="none" repeatCount="2" from="200" to="20" begin="0s" dur="4s" fill="freeze"/> + </rect> + <text x="30" y="285" fill="navy">anim.5</text> + </g> + <g transform="translate(110, 0)"> + <rect x="60" y="20" width="50" height="200" fill="#dfdfdf" stroke="#dfdfdf" stroke-width="4"/> + <line x1="40" x2="100" y1="220" y2="220" fill="none" stroke="#880000" stroke-width="4"/> + <line x1="40" x2="100" y1="120" y2="120" fill="none" stroke="#880000" stroke-width="4"/> + <rect x="60" y="20" width="50" height="20" fill="#0f5" stroke="#085" stroke-width="4"> + <animate id="an6" attributeName="height" calcMode="discrete" additive="sum" accumulate="none" repeatCount="2" from="200" to="20" begin="0s" dur="4s" fill="freeze"/> + </rect> + <text x="30" y="285" fill="navy">anim.6</text> + </g> + <g transform="translate(220, 0)"> + <rect x="60" y="20" width="50" height="200" fill="#dfdfdf" stroke="#dfdfdf" stroke-width="4"/> + <line x1="40" x2="100" y1="220" y2="220" fill="none" stroke="#880000" stroke-width="4"/> + <line x1="40" x2="100" y1="120" y2="120" fill="none" stroke="#880000" stroke-width="4"/> + <rect x="60" y="20" width="50" height="20" fill="#0f5" stroke="#085" stroke-width="4"> + <animate id="an7" attributeName="height" calcMode="discrete" additive="replace" accumulate="sum" repeatCount="2" from="200" to="20" begin="0s" dur="4s" fill="freeze"/> + </rect> + <text x="30" y="285" fill="navy">anim.7</text> + </g> + <g transform="translate(330, 0)"> + <rect x="60" y="20" width="50" height="200" fill="#dfdfdf" stroke="#dfdfdf" stroke-width="4"/> + <line x1="40" x2="100" y1="220" y2="220" fill="none" stroke="#880000" stroke-width="4"/> + <line x1="40" x2="100" y1="120" y2="120" fill="none" stroke="#880000" stroke-width="4"/> + <rect x="60" y="20" width="50" height="20" fill="#0f5" stroke="#085" stroke-width="4"> + <animate id="an8" attributeName="height" calcMode="discrete" additive="sum" accumulate="sum" repeatCount="2" from="200" to="20" begin="0s" dur="4s" fill="freeze"/> + </rect> + <text x="30" y="285" fill="navy">anim.8</text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-03-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-03-t-manual.svg new file mode 100644 index 000000000..2c28362de --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-03-t-manual.svg @@ -0,0 +1,99 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: animate-elem-03-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test inheritance of animated properties. + </p> + <p> + Three colored text strings appear. All three are inside of the same + 'g' element. The 'g' element has its 'font-size' animated from 30 to + 40, and its 'fill' from #00f (blue) to #070 (green). + </p> + <p> + The first colored 'text' element has the font-size set, so the + animation of the parent 'g' only affects the fill color. The second + has the fill set and font-size set, so no inherited values are + used. The font-size and fill color stay constant. The third colored + 'text' element has neither of these properties specified and thus + inherits both animated values - the fill color changes and the text + grows in size. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if: + </p> + <ul> + <li>the topmost line shows the text "Sample 123" that animates its fill-color smoothly from blue to green over the course of six seconds</li> + <li>the middle line shows the text "Sample 123" in a larger font-size than the first line, in blue fill-color that doesn't animate</li> + <li>the bottommost line shows the text "Sample 123" in the same font-size as the topmost line, then smoothly animating the font-size + to be larger than the middle line over the course of six seconds. At the same time the fill-color is smoothly animated from blue to green</li> + <li>after six seconds the rendered result matches the reference image</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-03-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + <font id="MyDecFont" horiz-adv-x="466"> + <font-face font-family="MyDecFont"/> + <missing-glyph horiz-adv-x="233" d="M 50 0 L50 700 200 700 200 0 z"/> + <glyph unicode=" " glyph-name="space" horiz-adv-x="233"/> + <glyph unicode="1" glyph-name="one" horiz-adv-x="558" d="M458 716L100 534V428L357 552V97H241V380L140 328V0H458V716Z"/> + <glyph unicode="2" glyph-name="two" horiz-adv-x="585" d="M69 509Q82 523 102 541T147 575T203 603T268 614Q311 614 342 599T392 560T421 505T430 443Q430 420 423 398T405 352L343 201H444L492 309Q508 345 519 379T531 448Q531 504 511 552T454 635T369 691T262 711Q231 711 204 704T152 684T106 655T69 623V509ZM535 97H187L309 422Q316 441 315 457T306 483T287 500T265 506Q261 506 254 505T239 499T224 485T211 461L50 0H535V97Z"/> + <glyph unicode="3" glyph-name="three" horiz-adv-x="542" d="M58 553Q109 588 148 601T220 614Q255 614 282 604T328 575T356 535T366 488Q366 475 364 460T355 429T336 397T302 368Q311 363 325 353T352 326T376 286T386 232Q386 203 376 177T345 130T295 98T227 86Q179 86 134 104T50 153V45Q59 38 74 29T111 10T163 -5T231 -11Q296 -11 345 8T426 58T475 131T492 218Q492 251 486 276T469 320T446 354T421 378Q438 396 454 425T470 503Q470 546 454 584T406 650T332 695T233 711Q179 711 137 696T58 655V553ZM156 255Q156 + 229 173 212T217 194Q243 194 260 211T278 255Q278 281 261 298T217 316Q191 316 174 299T156 255ZM161 467Q161 444 177 428T216 412Q225 412 234 415T252 425T265 442T271 467Q271 491 256 506T216 522Q202 522 192 517T174 503T164 486T161 467Z"/> + <glyph unicode="S" glyph-name="S" horiz-adv-x="629" d="M523 658Q479 681 426 696T317 711Q251 711 200 690T113 634T59 551T40 452Q40 404 59 356T114 270T198 210T304 194Q310 195 319 197T336 204T351 219T357 246Q357 261 351 270T337 285T320 291T305 294Q251 300 220 319T172 363T151 411T146 454Q146 478 154 506T183 558T237 598T322 614Q375 614 426 598T523 548V658ZM96 42Q140 19 193 4T302 -11Q368 -11 419 10T506 66T560 149T579 248Q579 296 560 344T505 431T421 490T315 506Q309 505 300 503T282 496T268 480T262 + 454Q262 439 268 430T282 415T299 409T314 406Q368 399 399 380T447 336T468 288T473 246Q473 222 465 194T436 142T382 102T297 86Q244 86 193 102T96 152V42Z"/> + <glyph unicode="a" glyph-name="a" horiz-adv-x="578" d="M450 0H548V198Q548 288 522 344T458 433T375 477T292 489Q240 489 194 470T114 418T60 339T40 240Q40 180 63 134T122 55T202 6T291 -11Q311 -11 325 -9T352 -1V96Q341 89 331 86T305 83Q265 83 234 96T182 132T149 183T138 242Q138 275 150 303T183 351T232 383T294 395Q306 395 332 391T384 368T430 311T450 203V0ZM236 239Q236 215 253 198T294 181Q318 181 335 198T352 239Q352 263 335 280T294 297Q270 297 253 280T236 239Z"/> + <glyph unicode="m" glyph-name="m" horiz-adv-x="774" d="M40 0H138V231Q138 280 150 312T181 362T223 388T269 395Q294 395 314 388T349 370T374 346T392 318Q407 353 440 374T515 395Q531 395 553 390T596 368T631 319T646 231V0H744V231Q744 248 743 273T735 327T715 385T678 437T619 474T532 489Q504 489 482 484T443 470T412 451T390 431Q358 464 321 476T252 489Q222 489 185 481T116 445T62 367T40 231V0ZM242 0H542V246Q542 275 526 286T493 297Q473 297 459 283T444 246V94H340V246Q340 269 326 283T291 297Q275 + 297 259 286T242 246V0Z"/> + <glyph unicode="p" glyph-name="p" horiz-adv-x="552" d="M40 -184H138V192H267Q284 192 300 204T316 239Q316 259 303 272T267 286H40V-184ZM40 384H261Q297 384 325 372T373 340T403 294T414 238Q414 209 403 183T373 137T326 106T264 94H236V0H264Q318 0 363 18T442 69T493 144T512 238Q512 288 494 332T442 408T363 459T263 478H40V384Z"/> + <glyph unicode="l" glyph-name="l" horiz-adv-x="380" d="M340 662H40V0H340V94H138V568H242V192H340V662Z"/> + <glyph unicode="e" glyph-name="e" horiz-adv-x="530" d="M500 192V227Q500 296 480 346T428 427T354 474T271 489Q221 489 178 470T101 418T49 340T30 243Q30 204 43 161T87 83T171 24T303 0H482V94H298Q250 94 217 108T165 144T137 192T128 244Q128 276 139 303T171 351T218 383T275 395Q301 395 322 386T360 362T386 327T402 286H277Q253 286 240 272T226 239Q226 223 237 208T277 192H500Z"/> + </font> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-family="MyDecFont" fill="#00f" stroke="none"> + <g id="AnimationTarget"> + <text x="20" y="80" font-size="40">Sample 123</text> + <text x="20" y="155" font-size="60" fill="#00f">Sample 123</text> + <text x="20" y="250">Sample 123</text> + <animate attributeName="font-size" attributeType="CSS" begin="0s" dur="6s" fill="freeze" from="40" to="80"/> + <animate attributeName="fill" attributeType="CSS" begin="0s" dur="6s" fill="freeze" from="#00f" to="#070"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-04-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-04-t-manual.svg new file mode 100644 index 000000000..343642a1e --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-04-t-manual.svg @@ -0,0 +1,71 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: animate-elem-04-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test different ways of defining a motion path. + </p> + <p> + An animation moves a triangle along a path. Reference rectangles, lines and text + are provided to help show what the correct behavior is. + </p> + <p> + This animation uses the 'from' and 'to' attributes to define the motion path. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if a triangle is animated smoothly along the path indicated by the black line, starting at the leftmost pink rectangle and stopping after 3 seconds on top of the rightmost pink rectangle. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-04-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-size="36"> + <text x="48" y="48">Test a motion path</text> + <text x="48" y="95">'from'/'to' attribute.</text> + <path d="M90,258 L390,180" fill="none" stroke="black" stroke-width="6"/> + <rect x="60" y="198" width="60" height="60" fill="#FFCCCC" stroke="black" stroke-width="6"/> + <text x="90" y="300" text-anchor="middle">0 sec.</text> + <rect x="360" y="120" width="60" height="60" fill="#FFCCCC" stroke="black" stroke-width="6"/> + <text x="390" y="230" text-anchor="middle">3+ sec.</text> + <path d="M-30,0 L0,-60 L30,0 z" fill="blue" stroke="green" stroke-width="6"> + <animateMotion from="90,258" to="390,180" begin="0s" dur="3s" fill="freeze"/> + </path> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-05-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-05-t-manual.svg new file mode 100644 index 000000000..3e1be14f3 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-05-t-manual.svg @@ -0,0 +1,77 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: animate-elem-05-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test different ways of defining a motion path. + </p> + <p> + An animation moves a triangle along a path. Reference rectangles, lines and text + are provided to help show what the correct behavior is. + </p> + <p> + This animation uses the 'values' attribute to define the motion path, with a linear calcMode. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if a triangle is animated smoothly along the path indicated by the black line, and + it passes over the pink rectangles at the indicated times. + When the animation starts the triangle should be positioned on top of the leftmost pink rectangle, after + 3 seconds it should reach the middle pink rectangle, and after 6 seconds it should be positioned on top + of the rightmost pink rectangle where it should stop. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-05-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-size="36"> + <text x="48" y="48">Test a motion path</text> + <text x="48" y="95">'values' attribute.</text> + <path d="M90,258 L240,180 L390,180" fill="none" stroke="black" stroke-width="6"/> + <rect x="60" y="198" width="60" height="60" fill="#FFCCCC" stroke="black" stroke-width="6"/> + <text x="90" y="300" text-anchor="middle">0 sec.</text> + <rect x="210" y="120" width="60" height="60" fill="#FFCCCC" stroke="black" stroke-width="6"/> + <text x="240" y="222" text-anchor="middle">3+</text> + <rect x="360" y="120" width="60" height="60" fill="#FFCCCC" stroke="black" stroke-width="6"/> + <text x="390" y="222" text-anchor="middle">6+</text> + <path d="M-30,0 L0,-60 L30,0 z" fill="blue" stroke="green" stroke-width="6"> + <animateMotion values="90,258;240,180;390,180" begin="0s" dur="6s" calcMode="linear" fill="freeze"/> + </path> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-06-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-06-t-manual.svg new file mode 100644 index 000000000..c95dc1f20 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-06-t-manual.svg @@ -0,0 +1,71 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: animate-elem-06-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test different ways of defining a motion path. + </p> + <p> + An animation moves a triangle along a path. Reference rectangles, lines and text + are provided to help show what the correct behavior is. + </p> + <p> + This animation uses the 'path' attribute to define the motion path. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the triangle is animated along the black curve over the course of 6 seconds. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-06-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-size="36"> + <text x="48" y="48">Test a motion path</text> + <text x="48" y="95">'path' attribute.</text> + <path d="M90,258 C90,258 216,120 390,198" fill="none" stroke="black" stroke-width="6"/> + <rect x="60" y="198" width="60" height="60" fill="#FFCCCC" stroke="black" stroke-width="6"/> + <text x="90" y="300" text-anchor="middle">0 sec.</text> + <rect x="360" y="138" width="60" height="60" fill="#FFCCCC" stroke="black" stroke-width="6"/> + <text x="390" y="240" text-anchor="middle">6+ sec.</text> + <path d="M-30,0 L0,-60 L30,0 z" fill="blue" stroke="green" stroke-width="6"> + <animateMotion path="M90,258 C90,258 216,120 390,198" begin="0s" dur="6s" calcMode="linear" fill="freeze"/> + </path> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-07-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-07-t-manual.svg new file mode 100644 index 000000000..b59f8fda8 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-07-t-manual.svg @@ -0,0 +1,73 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: animate-elem-07-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test different ways of defining a motion path. + </p> + <p> + An animation moves a triangle along a path. Reference rectangles, lines and text + are provided to help show what the correct behavior is. + </p> + <p> + This animation uses the 'mpath' sub-element to define the motion path. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the triangle is animated along the black curve over the course of 6 seconds. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-07-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-size="36"> + <text x="48" y="48">Test a motion path</text> + <text x="48" y="95">'mpath' element.</text> + <path id="mpathRef" d="M90,258 C90,258 216,120 390,198" fill="none" stroke="black" stroke-width="6"/> + <rect x="60" y="198" width="60" height="60" fill="#FFCCCC" stroke="black" stroke-width="6"/> + <text x="90" y="300" text-anchor="middle">0 sec.</text> + <rect x="360" y="138" width="60" height="60" fill="#FFCCCC" stroke="black" stroke-width="6"/> + <text x="390" y="240" text-anchor="middle">6+ sec.</text> + <path d="M-30,0 L0,-60 L30,0 z" fill="blue" stroke="green" stroke-width="6"> + <animateMotion begin="0s" dur="6s" calcMode="linear" fill="freeze"> + <mpath xlink:href="#mpathRef"/> + </animateMotion> + </path> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-08-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-08-t-manual.svg new file mode 100644 index 000000000..1b28fcbb5 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-08-t-manual.svg @@ -0,0 +1,83 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: animate-elem-08-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test rotate='auto' and rotate='auto-reverse'. + </p> + <p> + Two animations have been defined that move a triangle along a path. The first animation specifies rotate='auto', which causes + the object to be rotated along the curve of the path. The second animation specifies rotate='auto-reverse', which causes the + object to be flipped and then rotated along the curve of the path. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if: + </p> + <ul> + <li>each of the triangles are animated along the respective black curves over the course of 6 seconds</li> + <li>the leftmost triangle points upwards and the rightmost triangle points downwards</li> + <li>the triangles are rotated during the animation so that they are always perpendicular to the tangential vector at the current position on the respective curve</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-08-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-size="14" text-anchor="middle" x="225" y="25">Test rotate='auto' and rotate='auto-reverse'</text> + <g font-size="12" text-anchor="middle"> + <path d="M25,225 C25,175 125,150 175,200" fill="none" stroke="black" stroke-width="2"/> + <rect x="10" y="195" width="30" height="30" fill="#FFCCCC" stroke="black" stroke-width="4"/> + <text x="25" y="240">0 sec.</text> + <rect x="160" y="170" width="30" height="30" fill="#FFCCCC" stroke="black" stroke-width="4"/> + <text x="175" y="215">6+ sec.</text> + <path d="M-15,0 L0,-30 L15,0 z" fill="blue" stroke="green" stroke-width="2"> + <animateMotion path="M25,225 C25,175 125,150 175,200" rotate="auto" begin="0s" dur="6s" calcMode="linear" fill="freeze"/> + </path> + <text x="100" y="260" stroke="none" font-size="14">rotate='auto'</text> + <path d="M275,225 C275,175 375,150 425,200" fill="none" stroke="black" stroke-width="2"/> + <rect x="260" y="195" width="30" height="30" fill="#FFCCCC" stroke="black" stroke-width="4"/> + <text x="275" y="240">0 sec.</text> + <rect x="410" y="170" width="30" height="30" fill="#FFCCCC" stroke="black" stroke-width="4"/> + <text x="425" y="215">6+ sec.</text> + <path d="M-15,0 L0,-30 L15,0 z" fill="blue" stroke="green" stroke-width="2"> + <animateMotion path="M275,225 C275,175 375,150 425,200" rotate="auto-reverse" begin="0s" dur="6s" calcMode="linear" fill="freeze"/> + </path> + <text x="350" y="260" stroke="none" font-size="14">rotate='auto-reverse'</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-09-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-09-t-manual.svg new file mode 100644 index 000000000..20f86c906 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-09-t-manual.svg @@ -0,0 +1,97 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-09-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test possible values for 'calcMode="discrete"'. + </p> + <p> + Two animations have been defined. For each animation, ruler lines and text are provided to help show what the correct behavior is. + The black text and ruler lines help show the sizes and movement of the rectangles over time. + </p> + <p> + The discrete animations should show stair-stepping animations, with quantum-level jumps every two seconds in these tests. The linear + animations change constantly with each keyframe to keyframe section, with the result that the change is faster when there is a larger + change within a given amount of time. The paced animations change constantly over the entire animation, regardless of the values at + particular keyframes. For calcMode='spline' in this test case, the initial rate of change is defined to be the same as linear, but the + last jump has an ease-in/ease-out effect where the change is slower at the start and end but faster in the middle. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the two orange rects are animated so that the bottom part of each rectangle is at the position + indicated by the ruler lines at the particular time noted next to each ruler line. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-09-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g xml:space="preserve" font-family="Arial" font-size="30"> + <g transform="translate(20,50)"> + <text x="0" y="203">0-2 sec.</text> + <text x="0" y="170">2-4 sec. </text> + <text x="0" y="114">4-6 sec. </text> + <text x="3" y="3">6+ sec. </text> + <g stroke="#800" stroke-width="4"> + <line x1="120" y1="200" x2="170" y2="200"/> + <line x1="120" y1="167" x2="170" y2="167"/> + <line x1="120" y1="111" x2="170" y2="111"/> + <line x1="120" y1="0" x2="170" y2="0"/> + </g> + <rect x="140" y="-10" width="60" height="210" fill="#FFAA44" stroke="#FF00FF" stroke-width="4"> + <animate attributeName="height" calcMode="discrete" values="210;177;121;10" begin="0s" dur="8s" fill="freeze"/> + </rect> + </g> + + <g transform="translate(250,50)"> + <text x="0" y="203">0-2 sec.</text> + <text x="0" y="170">2-4 sec. </text> + <text x="0" y="114">4-6 sec. </text> + <text x="3" y="3">6+ sec. </text> + <g stroke="#800" stroke-width="4"> + <line x1="120" y1="200" x2="170" y2="200"/> + <line x1="120" y1="167" x2="170" y2="167"/> + <line x1="120" y1="111" x2="170" y2="111"/> + <line x1="120" y1="0" x2="170" y2="0"/> + </g> + <rect x="140" y="-10" width="60" height="10" fill="#FFAA44" stroke="#FF00FF" stroke-width="4"> + <animateMotion calcMode="discrete" values="0,200; 0,167; 0,111; 0,0" begin="0s" dur="8s" fill="freeze"/> + </rect> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-10-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-10-t-manual.svg new file mode 100644 index 000000000..23b1502ea --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-10-t-manual.svg @@ -0,0 +1,96 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-10-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test possible values for 'calcMode="linear"'. + </p> + <p> + Two animations have been defined. For each animation, ruler lines and text are provided to help show what the correct behavior is. + The black text and ruler lines help show the sizes and movement of the rectangles over time. + </p> + <p> + The linear animations change constantly with each keyframe to keyframe section, with the result that the change is faster when there is a larger + change within a given amount of time. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the two orange rects are animated so that the bottom part of each rectangle is at the position + indicated by the ruler lines at the particular time noted next to each ruler line. Between two noted times the + bottom part of each rect must be between the two corresponding ruler lines. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-10-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-family="Arial" font-size="30"> + <g transform="translate(20,50)"> + <text x="0" y="203">at 0 sec.</text> + <text x="0" y="170">at 3 sec. </text> + <text x="0" y="114">at 6 sec. </text> + <text x="3" y="3">9+ sec. </text> + <g stroke="#800" stroke-width="4"> + <line x1="120" y1="200" x2="170" y2="200"/> + <line x1="120" y1="167" x2="170" y2="167"/> + <line x1="120" y1="111" x2="170" y2="111"/> + <line x1="120" y1="0" x2="170" y2="0"/> + </g> + <rect x="140" y="-10" width="60" height="210" fill="#FFAA44" stroke="#FF00FF" stroke-width="4"> + <!-- Should use default of calcMode="linear" --> + <animate attributeName="height" values="210;177;121;10" begin="0s" dur="9s" fill="freeze"/> + </rect> + </g> + + <g transform="translate(250,50)"> + <text x="0" y="203">at 0 sec.</text> + <text x="0" y="170">at 3 sec. </text> + <text x="0" y="114">at 6 sec. </text> + <text x="3" y="3">9+ sec. </text> + <g stroke="#800" stroke-width="4"> + <line x1="120" y1="200" x2="170" y2="200"/> + <line x1="120" y1="167" x2="170" y2="167"/> + <line x1="120" y1="111" x2="170" y2="111"/> + <line x1="120" y1="0" x2="170" y2="0"/> + </g> + <rect x="140" y="-10" width="60" height="10" fill="#FFAA44" stroke="#FF00FF" stroke-width="4"> + <animateMotion calcMode="linear" values="0,200; 0,167; 0,111; 0,0" begin="0s" dur="9s" fill="freeze"/> + </rect> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-11-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-11-t-manual.svg new file mode 100644 index 000000000..001fb7d32 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-11-t-manual.svg @@ -0,0 +1,93 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-11-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test possible values for 'calcMode="paced"'. + </p> + <p> + Two animations have been defined. For each animation, ruler lines and text are provided to help show what the correct behavior is. + The black text and ruler lines help show the sizes and movement of the rectangles over time. + </p> + <p> + The paced animations change constantly over the entire animation, regardless of the values at + particular keyframes. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the two orange rects are animated so that the bottom part of each rectangle is at the position indicated by the ruler lines at the particular time noted next to each ruler line. Between two noted times the bottom part of each rect must be between the two corresponding ruler lines. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-11-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-family="Arial" font-size="30"> + <g transform="translate(20,50)"> + <text x="0" y="203">at 0 sec.</text> + <text x="0" y="136.33">at 3 sec. </text> + <text x="0" y="69.66">at 6 sec. </text> + <text x="3" y="3">9+ sec. </text> + <g stroke="#800" stroke-width="4"> + <line x1="120" y1="200" x2="170" y2="200"/> + <line x1="120" y1="133.33" x2="170" y2="133.33"/> + <line x1="120" y1="66.66" x2="170" y2="66.66"/> + <line x1="120" y1="0" x2="170" y2="0"/> + </g> + <rect x="140" y="-10" width="60" height="210" fill="#FFAA44" stroke="#FF00FF" stroke-width="4"> + <animate attributeName="height" calcMode="paced" values="210;177;121;10" begin="0s" dur="9s" fill="freeze"/> + </rect> + </g> + + <g transform="translate(250,50)"> + <text x="0" y="203">at 0 sec.</text> + <text x="0" y="136.33">at 3 sec. </text> + <text x="0" y="69.66">at 6 sec. </text> + <text x="3" y="3">9+ sec. </text> + <g stroke="#800" stroke-width="4"> + <line x1="120" y1="200" x2="170" y2="200"/> + <line x1="120" y1="133.33" x2="170" y2="133.33"/> + <line x1="120" y1="66.66" x2="170" y2="66.66"/> + <line x1="120" y1="0" x2="170" y2="0"/> + </g> + <rect x="140" y="-10" width="60" height="10" fill="#FFAA44" stroke="#FF00FF" stroke-width="4"> + <animateMotion calcMode="paced" values="0,200; 0,167; 0,111; 0,0" begin="0s" dur="9s" fill="freeze"/> + </rect> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-12-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-12-t-manual.svg new file mode 100644 index 000000000..ff0cc495a --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-12-t-manual.svg @@ -0,0 +1,93 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-12-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test possible values for 'calcMode="spline"'. + </p> + <p> + Two animations have been defined. For each animation, ruler lines and text are provided to help show what the correct behavior is. + The black text and ruler lines help show the sizes and movement of the rectangles over time. + </p> + <p> + For calcMode='spline' in this test case, the initial rate of change is defined to be the same as linear, but the + last jump has an ease-in/ease-out effect where the change is slower at the start and end but faster in the middle. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the two orange rects are animated so that the bottom part of each rectangle is at the position indicated by the ruler lines at the particular time noted next to each ruler line. Between two noted times the bottom part of each rect must be between the two corresponding ruler lines. The bottom of the left rectangles and the right rectangle must always be the same throughout the animation. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-12-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-family="Arial" font-size="30"> + <g transform="translate(20,50)"> + <text x="0" y="203">at 0 sec.</text> + <text x="0" y="170">at 3 sec. </text> + <text x="0" y="114">at 6 sec. </text> + <text x="3" y="3">9+ sec. </text> + <g stroke="#800" stroke-width="4"> + <line x1="120" y1="200" x2="170" y2="200"/> + <line x1="120" y1="167" x2="170" y2="167"/> + <line x1="120" y1="111" x2="170" y2="111"/> + <line x1="120" y1="0" x2="170" y2="0"/> + </g> + <rect x="140" y="-10" width="60" height="210" fill="#FFAA44" stroke="#FF00FF" stroke-width="4"> + <animate attributeName="height" calcMode="spline" keySplines="0,0,1,1;0,0,1,1;.75,0,0,.75" values="210;177;121;10" begin="0s" dur="9s" fill="freeze"/> + </rect> + </g> + + <g transform="translate(250,50)"> + <text x="0" y="203">at 0 sec.</text> + <text x="0" y="170">at 3 sec. </text> + <text x="0" y="114">at 6 sec. </text> + <text x="3" y="3">9+ sec. </text> + <g stroke="#800" stroke-width="4"> + <line x1="120" y1="200" x2="170" y2="200"/> + <line x1="120" y1="167" x2="170" y2="167"/> + <line x1="120" y1="111" x2="170" y2="111"/> + <line x1="120" y1="0" x2="170" y2="0"/> + </g> + <rect x="140" y="-10" width="60" height="10" fill="#FFAA44" stroke="#FF00FF" stroke-width="4"> + <animateMotion calcMode="spline" keySplines="0,0,1,1;0,0,1,1;.75,0,0,.75" values="0,200; 0,167; 0,111; 0,0" begin="0s" dur="9s" fill="freeze"/> + </rect> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-13-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-13-t-manual.svg new file mode 100644 index 000000000..52c4b6fa2 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-13-t-manual.svg @@ -0,0 +1,105 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: animate-elem-13-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test 'from', 'by', 'to' and 'values'. + </p> + <p> + Six animations have been defined. All six animations define the same simultaneous behavior, but use different combinations of + attributes 'from', 'by', 'to' and 'values'. In all cases, from time 2 seconds to time 5 seconds, the rectangle should change + from a width of 30 to a width of 300. + </p> + <p> + The text on each line shows the attributes that were used for that particular animation. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The six orange rectangles should simultaneously animate their widths so that their right edges line up with the ruler lines at the indicated time. + From time 0 - 2 seconds all rectangles should have their right edges lined up with the leftmost ruler line, and at time 2 seconds the animation should + start, changing the widths of all the rectangles from 30 to 300. At time 5 seconds the animation should stop and the rectangles should all line up with + the rightmost ruler line. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-13-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-size="30"> + <line x1="190" x2="190" y1="45" y2="300" stroke="#880000" stroke-width="4"/> + <line x1="460" x2="460" y1="45" y2="300" stroke="#880000" stroke-width="4"/> + <text x="156" y="32">0-2 sec.</text> + <text x="370" y="32">5+ sec.</text> + <g> + <rect x="160" y="60" width="30" height="30" fill="#FFAA44" stroke="#FF00FF" stroke-width="4"> + <animate attributeName="width" from="30" to="300" begin="2s" dur="3s" fill="freeze"/> + </rect> + <text x="20" y="85">from to</text> + </g> + <g> + <rect x="160" y="100" width="30" height="30" fill="#FFAA44" stroke="#FF00FF" stroke-width="4"> + <animate attributeName="width" from="30" by="270" begin="2s" dur="3s" fill="freeze"/> + </rect> + <text x="20" y="125">from by</text> + </g> + <g> + <rect x="160" y="140" width="30" height="30" fill="#FFAA44" stroke="#FF00FF" stroke-width="4"> + <animate attributeName="width" by="270" begin="2s" dur="3s" fill="freeze"/> + </rect> + <text x="20" y="165">by</text> + </g> + <g> + <rect x="160" y="180" width="30" height="30" fill="#FFAA44" stroke="#FF00FF" stroke-width="4"> + <animate attributeName="width" to="300" begin="2s" dur="3s" fill="freeze"/> + </rect> + <text x="20" y="205">to</text> + </g> + <g> + <rect x="160" y="220" width="30" height="30" fill="#FFAA44" stroke="#FF00FF" stroke-width="4"> + <animate attributeName="width" values="30;300" begin="2s" dur="3s" fill="freeze"/> + </rect> + <text x="20" y="245">values</text> + </g> + <g> + <rect x="160" y="260" width="30" height="30" fill="#FFAA44" stroke="#FF00FF" stroke-width="4"> + <animate attributeName="width" values="30;120;210;300" begin="2s" dur="3s" fill="freeze"/> + </rect> + <text x="20" y="285">values</text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-14-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-14-t-manual.svg new file mode 100644 index 000000000..b85b279a5 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-14-t-manual.svg @@ -0,0 +1,78 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: animate-elem-14-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test 'calcMode'=discrete. + </p> + <p> + One animation has been defined to animate the height of a rectangle. Ruler lines and text are provided + to help show what the correct behavior is. The headline text shows the values for the 'calcMode' and 'keyTimes' attributes. The + black text and ruler lines help show the size and movement of the rectangle over time. + </p> + <p> + This test shows an animation with calcMode="discrete" (i.e., a jumping animation). + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The right edge of the blue rectangle should line up with the ruler lines at the indicated times, and should jump directly to each position with no animation in between. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-14-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-size="40" x="3" y="45">calcMode="discrete"</text> + <text font-size="40" x="3" y="100">keyTimes="0;.2;.4;.6"</text> + <g xml:space="preserve" font-size="13.5" stroke-width="3"> + <g transform="translate(150,140)"> + <text font-size="36" x="-140" y="140">Time (s):</text> + <text font-size="36" x="290" y="140">0</text> + <line x1="300" y1="0" x2="300" y2="100" fill="none" stroke="#880000"/> + <text font-size="36" x="245" y="140">2</text> + <line x1="255" y1="0" x2="255" y2="100" fill="none" stroke="#880000"/> + <text font-size="36" x="170" y="140">4</text> + <line x1="180" y1="0" x2="180" y2="100" fill="none" stroke="#880000"/> + <text font-size="36" x="20" y="140">6</text> + <line x1="30" y1="0" x2="30" y2="100" fill="none" stroke="#880000"/> + <rect x="0" y="0" width="300" height="80" fill="#44AAFF" stroke="#880088" stroke-width="4"> + <animate attributeName="width" calcMode="discrete" values="300;255;180;30" keyTimes="0;.2;.4;.6" begin="0s" dur="10s" fill="freeze"/> + </rect> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-15-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-15-t-manual.svg new file mode 100644 index 000000000..4ef4a7a96 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-15-t-manual.svg @@ -0,0 +1,79 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-15-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test 'calcMode'=paced. + </p> + <p> + One animation has been defined to animate the width of a rectangle. Ruler lines and text are provided + to help show what the correct behavior is. The headline text shows the values for the 'calcMode' and 'keyTimes' attributes. The + black text and ruler lines help show the size and movement of the rectangle over time. + </p> + <p> + This test shows calcMode="paced" for an animation that has constant velocity, thus showing how 'values' + and 'keyTimes' are ignored. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The blue rectangle should animate its width at a constant speed so that the right edge of the rectangle lines up with the ruler line at the indicated times. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-15-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-size="40" x="3" y="45">calcMode="paced"</text> + <text font-size="40" x="3" y="100">keyTimes="0;.25;.5;1"</text> + <g xml:space="preserve" font-size="13.5" stroke-width="3"> + <g transform="translate(150,140)"> + <text font-size="36" x="-140" y="140">Time (s):</text> + <text font-size="36" x="290" y="140">0</text> + <line x1="300" y1="0" x2="300" y2="100" fill="none" stroke="#880000"/> + <text font-size="36" x="230" y="140">1.5</text> + <line x1="255" y1="0" x2="255" y2="100" fill="none" stroke="#880000"/> + <text font-size="36" x="170" y="140">4</text> + <line x1="180" y1="0" x2="180" y2="100" fill="none" stroke="#880000"/> + <text font-size="36" x="20" y="140">9</text> + <line x1="30" y1="0" x2="30" y2="100" fill="none" stroke="#880000"/> + <rect x="0" y="0" width="300" height="80" fill="#44AAFF" stroke="#880088" stroke-width="4"> + <animate attributeName="width" calcMode="paced" values="300;255;180;30" keyTimes="0;.25;.5;1" begin="0s" dur="9s" fill="freeze"/> + </rect> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-17-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-17-t-manual.svg new file mode 100644 index 000000000..c9936b080 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-17-t-manual.svg @@ -0,0 +1,79 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-17-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test 'calcMode'=spline. + </p> + <p> + One animation has been defined to animate the height of a rectangle. Ruler lines and text are provided + to help show what the correct behavior is. The red text shows the values for the 'calcMode' and 'keyTimes' attributes. The + black text and ruler lines help show the size and movement of the rectangle over time. + </p> + <p> + This animation shows calcMode="spline". Between time 4 seconds and 8 seconds, the animation displays an ease-in/ease-out approach + instead of a constant linear approach which would have been the case if calcMode had been linear instead. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The blue rectangle should animate its width so that the right edge of the rectangle lines up with the ruler line at the indicated times. Between 4 and 8 seconds the animation should show an ease-in/ease-out motion (i.e. a gradual change in speed). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-17-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-size="40" x="3" y="45">calcMode="spline"</text> + <text font-size="40" x="3" y="100">keyTimes="0;.25;.5;1"</text> + <g xml:space="preserve" font-size="13.5" stroke-width="3"> + <g transform="translate(150,140)"> + <text font-size="36" x="-140" y="140">Time (s):</text> + <text font-size="36" x="290" y="140">0</text> + <line x1="300" y1="0" x2="300" y2="100" fill="none" stroke="#880000"/> + <text font-size="36" x="245" y="140">2</text> + <line x1="255" y1="0" x2="255" y2="100" fill="none" stroke="#880000"/> + <text font-size="36" x="170" y="140">4</text> + <line x1="180" y1="0" x2="180" y2="100" fill="none" stroke="#880000"/> + <text font-size="36" x="20" y="140">8</text> + <line x1="30" y1="0" x2="30" y2="100" fill="none" stroke="#880000"/> + <rect x="0" y="0" width="300" height="80" fill="#44AAFF" stroke="#880088" stroke-width="4"> + <animate attributeName="width" calcMode="spline" values="300;255;180;30" keyTimes="0;.25;.5;1" keySplines="0,0,1,1;0,0,1,1;1,0,0,1" begin="0s" dur="8s" fill="freeze"/> + </rect> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-19-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-19-t-manual.svg new file mode 100644 index 000000000..e379e92d0 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-19-t-manual.svg @@ -0,0 +1,78 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-19-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test 'calcMode'=linear. + </p> + <p> + One animation has been defined to animate the width of a rectangle. Ruler lines and text are provided + to help show what the correct behavior is. The red text shows the values for the 'calcMode' and 'keyTimes' attributes. The + black text and ruler lines help show the size and movement of the rectangle over time. + </p> + <p> + This test shows an animation with calcMode="linear". + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The blue rectangle should animate its width so that the right edge of the rectangle lines up with the ruler line at the indicated times. The rate of change will increase after each ruler line is passed. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-19-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-size="40" x="3" y="45">calcMode="linear"</text> + <text font-size="40" x="3" y="100">keyTimes="0;.5;.75;1"</text> + <g xml:space="preserve" font-size="13.5" stroke-width="3"> + <g transform="translate(150,140)"> + <text font-size="36" x="-140" y="140">Time (s):</text> + <text font-size="36" x="290" y="140">0</text> + <line x1="300" y1="0" x2="300" y2="100" fill="none" stroke="#880000"/> + <text font-size="36" x="245" y="140">4</text> + <line x1="255" y1="0" x2="255" y2="100" fill="none" stroke="#880000"/> + <text font-size="36" x="170" y="140">6</text> + <line x1="180" y1="0" x2="180" y2="100" fill="none" stroke="#880000"/> + <text font-size="36" x="20" y="140">8</text> + <line x1="30" y1="0" x2="30" y2="100" fill="none" stroke="#880000"/> + <rect x="0" y="0" width="300" height="80" fill="#44AAFF" stroke="#880088" stroke-width="4"> + <animate attributeName="width" calcMode="linear" values="300;255;180;30" keyTimes="0;.5;.75;1" begin="0s" dur="8s" fill="freeze"/> + </rect> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-20-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-20-t-manual.svg new file mode 100644 index 000000000..0301032fb --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-20-t-manual.svg @@ -0,0 +1,76 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Chris lilley" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-20-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test hyperlinking rules as they relate to resolved start times. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Click "fade in", wait 3 seconds. Click "fade out", wait 3 seconds. Click "fade in" again, wait 6 seconds. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test is passed if:</p> + <ul> + <li>The first time "fade in" is clicked, a blue rectangle should smoothly fade from white to blue over the course of three seconds.</li> + <li>When "fade out" is clicked, the blue rectangle should smoothly fade from blue to white over the course of three seconds.</li> + <li>When "fade in" is clicked the second time, the blue rectangle should smoothly fade from white to blue over the course of three seconds, and then directly fade out from blue to white over the course of three seconds.</li> + <li>The rendered picture matches the reference image, (except + for possible variations in the labeling text (per CSS2 rules)) + after activating the link on the fade-in button the first time + and waiting three seconds for the animation to complete. The picture + should remain looking the same way indefinitely, until another + link is activated.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-20-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <rect id="pink" x="20" y="20" width="200" height="200" fill="#fff"> + <animate id="fadein" attributeName="fill" attributeType="auto" from="#fff" to="blue" begin="indefinite" dur="3s" fill="freeze"/> + <animate id="fadeout" attributeName="fill" attributeType="auto" from="blue" to="#fff" begin="indefinite" dur="3s" fill="freeze"/> + </rect> + <!-- ok so this is testing dynamic compositing as well --> + <g id="buttons"> + <a xlink:href="#fadein"> + <rect x="320" y="0" width="160" height="180" fill="green"/> + <text fill="white" font-size="30" font-weight="bold" x="330" y="90">Fade in</text> + </a> + <a xlink:href="#fadeout"> + <rect x="320" y="180" width="160" height="180" fill="maroon"/> + <text fill="white" font-size="30" font-weight="bold" x="330" y="280">Fade out</text> + </a> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-21-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-21-t-manual.svg new file mode 100644 index 000000000..f68aed08d --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-21-t-manual.svg @@ -0,0 +1,109 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Chris lilley" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-21-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test for chained animations. + </p> + <p> + The assumption is that you will first click on "fade in" and + then click on "fade out", each exactly once. The first time you + select the link 'fade in', you should see a blue square appearing, + gradually and smoothly fading from white to blue over the + course of three seconds. This square is in front of and thus + obscures the lower left circle, but is behind the upper right + circle. The fill color of these circles is also animated, from white to + grey. The animations are triggered by the start of the corresponding + animation of the blue square. + </p> + <p> + With the second click on "fade in", however, the behavior might + be different. In the case of having a first click on "fade in", + waiting three seconds, and then immediately perform a first click + on "fade out", waiting three seconds, and then immediately perform + a second click on "fade in", you should see the following. After + the first click on "fade in", the blue square goes from white to blue. + After the first click on "fade out", the blue square goes + from blue to white. After the second click on "fade in", + however, the blue square goes from white to blue, and then + goes back from blue to white. This is because of the + hyperlinking rules as they relate to resolved start times in the + SMIL Animation specification. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Click "fade in", wait 3 seconds. Click "fade out", wait 3 seconds. Click "fade in" again, wait 6 seconds. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test is passed if:</p> + <ul> + <li>The first time "fade in" is clicked, a blue rectangle should smoothly fade from white to blue, and two circles should fade from white to gray, all over the course of three seconds</li> + <li>When "fade out" is clicked, the blue rectangle should smoothly fade from blue to white, and the two circles should fade from gray to white, all over the course of three seconds.</li> + <li>When "fade in" is clicked the second time, it should behave as the first time "fade in" was clicked but immediately followed by the "fade out" behaviour described above, so that the shapes all fade in over the course of three seconds, and then out again over the course of three seconds.</li> + <li>The rendered picture matches the reference image, (except + for possible variations in the labeling text (per CSS2 rules)) + after activating the link on the fade-in button the first time + and waiting three seconds for the animation to compete. The picture + should remain looking the same way indefinitely, until another + link is activated.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-21-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <circle stroke="white" stroke-width="30" fill="none" cx="100" cy="200" r="60"> + <animate id="fadein" attributeName="stroke" attributeType="auto" from="white" to="#666" begin="indefinite" dur="3s" fill="freeze"/> + <animate id="fadeout" attributeName="stroke" attributeType="auto" from="#666" to="white" begin="indefinite" dur="3s" fill="freeze"/> + </circle> + <rect id="pink" x="20" y="20" width="180" height="180" fill="#fff"> + <animate id="fadein2" attributeName="fill" attributeType="auto" from="#fff" to="blue" begin="fadein.begin" dur="3s" fill="freeze"/> + <animate id="fadeout2" attributeName="fill" attributeType="auto" from="blue" to="#fff" begin="fadeout.begin" dur="3s" fill="freeze"/> + </rect> + <circle stroke="white" stroke-width="20" fill="none" cx="200" cy="110" r="80"> + <animate id="fadein3" attributeName="stroke" attributeType="auto" from="white" to="#666" begin="fadein.begin" dur="3s" fill="freeze"/> + <animate id="fadeout3" attributeName="stroke" attributeType="auto" from="#666" to="white" begin="fadeout.begin" dur="3s" fill="freeze"/> + </circle> + <!-- ok so this is testing dynamic compositing as well --> + <g id="buttons"> + <a xlink:href="#fadein"> + <rect x="320" y="0" width="160" height="180" fill="green"/> + <text fill="white" font-size="30" font-weight="bold" x="330" y="90">Fade in</text> + </a> + <a xlink:href="#fadeout"> + <rect x="320" y="180" width="160" height="180" fill="maroon"/> + <text fill="white" font-size="30" font-weight="bold" x="330" y="280">Fade out</text> + </a> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-22-b-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-22-b-manual.svg new file mode 100644 index 000000000..4935e923f --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-22-b-manual.svg @@ -0,0 +1,88 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-22-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test which verifies that the basic facilities of declarative + animation are working. + </p> + <p> + This test uses the following element : 'animate' + </p> + <p> + The test is a nine second animation with no repeats. It shows + a rectangle growing from small (37.5% width, 33.3% height) to + big (100% width, 100% height) + </p> + <p> + The file includes various guides that can be used to verify the + correctness of the animation. Outlines exist for the rectangle + size and location at times 0s, 3s and 9s. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test is passed if:</p> + <ul> + <li>At the start of the animation the innermost rectangle is filled by a yellow semitransparent color</li> + <li>Over the course of three seconds the yellow rect smoothly animates its width and height so that at time t=3s fully fills the middle rectangle</li> + <li>The animation then continues in the same fashion and at time t=9s fully fills the largest rectangle with blue stroke</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-22-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- Guide objects to show where the animation elements belong at which time --> + <g font-family="Verdana" font-size="12"> + <text x="200" y="131">Yellow rect at time 0s</text> + <rect x="200" y="135" width="50" height="50" fill="none" stroke="black"/> + <text x="141.6666" y="102.6666">Yellow rect at time 3s</text> + <rect x="141.6666" y="106.6666" width="166.6666" height="111.6666" fill="none" stroke="rgb(0,0,255)"/> + <text x="25" y="46">Yellow rect at time 9s</text> + <rect x="25" y="50" width="400" height="240" fill="none" stroke="rgb(0,0,255)"/> + </g> + <rect id="RectElement" x="200" y="135" width="50" height="50" fill="rgb(255,255,0)" opacity=".5"> + <animate attributeName="x" attributeType="XML" begin="0s" dur="9s" fill="freeze" from="200" to="25"/> + <animate attributeName="y" attributeType="XML" begin="0s" dur="9s" fill="freeze" from="135" to="50"/> + <animate attributeName="width" attributeType="XML" begin="0s" dur="9s" fill="freeze" from="50" to="400"/> + <animate attributeName="height" attributeType="XML" begin="0s" dur="9s" fill="freeze" from="50" to="240"/> + </rect> + <!-- Set up a new user coordinate system so that the text string's + origin is at (0,0), allowing rotation and scale relative to + the new origin + --> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-23-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-23-t-manual.svg new file mode 100644 index 000000000..84e8c59c7 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-23-t-manual.svg @@ -0,0 +1,93 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: animate-elem-23-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test which verifies that the basic facilities of declarative + animation are working. + </p> + <p> + This test uses the following elements : 'set', + and 'animateColor'. + </p> + <p> + The test is a nine second animation with no repeats. It shows a circle + changing color from 3s to 9s. + </p> + <p> + The file includes various guides that can be used to verify the + correctness of the animation. + Boxes on the left show the correct circle color values at times + 3s, 6s and 9s. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if: + </p> + <ul> + <li>From time t=0 seconds to t=3 seconds the large rectangle is filled with black</li> + <li>At t=3 seconds a blue circle appears inside the black rectangle</li> + <li>Between time t=3 seconds and t=6 seconds the fill of the circle is animated between blue and bluegreen</li> + <li>Between time t=6 seconds and t=9 seconds the fill of the circle is animated between bluegreen and green</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-23-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- Guide objects to show where the animation elements belong at which time --> + <g font-size="12"> + <text x="15" y="55">Color at 3s</text> + <rect x="15" y="60" width="30" height="30"/> + <circle cx="30" cy="75" r="10" fill="rgb(0,0,255)"/> + <text x="15" y="145">Color at 6s</text> + <rect x="15" y="150" width="30" height="30"/> + <circle cx="30" cy="165" r="10" fill="rgb(0,127,127)"/> + <text x="15" y="235">Color at 9s</text> + <rect x="15" y="240" width="30" height="30"/> + <circle cx="30" cy="255" r="10" fill="rgb(0,255,0)"/> + </g> + + <g> + <rect x="150" y="50" width="240" height="240" stroke="black" fill="black"/> + <circle cx="270" cy="170" r="110" visibility="hidden"> + <set attributeName="visibility" attributeType="CSS" to="visible" begin="3s" dur="6s" fill="freeze"/> + <animateColor attributeName="fill" attributeType="CSS" from="rgb(0,0,255)" to="rgb(0,255,0)" begin="3s" dur="6s" fill="freeze"/> + </circle> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-24-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-24-t-manual.svg new file mode 100644 index 000000000..2ea2a3408 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-24-t-manual.svg @@ -0,0 +1,129 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: animate-elem-24-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test which verifies that the basic facilities of declarative + animation are working. + </p> + <p> + This test uses the following elements : 'animateMotion' and + 'animateTransform' + </p> + <p> + The test is a nine second animation with no repeats. It shows + the text string "It's alive" moving, rotating and growing from + time 3s to 9s. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The file includes various guides that can be used to verify the + correctness of the animation. Pale blue guides exist for + the text size, location and orientation at times 3s, 6s and 9s. + </p> + <p> + The test is passed if the animated text covers the pale blue guides at + the indicated times on the test. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-24-t.svg,v $</title> + <defs> + <font id="MyFont" horiz-adv-x="416"> + <font-face font-family="MyFont" units-per-em="1000" panose-1="2 0 0 6 3 0 0 2 0 4" ascent="700" descent="-127" alphabetic="0"/> + <missing-glyph horiz-adv-x="233"/> + <glyph unicode=" " glyph-name="space" horiz-adv-x="233"/> + <glyph unicode="I" glyph-name="I" horiz-adv-x="330" d="M30 700V550H90V150H30V0H300V150H240V550H300V700H30Z"/> + <glyph unicode="t" glyph-name="t" horiz-adv-x="417" d="M5 550V410H137V0H280V410H412V550H5Z"/> + <glyph unicode="s" glyph-name="s" horiz-adv-x="468" d="M34 550V410V218H291V120H34V0H434V338H177V430H434V550H34Z"/> + <glyph unicode="'" glyph-name="quotesingle" horiz-adv-x="198" d="M35 700L73 483H125L163 700H35Z"/> + <glyph unicode="a" glyph-name="a" horiz-adv-x="435" d="M71 550L3 0H143L154 119H282L293 0H433L365 550H71ZM168 259L182 410H254L268 259H168Z"/> + <glyph unicode="l" glyph-name="l" horiz-adv-x="435" d="M37 0H425V130H180V550H37V410V0Z"/> + <glyph unicode="i" glyph-name="i" horiz-adv-x="217" d="M37 550V410V0H180V550H37Z"/> + <glyph unicode="v" glyph-name="v" horiz-adv-x="430" d="M73 0H357L430 550H282L235 140H195L148 550H0L19 410L73 0Z"/> + <glyph unicode="e" glyph-name="e" horiz-adv-x="442" d="M37 550V410V0H419V130H180V210H299V340H180V420H419V550H37Z"/> + <glyph unicode="!" glyph-name="exclam" horiz-adv-x="237" d="M46 145V0H191V145H46ZM58 220H179L194 700H43L58 220Z"/> + </font> + </defs> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + <font id="MyFont" horiz-adv-x="416"> + <font-face font-family="MyFont" units-per-em="1000" panose-1="2 0 0 6 3 0 0 2 0 4" ascent="700" descent="-127" alphabetic="0"/> + <missing-glyph horiz-adv-x="233"/> + <glyph unicode=" " glyph-name="space" horiz-adv-x="233"/> + <glyph unicode="I" glyph-name="I" horiz-adv-x="330" d="M30 700V550H90V150H30V0H300V150H240V550H300V700H30Z"/> + <glyph unicode="t" glyph-name="t" horiz-adv-x="417" d="M5 550V410H137V0H280V410H412V550H5Z"/> + <glyph unicode="s" glyph-name="s" horiz-adv-x="468" d="M34 550V410V218H291V120H34V0H434V338H177V430H434V550H34Z"/> + <glyph unicode="'" glyph-name="quotesingle" horiz-adv-x="198" d="M35 700L73 483H125L163 700H35Z"/> + <glyph unicode="a" glyph-name="a" horiz-adv-x="435" d="M71 550L3 0H143L154 119H282L293 0H433L365 550H71ZM168 259L182 410H254L268 259H168Z"/> + <glyph unicode="l" glyph-name="l" horiz-adv-x="435" d="M37 0H425V130H180V550H37V410V0Z"/> + <glyph unicode="i" glyph-name="i" horiz-adv-x="217" d="M37 550V410V0H180V550H37Z"/> + <glyph unicode="v" glyph-name="v" horiz-adv-x="430" d="M73 0H357L430 550H282L235 140H195L148 550H0L19 410L73 0Z"/> + <glyph unicode="e" glyph-name="e" horiz-adv-x="442" d="M37 550V410V0H419V130H180V210H299V340H180V420H419V550H37Z"/> + <glyph unicode="!" glyph-name="exclam" horiz-adv-x="237" d="M46 145V0H191V145H46ZM58 220H179L194 700H43L58 220Z"/> + </font> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-size="20"> + <text x="70" y="110">Text from 0s to 3s</text> + <text x="100" y="185">Text at 6s</text> + <text x="100" y="220">Text at 9s</text> + </g> + <!-- Guide objects to show where the animation elements belong at which time --> + <g font-family="MyFont" stroke="none" fill="#bee"> + <text transform="translate(50,90) rotate(-30)" font-size="20">It's alive!</text> + <text transform="translate(75,180) rotate(-15)" font-size="40">It's alive!</text> + <text x="100" y="270" font-size="60">It's alive!</text> + </g> + <!-- Set up a new user coordinate system so that the text string's + origin is at (0,0), allowing rotation and scale relative to + the new origin + --> + <g transform="translate(50,90)"> + <!-- The following illustrates the use of the 'animateMotion', + and 'animateTransform' elements. At 3 seconds, the text: + * continuously moves diagonally across the viewport + * rotates from -30 to zero degrees + * scales by a factor of three. + --> + <text id="TextElement" x="0" y="0" font-family="MyFont" font-size="20" fill="#36e" transform="rotate(-30)"> + It's alive! + <animateMotion path="M 0 0 L 50 180" begin="3s" dur="6s" fill="freeze"/> + <animateTransform attributeName="transform" attributeType="XML" type="rotate" from="-30" to="0" begin="3s" dur="6s" fill="freeze"/> + <animateTransform attributeName="transform" attributeType="XML" type="scale" from="1" to="3" additive="sum" begin="3s" dur="6s" fill="freeze"/> + </text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-25-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-25-t-manual.svg new file mode 100644 index 000000000..8d2e0b626 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-25-t-manual.svg @@ -0,0 +1,89 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: animate-elem-25-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test animation options for specifying the target attribute/property. + </p> + <p> + The left-hand rectangle animates an XML attribute without + specifying a value for 'attributeType'. The right-hand rectangle + animates an XML attribute and does set 'attributeType' to 'XML'. + </p> + <p> + The left rectangle animates its height from 100 to 50, + starting at time 3 seconds and ending at 6 seconds. + The right rectangle animates its height from 100 to 50, + starting at time 6 seconds and ending at 9 seconds. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if: + </p> + <ul> + <li>the left yellow rectangle animates its height from 100 to 50, + starting at time 3 seconds and ending at 6 seconds, as indicated + by the green ruler lines.</li> + <li>the right yellow rectangle animates its height from 100 to 50, + starting at time 6 seconds and ending at 9 seconds, as indicated + by the green ruler lines. + </li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-25-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-family="Arial" font-size="14" x="30" y="40">Test animation options for specifying the target attribute/property.</text> + <g xml:space="preserve" font-family="Arial" font-size="14" stroke-width="3" transform="translate(0,50)"> + <text x="20" y="164">0-3 sec. </text> + <line x1="80" y1="160" x2="200" y2="160" fill="none" stroke="green"/> + <text x="20" y="124">at 6 sec. </text> + <line x1="80" y1="120" x2="200" y2="120" fill="none" stroke="green"/> + <rect id="rect1" x="100" y="80" width="100" height="80" fill="#FFFF00" stroke="#FF00FF" stroke-width="4"> + <animate attributeName="height" from="80" to="40" begin="3s" dur="3s" fill="freeze"/> + </rect> + <text x="240" y="164">0-6 sec. </text> + <line x1="305" y1="160" x2="425" y2="160" fill="none" stroke="green"/> + <text x="240" y="124">at 9 sec. </text> + <line x1="305" y1="120" x2="425" y2="120" fill="none" stroke="green"/> + <rect id="rect2" x="325" y="80" width="100" height="80" fill="#FFFF00" stroke="#FF00FF" stroke-width="4"> + <animate attributeName="height" attributeType="XML" from="80" to="40" begin="6s" dur="3s" fill="freeze"/> + </rect> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-26-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-26-t-manual.svg new file mode 100644 index 000000000..0365cbfc1 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-26-t-manual.svg @@ -0,0 +1,85 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-26-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test animation options for specifying the target attribute/property. + </p> + <p> + On the left, a circle animates the stroke-width property without + specifying a value for 'attributeType'. On the right, + a circle animates the stroke-width property and does set 'attributeType' to 'CSS'. + </p> + <p> + For each circle, guides shows what + the stroke-width looks like initially and + what it looks like at the end of the animation. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if: + </p> + <ul> + <li>the left blue circle smoothly animates its stroke-width from time t=1 second to time t=5 seconds, so that the blue color fully fills the left donut shape</li> + <li>the right pink circle smoothly animates its stroke-width from time t=4 seconds to time t=7 seconds, so that the pink color fully fills the right donut shape</li> + <li>both of the stroke-width animations originate from the thin black circle in the middle of each donut shape</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-26-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-size="30"> + <circle cx="120" cy="140" r="70" fill="none" stroke="#36e" stroke-width="1"> + <animate attributeName="stroke-width" from="1" to="60" begin="1s" dur="4s" fill="freeze"/> + </circle> + <circle cx="120" cy="140" r="40" fill="none" stroke="black" stroke-width="1"/> + <circle cx="120" cy="140" r="70" fill="none" stroke="black" stroke-width="1"/> + <circle cx="120" cy="140" r="100" fill="none" stroke="black" stroke-width="1"/> + <text x="70" y="280">anim. 1</text> + </g> + <g font-size="30"> + <circle cx="360" cy="140" r="70" fill="none" stroke="#e3a" stroke-width="1"> + <animate attributeName="stroke-width" attributeType="CSS" from="1" to="60" begin="4s" dur="3s" fill="freeze"/> + </circle> + <circle cx="360" cy="140" r="40" fill="none" stroke="black" stroke-width="1"/> + <circle cx="360" cy="140" r="70" fill="none" stroke="black" stroke-width="1"/> + <circle cx="360" cy="140" r="100" fill="none" stroke="black" stroke-width="1"/> + <text x="310" y="280">anim. 2</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-27-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-27-t-manual.svg new file mode 100644 index 000000000..939fbd7f1 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-27-t-manual.svg @@ -0,0 +1,93 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: animate-elem-27-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test animation options for specifying the target element. + </p> + <p> + The leftmost rectangle verifies the use of the 'xlink:href' + attribute to indicate the target element to be animated. + The rightmost rectangle verifies animating the parent of + the 'animate' element (in this case, a 'rect' element) + (i.e., the implicit parent of the 'animate' element). + </p> + <p> + At time 0, two rectangles filled with blue and stroked with + light blue appear, each with width=100 and height=160. Starting at + time 3 seconds and ending at time 6 seconds, the height of + the leftmost rectangle decreases from 160 to 40. Starting at + time 6 seconds and ending at time 9 seconds, the rightmost + rectangle decreases from 160 to 40. Annotations on the picture + show the correct positions at particular times. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if: + </p> + <ul> + <li>the left blue rectangle animates its height from 160 to 40, + starting at time 3 seconds and ending at 6 seconds, as indicated + by the green ruler lines.</li> + <li>the right blue rectangle animates its height from 160 to 40, + starting at time 6 seconds and ending at 9 seconds, as indicated + by the green ruler lines. + </li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-27-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-family="Arial" font-size="16" text-anchor="middle" x="225" y="40">Test animation options for specifying the target element.</text> + <g xml:space="preserve" font-family="Arial" font-size="14" text-anchor="end" stroke-width="3"> + <text x="80" y="244">0 to 3 sec. </text> + <line x1="80" y1="240" x2="200" y2="240" fill="none" stroke="green"/> + <text x="80" y="124">at 6 sec. </text> + <line x1="80" y1="120" x2="200" y2="120" fill="none" stroke="green"/> + <rect id="rect1" x="100" y="80" width="100" height="160" fill="blue" stroke="#36e" stroke-width="4"/> + <animate xlink:href="#rect1" attributeName="height" attributeType="XML" from="160" to="40" begin="3s" dur="3s" fill="freeze"/> + <text x="305" y="244">0 to 6 sec. </text> + <line x1="305" y1="240" x2="425" y2="240" fill="none" stroke="green"/> + <text x="305" y="124">at 9 sec. </text> + <line x1="305" y1="120" x2="425" y2="120" fill="none" stroke="green"/> + <rect id="rect2" x="325" y="80" width="100" height="160" fill="blue" stroke="#36e" stroke-width="4"> + <animate attributeName="height" attributeType="XML" from="160" to="40" begin="6s" dur="3s" fill="freeze"/> + </rect> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-28-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-28-t-manual.svg new file mode 100644 index 000000000..8d7ea85e5 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-28-t-manual.svg @@ -0,0 +1,63 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Benoit Bezaire" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: animate-elem-28-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test inheritance of animated properties. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + A yellow happy face should be displayed. The stroke for the smile and + yellow circle are both animated, the stroke color fades from yellow to black. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-28-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g stroke="#F1E900" fill="#F1E900" stroke-width="5"> + <circle cx="240" cy="180" r="150"/> + <!--circle cx="240" cy="180" r="150" stroke-opacity=".5"/--> + <g id="eyes" stroke="#000077"> + <path d="M260 131c0,-15 12,-28 28,-28 15,0 27,13 27,28 0,15 -12,28 -27,28 -16,0 -28,-13 -28,-28z"/> + <path d="M165 131c0,-15 12,-28 28,-28 15,0 27,13 27,28 0,15 -12,28 -27,28 -16,0 -28,-13 -28,-28z"/> + </g> + <path d="M151 227c46,52 138,52 184,0"/> + <animate attributeName="stroke" attributeType="CSS" begin="0s" dur="4s" fill="freeze" from="#F1E900" to="#000000"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-29-b-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-29-b-manual.svg new file mode 100644 index 000000000..265f4b6ec --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-29-b-manual.svg @@ -0,0 +1,98 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Chris Lilley" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: animate-elem-29-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test compositing of animated fill opacity. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + First click once on "fade in" and + then, once the animation has completed, click once on "fade out". + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The first time you + select the link 'fade in', you should see a green square appearing, + gradually and smoothly fading from zero to 100% opacity over the + course of three seconds. This square is in front of and thus + obscures the lower left circle, but is behind the upper right + circle which is thus composited on top of the animated green + square. Then, when you click on "fade out", the green square will + gradually disappear, smoothly fading from 100% to zero opacity + over the course of three seconds. + </p> + <p> + The rendered picture should match the reference image, (except + for possible variations in the labelling text (per CSS2 rules)) + after activating the link on the fade-in button the first time + and waiting three seconds for the animation to complete. The picture + should remain looking the same way indefinitely, until another + link is activated. + </p> + <!-- + With a second click on "fade in", however, the behavior might + be different. In the case of having a first click on "fade in", + waiting three seconds, and then immediately perform a first click + on "fade out", waiting three seconds, and then immediately perform + a second click on "fade in", you should see the following. After + the first click on "fade in", the red square goes from zero to 100% + opacity. After the first click on "fade out", the red square goes + from 100% to zero opacity. After the second click on "fade in", + however, the red square goes from zero to 100% opacity, and then + goes back from 100% to zero opacity. This is because of the + hyperlinking rules as they relate to resolved start times in the + SMIL Animation specification. + --> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-29-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <circle stroke="#666" stroke-width="30" fill="none" cx="100" cy="200" r="60"/> + <rect id="pink" x="20" y="20" width="180" height="180" fill="#080" fill-opacity="0"> + <animate id="fadein" attributeName="fill-opacity" attributeType="auto" from="0" to="1" begin="indefinite" dur="3s" fill="freeze"/> + <animate id="fadeout" attributeName="fill-opacity" attributeType="auto" from="1" to="0" begin="indefinite" dur="3s" fill="freeze"/> + </rect> + <circle stroke="#666" stroke-width="20" fill="none" cx="200" cy="110" r="80"/> + <g id="buttons"> + <a xlink:href="#fadein"> + <rect x="320" y="0" width="160" height="180" fill="green"/> + <text fill="white" font-size="30" font-weight="bold" x="330" y="90">Fade in</text> + </a> + <a xlink:href="#fadeout"> + <rect x="320" y="180" width="160" height="180" fill="maroon"/> + <text fill="white" font-size="30" font-weight="bold" x="330" y="280">Fade out</text> + </a> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-30-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-30-t-manual.svg new file mode 100644 index 000000000..d27f9a1d6 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-30-t-manual.svg @@ -0,0 +1,169 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="VH" author="OA" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-30-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + The purpose of this test is to test animated <use> where + the referenced <defs> also is animated. + </p> + <p> + The test shows 6 different elements, each element defined in a + <defs> and referenced with a <use>. All the elements are + animated between 0-3 seconds. The expected animation transform is + indicated with a gray silhouette showing the border values (0 and 3 seconds) + and an arrow indicating the movement in between. + For the two elements with a color animation, the colors goes from white to + blue (the same blue color used for all elements). + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if:</p> + <ul> + <li>Each animated element (the line, circle, three-segment polyline, image + and the two rectangles) is transformed with a continuous animation + over three seconds. The size and shape of each element must start off + as shown by the silhouette at the start of the arrow, and must end + up as shown by the silhouette at the end of the arrow.</li> + <li>The fill of the two rectangles is animated over three seconds from + white to blue.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-30-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform=" translate(20 0) scale(1.3 1.3)"> + <!-- SILHOUETTES--> + <path d="M210 40 C210 40 210 100 170 190" fill="none" stroke="#b4b4b4"/> + <path d="M 171 188 l 10 -10 l -10 -4 z" fill="#b4b4b4" stroke="none"/> + <polyline fill="none" stroke="#b4b4b4" stroke-width="2" points="200,20 200,40 220,40 220,60"/> + <polyline transform="rotate(15)" fill="none" stroke="#b4b4b4" stroke-width="9" points="200,120 200,140 220,140 220,160"/> + + <line x1="40" y1="50" x2="20" y2="10" stroke="#b4b4b4" stroke-width="3"/> + <line x1="160" y1="50" x2="80" y2="10" stroke="#b4b4b4" stroke-width="3"/> + <line x1="30" y1="30" x2="120" y2="30" stroke="#b4b4b4"/> + <path d="M 120 30 l -10 3 l 0 -6 z" fill="#b4b4b4" stroke="none"/> + + <line x1="70" y1="70" x2="145" y2="70" stroke="#b4b4b4"/> + <rect x="10" y="60" width="60" height="20" fill="#b4b4b4" stroke="#b4b4b4" stroke-width="2"/> + <rect x="145" y="60" width="30" height="40" fill="#b4b4b4" stroke="#b4b4b4" stroke-width="2"/> + <path d="M 145 70 l -10 3 l 0 -6 z" fill="#b4b4b4" stroke="none"/> + + <circle cx="30" cy="100" r="10" fill="#b4b4b4" stroke="#b4b4b4"/> + <circle cx="100" cy="195" r="15" fill="#b4b4b4" stroke="#b4b4b4"/> + <line x1="37" y1="107" x2="89" y2="184" stroke="#b4b4b4"/> + <path d="M 90 185 l -3 -12 l -6 5 z" fill="#b4b4b4" stroke="none"/> + + <rect x="300" y="10" width="20" height="20" fill="#b4b4b4" stroke="#b4b4b4" stroke-width="2"/> + <rect x="300" y="170" width="20" height="40" fill="#b4b4b4" stroke="#b4b4b4" stroke-width="2"/> + <line x1="310" y1="30" x2="310" y2="170" stroke="#b4b4b4"/> + <path d="M 310 170 l -3 -10 l 6 0 z" fill="#b4b4b4" stroke="none"/> + + <rect x="230" y="7.5" width="40" height="7.5" fill="#b4b4b4" stroke="none"/> + <rect x="230" y="170" width="40" height="30" fill="#b4b4b4" stroke="none"/> + <line x1="250" y1="10" x2="250" y2="170" stroke="#b4b4b4"/> + <path d="M 250 170 l -3 -10 l 6 0 z" fill="#b4b4b4" stroke="none"/> + <!-- END OF SILHOUETTES--> + + <!-- DEFS--> + <defs> + <line id="lineID" x1="30" y1="50" x2="10" y2="10" stroke="rgb(16, 93, 140)" stroke-width="3"> + <animate attributeName="x1" from="30" to="90" begin="0" dur="3" fill="freeze"/> + </line> + </defs> + + <defs> + <rect id="rectID" x="10" y="60" width="60" height="20" fill="blue" stroke="black" stroke-width="2"> + <animateColor attributeName="fill" from="white" to="rgb(16, 93, 140)" begin="0" dur="3" fill="freeze"/> + <animate attributeName="height" from="20" to="40" begin="0" dur="3" fill="freeze"/> + </rect> + </defs> + + <defs> + <circle id="circleID" cx="20" cy="100" r="10" fill="rgb(16, 93, 140)" stroke="black"> + <animate attributeName="cy" from="100" to="130" begin="0" dur="3" fill="freeze"/> + <animateTransform attributeName="transform" type="scale" from="1" to="1.5" additive="sum" begin="0" dur="3" fill="freeze"/> + </circle> + </defs> + + <defs> + <polyline id="polylineID" fill="none" stroke="rgb(16, 93, 140)" stroke-width="2" points="200,20 200,40 220,40 220,60"> + <animateMotion path="M 0 0 l 0 100" begin="0" dur="3" fill="freeze"/> + <animate attributeName="stroke-width" from="2" to="9" begin="0" dur="3" fill="freeze"/> + </polyline> + </defs> + + <defs> + <polygon id="polygonID" fill="green" stroke="black" points="240,20 240,40 260,40 260,20" stroke-width="2"> + <animate attributeName="fill" from="white" to="rgb(16, 93, 140)" begin="0" dur="3" fill="freeze"/> + </polygon> + </defs> + + <defs> + <image id="imageID" x="230" y="20" width="40" height="80" xlink:href="data:image/jpeg;base64,/9j/4AAQSkZJRgABAgEASABIAAD/4RX+RXhpZgAASUkqAAgAAAAJAA8BAgAGAAAAegAAABABAgAXAAAAgAAAABIBAwABAAAAAQAAABoBBQABAAAAoAAAABsBBQABAAAAqAAAACgBAwABAAAAAgAAADIBAgAUAAAAsAAAABMCAwABAAAAAQAAAGmHBAABAAAAxAAAAGYFAABDYW5vbgBDYW5vbiBESUdJVEFMIElYVVMgMzAwAAAAAAAAAAAAALQAAAABAAAAtAAAAAEAAAAyMDAyOjAxOjE1IDA0OjQyOjU4ABsAmoIFAAEAAABWAwAAnYIFAAEAAABeAwAAAJAHAAQAAAAwMjEwA5ACABQAAAAOAgAABJACABQAAAAiAgAAAZEHAAQAAAABAgMAApEFAAEAAAA+AwAAAZIKAAEAAABGAwAAApIFAAEAAABOAwAABJIKAAEAAABmAwAABZIFAAEAAABuAwAABpIFAAEAAAB2AwAAB5IDAAEAAAAFAAAACZIDAAEAAAAAAAAACpIFAAEAAAB+AwAAfJIHAJoBAACGAwAAhpIHAAgBAAA2AgAAAKAHAAQAAAAwMTAwAaADAAEAAAABAAAAAqADAAEAAABABgAAA6ADAAEAAACwBAAABaAEAAEAAAAwBQAADqIFAAEAAAAgBQAAD6IFAAEAAAAoBQAAEKIDAAEAAAACAAAAF6IDAAEAAAACAAAAAKMHAAEAAAADAAAAAAAAADIwMDI6MDE6MTUgMDQ6NDI6NTgAMjAwMjowMToxNSAwNDo0Mjo1OAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADAAAAAQAAAPUAAAAgAAAA1QAAACAAAAABAAAAyAAAAGQAAAAKAAAAAAAAAAMAAACs3QIAAAABAP//AADoAwAAMAEAACAAAAAMAAEAAwAmAAAAHAQAAAIAAwAEAAAAaAQAAAMAAwAEAAAAcAQAAAQAAwAaAAAAeAQAAAAAAwAGAAAArAQAAAAAAwAEAAAAuAQAAAYAAgAgAAAAwAQAAAcAAgAYAAAA4AQAAAgABAABAAAAcVYQAAkAAgAgAAAA+AQAABAABAABAAAAAAAEAQ0AAwAEAAAAGAUAAAAAAABMAAIAAAADAAEAAAAAAAQAAAABAAAAAAAAAAAAAAAAAAAAAwABAAEwAAD/////BgKtACAAdADVAP//AAAAAAAAAAAAAP//AABABkAGAgAwAdMAngAAAAAAAAAAADQAAACPAD8B1QD1AAAAAAAAAAEAAwAAAAAAAAAHMAAAAAAAAAAA//8AANUA+QAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAElNRzpESUdJVEFMIElYVVMgMzAwIEpQRUcAAAAAAAAARmlybXdhcmUgVmVyc2lvbiAxLjAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADAPQA9AD0AABqGADOAAAAgE8SAJsAAAAEAAEAAgAEAAAAUjk4AAIABwAEAAAAMDEwMAEQAwABAAAAQAYAAAIQAwABAAAAsAQAAAAAAAAGAAMBAwABAAAABgAAABoBBQABAAAAtAUAABsBBQABAAAAvAUAACgBAwABAAAAAgAAAAECBAABAAAA9AUAAAICBAABAAAA7g8AAAAAAAC0AAAAAQAAALQAAAABAAAA//////////////////////////////////////////////////9//////////////9j/2wCEAAkGBggGBQkIBwgKCQkLDRYPDQwMDRwTFRAWIR0jIiEcIB8kKTQsJCcxJx4fLT0tMTY3Ojo6Iio/RD44QjM3OTYBCQkJDAoMFAwMFA8KCgoPGhoKChoaTxoaGhoaT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT//AABEIAHgAoAMBIQACEQEDEQH/xAGiAAABBQEBAQEBAQAAAAAAAAAAAQIDBAUGBwgJCgsQAAIBAwMCBAMFBQQEAAABfQECAwAEEQUSITFBBhNRYQcicRQygZGhCCNCscEVUtHwJDNicoIJChYX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yjLsY19AaUzJHncWPrmsWro1TsC38J6tge4NONxBMAFc59FJrFprbU1Ti9HoD2sLJhmbHo3SmJZwA5Bj46dqqM7kygiVJkiB+YnPbPFMa9jfcFwSPek43dxqSSsNa7mUbvLVB7tSHUHWLcYmHtkHNCh5sXP5EB1p0TAtHx6g4/lU0OqQyLlrd93q4z+tVZ9G0LnXVCyXdw5/cBMf7uaga+uQwLxIT6gYqlHzZLl5KwNcs7ZljOT6UmYznkp+JFaIhjMRqM+ac/72aljDsR+/z9GqkTYk8uRTnex+rVIszIMfOSfamB//2apR82S5eSsDXLO2ZYzk+lJmM//Y/+0O2lBob3Rvc2hvcCAzLjAAOEJJTQPtClJlc29sdXRpb24AAAAAEABIAAAAAQACAEgAAAABAAI4QklNBA0YRlggR2xvYmFsIExpZ2h0aW5nIEFuZ2xlAAAAAAQAAAAeOEJJTQQZEkZYIEdsb2JhbCBBbHRpdHVkZQAAAAAEAAAAHjhCSU0D8wtQcmludCBGbGFncwAAAAkAAAAAAAAAAAEAOEJJTQQKDkNvcHlyaWdodCBGbGFnAAAAAAEAADhCSU0nEBRKYXBhbmVzZSBQcmludCBGbGFncwAAAAAKAAEAAAAAAAAAAjhCSU0D9RdDb2xvciBIYWxmdG9uZSBTZXR0aW5ncwAAAEgAL2ZmAAEAbGZmAAYAAAAAAAEAL2ZmAAEAoZmaAAYAAAAAAAEAMgAAAAEAWgAAAAYAAAAAAAEANQAAAAEALQAAAAYAAAAAAAE4QklNA/gXQ29sb3IgVHJhbnNmZXIgU2V0dGluZ3MAAABwAAD/////////////////////////////A+gAAAAA/////////////////////////////wPoAAAAAP////////////////////////////8D6AAAAAD/////////////////////////////A+gAADhCSU0ECAZHdWlkZXMAAAAAEAAAAAEAAAJAAAACQAAAAAA4QklNBB4NVVJMIG92ZXJyaWRlcwAAAAQAAAAAOEJJTQQaBlNsaWNlcwAAAAB3AAAABgAAAAAAAAAAAAAAWgAAAHgAAAALAG8AcABlAHIAYQBfAGgAbwB1AHMAZQAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAAAAAAAAAAAeAAAAFoAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAOEJJTQQREUlDQyBVbnRhZ2dlZCBGbGFnAAAAAQEAOEJJTQQUF0xheWVyIElEIEdlbmVyYXRvciBCYXNlAAAABAAAAAE4QklNBAwVTmV3IFdpbmRvd3MgVGh1bWJuYWlsAAALLwAAAAEAAABwAAAAVAAAAVAAAG5AAAALEwAYAAH/2P/gABBKRklGAAECAQBIAEgAAP/uAA5BZG9iZQBkgAAAAAH/2wCEAAwICAgJCAwJCQwRCwoLERUPDAwPFRgTExUTExgRDAwMDAwMEQwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwBDQsLDQ4NEA4OEBQODg4UFA4ODg4UEQwMDAwMEREMDAwMDAwRDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDP/AABEIAFQAcAMBIgACEQEDEQH/3QAEAAf/xAE/AAABBQEBAQEBAQAAAAAAAAADAAECBAUGBwgJCgsBAAEFAQEBAQEBAAAAAAAAAAEAAgMEBQYHCAkKCxAAAQQBAwIEAgUHBggFAwwzAQACEQMEIRIxBUFRYRMicYEyBhSRobFCIyQVUsFiMzRygtFDByWSU/Dh8WNzNRaisoMmRJNUZEXCo3Q2F9JV4mXys4TD03Xj80YnlKSFtJXE1OT0pbXF1eX1VmZ2hpamtsbW5vY3R1dnd4eXp7fH1+f3EQACAgECBAQDBAUGBwcGBTUBAAIRAyExEgRBUWFxIhMFMoGRFKGxQiPBUtHwMyRi4XKCkkNTFWNzNPElBhaisoMHJjXC0kSTVKMXZEVVNnRl4vKzhMPTdePzRpSkhbSVxNTk9KW1xdXl9VZmdoaWprbG1ub2JzdHV2d3h5ent8f/2gAMAwEAAhEDEQA/AOmAU2VPf9ETHJSDURr7GCG6BaJJ6NMeKJzdpjwTahTMkkn5pnTGunx0SvZHdKKcoMDw0lrhIjXRRrrdZu1gjkHlX2yK2DwaPyKFjQ/nQ/vDlVvvGpsDzDY9nQUT5FoPBa6FGXcSiW1uY4h2s8HxTPrex217S13gdFZiYkDY2wGwTvo2an1VMiQh5F1VjdsSeyBCUICAu7KuM1VMITQiEJoT7WMNqbapwlCNqf/Q6sBTZW95hgkjUplZxPovI5JA+5Xck+GJLVhHikAiZjWCxu8DbMnVWbX+09/xTmAQO5/ImcNCfAKpPIZ1daNiEBG66snlrWD4D8iC53igesXAGeQITbydBr5JlrkhcJDiNxaQ4D4K48V31gO9zHag9xPcKqzGfAdZpOjWjklHawVAMBkfx5KVnTwVQa4wXk+54A7dynODW1pc63Y1oLnvdDWtaBue97ifaxjfpK0NeFx3+Md/1it6fX03peHc/DySPtmXUN8ydteJtq3W11bvfc9zP0v80pffyfvfgFnsw7Ovi5VGZQ3KxiXY9hd6NhEb2NcWNu2/mtt272fyEWFHpODlMxG0WUfZKMcMpxhbHqvrYxodfbSwv9H1Ld/p1P8A0npfzv6RR631PovQMcX9UyjW5wmrHrAddZH+ipn/AMEs2VKwM8BEXLWtdGA4ZWaGl90kJQhYN1uVh05N1P2Z17fUFBO5zGO91LbXQz9N6Wx9vt9n82jwpQbAPdjqi//R6D6xX9Qx+n+r0p9NWRuaHeqN52nT9CyW/pGrnas3602YRZZ1U15DrRcLamBpDWtLPs3t/wAE/wDnLPalaMzJqpdl0323k7R7txpDnH9J6jj9Gpuz6KakZlVjab632jtkMaQyR+bcyT6Lv/An/mJZcspHSxFOPGIjWiXSwfrP1LG6Re/qbftnWatwoZWw7Lmy30f5oNbvb+k9T+bVKr/GcW2DG6p0v7K+0hm8Pe0N3e3dtsbY13P76Fdhm1hrc/IIJgu0a4T+axzam+z+V/4IqdJtN/2V1GW2qpz2G+xrHVbBP2d9T3U/ztm36DvoKMSOui4xHd62/qfT8PGORk5NdWPUIdYXAzHthjQdz3Pj2LGx/wDGNg02usdjUuxjGwjIAytv77qXsON7/wDRttVduIwmRZYSNTLav/edK2Mf03tNl++xtRa4MhrX+19x9Khrv0aQl4JMPF23/wCMD6tsZRkOdkuGRW6yqsVDeGjcLH2TZsb/ADbm/SVGz/Gf0h5Apw7yyRNll1LC3X6fpNdY93/FrPx8pt2TkUV1PaKNgNjmQHEn3Gt30XMYpWFja33C+6QC8MYWdtdjG+kXJcfgrg8Xrx1/o7Ayx+ZWGW1WXNM/mVAWW7o+g/Z9Gt300uk/WPpfV7jX019zrGNFjvUpfUdjtGmsv/nNzv3Fy13S3041Vue4ltx/mTZVc2RB22Nqr/N3LPtycnp4fZgMymWAij7NW4hz2Wbv0mM/32VtRBO1I4eoL0H1w+u/7GZZhdJr+09Qb7brtu6nGJ/NsI9luV/wX0Kv8KvOul+n1P6wY9vX8hxquuD8vJvl5cGje2l+jttdzw2r9yqtWG4+O3Edl2dKvrq3loabbd5MbnvcyPo7js9T8+z/AItV2ZWDW8XO6blBp9zQXOLYafcR6gc16cCQQaWEWKt9iIL/AHghweNwc2C0g67mub7dqbYV5vifWTIxqaqsa+7Bqa8PrxcmpzWF8+r7bqf55tn+Eru9Nlq1/wDnn1+gzk4+PY0Qfax7ZB/PZayx9StDmY9QQ1zy8uhBf//SC/pmKPoOIJ7Ne7+9MOnVNH85aB4ixytuDWHbMHwCeAAZPPYj+KsSxw/dH2NeM5dz9rXHTTGl14/tlI4FjSP1rI8hvn8FbDARMRroSf4Byk3cCQWkjsY5CiOOPYMgnLuWj9iuDdMy6PEkEf8AUqIx8sGRnWgdx7T/AN9WkS3ktOneFGAHTB1TeCPZdxy7uZkYXUrdhZ1S1gHGgjy42qpZ0jrTy6OruI7BzT+UPW+Tydp2nvIj/NTzXzHuHiATHyThCKDOXd5odE6wyNnUmeGrXAfDlMenfWMBv+UK3bRDY3cf5hXSOuLCP0YduMl2g/6MlRc2ppLgzbPYnUf2DuR9sI9yXd5l+P8AWVp3DMa4wRydPL3M9qGLPrQ1wAu3RwHODm/9L81dHZsk7WwSBogOaOQ2T3AMpwwx8VpzScYH63kfzm4Dgeo0/wDVOSFv1tYI2jaeRLII/lAXLcZu2CA4eIOhUgNCdr4/OiSnfd4eP4f96t+8T8H/05PZkB28OboPzi7/AL6p1OJEz8Cf9qC4vBEPY13jAJj71HZlfmPZH9Uz+VWZFrC240tPmR2EGfkkHMaQBo4nUOEx+IVXfcwAWmrXncQD9wCT8qn6IDNwGo2kg/cmEWuum4TYCI2OB8AZ/wCqc1DLniR7te7SQNP5YZ7VUD73O2iljmd/T0Mf5zXf9FGDrhpWAHRoHgx83Nc5NqlwNsn5uMyA+yHd9Hc+b9j0qs3FfoHbxoZa0kT/AJqGLuonSxrXDuGz/wBUXKX2jJA1phvYOg/IJwH8rWkn+QZzjuJdIYXcgkA6eA9Ru1QYamglu93jALv836X/AFSTb8h3/aQx5QP+qTWixxaHVWb+4B0H4ohHl+SxdU7hrpI5cDz/AGoQvdOjRH3H7lElu73bh81DfXJDXAHydJ/KpAsJbQIiCSPiRP4p2BocXAy7xMfwQCS0Ai+Y/N3NEfDcFJj73HVu8eHt/wC+7U+1r//UGz0tvs/nO+6N0/20x+3bvZt2x7d0fjuXl6SsS2aw3/g+qV/bJHq7Nvlz89ym7kT6cfPn+wvKElGN/wDvWQ7f98+rH7Rr6e3nSP8AzJB/WIHr7v8Arcx5bvzti8vSTvs/7pb9v7H039N6b9vq+XO3+xv/ADkAftLc3Z9q/wCjt+Xqe1ecpIlH2vp1vrbB9t3bZ1mN3/R/QquPT3D0/V2eUxH/AFK85STo/RbL6/V9Lb638rbP50Qmd6kGfS51mV5qknrX0+v0tv5v9nd/FPp+bO3vG3/0Z7l5ekih/9kAOEJJTQQhGlZlcnNpb24gY29tcGF0aWJpbGl0eSBpbmZvAAAAAFUAAAABAQAAAA8AQQBkAG8AYgBlACAAUABoAG8AdABvAHMAaABvAHAAAAATAEEAZABvAGIAZQAgAFAAaABvAHQAbwBzAGgAbwBwACAANgAuADAAAAABADhCSU0EBgxKUEVHIFF1YWxpdHkAAAAAB//+AAAAAQEA/+4ADkFkb2JlAGSAAAAAAf/bAIQAFBERGhIaKRgYKTMnICczJxwcHBwnIhcXFxcXIhEMDAwMDAwRDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAEVGhohHSEiGBgiFA4ODhQUDg4ODhQRDAwMDAwREQwMDAwMDBEMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwM/8AAEQgAWgB4AwEiAAIRAQMRAf/dAAQACP/EARsAAAMBAQEBAQEBAQEAAAAAAAEAAgMEBQYHCAkKCwEBAQEBAQEBAQEBAQEAAAAAAAECAwQFBgcICQoLEAACAgEDAgMEBwYDAwYCATUBAAIRAyESMQRBUSITYXEygZGxQqEF0cEU8FIjcjNi4YLxQzSSorIV0lMkc8JjBoOT4vKjRFRkJTVFFiZ0NlVls4TD03Xj80aUpIW0lcTU5PSltcXV5fVWZnaGlqa2xtbm9hEAAgIABQEGBgEDAQMFAwYvAAERAiEDMUESUWFxgZEiEzLwobEEwdHh8UJSI2JyFJIzgkMkorI0U0Rjc8LSg5OjVOLyBRUlBhYmNWRFVTZ0ZbOEw9N14/NGlKSFtJXE1OT0pbXF1eX1VmZ2hv/aAAwDAQACEQMRAD8A9dIiTwoDYJi+o85BjSGibVoDGMjqFN3RdsOgbIvl5O8M6Kso5pRIYt2yRPycqd1cow8CoanV33gPMrWpCcFZCJcOdNIaiApFNUtNITSppUD/0PaSrpiGtvpbhScEpcGdF32gCmigvG1pOqrAwAAQSyZVoxucGiyWsVAEON3w6RgQbUgGTF3j9DIwyL0WrtXaRjijlnD04mUiAByw+L1f4kOt6uOCEqwYzuyS+zOWP/31ifcx/wA2InEGiLelbTqZtWNCVay7cETPJIRiO8izCQnESHBFu009DDTQqmlaQ//R9bqs8elh6kgSP8IeDH+MmUZShilYraJfbXP1ks8KiAI9/wDE82OYlpwfB1a+yJWu7PV6L8Tj1tjaYGHxCTcfxXpJGvUA/qEovjysWQDfjfxPBLpISu47SNfJJ5ybg+p9SMyZRIMTwQ55epxYK9WQjfD5GCWXBAQjZA/i2f8AbcJdNOUjMynuPe4KRB9Thy4px3YpCQ8Ync2ckMY88gP6jtfk49NGN5BM2QYk2xL8Ph2s1/T/AO/VIg+rx9RjykjHKMq/gludgbflMEJdLLdCwT7YNZo5swAlI7QTLbu/i/8AKmFSIPo/2TD6nqbI7/4trxfif4xi/Dxt+LKeIfw/+PfNH4hk6bp/Rx0JjieSXwx/9+PiT6eWQ7pGJJ5lu+JskOnpZZvxjqonMbjHzyj9iMY/7v8A8yP1z8b0ccvTz3wkIn2S+J9+P4vGNDLEg/bl/wDAnrSyRztVs9OleWH4n009BOv6gVevJdTnxZ//0sSCAImAoeBWRMzZhqOPM9BJPKu3RGFdmXqS7wP0uOSEMkt08crHte0Jq3PE1yOYZa+zJP7QB9mX0PTtZMXPEvI4JjHKO0idXu0QevgNdsg+iIrsbxHI82H4nCE9+3cRp5wjJ+JY8hJmDR+yH0vT91olgHgD8m8ScjxcuTps/wAYkaG0fv6TOWXTZQBUogaAD/40+ueniR8I+hyl00DzEfQ3iycjyPR6Q95gfv8A+UnaEsGPSE5iP8JO+P8A7rez9kx3rEN/smH+FvBk5o5Tl6aX2iFen9ixfw/eVXtsvNH/06J1oNA+DBjE9liaezOKNBomrLIl4JJLk0VXtQdGdDoQgHwclLGq34MkS7EfNz/mX2+9pDY252Y66tDepvwpoBd6uZtJmfH7mTO3SMsFW1TAIDYmPEOkZDEX3VIKtB//1J0lwLX04ns19l55c93qzkb+mBxakyHA+lxj/qeg/P5MGBnsMvY3t2jU2svm49+6YRcowJ5+9aA03UiXbhwyc9vmgdIG74ZLu2nWX3PHj57fJ6u3b/V8TQEzB+0iz73Lx4SP3pqMlX4hom+AQx37uw4/N0QmMfaqnnsqB//Z"> + <animate attributeName="y" from="5" to="145" begin="0" dur="3" fill="freeze"/> + </image> + </defs> + <!-- END OF DEFS--> + + <!-- ACTUAL TEST CONTENT--> + <use xlink:href="#lineID"> + <animate attributeName="x" from="10" to="70" begin="0" dur="3" fill="freeze"/> + </use> + + <use xlink:href="#rectID"> + <animateTransform attributeName="transform" type="translate" from="0 0" to="140 0" begin="0" dur="3" fill="freeze"/> + <animateTransform attributeName="transform" type="scale" from="1 1" to="0.5 1" begin="0" dur="3" additive="sum" fill="freeze"/> + </use> + + <use xlink:href="#circleID"> + <animate attributeName="x" from="10" to="70" begin="0" dur="3" fill="freeze"/> + </use> + + <use xlink:href="#polylineID"> + <animateTransform attributeName="transform" type="rotate" from="0" to="15" additive="sum" begin="0" dur="3" fill="freeze"/> + </use> + + <use x="60" y="-10" xlink:href="#polygonID"> + <animateMotion path="M 0 0 l 0 150" begin="0" dur="3" fill="freeze"/> + <animateTransform attributeName="transform" type="scale" from="1 1" to="1 2" begin="0" dur="3" additive="sum" fill="freeze"/> + </use> + + <use xlink:href="#imageID"> + <animateTransform attributeName="transform" type="scale" from="1 .25" to="1 1" begin="0" dur="3" additive="sum" fill="freeze"/> + </use> + <!-- END OF ACTUAL TEST CONTENT--> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-31-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-31-t-manual.svg new file mode 100644 index 000000000..60ff89466 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-31-t-manual.svg @@ -0,0 +1,139 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="VH" author="OA" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: animate-elem-31-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + The purpose of this test is to test animation of the display attribute. + </p> + <p> + The test shows two gray rectangles which are filled with colored circles during the length of the animation (8 sec). + The circles in the top rectangle are displayed/hidden by animating the display attribute. + The circles in the bottom rectangle are serving as the reference and are displayed/hidden by animating the visibility attribute. + A correct implementation should display/hide circles with the same color from the top and bottom rectangle at the same time. + </p> + <p> + In total there are 6 different circles (purple, green, dodgerblue, blue, yellow, cyan) in 5 positions (blue and yellow share position) that should be displayed during the test. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>While the test is running (which takes approximately 8 seconds), + the text "Test running" is shown. The test passes if:</p> + <ul> + <li>While the test is running, the colored circles are variously shown and hidden.</li> + <li>A colored circle is shown in the top rectangle if and only if + the corresponding colored circle is shown in the bottom rectangle.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-31-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- GRAY TESTAREAS--> + <rect x="5" y="7.5" width="375" height="75" fill="silver" stroke="black" stroke-width="3"/> + <rect x="5" y="112.5" width="375" height="75" fill="silver" stroke="black" stroke-width="3"/> + <g transform="scale(1.5)" display="inline"> + + <!-- PURPLE CIRCLES--> + <circle display="inline" cx="30" cy="30" r="20" fill="purple" stroke="black" stroke-width="5"/> + <circle display="inline" cx="30" cy="100" r="20" fill="purple" stroke="black" stroke-width="5"> + <animate attributeName="visibility" from="visible" to="hidden" begin="6" dur="2"/> + </circle> + + <!-- GREEN CIRCLES--> + <g display="none"> + <circle display="inline" cx="80" cy="30" r="20" fill="green" stroke="black" stroke-width="5"/> + <animate attributeName="display" from="none" to="inline" begin="0" dur="3" fill="freeze"/> + </g> + <circle visibility="hidden" cx="80" cy="100" r="20" fill="green" stroke="black" stroke-width="5"> + <animate attributeName="visibility" from="hidden" to="visible" begin="0" dur="3" fill="freeze"/> + </circle> + + <!-- DODGERBLUE CIRCLES--> + <circle display="none" cx="130" cy="30" r="20" fill="dodgerblue" stroke="black" stroke-width="5"> + <set attributeName="display" to="inline" begin="2" dur="1" fill="freeze"/> + </circle> + <circle visibility="hidden" cx="130" cy="100" r="20" fill="dodgerblue" stroke="black" stroke-width="5"> + <animate attributeName="visibility" from="hidden" to="visible" begin="1" dur="2" fill="freeze"/> + </circle> + + <!-- BLUE CIRCLES--> + <g display="none"> + <g display="inherit"> + <circle display="inline" cx="180" cy="30" r="20" fill="blue" stroke="black" stroke-width="5"/> + </g> + <animate attributeName="display" from="inline" to="none" begin="3" dur="3" fill="freeze"/> + </g> + <circle visibility="hidden" cx="180" cy="100" r="20" fill="blue" stroke="black" stroke-width="5"> + <animate attributeName="visibility" from="visible" to="hidden" begin="3" dur="3" fill="freeze"/> + </circle> + + <!-- YELLOW CIRCLES--> + <g display="none"> + <g display="inherit"> + <circle display="inline" cx="180" cy="30" r="20" fill="yellow" stroke="black" stroke-width="5"/> + </g> + <animate attributeName="display" from="none" to="inherit" begin="4" dur="3" fill="freeze"/> + </g> + <circle visibility="hidden" cx="180" cy="100" r="20" fill="yellow" stroke="black" stroke-width="5"> + <animate attributeName="visibility" from="hidden" to="visible" begin="4" dur="3" fill="freeze"/> + </circle> + + <!-- CYAN CIRCLES--> + <g display="none"> + <circle cx="230" cy="30" r="20" fill="#00ffff" stroke="black" stroke-width="5"> + <animate attributeName="display" begin="0" dur="0.5" keyTimes="0; 0.5; 1" values="inherit; none; inherit" repeatCount="8"/> + </circle> + <animate attributeName="display" begin="0" dur="2" keyTimes="0; 0.5; 1" values="inline; none; inline" repeatCount="2" fill="freeze"/> + </g> + <g visibility="hidden"> + <circle cx="230" cy="100" r="20" fill="#00ffff" stroke="black" stroke-width="5"> + <animate attributeName="visibility" begin="0" dur="0.5" keyTimes="0; 0.5; 1" values="inherit; hidden; inherit" repeatCount="8"/> + </circle> + <animate attributeName="visibility" begin="0" dur="2" keyTimes="0; 0.5; 1" values="visible; hidden; visible" repeatCount="2" fill="freeze"/> + </g> + <animate attributeName="display" from="inherit" to="none" begin="6" dur="2"/> + </g> + + <text x="385" y="40" font-size="16">display</text> + <text x="385" y="150" font-size="18">visibility</text> + <text x="5" y="235" font-size="28">Test of display attribute animation.</text> + <text x="5" y="265" font-size="18">Circles with same color should be visible at same time.</text> + + <text x="310" y="335" display="none" fill="red">Test running... + <set attributeName="display" to="inline" begin="0" dur="8.5"/> + </text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-32-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-32-t-manual.svg new file mode 100644 index 000000000..595c72dda --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-32-t-manual.svg @@ -0,0 +1,146 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="SH" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-32-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Tests the animation to and from the degenerate cases of the basic shapes. + The shapes are drawn within the black rectangles. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if within each of the 11 rectangles an animated shape + is shown over the first six seconds and that after the six seconds, at the + end of the animation, each of these rectangles is empty.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-32-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ====================================================================== --> + <!-- Draw the boxes to contain the shapes and the text labels for the boxes --> + <!-- ====================================================================== --> + <g fill="black" stroke="none" font-family="Arial" font-size="8"> + <text x="5" y="90">Stroked</text> + <text x="5" y="195">Unstroked</text> + <text x="50" y="135">Zero width rect</text> + <text x="130" y="135">Zero height rect</text> + <text x="210" y="135">Zero radius circle</text> + <text x="315" y="135">Zero x radius ellipse</text> + <text x="394" y="135">Zero y radius ellipse</text> + <text x="210" y="290">Zero length line</text> + </g> + + <g fill="none" stroke="#000000"> + <!-- rects --> + <rect x="50" y="50" width="35" height="60"/> + <rect x="50" y="155" width="35" height="60"/> + <rect x="130" y="50" width="35" height="60"/> + <rect x="130" y="155" width="35" height="60"/> + + <!-- circles --> + <rect x="210" y="50" width="60" height="60"/> + <rect x="210" y="155" width="60" height="60"/> + + <!-- ellipses --> + <rect x="315" y="50" width="35" height="60"/> + <rect x="315" y="155" width="35" height="60"/> + <rect x="394" y="50" width="35" height="60"/> + <rect x="394" y="155" width="35" height="60"/> + + <!-- line --> + <rect x="210" y="260" width="60" height="10"/> + </g> + + <!-- ====================================================================== --> + <!-- Draw 4 rectangles, two with zero width, two with zero height --> + <!-- (stroked and unstroked) --> + <!-- ====================================================================== --> + <rect id="Zero-width-stroked-rect" fill="#00FF00" stroke="#000000" x="55" y="55" height="50" width="0"> + <animate attributeName="width" from="0" to="25" begin="0" dur="3" fill="freeze"/> + <animate attributeName="width" from="25" to="0" begin="3" dur="3" fill="freeze"/> + </rect> + <rect id="Zero-height-stroked-rect" fill="#00FF00" stroke="#000000" x="135" y="55" width="25" height="0"> + <animate attributeName="height" from="0" to="50" begin="0" dur="3" fill="freeze"/> + <animate attributeName="height" from="50" to="0" begin="3" dur="3" fill="freeze"/> + </rect> + <rect id="Zero-width-unstroked-rect" fill="#FF8000" stroke="none" x="55" y="160" height="50" width="0"> + <animate attributeName="width" from="0" to="25" begin="0" dur="3" fill="freeze"/> + <animate attributeName="width" from="25" to="0" begin="3" dur="3" fill="freeze"/> + </rect> + <rect id="Zero-height-unstroked-rect" fill="#FF8000" stroke="none" x="135" y="160" width="25" height="0"> + <animate attributeName="height" from="0" to="50" begin="0" dur="3" fill="freeze"/> + <animate attributeName="height" from="50" to="0" begin="3" dur="3" fill="freeze"/> + </rect> + <!-- ====================================================================== --> + <!-- Draw two zero radius circles (stroked and unstroked) --> + <!-- ====================================================================== --> + <circle id="Zero-radius-stroked-circle" fill="#00FF00" stroke="#000000" cx="240" cy="80" r="0"> + <animate attributeName="r" from="0" to="25" begin="0" dur="3" fill="freeze"/> + <animate attributeName="r" from="25" to="0" begin="3" dur="3" fill="freeze"/> + </circle> + <circle id="Zero-radius-unstroked-circle" fill="#FF8000" stroke="none" cx="240" cy="185" r="0"> + <animate attributeName="r" from="0" to="25" begin="0" dur="3" fill="freeze"/> + <animate attributeName="r" from="25" to="0" begin="3" dur="3" fill="freeze"/> + </circle> + <!-- ====================================================================== --> + <!-- Draw 4 ellipses, two with a zero x radius, two with a zero y radius --> + <!-- (stroked and unstroked) --> + <!-- ====================================================================== --> + <ellipse id="Zero-x-radius-stroked-ellipse" fill="#00FF00" stroke="#0000FF" cx="332" cy="80" rx="0" ry="25"> + <animate attributeName="rx" from="0" to="12" begin="0" dur="3" fill="freeze"/> + <animate attributeName="rx" from="12" to="0" begin="3" dur="3" fill="freeze"/> + </ellipse> + <ellipse id="Zero-x-radius-unstroked-ellipse" fill="#FF8000" stroke="none" cx="332" cy="185" rx="0" ry="25"> + <animate attributeName="rx" from="0" to="12" begin="0" dur="3" fill="freeze"/> + <animate attributeName="rx" from="12" to="0" begin="3" dur="3" fill="freeze"/> + </ellipse> + <ellipse id="Zero-y-radius-stroked-ellipse" fill="#00FF00" stroke="#0000FF" cx="411" cy="80" rx="12" ry="0"> + <animate attributeName="ry" from="0" to="25" begin="0" dur="3" fill="freeze"/> + <animate attributeName="ry" from="25" to="0" begin="3" dur="3" fill="freeze"/> + </ellipse> + <ellipse id="Zero-y-radius-unstroked-ellipse" fill="#FF8000" stroke="none" cx="411" cy="185" rx="12" ry="0"> + <animate attributeName="ry" from="0" to="25" begin="0" dur="3" fill="freeze"/> + <animate attributeName="ry" from="25" to="0" begin="3" dur="3" fill="freeze"/> + </ellipse> + <!-- ====================================================================== --> + <!-- Draw a zero-length line --> + <!-- ====================================================================== --> + <line id="Zero-length-line" stroke="#0000FF" x1="240" y1="265" x2="240" y2="265"> + <animate attributeName="x1" from="240" to="215" begin="0" dur="3" fill="freeze"/> + <animate attributeName="x2" from="240" to="265" begin="0" dur="3" fill="freeze"/> + <animate attributeName="x1" from="215" to="240" begin="3" dur="3" fill="freeze"/> + <animate attributeName="x2" from="265" to="240" begin="3" dur="3" fill="freeze"/> + </line> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-33-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-33-t-manual.svg new file mode 100644 index 000000000..4b50ae3d5 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-33-t-manual.svg @@ -0,0 +1,149 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="VH" author="OA" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-33-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + The purpose of this test is to test animateMotion with keyPoints and keyTimes. + </p> + <p> + The test consists of 4 sub-tests. Each test has a purple circle which moves along a path. The path is indicated with a dashed line and sample points where the circle should pass a certain position on the path is indicated with gray circles. On top of each gray circle is a number which indicates the passing time in seconds. In the cases where the purple circle should pass the gray circle two times the first passing time is written above the gray circle and the second passing time is written below. + </p> + <p> + Section 19.2.12 in the spec. states that a motion path is defined by the path attribute or by values or from/to attributes. So in the animateMotion case, values is just used for defining the motionPath and the number of values do not have to relate to the number of keyTimes. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if, for the first four seconds of the document, + each of the four purple circles moves along the dashed lines + such that they coincide with the gray circles at the times indicated + next to those gray circles. The purple circles must all move continuously + over the four seconds, except for the top-right one, which + jumps discontinuously at 2s from the second grey circle to + the third in that subtest.</p> + <p>If a range of times is given next to a grey circle, then the purple + circle must stay stationary at that position for that duration.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-33-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- FIRST TEST--> + <g transform="translate(110, 50) scale(0.6)"> + <text x="-160" y="-30" font-size="30" stroke="none" fill="#ccc">0</text> + <text x="-50" y="-30" font-size="30" stroke="none" fill="#ccc">0.8-3.2</text> + <text x="140" y="-30" font-size="30" stroke="none" fill="#ccc">4</text> + <g fill="none" stroke="#888" stroke-dasharray="10,6"> + <polyline points="-150,0 0,0 150,0"/> + </g> + <g fill="#ccc" stroke="#555"> + <circle cx="-150" r="20"/> + <circle r="20"/> + <circle cx="150" r="20"/> + </g> + <circle r="20" fill="rgb(204,0,102)" stroke="#000" stroke-width="3"> + <animateMotion dur="4" values="-150 0; 150 0" calcMode="linear" fill="freeze" keyTimes="0; 0.2; 0.4; 0.6; 0.8; 1" keyPoints="0; 0.5; 0.5; 0.5; 0.5; 1"/> + </circle> + </g> + <!-- SECOND TEST--> + <g transform="translate(370, 50) scale(0.6)"> + <text x="-160" y="-30" font-size="30" stroke="none" fill="#ccc">0</text> + <text x="-100" y="-30" font-size="30" stroke="none" fill="#ccc">2</text> + <text x="80" y="-30" font-size="30" stroke="none" fill="#ccc">2</text> + <text x="140" y="-30" font-size="30" stroke="none" fill="#ccc">4</text> + <g fill="none" stroke="#888" stroke-dasharray="10,6"> + <polyline points="-150,0 -90,0"/> + <polyline points="90,0 150,0"/> + </g> + <g fill="#ccc" stroke="#555"> + <circle cx="-150" r="20"/> + <circle cx="-90" r="20"/> + <circle cx="90" r="20"/> + <circle cx="150" r="20"/> + </g> + <circle r="20" fill="rgb(204,0,102)" stroke="#000" stroke-width="3"> + <animateMotion dur="4" values="-150 0; 150 0" calcMode="linear" fill="freeze" keyTimes="0; 0.5; 0.5; 0.5; 0.5; 1" keyPoints="0; 0.2; 0.4; 0.6; 0.8; 1"/> + </circle> + </g> + <!-- THIRD TEST--> + <!-- The lenght of the lines in the polyline (motionpath) are 100,50 and 100. + The animated circle starts at the midpoint of one of the "legs" and also pass + this point at time 1.4 since + 1.4 = 4*(0.25) + (4*(0.75-0.25))*(1/5). + Where 0.25 is the time at keyPoint 1 (2nd) and 1/5 since the control circle is at + 1/5 of the distance between keyPoint 1 and 0 (2nd and 3rd).--> + <g transform="translate(110, 180) scale(0.6)"> + <text x="-115" y="-30" font-size="30" stroke="none" fill="#ccc">3</text> + <text x="-85" y="-60" font-size="30" stroke="none" fill="#ccc">2.6</text> + <text x="60" y="-60" font-size="30" stroke="none" fill="#ccc">0</text> + <text x="95" y="-30" font-size="30" stroke="none" fill="#ccc">1</text> + <text x="-75" y="20" font-size="30" stroke="none" fill="#ccc">4</text> + <text x="40" y="20" font-size="30" stroke="none" fill="#ccc">1.4</text> + <g fill="none" stroke="#888" stroke-dasharray="10,6"> + <polyline points="-105,0 -25,-60 25,-60 105,0"/> + </g> + <g fill="#ccc" stroke="#555"> + <circle cx="-105" r="20"/> + <circle cx="-65" cy="-30" r="20"/> + <circle cx="65" cy="-30" r="20"/> + <circle cx="105" r="20"/> + </g> + <circle r="20" fill="rgb(204,0,102)" stroke="#000" stroke-width="3"> + <animateMotion dur="4" path="M -105,0 L -25,-60 25,-60 105,0" calcMode="linear" fill="freeze" keyPoints="0.8; 1; 0; 0.2" keyTimes="0; 0.25; 0.75; 1"/> + </circle> + </g> + <!-- FOURTH TEST--> + <g transform="translate(370, 160) scale(0.6)"> + <text x="-135" y="-30" font-size="30" stroke="none" fill="#ccc">3</text> + <text x="-95" y="-30" font-size="30" stroke="none" fill="#ccc">2.6</text> + <text x="65" y="-30" font-size="30" stroke="none" fill="#ccc">0</text> + <text x="115" y="-30" font-size="30" stroke="none" fill="#ccc">1</text> + <text x="-85" y="50" font-size="30" stroke="none" fill="#ccc">4</text> + <text x="50" y="50" font-size="30" stroke="none" fill="#ccc">1.4</text> + <g fill="none" stroke="#888" stroke-dasharray="10,6"> + <polyline points="-125,0 125,0"/> + </g> + <g fill="#ccc" stroke="#555"> + <circle cx="-125" r="20"/> + <circle cx="-75" r="20"/> + <circle cx="75" r="20"/> + <circle cx="125" r="20"/> + </g> + <circle r="20" fill="rgb(204,0,102)" stroke="#000" stroke-width="3"> + <animateMotion dur="4" from="-125,0" to="125,0" calcMode="linear" fill="freeze" keyPoints="0.8; 1; 0; 0.2" keyTimes="0; 0.25; 0.75; 1"/> + </circle> + </g> + <text x="5" y="235" font-size="28">Test of keyPoints and keyTimes.</text> + <text x="5" y="265" font-size="18">Number indicates the circle's passing time in seconds.</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-34-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-34-t-manual.svg new file mode 100644 index 000000000..ac7893155 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-34-t-manual.svg @@ -0,0 +1,123 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="VH" author="OA" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-34-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + The purpose of this test is to test animation of attributes points and fill-rule. + </p> + <p> + The test consists of 2 sub-tests. The first test is a polygon shaped as a digit. The polygon + has an animation on its vertex points which morphs the polygon between the numbers 1, 2, 3 + and 4. The gray outlines indicates the expected position of the polygon at 1, 2, 3 and 4s. + The second test is 4 paths in a u-shape. They have animated fill-rules. Their initial + fill-rules are, from left to right, nonzero, evenodd, nonzero (by default value, no fill-rule attribute set) + and nonzero (by default value, no fill-rule attribute set). This means, that the second path is + initially u-shaped, and all other paths are initially rect-shaped. All four animations are set to evenodd as a last stage. + The further expected result is that one path at a time is filled. The other three paths are not filled but have the u-shape. + The fourth animation from evenodd to nonzero happens by going back to the initial state, + because the fill attribute is not set to freeze. Which path that should be filled at + which time is indicated by the number above it (indicating time in seconds). To enhance the + difference between the filled path and the rest, the filled path should always have the + same color as the morphing polygon. This is achieved by a discrete color animation. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test is passed if all of the following conditions are met:</p> + <ul> + <li>The red path in the shape of the digit "1" morphs continuously over three seconds + (from 1s to 4s in document time) to the shape of "2", "3" and then "4". The gray paths + show the four shapes and positions that the red path takes as it morphs.</li> + <li>Initially, when the document is loaded, of the four paths underneath each of the + four digits, the second one is u-shaped, while the other three are square shaped. + The first path is red, while the remaining three are gray.</li> + <li>From 1s to 2s, the path below the "1" digit is red and square-shaped and the others are gray and u-shaped.</li> + <li>From 2s to 3s, the path below the "2" digit is red and square-shaped and the others are gray and u-shaped.</li> + <li>From 3s to 4s, the path below the "3" digit is red and square-shaped and the others are gray and u-shaped.</li> + <li>From 4s onwards, the path below the "4" digit is red and square-shaped and the others are gray and u-shaped.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-34-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="translate(40,0) scale(0.8)"> + <!-- GRAY SILHOUETTES INDICATING TIME IN SECONDS--> + <polygon points="248.5,38.5 276.5,22.5 298.5,19.5 316.5,26.5 332.5,40.5 331.5,57.5 322.5,70.5 307.5,76.5 314.5,80.5 324.5,86.5 333.5,99.5 333.5,121.5 327.5,130.5 312.5,143.5 292.5,149.5 270.5,148.5 248.5,142.5 252.5,114.5 267.5,119.5 282.5,119.5 297.5,115.5 304.5,109.5 295.5,99.5 284.5,92.5 277.5,84.5 270.5,74.5 281.5,66.5 293.5,60.5 297.5,50.5 292.5,45.5 281.5,45.5 274.5,49.5 266.5,53.5" fill="#ccc" stroke="rgb(0,0,0)" stroke-width="1"/> + + <polygon points="108.5,38.5 123.5,26.5 148.5,16.5 172.5,17.5 188.5,19.5 202.5,23.5 206.5,26.5 210.5,37.5 213.5,44.5 215.5,57.5 209.5,68.5 203.5,81.5 187.5,98.5 164.5,120.5 206.5,121.5 224.5,121.5 220.5,149.5 194.5,147.5 181.5,147.5 167.5,146.5 150.5,147.5 133.5,149.5 117.5,148.5 117.5,136.5 118.5,124.5 133.5,115.5 151.5,97.5 170.5,78.5 186.5,59.5 179.5,43.5 159.5,35.5 139.5,40.5 125.5,49.5" fill="#ccc" stroke="rgb(0,0,0)" stroke-width="1"/> + + <polygon points="26.5,32.5 33.5,32.5 40.5,29.5 47.5,23.5 61.5,17.5 73.5,16.5 74.5,33.5 73.5,50.5 73.5,64.5 72.5,77.5 72.5,90.5 72.5,105.5 71.5,126.5 89.5,128.5 90.5,138.5 89.5,151.5 72.5,151.5 54.5,152.5 38.5,152.5 27.5,152.5 28.5,139.5 30.5,127.5 44.5,125.5 46.5,112.5 47.5,99.5 46.5,87.5 48.5,73.5 48.5,53.5 34.5,52.5 22.5,52.5 22.5,51.5 22.5,41.5 22.5,33.5" fill="#ccc" stroke="rgb(0,0,0)" stroke-width="1"/> + + <polygon points="427.5,17.5 439.5,15.5 449.5,15.5 449.5,29.5 447.5,44.5 447.5,59.5 465.5,60.5 466.5,74.5 465.5,89.5 450.5,87.5 449.5,102.5 449.5,123.5 449.5,140.5 449.5,153.5 420.5,154.5 421.5,137.5 420.5,123.5 420.5,111.5 419.5,99.5 392.5,97.5 367.5,99.5 366.5,79.5 367.5,69.5 376.5,43.5 381.5,27.5 384.5,17.5 412.5,16.5 406.5,36.5 400.5,49.5 394.5,70.5 419.5,71.5 423.5,49.5 424.5,33.5" fill="#ccc" stroke="rgb(0,0,0)" stroke-width="1"/> + + <!-- FIRST TEST, POINTS--> + <polygon points="26.5,32.5 33.5,32.5 40.5,29.5 47.5,23.5 61.5,17.5 73.5,16.5 74.5,33.5 73.5,50.5 73.5,64.5 72.5,77.5 72.5,90.5 72.5,105.5 71.5,126.5 89.5,128.5 90.5,138.5 89.5,151.5 72.5,151.5 54.5,152.5 38.5,152.5 27.5,152.5 28.5,139.5 30.5,127.5 44.5,125.5 46.5,112.5 47.5,99.5 46.5,87.5 48.5,73.5 48.5,53.5 34.5,52.5 22.5,52.5 22.5,51.5 22.5,41.5 22.5,33.5" fill="rgb(204,0,102)" stroke="rgb(0,0,0)" stroke-width="4"> + <animate attributeName="points" values="26.5,32.5 33.5,32.5 40.5,29.5 47.5,23.5 61.5,17.5 73.5,16.5 74.5,33.5 73.5,50.5 73.5,64.5 72.5,77.5 72.5,90.5 72.5,105.5 71.5,126.5 89.5,128.5 90.5,138.5 89.5,151.5 72.5,151.5 54.5,152.5 38.5,152.5 27.5,152.5 28.5,139.5 30.5,127.5 44.5,125.5 46.5,112.5 47.5,99.5 46.5,87.5 48.5,73.5 48.5,53.5 34.5,52.5 22.5,52.5 22.5,51.5 22.5,41.5 22.5,33.5 ; 108.5,38.5 123.5,26.5 148.5,16.5 172.5,17.5 188.5,19.5 202.5,23.5 206.5,26.5 210.5,37.5 213.5,44.5 215.5,57.5 209.5,68.5 203.5,81.5 187.5,98.5 164.5,120.5 206.5,121.5 224.5,121.5 220.5,149.5 194.5,147.5 181.5,147.5 167.5,146.5 150.5,147.5 133.5,149.5 117.5,148.5 117.5,136.5 118.5,124.5 133.5,115.5 151.5,97.5 170.5,78.5 186.5,59.5 179.5,43.5 159.5,35.5 139.5,40.5 125.5,49.5; 248.5,38.5 276.5,22.5 298.5,19.5 316.5,26.5 332.5,40.5 331.5,57.5 322.5,70.5 307.5,76.5 314.5,80.5 324.5,86.5 333.5,99.5 333.5,121.5 327.5,130.5 312.5,143.5 292.5,149.5 270.5,148.5 248.5,142.5 252.5,114.5 267.5,119.5 282.5,119.5 297.5,115.5 304.5,109.5 295.5,99.5 284.5,92.5 277.5,84.5 270.5,74.5 281.5,66.5 293.5,60.5 297.5,50.5 292.5,45.5 281.5,45.5 274.5,49.5 266.5,53.5 ; 427.5,17.5 439.5,15.5 449.5,15.5 449.5,29.5 447.5,44.5 447.5,59.5 465.5,60.5 466.5,74.5 465.5,89.5 450.5,87.5 449.5,102.5 449.5,123.5 449.5,140.5 449.5,153.5 420.5,154.5 421.5,137.5 420.5,123.5 420.5,111.5 419.5,99.5 392.5,97.5 367.5,99.5 366.5,79.5 367.5,69.5 376.5,43.5 381.5,27.5 384.5,17.5 412.5,16.5 406.5,36.5 400.5,49.5 394.5,70.5 419.5,71.5 423.5,49.5 424.5,33.5" fill="freeze" begin="1" dur="3s"/> + + </polygon> + + + <!-- SECOND TEST, FILL-RULE--> + <g transform="scale(0.3) translate(-450, 500)"> + <path fill-rule="nonzero" fill="#ccc" stroke="none" d="M 500,100 L 500,300 700,300 700,100 550,100 550,250 650,250 650,100 500,100 z"> + <animate attributeName="fill-rule" values="nonzero; evenodd; evenodd; evenodd" begin="1" dur="4" fill="freeze"/> + <animate attributeName="fill" from="rgb(204,0,102)" to="#ccc" begin="0" dur="4" calcMode="discrete" fill="freeze"/> + </path> + </g> + <g transform="scale(0.3) translate(-30, 500)"> + <path fill-rule="evenodd" fill="#ccc" stroke="none" d="M 500,100 L 500,300 700,300 700,100 550,100 550,250 650,250 650,100 500,100 z"> + <animate attributeName="fill-rule" values="evenodd; nonzero; evenodd; evenodd" begin="1" dur="4" fill="freeze"/> + <animate attributeName="fill" from="#ccc" to="rgb(204,0,102)" begin="1" dur="2" calcMode="discrete" fill="remove"/> + </path> + </g> + <g transform="scale(0.3) translate(390, 500)"> + <path fill="#ccc" stroke="none" d="M 500,100 L 500,300 700,300 700,100 550,100 550,250 650,250 650,100 500,100 z"> + <animate attributeName="fill-rule" values="evenodd; evenodd; nonzero; evenodd" begin="1" dur="4" fill="freeze"/> + <animate attributeName="fill" from="#ccc" to="rgb(204,0,102)" begin="2" dur="2" calcMode="discrete" fill="remove"/> + </path> + </g> + <g transform="scale(0.3) translate(810, 500)"> + <path fill="#ccc" stroke="none" d="M 500,100 L 500,300 700,300 700,100 550,100 550,250 650,250 650,100 500,100 z"> + <animate attributeName="fill-rule" values="evenodd; evenodd; evenodd" begin="1" dur="3"/> + <animate attributeName="fill" from="#ccc" to="rgb(204,0,102)" begin="3" dur="2" calcMode="discrete" fill="freeze"/> + </path> + </g> + </g> + + + <text x="5" y="225" font-size="28">Animation on: 'points' and 'fill-rule'.</text> + <text x="5" y="255" font-size="18">Digit should match outline at indicated time.</text> + <text x="5" y="275" font-size="18">Filled square should follow morphing digit discretely.</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-35-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-35-t-manual.svg new file mode 100644 index 000000000..8ced2d966 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-35-t-manual.svg @@ -0,0 +1,150 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="VH" author="OA" status="issue" + version="$Revision: 1.8 $" testname="$RCSfile: animate-elem-35-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + The purpose of this test is to test animation of attributes stroke-dasharray, + stroke-dashoffset, stroke-miterlimit, stroke-linecap and stroke-linjoin. + </p> + <!-- this test is way too complicated and requires the tester to keep an eye on many things simultaneously. It has no well-defined pass criteria. The test should be split into several subtests. + --> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + + <p> + This file contains four tests, testing animation of five attributes. + The first test animates the stroke-dashoffset. There are seven reference polylines, all with + the same stroke-dasharray but with different values on their stroke-dashoffset. A red polyline + with the same stroke-dash array has an animation on its stroke-dasharray. The red polyline is + animated so that it stops by the reference polyline that has the right stroke-dashoffset at + that perticular time. + The second test animates stroke-linecap and stroke-linejoin. There are three reference + polylines. Comparsion is done in the same manner as in the previous test. + The third test animates the stroke-miterlimit. There are two sets offilled reference paths + (black) and two outlined paths (red) with animated stroke-miterlimit. The paths are shaped like + a capital A. In the upper test the animated path is drawn on top of the reference polygons and + in the lower test the reference path is drawn on top of the animated path. As the + stroke-miterlimit is animated to different values, different reference paths are used. To pass + the test, there should never be any part of the underlying geometry visible (black in the upper + or red in the lower). + The fourth test animates the stroke-dasharray. The initial stroke-dasharray gives a + short-dashed line. This pattern is animated into a pattern that on this short path gives a + solid line at 2 seconds. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + [[Describe the pass criteria of the test here. The pass criteria is what + should be displayed when the test is run.]] + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-35-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="translate(0,0) scale(0.9)"> + <g> + <g fill="none" stroke="gray" stroke-width="15"> + <g stroke="black"> + <polyline id="poly" stroke-dasharray="90,20,5,15" points="240,20,300,20,240,80,300,80"> + <animate begin="0" dur="10" attributeName="stroke-linecap" values="butt; round; square; square" keyTimes="0; 0.33; 0.66; 1" fill="freeze"/> + <animate begin="0" dur="10" attributeName="stroke-linejoin" values="miter; round; bevel; bevel" keyTimes="0; 0.33; 0.66; 1" fill="freeze"/> + </polyline> + <use x="0" y="0" stroke="red" stroke-width="1" xlink:href="#poly"/> + <animateTransform type="translate" begin="0" dur="10" values="0 0; 0 0; 0 95; 0 95; 0 190; 0 190" keyTimes="0; 0.3; 0.35; 0.65; 0.7; 1" attributeName="transform" fill="freeze"/> + </g> + <polyline id="poly1" stroke-linecap="butt" stroke-linejoin="miter" stroke-dasharray="90,20,5,15" points="140,20,200,20,140,80,200,80"/> + <polyline id="poly2" stroke-linecap="round" stroke-linejoin="round" stroke-dasharray="90,20,5,15" points="140,115,200,115,140,175,200,175"/> + <polyline id="poly3" stroke-linecap="square" stroke-linejoin="bevel" stroke-dasharray="90,20,5,15" points="140,210,200,210,140,270,200,270"/> + <use x="0" y="0" stroke="red" stroke-width="1" xlink:href="#poly1"/> + <use x="0" y="0" stroke="red" stroke-width="1" xlink:href="#poly2"/> + <use x="0" y="0" stroke="red" stroke-width="1" xlink:href="#poly3"/> + </g> + <g> + <polyline fill="none" stroke="gray" stroke-dashoffset="-50" stroke-dasharray="5,5,20" stroke-width="5" points="10,10,50,10,10,40,50,40"/> + <polyline fill="none" stroke="gray" stroke-dashoffset="-30" stroke-dasharray="5,5,20" stroke-width="5" points="10,50,50,50,10,80,50,80"/> + <polyline fill="none" stroke="gray" stroke-dashoffset="-10" stroke-dasharray="5,5,20" stroke-width="5" points="10,90,50,90,10,120,50,120"/> + <polyline fill="none" stroke="gray" stroke-dashoffset="0" stroke-dasharray="5,5,20" stroke-width="5" points="10,130,50,130,10,160,50,160"/> + <polyline fill="none" stroke="gray" stroke-dashoffset="10" stroke-dasharray="5,5,20" stroke-width="5" points="10,170,50,170,10,200,50,200"/> + <polyline fill="none" stroke="gray" stroke-dashoffset="30" stroke-dasharray="5,5,20" stroke-width="5" points="10,210,50,210,10,240,50,240"/> + <polyline fill="none" stroke="gray" stroke-dashoffset="50" stroke-dasharray="5,5,20" stroke-width="5" points="10,250,50,250,10,280,50,280"/> + </g> + <g> + <polyline fill="none" stroke="red" stroke-dasharray="5,5,20" stroke-width="5" points="60,10,100,10,60,40,100,40"> + <animate attributeName="stroke-dashoffset" begin="0" dur="10" values="-50; -50; -30; -30; -10; -10; 0; 0; 10; 10; 30; 30; 50; 50" keyTimes="0; 0.05; 0.1; 0.15; 0.2; 0.25; 0.3; 0.35; 0.4; 0.45; 0.5; 0.55; 0.6; 1" fill="freeze"/> + </polyline> + <animateTransform type="translate" begin="0" dur="10" values="0 0; 0 0; 0 40; 0 40; 0 80; 0 80; 0 120; 0 120; 0 160; 0 160; 0 200; 0 200; 0 240; 0 240" keyTimes="0; 0.05; 0.1; 0.15; 0.2; 0.25; 0.3; 0.35; 0.4; 0.45; 0.5; 0.55; 0.6; 1" attributeName="transform" fill="freeze"/> + </g> + </g> + <g id="miterLimit" visibility="hidden" transform="scale(2.5) translate(130 2)"> + <g id="reference"> + <g> + <path d="M16,51.1c0.8-2.9,2.5-9.2,3-11c2.1,0,8.9,0,11,0c0.5,1.7,2.5,8.2,3.3,11.1l1.9,1.4H47l1.9-2.6L33.8,1.4L31.9,0H17.5 l-1.9,1.4L0.8,49.9l1.9,2.6h11.4L16,51.1z M15.5,37.5c-0.8,2.9-2.5,9.2-3,11c-1.7,0-4.6,0-7.1,0C6.8,44,18.2,6.5,19,4 c2.1,0,9.3,0,11.4,0c0.8,2.5,12.5,40,13.9,44.5c-2.7,0-5.9,0-7.6,0c-0.5-1.7-2.5-8.2-3.3-11l-1.9-1.4H17.4L15.5,37.5z"/> + <path d="M22.3,9.8l-2.3,9.3l-2.9,10.2l1.9,2.6h10.7l1.9-2.6l-3-10.3c0,0-2.5-9.3-2.5-9.3L22.3,9.8z M23.9,20.1 c0,0,0.2-0.8,0.4-1.8c0.1,0.5,0.5,1.8,0.5,1.8s1.4,4.9,2.3,7.8c-2,0-3.4,0-5.4,0C22.5,25,23.9,20.1,23.9,20.1z"/> + <set attributeName="visibility" begin="0" dur="2" to="visible"/> + </g> + <g> + <path d="M31.9,0H16.1L0.8,49.9l1.9,2.6h12.9c0,0,2.8-10.2,3.4-12.5c2.1,0,8.9,0,11,0c0.7,2.2,3.7,12.5,3.7,12.5H47l1.9-2.6 L33.3,0H31.9z M30.4,4c0.8,2.5,12.5,40,13.9,44.5c-2.7,0-5.9,0-7.6,0c-0.7-2.2-3.7-12.5-3.7-12.5h-17c0,0-2.8,10.2-3.4,12.5 c-1.7,0-4.6,0-7.1,0C6.8,44,18.2,6.5,19,4C21.1,4,28.3,4,30.4,4z"/> + <path d="M22.3,9.8l-2.3,9.3l-2.9,10.2l1.9,2.6h10.7l1.9-2.6l-3-10.3c0,0-2.5-9.3-2.5-9.3L22.3,9.8z M23.9,20.1 c0,0,0.2-0.8,0.4-1.8c0.1,0.5,0.5,1.8,0.5,1.8s1.4,4.9,2.3,7.8c-2,0-3.4,0-5.4,0C22.5,25,23.9,20.1,23.9,20.1z"/> + <set attributeName="visibility" begin="2.5" dur="2" to="visible"/> + </g> + <g> + <path d="M31.9,0H16.1L0,52.5h15.6c0,0,2.8-10.2,3.4-12.5c2.1,0,8.9,0,11,0c0.7,2.2,3.7,12.5,3.7,12.5h16L33.3,0H31.9z M30.4,4 c0.8,2.5,12.5,40,13.9,44.5c-2.7,0-5.9,0-7.6,0c-0.7-2.2-3.7-12.5-3.7-12.5h-17c0,0-2.8,10.2-3.4,12.5c-1.7,0-4.6,0-7.1,0 C6.8,44,18.2,6.5,19,4C21.1,4,28.3,4,30.4,4z"/> + <path d="M22.3,9.8l-2.3,9.3l-3.7,12.8h16.1L28.7,19c0,0-2.5-9.3-2.5-9.3L22.3,9.8z M23.9,20.1c0,0,0.2-0.8,0.4-1.8 c0.1,0.5,0.5,1.8,0.5,1.8s1.4,4.9,2.3,7.8c-2,0-3.4,0-5.4,0C22.5,25,23.9,20.1,23.9,20.1z"/> + <set attributeName="visibility" begin="5" dur="2" to="visible"/> + </g> + <g> + <path d="M31.9,0H16.1L0,52.5h15.6c0,0,2.8-10.2,3.4-12.5c2.1,0,8.9,0,11,0c0.7,2.2,3.7,12.5,3.7,12.5h16L33.3,0H31.9z M30.4,4 c0.8,2.5,12.5,40,13.9,44.5c-2.7,0-5.9,0-7.6,0c-0.7-2.2-3.7-12.5-3.7-12.5h-17c0,0-2.8,10.2-3.4,12.5c-1.7,0-4.6,0-7.1,0 C6.8,44,18.2,6.5,19,4C21.1,4,28.3,4,30.4,4z"/> + <path d="M22.3,9.8l-2.3,9.3l-3.7,12.8h16.1L28.7,19c0,0-2.5-9.3-2.5-9.3l-2-7.6L22.3,9.8z M23.9,20.1c0,0,0.2-0.8,0.4-1.8 c0.1,0.5,0.5,1.8,0.5,1.8s1.4,4.9,2.3,7.8c-2,0-3.4,0-5.4,0C22.5,25,23.9,20.1,23.9,20.1z"/> + <set attributeName="visibility" begin="7.5" to="visible"/> + </g> + </g> + <g id="animated"> + <path fill="none" stroke="#FF0000" stroke-width="4" stroke-miterlimit="1" d="M17.5,38.1l-3.4,12.5H2.7L17.5,2h14.3L47,50.5 H35.2l-3.7-12.5H17.5z M29.8,29.9l-3-10.3C26,16.7,25,13,24.3,10.2c-0.6,2.9-1.5,6.6-2.3,9.4l-3,10.3H29.8z"> + <animate attributeName="stroke-miterlimit" attributeType="CSS" begin="0" dur="10" keyTimes="0; 0.2; 0.25; 0.45; 0.5; 0.7; 0.75; 1" fill="freeze" values="1; 1; 1.5; 1.5; 2; 2; 5; 5"/> + </path> + <set attributeName="visibility" begin="0" dur="2" to="visible"/> + <set attributeName="visibility" begin="2.5" dur="2" to="visible"/> + <set attributeName="visibility" begin="5" dur="2" to="visible"/> + <set attributeName="visibility" begin="7.5" to="visible"/> + </g> + <use x="0" y="60" xlink:href="#animated"/> + <use x="0" y="60" xlink:href="#reference"/> + </g> + <path fill="none" stroke="blue" stroke-width="10" stroke-dasharray="5" transform="translate(520 20) scale(1 2) rotate(90)" d="M15.2,5.4C5.5,10.1,1.1,18.8,2,31.7c14.8,32.1,138.9-59,127.8-19.7C112.1,75.3,42.2-8.8,15.2,5.4"> + <animate begin="1" dur="1" attributeName="stroke-dasharray" values="5; 500" keyTimes="0; 1" fill="freeze"/> + <animate begin="0" dur="10" attributeName="stroke-dashoffset" from="0" to="100"/> + </path> + </g> + <text x="5" y="280" font-size="18">Animation on: 'stroke-dasharray', 'stroke-dashoffset',</text> + <text x="5" y="305" font-size="18">'stroke-miterlimit', 'stroke-linecap' and 'stroke-linejoin'.</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-36-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-36-t-manual.svg new file mode 100644 index 000000000..460f76b82 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-36-t-manual.svg @@ -0,0 +1,149 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: animate-elem-36-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + This test validates the animation of the transform attribute on structure + elements, hyperlinks and text elements. + </p> + <p> + The test applies an <animateTransform> on various element types: <g>, + <use>, <image>, <switch>, <a> and <text>. In all + cases, the type is a rotation and all the elements should rotate together about + their centers, for 3s, starting at the document's load time. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if each of the seven flower-like shapes (the four above "<use>" + and the ones above "<g>", "<switch>" and "<a>"), the image and + the text "123" rotate clockwise, then anti-clockwise, then clockwise again, + over the course of a few seconds.</p> + <p>The static reference image shows the final state of the animation.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-36-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text text-anchor="middle" x="240" y="25" font-size="16"><animateTransform> on structure,</text> + <text text-anchor="middle" x="240" y="45" font-size="16">hyperlinking and text elements</text> + + <g transform="translate(0,0)"> + + <g transform="translate(60,90)"> + <g id="animatedG" fill="rgb(230,230,230)" stroke="rgb(255,180,0)"> + <animateTransform attributeName="transform" type="rotate" values="0;360;180;360" dur="3s"/> + + <path d="M0 0 C 30 0 30 0 30 -30 C 0 -30 0 -30 0 0 Z"/> + <path d="M0 0 C 30 0 30 0 30 -30 C 0 -30 0 -30 0 0 Z" transform="rotate(90)"/> + <path d="M0 0 C 30 0 30 0 30 -30 C 0 -30 0 -30 0 0 Z" transform="rotate(180)"/> + <path d="M0 0 C 30 0 30 0 30 -30 C 0 -30 0 -30 0 0 Z" transform="rotate(270)"/> + <rect x="-15" y="-15" width="30" height="30"/> + </g> + + <text y="60" text-anchor="middle"><g></text> + </g> + + <g transform="translate(180,110)"> + <g> + <use xlink:href="#animatedG" transform="translate(-20, -30) scale(0.4)"/> + <use xlink:href="#animatedG" transform="translate(-20, 0) scale(0.4)"/> + <use xlink:href="#animatedG" transform="translate(20, -30) scale(0.4)"/> + <use xlink:href="#animatedG" transform="translate(20, 0) scale(0.4)"/> + </g> + + <text y="40" text-anchor="middle"><use></text> + </g> + + <g transform="translate(300,90)"> + <image id="imageID" x="-30" y="-30" width="60" height="60" xlink:href="data:image/jpeg;base64,/9j/4AAQSkZJRgABAgEASABIAAD/4RX+RXhpZgAASUkqAAgAAAAJAA8BAgAGAAAAegAAABABAgAXAAAAgAAAABIBAwABAAAAAQAAABoBBQABAAAAoAAAABsBBQABAAAAqAAAACgBAwABAAAAAgAAADIBAgAUAAAAsAAAABMCAwABAAAAAQAAAGmHBAABAAAAxAAAAGYFAABDYW5vbgBDYW5vbiBESUdJVEFMIElYVVMgMzAwAAAAAAAAAAAAALQAAAABAAAAtAAAAAEAAAAyMDAyOjAxOjE1IDA0OjQyOjU4ABsAmoIFAAEAAABWAwAAnYIFAAEAAABeAwAAAJAHAAQAAAAwMjEwA5ACABQAAAAOAgAABJACABQAAAAiAgAAAZEHAAQAAAABAgMAApEFAAEAAAA+AwAAAZIKAAEAAABGAwAAApIFAAEAAABOAwAABJIKAAEAAABmAwAABZIFAAEAAABuAwAABpIFAAEAAAB2AwAAB5IDAAEAAAAFAAAACZIDAAEAAAAAAAAACpIFAAEAAAB+AwAAfJIHAJoBAACGAwAAhpIHAAgBAAA2AgAAAKAHAAQAAAAwMTAwAaADAAEAAAABAAAAAqADAAEAAABABgAAA6ADAAEAAACwBAAABaAEAAEAAAAwBQAADqIFAAEAAAAgBQAAD6IFAAEAAAAoBQAAEKIDAAEAAAACAAAAF6IDAAEAAAACAAAAAKMHAAEAAAADAAAAAAAAADIwMDI6MDE6MTUgMDQ6NDI6NTgAMjAwMjowMToxNSAwNDo0Mjo1OAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADAAAAAQAAAPUAAAAgAAAA1QAAACAAAAABAAAAyAAAAGQAAAAKAAAAAAAAAAMAAACs3QIAAAABAP//AADoAwAAMAEAACAAAAAMAAEAAwAmAAAAHAQAAAIAAwAEAAAAaAQAAAMAAwAEAAAAcAQAAAQAAwAaAAAAeAQAAAAAAwAGAAAArAQAAAAAAwAEAAAAuAQAAAYAAgAgAAAAwAQAAAcAAgAYAAAA4AQAAAgABAABAAAAcVYQAAkAAgAgAAAA+AQAABAABAABAAAAAAAEAQ0AAwAEAAAAGAUAAAAAAABMAAIAAAADAAEAAAAAAAQAAAABAAAAAAAAAAAAAAAAAAAAAwABAAEwAAD/////BgKtACAAdADVAP//AAAAAAAAAAAAAP//AABABkAGAgAwAdMAngAAAAAAAAAAADQAAACPAD8B1QD1AAAAAAAAAAEAAwAAAAAAAAAHMAAAAAAAAAAA//8AANUA+QAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAElNRzpESUdJVEFMIElYVVMgMzAwIEpQRUcAAAAAAAAARmlybXdhcmUgVmVyc2lvbiAxLjAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADAPQA9AD0AABqGADOAAAAgE8SAJsAAAAEAAEAAgAEAAAAUjk4AAIABwAEAAAAMDEwMAEQAwABAAAAQAYAAAIQAwABAAAAsAQAAAAAAAAGAAMBAwABAAAABgAAABoBBQABAAAAtAUAABsBBQABAAAAvAUAACgBAwABAAAAAgAAAAECBAABAAAA9AUAAAICBAABAAAA7g8AAAAAAAC0AAAAAQAAALQAAAABAAAA//////////////////////////////////////////////////9//////////////9j/2wCEAAkGBggGBQkIBwgKCQkLDRYPDQwMDRwTFRAWIR0jIiEcIB8kKTQsJCcxJx4fLT0tMTY3Ojo6Iio/RD44QjM3OTYBCQkJDAoMFAwMFA8KCgoPGhoKChoaTxoaGhoaT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT//AABEIAHgAoAMBIQACEQEDEQH/xAGiAAABBQEBAQEBAQAAAAAAAAAAAQIDBAUGBwgJCgsQAAIBAwMCBAMFBQQEAAABfQECAwAEEQUSITFBBhNRYQcicRQygZGhCCNCscEVUtHwJDNicoIJChYX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yjLsY19AaUzJHncWPrmsWro1TsC38J6tge4NONxBMAFc59FJrFprbU1Ti9HoD2sLJhmbHo3SmJZwA5Bj46dqqM7kygiVJkiB+YnPbPFMa9jfcFwSPek43dxqSSsNa7mUbvLVB7tSHUHWLcYmHtkHNCh5sXP5EB1p0TAtHx6g4/lU0OqQyLlrd93q4z+tVZ9G0LnXVCyXdw5/cBMf7uaga+uQwLxIT6gYqlHzZLl5KwNcs7ZljOT6UmYznkp+JFaIhjMRqM+ac/72aljDsR+/z9GqkTYk8uRTnex+rVIszIMfOSfamB//2apR82S5eSsDXLO2ZYzk+lJmM//Y/+0O2lBob3Rvc2hvcCAzLjAAOEJJTQPtClJlc29sdXRpb24AAAAAEABIAAAAAQACAEgAAAABAAI4QklNBA0YRlggR2xvYmFsIExpZ2h0aW5nIEFuZ2xlAAAAAAQAAAAeOEJJTQQZEkZYIEdsb2JhbCBBbHRpdHVkZQAAAAAEAAAAHjhCSU0D8wtQcmludCBGbGFncwAAAAkAAAAAAAAAAAEAOEJJTQQKDkNvcHlyaWdodCBGbGFnAAAAAAEAADhCSU0nEBRKYXBhbmVzZSBQcmludCBGbGFncwAAAAAKAAEAAAAAAAAAAjhCSU0D9RdDb2xvciBIYWxmdG9uZSBTZXR0aW5ncwAAAEgAL2ZmAAEAbGZmAAYAAAAAAAEAL2ZmAAEAoZmaAAYAAAAAAAEAMgAAAAEAWgAAAAYAAAAAAAEANQAAAAEALQAAAAYAAAAAAAE4QklNA/gXQ29sb3IgVHJhbnNmZXIgU2V0dGluZ3MAAABwAAD/////////////////////////////A+gAAAAA/////////////////////////////wPoAAAAAP////////////////////////////8D6AAAAAD/////////////////////////////A+gAADhCSU0ECAZHdWlkZXMAAAAAEAAAAAEAAAJAAAACQAAAAAA4QklNBB4NVVJMIG92ZXJyaWRlcwAAAAQAAAAAOEJJTQQaBlNsaWNlcwAAAAB3AAAABgAAAAAAAAAAAAAAWgAAAHgAAAALAG8AcABlAHIAYQBfAGgAbwB1AHMAZQAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAAAAAAAAAAAeAAA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"> + <animateTransform attributeName="transform" type="rotate" values="0;360;180;360" dur="3s"/> + </image> + <text y="60" text-anchor="middle"><image></text> + </g> + + <g transform="translate(420,90)"> + <switch id="animatedSwitch" fill="rgb(230,230,230)" stroke="rgb(255,180,0)"> + <g> + <path d="M0 0 C 30 0 30 0 30 -30 C 0 -30 0 -30 0 0 Z"/> + <path d="M0 0 C 30 0 30 0 30 -30 C 0 -30 0 -30 0 0 Z" transform="rotate(90)"/> + <path d="M0 0 C 30 0 30 0 30 -30 C 0 -30 0 -30 0 0 Z" transform="rotate(180)"/> + <path d="M0 0 C 30 0 30 0 30 -30 C 0 -30 0 -30 0 0 Z" transform="rotate(270)"/> + <rect x="-15" y="-15" width="30" height="30"/> + </g> + <g id="shouldNotShow"> + <rect x="-200" y="-200" width="400" height="400" fill="red"/> + </g> + <animateTransform attributeName="transform" type="rotate" values="0;360;180;360" dur="3s"/> + </switch> + + <text y="60" text-anchor="middle"><switch></text> + </g> + + + <g transform="translate(60,220)"> + <a id="animatedAnchor" xlink:href="" fill="rgb(230,230,230)" stroke="rgb(255,180,0)"> + <g> + <path d="M0 0 C 30 0 30 0 30 -30 C 0 -30 0 -30 0 0 Z"/> + <path d="M0 0 C 30 0 30 0 30 -30 C 0 -30 0 -30 0 0 Z" transform="rotate(90)"/> + <path d="M0 0 C 30 0 30 0 30 -30 C 0 -30 0 -30 0 0 Z" transform="rotate(180)"/> + <path d="M0 0 C 30 0 30 0 30 -30 C 0 -30 0 -30 0 0 Z" transform="rotate(270)"/> + <rect x="-15" y="-15" width="30" height="30"/> + </g> + <animateTransform attributeName="transform" type="rotate" values="0;360;180;360" dur="3s"/> + </a> + + <text y="60" text-anchor="middle"><a></text> + </g> + + <g transform="translate(180,220)"> + <defs> + <font id="MyDecFont" horiz-adv-x="466"> + <font-face font-family="MyDecFont"/> + <missing-glyph horiz-adv-x="233" d="M 50 0 L50 700 200 700 200 0 z"/> + <glyph unicode="1" glyph-name="one" horiz-adv-x="558" d="M458 716L100 534V428L357 552V97H241V380L140 328V0H458V716Z"/> + <glyph unicode="2" glyph-name="two" horiz-adv-x="585" d="M69 509Q82 523 102 541T147 575T203 603T268 614Q311 614 342 599T392 560T421 505T430 443Q430 420 423 398T405 352L343 201H444L492 309Q508 345 519 379T531 448Q531 504 511 552T454 635T369 691T262 711Q231 711 204 704T152 684T106 655T69 623V509ZM535 97H187L309 422Q316 441 315 457T306 483T287 500T265 506Q261 506 254 505T239 499T224 485T211 461L50 0H535V97Z"/> + <glyph unicode="3" glyph-name="three" horiz-adv-x="542" d="M58 553Q109 588 148 601T220 614Q255 614 282 604T328 575T356 535T366 488Q366 475 364 460T355 429T336 397T302 368Q311 363 325 353T352 326T376 286T386 232Q386 203 376 177T345 130T295 98T227 86Q179 86 134 104T50 153V45Q59 38 74 29T111 10T163 -5T231 -11Q296 -11 345 8T426 58T475 131T492 218Q492 251 486 276T469 320T446 354T421 378Q438 396 454 425T470 503Q470 546 454 584T406 650T332 695T233 711Q179 711 137 696T58 655V553ZM156 255Q156 229 173 212T217 194Q243 194 260 211T278 255Q278 281 261 298T217 316Q191 316 174 299T156 255ZM161 467Q161 444 177 428T216 412Q225 412 234 415T252 425T265 442T271 467Q271 491 256 506T216 522Q202 522 192 517T174 503T164 486T161 467Z"/> + </font> + </defs> + + <text id="textID" fill="rgb(230,230,230)" stroke="rgb(255,180,0)" font-family="MyDecFont" font-size="40" text-anchor="middle">123</text> + <animateTransform attributeName="transform" xlink:href="#textID" type="rotate" values="0;360;180;360" dur="3s"/> + + + <text y="60" text-anchor="middle"><text></text> + </g> + + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-37-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-37-t-manual.svg new file mode 100644 index 000000000..c6c6ee3fc --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-37-t-manual.svg @@ -0,0 +1,105 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="VH" author="OA" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-37-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + This test validates the animation of the transform attribute shape elements. + </p> + <p> + The test applies an <animateTransform> on various element + types: <g>, <use>, <image>, <switch>, + <a> and <text>. + In all cases the animation should run for 3s, starting at the document's load time. + The <circle> has a scale animation, and all the rest of the elements should rotate together about their centers. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if:</p> + <ul> + <li>each of the seven shapes rotates clockwise, then anti-clockwise, then clockwise again,</li> + <li>and the circle is scaled down, then up, then down again</li> + </ul> + <p>over the course of three seconds.</p> + <p>The static reference image shows the final state of the animation.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-37-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text text-anchor="middle" x="240" y="25" font-size="16"><animateTransform> shape elements</text> + <g transform="translate(0,0)"> + <g transform="translate(60,90)"> + <path id="pathID" fill="rgb(230,230,230)" stroke="rgb(255,180,0)" d="M 0 0 Q 30 0 30 -30 Q 0 -30 0 0 Q 0 -30 -30 -30 Q -30 0 0 0 Q -30 0 -30 30 Q 0 30 0 0 Q 0 30 30 30 Q30 0 0 0 Z"/> + <animateTransform attributeName="transform" xlink:href="#pathID" type="rotate" values="0;360;180;360" dur="3s"/> + <text y="60" text-anchor="middle"><path></text> + </g> + + <g transform="translate(180,90)"> + <rect id="rectID" fill="rgb(230,230,230)" stroke="rgb(255,180,0)" x="-30" y="-20" width="60" height="40"/> + <animateTransform attributeName="transform" xlink:href="#rectID" type="rotate" values="0;360;180;360" dur="3s"/> + <text y="60" text-anchor="middle"><rect></text> + </g> + + <g transform="translate(300,90)"> + <circle id="circleID" fill="rgb(230,230,230)" stroke="rgb(255,180,0)" r="30"/> + <animateTransform attributeName="transform" xlink:href="#circleID" type="scale" values="1;0.2;1.5;1" dur="3s"/> + <text y="60" text-anchor="middle"><circle></text> + </g> + + <g transform="translate(420,90)"> + <ellipse id="ellipseID" fill="rgb(230,230,230)" stroke="rgb(255,180,0)" rx="40" ry="20"/> + <animateTransform attributeName="transform" xlink:href="#ellipseID" type="rotate" values="0;360;180;360" dur="3s"/> + <text y="60" text-anchor="middle"><ellipse></text> + </g> + + <g transform="translate(60,220)"> + <line id="lineID" stroke="rgb(255,180,0)" stroke-width="10" stroke-linecap="round" x1="-30" y1="-20" x2="30" y2="20"/> + <animateTransform attributeName="transform" xlink:href="#lineID" type="rotate" values="0;360;180;360" dur="3s"/> + <text y="60" text-anchor="middle"><line></text> + </g> + + <g transform="translate(180,220)"> + <polyline id="polylineID" stroke="rgb(255,180,0)" stroke-width="10" stroke-linecap="round" fill="none" stroke-linejoin="round" points="-30 20 -30 -20 30 20 30 -20"/> + <animateTransform attributeName="transform" xlink:href="#polylineID" type="rotate" values="0;360;180;360" dur="3s"/> + <text y="60" text-anchor="middle"><polyline></text> + </g> + + <g transform="translate(300,220)"> + <polygon id="polygonID" fill="rgb(230,230,230)" stroke="rgb(255,180,0)" points="-30 20 -30 -20 30 20 30 -20"/> + <animateTransform attributeName="transform" xlink:href="#polygonID" type="rotate" values="0;360;180;360" dur="3s"/> + <text y="60" text-anchor="middle"><polygon></text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-38-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-38-t-manual.svg new file mode 100644 index 000000000..f9681c685 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-38-t-manual.svg @@ -0,0 +1,90 @@ +<svg version="1.1" baseProfile="tiny" preserveAspectRatio="none" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="VH, ED" author="OA" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-38-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + The purpose of this test is to test animation of the viewBox attribute. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The viewBox changes position and size + several times. At each new setting, a green indicator frame will flash a couple of times. + This frame must only appear at the edges of the SVG element. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-38-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g id="elk" fill="rgb(246,255,129)" stroke="rgb(0,0,0)" transform="translate(40 5) scale(0.9 0.9)"> + <path fill="rgb(191,48,0)" d="M39.4 149.4 C31 156.2 21.3 167 29.3 177.9 C39.6 191.8 60.5 190.6 70.3 176.5 C75.8 168.6 70.3 138.5 87.6 140.7 C101.1 142.4 97 174.9 96.6 184.7 C96.3 193.7 95.4 200.4 91.4 208.7 C88.2 215.2 82.2 221.7 81.6 228.7 C79.7 249.7 104.5 239.8 105.6 222.7 C106.7 205.9 101.8 190.2 103.6 173.7 C104.6 164.8 111 154.2 117.4 166.7 C121.5 174.8 117.1 183 115.6 190.7 C113.6 201 109 229.3 120.9 236.5 C134.1 244.5 141.3 215.2 139.7 205.7 C138.4 197.5 133.7 189.6 131.6 181.7 C130.7 178.3 126.2 161.8 128.8 158.9 C135.5 151.7 145.6 168.2 147.4 172.7 C150.5 180.4 150.3 189 147.8 196.7 C144.2 207.8 130.8 231.9 145.4 241.8 C166.7 256.2 164.8 218.6 163.4 208.7 C162.1 199.9 160.3 190.6 159.6 181.7 C158.7 169.5 163.8 167.6 175.4 167.7 C203.6 167.8 180.5 199.7 179.6 214.7 C179 224.2 183.4 236.6 194.7 237.7 C208.4 239 208.6 220.8 208.7 210.9 C208.9 189.8 197 171.5 198.9 150.8 C210.5 146.1 196.6 133.6 191.7 130.4 C182.6 124.5 172.3 122.1 161.7 120.6 C146.9 118.6 132 120.5 117.1 121 C110.5 121.2 104 121.4 97.5 120.1 C92.3 119 86.5 117.7 81.2 119.2 C77.7 120.2 71.6 122.5 68.6 124.6 C65.9 126.6 64.8 130.2 62.6 132.8 C56.4 140.2 46.8 143.3 39.5 149.3 z"/> + <path d="M165.2 86.7 C184 67.3 201.2 47.5 188.2 19.7 C182.1 6.5 153.5 -12.8 154.5 13.9 C154.9 24.4 160.7 29.8 165.5 37.7 C168.8 43.2 172 60.8 158.7 57.6 C150.8 55.7 152.3 40.9 139.5 47.8 C130.2 52.8 133.8 60.1 138.3 66.8 C142.2 72.8 149.3 79.3 141.5 86 C134.6 91.9 126.9 84 127.3 75.9 C111 72.5 123.3 89.9 124.3 95.8 C114.3 103.2 117.2 93.4 111.2 90 C103.8 85.6 97 92.4 97.2 98 C97.4 105.8 105.2 105.2 96.7 113 C94 115.4 90.6 116.8 87.2 117.7 C85.5 118.2 83.8 118.6 82.1 119 C81.6 119.1 77.9 119.7 79.4 120.6 C80.9 121.4 82.8 120.7 84.4 120.7 C86 120.6 87.6 120.5 89.2 120.3 C92.5 120 95.9 119.5 99.2 118.9 C106.1 117.6 113 115.9 119.6 113.6 C126.4 111.3 133 108.5 139.3 105.3 C145.4 102.2 151.3 98.5 156.7 94.3 C159.7 92 162.5 89.5 165.1 86.8 z"/> + <path d="M56.8 120.4 C57 120.6 57.3 120.8 57.5 121 C59.3 122.4 61.8 122.9 64.1 123.1 C65.3 123.3 66.6 123.3 67.8 123.4 C68.3 123.4 68.9 123.5 69.4 123.5 C69.7 123.5 70.5 123.3 70.8 123.6 C71.2 124.1 70.4 124.4 70.1 124.5 C68.8 125.1 67.3 124.7 66 124.9 C65.1 125 64.1 125.1 63.2 125.2 C59.5 125.5 55.8 125.8 52.1 126 C48.2 126.2 44.2 126.3 40.3 126.2 C36.4 126.1 32.5 125.8 28.6 125.3 C25 124.8 21.4 123.9 18 122.7 C14.9 121.5 11.8 120 9.2 117.9 C6.7 115.9 4.6 113.3 3.1 110.4 C1.5 107.1 0.7 103.3 0.6 99.6 C-0.1 81.8 22.3 81 17.9 99.6 C16.6 105.2 10.2 115 18.6 117.6 C28.6 120.7 26.5 109.2 24.8 104.7 C27.7 104.2 31.6 104.2 34.5 104.7 C34.3 109.3 33.6 117.7 40.6 117.6 C47.8 117.5 41.5 109.7 49.6 109.6 C57.6 109.5 53.3 116.4 56.9 120.3 z"/> + <path fill="rgb(255,255,255)" d="M71.5 129.8 C72.3 131.6 75.3 131.5 75.4 129.3 C75.5 126.5 70.2 126.8 71.5 129.8"/> + <path fill="rgb(255,255,255)" d="M80.1 130 C82.9 127.7 78.6 125 77.6 126.4 C76.6 127.9 77.6 132.1 80.1 130"/> + </g> + <g stroke-width="5" fill="none" stroke="none"> + <rect fill="none" x="0" y="0" width="300" height="300"> + <animateColor attributeName="stroke" values="green; white" begin="1" dur="0.2" repeatCount="5"/> + </rect> + <rect fill="none" x="100" y="100" width="100" height="100"> + <animateColor attributeName="stroke" values="green; white" begin="3" dur="0.2" repeatCount="5"/> + </rect> + <rect fill="none" x="0" y="100" width="100" height="100"> + <animateColor attributeName="stroke" values="green; white" begin="5" dur="0.2" repeatCount="5"/> + </rect> + <rect fill="none" x="200" y="0" width="100" height="100"> + <animateColor attributeName="stroke" values="green; white" begin="7" dur="0.2" repeatCount="5"/> + </rect> + <rect fill="none" x="100" y="0" width="200" height="200"> + <animateColor attributeName="stroke" values="green; white" begin="9" dur="0.2" repeatCount="5"/> + </rect> + <rect fill="none" x="0" y="100" width="200" height="200"> + <animateColor attributeName="stroke" values="green; white" begin="11" dur="0.2" repeatCount="5"/> + </rect> + <rect fill="none" x="0" y="100" width="300" height="200"> + <animateColor attributeName="stroke" values="green; white" begin="13" dur="0.2" repeatCount="5"/> + </rect> + <rect fill="none" x="0" y="0" width="300" height="300"> + <animateColor attributeName="stroke" values="green; white" begin="15" dur="0.2" repeatCount="5"/> + </rect> + </g> + <animate attributeName="viewBox" xlink:href="#svg-root" values="0 0 300 300; 0 0 300 300; 100 100 100 100; 100 100 100 100; 0 100 100 100; 0 100 100 100; 200 0 100 100; 200 0 100 100; 100 0 200 200; 100 0 200 200; 0 100 200 200; 0 100 200 200; 0 100 300 200; 0 100 300 200; 0 0 300 300; 0 0 300 300" keyTimes="0; 0.1; 0.15; 0.2; 0.25; 0.3; 0.35; 0.4; 0.45; 0.5; 0.55; 0.6; 0.65; 0.7; 0.75; 1" begin="0" dur="20" fill="freeze"/> + <text x="5" y="240" font-size="14">Animation on: 'viewBox'. Flashing frame should</text> + <text x="5" y="260" font-size="14">only appear at the edges of the SVG element.</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="298" height="298" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="298" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="'Arial Black', Arial, sans-serif" font-weight="bold" font-size="20" x="150" text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-39-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-39-t-manual.svg new file mode 100644 index 000000000..b21056630 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-39-t-manual.svg @@ -0,0 +1,158 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: animate-elem-39-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + This test validates that the xlink:href attribute can be animated on + the <a>, <image> and <use> elements, using the <animate> + or <set> animation elements. + </p> + <p> + For the <a> animation, showing on the left-most column, the number + indicates the number of the animation test currently linked by the xlink:href + attribute. For example, when the xlink:href animated value is "animate-elem-38-t.svg", + the text displays "38". When the user clicks on the displayed number, the user + agent should open the corresponding link. For example, if the user clicks on 38, + then the "animate-elem-38-t.svg" URI should be followed. If the user clicks on 02, + then the "animate-elem-02-t.svg" URI should be followed. + </p> + <p> + For the <image> animations, the image xlink:href attribute cycles through + two values showing a sun set and a picture of the sydney opera. The image should + change every second and the images shown by the <set> and <animate> + animations should always match. + </p> + <p> + For the <use> animations, the use xlink:href attribute cycles through + values "#useA" and "#useB" which reference text elements displaying values + "Use A" and "Use B". The change should happen every second and the text shown + for the two animations (<set> and <animation>) should always + match. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. Note each of the six subtests alternating (using animation) + between two states. (The pass criteria indicate what must be shown for + each of these.) Click on the top circle while it is showing "02": the + test animate-elem-02-t should be loaded. Go back, then click on the circle + again while it is showing "38": the test animate-elem-38-t should be + loaded. Go back again, then click on the bottom circle while it is showing + "03": the test animate-elem-03-t should be loaded. Go back again, then + click on the bottom circle while it is showing "09": the test animate-elem-09-t + should be loaded.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>Every one second, the document alternates between two states. In the first + state, the top circle shows the number "02", the bottom circle shows "03", + the two images show a picture of the Sydney Opera House, and the two 'use' + elements show the text "Use A". In the second state, the top circle shows + the number "38", the bottom circle shows "09", the two images show a + picture of some water and land, and the two 'use' elements show the text "Use B".</p> + <p>The test passes if the document does alternate between these two states, + and that clicking on the circles produces the behavior described in the operator + script.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-39-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text text-anchor="middle" x="240" y="25" font-size="16"><animate> on xlink:href</text> + <g> + <g transform="translate(60,90)"> + <text text-anchor="middle" font-size="20" y="10"><set></text> + </g> + + <g transform="translate(180,90)"> + <a xlink:href="animate-elem-38-t.svg" text-anchor="middle" font-size="30"> + <circle r="30" fill="rgb(230,230,230)" stroke="rgb(255,180,0)"/> + <text id="initialAnchor" y="10" fill="gray" font-weight="bold">38</text> + <text id="anchor1sto2s" y="10" display="none" fill="gray" font-weight="bold">02</text> + <set id="hideInitial" xlink:href="#initialAnchor" attributeName="display" to="none" begin="1s;showAnchor.end+1s" dur="1s"/> + <set id="showAnchor" xlink:href="#anchor1sto2s" attributeName="display" to="inline" begin="1s;showAnchor.end+1s" dur="1s"/> + <set attributeName="xlink:href" to="animate-elem-02-t.svg" begin="1s;showAnchor.end+1s" dur="1s"/> + </a> + <text y="60" text-anchor="middle"><a></text> + </g> + + <g transform="translate(300,90)"> + <image x="-30" y="-30" width="60" height="60" xlink:href="data:image/jpg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAgGBgcGBQgHBwcJCQgKDBQNDAsLDBkSEw8UHRofHh0aHBwgJC4nICIsIxwcKDcpLDAxNDQ0Hyc5PTgyPC4zNDL/2wBDAQkJCQwLDBgNDRgyIRwhMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjL/wAARCACWAPADASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwCeSMqeDUDsy1YkPzHNRMFYcVZkQiQ0MA9IyEdKi3EGmBNGm1s4qfft4xUUL+tPlyTmkApYOORUDwgnNSbyKazmgCExBKjZgOKfIfeqsmexpgS5pjPimKSOvShsUAO3UhamZwaM0XAUtTC1ISaYxxQIcZKUMDVctQJMUwLOQBUbPUfm571Gz0ASmT1pPMqAvTd+eKALHmVJG/FU2bpU8bDbQIsb6XfkVXLUm+gCcmmlqhLn1qNpTQBK0mKhaQ1E0hNRlz60DPdL3wtZSJuhY7vTFc3PogiLjBG2vR2RSN2eTVeS0jlydoyaxUjSx5dLYsoJ/Kqb2slej6h4YF1h4GEZA+7jrWHL4WvwTiLOKrmQrHGEMnFKrO3Hauqk8Iakwz5OfxqhPoF5bMVeI5HpT5kKzMXGDTTkGrU1u6HlGGPaoSuTRcLEDsfTNVmOauPGeMVXMYGRRcdiNVLew9aQxndjmpFyv0p/BpXHYrMpHQcUzNWG7iq7DFFxWGsaiZqcTUT5qrisNLU0tUbEimbzRcViQsRTC5phehW5p3AC5HXikZu4NIzgnBqMnkgdKLiLAk+TFPWYYxVUA460hYgUXAuebR5lVN+B1o83FMCyZKjZ6rmamGagCdnpuc1B5tAlFAH0/DMjBdzLgjPXn8qs74UVT5sY3HjkcmvNzeloEAY7lGDk1SmuZe7H86x5DTmPWTIoH31Xd709rmOEfPnIHXHBryOLUp04ErD8a0f+EguZLI27uSOxPUUuRhzHdNqINwGS4/dsfmTris3U5YZpd0Qf8TXCNfyq4becjvmtXT9euFYKyLKvcMKfLYL3NJ0Vuqg/UVUl063kB/dKCe4FaLSxTqGjj2e2c0wKaZOqOautJ8rkDcp71Rl0wldwGBXaiHdxjNB01JBgp+VJstHnxsip6UGzbGQK71PDTSyYjbI9CtWo/Bs2QCY+ffpWUp9jWMU9zzNrZh1FV5bc+len3PgmfaTHtY+max7vwffopb7MxUegzS9o1uh+zXRnnrxY7VA0ZrqLzSJYAd0bD6isO4gKk8VaqJkODRmOBUDAVPMCCaquSK0TIcRrtUXmEUrZNRsrelO5NhTIKXzRVdgRTc+tO4rFrzeKjL5qEvSZOKdwJGkqNpsVE7EVCz0XETtNTDNVctSUXAsed70omqtS5ouB699q96YbgNxmszz885qNpiG4oEavmDGKYZSOhrPFz60puPemBdMmTyc1agvFj6dayPPFAm9DSsO508GrumMYrWj1qMoPlG761wq3BHep1uXxwamw7neW2uxo+JVA9CBWzbatp/mI0rAq3pxivMFuXPerEVy4P3qhwRopntdv9nkUSQFGB6FTmpq8r0jV57KdSrttyMgHrXo1jdG8jSVJAUI5XPIqb8ulh2vqXqKKK0IK13p9texGOeFWB74rz/WvAUxkZrRQ6H07V6GblN5VQWI64oS6jZyhO1h2asZKDejszaLmlqtDwe/8K3UDHK9KxpdIdPvDFfQ89vpVxIwljgZ26lh1rnPEPha3kjBtLYAgc44FTzOO+pVlLbQ8Re0EYORUOwHjbXa3+gyRKzPGVA9a564tthIxWsZpmUoNGHLb9TVKSMrWvMhFUpVPpV3IsZxHNDNxgVM6e1QslVcViJue9QsKsFKQx0CKpBpOlWNpz0o8lmHAoAr5pc1aSwlkPCE1bTRbggfu2NAHSp5i9cUrPgVrLaof+WfNVZbdQ+Gjz9KLisUPMphmwetbUGjwzpyShP6VI3hZGK4vVBPXK8CjmHYwhL707z/Q1sf8IlL2vIf1qGfwrfQjKFZe/wAtHMg5WUllyKk+0EVHJp97CcNA59wM1CySg4KMCPUUXFYti4NWIrk+tZYdl68VNHLzSKSN22uG3A5NdVomoXNtKkiSlVzyPauDTUbO3dUnuIo3borMBWlb6/ZRswe6jTYdp3naM/j1rOSNIux7jbXcN1CssbDB7Z5FNmvIolO7dxxxXkUHj3R4ZAqagnTqARz7cVcX4j2Hli6e4nVNwQ74zjnufb3qOaTHZI6++8SPBKwFsEHYkdaxG1xjKXEh3H3qvfeIbR0Y3N5aokgyod1H5Vz8txalfNW6iCZxneMZ+tNRT3DmZ0iX09zOziXGBkjPXFMn8S3suY2mfaOwNYEN5H9n81Z9iMSqsT9/tx696jaRVjaRpokUfeZnAA+pp8qFzM15tSMibZlDg1hXllBMxKOR7EVTk1/ToLe3nnvEWKckIxz261W/4S/SI7l4ZZoNgAKSiQMH9RgdOtJRS2G5t7kVzp7rkqcismaFgeRVi/8AG2kxyokLGQM2GZBwo/GsmfxjZeaQsO+PnnJB/LFWibkjRjPSm/Zy3RKx7vxfv/49rNU93Oaz/wDhJb8H/WAY6YGP/wBdMR1JsWxnbUJtD3WufXxRqHmFy6MD/wAs9vA/rW1Z6/ZXD26zy+SZGKvu6JgdSfQ07isXYNOMhHyHHsK0Y9EUn5GGR2NVrvxxpljA0dknnuhATPCsPXNUJfiOxjBjsU3kDq5wD34x+XNK7DlOqs7VYX+WBSR61PPkj5uPYVwM3xB1F5SYre2jQjAUqTj3zmqM/jDUpY8C4KsR8xCjg+3FGo7HrEdwv8P61YWQ9SBiqxhsIb6Kza4HnSqXUYPQf5P5VOwsbS3upLq+j/dhmVN4U4Azjmi6JsyQsxG8Y/OpIZ3m+R+Rn1xWZL4j8O2OjRXpvIp7hkVvsqSqzKSOh+nes/V/iBolvGz6ZEk86kY3h1B9ccUuYq1jsF+zFcbXVvXORWhZ2M0jYWQFOxzkV4tffEzV5XkFvHaxIRhWER3D82IqhbfEbxLbyB/t4YLkhWiXH6CpalbQtNX1PdNQENusrzybNoJztyDxxyB3rhNV8ZaRbQuFheWUj5DjaD/X9K8y1PxLrGsuTf6hcTqWLbHc7R9F6CqcZ3OM80JNIXU6q/8AFl1dogtI1typyzcNn25FZ8muapLuzd4yMfKij+QrP59KQjHWldhYa13dCYyNK5cnO7POfrSG4dslmJJPNRuwZT7VEHFVuIs+aaa0p5wTUYYnpSEHqQaVhjjKcdaDM5Xbk49M1F1oyfSmIe0zkAFiQowAT0pnmtyAxApDyM0zApgP3EjqaazcUH5elNJoAaTSFqDSUwDdTaO9GOKAD+VGaM8YpKYDqKTPvRmgB2SKaTRSHpQBoTXt5cyB57mZ2HG53JxVfcWbG+vRZNNsZUAkt0K/e+YHrVc6JpbAf6Ehz0IyKCbnCKuO5p231JruP7E0zBzbJgdfmPH601tE00/dthn/AHm/xoC5xDKvZj75FRHA9PrXbNomnA8W5HH981EdD05j/qj/AN/DQHMccM+9WrZgDgjntXS/2Dp/aJ/++zR/YtiuMI4P+8c0mrjUjDLtjOOKjZmP0rffTbNE+VXJ9N1EWkW03WORT7sKiw7nMOdoNMT5m7j1rso/C1vO3MjAZwMHOa1NP+HtvdsoW5I3gENjIpOpGO5ShJ7I4IMMYHFLgHAzz3r1uL4P2rKS2pENzgbCMn8cUyb4VWEPJ1FiMfeGCM/gay9tDuaeyn2PI5UAwV/Koeetel3ngPT4CQL0kYz82Af51jSeGLJM7Jy2O/StI1IshwaONPTJBNIsbsM4OK6d9AgDEZOKfBpVtBuDJnjjJq29NCDlXBXr+lM2n0rop9KtyxIX9TVc6dAvGz9apCuYRBHem4OO9bhsYP7lJ9hg/uUxcyMPn0o/A1tmxg/ufrQbKD+5QHMjEo4rZNjAf4f1phsYM48tvrziiwcyMmjFaxsIB/AfzNJ9jgH8P60BzIyiDTTxWr9lhx939aabWEn7v60D5jvPMLEDG9c5xtzj9aTMxxtBAPXA5FM2yDlZuOmM/wCAoInONzp7k5oIHNCXGGyfrzmkEW1cjP600RlckTAnPJ3daBIATudyTwOn5Uhjdw28cj1I61EzEMdx2jvyP6VO7K+FLLnPQn/Cojhckuvt83+NMGG3IGORjseRSFycLhgcYwf/AK1ROA+0CQY7ndmkjXYpETqc9BvJoET5kw3G/wCnaiPerYZl+h7fz/lUexmxtbkcnDEf0qaBXbA37SOSwPbtUsuJqWkjAKfMKg84GP8AP4V1ulWaTywsty5c/KcFuM9+D6etc5a217wIIl8tgAXYYAPXrg811NgbuO3dN0yuDx5TBR9STnofpXFVZ2U0bB2WiYNxwPk+8VCe5Bb+Z/KoiFETPayo8GfnbBIB6HgY7nr7VqCO4FlHI9vdGfaN0v2mNdgz6nGB+tU5hIYpJWjicsBmVJ0JI5Gdy/1zWFja5yuphoJn2Mp3ccRcj3weT/8AXrmr53OCeVJI5Qiuk1SCJpI/LkuEduVEeBz6bsA/l+NYFzatuSNRIqYyD5mc++StdFMwmY0yvkHcB6Z//VVNzKe5/E1eeHaXkEko74ZVOPpxVNuR8+T6/d/pXTE52VmLHrx7VBLnGc1LhS3Q4HrUUuMVojNkJJ9qQUE+lMzVEj80mabnPWjpmgBSaaaM5ppNAgJzTSaMnv8ApSE5NAxpNITRznGePpTT9f0pDOzbMeAsasPRmP8AQUfIGy6rgnquT/SociRM4IHokf8A9fNIpAHLOQOMYyKBFjY3O1VK+7Y/pQ3AIXH54FQiT5QAsjHrkjA/PFMkuiv3lAXPJYhR+HNAyUgqcEoAenem+WVbkHb7etVJJlL7oU3Hvtbr/jTPtJ3/ALxYoh6SOOfwoAszADHyhCOhxz/OkDcA/Mw75O0f41Cwt8h2iXI7quf5ZpAIw29Rj6gj+dAizh8kpGioT134P8quRxr5gaUEHHeXkj6nOD+FUgQcKY5H3cDbz/WrFu6RzbzPiRzjPlud3PJzzUSZpFHR6YJkkUQmZiOTHK4YBe/GMEf5wa6PT3AKpZt5sSNmRZAYmP4bea57TL6ztrp0ku/MRR8ojtmBDY/hIHXjk961LTxH5kbwqr+dsJDNHODuIP8AdHPOeCMVxTu+h2waXU68HUtryWpgYAYEUriTH0GAV+gqtcNqgjUmxtwSoD+XO6que5AQ/wBPxzWJNaC809mkURLt2YH2iLJ654znp3B7UQ2MMcI8vUb6SVU2BopC8n4EqD9M/wD1qyt3LK+qWstxGy3V3LK2MILd3Axkcnt2/KuYntoLJWtpLRmIO4FQWJP/AAIjity60+aMSKL67kBUbkkk3BjjPIMTZrMe2t1sWRJn3sG2iNN/Ab/cAwORnA5raDsZS1OflmkjY7rCTG3gJEmMe/P9apySg5PksMdeB1/CtKZGA8pzJweoTB/+vxWPKjHAjkuGDD1PP6V1ROaRFLIoJAjYc1Wdtx5B/GpHDA4eTOfUkf0qBgAfvc/jWqMmITjtgUzdz1FKSfqKYeRnFMQ7PNJmm5Pekz6/yoAcTSHmkzSZoAX6HFN6Um8HvmgmgAJPpSA0lJuOSMEUhnWpAVJCJEM8Z2AfyFVrm3cxly21ccgMeg+mKKKCRY4IvKDCNSo7Hn+eaHRbcFhCgwMkK2Pb0oooGRP5QI326sTwPnNMVLUSErbjOeh6UUUATIsTqc7wM9AelBgiWNmCbgP7x70UUDKwlt4jkxFivJJAresLkTW8twYd4jXP+sKHrjsD/k0UVEldGkXZ6F2yne5PlLugDjARX3pgezDg/nXX2HzXS2gjEkhUOqySMI24z8w57e1FFcdXex1U9rl+GDVFcNZQWUEkxJVvPkA465CBc9B61japp3jGBWVNbtTF5WXzH82D77ST+dFFTFJMJSdjBNvrJuUtry7t7kQLkFlIPQnGRjP3epqp9g1YiW6E1pDHCmfLi34OTjr17+tFFboybdzHv7y/uLl55JUl52AtuXgcDgHFZpkmkXcywj5scKT/ADooreKVjCTdyCVmJwZGAPZQAKYVZcKDRRVEkbsQeSSTTCc8UUVQCZpM0UUgAg/hTM0UUxDHlCEAg0gmDHABoopFBvyO9LuJoooEf//Z"> + <set attributeName="xlink:href" id="imageHrefSet" to="data:image/jpeg;base64,/9j/4AAQSkZJRgABAgEASABIAAD/4RX+RXhpZgAASUkqAAgAAAAJAA8BAgAGAAAAegAAABABAgAXAAAAgAAAABIBAwABAAAAAQAAABoBBQABAAAAoAAAABsBBQABAAAAqAAAACgBAwABAAAAAgAAADIBAgAUAAAAsAAAABMCAwABAAAAAQAAAGmHBAABAAAAxAAAAGYFAABDYW5vbgBDYW5vbiBESUdJVEFMIElYVVMgMzAwAAAAAAAAAAAAALQAAAABAAAAtAAAAAEAAAAyMDAyOjAxOjE1IDA0OjQyOjU4ABsAmoIFAAEAAABWAwAAnYIFAAEAAABeAwAAAJAHAAQAAAAwMjEwA5ACABQAAAAOAgAABJACABQAAAAiAgAAAZEHAAQAAAABAgMAApEFAAEAAAA+AwAAAZIKAAEAAABGAwAAApIFAAEAAABOAwAABJIKAAEAAABmAwAABZIFAAEAAABuAwAABpIFAAEAAAB2AwAAB5IDAAEAAAAFAAAACZIDAAEAAAAAAAAACpIFAAEAAAB+AwAAfJIHAJoBAACGAwAAhpIHAAgBAAA2AgAAAKAHAAQAAAAwMTAwAaADAAEAAAABAAAAAqADAAEAAABABgAAA6ADAAEAAACwBAAABaAEAAEAAAAwBQAADqIFAAEAAAAgBQAAD6IFAAEAAAAoBQAAEKIDAAEAAAACAAAAF6IDAAEAAAACAAAAAKMHAAEAAAADAAAAAAAAADIwMDI6MDE6MTUgMDQ6NDI6NTgAMjAwMjowMToxNSAwNDo0Mjo1OAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADAAAAAQAAAPUAAAAgAAAA1QAAACAAAAABAAAAyAAAAGQAAAAKAAAAAAAAAAMAAACs3QIAAAABAP//AADoAwAAMAEAACAAAAAMAAEAAwAmAAAAHAQAAAIAAwAEAAAAaAQAAAMAAwAEAAAAcAQAAAQAAwAaAAAAeAQAAAAAAwAGAAAArAQAAAAAAwAEAAAAuAQAAAYAAgAgAAAAwAQAAAcAAgAYAAAA4AQAAAgABAABAAAAcVYQAAkAAgAgAAAA+AQAABAABAABAAAAAAAEAQ0AAwAEAAAAGAUAAAAAAABMAAIAAAADAAEAAAAAAAQAAAABAAAAAAAAAAAAAAAAAAAAAwABAAEwAAD/////BgKtACAAdADVAP//AAAAAAAAAAAAAP//AABABkAGAgAwAdMAngAAAAAAAAAAADQAAACPAD8B1QD1AAAAAAAAAAEAAwAAAAAAAAAHMAAAAAAAAAAA//8AANUA+QAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAElNRzpESUdJVEFMIElYVVMgMzAwIEpQRUcAAAAAAAAARmlybXdhcmUgVmVyc2lvbiAxLjAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADAPQA9AD0AABqGADOAAAAgE8SAJsAAAAEAAEAAgAEAAAAUjk4AAIABwAEAAAAMDEwMAEQAwABAAAAQAYAAAIQAwABAAAAsAQAAAAAAAAGAAMBAwABAAAABgAAABoBBQABAAAAtAUAABsBBQABAAAAvAUAACgBAwABAAAAAgAAAAECBAABAAAA9AUAAAICBAABAAAA7g8AAAAAAAC0AAAAAQAAALQAAAABAAAA//////////////////////////////////////////////////9//////////////9j/2wCEAAkGBggGBQkIBwgKCQkLDRYPDQwMDRwTFRAWIR0jIiEcIB8kKTQsJCcxJx4fLT0tMTY3Ojo6Iio/RD44QjM3OTYBCQkJDAoMFAwMFA8KCgoPGhoKChoaTxoaGhoaT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT//AABEIAHgAoAMBIQACEQEDEQH/xAGiAAABBQEBAQEBAQAAAAAAAAAAAQIDBAUGBwgJCgsQAAIBAwMCBAMFBQQEAAABfQECAwAEEQUSITFBBhNRYQcicRQygZGhCCNCscEVUtHwJDNicoIJChYX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yjLsY19AaUzJHncWPrmsWro1TsC38J6tge4NONxBMAFc59FJrFprbU1Ti9HoD2sLJhmbHo3SmJZwA5Bj46dqqM7kygiVJkiB+YnPbPFMa9jfcFwSPek43dxqSSsNa7mUbvLVB7tSHUHWLcYmHtkHNCh5sXP5EB1p0TAtHx6g4/lU0OqQyLlrd93q4z+tVZ9G0LnXVCyXdw5/cBMf7uaga+uQwLxIT6gYqlHzZLl5KwNcs7ZljOT6UmYznkp+JFaIhjMRqM+ac/72aljDsR+/z9GqkTYk8uRTnex+rVIszIMfOSfamB//2apR82S5eSsDXLO2ZYzk+lJmM//Y/+0O2lBob3Rvc2hvcCAzLjAAOEJJTQPtClJlc29sdXRpb24AAAAAEABIAAAAAQACAEgAAAABAAI4QklNBA0YRlggR2xvYmFsIExpZ2h0aW5nIEFuZ2xlAAAAAAQAAAAeOEJJTQQZEkZYIEdsb2JhbCBBbHRpdHVkZQAAAAAEAAAAHjhCSU0D8wtQcmludCBGbGFncwAAAAkAAAAAAAAAAAEAOEJJTQQKDkNvcHlyaWdodCBGbGFnAAAAAAEAADhCSU0nEBRKYXBhbmVzZSBQcmludCBGbGFncwAAAAAKAAEAAAAAAAAAAjhCSU0D9RdDb2xvciBIYWxmdG9uZSBTZXR0aW5ncwAAAEgAL2ZmAAEAbGZmAAYAAAAAAAEAL2ZmAAEAoZmaAAYAAAAAAAEAMgAAAAEAWgAAAAYAAAAAAAEANQAAAAEALQAAAAYAAAAAAAE4QklNA/gXQ29sb3IgVHJhbnNmZXIgU2V0dGluZ3MAAABwAAD/////////////////////////////A+gAAAAA/////////////////////////////wPoAAAAAP////////////////////////////8D6AAAAAD/////////////////////////////A+gAADhCSU0ECAZHdWlkZXMAAAAAEAAAAAEAAAJAAAACQAAAAAA4QklNBB4NVVJMIG92ZXJyaWRlcwAAAAQAAAAAOEJJTQQaBlNsaWNlcwAAAAB3AAAABgAAAAAAAAAAAAAAWgAAAHgAAAALAG8AcABlAHIAYQBfAGgAbwB1AHMAZQAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAAAAAAAAAAAeAAA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" begin="1s;imageHrefSet.end+1s" dur="1s"/> + </image> + <text y="60" text-anchor="middle"><image></text> + </g> + + <g transform="translate(420,90)"> + <defs> + <text id="useA">Use A</text> + <text id="useB">Use B</text> + <text id="useC">Use C</text> + </defs> + + <use xlink:href="#useA" font-size="30" fill="rgb(230,230,230)" text-anchor="middle" stroke="rgb(255,180,0)" font-weight="bold"> + <set id="useSet" attributeName="xlink:href" to="#useB" begin="0s;useSet.end+1s" dur="1s"/> + </use> + + <text y="60" text-anchor="middle"><use></text> + </g> + + <g transform="translate(60,210)"> + <text text-anchor="middle" font-size="20" y="10"><animate></text> + </g> + + <g transform="translate(180,210)"> + <a xlink:href="animate-elem-09-t.svg" text-anchor="middle" font-size="30"> + <circle r="30" fill="rgb(230,230,230)" stroke="rgb(255,180,0)"/> + <text id="initialAnchor2" y="10" fill="gray" font-weight="bold">09</text> + <text id="anchor1sto2s2" y="10" display="none" fill="gray" font-weight="bold">03</text> + <set id="hideInitial2" xlink:href="#initialAnchor2" attributeName="display" to="none" begin="1s;showAnchor2.end+1s" dur="1s"/> + <set id="showAnchor2" xlink:href="#anchor1sto2s2" attributeName="display" to="inline" begin="1s;showAnchor2.end+1s" dur="1s"/> + <animate attributeName="xlink:href" from="animate-elem-09-t.svg" to="animate-elem-03-t.svg" begin="0s;showAnchor2.end" dur="2s"/> + </a> + <text y="60" text-anchor="middle"><a></text> + </g> + + <g transform="translate(300,210)"> + <image x="-30" y="-30" width="60" height="60" xlink:href="data:image/jpg;base64,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"> + <animate attributeName="xlink:href" id="imageHrefAnimate" begin="1s;imageHrefAnimate.end" dur="2s" to="data:image/jpg;base64,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" from="data:image/jpeg;base64,/9j/4AAQSkZJRgABAgEASABIAAD/4RX+RXhpZgAASUkqAAgAAAAJAA8BAgAGAAAAegAAABABAgAXAAAAgAAAABIBAwABAAAAAQAAABoBBQABAAAAoAAAABsBBQABAAAAqAAAACgBAwABAAAAAgAAADIBAgAUAAAAsAAAABMCAwABAAAAAQAAAGmHBAABAAAAxAAAAGYFAABDYW5vbgBDYW5vbiBESUdJVEFMIElYVVMgMzAwAAAAAAAAAAAAALQAAAABAAAAtAAAAAEAAAAyMDAyOjAxOjE1IDA0OjQyOjU4ABsAmoIFAAEAAABWAwAAnYIFAAEAAABeAwAAAJAHAAQAAAAwMjEwA5ACABQAAAAOAgAABJACABQAAAAiAgAAAZEHAAQAAAABAgMAApEFAAEAAAA+AwAAAZIKAAEAAABGAwAAApIFAAEAAABOAwAABJIKAAEAAABmAwAABZIFAAEAAABuAwAABpIFAAEAAAB2AwAAB5IDAAEAAAAFAAAACZIDAAEAAAAAAAAACpIFAAEAAAB+AwAAfJIHAJoBAACGAwAAhpIHAAgBAAA2AgAAAKAHAAQAAAAwMTAwAaADAAEAAAABAAAAAqADAAEAAABABgAAA6ADAAEAAACwBAAABaAEAAEAAAAwBQAADqIFAAEAAAAgBQAAD6IFAAEAAAAoBQAAEKIDAAEAAAACAAAAF6IDAAEAAAACAAAAAKMHAAEAAAADAAAAAAAAADIwMDI6MDE6MTUgMDQ6NDI6NTgAMjAwMjowMToxNSAwNDo0Mjo1OAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADAAAAAQAAAPUAAAAgAAAA1QAAACAAAAABAAAAyAAAAGQAAAAKAAAAAAAAAAMAAACs3QIAAAABAP//AADoAwAAMAEAACAAAAAMAAEAAwAmAAAAHAQAAAIAAwAEAAAAaAQAAAMAAwAEAAAAcAQAAAQAAwAaAAAAeAQAAAAAAwAGAAAArAQAAAAAAwAEAAAAuAQAAAYAAgAgAAAAwAQAAAcAAgAYAAAA4AQAAAgABAABAAAAcVYQAAkAAgAgAAAA+AQAABAABAABAAAAAAAEAQ0AAwAEAAAAGAUAAAAAAABMAAIAAAADAAEAAAAAAAQAAAABAAAAAAAAAAAAAAAAAAAAAwABAAEwAAD/////BgKtACAAdADVAP//AAAAAAAAAAAAAP//AABABkAGAgAwAdMAngAAAAAAAAAAADQAAACPAD8B1QD1AAAAAAAAAAEAAwAAAAAAAAAHMAAAAAAAAAAA//8AANUA+QAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAElNRzpESUdJVEFMIElYVVMgMzAwIEpQRUcAAAAAAAAARmlybXdhcmUgVmVyc2lvbiAxLjAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADAPQA9AD0AABqGADOAAAAgE8SAJsAAAAEAAEAAgAEAAAAUjk4AAIABwAEAAAAMDEwMAEQAwABAAAAQAYAAAIQAwABAAAAsAQAAAAAAAAGAAMBAwABAAAABgAAABoBBQABAAAAtAUAABsBBQABAAAAvAUAACgBAwABAAAAAgAAAAECBAABAAAA9AUAAAICBAABAAAA7g8AAAAAAAC0AAAAAQAAALQAAAABAAAA//////////////////////////////////////////////////9//////////////9j/2wCEAAkGBggGBQkIBwgKCQkLDRYPDQwMDRwTFRAWIR0jIiEcIB8kKTQsJCcxJx4fLT0tMTY3Ojo6Iio/RD44QjM3OTYBCQkJDAoMFAwMFA8KCgoPGhoKChoaTxoaGhoaT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT//AABEIAHgAoAMBIQACEQEDEQH/xAGiAAABBQEBAQEBAQAAAAAAAAAAAQIDBAUGBwgJCgsQAAIBAwMCBAMFBQQEAAABfQECAwAEEQUSITFBBhNRYQcicRQygZGhCCNCscEVUtHwJDNicoIJChYX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yjLsY19AaUzJHncWPrmsWro1TsC38J6tge4NONxBMAFc59FJrFprbU1Ti9HoD2sLJhmbHo3SmJZwA5Bj46dqqM7kygiVJkiB+YnPbPFMa9jfcFwSPek43dxqSSsNa7mUbvLVB7tSHUHWLcYmHtkHNCh5sXP5EB1p0TAtHx6g4/lU0OqQyLlrd93q4z+tVZ9G0LnXVCyXdw5/cBMf7uaga+uQwLxIT6gYqlHzZLl5KwNcs7ZljOT6UmYznkp+JFaIhjMRqM+ac/72aljDsR+/z9GqkTYk8uRTnex+rVIszIMfOSfamB//2apR82S5eSsDXLO2ZYzk+lJmM//Y/+0O2lBob3Rvc2hvcCAzLjAAOEJJTQPtClJlc29sdXRpb24AAAAAEABIAAAAAQACAEgAAAABAAI4QklNBA0YRlggR2xvYmFsIExpZ2h0aW5nIEFuZ2xlAAAAAAQAAAAeOEJJTQQZEkZYIEdsb2JhbCBBbHRpdHVkZQAAAAAEAAAAHjhCSU0D8wtQcmludCBGbGFncwAAAAkAAAAAAAAAAAEAOEJJTQQKDkNvcHlyaWdodCBGbGFnAAAAAAEAADhCSU0nEBRKYXBhbmVzZSBQcmludCBGbGFncwAAAAAKAAEAAAAAAAAAAjhCSU0D9RdDb2xvciBIYWxmdG9uZSBTZXR0aW5ncwAAAEgAL2ZmAAEAbGZmAAYAAAAAAAEAL2ZmAAEAoZmaAAYAAAAAAAEAMgAAAAEAWgAAAAYAAAAAAAEANQAAAAEALQAAAAYAAAAAAAE4QklNA/gXQ29sb3IgVHJhbnNmZXIgU2V0dGluZ3MAAABwAAD/////////////////////////////A+gAAAAA/////////////////////////////wPoAAAAAP////////////////////////////8D6AAAAAD/////////////////////////////A+gAADhCSU0ECAZHdWlkZXMAAAAAEAAAAAEAAAJAAAACQAAAAAA4QklNBB4NVVJMIG92ZXJyaWRlcwAAAAQAAAAAOEJJTQQaBlNsaWNlcwAAAAB3AAAABgAAAAAAAAAAAAAAWgAAAHgAAAALAG8AcABlAHIAYQBfAGgAbwB1AHMAZQAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAAAAAAAAAAAeAAA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"/> + </image> + <text y="60" text-anchor="middle"><image></text> + </g> + + <g transform="translate(420,210)"> + <use xlink:href="#useA" font-size="30" fill="rgb(230,230,230)" text-anchor="middle" stroke="rgb(255,180,0)" font-weight="bold"> + <animate id="useAnimate" attributeName="xlink:href" from="#useB" to="#useA" begin="0s;useAnimate.end" dur="2s"/> + </use> + + <text y="60" text-anchor="middle"><use></text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-40-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-40-t-manual.svg new file mode 100644 index 000000000..c019e9766 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-40-t-manual.svg @@ -0,0 +1,239 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-40-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + This test validates that the x and y attributes can be animated on + <use>, <image>, <rect> and <text> elements. + The test also validates that the width and height attributes can + be animated on <image> and <rect> + </p> + <p> + For x and y animation, each test shows the reference positions at + specific points in the animation. These markers are highlighted + at the time the target element's x/y position should match that of + the marker. For the <text> element, there are two tests. The + first one tests animating a single value on the text's x and y attributes. + The second one tests animating x, y values where there are values for each + of the text's characters. For that test (bottom left), there is a set of + reference markers for each of the characters ('1' and '2'). + </p> + <p> + For width and height animation (the two tests on the bottom right), the + outline showing the expected width and height at given points in the animation + is highlighted at the time the marker's width and height should match that + of the target element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>Over the course of four seconds, the positions and sizes of elements + within the document are animated. The test passes if the following + conditions are met:</p> + <ul> + <li>In the first four subtests, the shape, image or text moves clockwise once along + the perimeter of a square whose corners are indicated by the small grey squares.</li> + <li>In the fifth subtest ("x/y on <text>(2)"), the number "1" moves clockwise + along the perimeter of a square as in the first four subtests, while the number "2" + does the same except in an anti-clockise direction.</li> + <li>In the sixth subtest, the width and height of the image are animated continously, + from the initial square size, to the wide and short rectangle, to the narrow and + tall rectangle, and back to the square. At each point when it reaches one of these + key sizes, the yellow outline indicating the size is shown thicker momentarily. + This animation takes only three seconds.</li> + <li>In the seventh subtest, the gray rectangle's width and height are animated in + the same way as the image in the sixth subtest.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-40-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text text-anchor="middle" x="240" y="25" font-size="16"><animate> of x/y/width/height</text> + + <g font-size="14"> + <g transform="translate(60,90)"> + <defs> + <rect id="posMarker" x="-3" y="-3" width="6" height="6"/> + + <g id="markerGroup" fill="rgb(230,230,230)" stroke="rgb(255,180,0)"> + <use id="topLeft" xlink:href="#posMarker" x="-15" y="-15"/> + <use id="topRight" xlink:href="#posMarker" x="15" y="-15"/> + <use id="bottomRight" xlink:href="#posMarker" x="15" y="15"/> + <use id="bottomLeft" xlink:href="#posMarker" x="-15" y="15"/> + <set xlink:href="#topLeft" attributeName="fill" to="rgb(255,180,0)" begin="0s;4s" dur="0.2s"/> + <set xlink:href="#topRight" attributeName="fill" to="rgb(255,180,0)" begin="1s" dur="0.2s"/> + <set xlink:href="#bottomRight" attributeName="fill" to="rgb(255,180,0)" begin="2s" dur="0.2s"/> + <set xlink:href="#bottomLeft" attributeName="fill" to="rgb(255,180,0)" begin="3s" dur="0.2s"/> + </g> + + <path id="pathID" d="M 0 0 Q 20 0 20 -20 Q 0 -20 0 0 Q 0 -20 -20 -20 Q -20 0 0 0 Q -20 0 -20 20 Q 0 20 0 0 Q 0 20 20 20 Q20 0 0 0 Z" fill="rgb(230,230,230)" stroke="rgb(255,180,0)"/> + </defs> + + <use xlink:href="#pathID" x="-15" y="-15"> + <animate attributeName="x" values="-15;15;15;-15;-15" begin="0s" dur="4s"/> + <animate attributeName="y" values="-15;-15;15;15;-15" begin="0s" dur="4s"/> + </use> + + <use xlink:href="#markerGroup"/> + + <text text-anchor="middle" y="60">x/y on <use></text> + </g> + + <g transform="translate(180,90)"> + <image xlink:href="data:image/jpg;base64,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" x="-15" y="-15" width="50" height="50" preserveAspectRatio="none"> + <animate attributeName="x" values="-15;15;15;-15;-15" begin="0s" dur="4s"/> + <animate attributeName="y" values="-15;-15;15;15;-15" begin="0s" dur="4s"/> + </image> + + <use xlink:href="#markerGroup"/> + + <text text-anchor="middle" y="60">x/y on <image></text> + </g> + + <g transform="translate(300,90)"> + <rect x="-15" y="-15" width="50" height="20" fill="black" stroke="rgb(255,180,0)"> + <animate attributeName="x" values="-15;15;15;-15;-15" begin="0s" dur="4s"/> + <animate attributeName="y" values="-15;-15;15;15;-15" begin="0s" dur="4s"/> + </rect> + + <use xlink:href="#markerGroup"/> + + <text text-anchor="middle" y="60">x/y on <rect></text> + </g> + + + <g transform="translate(300,90)"> + <rect x="-15" y="-15" width="50" height="20" fill="black" stroke="rgb(255,180,0)"> + <animate attributeName="x" values="-15;15;15;-15;-15" begin="0s" dur="4s"/> + <animate attributeName="y" values="-15;-15;15;15;-15" begin="0s" dur="4s"/> + </rect> + + <use xlink:href="#markerGroup"/> + + <text text-anchor="middle" y="60">x/y on <rect></text> + </g> + + <g transform="translate(420,90)"> + <defs> + <font id="MyDecFont" horiz-adv-x="466"> + <font-face font-family="MyDecFont"/> + <missing-glyph horiz-adv-x="233" d="M 50 0 L50 700 200 700 200 0 z"/> + <glyph unicode="1" glyph-name="one" horiz-adv-x="558" d="M458 716L100 534V428L357 552V97H241V380L140 328V0H458V716Z"/> + <glyph unicode="2" glyph-name="two" horiz-adv-x="585" d="M69 509Q82 523 102 541T147 575T203 603T268 614Q311 614 342 599T392 560T421 505T430 443Q430 420 423 398T405 352L343 201H444L492 309Q508 345 519 379T531 448Q531 504 511 552T454 635T369 691T262 711Q231 711 204 704T152 684T106 655T69 623V509ZM535 97H187L309 422Q316 441 315 457T306 483T287 500T265 506Q261 506 254 505T239 499T224 485T211 461L50 0H535V97Z"/> + <glyph unicode="3" glyph-name="three" horiz-adv-x="542" d="M58 553Q109 588 148 601T220 614Q255 614 282 604T328 575T356 535T366 488Q366 475 364 460T355 429T336 397T302 368Q311 363 325 353T352 326T376 286T386 232Q386 203 376 177T345 130T295 98T227 86Q179 86 134 104T50 153V45Q59 38 74 29T111 10T163 -5T231 -11Q296 -11 345 8T426 58T475 131T492 218Q492 251 486 276T469 320T446 354T421 378Q438 396 454 425T470 503Q470 546 454 584T406 650T332 695T233 711Q179 711 137 696T58 655V553ZM156 255Q156 229 173 212T217 194Q243 194 260 211T278 255Q278 281 261 298T217 316Q191 316 174 299T156 255ZM161 467Q161 444 177 428T216 412Q225 412 234 415T252 425T265 442T271 467Q271 491 256 506T216 522Q202 522 192 517T174 503T164 486T161 467Z"/> + </font> + </defs> + + <text id="textID" fill="rgb(230,230,230)" stroke="rgb(255,180,0)" font-family="MyDecFont" font-size="40" x="-15" y="-15">123</text> + <animate xlink:href="#textID" attributeName="x" values="-15;15;15;-15;-15" begin="0s" dur="4s"/> + <animate xlink:href="#textID" attributeName="y" values="-15;-15;15;15;-15" begin="0s" dur="4s"/> + + + <use xlink:href="#markerGroup"/> + + <text text-anchor="middle" y="60">x/y on <text></text> + </g> + + + <g transform="translate(60,210)"> + <defs> + <g id="markerGroup2" fill="rgb(230,230,230)" stroke="rgb(255,180,0)"> + <use id="topLeft2" xlink:href="#posMarker" x="-15" y="-15"/> + <use id="topRight2" xlink:href="#posMarker" x="15" y="-15"/> + <use id="bottomRight2" xlink:href="#posMarker" x="15" y="15"/> + <use id="bottomLeft2" xlink:href="#posMarker" x="-15" y="15"/> + <set xlink:href="#topLeft2" attributeName="fill" to="rgb(255,180,0)" begin="0s;4s" dur="0.2s"/> + <set xlink:href="#topRight2" attributeName="fill" to="rgb(255,180,0)" begin="3s" dur="0.2s"/> + <set xlink:href="#bottomRight2" attributeName="fill" to="rgb(255,180,0)" begin="2s" dur="0.2s"/> + <set xlink:href="#bottomLeft2" attributeName="fill" to="rgb(255,180,0)" begin="1s" dur="0.2s"/> + </g> + </defs> + + <text id="text2ID" fill="rgb(230,230,230)" stroke="rgb(255,180,0)" font-family="MyDecFont" font-size="40" x="-35 5" y="-15 -15">12</text> + <animate xlink:href="#text2ID" attributeName="x" values="-35 5;-5 5;-5 35;-35 35;-35 5" begin="0s" dur="4s"/> + <animate xlink:href="#text2ID" attributeName="y" values="-15 -15;-15 15;15 15;15 -15;-15 -15" begin="0s" dur="4s"/> + + <use xlink:href="#markerGroup" x="-20"/> + <use xlink:href="#markerGroup2" x="20"/> + + <text text-anchor="middle" y="60">x/y on <text>(2)</text> + </g> + + <g transform="translate(180,210)"> + <image xlink:href="data:image/jpg;base64,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" x="-40" y="-40" width="50" height="50" preserveAspectRatio="none"> + <animate attributeName="width" values="50;80;20;50" begin="0s" dur="3s"/> + <animate attributeName="height" values="50;20;80;50" begin="0s" dur="3s"/> + </image> + + <rect x="-40" y="-40" width="50" height="50" stroke="rgb(255,180,0)" fill="none"> + <set attributeName="stroke-width" to="4" begin="0s;3s" dur="0.2s"/> + </rect> + + <rect x="-40" y="-40" width="80" height="20" stroke="rgb(255,180,0)" fill="none"> + <set attributeName="stroke-width" to="4" begin="1s" dur="0.2s"/> + </rect> + + <rect x="-40" y="-40" width="20" height="80" stroke="rgb(255,180,0)" fill="none"> + <set attributeName="stroke-width" to="4" begin="2s" dur="0.2s"/> + </rect> + + <text text-anchor="middle" y="60">width/height</text> + <text text-anchor="middle" y="75">on <image></text> + </g> + + + <g transform="translate(300,210)"> + <rect x="-40" y="-40" width="50" height="50" fill="gray"> + <animate attributeName="width" values="50;80;20;50" begin="0s" dur="3s"/> + <animate attributeName="height" values="50;20;80;50" begin="0s" dur="3s"/> + </rect> + + <rect x="-40" y="-40" width="50" height="50" stroke="rgb(255,180,0)" fill="none"> + <set attributeName="stroke-width" to="4" begin="0s;3s" dur="0.2s"/> + </rect> + + <rect x="-40" y="-40" width="80" height="20" stroke="rgb(255,180,0)" fill="none"> + <set attributeName="stroke-width" to="4" begin="1s" dur="0.2s"/> + </rect> + + <rect x="-40" y="-40" width="20" height="80" stroke="rgb(255,180,0)" fill="none"> + <set attributeName="stroke-width" to="4" begin="2s" dur="0.2s"/> + </rect> + + <text text-anchor="middle" y="60">width/height</text> + <text text-anchor="middle" y="75">on <rect></text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-41-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-41-t-manual.svg new file mode 100644 index 000000000..fbba0e7b6 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-41-t-manual.svg @@ -0,0 +1,445 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN, CM" author="VH" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: animate-elem-41-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + This test validates the operation of the animate element on the various graphics + properties. This test is very similar to animate-elem-78-t which uses the set element + instead of the animate element to modify graphics properties. + </p> + <p> + For each of the graphics properties, there are three tests. One animates the graphics + property directly on an element (such as a rect or a line) which uses the + property. The other two tests apply the animation on a container element (g and + a), and validate that the animated property is inherited by elements which + are child of the container. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + There are 11 graphics properties that are animated, and for each of these, + they are animated in one of three different ways (the three columns). The + three animations in each row must be the same. + </p> + <p> + For each animation test, the element on which the animation is applied is also + translated by an animation so that the various states of the animation can + be checked more easily: + </p> + <ul> + <li>For those tests that have two light gray silhouettes + (fill-rule, stroke-linecap, stroke-linejoin, stroke-miterlimit and stroke-dashoffset), + the animated element's shape must be the same as the left silouhette at the + start of the animation and the same as the right silhouette at the end of + the animation.</li> + <li>For the continous paint animations (fill, stroke and color), + three references shapes show the color that the animated element must be + at the start, middle and end of the animation.</li> + <li>For the stroke-width test, the two dark gray reference shapes show the + width of the short, animated horizontal line must be at the start and the end + of the animation.</li> + <li>For the display and visibility tests, the single light gray silhouette + shows the position the animated element must be at at the start of the animation. + At the end of the animation, these animated elements must not be visible.</li> + </ul> + <p> + The following animations must show continuous changes: fill, stroke, + stroke-width, stroke-dashoffset and color. + </p> + <p> + The following animations must show discrete animation changes: fill-rule, stroke-linecap, + stroke-linejoin, stroke-miterlimit, display and visibility. The point at which + the change takes place must be half way through the animation, except for the + stroke-miter animation, which must change a quarter of the way through. + (Note that visually, stroke-miterlimit shows a sharp transition even though its value + is animated continuously, but that is because the miter is cut off when + the animated miter limit reaches the test sharp angle's miter value.) + </p> + <p>The test passes if all of the above criteria are met.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-41-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text text-anchor="middle" x="240" y="25" font-size="20">graphics</text> + <g transform="translate(80, 75)"> + <g transform="translate(30,10)" text-anchor="end" font-size="12"> + <text>fill</text> + <text y="20">fill-rule</text> + <text y="40">stroke</text> + <text y="60">stroke-width</text> + <text y="80">stroke-linecap</text> + <text y="100">stroke-linejoin</text> + <text y="120">stroke-miterlimit</text> + <text y="140">stroke-dashoffset</text> + <text y="160">display</text> + <text y="180">visibility</text> + <text y="200">color</text> + </g> + + <g id="type" transform="translate(90, -20)" text-anchor="middle" font-size="14"> + <text x="20" y="3">element</text> + <text x="130" y="3"><g></text> + <text x="235" y="3"><a></text> + </g> + + <g transform="translate(80,0)" fill="rgb(204,0,102)"> + <g id="setZero"> + <defs> + <g id="animateZeroRef"> + <rect x="10" y="-6" width="8" height="4" fill="rgb(204,0,102)"/> + <rect x="10" y="-6" width="8" height="4" fill="rgb(230,82,51)" transform="translate(15,0)"/> + <rect x="10" y="-6" width="8" height="4" fill="rgb(255,165,0)" transform="translate(30,0)"/> + </g> + </defs> + <use xlink:href="#animateZeroRef"/> + <use xlink:href="#animateZeroRef" x="110"/> + <use xlink:href="#animateZeroRef" x="220"/> + + <rect x="10" width="8" height="8" fill="rgb(204,0,102)"> + <animate attributeName="fill" to="rgb(255,165,0)" dur="3s" fill="freeze"/> + <animate attributeName="x" to="40" dur="3s" fill="freeze"/> + </rect> + + <g transform="translate(110, 0)"> + <rect x="10" width="8" height="8"/> + <animate attributeName="fill" to="rgb(255,165,0)" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + </g> + + <a xlink:href="" transform="translate(220, 0)"> + <rect x="10" width="8" height="8"/> + <animate attributeName="fill" to="rgb(255,165,0)" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + </a> + + </g> + + <g id="setOne" transform="translate(5,15)" stroke="rgb(204,0,102)"> + <defs> + <g id="setOneRef" fill="#ccc" stroke="none"> + <polyline stroke-width="1" points="20,10,0,10,15,20,10,2,5,20,20,10"/> + <polyline fill-rule="evenodd" stroke-width="1" points="20,10,0,10,15,20,10,2,5,20,20,10" transform="translate(30,0)"/> + </g> + </defs> + <use xlink:href="#setOneRef"/> + <use xlink:href="#setOneRef" x="110"/> + <use xlink:href="#setOneRef" x="220"/> + + <polyline points="20,10,0,10,15,20,10,2,5,20,20,10"> + <animate attributeName="fill-rule" from="nonzero" to="evenodd" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + </polyline> + + <g transform="translate(110, 0)"> + <animate attributeName="fill-rule" from="nonzero" to="evenodd" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + <polyline points="20,10,0,10,15,20,10,2,5,20,20,10"/> + </g> + + <a xlink:href="" transform="translate(220, 0)"> + <animate attributeName="fill-rule" from="nonzero" to="evenodd" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + <polyline points="20,10,0,10,15,20,10,2,5,20,20,10"/> + </a> + + </g> + + <g id="setTwo" transform="translate(0,45)" fill="none"> + <defs> + <g id="setTwoRef" fill="none" stroke-width="4"> + <rect x="10" width="8" height="8" stroke="rgb(204,0,102)"/> + <rect x="10" width="8" height="8" transform="translate(15,0)" stroke="rgb(230,82,51)"/> + <rect x="10" width="8" height="8" transform="translate(30,0)" stroke="rgb(255,165,0)"/> + + </g> + </defs> + <use xlink:href="#setTwoRef"/> + <use xlink:href="#setTwoRef" x="110"/> + <use xlink:href="#setTwoRef" x="220"/> + + <rect x="10" width="8" height="8" stroke-width="3"> + <animate attributeName="stroke" from="rgb(204,0,102)" to="rgb(255,165,0)" dur="3s"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + </rect> + + <g transform="translate(110, 0)"> + <animate attributeName="stroke" from="rgb(204,0,102)" to="rgb(255,165,0)" dur="3s"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + <rect x="10" width="8" height="8" stroke-width="3"/> + </g> + + <a xlink:href="" transform="translate(220, 0)"> + <animate attributeName="stroke" from="rgb(204,0,102)" to="rgb(255,165,0)" dur="3s"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + <rect x="10" width="8" height="8" stroke-width="3"/> + </a> + </g> + + <g id="setThree" transform="translate(0,60)"> + <defs> + <g id="setThreeRef"> + <line x1="10" y1="3" x2="20" y2="3" stroke-width="1" stroke="gray"/> + <line x1="10" y1="3" x2="20" y2="3" stroke-width="5" stroke="gray" transform="translate(30,0)"/> + </g> + </defs> + + <use xlink:href="#setThreeRef"/> + <use xlink:href="#setThreeRef" x="110"/> + <use xlink:href="#setThreeRef" x="220"/> + + <line x1="10" y1="8" x2="20" y2="8" stroke="gray"> + <animate attributeName="stroke-width" from="1" to="5" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + </line> + + <g transform="translate(110, 0)"> + <animate attributeName="stroke-width" from="1" to="5" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + <line x1="10" y1="8" x2="20" y2="8" stroke="gray"/> + </g> + + <a xlink:href="" transform="translate(220, 0)"> + <animate attributeName="stroke-width" from="1" to="5" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + <line x1="10" y1="8" x2="20" y2="8" stroke="gray"/> + </a> + </g> + + <g id="setFour" transform="translate(0,80)" stroke-width="4" stroke="rgb(204,0,102)"> + <defs> + <g id="setFourRef" stroke-width="12"> + <line x1="10" y1="8" x2="12" y2="8" stroke="#ccc"/> + <line x1="10" y1="8" x2="12" y2="8" stroke-linecap="round" stroke="#ccc" transform="translate(30,0)"/> + </g> + </defs> + <use xlink:href="#setFourRef"/> + <use xlink:href="#setFourRef" x="110"/> + <use xlink:href="#setFourRef" x="220"/> + + <line x1="10" y1="8" x2="12" y2="8" stroke-width="12"> + <animate attributeName="stroke-linecap" from="butt" to="round" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + </line> + + <g transform="translate(110, 0)"> + <animate attributeName="stroke-linecap" from="butt" to="round" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + <line x1="10" y1="8" x2="12" y2="8" stroke-width="12"/> + </g> + + <a xlink:href="" transform="translate(220, 0)"> + <animate attributeName="stroke-linecap" from="butt" to="round" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + <line x1="10" y1="8" x2="12" y2="8" stroke-width="12"/> + </a> + </g> + + <g id="setFive" transform="translate(5,100)" fill="none" stroke-miterlimit="10" stroke-width="3" stroke="rgb(204,0,102)"> + <defs> + <g id="setFiveRef"> + <polyline stroke="#ccc" points="5,2,20,5,5,8"/> + <polyline stroke="#ccc" points="5,2,20,5,5,8" stroke-linejoin="bevel" transform="translate(30,0)"/> + </g> + </defs> + <use xlink:href="#setFiveRef"/> + <use xlink:href="#setFiveRef" x="110"/> + <use xlink:href="#setFiveRef" x="220"/> + + <polyline points="5,2,20,5,5,8"> + <animate attributeName="stroke-linejoin" from="miter" to="bevel" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + </polyline> + + <g transform="translate(110, 0)"> + <animate attributeName="stroke-linejoin" from="miter" to="bevel" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + <polyline points="5,2,20,5,5,8"/> + </g> + + <a xlink:href="" transform="translate(220, 0)"> + <animate attributeName="stroke-linejoin" from="miter" to="bevel" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + <polyline points="5,2,20,5,5,8"/> + </a> + </g> + + <g id="setSix" transform="translate(5,120)" stroke-miterlimit="1" fill="none" stroke-width="3" stroke="rgb(204,0,102)"> + <defs> + <g id="setSixRef"> + <polyline points="5,0,20,5,5,10" stroke="#ccc"/> + <polyline points="5,0,20,5,5,10" stroke="#ccc" stroke-miterlimit="10" transform="translate(30,0)"/> + </g> + </defs> + <use xlink:href="#setSixRef"/> + <use xlink:href="#setSixRef" x="110"/> + <use xlink:href="#setSixRef" x="220"/> + + <polyline points="5,0,20,5,5,10"> + <animate attributeName="stroke-miterlimit" from="1" to="10" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + </polyline> + + <g transform="translate(110, 0)"> + <animate attributeName="stroke-miterlimit" from="1" to="10" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + <polyline points="5,0,20,5,5,10"/> + </g> + + <a xlink:href="" transform="translate(220, 0)"> + <animate attributeName="stroke-miterlimit" from="1" to="10" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + <polyline points="5,0,20,5,5,10"/> + </a> + + </g> + + <g id="setSeven" transform="translate(-5,145)" stroke-dasharray="3,4,5" stroke-width="3" stroke="rgb(204,0,102)"> + <defs> + <g id="setSevenRef"> + <line x1="0" y1="0" x2="25" y2="0" stroke="#ccc"/> + <line x1="0" y1="0" x2="25" y2="0" stroke="#ccc" stroke-dashoffset="5.5" transform="translate(40,0)"/> + </g> + </defs> + <use xlink:href="#setSevenRef"/> + <use xlink:href="#setSevenRef" x="110"/> + <use xlink:href="#setSevenRef" x="220"/> + + <line x1="0" y1="0" x2="25" y2="0"> + <animate attributeName="stroke-dashoffset" from="0" to="5.5" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="40" dur="3s" fill="freeze" additive="sum"/> + </line> + + <g transform="translate(110, 0)"> + <animate attributeName="stroke-dashoffset" from="0" to="5.5" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="40" dur="3s" fill="freeze" additive="sum"/> + <line x1="0" y1="0" x2="25" y2="0"/> + </g> + + <a xlink:href="" transform="translate(220, 0)"> + <animate attributeName="stroke-dashoffset" from="0" to="5.5" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="40" dur="3s" fill="freeze" additive="sum"/> + <line x1="0" y1="0" x2="25" y2="0"/> + </a> + </g> + + <g id="setEight" transform="translate(0,160)"> + <defs> + <g id="setEightRef"> + <rect x="10" width="8" height="8" fill="#ccc"/> + <rect x="10" width="8" height="8" fill="#ccc" transform="translate(30,0)" display="none"/> + </g> + </defs> + <use xlink:href="#setEightRef"/> + <use xlink:href="#setEightRef" x="110"/> + <use xlink:href="#setEightRef" x="220"/> + <rect x="10" width="8" height="8"> + <animate attributeName="display" from="inline" to="none" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + </rect> + + <g transform="translate(110, 0)"> + <animate attributeName="display" from="inline" to="none" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + <rect x="10" width="8" height="8"/> + </g> + + <a xlink:href="" transform="translate(220, 0)"> + <animate attributeName="display" from="inline" to="none" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + <rect x="10" width="8" height="8"/> + </a> + </g> + + <g id="setNine" transform="translate(0,180)"> + <defs> + <g id="setNineRef"> + <rect x="10" width="8" height="8" fill="#ccc"/> + </g> + </defs> + <use xlink:href="#setNineRef"/> + <use xlink:href="#setNineRef" x="110"/> + <use xlink:href="#setNineRef" x="220"/> + + <rect x="10" width="8" height="8"> + <animate attributeName="visibility" from="visible" to="hidden" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + </rect> + + <g transform="translate(110, 0)"> + <animate attributeName="visibility" from="visible" to="hidden" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + <rect x="10" width="8" height="8"/> + </g> + + <a xlink:href="" transform="translate(220, 0)"> + <animate attributeName="visibility" from="visible" to="hidden" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + <rect x="10" width="8" height="8"/> + </a> + </g> + + <g id="setTen" color="rgb(204,0,102)" transform="translate(0,200)"> + <defs> + <g id="animateTenRef"> + <rect x="10" y="-6" width="8" height="4" fill="rgb(204,0,102)"/> + <rect x="10" y="-6" width="8" height="4" fill="rgb(230,82,51)" transform="translate(15,0)"/> + <rect x="10" y="-6" width="8" height="4" fill="rgb(255,165,0)" transform="translate(30,0)"/> + </g> + </defs> + <use xlink:href="#animateTenRef"/> + <use xlink:href="#animateTenRef" x="110"/> + <use xlink:href="#animateTenRef" x="220"/> + + <rect x="10" width="8" height="8" fill="currentColor"> + <animate attributeName="color" from="rgb(204,0,102)" to="rgb(255,165,0)" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + </rect> + + <g transform="translate(110, 0)" fill="currentColor"> + <animate attributeName="color" from="rgb(204,0,102)" to="rgb(255,165,0)" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + <rect x="10" width="8" height="8"/> + </g> + + <a xlink:href="" transform="translate(220, 0)" fill="currentColor"> + <animate attributeName="color" from="rgb(204,0,102)" to="rgb(255,165,0)" dur="3s" fill="freeze"/> + <animateTransform type="translate" attributeName="transform" from="0" to="30" dur="3s" fill="freeze" additive="sum"/> + <rect x="10" width="8" height="8"/> + </a> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-44-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-44-t-manual.svg new file mode 100644 index 000000000..3c75b6d3a --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-44-t-manual.svg @@ -0,0 +1,94 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="OA" author="SH" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-44-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + The purpose of this test is to test animation of the d + attribute of the path element. + </p> + <p> + This test consists of a path, specified as a series of + lineto commands, whose d attribute is animated. + The path morphs between the numbers 1, 2, 3, and 4. + The gray outlines indicates the expected position of the polygon at 1, 2, 3 and 4s. + The test contains an animated circle that indicates where + the path should be at a given time. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test is passed if all of the following conditions are met:</p> + <ul> + <li>The red path in the shape of the digit "1" morphs continuously over three seconds + (from 1s to 4s in document time) to the shape of "2", "3" and then "4". The gray paths + show the four shapes and positions that the red path takes as it morphs.</li> + <li>From 0s to 2s, the circle below the "1" digit is red and the others are gray.</li> + <li>From 2s to 3s, the circle below the "2" digit is red and the others are gray.</li> + <li>From 3s to 4s, the circle below the "3" digit is red and the others are gray.</li> + <li>From 4s onwards, the circle below the "4" digit is red and the others are gray.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-44-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="translate(40,0) scale(0.8)"> + <!-- GRAY SILHOUETTES INDICATING TIME IN SECONDS--> + <path id="Number1" d="M 26.5,32.5 L 33.5,32.5 40.5,29.5 47.5,23.5 61.5,17.5 73.5,16.5 74.5,33.5 73.5,50.5 73.5,64.5 72.5,77.5 72.5,90.5 72.5,105.5 71.5,126.5 89.5,128.5 90.5,138.5 89.5,151.5 72.5,151.5 54.5,152.5 38.5,152.5 27.5,152.5 28.5,139.5 30.5,127.5 44.5,125.5 46.5,112.5 47.5,99.5 46.5,87.5 48.5,73.5 48.5,53.5 34.5,52.5 22.5,52.5 22.5,51.5 22.5,41.5 22.5,33.5 Z" fill="#ccc" stroke="rgb(0,0,0)" stroke-width="1"/> + <path id="Number2" d="M 108.5,38.5 L 123.5,26.5 148.5,16.5 172.5,17.5 188.5,19.5 202.5,23.5 206.5,26.5 210.5,37.5 213.5,44.5 215.5,57.5 209.5,68.5 203.5,81.5 187.5,98.5 164.5,120.5 206.5,121.5 224.5,121.5 220.5,149.5 194.5,147.5 181.5,147.5 167.5,146.5 150.5,147.5 133.5,149.5 117.5,148.5 117.5,136.5 118.5,124.5 133.5,115.5 151.5,97.5 170.5,78.5 186.5,59.5 179.5,43.5 159.5,35.5 139.5,40.5 125.5,49.5 Z" fill="#ccc" stroke="rgb(0,0,0)" stroke-width="1"/> + <path id="Number3" d="M 248.5,38.5 L 276.5,22.5 298.5,19.5 316.5,26.5 332.5,40.5 331.5,57.5 322.5,70.5 307.5,76.5 314.5,80.5 324.5,86.5 333.5,99.5 333.5,121.5 327.5,130.5 312.5,143.5 292.5,149.5 270.5,148.5 248.5,142.5 252.5,114.5 267.5,119.5 282.5,119.5 297.5,115.5 304.5,109.5 295.5,99.5 284.5,92.5 277.5,84.5 270.5,74.5 281.5,66.5 293.5,60.5 297.5,50.5 292.5,45.5 281.5,45.5 274.5,49.5 266.5,53.5 Z" fill="#ccc" stroke="rgb(0,0,0)" stroke-width="1"/> + <path id="Number4" d="M 427.5,17.5 L 439.5,15.5 449.5,15.5 449.5,29.5 447.5,44.5 447.5,59.5 465.5,60.5 466.5,74.5 465.5,89.5 450.5,87.5 449.5,102.5 449.5,123.5 449.5,140.5 449.5,153.5 420.5,154.5 421.5,137.5 420.5,123.5 420.5,111.5 419.5,99.5 392.5,97.5 367.5,99.5 366.5,79.5 367.5,69.5 376.5,43.5 381.5,27.5 384.5,17.5 412.5,16.5 406.5,36.5 400.5,49.5 394.5,70.5 419.5,71.5 423.5,49.5 424.5,33.5 Z" fill="#ccc" stroke="rgb(0,0,0)" stroke-width="1"/> + <!-- Gray silhouettes indicating the positions of the marker circle --> + <circle r="30" cx="50" cy="200" fill="#ccc"/> + <circle r="30" cx="173" cy="200" fill="#ccc"/> + <circle r="30" cx="297" cy="200" fill="#ccc"/> + <circle r="30" cx="420" cy="200" fill="#ccc"/> + + <!-- Test the animation of the d attribute --> + <path id="animatedNumber" d="M 26.5,32.5 L 33.5,32.5 40.5,29.5 47.5,23.5 61.5,17.5 73.5,16.5 74.5,33.5 73.5,50.5 73.5,64.5 72.5,77.5 72.5,90.5 72.5,105.5 71.5,126.5 89.5,128.5 90.5,138.5 89.5,151.5 72.5,151.5 54.5,152.5 38.5,152.5 27.5,152.5 28.5,139.5 30.5,127.5 44.5,125.5 46.5,112.5 47.5,99.5 46.5,87.5 48.5,73.5 48.5,53.5 34.5,52.5 22.5,52.5 22.5,51.5 22.5,41.5 22.5,33.5 Z" fill="rgb(204,0,102)" stroke="rgb(0,0,0)" stroke-width="4"> + <animate attributeName="d" values="M 26.5,32.5 L 33.5,32.5 40.5,29.5 47.5,23.5 61.5,17.5 73.5,16.5 74.5,33.5 73.5,50.5 73.5,64.5 72.5,77.5 72.5,90.5 72.5,105.5 71.5,126.5 89.5,128.5 90.5,138.5 89.5,151.5 72.5,151.5 54.5,152.5 38.5,152.5 27.5,152.5 28.5,139.5 30.5,127.5 44.5,125.5 46.5,112.5 47.5,99.5 46.5,87.5 48.5,73.5 48.5,53.5 34.5,52.5 22.5,52.5 22.5,51.5 22.5,41.5 22.5,33.5 Z; M 108.5,38.5 L 123.5,26.5 148.5,16.5 172.5,17.5 188.5,19.5 202.5,23.5 206.5,26.5 210.5,37.5 213.5,44.5 215.5,57.5 209.5,68.5 203.5,81.5 187.5,98.5 164.5,120.5 206.5,121.5 224.5,121.5 220.5,149.5 194.5,147.5 181.5,147.5 167.5,146.5 150.5,147.5 133.5,149.5 117.5,148.5 117.5,136.5 118.5,124.5 133.5,115.5 151.5,97.5 170.5,78.5 186.5,59.5 179.5,43.5 159.5,35.5 139.5,40.5 125.5,49.5 Z; M 248.5,38.5 L 276.5,22.5 298.5,19.5 316.5,26.5 332.5,40.5 331.5,57.5 322.5,70.5 307.5,76.5 314.5,80.5 324.5,86.5 333.5,99.5 333.5,121.5 327.5,130.5 312.5,143.5 292.5,149.5 270.5,148.5 248.5,142.5 252.5,114.5 267.5,119.5 282.5,119.5 297.5,115.5 304.5,109.5 295.5,99.5 284.5,92.5 277.5,84.5 270.5,74.5 281.5,66.5 293.5,60.5 297.5,50.5 292.5,45.5 281.5,45.5 274.5,49.5 266.5,53.5 Z; M 427.5,17.5 L 439.5,15.5 449.5,15.5 449.5,29.5 447.5,44.5 447.5,59.5 465.5,60.5 466.5,74.5 465.5,89.5 450.5,87.5 449.5,102.5 449.5,123.5 449.5,140.5 449.5,153.5 420.5,154.5 421.5,137.5 420.5,123.5 420.5,111.5 419.5,99.5 392.5,97.5 367.5,99.5 366.5,79.5 367.5,69.5 376.5,43.5 381.5,27.5 384.5,17.5 412.5,16.5 406.5,36.5 400.5,49.5 394.5,70.5 419.5,71.5 423.5,49.5 424.5,33.5 Z" fill="freeze" begin="1" dur="3s"/> + </path> + + <!-- the "bouncing ball" circle that shows where the path should be --> + <circle r="30" cx="50" cy="200" fill="rgb(204,0,102)"> + <animate attributeName="cx" values="50; 173; 297; 420" begin="1" dur="4" calcMode="discrete" fill="freeze"/> + </circle> + </g> + <text x="5" y="225" font-size="28"> + Animation on the 'd' + attribute of path. + </text> + <text x="5" y="255" font-size="18">Digit should match outline at indicated time.</text> + <text x="5" y="275" font-size="18">Filled circle should follow morphing digit discretely.</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-46-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-46-t-manual.svg new file mode 100644 index 000000000..7fc7397e2 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-46-t-manual.svg @@ -0,0 +1,279 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: animate-elem-46-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + This test validates the operation of the animate element on the various + text and font properties. This test is very similar to animate-elem-77-t.svg + which uses the set element instead of the animate element to modify graphics + properties. + </p> + <p> + For each text or font properties, there are three tests. One animates the text or font + property directly on a text element which uses the + property. The other two tests apply the animation on a container element (g and + a), and validate that the animated property is inherited by children text elements. + </p> + <p> + For each animation test, the element on which the animation is applied is also + translated by an animation so that the various states of the animation can + be checked more easily. There is a gray reference marker which shows + the expected animation state at the begining of the animation, mid-way, or at the + end of the animation. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + There are 5 text properties that are animated, and for each of these, + they are animated in one of three different ways (the three columns). The + three animations in each row must be the same. + </p> + <p> + For each animation test, the element on which the animation is applied is also + translated by an animation so that the various states of the animation can + be checked more easily. Each test has three gray silhouettes, showing the size + and shape that the "A" must have at the start, middle and end of the animation. + </p> + <p> + The animation of font-size must show a continuous change of the font size. + </p> + <p> + The following animations must animate discretely: text-anchor, font-family, + font-style, font-weight. + </p> + <p> + The test passes if all of the above conditions are met. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-46-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F" font-weight="700"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSansBold.svg#ascii"/> + </font-face-src> + </font-face> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F" font-style="italic"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSansItalic.svg#ascii"/> + </font-face-src> + </font-face> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F" font-weight="700" font-style="italic"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSansBoldItalic.svg#ascii"/> + </font-face-src> + </font-face> + <font-face font-family="FreeSerif" unicode-range="U+0-7F" font-weight="bold"> + <font-face-src> + <font-face-uri xlink:href="../resources/FreeSerifBold.svg#FreeSerifBold"/> + </font-face-src> + </font-face> + </defs> + <g transform="translate(80, 80)"> + <g transform="translate(20,10)" text-anchor="end" font-size="14"> + <text x="5" y="15">text-anchor</text> + <text x="5" y="50">font-size</text> + <text x="5" y="85">font-family</text> + <text x="5" y="120">font-style</text> + <text x="5" y="155">font-weight</text> + </g> + + <g id="type" transform="translate(90, -10)" text-anchor="middle" font-size="14"> + <text x="20" y="3"><text></text> + <text x="135" y="3"><g></text> + <text x="250" y="3"><a></text> + </g> + + <g transform="translate(80,5)" text-anchor="start" font-size="20" fill="rgb(204,0,102)"> + <g id="animateZero"> + <defs> + <g id="animateZeroRef" font-size="30" font-weight="bold"> + <text x="0" y="20" fill="#aaa" text-anchor="end">A</text> + <rect x="-2" y="18" width="4" height="4" fill="#aaa"/> + <text x="0" y="20" fill="#aaa" text-anchor="middle" transform="translate(30,0)">A</text> + <rect x="-2" y="18" width="4" height="4" fill="#aaa" transform="translate(30,0)"/> + <text x="0" y="20" fill="#aaa" text-anchor="start" transform="translate(60,0)">A</text> + <rect x="-2" y="18" width="4" height="4" fill="#aaa" transform="translate(60,0)"/> + <rect x="-2" y="18" width="4" height="4"> + <animateTransform attributeName="transform" type="translate" values="0;30;60" dur="3s" fill="freeze" calcMode="discrete"/> + </rect> + </g> + </defs> + + <use xlink:href="#animateZeroRef"/> + <use xlink:href="#animateZeroRef" x="110"/> + <use xlink:href="#animateZeroRef" x="220"/> + + <text id="textID_0" x="0" y="20" text-anchor="end" font-size="30" font-weight="bold">A</text> + <animate xlink:href="#textID_0" attributeName="text-anchor" values="end;middle;start" dur="3s" fill="freeze"/> + <animateTransform xlink:href="#textID_0" attributeName="transform" type="translate" values="0;30;60" dur="3s" fill="freeze" calcMode="discrete"/> + + + <g transform="translate(110, 0)" text-anchor="end" font-size="30" font-weight="bold"> + <animate attributeName="text-anchor" values="end;middle;start" dur="3s" fill="freeze"/> + <animateTransform attributeName="transform" type="translate" values="0;30;60" calcMode="discrete" dur="3s" fill="freeze" additive="sum"/> + <text x="0" y="20">A</text> + </g> + + <a xlink:href="" transform="translate(220, 0)" text-anchor="end" font-size="30" font-weight="bold"> + <animate attributeName="text-anchor" values="end;middle;start" dur="3s" fill="freeze"/> + <animateTransform attributeName="transform" type="translate" values="0;30;60" calcMode="discrete" dur="3s" fill="freeze" additive="sum"/> + <text x="0" y="20">A</text> + </a> + </g> + + <g id="animateOne" transform="translate(0,35)"> + <defs> + <g id="animateOneRef" font-weight="bold" text-anchor="start"> + <text x="0" y="20" fill="#aaa" font-size="30">A</text> + <text x="0" y="20" fill="#aaa" font-size="12" transform="translate(30,0)">A</text> + <text x="0" y="20" fill="#aaa" font-size="30" transform="translate(60,0)">A</text> + </g> + </defs> + + <use xlink:href="#animateOneRef"/> + <use xlink:href="#animateOneRef" x="110"/> + <use xlink:href="#animateOneRef" x="220"/> + + <text id="textID_1" x="0" y="20" font-size="12" font-weight="bold">A</text> + <animate xlink:href="#textID_1" attributeName="font-size" values="30;12;30" dur="3s" fill="freeze"/> + <animateTransform xlink:href="#textID_1" attributeName="transform" type="translate" from="0" to="60" dur="3s" fill="freeze"/> + + <g transform="translate(110, 0)" font-size="12" font-weight="bold"> + <animate attributeName="font-size" values="30;12;30" dur="3s" fill="freeze"/> + <animateTransform attributeName="transform" type="translate" from="0" to="60" dur="3s" fill="freeze" additive="sum"/> + <text x="0" y="20">A</text> + </g> + + <a xlink:href="" transform="translate(220,0)" font-size="12" font-weight="bold"> + <animate attributeName="font-size" values="30;12;30" dur="3s" fill="freeze"/> + <animateTransform attributeName="transform" type="translate" from="0" to="60" dur="3s" fill="freeze" additive="sum"/> + <text x="0" y="20">A</text> + </a> + </g> + + <g id="animateTwo" transform="translate(0,70)"> + <defs> + <g id="animateTwoRef" font-weight="bold" font-size="30"> + <text x="0" y="20" fill="#aaa" font-family="SVGFreeSansASCII,sans-serif">A </text> + <text x="30" y="20" fill="#aaa" font-family="FreeSerif,serif">A</text> + <text x="60" y="20" font-size="30" fill="#aaa" font-family="SVGFreeSansASCII,sans-serif">A</text> + </g> + </defs> + <use xlink:href="#animateTwoRef"/> + <use xlink:href="#animateTwoRef" x="110"/> + <use xlink:href="#animateTwoRef" x="220"/> + + <text id="textID_2" x="0" y="20" font-weight="bold" font-size="30">A</text> + <animate xlink:href="#textID_2" attributeName="font-family" values="SVGFreeSansASCII,sans-serif;FreeSerif,serif;SVGFreeSansASCII,sans-serif" dur="3s" fill="freeze"/> + <animateTransform xlink:href="#textID_2" attributeName="transform" type="translate" values="0;30;60" calcMode="discrete" dur="3s" fill="freeze"/> + + <g font-weight="bold" font-size="30" transform="translate(110,0)"> + <animate attributeName="font-family" values="SVGFreeSansASCII,sans-serif;FreeSerif,serif;SVGFreeSansASCII,sans-serif" dur="3s" fill="freeze"/> + <animateTransform attributeName="transform" type="translate" values="0;30;60" calcMode="discrete" dur="3s" fill="freeze" additive="sum"/> + <text x="0" y="20">A</text> + </g> + + <a xlink:href="" font-weight="bold" font-size="30" transform="translate(220,0)"> + <animate attributeName="font-family" values="SVGFreeSansASCII,sans-serif;FreeSerif,serif;SVGFreeSansASCII,sans-serif" dur="3s" fill="freeze"/> + <animateTransform attributeName="transform" type="translate" values="0;30;60" calcMode="discrete" dur="3s" fill="freeze" additive="sum"/> + <text x="0" y="20">A</text> + </a> + </g> + + <g id="animateThree" transform="translate(0,105)"> + <defs> + <g id="animateThreeRef" font-size="30" font-weight="bold"> + <text x="0" y="20" font-size="30" fill="#aaa" font-style="normal">A</text> + <text x="30" y="20" font-size="30" fill="#aaa" font-style="italic">A</text> + <text x="60" y="20" font-size="30" fill="#aaa" font-style="normal">A</text> + </g> + </defs> + <use xlink:href="#animateThreeRef"/> + <use xlink:href="#animateThreeRef" x="110"/> + <use xlink:href="#animateThreeRef" x="220"/> + + <text id="textID_3" x="0" y="20" font-size="30" font-weight="bold">A</text> + <animate xlink:href="#textID_3" attributeName="font-style" values="normal;italic;normal" dur="3s" fill="freeze"/> + <animateTransform xlink:href="#textID_3" attributeName="transform" type="translate" values="0;30;60" calcMode="discrete" dur="3s" fill="freeze"/> + + <g transform="translate(110,0)" font-size="30" font-weight="bold"> + <animate attributeName="font-style" values="normal;italic;normal" dur="3s" fill="freeze"/> + <animateTransform attributeName="transform" type="translate" values="0;30;60" calcMode="discrete" dur="3s" fill="freeze" additive="sum"/> + <text x="0" y="20" font-size="30">A</text> + </g> + + <a xlink:href="" transform="translate(220,0)" font-size="30" font-weight="bold"> + <animate attributeName="font-style" values="normal;italic;normal" dur="3s" fill="freeze"/> + <animateTransform attributeName="transform" type="translate" values="0;30;60" calcMode="discrete" dur="3s" fill="freeze" additive="sum"/> + <text x="0" y="20" font-size="30">A</text> + </a> + + </g> + + <g id="animateFour" transform="translate(0,140)"> + <defs> + <g id="animateFourRef" font-size="30"> + <text x="0" y="20" fill="#aaa" font-weight="bold">A</text> + <text x="30" y="20" fill="#aaa" font-weight="normal">A</text> + <text x="60" y="20" fill="#aaa" font-weight="bold">A</text> + </g> + </defs> + + <use xlink:href="#animateFourRef"/> + <use xlink:href="#animateFourRef" x="110"/> + <use xlink:href="#animateFourRef" x="220"/> + + <text id="textID_4" x="0" y="20" font-size="30">A</text> + <animate xlink:href="#textID_4" attributeName="font-weight" values="bold;normal;bold" calcMode="discrete" dur="3s" fill="freeze"/> + <animateTransform xlink:href="#textID_4" attributeName="transform" type="translate" values="0;30;60" calcMode="discrete" dur="3s" fill="freeze"/> + + <g transform="translate(110,0)" font-size="30"> + <animate attributeName="font-weight" values="bold;normal;bold" calcMode="discrete" dur="3s" fill="freeze"/> + <animateTransform attributeName="transform" type="translate" values="0;30;60" calcMode="discrete" dur="3s" fill="freeze" additive="sum"/> + <text x="0" y="20">A</text> + </g> + + <a xlink:href="" transform="translate(220,0)" font-size="30"> + <animate attributeName="font-weight" values="bold;normal;bold" calcMode="discrete" dur="3s" fill="freeze"/> + <animateTransform attributeName="transform" type="translate" values="0;30;60" calcMode="discrete" dur="3s" fill="freeze" additive="sum"/> + <text x="0" y="20">A</text> + </a> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-52-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-52-t-manual.svg new file mode 100644 index 000000000..190baa75a --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-52-t-manual.svg @@ -0,0 +1,112 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="VH" author="OA" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-52-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + The purpose of this test is to test eventbase targets. + </p> + <p> + The test consists of 4 rectangles named A, B, C, D. The D rectangle contains + three animations changing the color of the animation target. + Each animation applies to one of the other rectangles + by using xlink:href. Clicking on rect A should change it's + color immediately, clicking B changes its color after 2 seconds, + clicking C changes its color after 4 seconds and clicking D shows no visible change + (although D contains the animations the event target for each + animation is the referenced rectangle, this rectangle is also the + animation target.) + </p> + <p> + The following sections in the SMIL Animation spec (http://www.w3.org/TR/smil-animation/) + are relevant as confirmation of this test: + The SMIL spec(3.6.7 subsection "Event Values") states that "If the + Eventbase-element term is missing, the event-base element is defined to + be the target element of the animation" + The SMIL spec (3.1 subsection "The target element") says that the + animation target may be defined explicitly thru the targetElement IDREF + or href URI. + So in this test, the animation target is defined through + xlink:href and the event base per definition is then also this + referenced element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. Click on each of the four blue rectangles from left to right.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if all of the following conditions are met:</p> + <ul> + <li>the A rectangle turns yellow immediately when clicked</li> + <li>the B rectangle turns yellow two seconds after being clicked</li> + <li>the C rectangle turns yellow four seconds after being clicked</li> + <li>at the time the C rectangle turns yellow, the D rectangle is still blue</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-52-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x="65" y="50" font-size="30" stroke="none" fill="black">A</text> + <text x="165" y="50" font-size="30" stroke="none" fill="black">B</text> + <text x="265" y="50" font-size="30" stroke="none" fill="black">C</text> + <text x="365" y="50" font-size="30" stroke="none" fill="black">D</text> + + <g transform="translate(0,45)"> + <g id="A" fill="rgb(126,143,250)"> + <rect x="30" y="15" rx="5" ry="5" width="90" height="40" stroke="#000000" fill="inherit" stroke-width="2"/> + <text x="50" y="40" font-size="20" stroke="none" fill="black">click A</text> + </g> + + <g id="B" fill="rgb(126,143,250)"> + <rect x="130" y="15" rx="5" ry="5" width="90" height="40" stroke="#000000" fill="inherit" stroke-width="2"/> + <text x="135" y="40" font-size="20" stroke="none" fill="black">click B+2</text> + </g> + + <g id="C" fill="rgb(126,143,250)"> + <rect x="230" y="15" rx="5" ry="5" width="90" height="40" stroke="#000000" fill="inherit" stroke-width="2"/> + <text x="235" y="40" font-size="20" stroke="none" fill="black">click C+4</text> + </g> + + <g fill="rgb(126,143,250)"> + <rect x="330" y="15" rx="5" ry="5" width="90" height="40" stroke="#000000" fill="inherit" stroke-width="2"/> + <text x="350" y="40" font-size="20" stroke="none" fill="black">never</text> + <set begin="click" fill="freeze" xlink:href="#A" attributeName="fill" to="yellow"/> + <set begin="click+2" fill="freeze" xlink:href="#B" attributeName="fill" to="yellow"/> + <set begin="click+4" fill="freeze" xlink:href="#C" attributeName="fill" to="yellow"/> + </g> + </g> + + <text x="15" y="175" font-size="28">Test of Eventbase targets.</text> + <text x="15" y="245" font-size="18">Note that clicking rect D should give no result.</text> + <text x="15" y="205" font-size="18">Clicking a rectangle should change its color at the </text> + <text x="15" y="225" font-size="18">time for the click + delay as indicated in each rect.</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-53-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-53-t-manual.svg new file mode 100644 index 000000000..7c34d36a3 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-53-t-manual.svg @@ -0,0 +1,134 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="VH" author="OA" status="issue" + version="$Revision: 1.7 $" testname="$RCSfile: animate-elem-53-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + The purpose of this test is to test animation of points and calcmode. + </p> + <!-- The test has no well defined pass criteria and its not clear also which of the several results produced by different implementations is correct. Think Opera 10.6 is correct; test needs to be discussed by wg. --> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + + <p> + 1. The green squares should animate together side by side. This applies + to the blue ones as well. + 2. The time values indicate when the squares should reach the + corresponding reference square. + 3. The total distance is 0+40+80+24.14=144.14 + a. The "green animation" is 9 sec and linear so each interval + should get 3 sec. + b. The "blue animation" is 8 sec and paced so the intervals + should get 2.22, 4.44 and 1.34 sec each. + </p> + <p> + Here comes a more detailed description of the animation. + + The left green square (LG) is animated by animating the points with + a value array, consisting of 4 lists of points. This is an animation + with calc-mode=linear so an equal amount of time should be spent on + all 4 intervals. The right green square (RG) is animated by a simple + linear motion followed by a scale to follow LG. + The last scale by 1.9428 correspond to a movement of the lover right + corner of the square by sqrt((30*0.9428)^2 + (30*0.9428)^2) which is + approximately 40 distance units. This is the same distance as the first + interval in the values array (and half the second interval). + The length (in terms of distance) is not really important for the + green squares but for the blue squares which are animated with + calc-mode=paced the length is used to calculate the time for each + interval. + Since the first and last interval are of the same length which + totals to the length of the middle interval, the interval should + be given time according to [27.75%(2.22sec);55.5%(4.44sec);16.75%(1.34sec)]. + + So the left blue square (LR) is animated just as the LG square but + with calc-mode=paced. The same applies to the right blue square (RR) + that has default calc-mode (paced for animateMotion) compablue to the + RG square that has calc-mode=linear. + The calc-mode for the scale of RR (and RG) is not important since + it's not a value list type of animation. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + [[Describe the pass criteria of the test here. The pass criteria is what + should be displayed when the test is run.]] + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-53-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <polygon id="p" points="0,0 30,0 30,30 0,30" fill="none" stroke="black"/> + </defs> + <g transform="translate(0,0)"> + <use xlink:href="#p" x="10" y="10"/> + <text x="15" y="35" font-size="20">0s</text> + <use xlink:href="#p" x="10" y="50"/> + <text x="15" y="75" font-size="20">3s</text> + <use xlink:href="#p" x="10" y="130"/> + <text x="15" y="155" font-size="20">6s</text> + <rect x="10" y="130" width="58.28" height="58.28" fill="none" stroke="black"/> + <text x="45" y="185" font-size="20">9s</text> + <polygon id="LG" points="0,0 30,0 30,30 0,30" fill="none" stroke="green"> + <animate attributeName="points" begin="0" dur="9" fill="freeze" values="10,10 40,10 40,40 10,40; 10,50 40,50 40,80 10,80; 10,130 40,130 40,160 10,160; 10,130 68.28,130 68.28,188.28 10,188.28"/> + </polygon> + <g transform="translate(70,10)"> + <polygon id="RG" points="0,0 30,0 30,30 0,30" fill="none" stroke="green"> + <animateMotion values="0,0;0,40;0,120" begin="0" dur="6" calcMode="linear" fill="freeze"/> + <animateTransform attributeName="transform" type="scale" from="1" to="1.9428" begin="6" dur="3" fill="freeze"/> + </polygon> + </g> + </g> + <g transform="translate(120,0)"> + <use xlink:href="#p" x="10" y="10"/> + <text x="15" y="35" font-size="20">0s</text> + <use xlink:href="#p" x="10" y="50"/> + <text x="15" y="75" font-size="20">2.22s</text> + <use xlink:href="#p" x="10" y="130"/> + <text x="15" y="155" font-size="20">6.66s</text> + <rect x="10" y="130" width="58.28" height="58.28" fill="none" stroke="black"/> + <text x="45" y="185" font-size="20">8s</text> + <polygon id="LR" points="10,10 40,10 40,40 10,40" fill="none" stroke="blue"> + <animate attributeName="points" begin="0" dur="8" calcMode="paced" fill="freeze" values="10,10 40,10 40,40 10,40; 10,50 40,50 40,80 10,80; 10,130 40,130 40,160 10,160; 10,130 68.28,130 68.28,188.28 10,188.28"/> + </polygon> + <g transform="translate(70,10)"> + <polygon id="RR" points="0,0 30,0 30,30 0,30" fill="none" stroke="blue"> + <animateMotion values="0,0;0,40;0,120" begin="0" dur="6.66" fill="freeze"/> + <animateTransform attributeName="transform" type="scale" from="1" to="1.9428" begin="6.66" dur="1.34" fill="freeze"/> + </polygon> + </g> + </g> + <text x="5" y="225" font-size="26">Animation on: 'points' with 'calc-mode'.</text> + <text x="5" y="255" font-size="16">Coloblue and black squares should match at indicated time.</text> + <text x="5" y="275" font-size="16">Same coloblue squares (green and blue) should match at all times</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-60-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-60-t-manual.svg new file mode 100644 index 000000000..2b3837487 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-60-t-manual.svg @@ -0,0 +1,254 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: animate-elem-60-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + This test performs basic test on the begin attribute, + assuming support for the <set> element and setting the + fill attribute on a <rect> element. + </p> + <p> + The test validates the various possibilities for the begin attribute + value: no specified value, offset value, event base value, sync base + value, indefinite value, repeat value, accessKey value and wallclock. + </p> + <p> + There is one or several <set> elements for each of the possible begin + values. For each test, the <set> element(s) has (or have) an indefinite + duration and no other timing attribute specified other than begin + and dur. + </p> + <p> + There are two sets of vertical markers which help check that the test + is handled properly by the user agent. The first set, on the left, shows + markers from 0s to 8s, where the times are offset from the document's load time. + The rectangles in that area should turn green at the time corresponding + to the column they are in. From example, the first rectangle (going left to right) + on the "sync base" line should turn green 2 seconds after the document's load. + The second set of time vertical markers shows offset from a particular event. + For example, for the event base, the markers show an offset to the time + the first event base rectangle (the left-most one) is clicked on. For the + accessKey line, the times show offsets from the time the 'a' key is pressed + and the document has focus. + </p> + <p> + The first <set> has an unspecified begin attribute. That value + defaults to an offset of 0s so the animation should apply as soon as + the document is loaded. + </p> + <p> + The second <set> has its begin attribute set to '2s'. So its + target rectangle should turn green two seconds after the document is + loaded. + </p> + <p> + The third <set> has its begin attribute set to an event base + value 'click'. The user has to click on the left-most target red rectangle + to make the <set> target turn green. There are two rectangles + with associated <set> elements. The left most ones has a simple + value (no offset) and the second one is offset from the event time by 2 seconds. + </p> + <p> + The fourth <set> elements have their begin attributes set to a sync base + value. The first two rectangles have <set> elements synchronized on their sync base + begin. The left-most one has no offset and the following one has a 2 seconds offset. + The last two rectangles have <set> elements synchronized on their sync base end. + The first one (i.e., the third from left to right on that line), has a 2 seconds + negative offset. The second one (i.e., the last one on the line) has no offset and should + begin at the time its sync base ends. + </p> + <p> + The fifth <set> has its begin attribute set to indefinite and + should not turn red and stay green. + </p> + <p> + The sixth <set>s have their begin attributes have their begin attributes + based on the repeat() function. The repeat they are synchronized on happens + at 3s. The first <set>, which has no offset, should begin at 3s. The + second <set>, which has a 2 seconds offset, should start at 5s. + </p> + <p> + The seventh <set>s have their begin attributes set to 'accessKey(a)'. + The first one has no offset and should become active (and turn the rectangle + green), as soon as the key 'a' is pressed in the user agent. The second <set> + has a 2s offset and should become active 2 seconds after the 'a' key is pressed in + the user agent. + </p> + <p> + The eight's <set> target has its begin attribute set to + 'wallclock()'. Therefore, the target should turn red because the + target wallclock time is in the past. The SMIL specification states the following about wallclock values in the past: + "When a begin time is resolved to be in the past (i.e., before the current presentation time), the element begins immediately, + but acts as though it had begun at the specified time (playing from an offset into the media)." (http://www.w3.org/TR/2001/REC-smil-animation-20010904/#AnimFuncTiming). + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. Observe the document for at least eight seconds. + Then, click on the first red square in the "event base" row, + and observe the document for two seconds. Then, press "a" + on the keyboard, and observe the document for another two seconds.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if the following conditions are met:</p> + <ul> + <li>In the first eight seconds of the document, the 10 squares + in the left section of the test must become green at the time + at the top of the column they are in. For example, the square in + the "offset" row must become green at 2s after the document has + been loaded.</li> + <li>Immediately once the red square in the "event base" row has been clicked, + it must become green. Two seconds after the click, the second square + must become green.</li> + <li>Immediately once "a" has been pressed on the keyboard, + the first square in the "accessKey()" row must become green. + Two seconds after the keypress, the second square must become green.</li> + <li>No other changes occur in the document.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-60-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text text-anchor="middle" x="240" y="30" font-size="20">begin</text> + <g transform="translate(100, 80)"> + <g transform="translate(80,5)" text-anchor="end" font-size="14"> + <text>unspecified</text> + <text y="25">offset</text> + <text y="50">event base</text> + <text y="75">sync base</text> + <text y="100">indefinite</text> + <text y="125">repeat()</text> + <text y="150">accessKey()</text> + <text y="175">wallclock()</text> + </g> + + <g id="timeMarkersText" transform="translate(100, -15)" text-anchor="middle" font-size="8"> + <text>0s</text> + <text x="12">1s</text> + <text x="24">2s</text> + <text x="36">3s</text> + <text x="48">4s</text> + <text x="60">5s</text> + <text x="72">6s</text> + <text x="84">7s</text> + <text x="96">8s</text> + <text x="120">0s</text> + <text x="132">1s</text> + <text x="144">2s</text> + </g> + + <g id="timeMarkers" transform="translate(94, -10) scale(1, 8)"> + <rect width="12" height="25" fill="#eee"/> + <rect x="12" width="12" height="25" fill="#ddd"/> + <rect x="24" width="12" height="25" fill="#eee"/> + <rect x="36" width="12" height="25" fill="#ddd"/> + <rect x="48" width="12" height="25" fill="#eee"/> + <rect x="60" width="12" height="25" fill="#ddd"/> + <rect x="72" width="12" height="25" fill="#eee"/> + <rect x="84" width="12" height="25" fill="#ddd"/> + <rect x="96" width="12" height="25" fill="#eee"/> + <rect x="120" width="12" height="25" fill="#eee"/> + <rect x="132" width="12" height="25" fill="#ddd"/> + <rect x="144" width="12" height="25" fill="#eee"/> + </g> + + <g transform="translate(100,0)"> + <g id="setOne"> + <rect x="-6" y="-6" width="12" height="12" fill="#F33"> + <set attributeName="fill" to="#3F3" dur="indefinite"/> + </rect> + </g> + + <g id="setTwo" transform="translate(0, 25)"> + <rect x="-6" y="-6" width="12" height="12" fill="#F33" transform="translate(24,0)"> + <set id="secondSet" attributeName="fill" to="#3F3" begin="2s" dur="indefinite"/> + </rect> + </g> + + <g id="setThree" transform="translate(0, 50)"> + <rect id="setThreeTarget" x="-6" y="-6" width="12" height="12" fill="#F33" transform="translate(120,0)"> + <set attributeName="fill" id="thirdSet" to="#3F3" begin="setThreeTarget.click" dur="indefinite"/> + </rect> + <rect x="-6" y="-6" width="12" height="12" fill="#F33" transform="translate(144,0)"> + <set attributeName="fill" id="thirdSetOffset" to="#3F3" begin="setThreeTarget.click + 2s" dur="indefinite"/> + </rect> + </g> + + <g id="setFour" transform="translate(0, 75)"> + <set id="endBase" attributeName="display" to="inline" begin="7s" dur="1s"/> + <rect x="-6" y="-6" width="12" height="12" fill="#F33" transform="translate(24,0)"> + <set attributeName="fill" to="#3F3" begin="secondSet.begin" dur="indefinite"/> + </rect> + <rect x="-6" y="-6" width="12" height="12" fill="#F33" transform="translate(48,0)"> + <set attributeName="fill" to="#3F3" begin="secondSet.begin + 2s" dur="indefinite"/> + </rect> + <rect x="-6" y="-6" width="12" height="12" fill="#F33" transform="translate(72,0)"> + <set attributeName="fill" to="#3F3" begin="endBase.end - 2s" dur="indefinite"/> + </rect> + <rect x="-6" y="-6" width="12" height="12" fill="#F33" transform="translate(96,0)"> + <set attributeName="fill" to="#3F3" begin="endBase.end" dur="indefinite"/> + </rect> + </g> + + <g id="setFive" transform="translate(0, 100)"> + <rect x="-6" y="-6" width="12" height="12" fill="#3F3"> + <set attributeName="fill" to="#F33" begin="indefinite" dur="indefinite"/> + </rect> + </g> + + <g id="setSix" transform="translate(0, 125)"> + <set id="repeatingSet" attributeName="display" to="inline" begin="0s" dur="1s" repeatCount="4"/> + <rect x="-6" y="-6" width="12" height="12" fill="#F33" transform="translate(36,0)"> + <set attributeName="fill" to="#3F3" begin="repeatingSet.repeat(3)" dur="indefinite"/> + </rect> + <rect x="-6" y="-6" width="12" height="12" fill="#F33" transform="translate(60,0)"> + <set attributeName="fill" to="#3F3" begin="repeatingSet.repeat(3) + 2s" dur="indefinite"/> + </rect> + </g> + + <g id="setSeven" transform="translate(0, 150)"> + <rect x="-6" y="-6" width="12" height="12" fill="#F33" transform="translate(120,0)"> + <set attributeName="fill" to="#3F3" begin="accessKey(a)" dur="indefinite"/> + </rect> + <rect x="-6" y="-6" width="12" height="12" fill="#F33" transform="translate(144,0)"> + <set attributeName="fill" to="#3F3" begin="accessKey(a) + 2s" dur="indefinite"/> + </rect> + </g> + + <g id="setEight" transform="translate(0, 175)"> + <rect x="-6" y="-6" width="12" height="12" fill="#3F3"> + <set attributeName="fill" to="#F33" begin="wallclock(2000-06-10T12:34:56Z)" dur="indefinite"/> + </rect> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-61-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-61-t-manual.svg new file mode 100644 index 000000000..08666d108 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-61-t-manual.svg @@ -0,0 +1,191 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="VH" author="VH" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-61-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + This tests validates multiple begin conditions in the begin attribute, + assuming support for the <set> element and setting the + fill attribute on a <rect> element. + </p> + <p> + The test validates the various possibilities for the begin attribute + value: multiple offset values, multiple event base values, multiple sync base + values, multiple repeat values, and multiple accessKey values. Finally, + the test validates that begin values of different kinds can be mixed. + </p> + <p> + The test shows 6 rows where a red rectangle' s x attribute is animated + with <set> elements. + </p> + <p> + On the first three rows, the red rectangles should show on the left from + 0 to 1s. From 1 to 2s, the rectangles should show on the right. Then + the rectangles should show on the left from 2 to 4s, then on the right + again from 4 to 5s and come back to the left position and stay there + after 5s. + </p> + <p> + On the fourth row, the rectangle's begin condition is event based + and requires a user click. After the user clicks on the rectangle, + the rectangle should move to the right position for 1s, then move + back to the left position for 3 seconds, move again to the right + position for 1 second before going back to the left position. + </p> + <p> + On the fifth row, the rectangle's begin condition is accessKey based + and requires a user to press the 'a' key. After the user presses that key + the rectangle should move to the right position for 1s, then move + back to the left position for 3 seconds, move again to the right + position for 1 second before going back to the left position. + </p> + <p> + The last row's rectangle has a begin condition with two offset values + (1s;4s) and should behave like the rectangles of the first three + rows for the first 5 seconds of the document's timeline. In addition, + the begin condition has a click event base and thus, the rectangle + should move to the right position for one second every time the user + clicks on it. Finally, the begin condition also has an accessKey condition + for the 'b' character. Thus, the rectangle should move to the right + position every time the user presses the 'b' key. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. Observe the document for a least six seconds. + Then, click on the left square in the "2 event base" row and + wait for another six seconds while observing. Then, press "a" + on the keyboard and wait for another six seconds while observing.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if all of the following conditions are met:</p> + <ul> + <li>The red squares in the top three rows and the bottom row are + in the relevant column according to the times written above the columns: + in left column for the first second of the document, in the + right column between 1s and 2s, in the left column again between + 2s and 4s, in the right column again between 4s and 5s, and finally + revert to the left column at 5s.</li> + <li>Once the red square in the "2 event base" row is clicked, it must + follow the same movements as the earlier animated squares, except that + the times above the columns indicate offsets from the time of the click, + rather than from the start of the document. Thus, the red square must + be in the left column in the first second after being clicked, + in the right column between 1s and 2s after being clicked, + in the left column again between 2s and 4s after being clicked, + in the right column again between 4s and 5s after being clicked, + and finally must revert to the left column 5s after being clicked.</li> + <li>Once the "a" key is pressed, the red square in the "2 accessKeys" + row must follow the same movements as the first set of animated squares, except that + the times above the columns indicate offsets from the time of the keypress, + rather than from the start of the document. Thus, the red square must + be in the left column in the first second after the keypress, + in the right column between 1s and 2s after the keypress, + in the left column again between 2s and 4s after the keypress, + in the right column again between 4s and 5s after the keypress, + and finally must revert to the left column 5s after the keypress.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-61-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text text-anchor="middle" x="240" y="30" font-size="20">multiple begin</text> + <g transform="translate(100, 100)"> + <g transform="translate(80,25)" text-anchor="end" font-size="14"> + <text>2 offsets</text> + <text y="25">2 sync bases</text> + <text y="50">2 repeat</text> + <text y="100">2 event base</text> + <text y="125">2 accessKeys</text> + <text y="150">misc</text> + </g> + + <g id="timeMarkersText" transform="translate(150, 5)" text-anchor="middle" font-size="14"> + <text>0-1s</text> + <text y="-20">2s-4s</text> + <text y="-40">> 5s</text> + <g transform="translate(40,0)"> + <text>1-2s</text> + <text y="-20">4-5s</text> + </g> + </g> + + <g transform="translate(150,20)" stroke="black"> + <defs> + <rect id="shadow" x="-6" y="-6" width="12" height="12" fill="#ccc" stroke="black" stroke-width="1"/> + </defs> + <g id="setOne"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="40"/> + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set id="firstSet" attributeName="x" to="34" begin="1s; 4s" dur="1s"/> + </rect> + </g> + <g id="setTwo" transform="translate(0, 25)"> + <set id="syncBase" attributeName="display" to="inline" begin="0s" dur="indefinite"/> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="40"/> + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="34" begin="syncBase.begin + 1s; syncBase.begin + 4s" dur="1s"/> + </rect> + </g> + <g id="setThree" transform="translate(0, 50)"> + <set id="repeatBase" attributeName="display" to="inline" begin="0s" dur="1s" repeatDur="indefinite"/> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="40"/> + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="34" begin="repeatBase.repeat(1);repeatBase.repeat(4)" dur="1s"/> + </rect> + </g> + <g id="setFour" transform="translate(0, 100)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="40"/> + <rect id="setFourTarget" x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="34" begin="setFourTarget.click + 0s; setFourTarget.click+4s" dur="1s"/> + </rect> + </g> + <g id="setFive" transform="translate(0, 125)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="40"/> + <rect id="setFiveTarget" x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="34" begin="accessKey(a) + 0s;accessKey(a)+4s" dur="1s"/> + </rect> + </g> + <g id="setSix" transform="translate(0, 150)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="40"/> + <rect id="setSixTarget" x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="34" begin="1s;4s;setSixTarget.click;accessKey(b)" dur="1s"/> + </rect> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-62-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-62-t-manual.svg new file mode 100644 index 000000000..43590af4d --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-62-t-manual.svg @@ -0,0 +1,260 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-62-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + This test performs basic test on the end attribute, + assuming support for the <set> element and setting the + fill attribute on a <rect> element. + </p> + <p> + The test validates the various possibilities for the end attribute + value: no specified value, offset value, event base value, sync base + value, indefinite value, repeat value, accessKey value and wallclock. + </p> + <p> + There are one or several <set> elements for each of the possible end + values. For each test, the <set> element(s) has (or have) an indefinite + duration and no other timing attribute specified other than end + and dur. + </p> + <p> + There are two sets of vertical markers which help check that the test + is handled properly by the user agent. The first set, on the left, shows + markers from 0s to 8s, where the times are offset from the document's load time. + The rectangles in that area should turn green at the time corresponding + to the column they are in. From example, the first rectangle (going left to right) + on the "sync base" line should turn green 2 seconds after the document's load. + The second set of time vertical markers shows offset from a particular event. + For example, for the event base, the markers show an offset to the time + the first event base rectangle (the left-most one) is clicked on. For the + accessKey line, the times show offsets from the time the 'a' key is pressed + and the document has focus. + </p> + <p> + The first <set> has no end attribute and an indefinite duration. + Since there are no constraints on the active duration (no end attribute) the + active duration is the same as the simple duration (indefinite). This + means that the animation begins at 0s and has an indefinite end time. + </p> + <p> + The second <set> has its end attribute set to '2s'. So its + target rectangle should turn green two seconds after the document is + loaded. + </p> + <p> + The third <set> has its end attribute set to an event base + value 'click'. The user has to click on the left-most target red rectangle + to make the <set> target turn green. There are two rectangles + with associated <set> elements. The left most ones has a simple + value (no offset) and the second one is offset from the event time by 2 seconds. + </p> + <p> + The fourth <set> elements have their end attributes set to a sync base + value. The first two rectangles have <set> elements synchronized on their sync base + end. The left-most one has no offset and the following one has a 2 seconds offset. + The last two rectangles have <set> elements synchronized on their sync base end. + The first one (i.e., the third from left to right on that line), has a 2 seconds + negative offset. The second one (i.e., the last one on the line) has no offset and should + end at the time its sync base ends. + </p> + <p> + The fifth <set> has its end attribute set to indefinite and + should not turn red and stay green. + </p> + <p> + The sixth <set>s have their end attributes have their end attributes + based on the repeat() function. The repeat they are synchronized on happens + at 3s. The first <set>, which has no offset, should end at 3s. The + second <set>, which has a 2 seconds offset, should start at 5s. + </p> + <p> + The seventh <set>s have their end attributes set to 'accessKey(a)'. + The first one has no offset and should become active (and turn the rectangle + green), as soon as the key 'a' is pressed in the user agent. The second <set> + has a 2s offset and should become active 2 seconds after the 'a' key is pressed in + the user agent. + </p> + <p> + The eight's <set> target has its end attribute set to + 'wallclock()'. The result depends on the presentation time. + If the document is viewed completely before 2200-06-10T12:34:56Z, + the rectangle has to be always green. begin is not explicitely set, therefore + it is zero, dur is indefinite and end is in the future. + If the document is viewed completely after 2200-06-10T12:34:56Z, the only end + value is before the implicitely given only begin value and therefore the set + does not start, the rectangle remains red. If the document is viewed in a time interval started before + 2200-06-10T12:34:56Z and ended after this date, the rectangle will start green at the beginning, change to red at + 2200-06-10T12:34:56Z and will remain red until the end of presentation. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. Observe the document for at least eight seconds. + Then, click on the first red square in the "event base" row, + and observe the document for two seconds. Then, press "a" + on the keyboard, and observe the document for another two seconds.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if the following conditions are met:</p> + <ul> + <li>In the first eight seconds of the document, the 10 squares + in the left section of the test must become green at the time + at the top of the column they are in. For example, the square in + the "offset" row must become green at 2s after the document has + been loaded.</li> + <li>Immediately once the red square in the "event base" row has been clicked, + it must become green. Two seconds after the click, the second square + must become green.</li> + <li>Immediately once "a" has been pressed on the keyboard, + the first square in the "accessKey()" row must become green. + Two seconds after the keypress, the second square must become green.</li> + <li>No other changes occur in the document.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-62-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text text-anchor="middle" x="240" y="30" font-size="20">end</text> + <g transform="translate(100, 80)"> + <g transform="translate(80,5)" text-anchor="end" font-size="14"> + <text>unspecified</text> + <text y="25">offset</text> + <text y="50">event base</text> + <text y="75">sync base</text> + <text y="100">indefinite</text> + <text y="125">repeat()</text> + <text y="150">accessKey()</text> + <text y="175">wallclock()</text> + </g> + + <g id="timeMarkersText" transform="translate(100, -15)" text-anchor="middle" font-size="8"> + <text>0s</text> + <text x="12">1s</text> + <text x="24">2s</text> + <text x="36">3s</text> + <text x="48">4s</text> + <text x="60">5s</text> + <text x="72">6s</text> + <text x="84">7s</text> + <text x="96">8s</text> + <text x="120">0s</text> + <text x="132">1s</text> + <text x="144">2s</text> + </g> + + <g id="timeMarkers" transform="translate(94, -10) scale(1, 8)"> + <rect width="12" height="25" fill="#eee"/> + <rect x="12" width="12" height="25" fill="#ddd"/> + <rect x="24" width="12" height="25" fill="#eee"/> + <rect x="36" width="12" height="25" fill="#ddd"/> + <rect x="48" width="12" height="25" fill="#eee"/> + <rect x="60" width="12" height="25" fill="#ddd"/> + <rect x="72" width="12" height="25" fill="#eee"/> + <rect x="84" width="12" height="25" fill="#ddd"/> + <rect x="96" width="12" height="25" fill="#eee"/> + <rect x="120" width="12" height="25" fill="#eee"/> + <rect x="132" width="12" height="25" fill="#ddd"/> + <rect x="144" width="12" height="25" fill="#eee"/> + </g> + + <g transform="translate(100,0)"> + <g id="setOne"> + <rect x="-6" y="-6" width="12" height="12" fill="#F33"> + <set attributeName="fill" to="#3F3" begin="0s" dur="indefinite"/> + </rect> + </g> + + <g id="setTwo" transform="translate(0, 25)"> + <rect x="-6" y="-6" width="12" height="12" fill="#3F3" transform="translate(24,0)"> + <set id="secondSet" attributeName="fill" to="#F33" begin="0s" end="2s" dur="indefinite"/> + </rect> + </g> + + <g id="setThree" transform="translate(0, 50)"> + <rect id="setThreeTarget" x="-6" y="-6" width="12" height="12" fill="#3F3" transform="translate(120,0)"> + <set attributeName="fill" id="thirdSet" to="#F33" end="setThreeTarget.click" dur="indefinite"/> + </rect> + <rect x="-6" y="-6" width="12" height="12" fill="#F33" transform="translate(144,0)"> + <set attributeName="fill" id="thirdSetOffset" to="#3F3" begin="setThreeTarget.click + 2s" dur="indefinite"/> + </rect> + </g> + + <g id="setFour" transform="translate(0, 75)"> + <set id="endBase" attributeName="display" to="inline" begin="7s" dur="1s"/> + <rect x="-6" y="-6" width="12" height="12" fill="#3F3" transform="translate(24,0)"> + <set attributeName="fill" to="#F33" end="secondSet.begin + 2s" dur="indefinite"/> + </rect> + <rect x="-6" y="-6" width="12" height="12" fill="#3F3" transform="translate(48,0)"> + <set attributeName="fill" to="#F33" end="secondSet.begin + 4s" dur="indefinite"/> + </rect> + <rect x="-6" y="-6" width="12" height="12" fill="#3F3" transform="translate(72,0)"> + <set attributeName="fill" to="#F33" end="endBase.end - 2s" dur="indefinite"/> + </rect> + <rect x="-6" y="-6" width="12" height="12" fill="#3F3" transform="translate(96,0)"> + <set attributeName="fill" to="#F33" end="endBase.end" dur="indefinite"/> + </rect> + </g> + + <g id="setFive" transform="translate(0, 100)"> + <rect x="-6" y="-6" width="12" height="12" fill="#F33"> + <set attributeName="fill" to="#3F3" end="indefinite" dur="indefinite"/> + </rect> + </g> + + <g id="setSix" transform="translate(0, 125)"> + <set id="repeatingSet" attributeName="display" to="inline" begin="0s" dur="1s" repeatCount="4"/> + <rect x="-6" y="-6" width="12" height="12" fill="#3F3" transform="translate(36,0)"> + <set attributeName="fill" to="#F33" end="repeatingSet.repeat(3)" dur="indefinite"/> + </rect> + <rect x="-6" y="-6" width="12" height="12" fill="#3F3" transform="translate(60,0)"> + <set attributeName="fill" to="#F33" end="repeatingSet.repeat(3) + 2s" dur="indefinite"/> + </rect> + </g> + + <g id="setSeven" transform="translate(0, 150)"> + <rect x="-6" y="-6" width="12" height="12" fill="#3F3" transform="translate(120,0)"> + <set attributeName="fill" to="#F33" end="accessKey(a)" dur="indefinite"/> + </rect> + <rect x="-6" y="-6" width="12" height="12" fill="#3F3" transform="translate(144,0)"> + <set attributeName="fill" to="#F33" end="accessKey(a) + 2s" dur="indefinite"/> + </rect> + </g> + + <g id="setEight" transform="translate(0, 175)"> + <rect x="-6" y="-6" width="12" height="12" fill="#F33"> + <set attributeName="fill" to="#3F3" end="wallclock(2200-06-10T12:34:56Z)" dur="indefinite"/> + </rect> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-63-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-63-t-manual.svg new file mode 100644 index 000000000..63cfc7a61 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-63-t-manual.svg @@ -0,0 +1,200 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-63-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + This tests validates multiple end conditions in the end attribute, + assuming support for the <set> element and setting the + dur attribute to 'indefinite'. + </p> + <p> + The test validates the various possibilities for the end attribute + value: multiple offset values, multiple event base values, multiple sync base + values, multiple repeat values, and multiple accessKey values. Finally, + the test validates that end values of different kinds can be mixed. + </p> + <p> + The test shows 6 rows where a red rectangle's x attribute is animated + with <set> elements. + </p> + <p> + On the first three rows, the red rectangles should show on the left from + 0 to 1s. From 1 to 2s, the rectangles should show on the right. Then + the rectangles should show on the left from 2 to 4s, then on the right + again from 4 to 5s and come back to the left position and stay there + after 5s. + </p> + <p> + On the fourth row, the rectangle's end condition is event based + and requires a user click. One of the end condition is defined + to be 5 seconds prior to the click and one is defined to be 5 + seconds after the click. If the user clicks on the rectangle + before 5 seconds (in document time), the red rectangle we move + to the left position 5 seconds after the click (because the + 'click - 5s' end time resolves to a time prior to the begin + time). If the user clicks after 5 seconds (in document time), + then the red rectangle moves to the left position immediately because + the 'click - 5s' time resolves to a time after the begin time. + </p> + <p> + On the fifth row, the rectangle's end condition is accessKey based + and requires a user to press the 'a' key. The behavior is exactly the + same as for the previous row, except that the triggering event + is the 'a' key press. + </p> + <p> + The last row's rectangle has a end condition with two offset values + (1s;4s) and should behave like the rectangles of the first three + rows for the first 5 seconds of the document's timeline. In addition, + the end condition has a click event base and thus, the rectangle + should immediately move to the left position if the user everytime the user + clicks clicks on the rectangle when it is on the right position. + Finally, the end condition also has an accessKey condition + for the 'b' character. Thus, the rectangle should move to the left + position every time the user presses the 'b' key and the rectangle is + on the right position. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. Observe the document for six seconds. + Then, click the red square in the "2 event base" row + and then press "a" on the keyboard.</p> + <p>Next, reload the test. Before five seconds have elapsed, + click the red square in the "2 event base" row and then + press "a" on the keyboard. Observe the document for another six seconds.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if the following conditions are met:</p> + <ul> + <li>In the first load of the document, the red squares in the top three + rows and the bottom row are in the relevant column according to the + times written above the columns: in left column for the first second + of the document, in the right column between 1s and 2s, in the left + column again between 2s and 4s, in the right column again between 4s + and 5s, and finally revert to the left column at 5s. During this + whole time, the red squares on the "2 event base" and "2 accessKeys" + rows must be in the right column.</li> + <li>In the first load of the document, immediately once the red + square is clicked, it must move to the left column.</li> + <li>In the first load of the document, immediately once "a" is pressed + on the keyboard, the red square in the "2 accessKeys" row must move + to the left column.</li> + <li>In the second load of the document, five seconds after the red + square is clicked, it must move to the left column.</li> + <li>In the second load of the document, five seconds after "a" is pressed + on the keyboard, the red square in the "2 accessKeys" row must move + to the left column.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-63-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text text-anchor="middle" x="240" y="30" font-size="20">multiple end</text> + <g transform="translate(100, 100)"> + <g transform="translate(80,25)" text-anchor="end" font-size="14"> + <text>2 offsets</text> + <text y="25">2 sync bases</text> + <text y="50">2 repeat</text> + <text y="100">2 event base</text> + <text y="125">2 accessKeys</text> + <text y="150">misc</text> + </g> + + <g id="timeMarkersText" transform="translate(150, 5)" text-anchor="middle" font-size="14"> + <text>0-1s</text> + <text y="-20">2s-4s</text> + <text y="-40">> 5s</text> + <g transform="translate(40,0)"> + <text>1-2s</text> + <text y="-20">4-5s</text> + </g> + </g> + + <g transform="translate(150,20)" stroke="black"> + <defs> + <rect id="shadow" x="-6" y="-6" width="12" height="12" fill="#ccc" stroke="black" stroke-width="1"/> + </defs> + + <g id="setOne"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="40"/> + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set id="firstSet" attributeName="x" to="34" begin="1s; 4s" end="2s; 5s" dur="indefinite"/> + </rect> + </g> + + <g id="setTwo" transform="translate(0, 25)"> + <set id="syncBase" attributeName="display" to="inline" begin="0s" dur="indefinite"/> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="40"/> + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="34" begin="1s; 4s" end="syncBase.begin+2s;syncBase.begin + 5s" dur="indefinite"/> + </rect> + </g> + + <g id="setThree" transform="translate(0, 50)"> + <set id="repeatBase" attributeName="display" to="inline" begin="0s" dur="1s" repeatDur="indefinite"/> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="40"/> + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="34" begin="1s; 4s" end="repeatBase.repeat(2);repeatBase.repeat(5)" dur="indefinite"/> + </rect> + </g> + + <g id="setFour" transform="translate(0, 100)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="40"/> + + <rect id="setFourTarget" x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="34" begin="0s" end="setFourTarget.click -5s; setFourTarget.click + 5s" dur="indefinite"/> + </rect> + </g> + + <g id="setFive" transform="translate(0, 125)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="40"/> + <rect id="setFiveTarget" x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="34" begin="0s" end="accessKey(a) - 5s;accessKey(a)+5s" dur="indefinite"/> + </rect> + </g> + + <g id="setSix" transform="translate(0, 150)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="40"/> + <rect id="setSixTarget" x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="34" begin="1s;4s" end="2s;5s;setSixTarget.click;accessKey(b)" dur="indefinite"/> + </rect> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-64-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-64-t-manual.svg new file mode 100644 index 000000000..f13a1e9d3 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-64-t-manual.svg @@ -0,0 +1,132 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-64-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + This tests performs basic tests on the dur attribute. + </p> + <p> + The first row shows a red rectangle subject to a <set> animation + with no begin attribute, no end attribute and a dur attribute set to + '2s'. Therefore, the animation should be active from 0 to 2 seconds and + then terminate. Consequently, the rectangle should show on the right + for the first two seconds, and then move to the left position. + </p> + <p> + The second row shows a red rectangle subject to a <set> animation + with no begin attribute, no end attribute and a dur attribute set to + 'indefinite'. Therefore, the animation should stay active indefinitely + and the rectangle should always be on the right position, never on the + left position. + </p> + <p> + Finally, the third row shows red rectangle subject to a <set> animation + with no begin attribute, no end attribute and a dur attribute set to + 'media'. In the context of SVG 1.1, this is equivalent to an 'indefinite' + value. Therefore, the animation should stay active indefinitely + and the rectangle should always be on the right position, never on the + left position. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if after three seconds, in each of the three rows, + the red rectangle is in the column at the times indicated. + Thus, from the document load until 2s afterwards, the red + square in the first row must be in the right column, + and after the 2s it must be in the left column. In the + other two rows, the red square must remain in the + right column.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-64-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text text-anchor="middle" x="240" y="30" font-size="20">dur</text> + <g transform="translate(100, 100)"> + <g transform="translate(80,25)" text-anchor="end" font-size="14"> + <text>clock value</text> + <text y="65">indefinite</text> + <text y="130">media</text> + </g> + + <g id="timeMarkersText" transform="translate(150, 5)" text-anchor="middle" font-size="14"> + <text>> 2s</text> + <text x="80">0s-2s</text> + + <g transform="translate(0, 65)"> + <text>never</text> + <text x="80">> 0s</text> + </g> + + <g transform="translate(0, 130)"> + <text>never</text> + <text x="80">> 0s</text> + </g> + </g> + + <g transform="translate(150,20)" stroke="black"> + <defs> + <rect id="shadow" x="-6" y="-6" width="12" height="12" fill="#ccc" stroke="black" stroke-width="1"/> + </defs> + + <g id="setOne"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set id="firstSet" attributeName="x" to="74" dur="2s"/> + </rect> + </g> + + <g id="setTwo" transform="translate(0, 65)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" dur="indefinite"/> + </rect> + </g> + + <g id="setThree" transform="translate(0, 130)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" dur="media"/> + </rect> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-65-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-65-t-manual.svg new file mode 100644 index 000000000..6c51f3f6b --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-65-t-manual.svg @@ -0,0 +1,223 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-65-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + This tests performs basic tests on the min attribute. The test is based + on the SMIL specification at: + http://www.w3.org/TR/smil20/smil-timing.html#Timing-MinMax. + </p> + <p> + Each row in the test shows different rectangles subject to <set> + animations with different configurations with regards to the min + attribute. For each row but the last one, the animation should be active + during the first 5 seconds of the animations where the red rectangle + should show in the right column. At five seconds into the animation, + all the rectangles should move to their left position. + </p> + <p> + On the first row, the first <set> animation (left rectangle) has an end value of 5s, + and no min attribute. The active duration resulting from the end attribute is 5s. + The first row shows a second rectangle with a <set> animation with + the same configuration except that the min attribute value is set to + 'media'. Because the <set> element does not define a media, the + behavior should be as if the attribute was not specified. The active duration (5s) + of the second <set> animation is therefore not constrained. + </p> + <p> + On the second row, the <set> animation has an end value of 5s, + and a -6s min attribute. The active duration resulting from the end attribute is 5s. + The negative min value is invalid and, as per the specification, the behavior should be + as if the attribute was not specified. The active duration (5s) is therefore not constrained. + </p> + <p> + On the third row, the <set> animation has an end value of 5s, + and a 3s min attribute. The active duration resulting from the end attribute is 5s. + The min value is less than the active duration, so the min attribute does not actually + constrain the active duration. + </p> + <p> + On the fourth row, the <set> animation has a dur value of indefinite, an end value of 2s, + and a 5s min attribute. The active duration resulting from the end attribute would be 2s. + Because this is less than the min value (2s < 5s) the (min constrained) active duration + has to be corrected to 5s, despite a simple duration (indefinite) that is greater than the min value. + </p> + <p> + On the fifth row, the <set> animation has a dur value of 1s, an end value of 2s, + a repeatCount of 7 and a 5s min attribute. The active duration resulting from dur, end and repeatCount + would be 2s. Because this is less than the min value (2s < 5s) + the (min constrained) active duration has to be corrected to 5s. + </p> + <p> + On the sixth row, the <set> animation has a dur value of 1s, an end + value of 2s, a repeatCount of 5 and a 8s min attribute value. + The active duration resulting from dur, end and repeatCount + would be 2s, because this is less than the min value (2s < 8s) + the active duration has to be corrected to 8s. As the + fill attribute is set to 'remove' on the <set> animation, this + remove is applied at 5s, the end of the repeatCount. + Note, that if the end of active duration would have been used as a + syncbase-value for another animation, the corrected end event at + (begin + min) = 8s has to be used. + </p> + <p> + On the seventh row, the <set> animation has a dur value of 1s, an end + value of 2s, a repeatCount of 5 and a 8s min attribute value. + The active duration resulting from dur, end and repeatCount + would be 2s, because this is less than the min value (2s < 8s) + the active duration has to be corrected to 8s. As the fill attribute + is set to 'freeze' on the <set> animation, the animation is frozen at + 5s, the end of the repeatCount, the <set> applies indefinitely. + Note, that if the end of active duration would have been used as a + syncbase-value for another animation, the corrected end event at + (begin + min) = 8s has to be used. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test and observe it for at least six seconds. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if the following conditions are met:</p> + <ul> + <li>For the first five seconds after the document loads, + all of the red squares in the top six rows are in the right column, and + after five seconds, they all move to the left column.</li> + <li>The red square in the last row is always in the right column.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-65-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text text-anchor="middle" x="240" y="30" font-size="20">min</text> + + <g transform="translate(100, 50)"> + + <g transform="translate(120,45)" text-anchor="end" font-size="14"> + <text>no min / media</text> + <text y="25">invalid min</text> + <text y="50">min < active dur</text> + <text y="75">min > active dur</text> + <text y="100">min < repeat dur</text> + <text y="125">min > repeat dur, remove</text> + <text y="180">min > repeat dur, freeze</text> + </g> + + <g id="timeMarkersText" transform="translate(150, 25)" text-anchor="middle" font-size="14"> + <text>> 5s</text> + <text x="80">0s-5s</text> + + <g transform="translate(0, 180)"> + <text>never</text> + <text x="80">> 0s</text> + </g> + </g> + + <g transform="translate(150,40)" stroke="black"> + <defs> + <rect id="shadow" x="-6" y="-6" width="12" height="12" fill="#ccc" stroke="black" stroke-width="1"/> + </defs> + + <g id="setOne"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set id="firstSet" attributeName="x" to="74" end="5s"/> + </rect> + + <g transform="translate(20, 0)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" end="5s" min="media"/> + </rect> + </g> + </g> + + <g id="setTwo" transform="translate(0, 25)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" min="-6s" end="5s"/> + </rect> + </g> + + <g id="setThree" transform="translate(0, 50)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" min="3s" end="5s"/> + </rect> + </g> + + <g id="setFour" transform="translate(0, 75)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" min="5s" dur="indefinite" end="2s"/> + </rect> + </g> + + <g id="setFive" transform="translate(0, 100)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" min="5s" end="2s" dur="1s" repeatCount="7"/> + </rect> + </g> + + <g id="setSix" transform="translate(0, 125)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" min="8s" end="2s" dur="1s" repeatCount="5" fill="remove"/> + </rect> + </g> + + <g id="setSeven" transform="translate(0, 180)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" min="8s" end="2s" dur="1s" repeatCount="5" fill="freeze"/> + </rect> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-66-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-66-t-manual.svg new file mode 100644 index 000000000..ed11acd50 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-66-t-manual.svg @@ -0,0 +1,199 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-66-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + This tests performs basic tests on the max attribute and on + combinations of the min and max attributes. The test is based + on the SMIL specification at: + http://www.w3.org/TR/smil20/smil-timing.html#Timing-MinMax. + </p> + <p> + Each row in the test shows different rectangles subject to <set> + animations with different configurations with regards to the max and min + attributes. For each row, the animation should be active + during the first 5 seconds of the animations where the red rectangle + should show in the right column. At five seconds into the animation, + all the rectangles should move to their left position. + </p> + <p> + On the first row, the <set> animation has a (0s <= t < 5s) active duration + and no max attribute so the actual active duration is (0s <= t < 5s). + The first row shows a second rectangle with a <set> animation with + the same configuration except that the max attribute value is set to + 'media'. Because the <set> element does not define a media, the + behavior should be as if the attribute was not specified. + </p> + <p> + On the second row, the <set> animation has a (0s <= t < 5s) active duration + and a min attribute set to '-6s' for the first rectangle and to 'foo' for the + second one. These values are invalid for max and, as + per the specification, the behavior should be as if the attribute was not + specified. Consequently, the behavior is as for the previous row and + the actual active duration is (0s <= t < 5s). + </p> + <p> + On the third row, the <set> animation has a (0s <= t < 8s) initial active duration + and a max attribute set to '5s'. The max value is less than the active + duration, so the max attribute constrains the active duration to (0s <= t < 5s). + </p> + <p> + On the fourth row, the <set> animation has a (0s <= t < 5s) initial active duration, + an indefinite simple duration (dur is set to indefinite) and a max attribute set to '8s'. + Because the initial active duration is less than the max attribute the active + duration is not constrained and is unchanged at (0s <= t < 5s). + </p> + <p> + On the fifth row, the <set> animation has a (0s <= t < indefinite) initial active duration, + a min of 2s and a max of 5s. Because the min value is less than the max value, both apply + and the computed active duration is (0s <= t < 5s). + </p> + <p> + On the sixth row, the <set> animation has a (0s <= t < indefinite) initial active duration, + a min of 5s and a max of 5s. Because the min value is equal to the max value, both apply + and the computed active duration is (0s <= t < 5s). + </p> + <p> + On the seventh row, the <set> animation has a [0s, 5s[[ initial active duration, + a min of 8s and a max of 2s. Because the min value is greater than the max value, both are + ignored and the computed active duration is [0s, 5s[. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test and observe it for at least six seconds. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if for the first five seconds after the document loads, + the red squares in each row (two in the first two rows, and one each in the + remaining rows) are in the right column, and after the five seconds, + they all move to the left column.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-66-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text text-anchor="middle" x="240" y="30" font-size="20">max</text> + <text text-anchor="middle" x="240" y="190" font-size="20">min & max</text> + <g transform="translate(100, 30)"> + <g transform="translate(120,45)" text-anchor="end" font-size="14"> + <text>no max / media</text> + <text y="25">invalid max values</text> + <text y="50">max < active dur</text> + <text y="75">max > active dur</text> + <text y="150">min < max</text> + <text y="175">min = max</text> + <text y="200">min > max (both ignored)</text> + </g> + <g id="timeMarkersText" transform="translate(150, 25)" text-anchor="middle" font-size="14"> + <text>> 5s</text> + <text x="80">0s-5s</text> + </g> + + <g transform="translate(150,40)" stroke="black"> + <defs> + <rect id="shadow" x="-6" y="-6" width="12" height="12" fill="#ccc" stroke="black" stroke-width="1"/> + </defs> + + <g id="setOne"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set id="firstSet" attributeName="x" to="74" end="5s"/> + </rect> + + <g transform="translate(20, 0)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" end="5s" max="media"/> + </rect> + </g> + </g> + + <g id="setTwo" transform="translate(0, 25)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" max="-6s" end="5s"/> + </rect> + + <g transform="translate(20, 0)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" end="5s" max="foo"/> + </rect> + </g> + </g> + + <g id="setThree" transform="translate(0, 50)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" max="5s" end="8s"/> + </rect> + </g> + + <g id="setFour" transform="translate(0, 75)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" max="8s" dur="indefinite" end="5s"/> + </rect> + </g> + + <g id="setFive" transform="translate(0, 150)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" min="2s" max="5s" dur="indefinite"/> + </rect> + </g> + + <g id="setSix" transform="translate(0, 175)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" min="5s" max="5s" dur="indefinite"/> + </rect> + </g> + + <g id="setSeven" transform="translate(0, 200)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" min="8s" max="2s" end="5s"/> + </rect> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-67-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-67-t-manual.svg new file mode 100644 index 000000000..4de722733 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-67-t-manual.svg @@ -0,0 +1,176 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-67-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + This tests performs basic tests on restart attribute. + </p> + <p> + Each row in the test shows different rectangles subject to <set> + animations with different configurations with regards to the restart + attribute. For each row, the animation should be active + during the first 5 seconds of the animations where the red rectangle + should show in the right column. At five seconds into the animation, + all the rectangles should move to their left position. + </p> + <p> + On the first row, the <set> animation has a begin attribute set to + '0s;1s' and a dur attribute set to 4s. This should result in a first + interval of (0s <= t < 4s) which should be superceeded, at 1s, by a new interval + of (1s <= t < 5s) because the default restart behavior is 'always'. + Consequently, the rectangle should be in the right position during the + (0s <= t < 5s) interval and move to the left position at 5s. + </p> + <p> + On the second row, the <set> animation has a begin attribute set to + '0s;1s', a dur attribute set to 4s and a restart attribute set to always. + The behavior should be the same as for the first row. + </p> + <p> + On the third row, the first (left most) rectangle's <set> animation + has a begin attribute set to '0s;1s', a dur set to 5s and a restart attribute + set to whenNotActive. Because of the rules for computing intervals, the + animation's interval is (0s <= t < 5s) and is not superseded by a (1s <= t < 6s) interval + because of the restart value. + + The second (right most) red rectangle's <set> animation has a begin + attribute set to '0s;2.5s' and a dur attribute set to 2.5s. This results in + a first interval (0s <= t < 2.5s) which is followed by a (2.5s <= t < 5s) interval. Consequently, + the rectangle stays on its right position for the first five seconds before it definitively + moves to the left position. + </p> + <p> + On the fourth row, the <set> animation has a begin attribute set to + '0s;5s' and a dur attribute set to 5s. This results in a first interval of (0s <= t < 5s). + Because the restart attribute is set to 'never', the following possible interval, + (5s <= t < 10s) does not apply and the animation is only active for the first 5 seconds. + </p> + <p> + The fifth row shows a simple animated red rectangle which lasts for 5 seconds. It shows + a reference of how the other animations should behave visually: all red rectangles should + have the same horizontal position as the one on the reference row, at any time during the + animation. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test and observe it for at least six seconds. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if for the first five seconds after the document loads, + the red squares in each row (two in the third row, and one each in the + remaining rows) are in the right column, and after the five seconds, + they all move to the left column.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-67-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text text-anchor="middle" x="240" y="30" font-size="20">restart</text> + + <g transform="translate(130, 80)"> + + <g transform="translate(120,45)" text-anchor="end" font-size="14"> + <text>no restart (defaults to always)</text> + <text y="25">restart="always"</text> + <text y="50">restart="whenNotActive"</text> + <text y="75">restart="never"</text> + <text y="100">reference</text> + </g> + + <g id="timeMarkersText" transform="translate(180, 25)" text-anchor="middle" font-size="14"> + <text>> 5s</text> + <text x="80">0s-5s</text> + </g> + + <g transform="translate(180,40)" stroke="black"> + <defs> + <rect id="shadow" x="-6" y="-6" width="12" height="12" fill="#ccc" stroke="black" stroke-width="1"/> + </defs> + + <g id="setOne"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set id="firstSet" attributeName="x" to="74" begin="0s;1s" dur="4s"/> + </rect> + + </g> + + <g id="setTwo" transform="translate(0, 25)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" begin="0s;1s" dur="4s" restart="always"/> + </rect> + + </g> + + <g id="setThree" transform="translate(0, 50)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" begin="0s;1s" dur="5s" restart="whenNotActive"/> + </rect> + + <g transform="translate(20,0)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" begin="0s;2.5s" dur="2.5s" restart="whenNotActive"/> + </rect> + </g> + </g> + + <g id="setFour" transform="translate(0, 75)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" begin="0s;5s" dur="5s" restart="never"/> + </rect> + </g> + + <g id="reference" transform="translate(0, 100)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" dur="5s"/> + </rect> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-68-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-68-t-manual.svg new file mode 100644 index 000000000..a8919530a --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-68-t-manual.svg @@ -0,0 +1,137 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-68-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + This tests performs basic tests on the repeatCount attribute. + </p> + <p> + Each row in the test shows different rectangles subject to <set> + animations with different configurations with regards to the repeatCount + attribute. For each row, the animation should be active + during the first 5 seconds of the animations where the red rectangle + should show in the right column. At five seconds into the animation, + all the rectangles should move to their left position. + </p> + <p> + On the first row, the <set> animation has its dur attribute set to + '5s' and its repeatCount unspecified. Consequently, its only interval + is (0s <= t < 5s). + </p> + <p> + On the second row, the <set> animation has its dur attribute set to + 1s and its repeatCount set to 5. Consequently, its only interval is + (0s <= t < 5s (1s*5)). + </p> + <p> + On the third row, the <set> animation has its dur attribute set to + 10s and its repeatCount set to 0.5. Consequently, its only interval is + (0s <= t < 5s (10s*0.5)) + </p> + <p> + On the fourth row, the <set> animation has its dur attribute set to + 1s and its repeatCount set to indefinite. It also has an end attribute + set to 5s. Consequently, the repeat duration is indefinite, but the active + duration is limited by the end attribute and the active interval is (0s <= t < 5s). + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test and observe it for at least six seconds. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if for the first five seconds after the document loads, + the red squares in each row are in the right column, and after the five seconds, + they all move to the left column.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-68-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text text-anchor="middle" x="240" y="30" font-size="20">repeatCount</text> + <g transform="translate(130, 80)"> + <g transform="translate(120,45)" text-anchor="end" font-size="14"> + <text>dur=5s repeatCount unspecified</text> + <text y="25">dur=1s repeatCount=5</text> + <text y="50">dur=10s repeatCount=0.5</text> + <text y="75">dur=1s repeatCount=indefinite</text> + <text y="90">end=5s</text> + </g> + + <g id="timeMarkersText" transform="translate(180, 25)" text-anchor="middle" font-size="14"> + <text>> 5s</text> + <text x="80">0s-5s</text> + </g> + <g transform="translate(180,40)" stroke="black"> + <defs> + <rect id="shadow" x="-6" y="-6" width="12" height="12" fill="#ccc" stroke="black" stroke-width="1"/> + </defs> + + <g id="setOne"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set id="firstSet" attributeName="x" to="74" dur="5s"/> + </rect> + + </g> + + <g id="setTwo" transform="translate(0, 25)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" dur="1s" repeatCount="5"/> + </rect> + + </g> + + <g id="setThree" transform="translate(0, 50)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" dur="10s" repeatCount="0.5"/> + </rect> + </g> + + <g id="setFour" transform="translate(0, 75)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" dur="1s" end="5s" repeatCount="indefinite"/> + </rect> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-69-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-69-t-manual.svg new file mode 100644 index 000000000..01d4284bb --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-69-t-manual.svg @@ -0,0 +1,155 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-69-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + This tests performs basic tests on the repeatDur attribute. + </p> + <p> + Each row in the test shows different rectangles subject to <set> + animations with different configurations with regards to the repeatDur + attribute. For each row, the animation should be active + during the first 5 seconds of the animations where the red rectangle + should show in the right column. At five seconds into the animation, + all the rectangles should move to their left position. + </p> + <p> + On the first row, the <set> animation has its dur attribute set to + '5s' and its repeatDur unspecified. Consequently, its only interval + is (0s <= t < 5s). + </p> + <p> + On the second row, the <set> animation has its dur attribute set to + 1s and its repeatDur set to 5s. Consequently, its only interval is + (0s <= t < 5s). + </p> + <p> + On the third row, the <set> animation has its dur attribute set to + 0.5s and its repeatDur set to 5s. Consequently, its only interval is + (0s <= t < 5s). + </p> + <p> + On the fourth row, the <set> animation has its dur attribute set to + 1s and its repeatDur set to indefinite. It also has an end attribute + set to 5s. Consequently, the repeat duration is indefinite, but the active + duration is limited by the end attribute and the active interval is (0s <= t < 5s). + </p> + <p> + On the fifth row, the <set> animation has its dur attribute set to + 0.7s and its repeatDur set to 5s. Consequently, its only interval is + (0s <= t < 5s). The difference with the 3rd row is that there is a fractional + number of simple durations in the active duration (7.1428) where there + is a whole number of simple durations in the third row (10). + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test and observe it for at least six seconds. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if for the first five seconds after the document loads, + the red squares in each row are in the right column, and after the five seconds, + they all move to the left column.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-69-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text text-anchor="middle" x="240" y="30" font-size="20">repeatDur</text> + <g transform="translate(130, 80)"> + <g transform="translate(120,45)" text-anchor="end" font-size="14"> + <text>dur=5s repeatDur unspecified</text> + <text y="25">dur=1s repeatDur=5s</text> + <text y="50">dur=0.5s repeatDur=5s</text> + <text y="75">dur=1s repeatDur=indefinite</text> + <text y="90">end=5s</text> + <text y="125">dur=0.7s repeatDur=5s</text> + </g> + + <g id="timeMarkersText" transform="translate(180, 25)" text-anchor="middle" font-size="14"> + <text>> 5s</text> + <text x="80">0s-5s</text> + </g> + + <g transform="translate(180,40)" stroke="black"> + <defs> + <rect id="shadow" x="-6" y="-6" width="12" height="12" fill="#ccc" stroke="black" stroke-width="1"/> + </defs> + + <g id="setOne"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set id="firstSet" attributeName="x" to="74" dur="5s"/> + </rect> + + </g> + + <g id="setTwo" transform="translate(0, 25)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" dur="1s" repeatDur="5s"/> + </rect> + + </g> + + <g id="setThree" transform="translate(0, 50)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" dur="0.5s" repeatDur="5s"/> + </rect> + </g> + + <g id="setFour" transform="translate(0, 75)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" dur="1s" end="5s" repeatDur="indefinite"/> + </rect> + </g> + + <g id="setFive" transform="translate(0, 125)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set attributeName="x" to="74" dur="0.7s" repeatDur="5s"/> + </rect> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-70-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-70-t-manual.svg new file mode 100644 index 000000000..7941ae594 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-70-t-manual.svg @@ -0,0 +1,152 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-70-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + This tests the animation's SMIL fill attribute. + </p> + <p> + On the first row, the <set> animation has its dur + attribute set to '1s' and its begin attribute set to '0s; + firstSet.end + 1s'. The fill attribute is unspecified, so + the effect is as if it was set to 'remove', because 'remove' is + the default value for fill. + + Consequently, the first interval is (0s <= t < 1s), the second is + (2s <= t < 3s), the third, (4s <= t < 5s) etc.. The red rectangle starts on the + right position, moves to the left position for one second, moves + to the right for 1 second, and so on. + </p> + <p> + On the second row, the <set> animation + with the identifier 'firstSet' has its dur attribute + set to 1s and its begin attribute set to '0s; firstSet.end'. The fill attribute + is set to 'remove'. The behavior should be exactly the same as for the previous + row, and the rectangle moves from the right position to the left position + every second. + </p> + <p> + On the third row, the <set> animation has its dur attribute set to + 1s and its begin attribute set to '0s; firstSet.end'. The fill attribute + is set to 'freeze'. The first interval should be (0s <= t < 1s), the second (2s <= t < 3s), + the third, (4s <= t < 5s), etc. Between interval, the fill behavior should be applied, + so the red rectangle should stay on the right position and never go to the + left position. + </p> + <p> + On the fourth row, the <set> animation has its dur attribute set to + 1s and its begin attribute set to '0s'. The fill attribute + is set to 'freeze'. The first interval should be (0s <= t < 1s) and there is no + following interval. Because of the fill behavior, the <set> should + apply the last (and only) animation value after 1s. Consequently, the + red rectangle should stay on the right position and never go to the + left position. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test and observe it for at least 5 seconds. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if for the duration of the test the following conditions are met:</p> + <ul> + <li>The red squares in the top two rows alternate between the left and the right column + at a rate of one movement per second. They must also be in the same column + at any given time.</li> + <li>The red squares in the bottom two rows stay in the right column.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-70-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text text-anchor="middle" x="240" y="30" font-size="20">fill</text> + <g transform="translate(130, 60)"> + <g transform="translate(120,45)" text-anchor="end" font-size="14"> + <text>fill unspecified (remove)</text> + <text y="25">fill=remove</text> + <text y="100">fill=freeze (with restart)</text> + <text y="125">fill=freeze (no restart)</text> + </g> + + <g id="timeMarkersText" transform="translate(180, 125)" text-anchor="middle" font-size="14"> + <text y="-15">never</text> + <text>here</text> + <text y="-15" x="80">always</text> + <text x="80">here</text> + </g> + + <g transform="translate(180,40)" stroke="black"> + <defs> + <rect id="shadow" x="-6" y="-6" width="12" height="12" fill="#ccc" stroke="black" stroke-width="1"/> + </defs> + + <g id="setOne"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set id="firstSet" attributeName="x" to="74" begin="0s; firstSet.end + 1s" dur="1s"/> + </rect> + + </g> + + <g id="setTwo" transform="translate(0, 25)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set id="secondSet" attributeName="x" to="74" begin="0s; secondSet.end + 1s" dur="1s" fill="remove"/> + </rect> + + </g> + + <g id="setThree" transform="translate(0, 100)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set id="thirdSet" attributeName="x" to="74" begin="0s; thirdSet.end + 1s" dur="1s" fill="freeze"/> + </rect> + </g> + + + <g id="setFour" transform="translate(0, 125)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <set id="fourthSet" attributeName="x" to="74" begin="0s" dur="1s" fill="freeze"/> + </rect> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-77-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-77-t-manual.svg new file mode 100644 index 000000000..f71a033ca --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-77-t-manual.svg @@ -0,0 +1,357 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="NR" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: animate-elem-77-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Tests the inheritance of animated values on text. + </p> + <p> + This test demonstrates how <set> elements change + text properties on a <text> element. For + each of the text properties being tested, 3 + <set> elements are set. The first <set> + element acts directly on the <text> element. The + second <set> element acts on a <g> containing + children. The third <set> element acts on an <a> + containing children. In each case the test validates that + the animated value set on the <g> and <a> + elements is inherited by the <text> element. + All the <set> elements have a begin attribute + set to 0s with an offset of 1s after end. + So, the animation will apply 1s after the document is loaded + and will repeat every 1s after the animation ends. + </p> + <p> + The first <set> validates the transform property. When + applied to the <text> element, the letter A will be + translated to the right every 1s, in the <text> column. + When applied to the <g> element, the letter A inherits the + transform value and is translated to the right every 1s, as + seen in the <g> column. When applied to the <a> + element, the letter A inherits the transform value and is + translated to the right every 1s, as seen in <a> column. + </p> + <p> + The second <set> validates the text-anchor attribute. + When applied to the <text> element, the anchor position + of letter A is moved from start to end. When applied to the + <g> and <a> element, the property is inherited + and hence the anchor position of letter A is moved from start + to end in the second row. + </p> + <p> + The third <set> validates the font-size attribute. + The font size of letter A is changed from 20 to 30. + When applied to <g> and <a> elements, the letter + A inherits the font-size and hence in row 3, letter A has a + font-size of 30 in all 3 right columns of row 3. + </p> + <p> + The fourth <set> validates the font-family attribute. + The font-family is changed from default to serif. + When applied to <g> and <a> elements, the letter + A inherits the font-family attribute and hence in row 4, + letter A has serif font-family in all 3 columns. + </p> + <p> + The fifth <set> validates the font-style attribute. + The font-style is changed from normal to italic. + When applied to <g> and <a> elements, the letter + A inherits the font-style attribute and hence in row 5, + letter A is animated to italic in all 3 columns. + </p> + <p> + The sixth <set> validates the font-weight attribute. + The font-weight is changed from normal to bold. + When applied to <g> and <a> elements, the letter + A inherits the font-weight attribute and hence in row 6, + letter A is changed to bold on the right. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The document is animated such that it alternates between two states, an alternation occurring every second. + For the test to pass each row must show a colored letter A that alternates between the two exact shapes and positions shown + by the gray silhouettes. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-77-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + <font-face font-family="FreeSerif" unicode-range="U+0-7F" font-weight="400"> + <font-face-src> + <font-face-uri xlink:href="../resources/FreeSerif.svg#FreeSerif"/> + </font-face-src> + </font-face> + <font-face font-family="FreeSerif" unicode-range="U+0-7F" font-weight="700"> + <font-face-src> + <font-face-uri xlink:href="../resources/FreeSerifBold.svg#FreeSerifBold"/> + </font-face-src> + </font-face> + <font-face font-family="FreeSerif" unicode-range="U+0-7F" font-weight="400" font-style="italic"> + <font-face-src> + <font-face-uri xlink:href="../resources/FreeSerifItalic.svg#FreeSerifItalic"/> + </font-face-src> + </font-face> + <font-face font-family="FreeSerif" unicode-range="U+0-7F" font-weight="700" font-style="italic"> + <font-face-src> + <font-face-uri xlink:href="../resources/FreeSerifBoldItalic.svg#FreeSerifBoldItalic"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="FreeSerif, serif" font-size="18"> + <text text-anchor="middle" x="240" y="30" font-size="20">text</text> + <g transform="translate(80, 80)"> + <g transform="translate(20,10)" text-anchor="end" font-size="14"> + <text x="5" y="15">transform</text> + <text x="5" y="50">text-anchor</text> + <text x="5" y="85">font-size</text> + <text x="5" y="120">font-family</text> + <text x="5" y="155">font-style</text> + <text x="5" y="190">font-weight</text> + </g> + + <g id="type" transform="translate(90, -10)" text-anchor="middle" font-size="14"> + <text x="20" y="3"><text></text> + <text x="135" y="3"><g></text> + <text x="250" y="3"><a></text> + </g> + + <g transform="translate(80,5)" text-anchor="start" font-size="20" fill="rgb(204,0,102)"> + <text id="one" x="10" y="20" fill="#aaa">A </text> + + <g id="setOne"> + <defs> + <g id="setOneRef"> + <text x="10" y="20" fill="#aaa">A </text> + <text x="10" y="20" fill="#aaa" transform="translate(30,0)">A </text> + </g> + </defs> + + <use xlink:href="#setOneRef"/> + <use xlink:href="#setOneRef" x="110"/> + <use xlink:href="#setOneRef" x="220"/> + + <text x="10" y="20"> + A + <animateTransform attributeName="transform" id="firstSet" type="translate" from="30,0" to="30,0" begin="0s; firstSet.end + 1s" dur="1s"/> + </text> + + <g transform="translate(110, 0)"> + <animateTransform attributeName="transform" id="secondSet" type="translate" from="140,0" to="140,0" begin="0s; secondSet.end + 1s" dur="1s"/> + <text x="10" y="20">A</text> + </g> + + <a xlink:href="" transform="translate(220, 0)"> + <animateTransform attributeName="transform" id="thirdSet" type="translate" from="250,0" to="250,0" begin="0s; thirdSet.end + 1s" dur="1s"/> + <text x="10" y="20">A</text> + </a> + </g> + + <g id="setTwo" transform="translate(0,35)"> + <defs> + <g id="setTwoRef"> + <text x="10" y="20" fill="#aaa">A </text> + <text x="10" y="20" fill="#aaa" transform="translate(40,0)" text-anchor="end">A</text> + </g> + </defs> + + <use xlink:href="#setTwoRef"/> + <use xlink:href="#setTwoRef" x="110"/> + <use xlink:href="#setTwoRef" x="220"/> + + <text x="10" y="20"> + A + <set id="secondSet1" attributeName="text-anchor" to="end" begin="0s; secondSet1.end + 1s" dur="1s"/> + <animateTransform attributeName="transform" id="secondSet1_1" type="translate" from="40,0" to="40,0" begin="0s; secondSet1_1.end + 1s" dur="1s"/> + </text> + + <g> + <set id="secondSet2" attributeName="text-anchor" to="end" begin="0s; secondSet2.end + 1s" dur="1s"/> + <text x="120" y="20"> + A + <animateTransform attributeName="transform" id="secondSet2_1" type="translate" from="40,0" to="40,0" begin="0s; secondSet2_1.end + 1s" dur="1s"/> + </text> + </g> + + <a> + <set id="secondSet3" attributeName="text-anchor" to="end" begin="0s; secondSet3.end + 1s" dur="1s"/> + <text x="230" y="20"> + A + <animateTransform attributeName="transform" id="secondSet3_1" type="translate" from="40,0" to="40,0" begin="0s; secondSet3_1.end + 1s" dur="1s"/> + </text> + </a> + </g> + + <g id="setThree" transform="translate(0,70)"> + <defs> + <g id="setThreeRef"> + <text x="10" y="20" fill="#aaa">A </text> + <text x="40" y="20" font-size="30" fill="#aaa">A</text> + </g> + </defs> + <use xlink:href="#setThreeRef"/> + <use xlink:href="#setThreeRef" x="110"/> + <use xlink:href="#setThreeRef" x="220"/> + + <text x="10" y="20"> + A + <set id="thirdSet1" attributeName="font-size" to="30" begin="0s; thirdSet1.end + 1s" dur="1s"/> + <animateTransform attributeName="transform" id="thirdSet1_1" type="translate" from="30,0" to="30,0" begin="0s; thirdSet1_1.end + 1s" dur="1s"/> + </text> + + <g> + <set id="thirdSet2" attributeName="font-size" to="30" begin="0s; thirdSet2.end + 1s" dur="1s"/> + <text x="120" y="20"> + A + <animateTransform attributeName="transform" id="thirdSet2_1" type="translate" from="30,0" to="30,0" begin="0s; thirdSet2_1.end + 1s" dur="1s"/> + </text> + </g> + + <a> + <set id="thirdSet3" attributeName="font-size" to="30" begin="0s; thirdSet3.end + 1s" dur="1s"/> + <text x="230" y="20"> + A + <animateTransform attributeName="transform" id="thirdSet3_1" type="translate" from="30, 0" to="30,0" begin="0s; thirdSet3_1.end + 1s" dur="1s"/> + </text> + </a> + </g> + + <g id="setFour" transform="translate(0,105)"> + <defs> + <g id="setFourRef"> + <text x="10" y="20" font-size="30" fill="#aaa" font-family="sans-serif">A</text> + <text x="40" y="20" font-size="30" fill="#aaa" font-family="serif">A</text> + </g> + </defs> + <use xlink:href="#setFourRef"/> + <use xlink:href="#setFourRef" x="110"/> + <use xlink:href="#setFourRef" x="220"/> + + <text x="10" y="20" font-size="30" font-family="sans-serif"> + A + <set id="fourthSet1" attributeName="font-family" to="serif" begin="0s; fourthSet1.end + 1s" dur="1s"/> + <animateTransform attributeName="transform" id="fourthSet1_1" type="translate" from="30,0" to="30,0" begin="0s; fourthSet1_1.end + 1s" dur="1s"/> + </text> + + <g transform="translate(110,0)" font-family="sans-serif"> + <set id="fourthSet2" attributeName="font-family" to="serif" begin="0s; fourthSet2.end + 1s" dur="1s"/> + <text x="10" y="20" font-size="30"> + A + <animateTransform attributeName="transform" id="fourthSet2_1" type="translate" from="30,0" to="30,0" begin="0s; fourthSet2_1.end + 1s" dur="1s"/> + </text> + </g> + + <a xlink:href="" transform="translate(220,0)" font-family="sans-serif"> + <set id="fourthSet3" attributeName="font-family" to="serif" begin="0s; fourthSet3.end + 1s" dur="1s"/> + <text x="10" y="20" font-size="30"> + A + <animateTransform attributeName="transform" id="fourthSet3_1" type="translate" from="30,0" to="30,0" begin="0s; fourthSet2_1.end + 1s" dur="1s"/> + </text> + </a> + + </g> + + <g id="setFive" transform="translate(0,140)"> + <defs> + <g id="setFiveRef"> + <text x="10" y="20" fill="#aaa">A</text> + <text x="40" y="20" fill="#aaa" font-style="italic">A</text> + </g> + </defs> + + <use xlink:href="#setFiveRef"/> + <use xlink:href="#setFiveRef" x="110"/> + <use xlink:href="#setFiveRef" x="220"/> + + <text x="10" y="20"> + A + <set id="fifthSet1" attributeName="font-style" to="italic" begin="0s; fifthSet1.end + 1s" dur="1s"/> + <animateTransform attributeName="transform" id="fifthSet1_1" type="translate" from="30,0" to="30,0" begin="0s; fifthSet1_1.end + 1s" dur="1s"/> + </text> + + <g transform="translate(110,0)"> + <set id="fifthSet2" attributeName="font-style" to="italic" begin="0s; fifthSet2.end + 1s" dur="1s"/> + <text x="10" y="20"> + A + <animateTransform attributeName="transform" id="fifthSet2_1" type="translate" from="30,0" to="30,0" begin="0s; fifthSet2_1.end + 1s" dur="1s"/> + </text> + </g> + + <a xlink:href="" transform="translate(220,0)"> + <set id="fifthSet3" attributeName="font-style" to="italic" begin="0s; fifthSet3.end + 1s" dur="1s"/> + <text x="10" y="20"> + A + <animateTransform attributeName="transform" id="fifthSet3_1" type="translate" from="30,0" to="30,0" begin="0s; fifthSet3_1.end + 1s" dur="1s"/> + </text> + </a> + </g> + + <g id="setSix" transform="translate(0,175)"> + <defs> + <g id="setSixRef"> + <text x="10" y="20" fill="#aaa">A</text> + <text x="40" y="20" fill="#aaa" font-weight="bold">A</text> + </g> + </defs> + + <use xlink:href="#setSixRef"/> + <use xlink:href="#setSixRef" x="110"/> + <use xlink:href="#setSixRef" x="220"/> + + <text x="10" y="20"> + A + <set id="sixthSet1" attributeName="font-weight" to="bold" begin="0s; sixthSet1.end + 1s" dur="1s"/> + <animateTransform attributeName="transform" id="sixthSet1_1" type="translate" from="30,0" to="30,0" begin="0s; sixthSet1_1.end + 1s" dur="1s"/> + </text> + + <g transform="translate(110,0)"> + <set id="sixthSet2" attributeName="font-weight" to="bold" begin="0s; sixthSet2.end + 1s" dur="1s"/> + <text x="10" y="20"> + A + <animateTransform attributeName="transform" id="sixthSet2_1" type="translate" from="30,0" to="30,0" begin="0s; sixthSet2_1.end + 1s" dur="1s"/> + </text> + </g> + + <a xlink:href="" transform="translate(220,0)"> + <set id="sixthSet3" attributeName="font-weight" to="bold" begin="0s; sixthSet3.end + 1s" dur="1s"/> + <text x="10" y="20"> + A + <animateTransform attributeName="transform" id="sixthSet3_1" type="translate" from="30,0" to="30,0" begin="0s; sixthSet3_1.end + 1s" dur="1s"/> + </text> + </a> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-78-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-78-t-manual.svg new file mode 100644 index 000000000..31aceb503 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-78-t-manual.svg @@ -0,0 +1,563 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="NR" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: animate-elem-78-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + This test demonstrates how <set> elements change + graphics properties on elements from the 'Basic Shapes' chapter. For + each of the graphics properties being tested, 3 + <set> elements are set. The first <set> + element acts directly on the 'Basic Shape' element. The + <set> element acts on a <g> containing + children. The third <set> element acts on an <a> + containing children. In each case the test validates that + the animated value set on the <g> and <a> + elements is inherited by the 'Basic Shape' element. + All the <set> elements have a begin attribute + set to 0s with an offset of 1s after end. + So, the animation will apply 1s after the document is loaded + and will repeat every 1s after the animation ends. + </p> + <p> + The first <set> validates the fill property, with + fill set to orange. When applied directly to the 'Basic Shape' + element, the <rect> fill value will change to orange + when it is translated to the right every 1s. When applied + to the <g> and <a> elements, the <rect> + inherits the fill value and is orange. + </p> + <p> + The second <set> validates the fill-style property, + with fill-style set to evenodd. When applied to the + 'Basic Shape' element, the <polyline> fill-style is + changed from nonzero to evenodd. When applied to the + <g> and <a> elements, the <polyline> inherits + the evenodd fill-style. + </p> + <p> + the third <set> validates the stroke property. + In this case fill is set to none. When stroke is applied + to the 'Basic Shape' element, the <rect> on the right + appears with the stroke color. When applied to the <g> and + <a> elements, the <rect> inherits the stroke property. + </p> + <p> + the fourth <set> validates the stroke-width property, + with stroke-width set to 4. When stroke-width is applied + to the 'Basic Shape' element, the <line> on the right + has a width of 4. When applied to the <g> and + <a> elements, the <line> inherits the stroke-width. + </p> + <p> + the fifth <set> validates the stroke-linecap property, + with stroke-linecap set to round. When stroke-linecap is applied + to the 'Basic Shape' element, the <line> stroke-linecap + value switches from butt to round. When applied to the <g> + and <a> elements, the <line> inherits the + square stroke-linecap. + </p> + <p> + the sixth <set> validates the stroke-linejoin property, + with stroke-linejoin set to bevel. When stroke-linejoin is applied + to the 'Basic Shape' element, the <line> stroke-linejoin + value switches from miter to bevel. When applied to the <g> + and <a> elements, the <line> inherits the + bevel stroke-linejoin. + </p> + <p> + the seventh <set> validates the stroke-miterlimit property, + with stroke-miterlimit set to 10. When stroke-miterlimit + is applied to the 'Basic Shape' element, the miter-length to + stroke-width ratio exceeds the miter-limit and the + <polyline> switches from bevel to miter.When applied + to the <g> and <a> elements,the <line> + inherits the stroke-miterlimit. + </p> + <p> + the eighth <set> validates the stroke-dashoffset property, + with stroke-dashoffset set to 5.5. When stroke-dashoffset is applied + to the 'Basic Shape' element, the <line> has a different + dashing pattern. When applied to the <g> and <a> + elements, the <line> inherits the property. + </p> + <p> + the ninth <set> validates the display property, + with display set to none. When display is applied + to the 'Basic Shape' element, the <rect> does not + appear on the right. When applied to the <g> and <a> + elements, the <line> inherits the display property and + hence is not seen. + </p> + <p> + the tenth <set> validates the visibility property, + with visibility set to hidden. When visibility is applied + to the 'Basic Shape' element, the <rect> is hidden + on the right. When applied to the <g> and <a> + elements, the <line> inherits the visibility property + and hence is not seen. + </p> + <p> + the eleventh <set> validates the color property, + with color set to blue. When color is applied to the + 'Basic Shape' element, the <rect> on the right + switches from default color of black to blue. When + applied to the <g> and <a> + elements, the <line> inherits the color property. + </p> + <p> + The eleventh <set> validates the color property, with + color set to orange. When applied directly to the 'Basic Shape' + element, the <rect> fill value will change to orange + when it is translated to the right every 1s. When applied + to the <g> and <a> elements, the <rect> + inherits the color value, and via its fill="currentColor" + becomes orange. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The document is animated such that it alternates between two states, + an alternation occurring every second. In each row there are three + sub-tests, which must behave identically except for any differences + noted below. Each sub-test consists of a colored shape that in one + state appears in the left column and in the second state appears in + the right column. The test is passed if the following conditions are + met:</p> + <ul> + <li>For the fill-rule, stroke-width, stroke-linecap, stroke-linejoin, + stroke-miterlimit and stroke-dashoffset rows, the red shape must + take the exact shape and position of the two gray silhouettes + when animating between the two states.</li> + <li>For the fill row, the colored square must take the exact + shape and position of the two gray silhouettes when animating + between the two states. When in the left column, it must be red, + and when in the right column, it must be orange.</li> + <li>For the color row, the colored square must take the exact + shape and position of the two gray silhouettes when animating + between the two states. When in the left column, it must be + red, and when in the right column, it must be orange.</li> + <li>For the stroke row, the shape must be invisible when in the + left column, and must be a red-stroked, empty-filled square + matching the size and position of the gray silhouette when + in the right column.</li> + <li>For the display and visibility rows, the shape must be a red + square matching the size and position of the gray silhouette + when in the left column, and must be invisible when in the right + column.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-78-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text text-anchor="middle" x="240" y="25" font-size="20">graphics</text> + <g transform="translate(80, 75)"> + <g transform="translate(30,10)" text-anchor="end" font-size="12"> + <text>fill</text> + <text y="20">fill-rule</text> + <text y="40">stroke</text> + <text y="60">stroke-width</text> + <text y="80">stroke-linecap</text> + <text y="100">stroke-linejoin</text> + <text y="120">stroke-miterlimit</text> + <text y="140">stroke-dashoffset</text> + <text y="160">display</text> + <text y="180">visibility</text> + <text y="200">color</text> + </g> + + <g id="type" transform="translate(90, -20)" text-anchor="middle" font-size="14"> + <text x="20" y="3">'Basic Shape'</text> + <text x="130" y="3"><g></text> + <text x="235" y="3"><a></text> + </g> + + <g transform="translate(80,0)" fill="rgb(204,0,102)"> + <rect x="10" width="8" height="8" fill="#ccc"/> + + <g id="setOne"> + <defs> + <g id="setOneRef"> + <rect x="10" width="8" height="8" fill="#ccc"/> + <rect x="10" width="8" height="8" fill="#ccc" transform="translate(30,0)"/> + </g> + </defs> + <use xlink:href="#setOneRef"/> + <use xlink:href="#setOneRef" x="110"/> + <use xlink:href="#setOneRef" x="220"/> + + <rect x="10" width="8" height="8"> + <set id="firstSet1" attributeName="fill" to="rgb(255, 165, 0)" begin="0s; firstSet1.end + 1s" dur="1s"/> + <animateTransform attributeName="transform" id="firstSet1_1" type="translate" from="30,0" to="30,0" begin="0s; firstSet1_1.end + 1s" dur="1s"/> + </rect> + + <g transform="translate(110, 0)"> + <set id="firstSet2" attributeName="fill" to="rgb(255, 165, 0)" begin="0s; firstSet2.end + 1s" dur="1s"/> + <rect x="10" width="8" height="8"> + <animateTransform attributeName="transform" id="firstSet2_1" type="translate" from="30, 0" to="30,0" begin="0s; firstSet2_1.end + 1s" dur="1s"/> + </rect> + </g> + + <a xlink:href="" transform="translate(220, 0)"> + <set id="firstSet3" attributeName="fill" to="rgb(255, 165, 0)" begin="0s; firstSet3.end + 1s" dur="1s"/> + <rect x="10" width="8" height="8"> + <animateTransform attributeName="transform" id="firstSet3_1" type="translate" from="30, 0" to="30,0" begin="0s; firstSet3_1.end + 1s" dur="1s"/> + </rect> + </a> + + </g> + <g id="setTwo" transform="translate(5,15)" stroke="rgb(204,0,102)"> + <defs> + <g id="setTwoRef"> + <polyline fill="#ccc" stroke="#ccc" stroke-width="1" points="20,10,0,10,15,20,10,2,5,20,20,10"> + </polyline> + <polyline fill="#ccc" stroke="#ccc" fill-rule="evenodd" stroke-width="1" points="20,10,0,10,15,20,10,2,5,20,20,10" transform="translate(30,0)"> + </polyline> + </g> + </defs> + <use xlink:href="#setTwoRef"/> + <use xlink:href="#setTwoRef" x="110"/> + <use xlink:href="#setTwoRef" x="220"/> + + <polyline points="20,10,0,10,15,20,10,2,5,20,20,10"> + <set id="secondSet1" attributeName="fill-rule" to="evenodd" begin="0s; secondSet1_1.end + 1s" dur="1s"/> + <animateTransform attributeName="transform" id="secondSet1_1" type="translate" from="30, 0" to="30,0" begin="0s; secondSet1_1.end + 1s" dur="1s"/> + </polyline> + + <g transform="translate(110, 0)"> + <set id="secondSet2" attributeName="fill-rule" to="evenodd" begin="0s; secondSet2_1.end + 1s" dur="1s"/> + <polyline points="20,10,0,10,15,20,10,2,5,20,20,10"> + <animateTransform attributeName="transform" id="secondSet2_1" type="translate" from="30, 0" to="30,0" begin="0s; secondSet2_1.end + 1s" dur="1s"/> + </polyline> + </g> + + <a xlink:href="" transform="translate(220, 0)"> + <set id="secondSet3" attributeName="fill-rule" to="evenodd" begin="0s; secondSet3_1.end + 1s" dur="1s"/> + <polyline points="20,10,0,10,15,20,10,2,5,20,20,10"> + <animateTransform attributeName="transform" id="secondSet3_1" type="translate" from="30, 0" to="30,0" begin="0s; secondSet3_1.end + 1s" dur="1s"/> + </polyline> + </a> + + </g> + + <g id="setThree" transform="translate(0,45)" fill="none"> + <defs> + <g id="setThreeRef"> + <rect x="10" width="8" height="8" fill="#ccc"/> + <rect x="10" width="8" height="8" fill="#ccc" transform="translate(30,0)"/> + </g> + </defs> + <use xlink:href="#setThreeRef"/> + <use xlink:href="#setThreeRef" x="110"/> + <use xlink:href="#setThreeRef" x="220"/> + + <rect x="10" width="8" height="8"> + <set id="thirdSet1" attributeName="stroke" to="rgb(204,0,102)" begin="0s; thirdSet1.end + 1s" dur="1s"/> + <animateTransform attributeName="transform" id="thirdSet1_1" type="translate" from="30, 0" to="30,0" begin="0s; thirdSet1_1.end + 1s" dur="1s"/> + </rect> + + <g transform="translate(110, 0)"> + <set id="thirdSet2" attributeName="stroke" to="rgb(204,0,102)" begin="0s; thirdSet2.end + 1s" dur="1s"/> + <rect x="10" width="8" height="8"> + <animateTransform attributeName="transform" id="thirdSet2_1" type="translate" from="30, 0" to="30,0" begin="0s; thirdSet2_1.end + 1s" dur="1s"/> + </rect> + </g> + + <a xlink:href="" transform="translate(220, 0)"> + <set id="thirdSet3" attributeName="stroke" to="rgb(204,0,102)" begin="0s; thirdSet3.end + 1s" dur="1s"/> + <rect x="10" width="8" height="8"> + <animateTransform attributeName="transform" id="thirdSet3_1" type="translate" from="30, 0" to="30,0" begin="0s; thirdSet3_1.end + 1s" dur="1s"/> + </rect> + </a> + </g> + + <g id="setFour" transform="translate(0,60)" stroke="rgb(204,0,102)"> + <defs> + <g id="setFourRef"> + <line x1="10" y1="8" x2="20" y2="0" stroke="#ccc"> + </line> + <line x1="10" y1="8" x2="20" y2="0" stroke-width="4" stroke="#ccc" transform="translate(30,0)"> + </line> + </g> + </defs> + <use xlink:href="#setFourRef"/> + <use xlink:href="#setFourRef" x="110"/> + <use xlink:href="#setFourRef" x="220"/> + + <line x1="10" y1="8" x2="20" y2="0"> + <set id="fourthSet1" attributeName="stroke-width" to="4" begin="0s; fourthSet1.end + 1s" dur="1s"/> + <animateTransform attributeName="transform" id="fourthSet1_1" type="translate" from="30, 0" to="30,0" begin="0s; fourthSet1_1.end + 1s" dur="1s"/> + </line> + + <g transform="translate(110, 0)"> + <set id="fourthSet2" attributeName="stroke-width" to="4" begin="0s; fourthSet2.end + 1s" dur="1s"/> + <line x1="10" y1="8" x2="20" y2="0"> + <animateTransform attributeName="transform" id="fourthSet2_1" type="translate" from="30, 0" to="30,0" begin="0s; fourthSet2_1.end + 1s" dur="1s"/> + </line> + </g> + + <a xlink:href="" transform="translate(220, 0)"> + <set id="fourthSet3" attributeName="stroke-width" to="4" begin="0s; fourthSet3.end + 1s" dur="1s"/> + <line x1="10" y1="8" x2="20" y2="0"> + <animateTransform attributeName="transform" id="fourthSet3_1" type="translate" from="30, 0" to="30,0" begin="0s; fourthSet3_1.end + 1s" dur="1s"/> + </line> + </a> + </g> + + <g id="setFive" transform="translate(0,80)" stroke-width="4" stroke="rgb(204,0,102)"> + <defs> + <g id="setFiveRef"> + <line x1="10" y1="8" x2="20" y2="0" stroke="#ccc"> + </line> + <line x1="10" y1="8" x2="20" y2="0" stroke-linecap="round" stroke="#ccc" transform="translate(30,0)"> + </line> + </g> + </defs> + <use xlink:href="#setFiveRef"/> + <use xlink:href="#setFiveRef" x="110"/> + <use xlink:href="#setFiveRef" x="220"/> + + <line x1="10" y1="8" x2="20" y2="0"> + <set id="fifthSet1" attributeName="stroke-linecap" to="round" begin="0s; fifthSet1.end + 1s" dur="1s"/> + <animateTransform attributeName="transform" id="fifthSet1_1" type="translate" from="30, 0" to="30,0" begin="0s; fifthSet1_1.end + 1s" dur="1s"/> + </line> + + <g transform="translate(110, 0)"> + <set id="fifthSet2" attributeName="stroke-linecap" to="round" begin="0s; fifthSet2.end + 1s" dur="1s"/> + <line x1="10" y1="8" x2="20" y2="0"> + <animateTransform attributeName="transform" id="fifthSet2_1" type="translate" from="30, 0" to="30,0" begin="0s; fifthSet2_1.end + 1s" dur="1s"/> + </line> + </g> + + <a xlink:href="" transform="translate(220, 0)"> + <set id="fifthSet3" attributeName="stroke-linecap" to="round" begin="0s; fifthSet3.end + 1s" dur="1s"/> + <line x1="10" y1="8" x2="20" y2="0"> + <animateTransform attributeName="transform" id="fifthSet3_1" type="translate" from="30, 0" to="30,0" begin="0s; fifthSet3_1.end + 1s" dur="1s"/> + </line> + </a> + </g> + + <g id="setSix" transform="translate(5,100)" fill="none" stroke-miterlimit="10" stroke-width="3" stroke="rgb(204,0,102)"> + <defs> + <g id="setSixRef"> + <polyline stroke="#ccc" points="5,2,20,5,5,8"> + </polyline> + <polyline stroke="#ccc" points="5,2,20,5,5,8" stroke-linejoin="bevel" transform="translate(30,0)"> + </polyline> + </g> + </defs> + <use xlink:href="#setSixRef"/> + <use xlink:href="#setSixRef" x="110"/> + <use xlink:href="#setSixRef" x="220"/> + + <polyline points="5,2,20,5,5,8"> + <set id="sixthSet1" attributeName="stroke-linejoin" to="bevel" begin="0s; sixthSet1.end + 1s" dur="1s"/> + <animateTransform attributeName="transform" id="sixthSet1_1" type="translate" from="30, 0" to="30,0" begin="0s; sixthSet1_1.end + 1s" dur="1s"/> + </polyline> + + <g transform="translate(110, 0)"> + <set id="sixthSet2" attributeName="stroke-linejoin" to="bevel" begin="0s; sixthSet2.end + 1s" dur="1s"/> + <polyline points="5,2,20,5,5,8"> + <animateTransform attributeName="transform" id="sixthSet2_1" type="translate" from="30, 0" to="30,0" begin="0s; sixthSet2_1.end + 1s" dur="1s"/> + </polyline> + </g> + + <a xlink:href="" transform="translate(220, 0)"> + <set id="sixthSet3" attributeName="stroke-linejoin" to="bevel" begin="0s; sixthSet3.end + 1s" dur="1s"/> + <polyline points="5,2,20,5,5,8"> + <animateTransform attributeName="transform" id="sixthSet3_1" type="translate" from="30, 0" to="30,0" begin="0s; sixthSet3_1.end + 1s" dur="1s"/> + </polyline> + </a> + </g> + + <g id="setSeven" transform="translate(5,120)" stroke-miterlimit="1" fill="none" stroke-width="3" stroke="rgb(204,0,102)"> + <defs> + <g id="setSevenRef"> + <polyline points="5,0,20,5,5,10" stroke="#ccc"/> + <polyline points="5,0,20,5,5,10" stroke="#ccc" stroke-miterlimit="10" transform="translate(30,0)"/> + </g> + </defs> + <use xlink:href="#setSevenRef"/> + <use xlink:href="#setSevenRef" x="110"/> + <use xlink:href="#setSevenRef" x="220"/> + + <polyline points="5,0,20,5,5,10"> + <set id="seventhSet1" attributeName="stroke-miterlimit" to="10" begin="0s; seventhSet1.end + 1s" dur="1s"/> + <animateTransform attributeName="transform" id="seventhSet1_1" type="translate" from="30, 0" to="30,0" begin="0s; seventhSet1_1.end + 1s" dur="1s"/> + </polyline> + + <g transform="translate(110, 0)"> + <set id="seventhSet2" attributeName="stroke-miterlimit" to="10" begin="0s; seventhSet2.end + 1s" dur="1s"/> + <polyline points="5,0,20,5,5,10"> + <animateTransform attributeName="transform" id="seventhSet2_1" type="translate" from="30, 0" to="30,0" begin="0s; seventhSet2_1.end + 1s" dur="1s"/> + </polyline> + </g> + + <a xlink:href="" transform="translate(220, 0)"> + <set id="seventhSet3" attributeName="stroke-miterlimit" to="10" begin="0s; seventhSet3.end + 1s" dur="1s"/> + <polyline points="5,0,20,5,5,10"> + <animateTransform attributeName="transform" id="seventhSet3_1" type="translate" from="30, 0" to="30,0" begin="0s; seventhSet3_1.end + 1s" dur="1s"/> + </polyline> + </a> + + </g> + + <g id="setEight" transform="translate(-5,145)" stroke-dasharray="3,4,5" stroke-width="3" stroke="rgb(204,0,102)"> + <defs> + <g id="setEightRef"> + <line x1="0" y1="0" x2="25" y2="0" stroke="#ccc"/> + <line x1="0" y1="0" x2="25" y2="0" stroke="#ccc" stroke-dashoffset="5.5" transform="translate(40,0)"/> + </g> + </defs> + <use xlink:href="#setEightRef"/> + <use xlink:href="#setEightRef" x="110"/> + <use xlink:href="#setEightRef" x="220"/> + + <line x1="0" y1="0" x2="25" y2="0"> + <set id="eighthSet1" attributeName="stroke-dashoffset" to="5.5" begin="0s; eighthSet1.end + 1s" dur="1s"/> + <animateTransform attributeName="transform" id="eighthSet1_1" type="translate" from="40, 0" to="40,0" begin="0s; eighthSet1_1.end + 1s" dur="1s"/> + </line> + + <g transform="translate(110, 0)"> + <set id="eighthSet2" attributeName="stroke-dashoffset" to="5.5" begin="0s; eighthSet2.end + 1s" dur="1s"/> + <line x1="0" y1="0" x2="25" y2="0"> + <animateTransform attributeName="transform" id="eighthSet2_1" type="translate" from="40, 0" to="40,0" begin="0s; eighthSet2_1.end + 1s" dur="1s"/> + </line> + </g> + + <a xlink:href="" transform="translate(220, 0)"> + <set id="eighthSet3" attributeName="stroke-dashoffset" to="5.5" begin="0s; eighthSet3.end + 1s" dur="1s"/> + <line x1="0" y1="0" x2="25" y2="0"> + <animateTransform attributeName="transform" id="eighthSet3_1" type="translate" from="40, 0" to="40,0" begin="0s; eighthSet3_1.end + 1s" dur="1s"/> + </line> + </a> + </g> + + <g id="setNine" transform="translate(0,160)"> + <defs> + <g id="setNineRef"> + <rect x="10" width="8" height="8" fill="#ccc"/> + <rect x="10" width="8" height="8" fill="#ccc" transform="translate(30,0)"/> + </g> + </defs> + <use xlink:href="#setNineRef"/> + <use xlink:href="#setNineRef" x="110"/> + <use xlink:href="#setNineRef" x="220"/> + <rect x="10" width="8" height="8"> + <set id="ninthSet1" attributeName="display" to="none" begin="0s; ninthSet1.end + 1s" dur="1s"/> + <animateTransform attributeName="transform" id="ninthSet1_1" type="translate" from="30, 0" to="30,0" begin="0s; ninthSet1_1.end + 1s" dur="1s"/> + </rect> + + <g transform="translate(110, 0)"> + <set id="ninthSet2" attributeName="display" to="none" begin="0s; ninthSet2.end + 1s" dur="1s"/> + <rect x="10" width="8" height="8"> + <animateTransform attributeName="transform" id="ninthSet2_1" type="translate" from="30, 0" to="30,0" begin="0s; ninthSet2_1.end + 1s" dur="1s"/> + </rect> + </g> + + <a xlink:href="" transform="translate(220, 0)"> + <set id="ninthSet3" attributeName="display" to="none" begin="0s; ninthSet3.end + 1s" dur="1s"/> + <rect x="10" width="8" height="8"> + <animateTransform attributeName="transform" id="ninthSet3_1" type="translate" from="30, 0" to="30,0" begin="0s; ninthSet3_1.end + 1s" dur="1s"/> + </rect> + </a> + </g> + + <g id="setTen" transform="translate(0,180)"> + <defs> + <g id="setTenRef"> + <rect x="10" width="8" height="8" fill="#ccc"/> + <rect x="10" width="8" height="8" fill="#ccc" transform="translate(30,0)"/> + </g> + </defs> + <use xlink:href="#setTenRef"/> + <use xlink:href="#setTenRef" x="110"/> + <use xlink:href="#setTenRef" x="220"/> + + <rect x="10" width="8" height="8"> + <set id="tenthSet1" attributeName="visibility" to="hidden" begin="0s; tenthSet1.end + 1s" dur="1s"/> + <animateTransform attributeName="transform" id="tenthSet1_1" type="translate" from="30, 0" to="30,0" begin="0s; tenthSet1_1.end + 1s" dur="1s"/> + </rect> + + <g transform="translate(110, 0)"> + <set id="tenthSet2" attributeName="visibility" to="hidden" begin="0s; tenthSet2.end + 1s" dur="1s"/> + <rect x="10" width="8" height="8"> + <animateTransform attributeName="transform" id="tenthSet2_1" type="translate" from="30, 0" to="30,0" begin="0s; tenthSet2_1.end + 1s" dur="1s"/> + </rect> + </g> + + <a xlink:href="" transform="translate(220, 0)"> + <set id="tenthSet3" attributeName="visibility" to="hidden" begin="0s; tenthSet3.end + 1s" dur="1s"/> + <rect x="10" width="8" height="8"> + <animateTransform attributeName="transform" id="tenthSet3_1" type="translate" from="30, 0" to="30,0" begin="0s; tenthSet3_1.end + 1s" dur="1s"/> + </rect> + </a> + </g> + + <g id="setEleven" color="rgb(204,0,102)" transform="translate(0,200)"> + <defs> + <g id="setElevenRef"> + <rect x="10" width="8" height="8" fill="#ccc"/> + <rect x="10" width="8" height="8" fill="#ccc" transform="translate(30,0)"/> + </g> + </defs> + <use xlink:href="#setElevenRef"/> + <use xlink:href="#setElevenRef" x="110"/> + <use xlink:href="#setTenRef" x="220"/> + + <rect x="10" width="8" height="8" fill="currentColor"> + <set id="eleventhSet1" attributeName="color" to="rgb(255, 165, 0)" begin="0s; eleventhSet1.end + 1s" dur="1s"/> + <animateTransform attributeName="transform" id="eleventhSet1_1" type="translate" from="30, 0" to="30,0" begin="0s; eleventhSet1_1.end + 1s" dur="1s"/> + </rect> + + <g transform="translate(110, 0)" fill="currentColor"> + <set id="eleventhSet2" attributeName="color" to="rgb(255, 165, 0)" begin="0s; eleventhSet2.end + 1s" dur="1s"/> + <rect x="10" width="8" height="8"> + <animateTransform attributeName="transform" id="eleventhSet2_1" type="translate" from="30, 0" to="30,0" begin="0s; eleventhSet2_1.end + 1s" dur="1s"/> + </rect> + </g> + + <a xlink:href="" transform="translate(220, 0)" fill="currentColor"> + <!-- This first 'set' is because 'color' on the 'a' might well be a different color from that + inherited from its parent, due to UA style sheet ":visited { color: something }" rules. --> + <set attributeName="color" to="rgb(204,0,102)"/> + <set id="eleventhSet3" attributeName="color" to="rgb(255, 165, 0)" begin="0s; eleventhSet3.end + 1s" dur="1s"/> + <rect x="10" width="8" height="8"> + <animateTransform attributeName="transform" id="eleventhSet3_1" type="translate" from="30, 0" to="30,0" begin="0s; eleventhSet3_1.end + 1s" dur="1s"/> + </rect> + </a> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-80-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-80-t-manual.svg new file mode 100644 index 000000000..ba831cb72 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-80-t-manual.svg @@ -0,0 +1,312 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-80-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + This test demonstrates validates the operation of the + animateTransform element and validates the operation + of the different type attribute values. + </p> + <p> + There are 5 possible values for the type attribute and + there is one animateTransform for each type and two for + the translate type. + </p> + <p> + For each transform type, the test has a corresponding animateTransform. + The test uses references to show what the expected transform should be + at different points in the animation. For example, the top left + animateTransform, for type=rotate, shows circular markers which turn + orange at the time of corresponding transform value should be set by the + animateTransform. + The marker elements show the expected transform value on reference + markers in the test. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test has eight sub-tests, each of which consists of a brown + shape being animated in some way with the animation starting two + seconds after the document is loaded. Gray shapes are used + to indicate points along the animation. The test passes if + the brown shape in each of the sub-tests is animated correctly, + according to the following descriptions:</p> + <ul> + <li>In the two "type=rotate" sub-tests, the brown line is rotated + clockwise about one of its end points for one complete revolution, + and then immediately performs the reverse animation where it is + rotated anti-clockwise for one complete revolution. During the + animation, whenever the other end point of the line coincides + with one of the gray filled circles, the circle briefly glows yellow.</li> + <li>In the "type=skewX" sub-test, the brown line continuously skewed. + It starts off coinciding with the middle gray silhouette, and then + over the course of the animation coincides with the left gray silhouette, + the middle one, the right one and finally the middle one again. + During the animation, whenever the brown line coincides with one of the gray silhouettes, + the silhouette briefly glows yellow.</li> + <li>In the "type=skewY" sub-test, the brown line continuously skewed. + It starts off coinciding with the middle gray silhouette, and then + over the course of the animation coincides with the top gray silhouette, + the middle one, the bottom one and finally the middle one again. + During the animation, whenever the brown line coincides with one of the gray silhouettes, + the silhouette briefly glows yellow.</li> + <li>In the two "type=translate" sub-tests, the brown circle is continuously + translated. It starts off coinciding with the left-most gray circle, and + over the course of the animation coincides each of the other gray circles + from left to right. During the animation, whenever the brown circle coincides with one of the + gray circles, the circle briefly glows yellow.</li> + <li>In the two "type=scale" sub-tests, the brown circle is continuously + scaled. There are four concentric gray stroked circles indicating the + sizes the brown circle will take during the animation, although they + are only all visible at the end of the animation. (Initially only the + largest one is visible.) The brown circle + starts off with a size coinciding with the largest gray circle, and + over the course of the animation coincides each of the other gray circles + from outside in. During the animation, whenever the brown circle coincides with one of the + gray circles, the circle briefly glows yellow.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-80-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text text-anchor="middle" x="240" y="25" font-size="16"><animateTransform></text> + <defs> + <g id="ref" stroke="rgb(192,192,192)" fill="none"> + <circle stroke-width="2" r="40"/> + <line x1="-45" x2="45"/> + <line y1="-45" y2="45"/> + </g> + </defs> + <g transform="translate(0,0)" font-size="14"> + <g transform="translate(60,90)"> + <use xlink:href="#ref"/> + + <line x1="40" x2="40" stroke-width="15" stroke-linecap="round" stroke="rgb(192,192,192)" transform="rotate(0)"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="2s;4s;6s" dur="0.2s"/> + </line> + + <line x1="40" x2="40" stroke-width="15" stroke-linecap="round" stroke="rgb(192,192,192)" transform="rotate(90)"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="2.5s;5.5s" dur="0.2s"/> + </line> + + <line x1="40" x2="40" stroke-width="15" stroke-linecap="round" stroke="rgb(192,192,192)" transform="rotate(180)"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="3s;5s" dur="0.2s"/> + </line> + + <line x1="40" x2="40" stroke-width="15" stroke-linecap="round" stroke="rgb(192,192,192)" transform="rotate(270)"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="3.5s;4.5s" dur="0.2s"/> + </line> + + <line x2="40" stroke-width="10" stroke-linecap="round" stroke="rgb(200,80,80)"> + <animateTransform attributeName="transform" type="rotate" values="0;360;0" begin="2s" dur="4s"/> + </line> + + <text y="60" text-anchor="middle">type=rotate</text> + </g> + + <g transform="translate(180,110)"> + <line y2="-40" stroke-width="15" stroke-linecap="round" stroke="rgb(192,192,192)" transform="skewX(0)"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="2s;4s;6s" dur="0.2s"/> + </line> + + <line y2="-40" stroke-width="15" stroke-linecap="round" stroke="rgb(192,192,192)" transform="skewX(45)"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="3.333s" dur="0.2s"/> + </line> + + <line y2="-40" stroke-width="15" stroke-linecap="round" stroke="rgb(192,192,192)" transform="skewX(-45)"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="4.666s" dur="0.2s"/> + </line> + + <line y2="-40" stroke-width="10" stroke-linecap="round" stroke="rgb(200,80,80)"> + <animateTransform attributeName="transform" type="skewX" values="0;45;-45;0" begin="2s" dur="4s"/> + </line> + <text y="40" text-anchor="middle">type=skewX</text> + </g> + + <g transform="translate(300,90)"> + <g transform="translate(15,0)"> + <line x2="-40" stroke-width="15" stroke-linecap="round" stroke="rgb(192,192,192)" transform="skewY(0)"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="2s;4s;6s" dur="0.2s"/> + </line> + + <line x2="-40" stroke-width="15" stroke-linecap="round" stroke="rgb(192,192,192)" transform="skewY(30)"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="3.333s" dur="0.2s"/> + </line> + + <line x2="-40" stroke-width="15" stroke-linecap="round" stroke="rgb(192,192,192)" transform="skewY(-30)"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="4.666s" dur="0.2s"/> + </line> + + <line x2="-40" stroke-width="10" stroke-linecap="round" stroke="rgb(200,80,80)"> + <animateTransform attributeName="transform" type="skewY" values="0;30;-30;0" begin="2s" dur="4s"/> + </line> + </g> + + <text y="60" text-anchor="middle">type=skewY</text> + </g> + + <g transform="translate(420,90)"> + <circle stroke="rgb(192,192,192)" stroke-width="4" r="40" fill="none"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="2s" dur="0.2s"/> + </circle> + + <circle stroke="rgb(192,192,192)" stroke-width="4" r="30" fill="none"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="3s" dur="0.2s"/> + </circle> + + <circle stroke="rgb(192,192,192)" stroke-width="4" r="20" fill="none"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="4s" dur="0.2s"/> + </circle> + + <circle stroke="rgb(192,192,192)" stroke-width="4" r="10" fill="none"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="5s" dur="0.2s"/> + </circle> + + <circle fill="rgb(200,80,80)" r="10" transform="scale(4)"> + <animateTransform attributeName="transform" type="scale" values="4,4;3,3;2,2;1,1" begin="2s" dur="3s" fill="freeze"/> + </circle> + <text y="60" text-anchor="middle">type=scale</text> + <text y="75" text-anchor="middle">(sx and sy)</text> + </g> + + + <g transform="translate(20,180)"> + <use xlink:href="#ref" x="40" y="40"/> + + <line x1="80" y1="40" x2="80" y2="40" stroke-width="15" stroke-linecap="round" stroke="rgb(192,192,192)" transform="rotate(0,40,40)"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="2s;4s;6s" dur="0.2s"/> + </line> + + <line x1="80" y1="40" x2="80" y2="40" stroke-width="15" stroke-linecap="round" stroke="rgb(192,192,192)" transform="rotate(90,40,40)"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="2.5s;5.5s" dur="0.2s"/> + </line> + + <line x1="80" y1="40" x2="80" y2="40" stroke-width="15" stroke-linecap="round" stroke="rgb(192,192,192)" transform="rotate(180,40,40)"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="3s;5s" dur="0.2s"/> + </line> + + <line x1="80" y1="40" x2="80" y2="40" stroke-width="15" stroke-linecap="round" stroke="rgb(192,192,192)" transform="rotate(270,40,40)"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="3.5s;4.5s" dur="0.2s"/> + </line> + + <line x1="40" y1="40" x2="80" y2="40" stroke-width="10" stroke-linecap="round" stroke="rgb(200,80,80)"> + <animateTransform attributeName="transform" type="rotate" values="0 40 40;360 40 40;0 40 40" begin="2s" dur="4s"/> + </line> + + <text y="100" x="40" text-anchor="middle">type=rotate</text> + <text y="115" x="40" text-anchor="middle">(with cx/cy)</text> + </g> + + <g transform="translate(180,220)"> + <circle stroke="rgb(192,192,192)" stroke-width="4" cx="-40" r="10" fill="none"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="2s" dur="0.2s"/> + </circle> + + <circle stroke="rgb(192,192,192)" stroke-width="4" cx="-20" r="10" fill="none"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="3s" dur="0.2s"/> + </circle> + + <circle stroke="rgb(192,192,192)" stroke-width="4" cx="0" r="10" fill="none"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="4s" dur="0.2s"/> + </circle> + + <circle stroke="rgb(192,192,192)" stroke-width="4" cx="20" r="10" fill="none"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="5s" dur="0.2s"/> + </circle> + + <circle stroke="rgb(192,192,192)" stroke-width="4" cx="40" r="10" fill="none"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="6s" dur="0.2s"/> + </circle> + + <circle fill="rgb(200,80,80)" r="6" transform="translate(-40,0)"> + <animateTransform attributeName="transform" type="translate" values="-40;-20;0;20;40" begin="2s" dur="4s" fill="freeze"/> + </circle> + <text y="60" text-anchor="middle">type=translate</text> + <text y="75" text-anchor="middle">(tx only)</text> + </g> + + <g transform="translate(300,220)"> + <circle stroke="rgb(192,192,192)" stroke-width="4" cx="-40" cy="30" r="10" fill="none"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="2s" dur="0.2s"/> + </circle> + + <circle stroke="rgb(192,192,192)" stroke-width="4" cx="-20" cy="15" r="10" fill="none"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="3s" dur="0.2s"/> + </circle> + + <circle stroke="rgb(192,192,192)" stroke-width="4" cx="0" r="10" fill="none"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="4s" dur="0.2s"/> + </circle> + + <circle stroke="rgb(192,192,192)" stroke-width="4" cx="20" cy="-15" r="10" fill="none"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="5s" dur="0.2s"/> + </circle> + + <circle stroke="rgb(192,192,192)" stroke-width="4" cx="40" cy="-30" r="10" fill="none"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="6s" dur="0.2s"/> + </circle> + + <circle fill="rgb(200,80,80)" r="6" transform="translate(-40,30)"> + <animateTransform attributeName="transform" type="translate" values="-40,30;-20,15;0,0;20,-15;40,-30" begin="2s" dur="4s" fill="freeze"/> + </circle> + <text y="60" text-anchor="middle">type=translate</text> + <text y="75" text-anchor="middle">(tx and ty)</text> + </g> + + <g transform="translate(420,220)"> + <circle stroke="rgb(192,192,192)" stroke-width="1" r="10" fill="none" transform="scale(4,4)"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="2s" dur="0.2s"/> + </circle> + + <circle stroke="rgb(192,192,192)" stroke-width="1.3333" r="10" fill="none" transform="scale(3,3)"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="3s" dur="0.2s"/> + </circle> + + <circle stroke="rgb(192,192,192)" stroke-width="2" r="10" fill="none" transform="scale(2,2)"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="4s" dur="0.2s"/> + </circle> + + <circle stroke="rgb(192,192,192)" stroke-width="4" r="10" fill="none" transform="scale(1,1)"> + <set attributeName="stroke" to="rgb(250,200,30)" begin="5s" dur="0.2s"/> + </circle> + + <circle fill="rgb(200,80,80)" r="10" transform="scale(4,4)"> + <animateTransform attributeName="transform" type="scale" values="4;3;2;1" begin="2s" dur="3s" fill="freeze"/> + </circle> + <text y="60" text-anchor="middle">type=scale</text> + <text y="75" text-anchor="middle">(sx only)</text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-81-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-81-t-manual.svg new file mode 100644 index 000000000..e6fd01c0d --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-81-t-manual.svg @@ -0,0 +1,162 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: animate-elem-81-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + This test tests the operation of the animateTransform's + additive behavior. + </p> + <p> + The first two rectangles, on the top row, show the effect of the + additive attribute on animateTransform. The left-most + animateTransforms have their additive attribute set to replace, + so the effect of the two transform animation is as if only the + highest priority one applied because it replaces the underlying + value. The second animateTransforms (from left to right) have + their additive attribute set to sum, which means the transforms + they produce are concatenated. + </p> + <p> + The last two rectangles, on the top row, show the effect of the + accumulate attribute on animateTransform. For the left one + (third on the row, from left to right), the accumulate attribute + is set to none. There are two repeats for the + animateTransform. Therefore, the transform goes twice from a + scale(1,1) to a scale(2,2). For the right-most animateTransform, + the accumulate attribute is set to sum. There are two repeats + and the animation goes from scale(0,0) to scale(2,2) for the + first iteration and then from scale(2,2) to scale(4,4) (because + the result of the second iteration is added to the + scale(2,2) result of the previous, first iteration). + </p> + <p> + The rectangles on the bottom row show the combination of + additive and cumulative behavior. The left rectangle's + animateTransform accumulate behavior is set to none but its + additive behavior is set to sum. Therefore, the transform's + underlying value (skewX(30)) is always pre-concatenated to the + animateTransform's result, which goes from "skewX(30) + scale(1,1)" to "skewX(30) scale(2,2)" in each of its two + iterations. The right rectangle's animateTransform accumulate + behavior is set to sum and the additive behavior is also set to + sum. Therefore, the transform's underlying value is always + pre-concatenated, and repetitions of the scale animation + get added together. Consequently, the transform goes from "skewX(30) + scale(0,0)" to "skewX(30) scale(2,2)" for the first iteration + and then from "skewX(30) scale(2,2)" to "skewX(30) + scale(4,4)" for the second iteration. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test is passed if:</p> + <ul> + <li>the scale of the upper leftmost grey rectangle is smoothly animated over the course of 5 seconds to completely fill the upper leftmost yellow rectangle</li> + <li>the scale and rotation of the second upper grey rectangle from the left is smoothly animated over the course of 5 seconds to fill the second upper yellow rectangle from the left</li> + <li>the scale of the upper third grey rectangle from the left is smoothly animated over the course of 2.5 seconds to completely fill the upper third yellow rectangle from the left, and then repeated once so that at time t=5 seconds it completely fills the same yellow rectangle</li> + <li>the scale of the upper rightmost grey rectangle is smoothly animated over the course of 5 seconds to completely fill the upper rightmost yellow rectangle</li> + <li>the scale of the lower leftmost grey rectangle is smoothly animated over the course of 2.5 seconds to completely fill the lower leftmost yellow rectangle, and then repeated once so that at time t=5 seconds it completely fills the same yellow rectangle</li> + <li>the scale of the lower rightmost grey rectangle is smoothly animated over the course of 5 seconds to completely fill the lower rightmost yellow rectangle</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-81-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text text-anchor="middle" x="240" y="25" font-size="16"><animateTransform></text> + <defs> + <g id="ref" stroke="rgb(192,192,192)" fill="none"> + <circle stroke-width="2" r="40"/> + <line x1="-45" x2="45"/> + <line y1="-45" y2="45"/> + </g> + </defs> + <g transform="translate(0,0)" font-size="14"> + <g transform="translate(60,90)"> + <rect x="-15" y="-15" width="30" height="30" transform="skewX(30)" stroke="gray" stroke-width="4" fill="rgb(230,230,230)"> + <animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0" to="90" dur="5s" additive="replace" fill="freeze"/> + <animateTransform attributeName="transform" attributeType="XML" type="scale" from="1,1" to="2,2" dur="5s" additive="replace" fill="freeze"/> + </rect> + <rect x="-15" y="-15" width="30" height="30" transform="scale(2,2)" stroke="rgb(255,180,0)" stroke-width="4" fill="none"/> + <text y="60" text-anchor="middle">additive=replace</text> + </g> + + <g transform="translate(180,90)"> + <rect x="-15" y="-15" width="30" height="30" transform="skewX(30)" stroke="gray" stroke-width="4" fill="rgb(230,230,230)"> + <animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0" to="90" dur="5s" additive="sum" fill="freeze"/> + <animateTransform attributeName="transform" attributeType="XML" type="scale" from="1,1" to="2,2" dur="5s" additive="sum" fill="freeze"/> + </rect> + <rect x="-15" y="-15" width="30" height="30" transform="skewX(30) rotate(90) scale(2,2)" stroke="rgb(255,180,0)" stroke-width="4" fill="none"/> + <text y="60" text-anchor="middle">additive=sum</text> + </g> + + <g transform="translate(300,90)"> + <rect x="-15" y="-15" width="30" height="30" transform="skewX(30)" stroke="gray" stroke-width="4" fill="rgb(230,230,230)"> + <animateTransform attributeName="transform" attributeType="XML" type="scale" from="1,1" to="2,2" dur="2.5s" repeatCount="2" accumulate="none" fill="freeze" additive="replace"/> + </rect> + <rect x="-15" y="-15" width="30" height="30" transform="scale(2,2)" stroke="rgb(255,180,0)" stroke-width="4" fill="none"/> + <text y="60" text-anchor="middle">accumulate=none</text> + <text y="75" text-anchor="middle">additive=replace</text> + </g> + + <g transform="translate(420,90)"> + <rect x="-7.5" y="-7.5" width="15" height="15" transform="skewX(30)" stroke="gray" stroke-width="2" fill="rgb(230,230,230)"> + <animateTransform attributeName="transform" attributeType="XML" type="scale" from="0,0" to="2,2" dur="2.5s" repeatCount="2" accumulate="sum" fill="freeze" additive="replace"/> + </rect> + <rect x="-7.5" y="-7.5" width="15" height="15" transform="scale(4,4)" stroke="rgb(255,180,0)" stroke-width="2" fill="none"/> + <text y="60" text-anchor="middle">accumulate=sum</text> + <text y="75" text-anchor="middle">additive=replace</text> + </g> + + <g transform="translate(300,220)"> + <rect x="-15" y="-15" width="30" height="30" transform="skewX(30)" stroke="gray" stroke-width="4" fill="rgb(230,230,230)"> + <animateTransform attributeName="transform" attributeType="XML" type="scale" from="1,1" to="2,2" dur="2.5s" repeatCount="2" accumulate="none" fill="freeze" additive="sum"/> + </rect> + <rect x="-15" y="-15" width="30" height="30" transform="skewX(30) scale(2,2)" stroke="rgb(255,180,0)" stroke-width="4" fill="none"/> + <text y="60" text-anchor="middle">accumulate=none</text> + <text y="75" text-anchor="middle">additive=sum</text> + </g> + + <g transform="translate(420,220)"> + <rect x="-7.5" y="-7.5" width="15" height="15" transform="skewX(30)" stroke="gray" stroke-width="2" fill="rgb(230,230,230)"> + <animateTransform attributeName="transform" attributeType="XML" type="scale" from="0,0" to="2,2" dur="2.5s" repeatCount="2" accumulate="sum" fill="freeze" additive="sum"/> + </rect> + <rect x="-7.5" y="-7.5" width="15" height="15" transform="skewX(30) scale(4,4)" stroke="rgb(255,180,0)" stroke-width="2" fill="none"/> + <text y="60" text-anchor="middle">accumulate=sum</text> + <text y="75" text-anchor="middle">additive=sum</text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-82-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-82-t-manual.svg new file mode 100644 index 000000000..b0c29a879 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-82-t-manual.svg @@ -0,0 +1,301 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: animate-elem-82-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + This test demonstrates validates the operation of + animateTransform with regards to the rotation center + and with regards to paced animation. + </p> + <p> + The following descriptions describe the various animations, + going top bottom, left to right. For each animation, orange + rectangle markers show the expected position for the animated rectangle + halfway through the animation. The markers are drawn with a thick + stroke for 0.2s, starting at the time when they reflect the + expected position. + </p> + <p> + The first animateTransform has type='rotate' and goes from + 45 degrees to 90 degrees over a period of 3s. The rotation + center for the from and to values is 0, 0. At 0 seconds, the + expected transform should be rotate(45). At 1.5 seconds, the + expected transform is rotate(0.5 * (90 + 45)) = rotate(67.5). + At 3s, the expected transform is rotate(90). + </p> + <p> + The second animateTransform has type='rotate' but has a + rotation center that varies between the from and to values. + The rotation goes from rotate(45,0,0) to rotate(90,-15,-15). + At 0s, the expected transform is rotate(45,0,0). + At 1.5s, the expected transform is rotate(67.5, -7.5, -7.5). + At 3s, the expected transform is rotate(90, -15, -15). + </p> + <p> + The third animateTransform has type='translate' and calcMode='paced'. + The animation goes from translate(-40,40) to translate(-20,20) to + translate(40,-40). + At 0s, the expected transform is translate(-40,40). + At 1.5s, the expected transform is translate(0,0). + At 3s, the expected transform is translate(40,-40). + </p> + <p> + The fourth animateTransform has type='translate' and calcMode='linear'. + The animation goes from translate(-40,40) to translate(-20,-20) to + translate(40,-40). + At 0s, the expected transform is translate(-40,40). + At 1.5s, the expected transform is translate(-20,-20). + At 3s, the expected transform is translate(40,-40). + </p> + <p> + The fifth animateTransform has type='scale' and calcMode='paced'. + The animation goes from scale(1,2) to scale(3,2) to + scale(1,1). + At 0s, the expected transform is scale(1,2). + At 1.5s, the expected transform is scale(3,2). + At 3s, the expected transform is scale(1,1). + </p> + <p> + The sixth animateTransform has type='scale' and calcMode='linear'. + The animation goes from scale(1,2) to scale(3,2) to + scale(1,1). + At 0s, the expected transform is scale(1,2). + At 1.5s, the expected transform is scale(3,2). + At 3s, the expected transform is scale(1,1). + </p> + <p> + The seventh animateTransform has type="rotate" and calcMode='paced'. + The animation goes from rotate(0,0,0) to rotate(45,-15,-20) to + rotate(180,30,50). The total length along the rotation angle component + is (45 - 0) + (180 - 45) = 180. The total length along the rotation + center along the x axis is (0 - (-15)) + (30 - (-15)) = 45 + 15 = 60. + The total length along the rotation center along the y axis is + (0 - (-20)) + (50 - (-20)) = 20 + 70 = 90. + At 0s, the expected transform is rotate(45,-15,-20). + At 1.5s, the expected transform is rotate(90,0,5) to achieve constant + velocity along the rotation angle component, the x-axis rotation center + component and the y-axis rotation center component. At 1.5s, half the + distance has been run on each component. For the rotation angle, this + means that 45 has been reached and that 45 more degrees in the (45 <= r < 180) + interval have been consumed. For the x-axis rotation center, this means + that 30 units have been run: the (0 >= x > -15) interval has been fully consumed + (15 units long) and 15 units on the (-15 <= x < 30) interval have been consumed, + which explains the computed 0 value. For the y-axis rotation center, this + means that 45 units have been run: the (0 >= y > -20) interval has been fully + consumed and 25 units have been consumed in the (-20 <= y < 50) interval, which + explains the computed 5 value. + At 3s, the expected transform is rotate(180,30,50). + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + Run the test. No interaction required. + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the lightgray rectangles are exactly in the positions indicated by each of the orange rectangles when they are shown with a thick stroke. If any part of the lightgray + rectangles are outside the thick stroked orange rectangles then the test has failed. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-82-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text text-anchor="middle" x="240" y="25" font-size="16"><animateTransform></text> + <defs> + <g id="ref" stroke="rgb(192,192,192)" fill="none"> + <circle stroke-width="2" r="40"/> + <line x1="-45" x2="45"/> + <line y1="-45" y2="45"/> + </g> + </defs> + <g transform="translate(0,0)" font-size="14"> + <g transform="translate(60,90)"> + <rect x="-15" y="-15" width="30" height="30" stroke="gray" stroke-width="4" fill="rgb(230,230,230)"> + <animateTransform attributeName="transform" attributeType="XML" type="rotate" from="45" to="90" dur="3s" additive="replace" fill="freeze"/> + </rect> + + <rect x="-15" y="-15" width="30" height="30" transform="rotate(45)" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="0s" dur="0.2s"/> + </rect> + + <rect x="-15" y="-15" width="30" height="30" transform="rotate(67.5)" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="1.5s" dur="0.2s"/> + </rect> + + <rect x="-15" y="-15" width="30" height="30" transform="rotate(90)" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="3s" dur="0.2s"/> + </rect> + + <text y="60" text-anchor="middle">same rotation</text> + <text y="75" text-anchor="middle">center</text> + </g> + + <g transform="translate(180,90)"> + <rect x="-15" y="-15" width="30" height="30" stroke="gray" stroke-width="4" fill="rgb(230,230,230)"> + <animateTransform attributeName="transform" attributeType="XML" type="rotate" from="45,0,0" to="90,-15,-15" dur="3s" additive="replace" fill="freeze"/> + </rect> + <rect x="-15" y="-15" width="30" height="30" transform="rotate(45,0,0)" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="0s" dur="0.2s"/> + </rect> + + <rect x="-15" y="-15" width="30" height="30" transform="rotate(67.5,-7.5,-7.5)" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="1.5s" dur="0.2s"/> + </rect> + + <rect x="-15" y="-15" width="30" height="30" transform="rotate(90,-15,-15)" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="3s" dur="0.2s"/> + </rect> + + <text y="60" text-anchor="middle">different rotation</text> + <text y="75" text-anchor="middle">centers</text> + </g> + + <g transform="translate(300,90)"> + <rect x="-15" y="-15" width="30" height="30" stroke="gray" stroke-width="4" fill="rgb(230,230,230)"> + <animateTransform attributeName="transform" attributeType="XML" type="translate" values="-40,40;-20,20;40,-40" dur="3s" calcMode="paced" additive="replace" fill="freeze"/> + </rect> + <rect x="-15" y="-15" width="30" height="30" transform="translate(-40,40)" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="0s" dur="0.2s"/> + </rect> + + <rect x="-15" y="-15" width="30" height="30" transform="translate(0,0)" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="1.5s" dur="0.2s"/> + </rect> + + <rect x="-15" y="-15" width="30" height="30" transform="translate(40,-40)" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="3s" dur="0.2s"/> + </rect> + + <text y="75" text-anchor="middle">paced translation</text> + </g> + + <g transform="translate(415,90)"> + <rect x="-15" y="-15" width="30" height="30" stroke="gray" stroke-width="4" fill="rgb(230,230,230)"> + <animateTransform attributeName="transform" attributeType="XML" type="translate" values="-40,40;-20,-20;40,-40" dur="3s" calcMode="linear" additive="replace" fill="freeze"/> + </rect> + <rect x="-15" y="-15" width="30" height="30" transform="translate(-40,40)" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="0s" dur="0.2s"/> + </rect> + + <rect x="-15" y="-15" width="30" height="30" transform="translate(-20,-20)" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="1.5s" dur="0.2s"/> + </rect> + + <rect x="-15" y="-15" width="30" height="30" transform="translate(40,-40)" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="3s" dur="0.2s"/> + </rect> + + <text y="75" text-anchor="middle">linear translation</text> + + </g> + + <g transform="translate(60,220)"> + <rect x="-15" y="-15" width="30" height="30" stroke="none" fill="rgb(230,230,230)"> + <animateTransform attributeName="transform" attributeType="XML" type="scale" values="1,2;3,2;1,1" dur="3s" calcMode="paced" fill="freeze"/> + </rect> + + <rect x="-15" y="-30" width="30" height="60" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="0s" dur="0.2s"/> + </rect> + + <rect x="-45" y="-30" width="90" height="60" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="1.5s" dur="0.2s"/> + </rect> + + <rect x="-15" y="-15" width="30" height="30" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="3s" dur="0.2s"/> + </rect> + + <text y="60" text-anchor="middle">paced scale</text> + </g> + + <g transform="translate(180,220)"> + <rect x="-15" y="-15" width="30" height="30" stroke="none" fill="rgb(230,230,230)"> + <animateTransform attributeName="transform" attributeType="XML" type="scale" values="1,2;3,2;1,1" dur="3s" calcMode="linear" fill="freeze"/> + </rect> + + <rect x="-15" y="-30" width="30" height="60" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="0s" dur="0.2s"/> + </rect> + + <rect x="-45" y="-30" width="90" height="60" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="1.5s" dur="0.2s"/> + </rect> + + <rect x="-15" y="-15" width="30" height="30" transform="scale(1,1)" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="3s" dur="0.2s"/> + </rect> + + <text y="60" text-anchor="middle">linear scale</text> + </g> + + <g transform="translate(275,220)"> + <rect x="-15" y="-15" width="30" height="30" stroke="gray" stroke-width="4" fill="rgb(230,230,230)"> + <animateTransform attributeName="transform" attributeType="XML" type="rotate" values="0,0,0;45,-15,-20;180,30,50" dur="3s" calcMode="paced" additive="replace" fill="freeze"/> + </rect> + <rect x="-15" y="-15" width="30" height="30" transform="rotate(0,0,0)" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="0s" dur="0.2s"/> + </rect> + + <rect x="-15" y="-15" width="30" height="30" transform="rotate(90,0,5)" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="1.5s" dur="0.2s"/> + </rect> + + <rect x="-15" y="-15" width="30" height="30" transform="rotate(180,30,50)" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="3s" dur="0.2s"/> + </rect> + + <text y="75" text-anchor="middle">paced rotation</text> + </g> + + <g transform="translate(395,220)"> + <rect x="-15" y="-15" width="30" height="30" stroke="gray" stroke-width="4" fill="rgb(230,230,230)"> + <animateTransform attributeName="transform" attributeType="XML" type="rotate" values="0,0,0;45,-15,-20;180,30,50" dur="3s" calcMode="linear" additive="replace" fill="freeze"/> + </rect> + <rect x="-15" y="-15" width="30" height="30" transform="rotate(0,0,0)" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="0s" dur="0.2s"/> + </rect> + + <rect x="-15" y="-15" width="30" height="30" transform="rotate(45,-15,-20)" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="1.5s" dur="0.2s"/> + </rect> + + <rect x="-15" y="-15" width="30" height="30" transform="rotate(180,30,50)" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="3s" dur="0.2s"/> + </rect> + + <text y="75" text-anchor="middle">linear rotation</text> + </g> + + + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-83-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-83-t-manual.svg new file mode 100644 index 000000000..b64a7c650 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-83-t-manual.svg @@ -0,0 +1,229 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: animate-elem-83-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + This test validates the operation of the animate element + on the <path> element's d attribute. + </p> + <p> + The following descriptions references to the tests by number. The first test + is the one showing on the top left. The last, sixth test is the one showing + at the bottom right. Test numbers are alocated from left to right and from + top to bottom. + + For each test, there are reference outline markers which show the expected + animated shape at different times in the animation. At the time of the expected + shape, the outline of the expected shape is drawn with a thick stroke for 0.2s + so the test user can visually check that the shapes are matching at the + expected times. + </p> + <p> + The first test validates a simple from-to animation on a path's d attribute + made of M, C and Z commands where both the from and to attributes are specified. + The attributes are compatible with the path element's d attribute. + </p> + <p> + The second test validates a simple to-animation on a path's d attribute + made of M, C and Z commands where the to attribute is specified. + The attribute is compatible with the path element's d attribute. + </p> + <p> + The third test validates a simple values-animation on a path's d attribute + made of M, C and Z commands where the values attribute is specified and + specifies three seperate values. + The attribute is compatible with the path element's d attribute. + </p> + <p> + The fourth, fifth and sixth tests validate that interpolation between compatible + path values (i.e., path values which normalize to the compatible values) is + supported. + </p> + <p> + The fourth tests interpolation between a path value containing H, V and L commands + (in the from value) and a path value containing compatible h, v and l commands + (in the to value). + </p> + <p> + The fifth tests interpolation between a path value containing C and S commands + (in the from value) and a path value containing compatible c and s commands + (in the to value). + </p> + <p> + The sixth tests interpolation between a path value containing Q, T and A commands + (in the from value) and a path value containing compatible q, t and a commands + (in the to value). + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test consists of six sub-tests. In each sub-test, the light gray filled + path must continously morph its shape, starting one second after the document + load and continuing for three seconds. In all sub-tests except for #3, there are + two orange reference shape outlines between which the gray path must morph. + In sub-test #3, there are three reference shapes. The test passes if each of the + gray shapes morphs appropriately according to the following descriptions:</p> + <ol> + <li>The gray shape must morph from the diamond to the flower-like shape.</li> + <li>The gray shape must morph just like sub-test #1, from the diamond to the flower-like shape.</li> + <li>The gray shape must morph from the diamond, to the flower-like shape, and then to the large, rounded diamond shape.</li> + <li>The gray shape must morph from the lower-right pointing kite shape to the upper-left pointing kite shape.</li> + <li>The gray shape must morph from the tall shape to the wide shape.</li> + <li>The gray shape must morph from the wide "D" shape to the narrow "D" shape.</li> + </ol> + <p>In addition, during the animations whenever the gray shape has the same shape as + a reference shape, the stroke of the reference shape must be shown thicker momentarily.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-83-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text text-anchor="middle" x="240" y="25" font-size="16"><animate> on <path>'s d attribute</text> + + <defs> + <g id="ref" stroke="rgb(192,192,192)" fill="none"> + <circle stroke-width="2" r="40"/> + <line x1="-45" x2="45"/> + <line y1="-45" y2="45"/> + </g> + </defs> + + <g transform="translate(0,0)" font-size="12"> + <g id="test_1" transform="translate(120,90)"> + <path d="M -15 0 C -15 0 0 -15 0 -15 C 0 -15 15 0 15 0 C 15 0 0 15 0 15 C 0 15 -15 0 -15 0 Z" stroke="none" stroke-width="4" fill="rgb(230,230,230)"> + <animate attributeName="d" from="M -15 0 C -15 0 0 -15 0 -15 C 0 -15 15 0 15 0 C 15 0 0 15 0 15 C 0 15 -15 0 -15 0 Z" to="M 0 0 C -50 -15 -15 -50 0 0 C 15 -50 50 -15 0 0 C 50 15 15 50 0 0 C -15 50 -50 15 0 0 Z" dur="3s" fill="freeze" begin="1s"/> + </path> + + <path d="M -15 0 C -15 0 0 -15 0 -15 C 0 -15 15 0 15 0 C 15 0 0 15 0 15 C 0 15 -15 0 -15 0 Z" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="1s" dur="0.2s"/> + </path> + + <path d="M 0 0 C -50 -15 -15 -50 0 0 C 15 -50 50 -15 0 0 C 50 15 15 50 0 0 C -15 50 -50 15 0 0 Z" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="4s" dur="0.2s"/> + </path> + + <text y="60" text-anchor="middle">#1: from-to animation</text> + </g> + + <g id="test_2" transform="translate(240,90)"> + <path d="M -15 0 C -15 0 0 -15 0 -15 C 0 -15 15 0 15 0 C 15 0 0 15 0 15 C 0 15 -15 0 -15 0 Z" stroke="none" stroke-width="4" fill="rgb(230,230,230)"> + <animate attributeName="d" to="M 0 0 C -50 -15 -15 -50 0 0 C 15 -50 50 -15 0 0 C 50 15 15 50 0 0 C -15 50 -50 15 0 0 Z" dur="3s" fill="freeze" begin="1s"/> + </path> + + <path d="M -15 0 C -15 0 0 -15 0 -15 C 0 -15 15 0 15 0 C 15 0 0 15 0 15 C 0 15 -15 0 -15 0 Z" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="1s" dur="0.2s"/> + </path> + + <path d="M 0 0 C -50 -15 -15 -50 0 0 C 15 -50 50 -15 0 0 C 50 15 15 50 0 0 C -15 50 -50 15 0 0 Z" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="4s" dur="0.2s"/> + </path> + + <text y="60" text-anchor="middle">#2: to animation</text> + </g> + + <g id="test_3" transform="translate(360,90)"> + <path d="M -15 0 C -15 0 0 -15 0 -15 C 0 -15 15 0 15 0 C 15 0 0 15 0 15 C 0 15 -15 0 -15 0 Z" stroke="none" stroke-width="4" fill="rgb(230,230,230)"> + <animate attributeName="d" values="M -15 0 C -15 0 0 -15 0 -15 C 0 -15 15 0 15 0 C 15 0 0 15 0 15 C 0 15 -15 0 -15 0 Z; M 0 0 C -50 -15 -15 -50 0 0 C 15 -50 50 -15 0 0 C 50 15 15 50 0 0 C -15 50 -50 15 0 0 Z; M -45 0 C -15 0 0 -15 0 -45 C 0 -15 15 0 45 0 C 15 0 0 15 0 45 C 0 15 -15 0 -45 0 Z" dur="3s" fill="freeze" begin="1s"/> + </path> + + <path d="M -15 0 C -15 0 0 -15 0 -15 C 0 -15 15 0 15 0 C 15 0 0 15 0 15 C 0 15 -15 0 -15 0 Z" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="1s" dur="0.2s"/> + </path> + + <path d="M 0 0 C -50 -15 -15 -50 0 0 C 15 -50 50 -15 0 0 C 50 15 15 50 0 0 C -15 50 -50 15 0 0 Z" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="2.5s" dur="0.2s"/> + </path> + + <path d="M -45 0 C -15 0 0 -15 0 -45 C 0 -15 15 0 45 0 C 15 0 0 15 0 45 C 0 15 -15 0 -45 0 Z" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="4s" dur="0.2s"/> + </path> + + <text y="60" text-anchor="middle">#3: values animation</text> + </g> + + <g id="test_4" transform="translate(120,200)"> + <path d="M -30 -30 L 30 0 V 30 H 0 Z" stroke="none" stroke-width="4" fill="rgb(230,230,230)"> + <animate attributeName="d" from="M -30 -30 L 30 0 V 30 H 0 Z" to="M 30 30 l -60 -30 v -30 h 30 Z" dur="3s" fill="freeze" begin="1s"/> + </path> + + <path d="M -30 -30 L 30 0 V 30 H 0 Z" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="1s" dur="0.2s"/> + </path> + + <path d="M 30 30 l -60 -30 v -30 h 30 Z" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="4s" dur="0.2s"/> + </path> + + <text y="60" text-anchor="middle">#4: from-to animation</text> + <text y="75" text-anchor="middle">compatible H/h, V/v,</text> + <text y="90" text-anchor="middle">L/l segments</text> + </g> + + <g id="test_5" transform="translate(240,200)"> + <path d="M -20 -20 C 20 -20 20 -20 20 20 S 20 40 -20 20 Z" stroke="none" stroke-width="4" fill="rgb(230,230,230)"> + <animate attributeName="d" from="M -20 -20 C 20 -20 20 -20 20 20 S 20 40 -20 20 Z" to="M -20 -20 c 0 40 0 40 40 40 s 40 0 0 -40 z" dur="3s" fill="freeze" begin="1s"/> + </path> + + <path d="M -20 -20 C 20 -20 20 -20 20 20 S 20 40 -20 20 Z" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="1s" dur="0.2s"/> + </path> + + <path d="M -20 -20 c 0 40 0 40 40 40 s 40 0 0 -40 z" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="4s" dur="0.2s"/> + </path> + + <text y="60" text-anchor="middle">#5: from-to animation</text> + <text y="75" text-anchor="middle">compatible C/c</text> + <text y="90" text-anchor="middle">s/S segments</text> + </g> + + <g id="test_6" transform="translate(360,200)"> + <path d="M -30 -30 Q 30 -30 30 0 T -30 30 Z" stroke="none" stroke-width="4" fill="rgb(230,230,230)"> + <animate attributeName="d" from="M -30 -30 Q 30 -30 30 0 T -30 30 Z" to="M -30 -30 q 30 0 30 30 t -30 30 z" dur="3s" fill="freeze" begin="1s"/> + </path> + + <path d="M -30 -30 Q 30 -30 30 0 T -30 30 Z" stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="1s" dur="0.2s"/> + </path> + + <path d="M -30 -30 q 30 0 30 30 t -30 30 " stroke="rgb(255,180,0)" stroke-width="1" fill="none"> + <set attributeName="stroke-width" to="4" begin="4s" dur="0.2s"/> + </path> + + <text y="60" text-anchor="middle">#6: from-to animation</text> + <text y="75" text-anchor="middle">compatible Q/q, T/t</text> + <text y="90" text-anchor="middle">segments</text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-84-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-84-t-manual.svg new file mode 100644 index 000000000..cdf35fb37 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-84-t-manual.svg @@ -0,0 +1,80 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CC" author="CL" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-84-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test animation of color keywords that resolve to animatable RGB values. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if five + black squares are shown, after two seconds, all five squares turn red and + then smoothly animate the fill color to green over the next five seconds. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-84-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="scale(1.1) translate (50,20)"> + <rect color="green" fill="#000000" height="100" width="100"> + <animateColor attributeName="fill" from="#f00" to="currentColor" begin="2s" dur="5s" fill="freeze"/> + </rect> + <rect color="red" fill="#000000" height="100" width="100" y="150"> + <animateColor attributeName="fill" from="currentColor" to="green" begin="2s" dur="5s" fill="freeze"/> + </rect> + <rect color="green" fill="#000000" x="120" height="100" width="100" y="75"> + <animateColor attributeName="fill" from="#f00" to="green" begin="2s" dur="5s" fill="freeze"/> + </rect> + <g fill="#070"> + <rect color="green" fill="#000000" x="240" height="100" width="100"> + <animateColor attributeName="fill" from="#f00" to="inherit" begin="2s" dur="5s" fill="freeze"/> + </rect> + </g> + <g fill="#F00"> + <rect color="green" fill="#000000" x="240" height="100" width="100" y="150"> + <animateColor attributeName="fill" from="inherit" to="green" begin="2s" dur="5s" fill="freeze"/> + </rect> + </g> + <g text-anchor="middle" font-size="14"> + <text x="50" y="130">currentColor</text> + <text x="170" y="55">green</text> + <text x="290" y="130">inherit</text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-85-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-85-t-manual.svg new file mode 100644 index 000000000..cecac6a8f --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-85-t-manual.svg @@ -0,0 +1,100 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="DJ" author="CL" status="issue" + version="$Revision: 1.8 $" testname="$RCSfile: animate-elem-85-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + The first subtest tests animateColor with 'to' and 'from' values including + currentColor. The second subtest checks that the value of currentColor is the + current animated value of the color property, by animating the color property + at the same time as animating fill with a 'from' or 'to' value of currentColor. + </p> + <!-- moved from accepted to issue pending verification of correct behaviour for lower rect on second subtest --> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> +<p>Run the test. No interaction required. +</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The first subtest is passed if all + four rectangles at the top smoothly animate from black to green over 5 seconds. + During this time the bottom two rectangles must be blue.</p> + <p>The second subtest, which starts after the first one completes, is passed if + the bottom two rectangles smoothly animate from green (at five seconds), through + dark cyan (at 7.5 seconds), to cyan (at 10 seconds and above). Colored circles + indicate the appropriate colors at these times. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-85-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g id="subtest_1"> + <rect fill="#f00" x="30" y="50" height="100" width="90"> + <!-- basic test from two numeric hex values --> + <animateColor attributeName="fill" from="#000000" to="#008000" begin="0s" dur="5s" fill="freeze"/> + </rect> + <rect fill="#f00" x="140" y="50" height="100" width="90"> + <!-- same, check color keywords accepted in animations --> + <animateColor attributeName="fill" from="#000000" to="green" begin="0s" dur="5s" fill="freeze"/> + </rect> + <rect color="green" fill="#f00" x="250" y="50" height="100" width="90"> + <!-- same, static value of currentColor in 'to' --> + <animateColor attributeName="fill" from="#000000" to="currentColor" begin="0s" dur="5s" fill="freeze"/> + </rect> + <rect color="black" fill="#f00" x="360" y="50" height="100" width="90"> + <!-- same, static value of currentColor in 'from' --> + <animateColor attributeName="fill" to="#008000" from="currentColor" begin="0s" dur="5s" fill="freeze"/> + </rect> + </g> + <g id="subtest_2"> + <rect color="black" fill="blue" x="100" y="180" height="60" width="280"> + <animateColor attributeName="color" to="cyan" from="blue" begin="5s" dur="5s" fill="freeze"/> + <animateColor attributeName="fill" from="#008000" to="currentColor" begin="5s" dur="5s" fill="freeze"/> + </rect> + <rect color="black" fill="blue" x="100" y="245" height="60" width="280"> + <animateColor attributeName="fill" from="#008000" to="currentColor" begin="5s" dur="5s" fill="freeze"/> + <animateColor attributeName="color" to="cyan" from="blue" begin="5s" dur="5s" fill="freeze"/> + </rect> + <!-- + color fill + 4s #000000 #0000ff + 5s #0000ff #008000 + 7.5s #0080ff #008080 + 10s #00ffff #00ffff + --> + <circle r="30" cx="100" cy="240" fill="#0000ff"/> + <circle r="30" cx="193" cy="240" fill="#008000"/> + <circle r="30" cx="287" cy="240" fill="#008080"/> + <circle r="30" cx="380" cy="240" fill="#00ffff"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-86-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-86-t-manual.svg new file mode 100644 index 000000000..7ef5eb8f9 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-86-t-manual.svg @@ -0,0 +1,92 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[empty]" author="ED" status="created" + version="$Revision: 1.5 $" testname="$RCSfile: animate-elem-86-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + [[Describe which section and what specific assertion is being tested + by the test. If the test has a number of sub tests, multiple + "testComponent" elements can be specified within the "testDescription" + element.]] + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + This tests performs tests on fill="freeze" values. + </p> + <p> + Currently, this test does not claim to show correct + behaviour in SVG 1.1. The reason is only to show the + difference between current viewers at this point. + </p> + <p> + When the correct behaviour has been defined, this test + can be adjusted to reflect that. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + [[Describe the pass criteria of the test here. The pass criteria is what + should be displayed when the test is run.]] + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-86-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text text-anchor="middle" x="240" y="30" font-size="20">fill="freeze" with discrete calcMode</text> + + <g transform="translate(100, 100)"> + <g transform="translate(80,25)" text-anchor="end" font-size="14"> + <text>discrete</text> + </g> + + <g id="timeMarkersText" transform="translate(150, 5)" text-anchor="middle" font-size="14"> + <text>> 2s</text> + <text x="80">0s-2s</text> + </g> + + <g transform="translate(150,20)" stroke="black"> + <defs> + <rect id="shadow" x="-6" y="-6" width="12" height="12" fill="#ccc" stroke="black" stroke-width="1"/> + </defs> + + <g id="setOne"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <animate id="firstSet" calcMode="discrete" attributeName="x" values="74;-6" dur="4s" end="2s" fill="freeze"/> + </rect> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-87-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-87-t-manual.svg new file mode 100644 index 000000000..812c98e1c --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-87-t-manual.svg @@ -0,0 +1,89 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="CM" status="created" + version="$Revision: 1.5 $" testname="$RCSfile: animate-elem-87-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#AnimateTransformElement"> + <p> + This tests that the underlying value of a scale transformation + is 0. Since SMIL defines a <em>by animation</em> as being equivalent + to an additive <em>values animation</em> where the first value is zero and + the second value is the <em>by</em> value, such an animation would + begin by post-multiplying a <code>scale(0)</code> transformation to + the element's underlying transform list. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test consists of two circles: an orange circle on the left, + which serves as a reference, and a blue circle on the right, + whose <code>transform</code> attribute is animated. Animation of + the circles begins at t=1s and lasts for 3s. + </p> + <p> + The transform animation that applies to the blue circle is of type + "scale", and specifies <code>by="1"</code>. Since the animation is + considered to be equivalent to one that specifies <code>from="0" to="1"</code>, + when the animation begins the circle will be scaled down to a point, + and then will be scaled up until it reaches its original size at + t=4s. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the blue circle on the right is always the same + size as the orange circle on the left. The test runs from t=0s until + t=4s. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-87-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text x='10' y='40'>Test zero value of a scale transform animation</text> + + <g transform='translate(150,150)'> + <circle r='80' fill='#ccc'/> + <circle r='80' fill='orange'> + <animate attributeName='r' values='0; 80' begin='1s' dur='3s' fill='freeze'/> + </circle> + <text y='100' text-anchor='middle' font-size='12'>Reference</text> + </g> + <g transform='translate(350,150)'> + <circle r='80' fill='#ccc'/> + <circle r='80' fill='blue'> + <animateTransform attributeName='transform' type='scale' begin='1s' dur='3s' by='1' fill='freeze'/> + </circle> + <text y='100' text-anchor='middle' font-size='12'><animateTransform type='scale' by='1'/></text> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-88-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-88-t-manual.svg new file mode 100644 index 000000000..d523f7704 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-88-t-manual.svg @@ -0,0 +1,67 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="CL" author="CM" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: animate-elem-88-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#ValuesAttribute"> + <p> + This tests that any which space before semicolon separators in + a <code>values=""</code> attribute on an animation element is ignored. + </p> + <p> + The test consists of a single rectangle whose height is animated + with a <code>values=" 0 ; 50 "</code> attribute. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the rectangle is animated from a height of + 0 to a height of 50 over four seconds, starting from when the + test is loaded. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-88-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text x='10' y='40'>Test values attribute list syntax</text> + + <rect x='10' y='50' width='50' height='0'> + <animate attributeName='height' values=' 0 ; 50 ' dur='4s' fill='freeze'/> + </rect> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-89-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-89-t-manual.svg new file mode 100644 index 000000000..07aee20f9 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-89-t-manual.svg @@ -0,0 +1,110 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="CL" status="accepted" + version="$Revision: 1.4 $" testname="$RCSfile: animate-elem-89-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/errata/errata.html#value_spacing_of_keySpline_syntax"> + <p> + Tests clarification of value spacing of keySpline syntax; whitespace, or commas with optional whitespace, are allowed. + </p> + <p> + Test possible values for 'calcMode="spline"', with both commas, whitespace, and mixed separators + </p> + <p> + Six animations (three sets of two) have been defined. The three green ones on the left show rectangles which get smaller. The three orange ones on the right show rectangles of constant size, which move. + The black text and grey ruler lines help show the sizes and movement of the rectangles over time. +<!-- derived from animate-elem-12-t.svg: by duplicating the animated rectangles, then changing the list separators --> + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the bottom edge of all six animated rectangles move together in sync. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-89-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-family="SVGFreeSansASCII" font-size="20"> + +<!-- guide lines and labelling --> + <g transform="translate(10,50)"> + <text x="0" y="203">0 sec.</text> + <text x="0" y="170">3 sec. </text> + <text x="0" y="114">6 sec. </text> + <text x="3" y="3">9+ sec. </text> + <g stroke="#AAA" stroke-width="4"> + <line x1="70" y1="200" x2="450" y2="200"/> + <line x1="70" y1="167" x2="450" y2="167"/> + <line x1="70" y1="111" x2="450" y2="111"/> + <line x1="70" y1="0" x2="450" y2="0"/> + </g> + </g> + +<!-- first set of three subtests, keySplines on animation element --> + <g transform="translate(60,50)"> + + <rect x="140" y="-10" width="50" height="210" fill="rgb(34, 139, 34)" stroke="#555" stroke-width="4"> + <animate attributeName="height" calcMode="spline" keySplines="0,0,1,1;0,0,1,1;.75,0,0,.75" values="210;177;121;10" begin="0s" dur="9s" fill="freeze"/> +<!-- commas --> + </rect> + <rect x="90" y="-10" width="50" height="210" fill="rgb(50, 205, 50)" stroke="#555" stroke-width="4"> + <animate attributeName="height" calcMode="spline" keySplines="0 0 1 1;0 0 1 1;.75 0 0 .75" values="210;177;121;10" begin="0s" dur="9s" fill="freeze"/> +<!-- spaces --> + </rect> + <rect x="40" y="-10" width="50" height="210" fill="rgb(154, 205, 50)" stroke="#555" stroke-width="4"> + <animate attributeName="height" calcMode="spline" keySplines="0 , 0 , 1 , 1;0 , 0 , 1 , 1;.75 , 0 , 0 , .75" values="210;177;121;10" begin="0s" dur="9s" fill="freeze"/> +<!-- commas and spaces --> + </rect> + </g> + +<!-- second set of three subtests, keySplines on animateMotion element --> + <g transform="translate(250,50)"> + + <rect x="140" y="-10" width="60" height="10" fill="rgb(235, 110, 0)" stroke="#555" stroke-width="4"> + <animateMotion calcMode="spline" keySplines="0,0,1,1;0,0,1,1;.75,0,0,.75" values="0,200; 0,167; 0,111; 0,0" begin="0s" dur="9s" fill="freeze"/> +<!-- commas --> + </rect> + <rect x="90" y="-10" width="60" height="10" fill="rgb(255, 180, 30)" stroke="#555" stroke-width="4"> + <animateMotion calcMode="spline" keySplines="0 0 1 1;0 0 1 1;.75 0 0 .75" values="0,200; 0 167; 0 111; 0 0" begin="0s" dur="9s" fill="freeze"/> +<!-- spaces --> + </rect> + <rect x="40" y="-10" width="60" height="10" fill="rgb(255, 220, 60)" stroke="#555" stroke-width="4"> + <animateMotion calcMode="spline" keySplines="0 , 0 , 1 , 1;0 , 0 , 1 , 1;.75 , 0 , 0 , .75" values="0 , 200; 0 , 167; 0 , 111; 0 , 0" begin="0s" dur="9s" fill="freeze"/> +<!-- commas and spaces --> + </rect> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-90-b-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-90-b-manual.svg new file mode 100644 index 000000000..1d0d1b08e --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-90-b-manual.svg @@ -0,0 +1,104 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2010 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CL" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: animate-elem-90-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + Test that the class attribute is animatable and that style + sheets select on the animated value. +<!-- not clear whether to link to dev.w3.org or to /TR +http://dev.w3.org/SVG/profiles/1.1F2/publish/styling.html#ClassAttribute +--> + + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + This test uses the following elements : 'set', + and 'animate'. It requires that CSS style sheets are supported. + </p> + <p> + The test shows a circle which is initially hidden, becomes visible and blue at + 3s, abruptly changing to dark red at 5s. Two overlapping animations both animate the + class attribute. The class attribute, as a string value, does not support + linear interpolation so a discrete animation is produced, changing from the + start to the end value midway through the animation duration. + </p> + <p> + The first animation starts at 2s and lasts for 4s so the mid point is at 3s. + The second animation starts at 3s and lasts for 4s so the midpoint is at 5s. + The file includes various guides that can be used to verify the + correctness of the animation. The value of the class attribute + at 02 is "start" so the first CSS rule matches. At 3s it becomes "midway" + so the second rule matches. At 5s it becomes "final midway" so the second and + third rules match; the third rule has higher specificity so determines the fill color. + + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The color of the large circle must match the colour of the smaller guide + boxes on the left at times 0s, 3s and 5s. If the text "CSS not supported" + is visible, the test does not apply. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-90-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + <style type="text/css"> + .start {visibility: hidden } + .midway {visibility: visible; fill: rgb(0,0,255); } + #test-body-content .final {fill: rgb(128,0,0); } + .hideme {display: none;} + </style> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- Guide objects to show where the animation elements belong at which time --> + <g font-family="Verdana" font-size="12"> + <text x="15" y="55">Color at start</text> + <rect x="15" y="60" width="30" height="30"/> + <circle cx="30" cy="75" r="10" fill="#000"/> + <text x="15" y="145">Color at 3s</text> + <rect x="15" y="150" width="30" height="30"/> + <circle cx="30" cy="165" r="10" fill="rgb(0,0,255)"/> + <text x="15" y="235">Color at 5s</text> + <rect x="15" y="240" width="30" height="30"/> + <circle cx="30" cy="255" r="10" fill="rgb(128,0,0)"/> + </g> + + <g> + <rect x="150" y="50" width="240" height="240" stroke="black" fill="black"/> + <circle cx="270" cy="170" r="110" class="start"> + <set attributeName="class" attributeType="XML" to="midway" begin="2s" dur="2s" fill="freeze"/> + <animate attributeName="class" attributeType="XML" from="midway" to="final midway" begin="3s" dur="4s" fill="freeze"/> + </circle> + </g> + <text x="270" y="170" text-anchor="middle" font-size="40" fill="#F69" class="hideme">CSS not supported</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-91-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-91-t-manual.svg new file mode 100644 index 000000000..a3b0a67f8 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-91-t-manual.svg @@ -0,0 +1,198 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="CM" status="created" + version="$Revision: 1.1 $" testname="$RCSfile: animate-elem-91-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#ValueAttributes"> + <p> + This tests that to-animations on attributes whose values cannot be + interpolated are treated as discrete animations. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test passes if there initially eight red squares in the + left column when the document is loaded and the all move + at the same time to the right column two seconds after the + document is loaded. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-91-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text x="10" y="40">Testing <animate to=""> with non-interpolable attributes</text> + + <g font-size="16"> + + <text x="207.5" y="75" text-anchor="middle">0s-2s</text> + <text x="307.5" y="75" text-anchor="middle">> 2s</text> + + <!-- Reference: using <set> --> + <g transform="translate(0,85)"> + <text x="30" y="12">(reference)</text> + <rect x="200" width="12" height="12" stroke="black" fill="rgb(204,0,102)"> + <set attributeName="fill" to="#ccc" begin="2s" dur="2s" fill="freeze"/> + </rect> + <rect x="300" width="12" height="12" stroke="black" fill="#ccc"> + <set attributeName="fill" to="rgb(204,0,102)" begin="2s" dur="2s" fill="freeze"/> + </rect> + </g> + + <!-- Sub-test 1: class on <rect> --> + <g transform="translate(0,110)"> + <style type="text/css">.on { fill: rgb(204,0,102) } .off { fill: #ccc }</style> + <text x="30" y="12">class</text> + <rect x="200" width="12" height="12" stroke="black" class="on"> + <animate attributeName="class" to="off" begin="2s" dur="2s" fill="freeze"/> + </rect> + <rect x="300" width="12" height="12" stroke="black" class="off"> + <animate attributeName="class" to="on" begin="2s" dur="2s" fill="freeze"/> + </rect> + </g> + + <!-- Sub-test 2: clipPathUnits on <clipPath> --> + <g transform="translate(0,135)"> + <text x="30" y="12">clipPathUnits</text> + <clipPath id="c1" clipPathUnits="objectBoundingBox"> + <rect width="1" height="1"/> + <animate attributeName="clipPathUnits" to="userSpaceOnUse" begin="2s" dur="2s" fill="freeze"/> + </clipPath> + <rect x="200" width="12" height="12" stroke="black" fill="#ccc"/> + <rect x="200" width="12" height="12" stroke="black" fill="rgb(204,0,102)" clip-path="url(#c1)"/> + <rect x="300" width="12" height="12" stroke="black" fill="rgb(204,0,102)"/> + <rect x="300" width="12" height="12" stroke="black" fill="#ccc" clip-path="url(#c1)"/> + </g> + + <!-- Sub-test 3: in on <feComposite> --> + <g transform="translate(0,160)"> + <text x="30" y="12">in</text> + <filter id="f1" x="0" y="0" width="1" height="1"> + <feFlood flood-color="#ccc" result="off"/> + <feFlood flood-color="rgb(204,0,102)" result="on"/> + <feComposite in="on" in2="SourceGraphic"> + <animate attributeName="in" to="off" begin="2s" dur="2s" fill="freeze"/> + </feComposite> + </filter> + <filter id="f2" x="0" y="0" width="1" height="1"> + <feFlood flood-color="#ccc" result="off"/> + <feFlood flood-color="rgb(204,0,102)" result="on"/> + <feComposite in="off" in2="SourceGraphic"> + <animate attributeName="in" to="on" begin="2s" dur="2s" fill="freeze"/> + </feComposite> + </filter> + <rect x="200" width="12" height="12" fill="none" filter="url(#f1)"/> + <rect x="200" width="12" height="12" stroke="black" fill="none"/> + <rect x="300" width="12" height="12" fill="none" filter="url(#f2)"/> + <rect x="300" width="12" height="12" stroke="black" fill="none"/> + </g> + + <!-- Sub-test 4: preserveAspectRatio on <svg> --> + <g transform="translate(0,185)"> + <text x="30" y="12">preserveAspectRatio</text> + <rect x="200" width="12" height="12" fill="#ccc"/> + <rect x="300" width="12" height="12" fill="rgb(204,0,102)"/> + <clipPath id="c2" clipPathUnits="userSpaceOnUse"> + <rect x="200" y="0" width="112" height="12"/> + </clipPath> + <g clip-path="url(#c2)"> + <svg width="200" height="100" viewBox="0 0 400 400" preserveAspectRatio="none" overflow="visible"> + <rect x="400" width="24" height="48" fill="rgb(204,0,102)"/> + <rect x="600" width="24" height="48" fill="#ccc"/> + <animate attributeName="preserveAspectRatio" to="xMinYMin" begin="2s" dur="2s" fill="freeze"/> + </svg> + </g> + <rect x="200" width="12" height="12" stroke="black" fill="none"/> + <rect x="300" width="12" height="12" stroke="black" fill="none"/> + </g> + + <!-- Sub-test 5: spreadMethod on <linearGradient> --> + <g transform="translate(0,210)"> + <text x="30" y="12">spreadMethod</text> + <linearGradient id="g1" gradientUnits="objectBoundingBox" x1="1" y1="0" x2="2" y2="0" spreadMethod="reflect"> + <stop offset="0" stop-color="rgb(204,0,102)" stop-opacity="0"/> + <stop offset="0" stop-color="rgb(204,0,102)"/> + <stop offset="1" stop-color="rgb(204,0,102)"/> + <stop offset="1" stop-color="rgb(204,0,102)" stop-opacity="0"/> + <animate attributeName="spreadMethod" to="pad" begin="2s" dur="2s" fill="freeze"/> + </linearGradient> + <linearGradient id="g2" gradientUnits="objectBoundingBox" x1="1" y1="0" x2="2" y2="0" spreadMethod="reflect"> + <stop offset="0" stop-color="#ccc" stop-opacity="0"/> + <stop offset="0" stop-color="#ccc"/> + <stop offset="1" stop-color="#ccc"/> + <stop offset="1" stop-color="#ccc" stop-opacity="0"/> + <animate attributeName="spreadMethod" to="pad" begin="2s" dur="2s" fill="freeze"/> + </linearGradient> + <rect x="200" width="12" height="12" fill="#ccc"/> + <rect x="300" width="12" height="12" fill="rgb(204,0,102)"/> + <rect x="200" width="12" height="12" stroke="black" fill="url(#g1)"/> + <rect x="300" width="12" height="12" stroke="black" fill="url(#g2)"/> + </g> + + <!-- Sub-test 6: xlink:href on <use> --> + <g transform="translate(0,235)"> + <text x="30" y="12">xlink:href</text> + <g display="none"> + <rect id="r1" width="12" height="12" fill="rgb(204,0,102)" stroke="black"/> + <rect id="r2" width="12" height="12" fill="#ccc" stroke="black"/> + </g> + <use xlink:href="#r1" x="200"> + <animate attributeName="xlink:href" to="#r2" begin="2s" dur="2s" fill="freeze"/> + </use> + <use xlink:href="#r2" x="300"> + <animate attributeName="xlink:href" to="#r1" begin="2s" dur="2s" fill="freeze"/> + </use> + </g> + + <!-- Sub-test 7: display on <rect> --> + <g transform="translate(0,260)"> + <text x="30" y="12">display</text> + <g> + <rect x="200" width="12" height="12" fill="rgb(204,0,102)" stroke="black"/> + <rect x="300" width="12" height="12" fill="#ccc" stroke="black"/> + <animate attributeName="display" to="none" begin="2s" dur="2s" fill="freeze"/> + </g> + <g display="none"> + <rect x="200" width="12" height="12" fill="#ccc" stroke="black"/> + <rect x="300" width="12" height="12" fill="rgb(204,0,102)" stroke="black"/> + <animate attributeName="display" to="inline" begin="2s" dur="2s" fill="freeze"/> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.1 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-elem-92-t-manual.svg b/testing/web-platform/tests/svg/import/animate-elem-92-t-manual.svg new file mode 100644 index 000000000..95b5f0703 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-elem-92-t-manual.svg @@ -0,0 +1,113 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CM" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: animate-elem-92-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#Animation"> + <p> + This tests checks the behavior of discrete to-animations. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if after five seconds, in each of the three rows, + the red rectangle is in the column at the times indicated. + Thus, from the document load until 2s afterwards, the red + square in all three rows must be in the left column. At 2s, + all three red squares must move to the right column. At 4s, + the red square in the first row must move to the left column + and the other two red squares must remain in the right column.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-elem-92-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text text-anchor="middle" x="240" y="30" font-size="20">discrete to-animation</text> + <g transform="translate(100, 70)"> + <g transform="translate(80,25)" text-anchor="end" font-size="14"> + <text>without freezing</text> + <text y="55">with freezing</text> + <text y="110">with keyTimes</text> + </g> + + <g id="timeMarkersText" transform="translate(150, 5)" text-anchor="middle" font-size="14"> + <text>0s-2s</text> + <text y="-16">> 4s</text> + <text x="80">2s-4s</text> + + <g transform="translate(0, 55)"> + <text>0s-2s</text> + <text x="80">> 2s</text> + </g> + + <g transform="translate(0, 110)"> + <text>0s-2s</text> + <text x="80">> 2s</text> + </g> + </g> + + <g transform="translate(150,20)" stroke="black"> + <defs> + <rect id="shadow" x="-6" y="-6" width="12" height="12" fill="#ccc" stroke="black" stroke-width="1"/> + </defs> + + <g> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <animate attributeName="x" calcMode="discrete" to="74" dur="4s"/> + </rect> + </g> + + <g transform="translate(0, 55)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <animate attributeName="x" calcMode="discrete" to="74" dur="4s" fill="freeze"/> + </rect> + </g> + + <g transform="translate(0, 110)"> + <use xlink:href="#shadow" x="0"/> + <use xlink:href="#shadow" x="80"/> + + <rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)"> + <animate attributeName="x" calcMode="discrete" to="74" dur="8s" keyTimes="0; 0.25" fill="freeze"/> + </rect> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-interact-events-01-t-manual.svg b/testing/web-platform/tests/svg/import/animate-interact-events-01-t-manual.svg new file mode 100644 index 000000000..a0014c5de --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-interact-events-01-t-manual.svg @@ -0,0 +1,116 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AE" author="ASl" status="accepted" + version="$Revision: 1.2 $" testname="$RCSfile: animate-interact-events-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#SVGEvents"> + <p>Tests 'mouseover' event on SVGElementInstance</p> + <p> + What each case tests is as follows. + Case 1: mouseover event on SVGElementInstance. Referenceing an element that contains an event. + Case 2: mouseover event on referencing element. Event bubbling from SVGElementInstance to referencing element. + Case 3: mouseover event on parent of referencing element. Event bubbling from SVGElementInstance to referencing element ancestors. + Case 4: mousedown event on referencing element. SVGElementInstance is not effected by event listener on referencing element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Mouseover each of the red rectangles, and then click on the bottommost rectangle. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + This test contains four cases. The cases must produce the following results for the test to pass. + </p> + <ul> + <li>Case 1: On a mouseover event on the top square, all four squares must turn blue.</li> + <li>Case 2: On a mouseover event on the top middle square, all four squares must turn blue and a black stroke + must appear on the referencing square (element).</li> + <li>Case 3: On a mouseover event on the bottom middle square, all four squares must turn blue and a black + stroke must appear on the referencing square (element).</li> + <li>Case 4: On a mouseover event on the bottom square, all four squares must turn blue, and on a mousedown event + a black stroke must appear on the referencing square (element).</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-interact-events-01-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <defs> + <!-- SVGElementInstance animates fill on mouseover --> + <rect id="rect" width="50" height="50" fill="red"> + <set attributeName="fill" begin="mouseover" end="mouseout" to="blue"/> + </rect> + </defs> + + <text x="120" y="20" font-size="15">Shadow tree event listener chain</text> + + <!--basic event dispatch - all rectangles turn blue --> + <use fill="red" x="30" y="30" xlink:href="#rect"/> + <text x="95" y="45" font-size="12">Case 1: on mouseover all squares must turn blue</text> + + <!-- event bubbling from SVGElementInstance to referencing element --> + <!-- all rectangles turn blue and second rectangle displays black stroke --> + <use id="use2" fill="red" x="30" y="100" xlink:href="#rect"/> + <rect pointer-events="none" x="30" y="100" width="50" height="50" fill="none" stroke-width="5" stroke="none" > + <set attributeName="stroke" begin="use2.mouseover" end="use2.mouseout" to="black"/> + </rect> + <g font-size="12"> + <text x="95" y="115">Case 2: on mouseover all squares must turn blue</text> + <text x="95" y="130">and a black stroke must appear on reference square</text> + </g> + + <!-- event bubbling from SVGElementInstance to referencing element ancestors--> + <!-- all rectangles turn blue and third rectangle displays black stroke --> + <g id="g1"> + <use fill="red" x="30" y="170" xlink:href="#rect"/> + <rect pointer-events="none" x="30" y="170" width="50" height="50" fill="none" stroke-width="5" stroke="none" > + <set attributeName="stroke" begin="g1.mouseover" end="g1.mouseout" to="black"/> + </rect> + </g> + <g font-size="12"> + <text x="95" y="185">Case 3: on mouseover all squares must turn blue</text> + <text x="95" y="200">and a black stroke must appear on reference square</text> + </g> + + <!--SVGElementInstance is not effected by event listener on referencing element --> + <!-- all rectangles turn blue and displays black stroke only on mouse down --> + <use id="use3" fill="red" x="30" y="240" xlink:href="#rect"/> + <rect pointer-events="none" x="30" y="240" width="50" height="50" fill="none" stroke-width="5" stroke="none" > + <set attributeName="stroke" begin="use3.mousedown" end="use3.mouseup" to="black"/> + </rect> + <g font-size="12"> + <text x="95" y="255">Case 4: on mouseover all squares must turn blue</text> + <text x="95" y="270">and on mousedown a black stroke must appear on reference square</text> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-interact-pevents-01-t-manual.svg b/testing/web-platform/tests/svg/import/animate-interact-pevents-01-t-manual.svg new file mode 100644 index 000000000..9d51b7ea6 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-interact-pevents-01-t-manual.svg @@ -0,0 +1,285 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="ED" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: animate-interact-pevents-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#PointerEventsProperty"> + <p> + This test tests 'pointer-events' on text. Initially you should see four big rects with black stroke. + In the uppermost rect there should be 10 'O':s with black fill. + In the second rect from the top there should be 10 'O':s with no fill but with black stroke. + In the third and fourth rects there should be no visible 'O':s at all. + In the fourth rect there should be two green rects, and in each of the other three rects there should be one green rect. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Using the pointer device move the cursor over each of the four black-stroked rectangles from left to right. + As the mouseover event triggers, the 'O':s will become visible and marked + in either green (a pass) or red (an immediate fail). Some 'O':s will not + change when the pointer is moved over them. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if after moving the cursor over all the rects: + </p> + <ol> + <li>all the 'O':s in the green rects have green fill</li> + <li>there are no red 'O':s visible</li> + <li>there are 9 green 'O':s in the first and second rect, 4 in the third rect and 6 in the fourth rect</li> + </ol> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-interact-pevents-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-family="sans-serif" font-size="40" text-rendering="geometricPrecision"> + <text x="240" y="40" text-anchor="middle" font-size="20">Test pointer-events on text</text> + <g transform="translate(40, -10)"> + <g id="first-line"> + <text x="50" y="100"> + O + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="80" y="100" pointer-events="visiblePainted"> + O + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="110" y="100" pointer-events="visibleFill"> + O + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="140" y="100" pointer-events="visibleStroke"> + O + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="170" y="100" pointer-events="visible"> + O + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="200" y="100" pointer-events="painted"> + O + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="230" y="100" pointer-events="fill"> + O + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="260" y="100" pointer-events="stroke"> + O + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="290" y="100" pointer-events="all"> + O + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="320" y="100" pointer-events="none"> + O + <set attributeName="fill" to="red" begin="mouseover" dur="indefinite"/> + </text> + + <g pointer-events="none"> + <rect x="50" y="65" height="40" width="270" fill="green" fill-opacity="0.5" visibility="visible"/> + + <rect x="50" y="65" height="40" width="300" fill="none" stroke="black" visibility="visible"/> + </g> + </g> + + <g id="second-line" transform="translate(0 60)" fill="none" stroke="black"> + <text x="50" y="100"> + O + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="80" y="100" pointer-events="visiblePainted"> + O + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="110" y="100" pointer-events="visibleFill"> + O + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="140" y="100" pointer-events="visibleStroke"> + O + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="170" y="100" pointer-events="visible"> + O + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="200" y="100" pointer-events="painted"> + O + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="230" y="100" pointer-events="fill"> + O + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="260" y="100" pointer-events="stroke"> + O + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="290" y="100" pointer-events="all"> + O + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="320" y="100" pointer-events="none"> + O + <set attributeName="fill" to="red" begin="mouseover" dur="indefinite"/> + </text> + + <g pointer-events="none"> + <rect x="50" y="65" height="40" width="270" fill="green" fill-opacity="0.5" visibility="visible" stroke="none"/> + + <rect x="50" y="65" height="40" width="300" fill="none" stroke="black" visibility="visible"/> + </g> + </g> + + <g id="third-line" transform="translate(0 120)" visibility="hidden"> + <text x="50" y="100"> + O + <set attributeName="visibility" to="visible" begin="mouseover" dur="indefinite"/> + <set attributeName="fill" to="red" begin="mouseover" dur="indefinite"/> + </text> + <text x="80" y="100" pointer-events="visiblePainted"> + O + <set attributeName="visibility" to="visible" begin="mouseover" dur="indefinite"/> + <set attributeName="fill" to="red" begin="mouseover" dur="indefinite"/> + </text> + <text x="110" y="100" pointer-events="visibleFill"> + O + <set attributeName="visibility" to="visible" begin="mouseover" dur="indefinite"/> + <set attributeName="fill" to="red" begin="mouseover" dur="indefinite"/> + </text> + <text x="140" y="100" pointer-events="visibleStroke"> + O + <set attributeName="visibility" to="visible" begin="mouseover" dur="indefinite"/> + <set attributeName="fill" to="red" begin="mouseover" dur="indefinite"/> + </text> + <text x="170" y="100" pointer-events="visible"> + O + <set attributeName="visibility" to="visible" begin="mouseover" dur="indefinite"/> + <set attributeName="fill" to="red" begin="mouseover" dur="indefinite"/> + </text> + <text x="200" y="100" pointer-events="painted"> + O + <set attributeName="visibility" to="visible" begin="mouseover" dur="indefinite"/> + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="230" y="100" pointer-events="fill"> + O + <set attributeName="visibility" to="visible" begin="mouseover" dur="indefinite"/> + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="260" y="100" pointer-events="stroke"> + O + <set attributeName="visibility" to="visible" begin="mouseover" dur="indefinite"/> + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="290" y="100" pointer-events="all"> + O + <set attributeName="visibility" to="visible" begin="mouseover" dur="indefinite"/> + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="320" y="100" pointer-events="none"> + O + <set attributeName="visibility" to="visible" begin="mouseover" dur="indefinite"/> + <set attributeName="fill" to="red" begin="mouseover" dur="indefinite"/> + </text> + + <g pointer-events="none"> + <rect x="200" y="65" height="40" width="120" fill="green" fill-opacity="0.5" visibility="visible"/> + + <rect x="50" y="65" height="40" width="300" fill="none" stroke="black" visibility="visible"/> + </g> + </g> + + <g id="fourth-line" transform="translate(0 180)" fill="none" stroke="none"> + <text x="50" y="100"> + O + <set attributeName="visibility" to="visible" begin="mouseover" dur="indefinite"/> + <set attributeName="fill" to="red" begin="mouseover" dur="indefinite"/> + </text> + <text x="80" y="100" pointer-events="visiblePainted"> + O + <set attributeName="visibility" to="visible" begin="mouseover" dur="indefinite"/> + <set attributeName="fill" to="red" begin="mouseover" dur="indefinite"/> + </text> + <text x="110" y="100" pointer-events="visibleFill"> + O + <set attributeName="visibility" to="visible" begin="mouseover" dur="indefinite"/> + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="140" y="100" pointer-events="visibleStroke"> + O + <set attributeName="visibility" to="visible" begin="mouseover" dur="indefinite"/> + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="170" y="100" pointer-events="visible"> + O + <set attributeName="visibility" to="visible" begin="mouseover" dur="indefinite"/> + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="200" y="100" pointer-events="painted"> + O + <set attributeName="visibility" to="visible" begin="mouseover" dur="indefinite"/> + <set attributeName="fill" to="red" begin="mouseover" dur="indefinite"/> + </text> + <text x="230" y="100" pointer-events="fill"> + O + <set attributeName="visibility" to="visible" begin="mouseover" dur="indefinite"/> + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="260" y="100" pointer-events="stroke"> + O + <set attributeName="visibility" to="visible" begin="mouseover" dur="indefinite"/> + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="290" y="100" pointer-events="all"> + O + <set attributeName="visibility" to="visible" begin="mouseover" dur="indefinite"/> + <set attributeName="fill" to="green" begin="mouseover" dur="indefinite"/> + </text> + <text x="320" y="100" pointer-events="none"> + O + <set attributeName="visibility" to="visible" begin="mouseover" dur="indefinite"/> + <set attributeName="fill" to="red" begin="mouseover" dur="indefinite"/> + </text> + + <g pointer-events="none"> + <rect x="110" y="65" height="40" width="90" fill="green" fill-opacity="0.5" visibility="visible"/> + <rect x="230" y="65" height="40" width="90" fill="green" fill-opacity="0.5" visibility="visible"/> + + <rect x="50" y="65" height="40" width="300" fill="none" stroke="black" visibility="visible"/> + </g> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-interact-pevents-02-t-manual.svg b/testing/web-platform/tests/svg/import/animate-interact-pevents-02-t-manual.svg new file mode 100644 index 000000000..9993ec6eb --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-interact-pevents-02-t-manual.svg @@ -0,0 +1,116 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="DOH" author="AE" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: animate-interact-pevents-02-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#PointerEventsProperty"> + <p>Testing pointer-events and rendering order</p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Move the mouse over the blue and purple shapes. Click the pink circle at the top right of the page. Move the mouse over the blue and purple shapes again. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + For the test to pass the blue rectangles must always turn pink on mouseover, and the ovals must turn pink on mouseover only if pointer-events are set to "ALL". + If a shape other than the one currently hovered turns pink then the test has failed. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-interact-pevents-02-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <rect x="15" y="15" height="280" width="450" fill="none" stroke="black" stroke-width="0.25"/> + <g text-anchor="middle"> + <text x="240" y="30" fill="black" font-size="15">Testing pointer-events and rendering order</text> + <text x="240" y="42" fill="#555" font-size="10">Rectangles should turn RED on mouseover </text> + <text x="240" y="54" fill="#555" font-size="10">Ovals should turn RED if Pointer-Events are set to "ALL"</text> + </g> + <g id="buttons"> + <g text-anchor="middle" font-size="8" fill="#555" transform="translate(0,10)"> + <text x="400" y="85">Change "Pointer-Events" of </text> + <text x="400" y="95">ovals from "ALL" to "NONE"</text> + <circle id="on" cx="385" cy="65" r="10" fill-opacity="1" fill="#3c5" stroke="black" stroke-width="3"/> + <circle id="off" cx="415" cy="65" r="10" fill-opacity="1" fill="#f35" stroke="black"/> + </g> + <g text-anchor="middle" font-size="12" fill="#555"> + <text id="all" x="240" y="285" fill="#555" visibility="visible">Purple ovals have "Pointer-Events" set to "ALL".</text> + <text id="none" x="240" y="285" fill="#555" visibility="hidden">Purple ovals have Pointer-Events set to "NONE".</text> + </g> + <set xlink:href="#all" attributeName="visibility" to="visible" begin="on.mousedown" fill="freeze"/> + <set xlink:href="#all" attributeName="visibility" to="hidden" begin="off.mousedown" fill="freeze"/> + <set xlink:href="#none" attributeName="visibility" to="hidden" begin="on.mousedown" fill="freeze"/> + <set xlink:href="#none" attributeName="visibility" to="visible" begin="off.mousedown" fill="freeze"/> + <set xlink:href="#on" attributeName="stroke-width" to="3" begin="on.mousedown" fill="freeze"/> + <set xlink:href="#on" attributeName="stroke-width" to="1" begin="off.mousedown" fill="freeze"/> + <set xlink:href="#off" attributeName="stroke-width" to="3" begin="off.mousedown" fill="freeze"/> + <set xlink:href="#off" attributeName="stroke-width" to="1" begin="on.mousedown" fill="freeze"/> + <set xlink:href="#c10" attributeName="pointer-events" to="all" begin="on.mousedown" fill="freeze"/> + <set xlink:href="#c10" attributeName="pointer-events" to="none" begin="off.mousedown" fill="freeze"/> + <set xlink:href="#c11" attributeName="pointer-events" to="all" begin="on.mousedown" fill="freeze"/> + <set xlink:href="#c11" attributeName="pointer-events" to="none" begin="off.mousedown" fill="freeze"/> + <set xlink:href="#c12" attributeName="pointer-events" to="all" begin="on.mousedown" fill="freeze"/> + <set xlink:href="#c12" attributeName="pointer-events" to="none" begin="off.mousedown" fill="freeze"/> + </g> + <g transform="scale(0.75, 0.5) translate(100, 85)"> + <circle id="c10" cx="160" cy="350" r="100" fill-opacity="1" fill="#53f" stroke="black" pointer-events="all"> + <set attributeName="fill" to="#F55" begin="c10.mouseover"/> + <set attributeName="fill" to="#53f" begin="c10.mouseout"/> + </circle> + <rect id="r10" x="10" y="50" width="300" height="300" fill-opacity="1" fill="#35f" stroke="black"> + <set attributeName="fill" to="#F55" begin="r10.mouseover"/> + <set attributeName="fill" to="#35f" begin="r10.mouseout"/> + </rect> + <circle id="c11" cx="310" cy="350" r="90" fill-opacity="1" fill="#75f" stroke="black" pointer-events="all"> + <set attributeName="fill" to="#F55" begin="c11.mouseover"/> + <set attributeName="fill" to="#75f" begin="c11.mouseout"/> + </circle> + <rect id="r11" x="60" y="100" width="200" height="200" fill-opacity="1" fill="#57f" stroke="black"> + <set attributeName="fill" to="#F55" begin="r11.mouseover"/> + <set attributeName="fill" to="#57f" begin="r11.mouseout"/> + </rect> + <circle id="c12" cx="310" cy="200" r="75" fill-opacity="1" fill="#97f" stroke="black" pointer-events="all"> + <set attributeName="fill" to="#F55" begin="c12.mouseover"/> + <set attributeName="fill" to="#97f" begin="c12.mouseout"/> + </circle> + <rect id="r12" x="110" y="150" width="100" height="100" fill-opacity="1" fill="#79f" stroke="black"> + <set attributeName="fill" to="#F55" begin="r12.mouseover"/> + <set attributeName="fill" to="#79f" begin="r12.mouseout"/> + </rect> + <g id="dasharray-rectangles" stroke-width="0.5" stroke-dasharray="4, 4"> + <rect id="r-dash10" x="10" y="50" width="300" height="300" fill-opacity="0" fill="none" stroke="black" pointer-events="none"/> + <rect id="r-dash11" x="60" y="100" width="200" height="200" fill-opacity="0" fill="none" stroke="black" pointer-events="none"/> + <rect id="r-dash12" x="110" y="150" width="100" height="100" fill-opacity="0" fill="none" stroke="black" pointer-events="none"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-interact-pevents-03-t-manual.svg b/testing/web-platform/tests/svg/import/animate-interact-pevents-03-t-manual.svg new file mode 100644 index 000000000..6fff4f9bf --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-interact-pevents-03-t-manual.svg @@ -0,0 +1,219 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="DOH" author="AE" status="accepted" + version="$Revision: 1.2 $" testname="$RCSfile: animate-interact-pevents-03-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#PointerEventsProperty"> + <p>Tests the pointer-events attribute with different 'visible' values</p> + <p> + The 2nd and 3rd columns represent respectively rects with no fill/stroke and transparent fill/stroke. + The 4th column (most right column) has a non activatable pointer event as the visibility of the column + is set to hidden. + </p> + <p> + The first row tests the default value for pointer-event, i.e. visible fill and stroke will trigger an event. + The second row tests pointer-events="visiblePainted", i.e. visible fill and stroke will trigger an event. + The third row tests pointer-events="visibleFill", i.e. visible fill only an event. + The fourth row tests pointer-events="visibleStroke", i.e. visible stroke only an event. + The fifth row tests pointer-events="visible", i.e. visible fill and stroke will trigger an event. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Slowly move the mouse over the rectangles in each row while checking the pass criteria. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the following conditions are met + </p> + <ul> + <li>In the first row of squares, the fill and stroke of squares 1 and 3 only must trigger a pale red rectangle to appear + over the squares on mouseover.</li> + <li>In the second row of squares, the fill and stroke of squares 1 and 3 only must trigger a pale red rectangle to appear + over the squares on mouseover.</li> + <li>In the third row of squares, the fill only of squares 1, 2 and 3 must trigger a pale red rectangle to appear + over the squares on mouseover.</li> + <li>In the fourth row of squares, the stroke only of squares 1, 2 and 3 must trigger a pale red rectangle to appear + over the squares on mouseover.</li> + <li>In the fifth row of squares, the fill and stroke of squares 1, 2 and 3 must trigger a pale red rectangle to appear + over the squares on mouseover.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-interact-pevents-03-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g text-anchor="middle"> + <text id="display-title" x="240" y="25" fill="#555" font-size="12"> + <tspan fill="black" font-size="10">Testing pointer-events</tspan> - pale RED rect should appear on mouseover. + </text> + <text id="comment-1" x="240" y="37" fill="#555" font-size="10"> + 2nd and 3rd columns represent respectively rects with no fill/stroke and transparent fill/stroke + </text> + </g> + <g transform="translate(0, 5)"> + <g transform="translate(25, 50)"> + <rect x="-10" y="-10" width="200" height="50" fill="red" fill-opacity="0"> + <set attributeName="fill-opacity" to="0.4" begin="r10.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r10.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r11.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r11.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r12.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r12.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r13.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r13.mouseout"/> + </rect> + <rect id="r10" width="30" height="30" fill="blue" stroke-width="10" stroke="blue" fill-opacity=".3" stroke-opacity=".3"/> + <rect x="50" width="30" height="30" fill="black" fill-opacity="0.1" stroke-width="10" stroke="black" stroke-opacity="0.1"/> + <rect id="r11" x="50" width="30" height="30" fill="none" stroke-width="10" stroke="none" fill-opacity=".3" stroke-opacity=".3"/> + <rect x="100" width="30" height="30" fill="blue" fill-opacity="0.1" stroke-width="10" stroke="blue" stroke-opacity="0.1"/> + <rect id="r12" x="100" width="30" height="30" fill="blue" stroke-width="10" stroke="blue" fill-opacity="0" stroke-opacity="0"/> + <rect x="145" y="-5" width="40" height="40" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect x="150" width="30" height="30" fill="none" stroke-width="1" stroke="black" stroke-dasharray="1,1"/> + <rect x="155" y="5" width="20" height="20" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect id="r13" x="150" width="30" height="30" fill="black" stroke-width="10" stroke="black" visibility="hidden"/> + <g font-size="12"> + <text x="200" y="15">default : </text> + <text x="200" y="30" fill="#777">fill and stroke of rects 1 and 3 must trigger</text> + </g> + </g> + <g transform="translate(25, 100)"> + <rect x="-10" y="-10" width="200" height="50" fill="red" fill-opacity="0"> + <set attributeName="fill-opacity" to="0.4" begin="r20.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r20.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r21.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r21.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r22.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r22.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r23.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r23.mouseout"/> + </rect> + <rect id="r20" width="30" height="30" fill="blue" stroke-width="10" stroke="blue" fill-opacity=".3" stroke-opacity=".3" pointer-events="visiblePainted"/> + <rect x="50" width="30" height="30" fill="black" fill-opacity="0.1" stroke-width="10" stroke="black" stroke-opacity="0.1"/> + <rect id="r21" x="50" width="30" height="30" fill="none" stroke-width="10" stroke="none" fill-opacity=".3" stroke-opacity=".3" pointer-events="visiblePainted"/> + <rect x="100" width="30" height="30" fill="blue" fill-opacity="0.1" stroke-width="10" stroke="blue" stroke-opacity="0.1"/> + <rect id="r22" x="100" width="30" height="30" fill="blue" stroke-width="10" stroke="blue" fill-opacity="0" stroke-opacity="0" pointer-events="visiblePainted"/> + <rect x="145" y="-5" width="40" height="40" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect x="150" width="30" height="30" fill="none" stroke-width="1" stroke="black" stroke-dasharray="1,1"/> + <rect x="155" y="5" width="20" height="20" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect id="r23" x="150" width="30" height="30" fill="black" stroke-width="10" stroke="black" visibility="hidden" pointer-events="visiblePainted"/> + <g font-size="12"> + <text x="200" y="15">visiblePainted : </text> + <text x="200" y="30" fill="#777">fill and stroke of rects 1 and 3 must trigger</text> + </g> + </g> + <g transform="translate(25, 150)"> + <rect x="-10" y="-10" width="200" height="50" fill="red" fill-opacity="0"> + <set attributeName="fill-opacity" to="0.4" begin="r30.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r30.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r31.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r31.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r32.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r32.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r33.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r33.mouseout"/> + </rect> + <rect id="r30" width="30" height="30" fill="blue" stroke-width="10" stroke="black" fill-opacity=".3" stroke-opacity=".3" pointer-events="visibleFill"/> + + <rect x="50" width="30" height="30" fill="blue" fill-opacity="0.1" stroke-width="10" stroke="black" stroke-opacity="0.1"/> + <rect id="r31" x="50" width="30" height="30" fill="none" stroke-width="10" stroke="none" fill-opacity=".3" stroke-opacity=".3" pointer-events="visibleFill"/> + + <rect x="100" width="30" height="30" fill="blue" fill-opacity="0.1" stroke-width="10" stroke="black" stroke-opacity="0.1"/> + <rect id="r32" x="100" width="30" height="30" fill="blue" stroke-width="10" stroke="black" fill-opacity="0" stroke-opacity="0" pointer-events="visibleFill"/> + + <rect x="145" y="-5" width="40" height="40" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect x="150" width="30" height="30" fill="none" stroke-width="1" stroke="black" stroke-dasharray="1,1"/> + <rect x="155" y="5" width="20" height="20" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect id="r33" x="150" width="30" height="30" fill="black" stroke-width="10" stroke="black" visibility="hidden" pointer-events="visibleFill"/> + <g font-size="12"> + <text x="200" y="15">visibleFill : </text> + <text x="200" y="30" fill="#777">only fill of rects 1, 2 and 3 must trigger</text> + </g> + </g> + <g transform="translate(25, 200)"> + <rect x="-10" y="-10" width="200" height="50" fill="red" fill-opacity="0"> + <set attributeName="fill-opacity" to="0.4" begin="r40.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r40.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r41.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r41.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r42.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r42.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r43.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r43.mouseout"/> + </rect> + <rect id="r40" width="30" height="30" fill="black" stroke-width="10" stroke="blue" fill-opacity=".3" stroke-opacity=".3" pointer-events="visibleStroke"/> + + <rect x="50" width="30" height="30" fill="black" fill-opacity="0.1" stroke-width="10" stroke="blue" stroke-opacity="0.1"/> + <rect id="r41" x="50" width="30" height="30" fill="none" stroke-width="10" stroke="none" fill-opacity=".3" stroke-opacity=".3" pointer-events="visibleStroke"/> + + <rect x="100" width="30" height="30" fill="black" fill-opacity="0.1" stroke-width="10" stroke="blue" stroke-opacity="0.1"/> + <rect id="r42" x="100" width="30" height="30" fill="black" stroke-width="10" stroke="blue" fill-opacity="0" stroke-opacity="0" pointer-events="visibleStroke"/> + + <rect x="145" y="-5" width="40" height="40" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect x="150" width="30" height="30" fill="none" stroke-width="1" stroke="black" stroke-dasharray="1,1"/> + <rect x="155" y="5" width="20" height="20" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect id="r43" x="150" width="30" height="30" fill="black" stroke-width="10" stroke="black" visibility="hidden" pointer-events="visibleStroke"/> + <g font-size="12"> + <text x="200" y="15">visibleStroke : </text> + <text x="200" y="30" fill="#777">only stroke of rects 1, 2 and 3 must trigger</text> + </g> + </g> + <g transform="translate(25, 250)"> + <rect x="-10" y="-10" width="200" height="50" fill="red" fill-opacity="0"> + <set attributeName="fill-opacity" to="0.4" begin="r50.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r50.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r51.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r51.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r52.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r52.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r53.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r53.mouseout"/> + </rect> + <rect id="r50" width="30" height="30" fill="blue" stroke-width="10" stroke="blue" fill-opacity=".3" stroke-opacity=".3" pointer-events="visible"/> + + <rect x="50" width="30" height="30" fill="blue" fill-opacity="0.1" stroke-width="10" stroke="blue" stroke-opacity="0.1"/> + <rect id="r51" x="50" width="30" height="30" fill="none" stroke-width="10" stroke="none" fill-opacity=".3" stroke-opacity=".3" pointer-events="visible"/> + + <rect x="100" width="30" height="30" fill="blue" fill-opacity="0.1" stroke-width="10" stroke="blue" stroke-opacity="0.1"/> + <rect id="r52" x="100" width="30" height="30" fill="blue" stroke-width="10" stroke="blue" fill-opacity="0" stroke-opacity="0" pointer-events="visible"/> + + <rect x="145" y="-5" width="40" height="40" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect x="150" width="30" height="30" fill="none" stroke-width="1" stroke="black" stroke-dasharray="1,1"/> + <rect x="155" y="5" width="20" height="20" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect id="r53" x="150" width="30" height="30" fill="black" stroke-width="10" stroke="black" visibility="hidden" pointer-events="visible"/> + <g font-size="12"> + <text x="200" y="15">visible : </text> + <text x="200" y="30" fill="#777">fill and stroke of rects 1, 2 and 3 must trigger</text> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> --> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-interact-pevents-04-t-manual.svg b/testing/web-platform/tests/svg/import/animate-interact-pevents-04-t-manual.svg new file mode 100644 index 000000000..c0a45e813 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-interact-pevents-04-t-manual.svg @@ -0,0 +1,208 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="DOH" author="AE" status="accepted" + version="$Revision: 1.2 $" testname="$RCSfile: animate-interact-pevents-04-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#PointerEventsProperty"> + <p>Tests the pointer-events attribute with different painting values</p> + <p> + The 2nd and 3rd columns represent respectively rects with no fill/stroke and transparent fill/stroke. + The 4th column has visibility set to hidden. + </p> + <p> + The first row tests pointer-events="painted", i.e. event on fill and stroke that are set. + The second row tests pointer-events="fill", i.e. event on a fill that is set. + The third row tests pointer-events="stroke", i.e. even on a stroke that is et. + The fourth row tests pointer-events="all", i.e. event on fill and stroke that are set. + The fifth row tests pointer-events="none", i.e. no event. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Slowly move the mouse over the rectangles in each row while checking the pass criteria. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the following conditions are met: + </p> + <ul> + <li>In the first row of squares, the fill and stroke of squares 1, 3 and 4 only must trigger a pale red rectangle to appear + over the squares on mouseover.</li> + <li>In the second row of squares, the fill only of all squares must trigger a pale red rectangle to appear + over the squares on mouseover.</li> + <li>In the third row of squares, the stroke only of all must trigger a pale red rectangle to appear + over the squares on mouseover.</li> + <li>In the fourth row of squares, the fill and stroke of all squares must trigger a pale red rectangle to appear + over the squares on mouseover.</li> + <li>In the fifth row of squares, nothing is to trigger on mouseover.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-interact-pevents-04-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g text-anchor="middle"> + <text id="display-title" x="240" y="25" fill="#555" font-size="12"> + <tspan fill="black" font-size="10">Testing pointer-events</tspan> - pale RED rect should appear on mouseover. + </text> + <text id="comment-1" x="240" y="37" fill="#555" font-size="10"> + 2nd and 3rd columns represent respectively rects with no fill/stroke and transparent fill/stroke + </text> + </g> + <g transform="translate(0, 5)"> + <g transform="translate(25, 50)"> + <rect x="-10" y="-10" width="200" height="50" fill="red" fill-opacity="0"> + <set attributeName="fill-opacity" to="0.4" begin="r60.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r60.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r61.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r61.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r62.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r62.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r63.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r63.mouseout"/> + </rect> + <rect id="r60" width="30" height="30" fill="blue" stroke-width="10" stroke="blue" fill-opacity=".3" stroke-opacity=".3" pointer-events="painted"/> + <rect x="50" width="30" height="30" fill="black" fill-opacity="0.1" stroke-width="10" stroke="black" stroke-opacity="0.1"/> + <rect id="r61" x="50" width="30" height="30" fill="none" stroke-width="10" stroke="none" fill-opacity=".3" stroke-opacity=".3" pointer-events="painted"/> + <rect x="100" width="30" height="30" fill="blue" fill-opacity="0.1" stroke-width="10" stroke="blue" stroke-opacity="0.1"/> + <rect id="r62" x="100" width="30" height="30" fill="blue" stroke-width="10" stroke="blue" fill-opacity="0" stroke-opacity="0" pointer-events="painted"/> + <rect x="145" y="-5" width="40" height="40" fill="none" stroke-width="1" stroke="blue" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect x="150" width="30" height="30" fill="none" stroke-width="1" stroke="blue" stroke-dasharray="1,1"/> + <rect x="155" y="5" width="20" height="20" fill="none" stroke-width="1" stroke="blue" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect id="r63" x="150" width="30" height="30" fill="blue" stroke-width="10" stroke="blue" visibility="hidden" pointer-events="painted"/> + <g font-size="12"> + <text x="200" y="15">painted : </text> + <text x="200" y="30" fill="#777">fill and stroke of rects 1, 3 and 4 must trigger</text> + </g> + </g> + <g transform="translate(25, 100)"> + <rect x="-10" y="-10" width="200" height="50" fill="red" fill-opacity="0"> + <set attributeName="fill-opacity" to="0.4" begin="r70.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r70.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r71.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r71.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r72.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r72.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r73.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r73.mouseout"/> + </rect> + <rect id="r70" width="30" height="30" fill="blue" stroke-width="10" stroke="black" fill-opacity=".3" stroke-opacity=".3" pointer-events="fill"/> + <rect x="50" width="30" height="30" fill="blue" fill-opacity="0.1" stroke-width="10" stroke="black" stroke-opacity="0.1"/> + <rect id="r71" x="50" width="30" height="30" fill="none" stroke-width="10" stroke="none" fill-opacity=".3" stroke-opacity=".3" pointer-events="fill"/> + <rect x="100" width="30" height="30" fill="blue" fill-opacity="0.1" stroke-width="10" stroke="black" stroke-opacity="0.1"/> + <rect id="r72" x="100" width="30" height="30" fill="blue" stroke-width="10" stroke="black" fill-opacity="0" stroke-opacity="0" pointer-events="fill"/> + <rect x="145" y="-5" width="40" height="40" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect x="150" width="30" height="30" fill="none" stroke-width="1" stroke="black" stroke-dasharray="1,1"/> + <rect x="155" y="5" width="20" height="20" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect id="r73" x="150" width="30" height="30" fill="blue" stroke-width="10" stroke="black" visibility="hidden" pointer-events="fill"/> + <g font-size="12"> + <text x="200" y="15">fill : </text> + <text x="200" y="30" fill="#777">fill of rects 1 to 4 must trigger</text> + </g> + </g> + <g transform="translate(25, 150)"> + <rect x="-10" y="-10" width="200" height="50" fill="red" fill-opacity="0"> + <set attributeName="fill-opacity" to="0.4" begin="r80.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r80.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r81.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r81.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r82.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r82.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r83.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r83.mouseout"/> + </rect> + <rect id="r80" width="30" height="30" fill="black" stroke-width="10" stroke="blue" fill-opacity=".3" stroke-opacity=".3" pointer-events="stroke"/> + <rect x="50" width="30" height="30" fill="black" fill-opacity="0.1" stroke-width="10" stroke="blue" stroke-opacity="0.1"/> + <rect id="r81" x="50" width="30" height="30" fill="none" stroke-width="10" stroke="none" fill-opacity=".3" stroke-opacity=".3" pointer-events="stroke"/> + <rect x="100" width="30" height="30" fill="black" fill-opacity="0.1" stroke-width="10" stroke="blue" stroke-opacity="0.1"/> + <rect id="r82" x="100" width="30" height="30" fill="black" stroke-width="10" stroke="blue" fill-opacity="0" stroke-opacity="0" pointer-events="stroke"/> + <rect x="145" y="-5" width="40" height="40" fill="none" stroke-width="1" stroke="blue" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect x="150" width="30" height="30" fill="none" stroke-width="1" stroke="blue" stroke-dasharray="1,1"/> + <rect x="155" y="5" width="20" height="20" fill="none" stroke-width="1" stroke="blue" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect id="r83" x="150" width="30" height="30" fill="black" stroke-width="10" stroke="blue" visibility="hidden" pointer-events="stroke"/> + <g font-size="12"> + <text x="200" y="15">stroke : </text> + <text x="200" y="30" fill="#777">stroke of rects 1 to 4 must trigger</text> + </g> + </g> + <g transform="translate(25, 200)"> + <rect x="-10" y="-10" width="200" height="50" fill="red" fill-opacity="0"> + <set attributeName="fill-opacity" to="0.4" begin="r90.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r90.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r91.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r91.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r92.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r92.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r93.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r93.mouseout"/> + </rect> + <rect id="r90" width="30" height="30" fill="blue" stroke-width="10" stroke="blue" fill-opacity=".3" stroke-opacity=".3" pointer-events="all"/> + <rect x="50" width="30" height="30" fill="blue" fill-opacity="0.1" stroke-width="10" stroke="blue" stroke-opacity="0.1"/> + <rect id="r91" x="50" width="30" height="30" fill="none" stroke-width="10" stroke="none" fill-opacity=".3" stroke-opacity=".3" pointer-events="all"/> + <rect x="100" width="30" height="30" fill="blue" fill-opacity="0.1" stroke-width="10" stroke="blue" stroke-opacity="0.1"/> + <rect id="r92" x="100" width="30" height="30" fill="blue" stroke-width="10" stroke="blue" fill-opacity="0" stroke-opacity="0" pointer-events="all"/> + <rect x="145" y="-5" width="40" height="40" fill="none" stroke-width="1" stroke="blue" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect x="150" width="30" height="30" fill="none" stroke-width="1" stroke="blue" stroke-dasharray="1,1"/> + <rect x="155" y="5" width="20" height="20" fill="none" stroke-width="1" stroke="blue" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect id="r93" x="150" width="30" height="30" fill="blue" stroke-width="10" stroke="blue" visibility="hidden" pointer-events="all"/> + <g font-size="12"> + <text x="200" y="15">all : </text> + <text x="200" y="30" fill="#777">stroke and fill of rects 1 to 4 must trigger</text> + </g> + </g> + <g transform="translate(25, 250)"> + <rect x="-10" y="-10" width="200" height="50" fill="red" fill-opacity="0"> + <set attributeName="fill-opacity" to="0.4" begin="r00.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r00.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r01.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r01.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r02.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r02.mouseout"/> + <set attributeName="fill-opacity" to="0.4" begin="r03.mouseover"/> + <set attributeName="fill-opacity" to="0" begin="r03.mouseout"/> + </rect> + <rect id="r00" width="30" height="30" fill="black" stroke-width="10" stroke="black" fill-opacity=".3" stroke-opacity=".3" pointer-events="none"/> + <rect x="50" width="30" height="30" fill="black" fill-opacity="0.1" stroke-width="10" stroke="black" stroke-opacity="0.1"/> + <rect id="r01" x="50" width="30" height="30" fill="none" stroke-width="10" stroke="none" fill-opacity=".3" stroke-opacity=".3" pointer-events="none"/> + <rect x="100" width="30" height="30" fill="black" fill-opacity="0.1" stroke-width="10" stroke="black" stroke-opacity="0.1"/> + <rect id="r02" x="100" width="30" height="30" fill="black" stroke-width="10" stroke="black" fill-opacity="0" stroke-opacity="0" pointer-events="none"/> + <rect x="145" y="-5" width="40" height="40" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect x="150" width="30" height="30" fill="none" stroke-width="1" stroke="black" stroke-dasharray="1,1"/> + <rect x="155" y="5" width="20" height="20" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect id="r03" x="150" width="30" height="30" fill="black" stroke-width="10" stroke="black" visibility="hidden" pointer-events="none"/> + <g font-size="12"> + <text x="200" y="15">none : </text> + <text x="200" y="30" fill="#777">nothing is to trigger</text> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> --> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-pservers-grad-01-b-manual.svg b/testing/web-platform/tests/svg/import/animate-pservers-grad-01-b-manual.svg new file mode 100644 index 000000000..8f0fdb9a9 --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-pservers-grad-01-b-manual.svg @@ -0,0 +1,103 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CC" status="accepted" + version="$Revision: 1.2 $" testname="$RCSfile: animate-pservers-grad-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Gradients"> + <p> + This test shows rectangles filled with animated gradient which inherits some of their properties: stop-color, stop-opacity. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Load the svg and wait 5 seconds for the animation to run, then compare the image to the reference. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The correct result should show: + </p> + <ul> + <li>the top-left rectangle filled initially with a linear green-to-red gradient and turning into a solid green color after 5s.</li> + <li>the top-right rectangle filled initially with a green gradient fully opaque on the left and half transparent on the right, but after 5s the rectangle should be filled with a fully opaque solid green.</li> + <li>the bottom-left rectangle filled with a static green-to-black opaque gradient.</li> + <li>the bottom-right rectangle initially filled with a green-to-yellow fully-opaque gradient animated and turning into a fully-opaque green solid color.</li> + <!--<li>Animations numbered a4 to a7 should have no impact.</li>--> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-pservers-grad-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <g id="g0" stop-color="yellow" stop-opacity="0" color="yellow"> + <animateColor id="a1" attributeName="stop-color" from="red" to="green" dur="5" fill="freeze"/> + <animateColor id="a2" attributeName="color" from="yellow" to="green" dur="5" fill="freeze"/> + <animate id="a3" attributeName="stop-opacity" from="0.5" to="1" dur="5" fill="freeze"/> + + <linearGradient id="MyGradient1" stop-color="inherit"> + <stop offset="0" stop-color="green" stop-opacity="1"/> + <stop offset="1" stop-color="inherit" stop-opacity="1"/> + </linearGradient> + <linearGradient id="MyGradient2" stop-opacity="inherit"> + <stop offset="0" stop-color="green" stop-opacity="1"/> + <stop offset="1" stop-color="green" stop-opacity="inherit"/> + </linearGradient> + + <g id="g01"> + <linearGradient id="MyGradient3"> + <stop offset="0" stop-color="green" stop-opacity="1"/> + <stop offset="1"/> + </linearGradient> + <linearGradient id="MyGradient4"> + <stop offset="0" stop-color="green" stop-opacity="1"/> + <stop offset="1" stop-color="currentColor" stop-opacity="1"/> + </linearGradient> + </g> + </g> + </defs> + <g id="g1" stop-color="blue"> + <animateColor id="a4" attributeName="stop-color" from="blue" to="red" dur="5" fill="freeze"/> + <rect id="r1" fill="url(#MyGradient1)" width="100" height="100" x="50" y="50"/> + </g> + <g id="g2" stop-opacity="1"> + <animate id="a5" attributeName="stop-opacity" from="1" to="0" dur="5" fill="freeze"/> + <rect id="r2" fill="url(#MyGradient2)" width="100" height="100" x="200" y="50"/> + </g> + <g id="g3" stop-opacity="1" stop-color="blue"> + <animateColor id="a6" attributeName="stop-color" from="blue" to="red" dur="5" fill="freeze"/> + <animate id="a7" attributeName="stop-opacity" from="1" to="0" dur="5" fill="freeze"/> + <rect id="r3" fill="url(#MyGradient3)" width="100" height="100" x="50" y="200"/> + </g> + <g id="g4" color="blue"> + <animateColor id="a7" attributeName="color" from="blue" to="red" dur="5" fill="freeze"/> + <rect id="r4" fill="url(#MyGradient4)" width="100" height="100" x="200" y="200"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-script-elem-01-b-manual.svg b/testing/web-platform/tests/svg/import/animate-script-elem-01-b-manual.svg new file mode 100644 index 000000000..c6da8c51b --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-script-elem-01-b-manual.svg @@ -0,0 +1,90 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="CL" author="CM" status="accepted" + version="$Revision: 1.1 $" testname="$RCSfile: animate-script-elem-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/script.html#ScriptElement"> + <p> + This tests that the 'xlink:href' attribute on the 'script' element is not animatable. + </p> + <p> + After loading the test and waiting one second, two rectangles + will appear, indicating the result of two sub-tests. The + upper rectangle reflects the result of testing that an + attempt to animate 'xlink:href' on 'script' does not affect + the .href.animVal of the element. The lower rectangle reflects + the result of testing that the animation attempt does not + cause a new script to be loaded and executed. Black indicates + that the sub-test did not run, red that it failed and green + that it passed. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if both rectangles are green once they + appear one second after loading the test. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-script-elem-01-b.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text x='10' y='30'>Test that <script xlink:href=""> is not animatable</text> + + <g> + <rect id='r1' x='10' y='50' width='30' height='30' fill='black'/> + <rect id='r2' x='10' y='90' width='30' height='30' fill='green'/> + <g font-size='15'> + <text x='50' y='70'>Test script.href.animVal does not change</text> + <text x='50' y='110'>Test animating xlink:href="" does not load a script</text> + </g> + + <script id='s' xlink:href='../images/empty.js'/> + <script> + function f() { + document.getElementById('r2').setAttribute('fill', 'red'); + } + + function g() { + document.getElementById('r1').setAttribute('fill', document.getElementById('s').href.animVal.indexOf('empty') >= 0 ? 'green' : 'red'); + } + </script> + <set xlink:href='#s' attributeName='xlink:href' to='../images/f.js' dur='100s'/> + <set attributeName='visibility' to='hidden' dur='1s' onend='g()'/> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.1 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/animate-struct-dom-01-b-manual.svg b/testing/web-platform/tests/svg/import/animate-struct-dom-01-b-manual.svg new file mode 100644 index 000000000..3181b620f --- /dev/null +++ b/testing/web-platform/tests/svg/import/animate-struct-dom-01-b-manual.svg @@ -0,0 +1,93 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="CL" author="CM" status="accepted" + version="$Revision: 1.2 $" testname="$RCSfile: animate-struct-dom-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#InterfaceSVGSVGElement"> + <p> + This tests that calling SVGSVGElement.getCurrentTime() before the + document timeline has begun returns 0, and that + calling SVGSVGElement.setCurrentTime() before the document timeline + has begun will queue a seek to that time once the timeline + does begin. + After loading the test, two rectangles will be shown. + The left rectangle indicates whether SVGSVGElement.getCurrentTime() + correctly returned 0 before the document timeline had begun. + The right rectangles indicates whether a call to + SVGSVGElement.setCurrentTime() was acted upon once the timeline + did begin. For each rectangle, red indicates that the sub-test + failed and green indicates that the sub-test passed. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if both rectangles are green. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: animate-struct-dom-01-b.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text x='10' y='30'>Test getCurrentTime() and setCurrentTime() before timeline begin</text> + <rect id='r' x='10' y='50' width='50' height='50' fill='red'/> + <rect x='210' y='50' width='50' height='50' fill='red'> + <set attributeName='fill' to='green' begin='36000'/> <!-- 10h --> + <set attributeName='fill' to='red' begin='72000'/> <!-- 20h --> + </rect> + + <g font-size='15'> + <text x='10' y='120'>getCurrentTime</text> + <text x='210' y='120'>setCurrentTime</text> + </g> + + <script> + try { + document.documentElement.setCurrentTime(90000); // 25h + document.documentElement.setCurrentTime(54000); // 15h + } catch (e) { + } + + try { + if (document.documentElement.getCurrentTime() == 0) { + document.getElementById('r').setAttribute('fill', 'green'); + } + } catch (e) { + } + </script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> +<!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +--> +</svg> diff --git a/testing/web-platform/tests/svg/import/color-prof-01-f-manual.svg b/testing/web-platform/tests/svg/import/color-prof-01-f-manual.svg new file mode 100644 index 000000000..7211dd0b2 --- /dev/null +++ b/testing/web-platform/tests/svg/import/color-prof-01-f-manual.svg @@ -0,0 +1,76 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Tim Thompson" status="issue" + version="$Revision: 1.9 $" testname="$RCSfile: color-prof-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/color.html#ColorProfileDescriptions"> + <p> + The purpose of this test is to determine if an application can apply ICC + color profiles to raster images. The same image is displayed twice; a color profile + is applied to one by the SVG, so that the colors change. + </p> + <!-- the issue is that SVG 1.1 does not require ICC color profile support, it is optional. + So the pass criteria are incorrect. In fact, this is untestable as the feature is purely + optional and does not correspond to a named conformance class. + Fixed in the SVG Color module. + --> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + + </p> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + If the two images (each of 9 colored squares) look identical, the test fails. + If the colours in the lower right image are more saturated, brighter versions of + those in the top left image, as shown by the reference image, the test is passed. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: color-prof-01-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <color-profile id="changeColor" name="changeColor" xlink:href="../images/changeColor.ICM"/> + </defs> + <g> + <image id="image1PNG" x="30" y="0" width="190" height="190" xlink:href="../images/colorprof.png"/> + </g> + <g> + <image color-profile="changeColor" id="image2" x="260" y="90" width="190" height="190" xlink:href="../images/colorprof.png"/> + </g> + <text font-family="Arial" font-size="12" x="250" y="20"> + Basic test of ICC profile with an image. + </text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/color-prop-01-b-manual.svg b/testing/web-platform/tests/svg/import/color-prop-01-b-manual.svg new file mode 100644 index 000000000..5b7366a3b --- /dev/null +++ b/testing/web-platform/tests/svg/import/color-prop-01-b-manual.svg @@ -0,0 +1,81 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Chris Lilley" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: color-prop-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/color.html#ColorProperty"> + <p> + This tests the 'color' property and the 'currentColor' value on fill, stroke, and stop-color properties. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + There are three subtests. The first subtest, to the top left, is passed if the circle has a green fill. The second subtest, + to the top right, is passed if the circle has a green stroke. The third subtest shows a rectangle + with a gradient fill, which has three stops. The subtest is passed if central stop is green, + fading off to blue to the left and pale yellow to the right. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: color-prop-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <linearGradient id="grad" color="green"> + <stop offset="5%" stop-color="#60F"/> + <stop offset="50%" stop-color="currentColor"/> + <stop offset="95%" stop-color="#FF6"/> + </linearGradient> + </defs> + <g color="green"> + <g color="inherit" fill="none" stroke="none"> + <!-- inherit to check the property value, not the string, is being used --> + <circle cx="130" cy="80" r="60" fill="currentColor"/> + <circle cx="350" cy="80" r="60" stroke="currentColor" stroke-width="4"/> + </g> + </g> + <g color="blue"> + <g color="inherit" fill="none" stroke="none"> + <!-- blue color used to check color being scoped and inherited correctly --> + <rect x="60" y="215" width="360" height="80" fill="url(#grad)"/> + </g> + </g> + <g font-size="30" fill="black"> + <text x="120" y="170">fill</text> + <text x="310" y="170">stroke</text> + <text x="180" y="205">stop-color</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/color-prop-02-f-manual.svg b/testing/web-platform/tests/svg/import/color-prop-02-f-manual.svg new file mode 100644 index 000000000..3fcc04d56 --- /dev/null +++ b/testing/web-platform/tests/svg/import/color-prop-02-f-manual.svg @@ -0,0 +1,113 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Chris Lilley" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: color-prop-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/color.html#ColorProperty"> + <p> + Tests if the color datatype is supported. There are multiple syntaxes for + specifying the same color, such as #37F and #3377FF. This test is focussed on the + X11 color names, which are not part of the tiny profile. + Each group of circles uses four forms - 6-digit hex, rbg() integer form, rgb() percentage form, + and named ('X11') colors. It does not use 3-digit hex, because the colors used in this test + cannot be represented in three digit form. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + For each of the nine groups of circles shown here, all circles must + be identical in color, and the same color as in the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: color-prop-02-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- groups of five colors --> + <g> + <circle cx="75" cy="40" r="20" fill="crimson"/> + <circle cx="115" cy="40" r="20" fill="#DC143C"/> + <circle cx="75" cy="80" r="20" fill="rgb(220,20,60)"/> + <circle cx="115" cy="80" r="20" fill="rgb(86.274509803921568627450980392157%,7.8431372549019607843137254901961%,23.529411764705882352941176470588%)"/> + </g> + <g> + <circle cx="200" cy="40" r="20" fill="palegreen"/> + <circle cx="240" cy="40" r="20" fill="#98FB98"/> + <circle cx="200" cy="80" r="20" fill="rgb(152, 251, 152)"/> + <circle cx="240" cy="80" r="20" fill="rgb(59.60784313725490196078431372549%,98.431372549019607843137254901961%,59.60784313725490196078431372549%)"/> + </g> + <g> + <circle cx="325" cy="40" r="20" fill="royalblue"/> + <circle cx="365" cy="40" r="20" fill="#4169E1"/> + <circle cx="325" cy="80" r="20" fill="rgb(65, 105, 225)"/> + <circle cx="365" cy="80" r="20" fill="rgb(25.490196078431372549019607843137%,41.176470588235294117647058823529%,88.235294117647058823529411764706%)"/> + </g> + <g> + <circle cx="75" cy="135" r="20" fill="firebrick"/> + <circle cx="115" cy="135" r="20" fill="#B22222"/> + <circle cx="75" cy="175" r="20" fill="rgb(178,34,34)"/> + <circle cx="115" cy="175" r="20" fill="rgb(69.803921568627450980392156862745%,13.333333333333333333333333333333%,13.333333333333333333333333333333%)"/> + </g> + <g> + <circle cx="200" cy="135" r="20" fill="seagreen"/> + <circle cx="240" cy="135" r="20" fill="#2E8B57"/> + <circle cx="200" cy="175" r="20" fill="rgb(46, 139, 87)"/> + <circle cx="240" cy="175" r="20" fill="rgb(18.039215686274509803921568627451%,54.509803921568627450980392156863%,34.117647058823529411764705882353%)"/> + </g> + <g> + <circle cx="325" cy="135" r="20" fill="mediumblue"/> + <circle cx="365" cy="135" r="20" fill="#0000CD"/> + <circle cx="325" cy="175" r="20" fill="rgb(0, 0, 205)"/> + <circle cx="365" cy="175" r="20" fill="rgb(0%,0%,80.39215686274509803921568627451%)"/> + </g> + <g> + <circle cx="75" cy="230" r="20" fill="indianred"/> + <circle cx="115" cy="230" r="20" fill="#CD5C5C"/> + <circle cx="75" cy="270" r="20" fill="rgb(205, 92, 92)"/> + <circle cx="115" cy="270" r="20" fill="rgb(80.39215686274509803921568627451%,36.078431372549019607843137254902%,36.078431372549019607843137254902%)"/> + </g> + <g> + <circle cx="200" cy="230" r="20" fill="lawngreen"/> + <circle cx="240" cy="230" r="20" fill="#7CFC00"/> + <circle cx="200" cy="270" r="20" fill="rgb(124, 252, 0)"/> + <circle cx="240" cy="270" r="20" fill="rgb(48.627450980392156862745098039216%,98.823529411764705882352941176471%,0%)"/> + </g> + <g> + <circle cx="325" cy="230" r="20" fill="mediumturquoise"/> + <circle cx="365" cy="230" r="20" fill="#48D1CC"/> + <circle cx="325" cy="270" r="20" fill="rgb(72, 209, 204)"/> + <circle cx="365" cy="270" r="20" fill="rgb(28.235294117647058823529411764706%,81.960784313725490196078431372549%,80%)"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/color-prop-03-t-manual.svg b/testing/web-platform/tests/svg/import/color-prop-03-t-manual.svg new file mode 100644 index 000000000..466542ef8 --- /dev/null +++ b/testing/web-platform/tests/svg/import/color-prop-03-t-manual.svg @@ -0,0 +1,109 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Chris Lilley" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: color-prop-03-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/color.html#ColorProperty"> + <p> + Tests if the color datatype is supported. There are multiple syntaxes for + specifying the same color, such as #37F and #3377FF. +For each of the six groups shown here, + each of the circles in the group uses one of the syntactical forms + </p> + <p> + The first row uses five forms - 3-digit hex, 6-digit hex, rbg() integer form, rgb() percentage form, + and the 'HTML' subset of the name ('X11') colors. + </p> + <p> + The second row uses only four forms - 3-digit hex, 6-digit hex, rbg() integer form, rgb() percentage form - + as there are no HTML or X11 names for those colors. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + For each of the six groups of circles shown here, all circles must + be identical in color, and the same color as in the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: color-prop-03-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- groups of five colors --> + <g> + <circle cx="75" cy="40" r="20" fill="#f00"/> + <circle cx="115" cy="40" r="20" fill="#ff0000"/> + <circle cx="75" cy="80" r="20" fill="rgb(255,0,0)"/> + <circle cx="115" cy="80" r="20" fill="rgb(100%,0%,0%)"/> + <polygon points="95,40 115,60 95,80 75,60" fill="red"/> + </g> + <g> + <circle cx="200" cy="40" r="20" fill="#0f0"/> + <circle cx="240" cy="40" r="20" fill="#00ff00"/> + <circle cx="200" cy="80" r="20" fill="rgb(0,255,0)"/> + <circle cx="240" cy="80" r="20" fill="rgb(0%,100%,0%)"/> + <!-- 'lime' (full intensity green) NOT 'green' (half intensity green) --> + <polygon points="220,40 240,60 220,80 200,60" fill="lime"/> + </g> + <g> + <circle cx="325" cy="40" r="20" fill="#00f"/> + <circle cx="365" cy="40" r="20" fill="#0000ff"/> + <circle cx="325" cy="80" r="20" fill="rgb(0,0,255)"/> + <circle cx="365" cy="80" r="20" fill="rgb(0%,0%,100%)"/> + <polygon points="345,40 365,60 345,80 325,60" fill="blue"/> + </g> + <!-- no names for three digit colors except for 00 and ff --> + <!-- 11=17 22=34 33=51 44=68 55=85 66=102 77=119 + 88=136 99=153 aa=170 bb=187 cc=204 dd=221 ee=238 --> + <g> + <circle cx="75" cy="135" r="20" fill="#a01"/> + <circle cx="115" cy="135" r="20" fill="#aa0011"/> + <circle cx="75" cy="175" r="20" fill="rgb(170,0,17)"/> + <circle cx="115" cy="175" r="20" fill="rgb(66.667%,0%,6.667%)"/> + </g> + <g> + <circle cx="200" cy="135" r="20" fill="#3b3"/> + <circle cx="240" cy="135" r="20" fill="#33bb33"/> + <circle cx="200" cy="175" r="20" fill="rgb(51,187,51)"/> + <circle cx="240" cy="175" r="20" fill="rgb(20%,73.333%,20%)"/> + </g> + <g> + <circle cx="325" cy="135" r="20" fill="#57e"/> + <circle cx="365" cy="135" r="20" fill="#5577ee"/> + <circle cx="325" cy="175" r="20" fill="rgb(85,119,238)"/> + <circle cx="365" cy="175" r="20" fill="rgb(33.333%,46.666%,93.333%)"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/color-prop-04-t-manual.svg b/testing/web-platform/tests/svg/import/color-prop-04-t-manual.svg new file mode 100644 index 000000000..e481fc992 --- /dev/null +++ b/testing/web-platform/tests/svg/import/color-prop-04-t-manual.svg @@ -0,0 +1,96 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="CL" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: color-prop-04-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/color.html#ColorProperty"> + <p> + This tests the 'system' colors. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + This test has no specific pass criteria, except that no error must be indicated. + </p> + <p> + The colors on your screen might not match the reference + image at all, but they should at minimum be legible and should + preferably resemble the colors used on menus and other user interface + elements on your computer, pda or phone. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: color-prop-04-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g id="Scene_1" transform="translate(240, 180)"> + <rect x="-230" y="-170" width="460" height="300" fill="Background"/> + <rect x="-220" y="-160" width="440" height="280" fill="AppWorkspace"/> + <rect x="-152" y="-108" width="317" height="221" fill="Window"/> + <rect x="-152" y="-108" width="317" height="221" fill="none" stroke-width="3" stroke="WindowFrame"/> + <g id="contents" font-size="12" fill="WindowText"> + <text x="-148" y="0">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. </text> + <text x="-148" y="20">Vestibulum pulvinar. Duis laoreet, nunc vitae facilisis </text> + <text x="-148" y="40">tristique, pede sem iaculis mi, non consectetuer lorem </text> + <text x="-148" y="60">libero et est. Donec imperdiet purus sed odio. Duis </text> + <text x="-148" y="80">venenatis tortor eu lectus. Suspendisse sed metus at </text> + <text x="-148" y="100">metus viverra ultricies. Mauris porttitor, justo a vulputate</text> + </g> + <g id="dropdown" transform="translate(2,0)"> + <rect x="-150" y="-107" width="118" height="190" fill="ThreeDFace" id="drop-bg"/> + <rect x="-143" y="0" width="102" height="34" fill="Menu"/> + <text x="-138" y="24" font-size="20" font-weight="bold" fill="MenuText">Load</text> + <rect x="-143" y="40" width="102" height="34" fill="Menu"/> + <text x="-138" y="64" font-size="20" font-weight="bold" fill="MenuText">Save</text> + <path d="M-149 83 h114 v-94" stroke-width="4" stroke="ThreeDDarkShadow" fill="none"/> + <path d="M-149 83 v-94 h114" stroke-width="4" stroke="ThreeDLightShadow" fill="none"/> + </g> + <g id="menubar"> + <rect x="-148" y="-62" width="310" height="46" fill="ThreeDLightShadow"/> + <path d="M152 -52 l 10 -10 v 46 h -311 l10-10 z" fill="ThreeDDarkShadow"/> + <rect x="-144" y="-58" width="302" height="37" fill="ThreeDFace"/> + <text x="-141" y="-32" font-size="20" font-weight="bold" fill="HighlightText">File</text> + <text x="-90" y="-32" font-size="20" font-weight="bold" fill="MenuText">Edit</text> + </g> + <g id="windowdecoration"> + <rect x="-149" y="-106" width="311" height="42" fill="ActiveCaption" stroke-width="4" stroke="ActiveBorder" id="windowbar"/> + <text x="5" y="-78" text-anchor="middle" font-size="24" font-weight="bold" fill="CaptionText">Lorem</text> + <g id="button"> + <rect x="120" y="-99" rx="8" width="26" height="26" fill="ButtonFace"/> + <rect x="120" y="-99" rx="8" width="24" height="24" fill="ButtonHighlight"/> + <rect x="122" y="-97" rx="8" width="24" height="24" fill="ButtonShadow"/> + <rect x="122" y="-97" rx="8" width="22" height="22" fill="ButtonFace"/> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/color-prop-05-t-manual.svg b/testing/web-platform/tests/svg/import/color-prop-05-t-manual.svg new file mode 100644 index 000000000..466dcda5f --- /dev/null +++ b/testing/web-platform/tests/svg/import/color-prop-05-t-manual.svg @@ -0,0 +1,60 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="CN" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: color-prop-05-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/color.html#ColorProperty"> + <p> + Tests the color that is used for the currentColor value in the fill + attribute when more than one color is specified. + </p> + <p> + This is illustrated using a single rectangle that is a child of a group + element. A fill is specified for the group element but not the + rectangle. Colour is specifed for the rectangle and the group element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the user agent renders the rectangle with a green + fill. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: color-prop-05-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g fill="currentColor" color="lime"> + <rect x="120" y="60" width="150" height="150" color="red"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/conform-viewers-02-f-manual.svg b/testing/web-platform/tests/svg/import/conform-viewers-02-f-manual.svg new file mode 100644 index 000000000..53e570e77 --- /dev/null +++ b/testing/web-platform/tests/svg/import/conform-viewers-02-f-manual.svg @@ -0,0 +1,79 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="ED" status="issue" + version="$Revision: 1.6 $" testname="$RCSfile: conform-viewers-02-f.svg,v $"> + <!-- + XXX The issue with this test is that data: URIs shouldn't contain + gzipped content, since there's no way to identify the + content encoding in data: URIs. See: + * http://www.w3.org/mid/20101217190531.GB31176@wok.mcc.id.au + * http://www.w3.org/mid/1801756505.20110119200752@w3.org + --> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/conform.html#ConformingSVGViewers"> + <p> + Test that the viewer can read gzipped content in data uri. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Open the test in any SVG player. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if you see a star in the middle of the test frame. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: conform-viewers-02-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x="240" y="40" text-anchor="middle">Test data uri with svgz content</text> + + <text fill="black" x="50%" y="200" text-anchor="middle">FAILED</text> + <image xlink:href="data:image/svg+xml;base64,H4sICA/BlksCA3N0YXIuc3ZnAMVUwW7bMAw9d8D+QVAvLeDIkiha0mDn0A7oZcMO +Wz/Aa+zUgGsHttq0+/pRTtwkwLBuwIAhcPRIihT5RCofn9bsqam2V/1zwSWTTGfT +x9nzQ9uNBb8PYfMhTbfbrdiC6Id1qqWUKfnx5ft3jOWrqh4nRLhu2lANrFkV/Hv7 +OPC9Plqqm/JxHJuyuyIDG8PqY/XUlKHpu4IrkfF0jpHugsxi23RVOdwM5aqpujCF +bteKs/Ve820ou7Huh4eCP5RhaJ4vQKDJtLOQSPodpIWzVmgrHUGPWhhvrLmkQlXB +wdM+q4zh7CWKTgqtPABZdRRRAJmRrCQaBULazLhDFrddE4isx7Eavm7Ku+pLdztW +fDlXP4Z+w+Lf4q5v+6Hg53Vd852mp/1NeCH2BQXs63qsAgmvhPyx+8FZTc5nZ3l6 +yt7MaRTL9oTTIXJKkUELjd4hvFXbby5gIYWVkkh3iRaZMtZpopw4M2i0NQnZncqk +8okymROgVZYstEbhNRpPN3JHvQgS6AqM9iRSdaA0OTnLWX1qrI+NO8LPfkmY/Aty +5Rvk7jv1lMfdOKSv85CvWThwM8G2DNXFAoynZqNuJFKoJS1ljpfzrOSbMtwfO77V +1YhOKGk8Rct8JjJEE7ua7vQzAyIeaKA/Me19AggRUf+D1RPSCRgXEZIV3KyDycOZ +BCTOvjoi0KRTPiJFScCE9mf8oLuYJpdaZWgvzuMDcHkY639UFh3R7g+glv0/dZ7W +dJRRe8jIoErAWfIzBhN6aCJSNjEO2TXpdGK8ZsYqWpGh3K3XDGkqJg1ktBqGGHcq +8kZPeyBmh5IiYhYj7k+Zc8rTNa15fJ2XPwFubI+E2wUAAA==" width="200" height="200" x="130" y="70"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg> diff --git a/testing/web-platform/tests/svg/import/conform-viewers-03-f-manual.svg b/testing/web-platform/tests/svg/import/conform-viewers-03-f-manual.svg new file mode 100644 index 000000000..4cfb4e7ca --- /dev/null +++ b/testing/web-platform/tests/svg/import/conform-viewers-03-f-manual.svg @@ -0,0 +1,123 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" onload="test()"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="DS" author="ED" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: conform-viewers-03-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/conform.html#ConformingSVGViewers"> + <p> + This test checks that namespace prefixes are handled correctly. + </p> + <p> + First, a random 20-character string is generated. The string only contains characters that are valid NCName letters. + This string is then used as a custom prefix for an 'href' attribute in the XLink namespace. + An 'image' element is created and two image references are added, one is in the "http://www.this.is.not.an/xlink" namespace, + and one is in the XLink namespace. Only the attribute with the 20-character prefix is actually in the XLink namespace, + which means that that link should be the one that is used when rendering the 'image' element. This first subtest is + using the setAttributeNS method. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The testcase has passed if after the script execution has taken place these conditions are met: + </p> + <ul> + <li>There is one pink image visible.</li> + <li>The image doesn't show the word "Fail"</li> + <li>The status message says "No exceptions"</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: conform-viewers-03-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <script> + <![CDATA[ + /** + * Generates a 20 character string consisting of characters from the inchars parameter. + * The output string will have no repetitions of a character. + */ + function generatePrefix(inchars) + { + var ncNameStart = "_abcdefghijklmnopqrstuvwxyzåäöQWERTYUIOPÅÄÖLKJHGFDSAZXCVBNM"; + + var prefix = ncNameStart[Math.floor(Math.random()*ncNameStart.length)]; + var leftchars = inchars; + var char; + for(var i = 0; i < 19; i++) + { + char = leftchars[Math.floor(Math.random()*leftchars.length)]; + leftchars = leftchars.replace(char, ''); + prefix += char; + } + return prefix; + } + + /** + * The main body of the test. + */ + function test() + { + var letters = "abcdefghijklmnopqrstuvwxyzåäö_-.QWERTYUIOPÅÄÖLKJHGFDSAZXCVBNM0123456789"; + var prefix = generatePrefix(letters); + var g = document.getElementById("test-body-content"); + var t = document.getElementById("prefix"); + t.textContent = prefix; + + var elm = document.createElementNS("http://www.w3.org/2000/svg", "image"); + elm.setAttributeNS(null, "width", 100); + elm.setAttributeNS(null, "height", 100); + elm.setAttributeNS(null, "x", 100); + elm.setAttributeNS(null, "y", 100); + elm.setAttributeNS("http://www.w3.org/1999/xlink", prefix+":href", "../images/pinksquidj.png"); + elm.setAttributeNS("http://www.this.is.not.an/xlink", "xlink:href", "../images/purplesquidj.png"); + g.appendChild(elm); + } + ]]> + </script> + + <text y="100" x="50" display="none"> + Generated prefix 1: <tspan id="prefix">...</tspan> + </text> + <text y="220" x="50"> + Status: <tspan id="status">No exceptions.</tspan> + </text> + + <g xmlns:xlink="http://example.net/bar"> + <image id="image2" width="100" height="100" x="210" y="100" xlink:href="../images/purplesquidj.png"/> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> --> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-coord-01-t-manual.svg b/testing/web-platform/tests/svg/import/coords-coord-01-t-manual.svg new file mode 100644 index 000000000..0019667ca --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-coord-01-t-manual.svg @@ -0,0 +1,83 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="DJ" author="CN" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: coords-coord-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#InitialCoordinateSystem"> + <p> + Tests the default initial coordinate system used by renderer. + </p> + <p>Should be 0,0 if not specified. This is illustrated by comparing blue boxes that are + missing a coordinate or all coordinates with yellow boxes that have the + correct coordinates specified. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there are three blue boxes, + with small yellow boxes rendered on top of them. These boxes should be + placed along the origin, and x and y axis. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-coord-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <!-- Content of Test Case follows. --> + + <g stroke="black" stroke-width="5"> + + <line x1="0" y1="0" x2="150" y2="0"/> + + <line x1="0" y1="0" x2="0" y2="150"/> + </g> + + <g fill="blue"> + <rect width="15" height="15"/> + + <rect x="150" width="15" height="15"/> + + <rect y="150" width="15" height="15"/> + </g> + + <g fill="yellow"> + <rect x="0" y="0" width="10" height="10"/> + + <rect x="150" y="0" width="10" height="10"/> + + <rect x="0" y="150" width="10" height="10"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-coord-02-t-manual.svg b/testing/web-platform/tests/svg/import/coords-coord-02-t-manual.svg new file mode 100644 index 000000000..a6b0a55c5 --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-coord-02-t-manual.svg @@ -0,0 +1,82 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="DJ" author="CN" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: coords-coord-02-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#InitialCoordinateSystem"> + <p> + Tests the default units used for the initial coordinate system. This is + illustrated by comparing blue boxes that have no units specified for their + coordinates, with yellow boxes that have px units specified for their + coordinates. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + This test should produce three blue boxes, with small yellow + boxes rendered on top of them. These boxes should be placed along the + origin, x and y axis. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-coord-02-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <!-- Content of Test Case follows. --> + + <g stroke="black" stroke-width="5"> + + <line x1="0px" y1="0px" x2="150px" y2="0px"/> + + <line x1="0px" y1="0px" x2="0px" y2="150px"/> + </g> + + <g fill="blue"> + <rect x="0" y="0" width="15" height="15"/> + + <rect x="150" y="0" width="15" height="15"/> + + <rect x="0" y="150" width="15" height="15"/> + </g> + + <g fill="yellow"> + <rect x="0px" y="0px" width="10" height="10"/> + + <rect x="150px" y="0px" width="10" height="10"/> + + <rect x="0px" y="150px" width="10" height="10"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-dom-01-f-manual.svg b/testing/web-platform/tests/svg/import/coords-dom-01-f-manual.svg new file mode 100644 index 000000000..c254ae7a2 --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-dom-01-f-manual.svg @@ -0,0 +1,115 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="ED" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: coords-dom-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#DOMInterfaces"> + <p> + Tests the liveness of SVGTransform.matrix. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Load the svg, you should see a green circle. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if: + </p> + <ul> + <li>There is no red visible</li> + <li>There is a green circle visible</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-dom-01-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + + <g transform="translate(240 180)"> + <g id="reference"> + <circle r="40" fill="red"/> + </g> + + <g id="g" transform="translate(20 20)"> + <circle id="c" r="41" fill="blue"/> + </g> + </g> + + <script type="text/ecmascript"><![CDATA[ + var eps = 1 / 65535; // 16.16 fixpoint epsilon + var passed = false; + + function isequal( value, expected, epsilon ) + { + return(Math.abs(value - expected) < epsilon); + } + + try + { + var g = document.getElementById("g"); + var c = document.getElementById("c"); + var tfm = g.transform.baseVal.getItem(0); + var mtx = tfm.matrix; + tfm.setTranslate(300,200); + if(tfm.type == SVGTransform.SVG_TRANSFORM_TRANSLATE && + isequal(mtx.e, 300, eps) && isequal(mtx.f, 200, eps)) + { + tfm.setScale(4,4); + if(tfm.type == SVGTransform.SVG_TRANSFORM_SCALE && + isequal(mtx.a, 4, eps) && isequal(mtx.d, 4, eps)) + { + tfm.setRotate(90,0,0); + if(tfm.type == SVGTransform.SVG_TRANSFORM_ROTATE && + isequal(mtx.a, Math.cos(Math.PI/2), eps) && isequal(mtx.b, Math.sin(Math.PI/2), eps) && + isequal(mtx.c, -Math.sin(Math.PI/2), eps) && isequal(mtx.d, Math.cos(Math.PI/2), eps) && + isequal(mtx.e, 0, eps) && isequal(mtx.f, 0, eps)) + { + passed = true; + } + } + } + } + catch(e) {} + + if(passed) + { + c.setAttribute("fill", "lime"); + } + else + { + c.setAttribute("fill", "red"); + } + ]]></script> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.8 $</text> + </g> + <rect xml:id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-dom-02-f-manual.svg b/testing/web-platform/tests/svg/import/coords-dom-02-f-manual.svg new file mode 100644 index 000000000..42cac3b3f --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-dom-02-f-manual.svg @@ -0,0 +1,96 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="ED" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: coords-dom-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#InterfaceSVGTransform"> + <p> + Tests the liveness of SVGTransform.matrix, that the SVGTransform object is updated when the SVGTransform.matrix object is changed. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if: + </p> + <ul> + <li>There is no red visible</li> + <li>There is a green ellipse visible</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-dom-02-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + + <g transform="translate(220 160)"> + <g id="reference"> + <circle r="41" fill="red" transform="translate(20 20) scale(2 1)"/> + </g> + + <g id="g" transform="translate(20 20)"> + <circle id="c" r="41" fill="blue"/> + </g> + </g> + + <script type="text/ecmascript"><![CDATA[ + var passed = false; + + try + { + var g = document.getElementById("g"); + var c = document.getElementById("c"); + var tfm = g.transform.baseVal.getItem(0); + var mtx = tfm.matrix; + mtx.a = 2; + if(tfm.type == SVGTransform.SVG_TRANSFORM_MATRIX) + { + passed = true; + } + } + catch(e) {} + + if(passed) + { + c.setAttribute("fill", "lime"); + } + else + { + c.setAttribute("fill", "red"); + } + ]]></script> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.9 $</text> + </g> + <rect xml:id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-dom-03-f-manual.svg b/testing/web-platform/tests/svg/import/coords-dom-03-f-manual.svg new file mode 100644 index 000000000..b44d16c6b --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-dom-03-f-manual.svg @@ -0,0 +1,116 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="ED" author="CM" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: coords-dom-03-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#InterfaceSVGTransformList"> + <p> + This tests that SVGTransformList.createSVGTransformFromMatrix(), + SVGSVGElement.createSVGTransformFromMatrix() and SVGTransform.setMatrix() + all do not track changes to the SVGMatrix passed to them. + </p> + <p> + After loading the test, three rectangles will be presented. The + upper rectangle indicates the result of testing whether + SVGTransformList.createSVGTransformFromMatrix() behaved correctly, + the middle rectangle indicates the status for SVGSVGElement.createSVGTransformFromMatrix(), + and the bottom rectangle for SVGTransform.setMatrix(). + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the three rectangles are green. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-dom-03-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text x='10' y='30' font-size='14'>Test that some methods taking an SVGMatrix take a copy of it</text> + + <rect id='r1' x='10' y='50' width='50' height='50'/> + <rect id='r2' x='10' y='110' width='50' height='50'/> + <rect id='r3' x='10' y='170' width='50' height='50'/> + <g font-size='10'> + <text x='70' y='80'>SVGTransformList.createSVGTransformFromMatrix()</text> + <text x='70' y='140'>SVGSVGElement.createSVGTransformFromMatrix()</text> + <text x='70' y='200'>SVGTransform.setMatrix()</text> + </g> + + <g id='g' transform='scale(5)'/> + + <script><![CDATA[ + var svg = document.documentElement, + g = document.getElementById('g'), + r1 = document.getElementById('r1'), + r2 = document.getElementById('r2'), + r3 = document.getElementById('r3'); + + var m1 = svg.createSVGMatrix(), + m2 = svg.createSVGMatrix(), + m3 = svg.createSVGMatrix(); + + var t; + + m1.a = 3; m1.b = 0; m1.c = 0; m1.d = 1; m1.e = 0; m1.f = 0; + m2.a = 3; m2.b = 0; m2.c = 0; m2.d = 1; m2.e = 0; m2.f = 0; + m3.a = 3; m3.b = 0; m3.c = 0; m3.d = 1; m3.e = 0; m3.f = 0; + + try { + t = g.transform.baseVal.createSVGTransformFromMatrix(m1); + m1.a = 2; + r1.setAttribute('fill', t.matrix != m1 && t.matrix.a == 3 ? 'lime' : 'red'); + } catch (e) { + } + + try { + t = svg.createSVGTransformFromMatrix(m2); + m2.a = 2; + r2.setAttribute('fill', t.matrix != m2 && t.matrix.a == 3 ? 'lime' : 'red'); + } catch (e) { + } + + try { + t = g.transform.baseVal.getItem(0); + t.setMatrix(m3); + m3.a = 2; + r3.setAttribute('fill', t.matrix != m3 && t.matrix.a == 3 ? 'lime' : 'red'); + } catch (e) { + } + ]]></script> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-dom-04-f-manual.svg b/testing/web-platform/tests/svg/import/coords-dom-04-f-manual.svg new file mode 100644 index 000000000..9e620bc68 --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-dom-04-f-manual.svg @@ -0,0 +1,166 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" onload="test()"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="ED" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: coords-dom-04-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#InterfaceSVGTransformList"> + <p> + The test checks the SVGTransformList.consolidate method. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + There must be 13 green rectangles visible. + The text next to the first rectangle must say "Scripting enabled". + The other 12 lines must each say "Passed subtest #n" where n is the subtest number 1..12. + If anything red shows, the test has failed. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-dom-04-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <style> + #test-body-content rect { stroke: black; } + </style> + <script type="text/ecmascript"><![CDATA[ + var pos = { "x": 20, "y": 40 }; + var subtestCounter = 1; + var passed = true; + + function toString(m) + { + var decimals = 0; + return m.a.toFixed(decimals) + "," + + m.b.toFixed(decimals) + "," + + m.c.toFixed(decimals) + "," + + m.d.toFixed(decimals) + "," + + m.e.toFixed(decimals) + "," + + m.f.toFixed(decimals); + } + + function referenceEqual(m1,ref,eps) + { + return (Math.abs(m1.a-ref[0]) < eps && + Math.abs(m1.b-ref[1]) < eps && + Math.abs(m1.c-ref[2]) < eps && + Math.abs(m1.d-ref[3]) < eps && + Math.abs(m1.e-ref[4]) < eps && + Math.abs(m1.f-ref[5]) < eps); + } + + function assertEquals(m, ref, eps) + { + var result = document.createElementNS("http://www.w3.org/2000/svg", "text"); + var resultrect = document.createElementNS("http://www.w3.org/2000/svg", "rect"); + result.setAttribute("x", pos.x); + result.setAttribute("y", pos.y); + resultrect.setAttribute("fill", "lime"); + resultrect.setAttribute("width", 15); + resultrect.setAttribute("height", 15); + resultrect.setAttribute("y", pos.y-15); + + if(referenceEqual(m, ref, eps)) + { + result.textContent = "Passed subtest #" + subtestCounter; + } + else + { + passed = false; + result.textContent = "Failed subtest #" + subtestCounter + ". Expected " + ref + " but got " + toString(m); + } + pos.y += 20; + subtestCounter++; + var results = document.getElementById("subteststatus"); + results.appendChild(resultrect) + results.appendChild(result); + } + + function test() + { + eps = 0.005; // "close enough" + r = document.getElementById("r"); + + t1 = r.transform.baseVal.getItem(0); + t2 = r.transform.baseVal.getItem(1); + + // check that matrices are as specified in the markup + assertEquals(t1.matrix, [1, 0, 0, 1, 10, 10], eps); + assertEquals(t2.matrix, [0, 1, -1, 0, 0, 0], eps); + + // consolidate + tfm = r.transform.baseVal.consolidate(); + + // check that the consolidation is ok + assertEquals(tfm.matrix, [0, 1, -1, 0, 10, 10], eps); + + // check that t1 and t2 were not affected by the consolidation + assertEquals(t1.matrix, [1, 0, 0, 1, 10, 10], eps); + assertEquals(t2.matrix, [0, 1, -1, 0, 0, 0], eps); + + // check that modifying t1 has no effect on the consolidated transform + t1.setTranslate(10,200); + assertEquals(t1.matrix, [1, 0, 0, 1, 10, 200], eps); + assertEquals(tfm.matrix, [0, 1, -1, 0, 10, 10], eps); + + // check that modifying t2 has no effect on the consolidated transform + t2.setRotate(-90, 0, 0); + assertEquals(t2.matrix, [0, -1, 1, 0, 0, 0], eps); + assertEquals(tfm.matrix, [0, 1, -1, 0, 10, 10], eps); + + // check that modifying the consolidated transform has no effect on the t1 and t2 transforms + tfm.matrix.f = 400; + assertEquals(tfm.matrix, [0, 1, -1, 0, 10, 400], eps); + assertEquals(t1.matrix, [1, 0, 0, 1, 10, 200], eps); + assertEquals(t2.matrix, [0, -1, 1, 0, 0, 0], eps); + + document.getElementById("status").setAttributeNS(null, "fill", passed ? "lime" : "red"); + document.getElementById("scriptstatus").textContent = "Scripting enabled"; + } + + ]]></script> + </defs> + + <g transform="translate(20 -10)"> + <g id="subteststatus" transform="translate(0,40)"> + <rect id="status" y="5" width="15" height="15" fill="red"/> + <text id="scriptstatus" y="20" x="20" >Scripting disabled</text> + </g> + + <polyline id="r" fill="none" stroke="green" display="none" transform="translate(10 10) rotate(90)" points="0 0 30 40 80 -20" stroke-width="10"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-trans-01-b-manual.svg b/testing/web-platform/tests/svg/import/coords-trans-01-b-manual.svg new file mode 100644 index 000000000..19431e0fe --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-trans-01-b-manual.svg @@ -0,0 +1,239 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: coords-trans-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#EstablishingANewUserSpace"> + <p> + This test verifies the implementation of transforms. It tests elementary transforms + and transform nesting. + Note that for layout purposes, this test uses nesting of translation with the elementary transforms. + </p> + <p> + The test uses the rect element, the fill color (solid primary colors) and transforms. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image exactly except for variations in the labeling text. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-trans-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="translate(0, 30)" font-size="13"> + <!-- ====================================================================== --> + <!-- First, draw a test grid ============================================== --> + <!-- ====================================================================== --> + <g id="test-grid" stroke="#cccccc" stroke-width="1"> + <line x1="10" y1="10.5" x2="470" y2="10.5"/> + <line x1="10" y1="20.5" x2="470" y2="20.5"/> + <line x1="10" y1="30.5" x2="470" y2="30.5"/> + <line x1="10" y1="40.5" x2="470" y2="40.5"/> + <line x1="10" y1="50.5" x2="470" y2="50.5"/> + <line x1="10" y1="60.5" x2="470" y2="60.5"/> + <line x1="10" y1="70.5" x2="470" y2="70.5"/> + <line x1="10" y1="80.5" x2="470" y2="80.5"/> + <line x1="10" y1="90.5" x2="470" y2="90.5"/> + <line x1="10" y1="100.5" x2="470" y2="100.5"/> + <line x1="10" y1="110.5" x2="470" y2="110.5"/> + <line x1="10" y1="120.5" x2="470" y2="120.5"/> + <line x1="10" y1="130.5" x2="470" y2="130.5"/> + <line x1="10" y1="140.5" x2="470" y2="140.5"/> + <line x1="10" y1="150.5" x2="470" y2="150.5"/> + <line x1="10" y1="160.5" x2="470" y2="160.5"/> + <line x1="10" y1="170.5" x2="470" y2="170.5"/> + <line x1="10" y1="180.5" x2="470" y2="180.5"/> + <line x1="10" y1="190.5" x2="470" y2="190.5"/> + <line x1="10" y1="200.5" x2="470" y2="200.5"/> + <line x1="10" y1="210.5" x2="470" y2="210.5"/> + <line x1="10" y1="220.5" x2="470" y2="220.5"/> + <line x1="10" y1="230.5" x2="470" y2="230.5"/> + <line x1="10" y1="240.5" x2="470" y2="240.5"/> + <line x1="10" y1="250.5" x2="470" y2="250.5"/> + <line x1="10" y1="260.5" x2="470" y2="260.5"/> + <line y1="10" x1="10.5" y2="260.5" x2="10.5"/> + <line y1="10" x1="20.5" y2="260.5" x2="20.5"/> + <line y1="10" x1="30.5" y2="260.5" x2="30.5"/> + <line y1="10" x1="40.5" y2="260.5" x2="40.5"/> + <line y1="10" x1="50.5" y2="260.5" x2="50.5"/> + <line y1="10" x1="60.5" y2="260.5" x2="60.5"/> + <line y1="10" x1="70.5" y2="260.5" x2="70.5"/> + <line y1="10" x1="80.5" y2="260.5" x2="80.5"/> + <line y1="10" x1="90.5" y2="260.5" x2="90.5"/> + <line y1="10" x1="100.5" y2="260.5" x2="100.5"/> + <line y1="10" x1="110.5" y2="260.5" x2="110.5"/> + <line y1="10" x1="120.5" y2="260.5" x2="120.5"/> + <line y1="10" x1="130.5" y2="260.5" x2="130.5"/> + <line y1="10" x1="140.5" y2="260.5" x2="140.5"/> + <line y1="10" x1="150.5" y2="260.5" x2="150.5"/> + <line y1="10" x1="160.5" y2="260.5" x2="160.5"/> + <line y1="10" x1="170.5" y2="260.5" x2="170.5"/> + <line y1="10" x1="180.5" y2="260.5" x2="180.5"/> + <line y1="10" x1="190.5" y2="260.5" x2="190.5"/> + <line y1="10" x1="200.5" y2="260.5" x2="200.5"/> + <line y1="10" x1="210.5" y2="260.5" x2="210.5"/> + <line y1="10" x1="220.5" y2="260.5" x2="220.5"/> + <line y1="10" x1="230.5" y2="260.5" x2="230.5"/> + <line y1="10" x1="240.5" y2="260.5" x2="240.5"/> + <line y1="10" x1="250.5" y2="260.5" x2="250.5"/> + <line y1="10" x1="260.5" y2="260.5" x2="260.5"/> + <line y1="10" x1="270.5" y2="260.5" x2="270.5"/> + <line y1="10" x1="280.5" y2="260.5" x2="280.5"/> + <line y1="10" x1="290.5" y2="260.5" x2="290.5"/> + <line y1="10" x1="300.5" y2="260.5" x2="300.5"/> + <line y1="10" x1="310.5" y2="260.5" x2="310.5"/> + <line y1="10" x1="320.5" y2="260.5" x2="320.5"/> + <line y1="10" x1="330.5" y2="260.5" x2="330.5"/> + <line y1="10" x1="340.5" y2="260.5" x2="340.5"/> + <line y1="10" x1="350.5" y2="260.5" x2="350.5"/> + <line y1="10" x1="360.5" y2="260.5" x2="360.5"/> + <line y1="10" x1="370.5" y2="260.5" x2="370.5"/> + <line y1="10" x1="380.5" y2="260.5" x2="380.5"/> + <line y1="10" x1="390.5" y2="260.5" x2="390.5"/> + <line y1="10" x1="400.5" y2="260.5" x2="400.5"/> + <line y1="10" x1="410.5" y2="260.5" x2="410.5"/> + <line y1="10" x1="420.5" y2="260.5" x2="420.5"/> + <line y1="10" x1="430.5" y2="260.5" x2="430.5"/> + <line y1="10" x1="440.5" y2="260.5" x2="440.5"/> + <line y1="10" x1="450.5" y2="260.5" x2="450.5"/> + <line y1="10" x1="460.5" y2="260.5" x2="460.5"/> + <line y1="10" x1="470.5" y2="260.5" x2="470.5"/> + </g> + <!-- ====================================================================== --> + <!-- Now, test elementary transforms. For each transform, 3 markers are --> + <!-- placed where the user space is expected after transformations for the --> + <!-- origin (black) and the points in (20, 0) (blue) and (0, 20) (red). --> + <!-- Then, a blue line going from (0, 0) to (20, 0) is drawn and a red line --> + <!-- going from (0, 0) to (0, 20), after applying the elementary --> + <!-- transformation. If the test succeeds, the red line should join the --> + <!-- black marker to the red marker and the blue line the black marker to --> + <!-- the blue marker. --> + <!-- ====================================================================== --> + <g id="elementary-transforms-test" transform="translate(0, 10)"> + <g id="elementary-transforms"> + <!-- Translate --> + <g transform="translate(50, 50)"> + <rect x="0" y="0" width="20" height="2" fill="blue"/> + <rect x="0" y="0" width="2" height="20" fill="red"/> + </g> + <!-- Rotate -90 deg about (150, 70) --> + <g transform="translate(150, 70) rotate(-90)"> + <rect x="0" y="0" width="20" height="2" fill="blue"/> + <rect x="0" y="0" width="2" height="20" fill="red"/> + </g> + <!-- Skew X --> + <g transform="translate(250, 50) skewX(45)"> + <rect x="0" y="0" width="20" height="2" fill="blue"/> + <rect x="0" y="0" width="2" height="20" fill="red"/> + </g> + <!-- Skew Y --> + <g transform="translate(350, 50) skewY(45)"> + <rect x="0" y="0" width="20" height="2" fill="blue"/> + <rect x="0" y="0" width="2" height="20" fill="red"/> + </g> + <!-- Scale 2 --> + <g transform="translate(210, 120) scale(2)"> + <rect x="0" y="0" width="20" height="1" fill="blue"/> + <rect x="0" y="0" width="1" height="20" fill="red"/> + </g> + </g> + <!-- elementary-transforms --> + <!-- Draw all the markers --> + <g id="elementary-transforms-test-markers"> + <!-- Translate --> + <text x="40" y="40">translate (50, 50)</text> + <rect x="48" y="48" width="5" height="5" fill="black"/> + <rect x="68" y="48" width="5" height="5" fill="blue"/> + <rect x="48" y="68" width="5" height="5" fill="red"/> + <!-- Rotate -90 deg about (150, 70) --> + <text x="140" y="40">rotate(-90)</text> + <rect x="148" y="68" width="5" height="5" fill="black"/> + <rect x="148" y="48" width="5" height="5" fill="blue"/> + <rect x="168" y="68" width="5" height="5" fill="red"/> + <!-- Skew X --> + <text x="240" y="40">skew x (45)</text> + <rect x="248" y="48" width="5" height="5" fill="black"/> + <rect x="268" y="48" width="5" height="5" fill="blue"/> + <rect x="268" y="68" width="5" height="5" fill="red"/> + <!-- Skew Y --> + <text x="340" y="40">skew y (45)</text> + <rect x="348" y="48" width="5" height="5" fill="black"/> + <rect x="368" y="68" width="5" height="5" fill="blue"/> + <rect x="348" y="68" width="5" height="5" fill="red"/> + <!-- Scale 2 --> + <text x="200" y="110">scale (2)</text> + <rect x="208" y="118" width="5" height="5" fill="black"/> + <rect x="248" y="118" width="5" height="5" fill="blue"/> + <rect x="208" y="158" width="5" height="5" fill="red"/> + </g> + <!-- elementary-transforms-test-markers --> + </g> + <g id="nested-transforms-test"> + <g id="nested-transforms"> + <!-- scale/translate in transform attribute --> + <g transform="scale(3, 2) translate(16.666667, 105)"> + <rect x="0" y="0" width="20" height="1" fill="blue"/> + <rect x="0" y="0" width="0.67" height="20" fill="red"/> + </g> + <!-- scale/translate in successive elements --> + <g transform="translate(200, 0)"> + <g transform="scale(3, 2)"> + <g transform="translate(16.666667, 105)"> + <rect x="0" y="0" width="20" height="1" fill="blue"/> + <rect x="0" y="0" width="0.67" height="20" fill="red"/> + </g> + </g> + </g> + </g> + <!-- nested-transforms --> + <g id="nested-transforms-test-markers"> + <!-- scale and translate --> + <text x="40" y="200">scale(25, 95) and translate(2, 2)</text> + <rect x="48" y="208" width="5" height="5" fill="black"/> + <rect x="108" y="208" width="5" height="5" fill="blue"/> + <rect x="48" y="248" width="5" height="5" fill="red"/> + <!-- scale then translate --> + <text x="240" y="200">scale(25, 95) then translate(2, 2)</text> + <rect x="248" y="208" width="5" height="5" fill="black"/> + <rect x="308" y="208" width="5" height="5" fill="blue"/> + <rect x="248" y="248" width="5" height="5" fill="red"/> + </g> + <!-- nested-transforms-test-markers --> + </g> + <!-- nested-transforms test --> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-trans-02-t-manual.svg b/testing/web-platform/tests/svg/import/coords-trans-02-t-manual.svg new file mode 100644 index 000000000..ef3ab1a88 --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-trans-02-t-manual.svg @@ -0,0 +1,176 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: coords-trans-02-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#EstablishingANewUserSpace"> + <p> + This test verifies the implementation of transforms. It tests elementary transforms + and transform nesting. + Note that for layout purposes, this test uses nesting of translation with the elementary transforms. + </p> + <p> + The test uses the rect element, the fill color (solid primary colors) and transforms. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image exactly except for variations in the labeling text. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-trans-02-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="translate(0, 30)" font-size="12"> + <!-- ====================================================================== --> + <!-- First, draw a test grid ============================================== --> + <!-- ====================================================================== --> + <!--g id="test-grid" stroke="#cccccc" stroke-width="1" > + <line x1="10" y1="10.5" x2="470" y2="10.5"/> + <line x1="10" y1="20.5" x2="470" y2="20.5"/> + <line x1="10" y1="30.5" x2="470" y2="30.5"/> + <line x1="10" y1="40.5" x2="470" y2="40.5"/> + <line x1="10" y1="50.5" x2="470" y2="50.5"/> + <line x1="10" y1="60.5" x2="470" y2="60.5"/> + <line x1="10" y1="70.5" x2="470" y2="70.5"/> + <line x1="10" y1="80.5" x2="470" y2="80.5"/> + <line x1="10" y1="90.5" x2="470" y2="90.5"/> + <line x1="10" y1="100.5" x2="470" y2="100.5"/> + <line x1="10" y1="110.5" x2="470" y2="110.5"/> + <line x1="10" y1="120.5" x2="470" y2="120.5"/> + <line x1="10" y1="130.5" x2="470" y2="130.5"/> + <line x1="10" y1="140.5" x2="470" y2="140.5"/> + <line x1="10" y1="150.5" x2="470" y2="150.5"/> + <line x1="10" y1="160.5" x2="470" y2="160.5"/> + <line x1="10" y1="170.5" x2="470" y2="170.5"/> + <line x1="10" y1="180.5" x2="470" y2="180.5"/> + <line x1="10" y1="190.5" x2="470" y2="190.5"/> + <line x1="10" y1="200.5" x2="470" y2="200.5"/> + <line x1="10" y1="210.5" x2="470" y2="210.5"/> + <line x1="10" y1="220.5" x2="470" y2="220.5"/> + <line x1="10" y1="230.5" x2="470" y2="230.5"/> + <line x1="10" y1="240.5" x2="470" y2="240.5"/> + <line x1="10" y1="250.5" x2="470" y2="250.5"/> + <line x1="10" y1="260.5" x2="470" y2="260.5"/> + <line y1="10" x1="10.5" y2="260.5" x2="10.5"/> + <line y1="10" x1="20.5" y2="260.5" x2="20.5"/> + <line y1="10" x1="30.5" y2="260.5" x2="30.5"/> + <line y1="10" x1="40.5" y2="260.5" x2="40.5"/> + <line y1="10" x1="50.5" y2="260.5" x2="50.5"/> + <line y1="10" x1="60.5" y2="260.5" x2="60.5"/> + <line y1="10" x1="70.5" y2="260.5" x2="70.5"/> + <line y1="10" x1="80.5" y2="260.5" x2="80.5"/> + <line y1="10" x1="90.5" y2="260.5" x2="90.5"/> + <line y1="10" x1="100.5" y2="260.5" x2="100.5"/> + <line y1="10" x1="110.5" y2="260.5" x2="110.5"/> + <line y1="10" x1="120.5" y2="260.5" x2="120.5"/> + <line y1="10" x1="130.5" y2="260.5" x2="130.5"/> + <line y1="10" x1="140.5" y2="260.5" x2="140.5"/> + <line y1="10" x1="150.5" y2="260.5" x2="150.5"/> + <line y1="10" x1="160.5" y2="260.5" x2="160.5"/> + <line y1="10" x1="170.5" y2="260.5" x2="170.5"/> + <line y1="10" x1="180.5" y2="260.5" x2="180.5"/> + <line y1="10" x1="190.5" y2="260.5" x2="190.5"/> + <line y1="10" x1="200.5" y2="260.5" x2="200.5"/> + <line y1="10" x1="210.5" y2="260.5" x2="210.5"/> + <line y1="10" x1="220.5" y2="260.5" x2="220.5"/> + <line y1="10" x1="230.5" y2="260.5" x2="230.5"/> + <line y1="10" x1="240.5" y2="260.5" x2="240.5"/> + <line y1="10" x1="250.5" y2="260.5" x2="250.5"/> + <line y1="10" x1="260.5" y2="260.5" x2="260.5"/> + <line y1="10" x1="270.5" y2="260.5" x2="270.5"/> + <line y1="10" x1="280.5" y2="260.5" x2="280.5"/> + <line y1="10" x1="290.5" y2="260.5" x2="290.5"/> + <line y1="10" x1="300.5" y2="260.5" x2="300.5"/> + <line y1="10" x1="310.5" y2="260.5" x2="310.5"/> + <line y1="10" x1="320.5" y2="260.5" x2="320.5"/> + <line y1="10" x1="330.5" y2="260.5" x2="330.5"/> + <line y1="10" x1="340.5" y2="260.5" x2="340.5"/> + <line y1="10" x1="350.5" y2="260.5" x2="350.5"/> + <line y1="10" x1="360.5" y2="260.5" x2="360.5"/> + <line y1="10" x1="370.5" y2="260.5" x2="370.5"/> + <line y1="10" x1="380.5" y2="260.5" x2="380.5"/> + <line y1="10" x1="390.5" y2="260.5" x2="390.5"/> + <line y1="10" x1="400.5" y2="260.5" x2="400.5"/> + <line y1="10" x1="410.5" y2="260.5" x2="410.5"/> + <line y1="10" x1="420.5" y2="260.5" x2="420.5"/> + <line y1="10" x1="430.5" y2="260.5" x2="430.5"/> + <line y1="10" x1="440.5" y2="260.5" x2="440.5"/> + <line y1="10" x1="450.5" y2="260.5" x2="450.5"/> + <line y1="10" x1="460.5" y2="260.5" x2="460.5"/> + <line y1="10" x1="470.5" y2="260.5" x2="470.5"/> + </g--> + <!-- ====================================================================== --> + <!-- Now, test elementary transforms. For each transform, 3 markers are --> + <!-- placed where the user space is expected after transformations for the --> + <!-- origin (black) and the points in (20, 0) (blue) and (0, 20) (red). --> + <!-- Then, a blue line going from (0, 0) to (20, 0) is drawn and a red line --> + <!-- going from (0, 0) to (0, 20), after applying the elementary --> + <!-- transformation. If the test succeeds, the red line should join the --> + <!-- black marker to the red marker and the blue line the black marker to --> + <!-- the blue marker. --> + <!-- ====================================================================== --> + <g id="elementary-transforms-test" transform="translate(0, 10)"> + <g id="elementary-transforms" transform="translate(-30, 0) scale(2.5, 2.5)"> + <!-- Translate --> + <g transform="translate(50, 50)"> + <rect x="0" y="0" width="20" height="2" fill="blue"/> + <rect x="0" y="0" width="2" height="20" fill="red"/> + </g> + <!-- Rotate -90 deg about (150, 70) --> + <g transform="translate(150, 70) rotate(-90)"> + <rect x="0" y="0" width="20" height="2" fill="blue"/> + <rect x="0" y="0" width="2" height="20" fill="red"/> + </g> + </g> + <!-- elementary-transforms --> + <!-- Draw all the markers --> + <g id="elementary-transforms-test-markers" transform="translate(-30, 0) scale(2.5, 2.5)"> + <!-- Translate --> + <text x="40" y="40">translate (50, 50)</text> + <rect x="48" y="48" width="5" height="5" fill="black"/> + <rect x="68" y="48" width="5" height="5" fill="blue"/> + <rect x="48" y="68" width="5" height="5" fill="red"/> + <!-- Rotate -90 deg about (150, 70) --> + <text x="140" y="40">rotate(-90)</text> + <rect x="148" y="68" width="5" height="5" fill="black"/> + <rect x="148" y="48" width="5" height="5" fill="blue"/> + <rect x="168" y="68" width="5" height="5" fill="red"/> + </g> + <!-- elementary-transforms-test-markers --> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-trans-03-t-manual.svg b/testing/web-platform/tests/svg/import/coords-trans-03-t-manual.svg new file mode 100644 index 000000000..b1c507c95 --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-trans-03-t-manual.svg @@ -0,0 +1,99 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: coords-trans-03-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#EstablishingANewUserSpace"> + <p> + This test verifies the implementation of transforms. It tests elementary transforms + and transform nesting. + Note that for layout purposes, this test uses nesting of translation with the elementary transforms. + </p> + <p> + The test uses the rect element, the fill color (solid primary colors) and transforms. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image exactly except for variations in the labeling text. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-trans-03-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="translate(0, 30)" font-size="12"> + <!-- ====================================================================== --> + <!-- Now, test elementary transforms. For each transform, 3 markers are --> + <!-- placed where the user space is expected after transformations for the --> + <!-- origin (black) and the points in (20, 0) (blue) and (0, 20) (red). --> + <!-- Then, a blue line going from (0, 0) to (20, 0) is drawn and a red line --> + <!-- going from (0, 0) to (0, 20), after applying the elementary --> + <!-- transformation. If the test succeeds, the red line should join the --> + <!-- black marker to the red marker and the blue line the black marker to --> + <!-- the blue marker. --> + <!-- ====================================================================== --> + <g id="elementary-transforms-test" transform="translate(0, 10)"> + <g id="elementary-transforms" transform="translate(-560, 0) scale(2.5, 2.5)"> + <!-- Skew X --> + <g transform="translate(250, 50) skewX(45)"> + <rect x="0" y="0" width="20" height="2" fill="blue"/> + <rect x="0" y="0" width="2" height="20" fill="red"/> + </g> + <!-- Skew Y --> + <g transform="translate(350, 50) skewY(45)"> + <rect x="0" y="0" width="20" height="2" fill="blue"/> + <rect x="0" y="0" width="2" height="20" fill="red"/> + </g> + </g> + <!-- elementary-transforms --> + <!-- Draw all the markers --> + <g id="elementary-transforms-test-markers" transform="translate(-560, 0) scale(2.5, 2.5)"> + <!-- Skew X --> + <text x="240" y="40">skew x (45)</text> + <rect x="248" y="48" width="5" height="5" fill="black"/> + <rect x="268" y="48" width="5" height="5" fill="blue"/> + <rect x="268" y="68" width="5" height="5" fill="red"/> + <!-- Skew Y --> + <text x="340" y="40">skew y (45)</text> + <rect x="348" y="48" width="5" height="5" fill="black"/> + <rect x="368" y="68" width="5" height="5" fill="blue"/> + <rect x="348" y="68" width="5" height="5" fill="red"/> + </g> + <!-- elementary-transforms-test-markers --> + </g> + <!-- nested-transforms test --> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-trans-04-t-manual.svg b/testing/web-platform/tests/svg/import/coords-trans-04-t-manual.svg new file mode 100644 index 000000000..3ca363087 --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-trans-04-t-manual.svg @@ -0,0 +1,88 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: coords-trans-04-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#EstablishingANewUserSpace"> + <p> + This test verifies the implementation of transforms. It tests elementary transforms + and transform nesting. + Note that for layout purposes, this test uses nesting of translation with the elementary transforms. + </p> + <p> + The test uses the rect element, the fill color (solid primary colors) and transforms. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image exactly except for variations in the labeling text. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-trans-04-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="translate(0, 30)" font-size="12"> + <!-- ====================================================================== --> + <!-- Now, test elementary transforms. For each transform, 3 markers are --> + <!-- placed where the user space is expected after transformations for the --> + <!-- origin (black) and the points in (20, 0) (blue) and (0, 20) (red). --> + <!-- Then, a blue line going from (0, 0) to (20, 0) is drawn and a red line --> + <!-- going from (0, 0) to (0, 20), after applying the elementary --> + <!-- transformation. If the test succeeds, the red line should join the --> + <!-- black marker to the red marker and the blue line the black marker to --> + <!-- the blue marker. --> + <!-- ====================================================================== --> + <g id="elementary-transforms-test"> + <g id="elementary-transforms" transform="translate(60, 45) scale(2.5, 2.5)"> + <!-- Scale 2 --> + <g transform="translate(40, 10) scale(2)"> + <rect x="0" y="0" width="20" height="1" fill="blue"/> + <rect x="0" y="0" width="1" height="20" fill="red"/> + </g> + </g> + <!-- elementary-transforms --> + <!-- Draw all the markers --> + <g id="elementary-transforms-test-markers" transform="translate(-364, -230) scale(2.5, 2.5)"> + <!-- Scale 2 --> + <text x="200" y="110">scale (2)</text> + <rect x="208" y="118" width="5" height="5" fill="black"/> + <rect x="248" y="118" width="5" height="5" fill="blue"/> + <rect x="208" y="158" width="5" height="5" fill="red"/> + </g> + <!-- elementary-transforms-test-markers --> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-trans-05-t-manual.svg b/testing/web-platform/tests/svg/import/coords-trans-05-t-manual.svg new file mode 100644 index 000000000..d0d78bf43 --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-trans-05-t-manual.svg @@ -0,0 +1,88 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: coords-trans-05-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#EstablishingANewUserSpace"> + <p> + This test verifies the implementation of transforms. It tests elementary transforms + and transform nesting. + Note that for layout purposes, this test uses nesting of translation with the elementary transforms. + </p> + <p> + The test uses the rect element, the fill color (solid primary colors) and transforms. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image exactly except for variations in the labeling text. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-trans-05-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="translate(0, 30)" font-size="12"> + <!-- ====================================================================== --> + <!-- Now, test elementary transforms. For each transform, 3 markers are --> + <!-- placed where the user space is expected after transformations for the --> + <!-- origin (black) and the points in (20, 0) (blue) and (0, 20) (red). --> + <!-- Then, a blue line going from (0, 0) to (20, 0) is drawn and a red line --> + <!-- going from (0, 0) to (0, 20), after applying the elementary --> + <!-- transformation. If the test succeeds, the red line should join the --> + <!-- black marker to the red marker and the blue line the black marker to --> + <!-- the blue marker. --> + <!-- ====================================================================== --> + <g id="nested-transforms-test"> + <g id="nested-transforms" transform="translate(-90, -450)"> + <!-- scale/translate in transform attribute --> + <g transform="scale(7.5, 5) translate(16.666667, 105)"> + <rect x="0" y="0" width="20" height="1" fill="blue"/> + <rect x="0" y="0" width="0.67" height="20" fill="red"/> + </g> + </g> + <!-- nested-transforms --> + <g id="nested-transforms-test-markers" transform="translate(-90, -450) scale(2.5, 2.5)"> + <!-- scale and translate --> + <text x="40" y="200">scale(25, 95) - translate(2, 2)</text> + <rect x="48" y="208" width="5" height="5" fill="black"/> + <rect x="108" y="208" width="5" height="5" fill="blue"/> + <rect x="48" y="248" width="5" height="5" fill="red"/> + </g> + <!-- nested-transforms-test-markers --> + </g> + <!-- nested-transforms test --> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-trans-06-t-manual.svg b/testing/web-platform/tests/svg/import/coords-trans-06-t-manual.svg new file mode 100644 index 000000000..9b845b231 --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-trans-06-t-manual.svg @@ -0,0 +1,82 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: coords-trans-06-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#EstablishingANewUserSpace"> + <p> + This test verifies the implementation of transforms. It tests elementary transforms + and transform nesting. + Note that for layout purposes, this test uses nesting of translation with the elementary transforms. + </p> + <p> + The test uses the rect element, the fill color (solid primary colors) and transforms. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image exactly except for variations in the labeling text. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-trans-06-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="translate(0, 30)" font-size="12"> + <g id="nested-transforms-test"> + <g id="nested-transforms"> + <!-- scale/translate in successive elements --> + <g transform="translate(-102, -450)"> + <g transform="scale(7.5, 5)"> + <g transform="translate(16.666667, 105)"> + <rect x="0" y="0" width="20" height="1" fill="blue"/> + <rect x="0" y="0" width="0.67" height="20" fill="red"/> + </g> + </g> + </g> + </g> + <!-- nested-transforms --> + <g id="nested-transforms-test-markers" transform="translate(-600, -450) scale(2.5, 2.5)"> + <!-- scale then translate --> + <text x="248" y="200">scale(25, 95) then translate(2, 2)</text> + <rect x="248" y="208" width="5" height="5" fill="black"/> + <rect x="308" y="208" width="5" height="5" fill="blue"/> + <rect x="248" y="248" width="5" height="5" fill="red"/> + </g> + <!-- nested-transforms-test-markers --> + </g> + <!-- nested-transforms test --> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-trans-07-t-manual.svg b/testing/web-platform/tests/svg/import/coords-trans-07-t-manual.svg new file mode 100644 index 000000000..f9cb6c44c --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-trans-07-t-manual.svg @@ -0,0 +1,70 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="OA" author="CN" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: coords-trans-07-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#EstablishingANewUserSpace"> + <p> + This test verifies the implementation of transforms. It tests elementary transforms + and transform nesting. + Note that for layout purposes, this test uses nesting of translation with the elementary transforms. + </p> + <p> + The test uses the rect element, the fill color (solid primary colors) and transforms. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image exactly except for variations in the labeling text - a long blue line at four o'clock and a short red line at seven o'clock below the text "translate+rotate", and, below and to the left of that, a long green line at four o'clock and a short red line at seven o'clock below the text "rotate+translate". + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-trans-07-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g id="elementary-transforms-test"> + <g id="object_1" transform="rotate(30) translate(200, 100)"> + <rect x="0" y="0" width="150" height="5" fill="green"/> + <rect x="0" y="0" width="5" height="50" fill="red"/> + </g> + <text x="65" y="185" font-size="20">rotate+translate</text> + + <g id="object_2" transform="translate(200,100) rotate(30)"> + <rect x="0" y="0" width="150" height="5" fill="blue"/> + <rect x="0" y="0" width="5" height="50" fill="red"/> + </g> + <text x="150" y="100" font-size="20">translate+rotate</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-trans-08-t-manual.svg b/testing/web-platform/tests/svg/import/coords-trans-08-t-manual.svg new file mode 100644 index 000000000..d1cbf594a --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-trans-08-t-manual.svg @@ -0,0 +1,76 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="OA" author="CN" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: coords-trans-08-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#EstablishingANewUserSpace"> + <p> + This test verifies the implementation of transforms. It tests elementary transforms + and transform nesting. + Note that for layout purposes, this test uses nesting of translation with the elementary transforms. + </p> + <p> + This test will check if the transfomations performed are carried out in the proper order. The result should differ depending on which transformation comes first. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image exactly except for variations in the labeling text. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-trans-08-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g id="elementary-transforms-test"> + <g id="object_1" transform="skewX(45) skewY(45)"> + <rect x="0" y="0" width="150" height="5" fill="blue"/> + <rect x="0" y="0" width="5" height="50" fill="red"/> + <rect x="150" y="0" width="5" height="50" fill="black"/> + <rect x="0" y="50" width="150" height="5" fill="black"/> + <ellipse rx="40" ry="15" cx="75" cy="25" fill="purple"/> + </g> + <text x="30" y="16" font-size="12">skewX(45)+skewY(45)</text> + + <g id="object_2" transform="translate(200,0) skewY(45) skewX(45)"> + <rect x="0" y="0" width="150" height="5" fill="blue"/> + <rect x="0" y="0" width="5" height="50" fill="red"/> + <rect x="150" y="0" width="5" height="50" fill="black"/> + <rect x="0" y="50" width="150" height="5" fill="black"/> + <ellipse rx="40" ry="15" cx="75" cy="25" fill="purple"/> + </g> + <text x="230" y="16" font-size="12">skewY(45)+skewX(45)</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-trans-09-t-manual.svg b/testing/web-platform/tests/svg/import/coords-trans-09-t-manual.svg new file mode 100644 index 000000000..d37ef9cce --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-trans-09-t-manual.svg @@ -0,0 +1,102 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="OA" author="CN" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: coords-trans-09-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#EstablishingANewUserSpace"> + <p> + This test verifies the implementation of transforms. It tests elementary transforms + and transform nesting. + Note that for layout purposes, this test uses nesting of translation with the elementary transforms. + </p> + <p> + This test will check if the various matrix operations work + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image exactly except for variations in the labeling text. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-trans-09-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g id="elementary-transforms-test"> + + <g transform="matrix(0 0 0 0 0 0)"> + <rect x="0" y="0" width="150" height="5" fill="blue"/> + <rect x="0" y="0" width="5" height="50" fill="red"/> + </g> + <text x="6" y="20" font-size="20">matrix(0 0 0 0 0 0)</text> + + <g transform="matrix(1 0 0 1 100 100)"> + <rect x="0" y="0" width="150" height="5" fill="blue"/> + <rect x="0" y="0" width="5" height="50" fill="red"/> + </g> + <text x="100" y="100" font-size="20">matrix(1 0 0 1 100 100)</text> + + <g transform="matrix(1.5 0 0 1.5 70 60)"> + <rect x="0" y="0" width="150" height="5" fill="blue"/> + <rect x="0" y="0" width="5" height="50" fill="red"/> + </g> + <text x="70" y="60" font-size="20">matrix(1.5 0 0 1.5 70 60)</text> + + <g transform="matrix(1 0 0.5 1 30 170)"> + <rect x="0" y="0" width="150" height="5" fill="blue"/> + <rect x="0" y="0" width="5" height="50" fill="red"/> + </g> + <text x="30" y="170" font-size="20">matrix(1 0 0.5 1 30 170)</text> + + <g transform="matrix(1 0.5 0 1 100 200)"> + <rect x="0" y="0" width="150" height="5" fill="blue"/> + <rect x="0" y="0" width="5" height="50" fill="red"/> + </g> + <text x="100" y="200" font-size="20">matrix(1 0.5 0 1 100 200)</text> + + <g transform="matrix(0 1 -1 0 450 0)"> + <rect x="0" y="0" width="150" height="5" fill="blue"/> + <rect x="0" y="0" width="5" height="50" fill="red"/> + </g> + <text x="275" y="30" font-size="20">matrix(0 1 -1 0 450 0)</text> + + <g transform="matrix(1 0.8 0.8 1 300 220)"> + <rect x="0" y="0" width="150" height="5" fill="blue"/> + <rect x="0" y="0" width="5" height="50" fill="red"/> + </g> + <text x="230" y="220" font-size="20">matrix(1 0.8 0.8 1 300 220)</text> + + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-trans-10-f-manual.svg b/testing/web-platform/tests/svg/import/coords-trans-10-f-manual.svg new file mode 100644 index 000000000..b50b4c3fa --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-trans-10-f-manual.svg @@ -0,0 +1,90 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: coords-trans-10-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#EstablishingANewUserSpace"> + <p> + Translation is equivalent to the matrix [1 0 0 1 tx ty], where 'tx' + and 'ty' are the distances to translate coordinates in X and Y + respectively. The test overlays a group of black graphics elements + with a 'translate' transform specified on top of an identical group + of red elements with the equivalent 'matrix' transform and vice + versa. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-trans-10-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <g transform="translate(40 20)" fill="red"> + <path d="M 20 20 L 70 20 L 45 60 z" /> + <ellipse cx="120" cy="35" rx="30" ry="10" /> + <text x="160" y="40">Filler Text</text> + <rect x="250" y="20" width="30" height="50" /> + <line x1="310" y1="20" x2="350" y2="70" stroke-width="5" /> + </g> + <g transform="matrix(1 0 0 1 40 20)" fill="black" stroke="black"> + <path d="M 20 20 L 70 20 L 45 60 z" /> + <ellipse cx="120" cy="35" rx="30" ry="10" /> + <text x="160" y="40">Filler Text</text> + <rect x="250" y="20" width="30" height="50" /> + <line x1="310" y1="20" x2="350" y2="70" stroke-width="5" /> + </g> + <g transform="translate(0 100)"> + <g transform="matrix(1 0 0 1 40 20)" fill="red"> + <path d="M 20 20 L 70 20 L 45 60 z" /> + <ellipse cx="120" cy="35" rx="30" ry="10" /> + <text x="160" y="40">Filler Text</text> + <rect x="250" y="20" width="30" height="50" /> + <line x1="310" y1="20" x2="350" y2="70" stroke-width="5" /> + </g> + <g transform="translate(40 20)" fill="black" stroke="black"> + <path d="M 20 20 L 70 20 L 45 60 z" /> + <ellipse cx="120" cy="35" rx="30" ry="10" /> + <text x="160" y="40">Filler Text</text> + <rect x="250" y="20" width="30" height="50" /> + <line x1="310" y1="20" x2="350" y2="70" stroke-width="5" /> + </g> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-trans-11-f-manual.svg b/testing/web-platform/tests/svg/import/coords-trans-11-f-manual.svg new file mode 100644 index 000000000..a5ed7d518 --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-trans-11-f-manual.svg @@ -0,0 +1,86 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: coords-trans-11-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#EstablishingANewUserSpace"> + <p> + Scaling is equivalent to the matrix [sx 0 0 xy 0 0], where one unit in the X and Y directions in the new coordinate system equals 'sx' and 'sy' units in the previous coordinate system respectively.The test overlays a group of black graphics elements with a 'scale' transform specified on top of an identical group of red elements + with the equivalent 'matrix' transform and vice versa. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> +Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-trans-11-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <g transform="scale(1.2 2.5)" fill="red"> + <path d="M 20 20 L 70 20 L 45 60 z" /> + <ellipse cx="120" cy="35" rx="30" ry="10" /> + <text x="160" y="40">Filler Text</text> + <rect x="250" y="20" width="30" height="50" /> + <line x1="310" y1="20" x2="350" y2="70" stroke-width="5" /> + </g> + <g transform="matrix(1.2 0 0 2.5 0 0)" fill="black" stroke="black"> + <path d="M 20 20 L 70 20 L 45 60 z" /> + <ellipse cx="120" cy="35" rx="30" ry="10" /> + <text x="160" y="40">Filler Text</text> + <rect x="250" y="20" width="30" height="50" /> + <line x1="310" y1="20" x2="350" y2="70" stroke-width="5" /> + </g> + <g transform="translate(0 150)"> + <g transform="matrix(1.2 0 0 2.5 0 0)" fill="red"> + <path d="M 20 20 L 70 20 L 45 60 z" /> + <ellipse cx="120" cy="35" rx="30" ry="10" /> + <text x="160" y="40">Filler Text</text> + <rect x="250" y="20" width="30" height="50" /> + <line x1="310" y1="20" x2="350" y2="70" stroke-width="5" /> + </g> + <g transform="scale(1.2 2.5)" fill="black" stroke="black"> + <path d="M 20 20 L 70 20 L 45 60 z" /> + <ellipse cx="120" cy="35" rx="30" ry="10" /> + <text x="160" y="40">Filler Text</text> + <rect x="250" y="20" width="30" height="50" /> + <line x1="310" y1="20" x2="350" y2="70" stroke-width="5" /> + </g> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-trans-12-f-manual.svg b/testing/web-platform/tests/svg/import/coords-trans-12-f-manual.svg new file mode 100644 index 000000000..b2f9b9037 --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-trans-12-f-manual.svg @@ -0,0 +1,88 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: coords-trans-12-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#EstablishingANewUserSpace"> + <p> + Rotation about the origin is equivalent to the matrix [cos(a) sin(a) -sin(a) cos(a) 0 0], which has the effect of rotating the coordinate system axes by angle 'a'. The test overlays a group of black graphics elements with a 'rotate' transform specified on top of an identical group of red elements + with the equivalent 'matrix' transform and vice versa. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-trans-12-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <g transform="translate(200)"> + <g transform="rotate(90)" fill="red"> + <path d="M 20 20 L 70 20 L 45 60 z" /> + <ellipse cx="120" cy="35" rx="30" ry="10" /> + <text x="160" y="40">Filler Text</text> + <rect x="250" y="20" width="30" height="50" /> + <line x1="310" y1="20" x2="350" y2="70" stroke-width="5" /> + </g> + <g transform="matrix(0 1 -1 0 0 0)" fill="black" stroke="black"> + <path d="M 20 20 L 70 20 L 45 60 z" /> + <ellipse cx="120" cy="35" rx="30" ry="10" /> + <text x="160" y="40">Filler Text</text> + <rect x="250" y="20" width="30" height="50" /> + <line x1="310" y1="20" x2="350" y2="70" stroke-width="5" /> + </g> + </g> + <g transform="translate(310)"> + <g transform="matrix(0 1 -1 0 0 0)" fill="red"> + <path d="M 20 20 L 70 20 L 45 60 z" /> + <ellipse cx="120" cy="35" rx="30" ry="10" /> + <text x="160" y="40">Filler Text</text> + <rect x="250" y="20" width="30" height="50" /> + <line x1="310" y1="20" x2="350" y2="70" stroke-width="5" /> + </g> + <g transform="rotate(90)" fill="black" stroke="black"> + <path d="M 20 20 L 70 20 L 45 60 z" /> + <ellipse cx="120" cy="35" rx="30" ry="10" /> + <text x="160" y="40">Filler Text</text> + <rect x="250" y="20" width="30" height="50" /> + <line x1="310" y1="20" x2="350" y2="70" stroke-width="5" /> + </g> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-trans-13-f-manual.svg b/testing/web-platform/tests/svg/import/coords-trans-13-f-manual.svg new file mode 100644 index 000000000..0dba07346 --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-trans-13-f-manual.svg @@ -0,0 +1,87 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: coords-trans-13-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#EstablishingANewUserSpace"> + <p> + A skew transformation along the x-axis is equivalent to the matrix [1 0 tan(a) 1 0 0], which has the effect of skewing X coordinates by angle 'a'. +The test overlays a group of black graphics elements with a 'skewX' transform specified on top of an identical group of red elements + with the equivalent 'matrix' transform and vice versa. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-trans-13-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <g transform="skewX(45)" fill="red"> + <path d="M 20 20 L 70 20 L 45 60 z" /> + <ellipse cx="120" cy="35" rx="30" ry="10" /> + <text x="160" y="40">Filler Text</text> + <rect x="250" y="20" width="30" height="50" /> + <line x1="310" y1="20" x2="350" y2="70" stroke-width="5" /> + </g> + <g transform="matrix(1 0 1 1 0 0)" fill="black" stroke="black"> + <path d="M 20 20 L 70 20 L 45 60 z" /> + <ellipse cx="120" cy="35" rx="30" ry="10" /> + <text x="160" y="40">Filler Text</text> + <rect x="250" y="20" width="30" height="50" /> + <line x1="310" y1="20" x2="350" y2="70" stroke-width="5" /> + </g> + <g transform="translate(0 150)"> + <g transform="matrix(1 0 1 1 0 0)" fill="red"> + <path d="M 20 20 L 70 20 L 45 60 z" /> + <ellipse cx="120" cy="35" rx="30" ry="10" /> + <text x="160" y="40">Filler Text</text> + <rect x="250" y="20" width="30" height="50" /> + <line x1="310" y1="20" x2="350" y2="70" stroke-width="5" /> + </g> + <g transform="skewX(45)" fill="black" stroke="black"> + <path d="M 20 20 L 70 20 L 45 60 z" /> + <ellipse cx="120" cy="35" rx="30" ry="10" /> + <text x="160" y="40">Filler Text</text> + <rect x="250" y="20" width="30" height="50" /> + <line x1="310" y1="20" x2="350" y2="70" stroke-width="5" /> + </g> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-trans-14-f-manual.svg b/testing/web-platform/tests/svg/import/coords-trans-14-f-manual.svg new file mode 100644 index 000000000..a224a385d --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-trans-14-f-manual.svg @@ -0,0 +1,89 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: coords-trans-14-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#EstablishingANewUserSpace"> + <p> + A skew transformation along the y-axis is equivalent to the matrix [1 tan(a) 0 1 0 0], which has the effect of skewing Y coordinates by angle 'a'. +The test overlays a group of black graphics elements with a 'skewY' transform specified on top of an identical group of red elements + with the equivalent 'matrix' transform and vice versa. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-trans-14-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <g transform="scale(0.75) rotate(-20)"> + <g transform="skewY(45)" fill="red"> + <path d="M 20 20 L 70 20 L 45 60 z" /> + <ellipse cx="120" cy="35" rx="30" ry="10" /> + <text x="160" y="40">Filler Text</text> + <rect x="250" y="20" width="30" height="50" /> + <line x1="310" y1="20" x2="350" y2="70" stroke-width="5" /> + </g> + <g transform="matrix(1 1 0 1 0 0)" fill="black" stroke="black"> + <path d="M 20 20 L 70 20 L 45 60 z" /> + <ellipse cx="120" cy="35" rx="30" ry="10" /> + <text x="160" y="40">Filler Text</text> + <rect x="250" y="20" width="30" height="50" /> + <line x1="310" y1="20" x2="350" y2="70" stroke-width="5" /> + </g> + <g transform="translate(0 150)"> + <g transform="matrix(1 1 0 1 0 0)" fill="red"> + <path d="M 20 20 L 70 20 L 45 60 z" /> + <ellipse cx="120" cy="35" rx="30" ry="10" /> + <text x="160" y="40">Filler Text</text> + <rect x="250" y="20" width="30" height="50" /> + <line x1="310" y1="20" x2="350" y2="70" stroke-width="5" /> + </g> + <g transform="skewY(45)" fill="black" stroke="black"> + <path d="M 20 20 L 70 20 L 45 60 z" /> + <ellipse cx="120" cy="35" rx="30" ry="10" /> + <text x="160" y="40">Filler Text</text> + <rect x="250" y="20" width="30" height="50" /> + <line x1="310" y1="20" x2="350" y2="70" stroke-width="5" /> + </g> + </g> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-transformattr-01-f-manual.svg b/testing/web-platform/tests/svg/import/coords-transformattr-01-f-manual.svg new file mode 100644 index 000000000..b3914f37c --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-transformattr-01-f-manual.svg @@ -0,0 +1,94 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: coords-transformattr-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#TransformAttribute"> + <p> + Tests that separating transform definitions by whitespace and/or a comma is supported. The test draws a red 'rect' element with a valid, non-delimited transform list. It overlays it with an identical black rectangle with + equivalent transform list delimted by commas and numerical Unicode references of space (U+0020), tab (U+0009), carriage + return (U+000D), line feed (U+000A), and combination of all five, +so that no red is visible. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-transformattr-01-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <g transform="translate(50 50)rotate(45)skewX(15)scale(0.8)"> + <rect x="0" y="0" width="100" height="100" fill="red" /> + </g> + <g transform="translate(50 50),rotate(45),skewX(15),scale(0.8)"> + <rect x="0" y="0" width="100" height="100" stroke="black"/> + </g> + <g transform="translate(50 50)rotate(45)skewX(15)scale(0.8)"> + <rect x="125" y="125" width="100" height="100" fill="red" /> + </g> + <g transform="translate(50 50) rotate(45)  skewX(15)     scale(0.8)"> + <rect x="125" y="125" width="100" height="100" stroke="black"/> + </g> + <g transform="translate(50 50)rotate(45)skewX(15)scale(0.8)"> + <rect x="150" y="-75" width="100" height="100" fill="red" /> + </g> + <g transform="translate(50 50)	rotate(45)		skewX(15)					scale(0.8)"> + <rect x="150" y="-75" width="100" height="100" stroke="black"/> + </g> + <g transform="translate(50 50)rotate(45)skewX(15)scale(0.8)"> + <rect x="300" y="-150" width="100" height="100" fill="red" /> + </g> + <g transform="translate(50 50)
rotate(45)

skewX(15)




scale(0.8)"> + <rect x="300" y="-150" width="100" height="100" stroke="black"/> + </g> + <g transform="translate(50 50)rotate(45)skewX(15)scale(0.8)"> + <rect x="400" y="-325" width="100" height="100" fill="red" /> + </g> + <g transform="translate(50 50)
rotate(45)

skewX(15)




scale(0.8)"> + <rect x="400" y="-325" width="100" height="100" stroke="black"/> + </g> + <g transform="translate(50 50)rotate(45)skewX(15)scale(0.8)"> + <rect x="500" y="-200" width="100" height="100" fill="red" /> + </g> + <g transform="translate(50 50),rotate(45) 	skewX(15)
scale(0.8)"> + <rect x="500" y="-200" width="100" height="100" stroke="black"/> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-transformattr-02-f-manual.svg b/testing/web-platform/tests/svg/import/coords-transformattr-02-f-manual.svg new file mode 100644 index 000000000..7e676c7e4 --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-transformattr-02-f-manual.svg @@ -0,0 +1,93 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" + version="$Revision: 1.4 $" testname="$RCSfile: coords-transformattr-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#TransformAttribute"> + <p> + If a list of transforms is provided, then the net effect is as if each transform had been specified separately in the order provided. + </p> +<p> The test overlays a black 'rect' with transform list on top of an equivalent red 'rect' with equivalent nested transforms, and vice + versa, so that there is no red visible on the page.</p>p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-transformattr-02-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <g transform="translate(150)"> + <g transform="translate(-10,-20) scale(2) rotate(45) translate(5,10)"> + <rect width="50" height="50" fill="red" /> + <circle cx="50" cy="50" r="25" fill="red" /> + <line x1="50" y1="50" x2="100" y2="100" stroke="red" stroke-width="10" /> + </g> + <g transform="translate(-10,-20)"> + <g transform="scale(2)"> + <g transform="rotate(45)"> + <g transform="translate(5,10)"> + <rect width="50" height="50" /> + <circle cx="50" cy="50" r="25" /> + <line x1="50" y1="50" x2="100" y2="100" stroke="black" stroke-width="10" /> + </g> + </g> + </g> + </g> + <g transform="translate(200)"> + <g transform="translate(-10,-20)"> + <g transform="scale(2)"> + <g transform="rotate(45)"> + <g transform="translate(5,10)"> + <rect width="50" height="50" fill="red" /> + <circle cx="50" cy="50" r="25" fill="red" /> + <line x1="50" y1="50" x2="100" y2="100" stroke="red" stroke-width="10" /> + </g> + </g> + </g> + </g> + <g transform="translate(-10,-20) scale(2) rotate(45) translate(5,10)"> + <rect width="50" height="50" /> + <circle cx="50" cy="50" r="25" /> + <line x1="50" y1="50" x2="100" y2="100" stroke="black" stroke-width="10" /> + </g> + </g> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-transformattr-03-f-manual.svg b/testing/web-platform/tests/svg/import/coords-transformattr-03-f-manual.svg new file mode 100644 index 000000000..ce5f7a7b8 --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-transformattr-03-f-manual.svg @@ -0,0 +1,62 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" version="$Revision: 1.3 $" testname="$RCSfile: coords-transformattr-03-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/coords.html#TransformAttribute"> + <p> + If 'ty' is not specified for a 'translate' transform, it is assumed to be zero. + </p> + <p> + Specify a series of various red graphics elements. Specify an equivalent series of black graphics elements that are defined to have positions + that are shifted '10' user units to the right of the red graphics elements. Specify a 'transform' value of 'translate' with only the 'tx' value + specified (i.e., 'translate(10)'). If the 'ty' parameter takes the default value of '0' user units, there will be no red on the page. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-transformattr-03-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <rect x="10" width="100" height="200" fill="red" /> + <rect transform="translate(10)" width="100" height="200" /> + <ellipse cx="170" cy="100" rx="50" ry="100" fill="red" /> + <ellipse transform="translate(10)" cx="160" cy="100" rx="50" ry="100" /> + <line x1="230" x2="330" y1="10" y2="200" stroke="red" stroke-width="10" /> + <line transform="translate(10)" x1="220" x2="320" y1="10" y2="200" stroke="black" stroke-width="10" /> + <path d="M 340 0 L 440 0 390 200 Z" fill="red" /> + <path transform="translate(10)" d="M 330 0 L 430 0 380 200 Z" fill="black" /> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg>
\ No newline at end of file diff --git a/testing/web-platform/tests/svg/import/coords-transformattr-04-f-manual.svg b/testing/web-platform/tests/svg/import/coords-transformattr-04-f-manual.svg new file mode 100644 index 000000000..031c89e09 --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-transformattr-04-f-manual.svg @@ -0,0 +1,60 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" version="$Revision: 1.3 $" testname="$RCSfile: coords-transformattr-04-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/coords.html#TransformAttribute"> + <p> + If 'sy' is not specified for a 'scale' transform, it is assumed to be equal to 'sx'. + </p> + <p> + Specify a series of various red graphics elements. Specify an equivalent series of black graphics elements that are defined to have dimensions + that are half the size as the red elements. Specify a 'transform' value of 'scale' with only the 'sx' value specified (i.e., 'scale(2)'). If the 'sy' + parameter takes the same value as the 'sx', there will be no red on the page. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-transformattr-04-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <rect width="100" height="200" fill="red" /> + <rect transform="scale(2)" width="50" height="100" /> + <ellipse cx="160" cy="100" rx="50" ry="100" fill="red" /> + <ellipse transform="scale(2)" cx="80" cy="50" rx="25" ry="50" /> + <line x1="220" x2="320" y1="10" y2="200" stroke="red" stroke-width="10" /> + <line transform="scale(2)" x1="110" x2="160" y1="5" y2="100" stroke="black" stroke-width="5" /> + <path d="M 330 0 L 430 0 380 200 Z" fill="red" /> + <path transform="scale(2)" d="M 165 0 L 215 0 190 100 Z" fill="black" /> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg>
\ No newline at end of file diff --git a/testing/web-platform/tests/svg/import/coords-transformattr-05-f-manual.svg b/testing/web-platform/tests/svg/import/coords-transformattr-05-f-manual.svg new file mode 100644 index 000000000..2f14c18ba --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-transformattr-05-f-manual.svg @@ -0,0 +1,71 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" version="$Revision: 1.4 $" testname="$RCSfile: coords-transformattr-05-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/coords.html#TransformAttribute"> + <p> + If 'cx' and 'cy' are not specified for a 'rotate' transform, the rotation is about the origin of the current user coordinate system and thus corresponds to the matrix [cos(a) sin(a) -sin(a) cos(a) 0 0]. + </p> + <p> + Specify a series of various black graphics elements inside a 'g' element with 'transform' set to a 'rotate' value with unspecified 'cx' + and 'cy' parameters (i.e., 'rotate(15)'). Specify an equivalent series of red graphics elements inside a 'g' element with 'transform' set + to a 'matrix' value which would rotate the elements 15 degrees about the point (0,0) of the current user coordinate system. If the 'g' element containing the black elements correctly rotates its content by 15 degrees around the origin of the current user coordinate system, there will be no red on the page. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page. + </p> + + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-transformattr-05-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="translate(50 15)"> + <g transform="matrix(0.96592582628906829 0.25881904510252076 -0.25881904510252076 0.96592582628906829 0 0)"> + <rect x="10" width="100" height="200" fill="red" /> + <ellipse cx="170" cy="100" rx="50" ry="100" fill="red" /> + <line x1="230" x2="330" y1="10" y2="200" stroke="red" stroke-width="10" /> + <path d="M 340 0 L 440 0 390 200 Z" fill="red" /> + </g> + <g transform="rotate(15)"> + <rect transform="translate(10)" width="100" height="200" /> + <ellipse transform="translate(10)" cx="160" cy="100" rx="50" ry="100" /> + <line transform="translate(10)" x1="220" x2="320" y1="10" y2="200" stroke="black" stroke-width="10" /> + <path transform="translate(10)" d="M 330 0 L 430 0 380 200 Z" fill="black" /> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg>
\ No newline at end of file diff --git a/testing/web-platform/tests/svg/import/coords-units-01-b-manual.svg b/testing/web-platform/tests/svg/import/coords-units-01-b-manual.svg new file mode 100644 index 000000000..830d5b769 --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-units-01-b-manual.svg @@ -0,0 +1,175 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: coords-units-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#Units"> + <p> + Verify the conversion processing of percentage and fraction values relative to + object bounding boxes. This is used when defining linear and radial gradients + as well as patterns. + </p> + <p> + The test validates conversion for coordinates, width, height and length. The first + test defines three corresponding linear gradients, which specify coordinates + using percentages for one, fractions for the second and user coordinates for the + third. The second test defines three corresponding radial gradients, which specify + a length (radius) using percentages for the first, fractions for the second and + user space for the third. Finally, the third test defines three corresponding patterns, + which specify their width and height using percentages for the first, fractions for the + second and user space coordinates for the last one. + </p> + <p> + The test also assumes that linear and radial gradients, + as well as patterns are implemented. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered image should match the reference image. Also, the text may + show minor differences, per CSS2 rules for font selection and matching. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-units-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-size="14"> + <!-- ==================================================================== --> + <!-- The following gradients will be used to fill a rectangle with the --> + <!-- following geometry in User space: x=0, y=0, width=50 height=20 --> + <!-- The gradient vector, in linearBoundingBox, is defined as: (0%, 0%) --> + <!-- to (100%, 0%). --> + <!-- The gradient vector, in linearBoundingBoxFraction, is defined as: --> + <!-- (0, 0) to (1, 0), which is equivalent. --> + <!-- According to the spec, for our rectangle, this corresponds to the --> + <!-- following user space coordinates: --> + <!-- (0%, 0%) becomes (0, 0) and (100%, 0%) becomes (20, 0) --> + <!-- These values are used to define the linearUserSpace gradient. --> + <!-- If the test succeeds, all the gradient should fill the rectangles --> + <!-- the same way --> + <!-- ==================================================================== --> + <linearGradient id="linearBoundingBoxPercentage" gradientUnits="objectBoundingBox" x1="0%" y1="0%" x2="100%" y2="0%"> + <stop stop-color="fuchsia" offset="0"/> + <stop stop-color="blue" offset="1"/> + </linearGradient> + <linearGradient id="linearBoundingBoxFraction" gradientUnits="objectBoundingBox" x1="0" y1="0" x2="1" y2="0"> + <stop stop-color="fuchsia" offset="0"/> + <stop stop-color="blue" offset="1"/> + </linearGradient> + <linearGradient id="linearUserSpace" gradientUnits="userSpaceOnUse" x1="0" y1="0" x2="50" y2="0"> + <stop stop-color="fuchsia" offset="0"/> + <stop stop-color="blue" offset="1"/> + </linearGradient> + <!-- Draw Text Comment --> + <text x="30" y="30">Bounding box relative coordinates (percentage and fraction)</text> + <g transform="translate(30, 40)"> + <rect x="0" y="0" width="50" height="20" fill="url(#linearBoundingBoxPercentage)"/> + <rect x="0" y="0" width="50" height="20" transform="translate(0, 20)" fill="url(#linearBoundingBoxFraction)"/> + <rect x="0" y="0" width="50" height="20" transform="translate(0, 40)" fill="url(#linearUserSpace)"/> + <line x1="0" y1="20" x2="50" y2="20" stroke="#cccccc" stroke-width="1"/> + <line x1="0" y1="40" x2="50" y2="40" stroke="#cccccc" stroke-width="1"/> + <text x="60" y="15">Percentage</text> + <text x="60" y="35">Fraction</text> + <text x="60" y="55">User Space</text> + </g> + <!-- ==================================================================== --> + <!-- The following gradients will be used to fill a rectangle with the --> + <!-- following geometry in User space: x=0, y=0, width=60 height=60 --> + <!-- The radial gradient outmost circle, in radialBoundingBox, is defined --> + <!-- as: cx=25% cy=25% r=25% --> + <!-- The radial gradient outmost circle, in radialBoundingBoxFraction, is --> + <!-- defined as: cx=0.25 cy=0.25 and r=0.25 --> + <!-- These two definition, for our rectangle, should be identical to the --> + <!-- following radial gradient outmost circle, in radialUserSpace: --> + <!-- cx=15 cy=15 r=15 --> + <!-- ==================================================================== --> + <radialGradient id="radialBoundingBoxPercentage" gradientUnits="objectBoundingBox" cx="25%" cy="25%" r="25%" fx="25%" fy="25%"> + <stop stop-color="fuchsia" offset="0"/> + <stop stop-color="blue" offset="1"/> + </radialGradient> + <radialGradient id="radialBoundingBoxFraction" gradientUnits="objectBoundingBox" cx="0.25" cy="0.25" r="0.25" fx="0.25" fy="0.25"> + <stop stop-color="fuchsia" offset="0"/> + <stop stop-color="blue" offset="1"/> + </radialGradient> + <radialGradient id="radialUserSpace" gradientUnits="userSpaceOnUse" cx="15" cy="15" r="15" fx="15" fy="15"> + <stop stop-color="fuchsia" offset="0"/> + <stop stop-color="blue" offset="1"/> + </radialGradient> + <!-- Draw Text Comment --> + <text x="30" y="130">Bounding box relative length (percentage and fraction)</text> + <g transform="translate(30, 140)"> + <rect x="0" y="0" width="60" height="60" fill="url(#radialBoundingBoxPercentage)"/> + <rect x="0" y="0" width="60" height="60" transform="translate(61, 0)" fill="url(#radialBoundingBoxFraction)"/> + <rect x="0" y="0" width="60" height="60" transform="translate(122, 0)" fill="url(#radialUserSpace)"/> + <text x="0" y="73">Percent.</text> + <text x="61" y="73">Fraction</text> + <text x="122" y="73">User Space</text> + </g> + <!-- ==================================================================== --> + <!-- The following patterns will be used to fill a rectangle, with the --> + <!-- following geometry in User space: x=0, y=0, width=50 height=30 --> + <!-- The pattern tile, in patterBoundingBoxPercentage, is defined as: --> + <!-- x=25% y=25% width=50% height=50% --> + <!-- The pattern tile, in patternBoundingBoxFraction, is defined as: --> + <!-- x=0.25 y=0.25 width=0.50 height=0.50 --> + <!-- For our test rectangle, both correspond to the following User space --> + <!-- coordinates: x=12.5 y=7.5 width=25 height=15 --> + <!-- These coordinates are use to define the patternUserSpace tile --> + <!-- ==================================================================== --> + <pattern id="patternBoundingBoxPercentage" patternUnits="objectBoundingBox" patternContentUnits="objectBoundingBox" x="25%" y="25%" width="50%" height="50%"> + <circle cx="0.50" cy="0.50" r="0.25" fill="fuchsia"/> + <rect x="0.4" y="0.4" width=".2" height=".2" fill="blue"/> + </pattern> + <pattern id="patternBoundingBoxFraction" patternUnits="objectBoundingBox" patternContentUnits="objectBoundingBox" x="0.25" y="0.25" width="0.50" height="0.50"> + <circle cx="0.50" cy="0.50" r="0.25" fill="fuchsia"/> + <rect x="0.4" y="0.4" width=".2" height=".2" fill="blue"/> + </pattern> + <pattern id="patternUserSpace" patternUnits="userSpaceOnUse" patternContentUnits="userSpaceOnUse" x="12.5" y="7.5" width="25" height="15"> + <circle id="patternContent" cx="25" cy="15" r="10" fill="fuchsia"/> + <rect x="20" y="12" width="10" height="6" fill="blue"/> + </pattern> + <!-- Draw Text Comment --> + <text x="30" y="240">Bounding box relative width/height (percentage and fraction)</text> + <g transform="translate(30, 250)"> + <rect x="0" y="0" width="50" height="30" fill="url(#patternBoundingBoxPercentage)" stroke="black"/> + <rect x="0" y="0" width="50" height="30" transform="translate(150, 0)" fill="url(#patternBoundingBoxFraction)" stroke="black"/> + <rect x="0" y="0" width="50" height="30" transform="translate(300, 0)" fill="url(#patternUserSpace)" stroke="black"/> + <text x="60" y="20">Percentage</text> + <text x="210" y="20">Fraction</text> + <text x="360" y="20">User Space</text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-units-02-b-manual.svg b/testing/web-platform/tests/svg/import/coords-units-02-b-manual.svg new file mode 100644 index 000000000..b83db3774 --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-units-02-b-manual.svg @@ -0,0 +1,139 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: coords-units-02-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#Units"> + <p> + Verify the conversion processing of CSS units and percentage values for both + coordinates and length values. Note that the test uses the CSS px unit to be usable + in all pixel resolutions. Hence, the conversion from other CSS units to CSS px is + left out of the test. + </p> + <p> + There are six atomic tests in this test. For each, the approach is to draw two similar + elements (circles or rects) with coordinates specified in user space for one and in + CSS units or percentage for the other. Each test is such that these two values (or + value pairs) should match. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + In the first two tests, that validate coordinate processing, the circles + should have the same center. In the following two tests, the rectangles should have + the same height and width. And finally, in the last test, the 3 skewed circles should have the + same radius. + </p> + <p> + The rendered image should match the reference image except for the text which may + show minor differences, per CSS2 rules for font selection and matching. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-units-02-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-size="13pt"> + <!-- ==================================================================== --> + <!-- First test, converting CSS coordinates to user space. --> + <!-- If implemented properly, the pink marker should appear on top of --> + <!-- the black marker. --> + <!-- ==================================================================== --> + <!-- Draw Text Comment --> + <text x="60" y="35">CSS pixel coordinate to user space conversion</text> + <g transform="translate(5, 0) scale(4)"> + <!-- Draw marker using user space units --> + <circle cx="7.5" cy="7.5" r="2.5" fill="black"/> + <!-- Draw CSS marker using px units --> + <circle cx="7.5px" cy="7.5px" r="1.5px" fill="fuchsia"/> + </g> + <!-- ==================================================================== --> + <!-- Same test, using percentage values for the coordinates --> + <!-- ==================================================================== --> + <!-- Draw Text Comment --> + <text x="60" y="85">Percentage coordinates to user space conversion</text> + <g transform="translate(5, 50) scale(4)"> + <!-- Draw marker using user space units --> + <circle cx="7.5" cy="7.5" r="2.5" fill="black"/> + <!-- Draw marker using percentages: 7.5 = 1.563% of 480 (cx) --> + <!-- Draw marker using percentages: 7.5 = 2.083% of 360 (cy) --> + <circle cx="1.563%" cy="2.083%" r=".3535%" fill="fuchsia"/> + </g> + <!-- ==================================================================== --> + <!-- Second test, converting CSS width and height to user space. --> + <!-- If implemented properly, the link marker should appear bellow the --> + <!-- black one and have the same size --> + <!-- ==================================================================== --> + <!-- Draw Text Comment --> + <text x="60" y="140">CSS width/height to user space conversion</text> + <g transform="translate(30, 115) scale(4)"> + <!-- Draw marker using user space units --> + <rect x="-5" y="0" width="10" height="5" fill="black"/> + <!-- Draw CSS marker using px units --> + <rect x="-5" y="5" width="10px" height="5px" fill="fuchsia"/> + </g> + <!-- ==================================================================== --> + <!-- Same test, using percentage values for the length --> + <!-- ==================================================================== --> + <!-- Draw Text Comment --> + <text x="60" y="200">Percentage width/height to user space conversion</text> + <g transform="translate(30, 175) scale(4)"> + <!-- Draw marker using user space units --> + <rect x="-5" y="0" width="10" height="5" fill="black"/> + <!-- Draw CSS marker using percentages: 5*2 = 10 = 2.083% of 480 --> + <!-- 2.5*2 = 5 = 1.389% of 360 --> + <rect x="-5" y="5" width="2.083%" height="1.389%" fill="fuchsia"/> + </g> + <!-- ==================================================================== --> + <!-- Third test, converting CSS arbitrary length to user space . --> + <!-- If implemented properly, the three circles which are side by side --> + <!-- should have the same radius --> + <!-- ==================================================================== --> + <!-- Draw Text Comment --> + <text x="140" y="265">CSS and percentage length conversion</text> + <g transform="translate(30, 260) skewX(45) scale(4)"> + <!-- Draw marker using user space units --> + <circle cx="0" cy="0" r="3.536" fill="black"/> + <!-- Draw CSS marker using px units. --> + <circle cx="10" cy="0" r="3.536px" fill="fuchsia"/> + <!-- Draw marker using percentages. This should yield a value of 3.536 --> + <!-- in user space. 3.536 = .8334% of 424.268px --> + <circle cx="20" cy="0" r=".8334%" fill="green"/> + <!-- Draw control lines at the top and bottom of the circles --> + <line x1="-3.536" y1="-3.536" x2="25" y2="-3.536" fill="none" stroke="#cccccc" stroke-width=".5"/> + <line x1="-3.536" y1="3.536" x2="25" y2="3.536" fill="none" stroke="#cccccc" stroke-width=".5"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-units-03-b-manual.svg b/testing/web-platform/tests/svg/import/coords-units-03-b-manual.svg new file mode 100644 index 000000000..c9828be4b --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-units-03-b-manual.svg @@ -0,0 +1,160 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: coords-units-03-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#Units"> + <p> + This test verifies both the initial viewport size and the support for the various + unit specifiers. + </p> + <p> + The units in SVG can be: user coordinate and CSS units: em, ex, px, pt, pc, cm, mm, + in and percentages. The test does not check the absolute length accuracy as this + can only be truly validated with a ruler. However, it validates that the different + units are supported by drawing multiple elements who have the same length specified + in different units. + </p> + <p> + The viewport is the "finite rectangular region" where rendering occurs in SVG. + Hence, nothing should be rendered outside the viewport (paragraph 7.1). Furthermore, + when no positioning properties are set on the top svg element, the initial viewport + size should have the value of the top svg element's "width" and "height" attributes. + To check this behavior, the test does not define positioning properties on the top + svg element but defines its "width" and "height" properties. Then it fills a red + rectangle that is bigger than the viewport size. Then, a rectangle, the size of the + viewport is drawn in white. If rendering is limited to the viewport area, none of the + red should show. + </p> + <p> + The line showing the "ex" units will not necessarily appear with the same length + as shown in the reference image because the X-height of a font is not + necessarily half of the font size (which is assumed in the reference image where + 1ex is considered to be .5em). + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if the top three lines (user units, px, em) are the same length, + the fifth line (%) is the same length as the top three lines, and the bottom + five lines (in, cm, mm, pt, pc) are the same length. The fourth line (ex) may have + any non-zero length, since the X-height of the font will depend on the exact font + chosen by the user agent (which may vary).</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-units-03-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g id="viewport-initial-size-test"> + <!-- ====================================================================== --> + <!-- First fill a rectangle that is bigger than the defined viewport ====== --> + <!-- ====================================================================== --> + <rect x="0px" y="0px" width="2000px" height="2000px" fill="red"/> + <!-- ====================================================================== --> + <!-- This second rectangle should cover the previous one, so none of the == --> + <!-- red should show if the initial viewport has the requested size == --> + <!-- ====================================================================== --> + <rect x="0px" y="0px" width="480px" height="360px" fill="white"/> + </g> + <!-- viewport-initial-size-test --> + <!-- Title --> + <text x="125" y="20" fill="black" font-size="12" font-family="Arial">Initial viewport and CSS units test</text> + <g id="units-test" fill="black" font-size="10pt" transform="translate(0, 60)"> + <!-- ====================================================================== --> + <!-- Now, draw rectangles using the various unit specifiers --> + <!-- ====================================================================== --> + <!-- User Space --> + <text x="20" y="18">200</text> + <text x="230" y="20">User space units (no specifier)</text> + <rect x="20" y="20" width="200" height="1"/> + <!-- ================== --> + <!-- Relative CSS Units --> + <!-- ================== --> + <!-- Pixels : Should correspond to User Space, because the initial user --> + <!-- coordinate is such that one user space unit equals one pixel in --> + <!-- viewport. --> + <text x="20" y="38">200 px</text> + <text x="230" y="40">Pixels (px)</text> + <rect x="20" y="40" width="200px" height="1"/> + <!-- Font size (em). Should be equal to 200pt because current font's --> + <!-- point size is 10pt --> + <text x="20" y="58">20 em = 200 px (font-size=10px)</text> + <text x="230" y="60">Relative to font size (em)</text> + <g font-size="10px"> + <rect x="20" y="60" width="20em" height="1"/> + </g> + <!-- X-Height (ex). With a 10px font-size, x-height is about 5px, so --> + <!-- ex units would be about 200px --> + <text x="20" y="78">40 ex</text> + <text x="230" y="80">Relative to font x-height (ex)</text> + <g font-size="10px"> + <rect x="20" y="80" width="40ex" height="1"/> + </g> + <!-- ========================= --> + <!-- Percentage --> + <!-- ========================= --> + <!-- 1% = 4.8px because viewport is 480px --> + <text x="20" y="98">41.67% = 200 px</text> + <text x="230" y="100">Percentage (%)</text> + <rect x="20" y="100" width="41.67%" height="1"/> + <!-- ========================= --> + <!-- Absolute Length CSS Units --> + <!-- ========================= --> + <!-- Inches (should be the same length as following (cm) rect) --> + <text x="20" y="118">1 in</text> + <text x="230" y="120">Inches (in)</text> + <rect x="20" y="120" width="1in" height="1"/> + <!-- Centimeters(should be the same length as previous (in) rect) --> + <!-- 1in = 2.54cm --> + <text x="20" y="138">2.54 cm = 1 in</text> + <text x="230" y="140">Centimeters (cm)</text> + <rect x="20" y="140" width="2.54cm" height="1"/> + <!-- Millimeters (should be the same length as previous (cm) rect) --> + <!-- 10mm = 1cm --> + <text x="20" y="158">25.4 mm = 1 in</text> + <text x="230" y="160">Millimeters (mm)</text> + <rect x="20" y="160" width="25.4mm" height="1"/> + <!-- Points (should be the same length as (in) rect --> + <!-- 1pt = 1/72 in --> + <text x="20" y="178">72pt = 1 in</text> + <text x="230" y="180">Points (pt)</text> + <rect x="20" y="180" width="72pt" height="1"/> + <!-- Picas (should be the same length as previous (pt) rect) --> + <!-- 1pc = 12pt --> + <text x="20" y="198">6pc = 1 in</text> + <text x="230" y="200">Picas (pc)</text> + <rect x="20" y="200" width="6pc" height="1"/> + </g> + <!-- units-test --> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-viewattr-01-b-manual.svg b/testing/web-platform/tests/svg/import/coords-viewattr-01-b-manual.svg new file mode 100644 index 000000000..05fbe99f5 --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-viewattr-01-b-manual.svg @@ -0,0 +1,140 @@ +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1 Basic//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11-basic.dtd" [ + <!ENTITY Smile " + <rect x='.5' y='.5' width='29' height='39' fill='black' stroke='orange' stroke-width='2'/> + <g transform='translate(0, 5)'> + <circle cx='15' cy='15' r='10' fill='yellow'/> + <circle cx='12' cy='12' r='1.5' fill='black'/> + <circle cx='17' cy='12' r='1.5' fill='black'/> + <path d='M 10 19 L 15 23 20 19' stroke='black' stroke-width='2'/> + </g> + "> + <!ENTITY Viewport1 "<rect x='.5' y='.5' width='49' height='29' fill='none' stroke='blue'/>"> + <!ENTITY Viewport2 "<rect x='.5' y='.5' width='29' height='59' fill='none' stroke='blue'/>"> +]> +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: coords-viewattr-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#ViewBoxAttribute"> + <p> + This test verifies the implementation of the viewBox and the + preserveAspectRatio attribute. This is a modified version of the sample + file included in the SVG specification. It exercises the various + preserveAspectRatio values and uses a general entity definition in order + to make reading of the SVG source easier. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Load the document in the user agent. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image exactly except for + variations in the labeling text. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-viewattr-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-size="9" transform="translate(0, 30)"> + <desc>Example PreserveAspectRatio - demonstrate available options</desc> + <text text-anchor="middle" x="240" font-size="16">Test available options of preserveAspectRatio</text> + <text x="35.5" y="30" text-anchor="middle">SVG to fit</text> + <g transform="translate(20,40)">&Smile;</g> + <text x="35.5" y="110" text-anchor="middle">Viewport 1</text> + <g transform="translate(10,120)">&Viewport1;</g> + <text x="35.5" y="180" text-anchor="middle">Viewport 2</text> + <g transform="translate(20,190)">&Viewport2;</g> + <g id="meet-group-1" transform="translate(120, 50)"> + <text x="0" y="-20">---------- meet --------------------</text> + <g> + <text y="-5">xMin*</text>&Viewport1; + <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMinYMin meet" viewBox="0 0 30 40" width="50" height="30">&Smile;</svg> + </g> + <g transform="translate(70,0)"> + <text y="-5">xMid*</text>&Viewport1; + <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid meet" viewBox="0 0 30 40" width="50" height="30">&Smile;</svg> + </g> + <g transform="translate(0,50)"> + <text y="-5">xMax*</text>&Viewport1; + <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMaxYMax meet" viewBox="0 0 30 40" width="50" height="30">&Smile;</svg> + </g> + </g> + <g id="meet-group-2" transform="translate(300, 50)"> + <text x="0" y="-20">---------- meet ------------------------</text> + <g> + <text y="-5">*YMin</text>&Viewport2; + <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMinYMin meet" viewBox="0 0 30 40" width="30" height="60">&Smile;</svg> + </g> + <g transform="translate(50, 0)"> + <text y="-5">*YMid</text>&Viewport2; + <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid meet" viewBox="0 0 30 40" width="30" height="60">&Smile;</svg> + </g> + <g transform="translate(100, 0)"> + <text y="-5">*YMax</text>&Viewport2; + <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMaxYMax meet" viewBox="0 0 30 40" width="30" height="60">&Smile;</svg> + </g> + </g> + <g id="slice-group-1" transform="translate(120, 185)"> + <text x="0" y="-20">---------- slice -------------------------</text> + <g> + <text y="-5">xMin*</text>&Viewport2; + <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMinYMin slice" viewBox="0 0 30 40" width="30" height="60">&Smile;</svg> + </g> + <g transform="translate(50,0)"> + <text y="-5">xMid*</text>&Viewport2; + <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid slice" viewBox="0 0 30 40" width="30" height="60">&Smile;</svg> + </g> + <g transform="translate(100,0)"> + <text y="-5">xMax*</text>&Viewport2; + <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMaxYMax slice" viewBox="0 0 30 40" width="30" height="60">&Smile;</svg> + </g> + </g> + <g id="slide-group-2" transform="translate(300, 155) translate(0, 30)"> + <text x="0" y="-20">---------- slice ---------------------</text> + <g> + <text y="-5">*YMin</text>&Viewport1; + <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMinYMin slice" viewBox="0 0 30 40" width="50" height="30">&Smile;</svg> + </g> + <g transform="translate(70,0)"> + <text y="-5">*YMid</text>&Viewport1; + <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid slice" viewBox="0 0 30 40" width="50" height="30">&Smile;</svg> + </g> + <g transform="translate(0,50)"> + <text y="-5">*YMax</text>&Viewport1; + <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMaxYMax slice" viewBox="0 0 30 40" width="50" height="30">&Smile;</svg> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-viewattr-02-b-manual.svg b/testing/web-platform/tests/svg/import/coords-viewattr-02-b-manual.svg new file mode 100644 index 000000000..77a0e1979 --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-viewattr-02-b-manual.svg @@ -0,0 +1,716 @@ +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1 Basic//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11-basic.dtd" [ + <!ENTITY Viewport1 "<rect x='.5' y='.5' width='49' height='29' fill='none' stroke='blue'/>"> + <!ENTITY Viewport2 "<rect x='.5' y='.5' width='29' height='59' fill='none' stroke='blue'/>"> +]> +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: coords-viewattr-02-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#ViewBoxAttribute"> + <p> + This test verifies the implementation of the preserveAspectRatio attribute on <image> + referencing raster content. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + This is a modified version of the sample file included in the SVG specification. + It exercises the various preserveAspectRatio values and uses a general entity definition + in order to make reading of the SVG source easier. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image exactly except for variations in the labeling text. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-viewattr-02-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-size="9" transform="translate(0, 30)"> + <desc>Example PreserveAspectRatio - demonstrate available options</desc> + <text text-anchor="middle" x="240" font-size="16">Test options of preserveAspectRatio on an image element</text> + <text x="40" y="30" text-anchor="middle">Raster to fit</text> + <g transform="translate(20,40)"> + <image xlink:href="data:image/jpeg;base64,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" width="40" height="40" preserveAspectRatio="none" /> + </g> + <text x="35.5" y="110" text-anchor="middle">Viewport 1</text> + <g transform="translate(10,120)">&Viewport1;</g> + <text x="35.5" y="180" text-anchor="middle">Viewport 2</text> + <g transform="translate(20,190)">&Viewport2;</g> + <g id="meet-group-1" transform="translate(120, 50)"> + <text x="0" y="-20">---------- meet --------------------</text> + <g> + <text y="-5">xMin*</text>&Viewport1; + <image xlink:href="data:image/jpeg;base64,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" preserveAspectRatio="xMinYMin meet" width="50" height="30" /> + </g> + <g transform="translate(70,0)"> + <text y="-5">xMid*</text>&Viewport1; + <image xlink:href="data:image/jpeg;base64,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" preserveAspectRatio="xMidYMid meet" width="50" height="30" /> + </g> + <g transform="translate(0,50)"> + <text y="-5">xMax*</text>&Viewport1; + <image xlink:href="data:image/jpeg;base64,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" preserveAspectRatio="xMaxYMax meet" width="50" height="30" /> + </g> + </g> + <g id="meet-group-2" transform="translate(300, 50)"> + <text x="0" y="-20">---------- meet ------------------------</text> + <g> + <text y="-5">*YMin</text>&Viewport2; + <image xlink:href="data:image/jpeg;base64,/9j/4AAQSkZJRgABAgAAZABkAAD/7AARRHVja3kAAQAEAAAAHgAA/+4ADkFkb2JlAGTAAAAAAf/b +AIQAEAsLCwwLEAwMEBcPDQ8XGxQQEBQbHxcXFxcXHx4XGhoaGhceHiMlJyUjHi8vMzMvL0BAQEBA +QEBAQEBAQEBAQAERDw8RExEVEhIVFBEUERQaFBYWFBomGhocGhomMCMeHh4eIzArLicnJy4rNTUw +MDU1QEA/QEBAQEBAQEBAQEBA/8AAEQgAZABkAwEiAAIRAQMRAf/EAT8AAAEFAQEBAQEBAAAAAAAA +AAMAAQIEBQYHCAkKCwEAAQUBAQEBAQEAAAAAAAAAAQACAwQFBgcICQoLEAABBAEDAgQCBQcGCAUD +DDMBAAIRAwQhEjEFQVFhEyJxgTIGFJGhsUIjJBVSwWIzNHKC0UMHJZJT8OHxY3M1FqKygyZEk1Rk +RcKjdDYX0lXiZfKzhMPTdePzRieUpIW0lcTU5PSltcXV5fVWZnaGlqa2xtbm9jdHV2d3h5ent8fX +5/cRAAICAQIEBAMEBQYHBwYFNQEAAhEDITESBEFRYXEiEwUygZEUobFCI8FS0fAzJGLhcoKSQ1MV +Y3M08SUGFqKygwcmNcLSRJNUoxdkRVU2dGXi8rOEw9N14/NGlKSFtJXE1OT0pbXF1eX1VmZ2hpam +tsbW5vYnN0dXZ3eHl6e3x//aAAwDAQACEQMRAD8A8/SSR8LCyc/JZi4rDZdYYa0flPgAgSACSaA1 +JKkLWuc4NaC5x0AGpJXT9J+onUcwC3Od9jpOoYRutI/q/m/P7l1X1f8Aqth9HYLXgX5xHuuI0b5V +g8fHlbixOa+LSsw5fQf5w7/QMscfdxcL6n9BwwP1cXvH5953/wDR+j+C1qsbHoEU1MqHgxob+RES +WVPNlyG5zlP+8bXgAbBRAIgiR4Knk9G6TlgjIw6Xz32AO/zhBVxJNjOUTcZGJ8DSnk+pf4v8C4F/ +T7XY1nZj/fX/AOSH4rjOq9E6l0mzZmVFrSYZa33Vu+Dv4L19Qvx6Mmp1GRW22p4hzHCQQtDl/imf +GQMh96Hj830P8VpgDto+KJLqPrR9UX9M3ZuCDZgzL2cupn8rfP71y63sObHmgJ4zYP2g9ixEEGip +JJJSoXa1znBrQS5xgAckleo/Vb6vM6Phh9oBzrwDc790cisfDv5rlfqJ0kZnUXZ1rZpw4LJ4Nrvo +/wCbz9y9GWH8W5o8X3eB0GuTz6Blxx6qSSVDrPWcTo2J9pyZcXHbVU36T3eA/iVkwhKchCAMpS0A +C9vpLiKP8YxNwGRhbaCdSx8vA+BABXZ42TTl49eTjuD6bWhzHDuCpc/K5sFe7DhEtjdj8FCQOyRJ +Vuo9Qxum4lmZlO21V+GpcTw1o8SuQP8AjHd62mCPQn/Se+P82EsHKZ8wMsUOIR62Br9UGQG73CSq +9M6li9Uw2ZmK6a36EHRzXDlrh4hWlDKJjIxkKMTRBXLOa17Sx4DmuBDmnUEHsV5j9bfq/wDsfMFt +AP2LIJNX8h3ev+5enqj1rplfVem3Yb43PE1OP5tjdWlWuR5o8vlBJ9E9Jjw7/RbKNh8fSRPQu9f7 +PtPrb/T2d987dv3pLqLHfx+jA+ofU/CGH0HHkQ+8G9/9v6P/AEYW0h41Qox6qRxUxrB/ZEIi4/NM +5Ms5n9ORl9rYAoAKXEf4xqLicLIAJoaHsJ7B5gj7wF26Hk42Pl0ux8mtttLxDmOEgqTlc/sZoZa4 +hG7HgdFSFinxVeo/Uui+n6v44ukby97Gnsxxlv38p6PqX9X6b/WGOXwZax7i5g/snn5rcAAAAEAc +BXfiHxDHnxxx44yri4iZfkFkIEGy8v8A4waL7Oj1WVgmum4OtA7Atc0OPzK85XttlbLWOrsaHseC +HNcJBB7ELCP1K+rxv9b7O6Jn0t7tn3TP4o8h8Rx4MXt5Iy0JMTHx7qlAk2Gl/i8ovr6ZkWvBFVtv +6Ke+0Q5w/J8l1ajVVXTW2qpoZWwQ1jRAAHYBSWfzGb3s08tcPGbpeBQpSSSSiS8d+xGf8/PU2/od +n22I03fQ/wDPmqS6z7Oz7V9pj3+n6c+W7ckrv36fc/7m9j+1bw/9K0oIIBHB4SVPo2SMvpOHkAzv +pZP9YCHfiFcVOcTGUoneJI+xKkkkkEqSSSSUpJJJJSkkkklKSSSSUrySWX+0m/8AOT9mz/2l9T+3 +v4/zUlL7E+3+T93/AAUX+dOP/i+6kLsC3p7z+kxnb2D/AIN+v4O/KusXkHROq2dJ6lVmMktadtrB ++dW76Q/u8165j305NFeRQ4PqtaHMcO4KufFOXOPOcgHoza/4XUftWwNiuzMkASeFiYv1u6Nk59mC +LdjmO212v0rtPfa74+PK2yARB1BXKdc+ouLmOdkdNcMa86uqP804+UfR/Iq3LR5eRlHPKUOIeiQ2 +B8Uyvo9WkvNmZv1u+rf6O1rzjt0AsHq0/wBl44+RWjj/AOMd4AGTggnu6uyP+i5p/Kp5fDM/zYjD +PDpKEh+1HGOuj3CS41/+MfFA9mFYXeBeAPwBWfk/XzrOWfSwMdlLnaDaDbZ8u34IR+Gc2d4CA7yk +K/BXHF7nP6jhdOoORmWtqrHE8uPg0ckqt0Tr2F1ql9mNLH1uh9T43Afmu07FcbifVP6wdavGT1Wx +1LDy+47rI8G19vnC7bpPRsDpFHo4dcE/zlrtXvP8pyGfDy2HGYjJ72e94fJHwSDInag3kznNY0uc +Ya0SSeAAnXLfXnrgw8L9m0O/WcofpI5ZV3/zuPvVfBhlmyxxx/SO/YdSkmhbyv7fd/zp/bEn0/W4 +/wCB/m4/zEliJLqfu2L93/Jez/gdmCz+NqXUfVH60fsx4wc1x+w2H2POvouPf+qe/wB65dJHNhhm +xnHMWD9oPcKBINh9ta5r2h7CHNcJa4agg9wnXmH1f+tuZ0iKLQcjC/0RPuZ/xZ/gvQemda6b1Wvf +h3B7vzqj7bG/FpXN81yOXlySRxw6TG317M0ZAt7nQqnf0bpORrdhUvJ7mts/eBKuJKrGUom4kx8j +SXNZ9W+gsMjApnzbP5VeoxcbHEY9LKR4VtDf+pCIknSy5JfNOUv7xJVQUkmc5rGlzyGtGpJMABcv +1z684WG11HTYysnj1P8ABMPx/O+X3p2HBlzS4ccTL8h5lRIG7qdf6/i9FxfUsIfkvB9CidXHxPg0 +LyzMzMjOybMrJdvutO5zv4DyCWZmZOdkOycqw23P+k535B4BBXR8lyUeWj+9kl80v2DwYZSvyUkk +kri1SSSSSlIlHr+q37Pv9afZ6c758tuqSSB2P7dlPc9E/wCfm1vqbPR0j7b9KP7H6T711mP9q2D7 +V6e/v6e6P+kkkuZ575z/ALm3/wAh+1nj9fql+Cy+p/8AOTaf2b9l/wCub9/y/NSSVfB84/m/+q/K +k/X6PA9f/wCdO4/tj1vTnT/Q/L0/YsNJJdTy381H+a/6j8n0YDv1+qkkklMhSSSSSn//2Q==" preserveAspectRatio="xMinYMin meet" width="30" height="60" /> + </g> + <g transform="translate(50, 0)"> + <text y="-5">*YMid</text>&Viewport2; + <image xlink:href="data:image/jpeg;base64,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" preserveAspectRatio="xMidYMid meet" width="30" height="60" /> + </g> + <g transform="translate(100, 0)"> + <text y="-5">*YMax</text>&Viewport2; + <image xlink:href="data:image/jpeg;base64,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" preserveAspectRatio="xMaxYMax meet" width="30" height="60" /> + </g> + </g> + <g id="slice-group-1" transform="translate(120, 185)"> + <text x="0" y="-20">---------- slice -------------------------</text> + <g> + <text y="-5">xMin*</text>&Viewport2; + <image xlink:href="data:image/jpeg;base64,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" preserveAspectRatio="xMinYMin slice" width="30" height="60" /> + </g> + <g transform="translate(50,0)"> + <text y="-5">xMid*</text>&Viewport2; + <image xlink:href="data:image/jpeg;base64,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" preserveAspectRatio="xMidYMid slice" width="30" height="60" /> + </g> + <g transform="translate(100,0)"> + <text y="-5">xMax*</text>&Viewport2; + <image xlink:href="data:image/jpeg;base64,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" preserveAspectRatio="xMaxYMax slice" width="30" height="60" /> + </g> + </g> + <g id="slide-group-2" transform="translate(300, 155) translate(0, 30)"> + <text x="0" y="-20">---------- slice ---------------------</text> + <g> + <text y="-5">*YMin</text>&Viewport1; + <image xlink:href="data:image/jpeg;base64,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" preserveAspectRatio="xMinYMin slice" width="50" height="30" /> + </g> + <g transform="translate(70,0)"> + <text y="-5">*YMid</text>&Viewport1; + <image xlink:href="data:image/jpeg;base64,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" preserveAspectRatio="xMidYMid slice" width="50" height="30" /> + </g> + <g transform="translate(0,50)"> + <text y="-5">*YMax</text>&Viewport1; + <image xlink:href="data:image/jpeg;base64,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" preserveAspectRatio="xMaxYMax slice" width="50" height="30" /> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-viewattr-03-b-manual.svg b/testing/web-platform/tests/svg/import/coords-viewattr-03-b-manual.svg new file mode 100644 index 000000000..02c31605e --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-viewattr-03-b-manual.svg @@ -0,0 +1,94 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="BB" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: coords-viewattr-03-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#ViewBoxAttribute"> + <p> + This file tests the allowed syntax of the viewBox attribute. The viewBox attribute is a list of + four numbers min-x, min-y, width and height, separated by whitespace and/or a comma. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + In the rendered result, you should see 6 identical light blue shapes. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-viewattr-03-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-size="20" x="240" y="28" text-anchor="middle"><svg> 'viewBox' attribute</text> + + <g fill="lightblue" stroke="black"> + + <svg x="35" y="50" width="100" height="100" viewBox="0 0 200 200" overflow="visible"> + <path fill-rule="evenodd" d="M20,20 Q180,20 180,180 Q20,180 20,20 Z M20,180 Q20,20 180,20 Q180,180 20,180 Z M100,40 L160,100 100,160 40,100 Z"/> + </svg> + <text font-size="13.5" x="85" y="155" text-anchor="middle" fill="black" stroke="none">viewBox="0 0 200 200"</text> + <text font-size="13.5" x="85" y="170" text-anchor="middle" fill="black" stroke="none">overflow="visible" </text> + + <svg x="35" y="180" width="100" height="100" viewBox="0 0 200 200" overflow="hidden"> + <path fill-rule="evenodd" d="M20,20 Q180,20 180,180 Q20,180 20,20 Z M20,180 Q20,20 180,20 Q180,180 20,180 Z M100,40 L160,100 100,160 40,100 Z"/> + </svg> + <text font-size="13.5" x="85" y="285" text-anchor="middle" fill="black" stroke="none">viewBox="0 0 200 200"</text> + <text font-size="13.5" x="85" y="300" text-anchor="middle" fill="black" stroke="none">overflow="hidden" </text> + + <svg x="190" y="50" width="100" height="100" viewBox="0,0,200,200" overflow="visible"> + <path fill-rule="evenodd" d="M20,20 Q180,20 180,180 Q20,180 20,20 Z M20,180 Q20,20 180,20 Q180,180 20,180 Z M100,40 L160,100 100,160 40,100 Z"/> + </svg> + <text font-size="13.5" x="240" y="155" text-anchor="middle" fill="black" stroke="none">viewBox="0,0,200,200"</text> + <text font-size="13.5" x="240" y="170" text-anchor="middle" fill="black" stroke="none">overflow="visible" </text> + + <svg x="190" y="180" width="100" height="100" viewBox="0,0,200,200" overflow="hidden"> + <path fill-rule="evenodd" d="M20,20 Q180,20 180,180 Q20,180 20,20 Z M20,180 Q20,20 180,20 Q180,180 20,180 Z M100,40 L160,100 100,160 40,100 Z"/> + </svg> + <text font-size="13.5" x="240" y="285" text-anchor="middle" fill="black" stroke="none">viewBox="0,0,200,200"</text> + <text font-size="13.5" x="240" y="300" text-anchor="middle" fill="black" stroke="none">overflow="hidden" </text> + + <svg x="345" y="50" width="100" height="100" viewBox="0,0, 200, 200" overflow="visible"> + <path fill-rule="evenodd" d="M20,20 Q180,20 180,180 Q20,180 20,20 Z M20,180 Q20,20 180,20 Q180,180 20,180 Z M100,40 L160,100 100,160 40,100 Z"/> + </svg> + <text font-size="13.5" x="395" y="155" text-anchor="middle" fill="black" stroke="none">viewBox="0,0, 200, 200"</text> + <text font-size="13.5" x="395" y="170" text-anchor="middle" fill="black" stroke="none">overflow="visible" </text> + + <svg x="345" y="180" width="100" height="100" viewBox="0,0, 200, 200" overflow="hidden"> + <path fill-rule="evenodd" d="M20,20 Q180,20 180,180 Q20,180 20,20 Z M20,180 Q20,20 180,20 Q180,180 20,180 Z M100,40 L160,100 100,160 40,100 Z"/> + </svg> + <text font-size="13.5" x="395" y="285" text-anchor="middle" fill="black" stroke="none">viewBox="0,0, 200, 200"</text> + <text font-size="13.5" x="395" y="300" text-anchor="middle" fill="black" stroke="none">overflow="hidden" </text> + + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/coords-viewattr-04-f-manual.svg b/testing/web-platform/tests/svg/import/coords-viewattr-04-f-manual.svg new file mode 100644 index 000000000..f172ecd2a --- /dev/null +++ b/testing/web-platform/tests/svg/import/coords-viewattr-04-f-manual.svg @@ -0,0 +1,129 @@ +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1 Basic//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11-basic.dtd" [ + <!ENTITY Viewport1 "<rect x='.5' y='.5' width='49' height='29' fill='none' stroke='blue'/>"> + <!ENTITY Viewport2 "<rect x='.5' y='.5' width='29' height='59' fill='none' stroke='blue'/>"> +]> +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="ED" status="created" + version="$Revision: 1.2 $" testname="$RCSfile: coords-viewattr-04-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/coords.html#ViewBoxAttribute"> + <p> + This test verifies the implementation of the preserveAspectRatio attribute on <image> + referencing svg content. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image exactly except for variations in the labeling text. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: coords-viewattr-04-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-size="9" transform="translate(0, 30)"> + <desc>Example PreserveAspectRatio - demonstrate available options</desc> + <text text-anchor="middle" x="240" font-size="16">Test options of preserveAspectRatio on an image element</text> + <text x="40" y="30" text-anchor="middle">SVG to fit</text> + <g transform="translate(20,40)"> + <image xlink:href="../images/happysmiley.svg" width="40" height="40" preserveAspectRatio="none" /> + </g> + <text x="35.5" y="110" text-anchor="middle">Viewport 1</text> + <g transform="translate(10,120)">&Viewport1;</g> + <text x="35.5" y="180" text-anchor="middle">Viewport 2</text> + <g transform="translate(20,190)">&Viewport2;</g> + <g id="meet-group-1" transform="translate(120, 50)"> + <text x="0" y="-20">---------- meet --------------------</text> + <g> + <text y="-5">xMin*</text>&Viewport1; + <image xlink:href="../images/happysmiley.svg" preserveAspectRatio="xMinYMin meet" width="50" height="30" /> + </g> + <g transform="translate(70,0)"> + <text y="-5">xMid*</text>&Viewport1; + <image xlink:href="../images/happysmiley.svg" preserveAspectRatio="xMidYMid meet" width="50" height="30" /> + </g> + <g transform="translate(0,50)"> + <text y="-5">xMax*</text>&Viewport1; + <image xlink:href="../images/happysmiley.svg" preserveAspectRatio="xMaxYMax meet" width="50" height="30" /> + </g> + </g> + <g id="meet-group-2" transform="translate(300, 50)"> + <text x="0" y="-20">---------- meet ------------------------</text> + <g> + <text y="-5">*YMin</text>&Viewport2; + <image xlink:href="../images/happysmiley.svg" preserveAspectRatio="xMinYMin meet" width="30" height="60" /> + </g> + <g transform="translate(50, 0)"> + <text y="-5">*YMid</text>&Viewport2; + <image xlink:href="../images/happysmiley.svg" preserveAspectRatio="xMidYMid meet" width="30" height="60" /> + </g> + <g transform="translate(100, 0)"> + <text y="-5">*YMax</text>&Viewport2; + <image xlink:href="../images/happysmiley.svg" preserveAspectRatio="xMaxYMax meet" width="30" height="60" /> + </g> + </g> + <g id="slice-group-1" transform="translate(120, 185)"> + <text x="0" y="-20">---------- slice -------------------------</text> + <g> + <text y="-5">xMin*</text>&Viewport2; + <image xlink:href="../images/happysmiley.svg" preserveAspectRatio="xMinYMin slice" width="30" height="60" /> + </g> + <g transform="translate(50,0)"> + <text y="-5">xMid*</text>&Viewport2; + <image xlink:href="../images/happysmiley.svg" preserveAspectRatio="xMidYMid slice" width="30" height="60" /> + </g> + <g transform="translate(100,0)"> + <text y="-5">xMax*</text>&Viewport2; + <image xlink:href="../images/happysmiley.svg" preserveAspectRatio="xMaxYMax slice" width="30" height="60" /> + </g> + </g> + <g id="slide-group-2" transform="translate(300, 155) translate(0, 30)"> + <text x="0" y="-20">---------- slice ---------------------</text> + <g> + <text y="-5">*YMin</text>&Viewport1; + <image xlink:href="../images/happysmiley.svg" preserveAspectRatio="xMinYMin slice" width="50" height="30" /> + </g> + <g transform="translate(70,0)"> + <text y="-5">*YMid</text>&Viewport1; + <image xlink:href="../images/happysmiley.svg" preserveAspectRatio="xMidYMid slice" width="50" height="30" /> + </g> + <g transform="translate(0,50)"> + <text y="-5">*YMax</text>&Viewport1; + <image xlink:href="../images/happysmiley.svg" preserveAspectRatio="xMaxYMax slice" width="50" height="30" /> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/extend-namespace-01-f-manual.svg b/testing/web-platform/tests/svg/import/extend-namespace-01-f-manual.svg new file mode 100644 index 000000000..e5c111139 --- /dev/null +++ b/testing/web-platform/tests/svg/import/extend-namespace-01-f-manual.svg @@ -0,0 +1,180 @@ +<svg version="1.1" baseProfile="full" onload="onLoad(evt)" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: extend-namespace-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/extend.html#ForeignNamespaces"> + <p> + Test mixing a business data namespace with elements in SVG namespace. + </p> + <p> + The test case uses a different namespace to hold fake sales data. + Using ECMAScript to make calls to the DOM, the test case extracts + the sales data and then makes calls to the SVG DOM to build up + a 'path' element and a 'text' element for each individual pie slice. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The result should show five pie slices. + The first pie slice should be exploded, with a pink fill and a blue border. + The other pie slices should have various levels of gray fill and black borders. + The name of each region should appear in black towards the center of + the pie slice. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: extend-namespace-01-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g xmlns:bd="http://example.org/ExampleBusinessData" xmlns="http://www.w3.org/2000/svg"> + <defs> + <script type="text/ecmascript"> + var svg_ns = "http://www.w3.org/2000/svg"; + var bd_ns = "http://example.org/ExampleBusinessData"; + function onLoad(evt){ + // Get Document + var svgElement = evt.target; + var doc = svgElement.ownerDocument; + + var resultsElement = doc.getElementById('results'); + var gElement = doc.getElementById('PieParent'); + + // Count the number of regions. + RegionNodeList = doc.getElementsByTagNameNS(bd_ns, "Region"); + regionCount = RegionNodeList.length; + + // Get the region data. + RegionNameNodeList = doc.getElementsByTagNameNS(bd_ns, "RegionName"); + RegionResultNodeList = doc.getElementsByTagNameNS(bd_ns, "RegionResult"); + + // Get the sum of the values of the regions. + var total = 0; + for (regionIndex = 0; regionIndex < regionCount; regionIndex++) + total = total + Number(RegionResultNodeList.item(regionIndex).firstChild.nodeValue); + + // Build a pie chart. + var startAngle = 0; + for (regionIndex = 0; regionIndex < regionCount; regionIndex++) { + regionName = RegionNameNodeList.item(regionIndex).firstChild.nodeValue; + regionResult = Number(RegionResultNodeList.item(regionIndex).firstChild.nodeValue); + + // Build the pie slice. + textElement = doc.createElementNS(svg_ns, "text"); + textNode = doc.createTextNode(regionName); + textElement.appendChild(textNode); + pathElement = doc.createElementNS(svg_ns, "path"); + + endAngle = startAngle - regionResult * Math.PI * 2 / total; + dAttribute = "M240,170 L"; + gray = Math.round(Number(255 * (regionIndex+2)) / (regionCount+2)); + midAngle = (startAngle + endAngle) / 2; + textElement.setAttributeNS(null, "x", Math.round(240+65*Math.cos(midAngle))); + textElement.setAttributeNS(null, "y", Math.round(170+65*Math.sin(midAngle))); + + dAttribute = dAttribute + Math.round(240+100*Math.cos(startAngle)); + dAttribute = dAttribute + ','; + dAttribute = dAttribute + Math.round(170+100*Math.sin(startAngle)); + dAttribute = dAttribute + ' A100,100 0 0,0 '; + dAttribute = dAttribute + Math.round(240+100*Math.cos(endAngle)); + dAttribute = dAttribute + ','; + dAttribute = dAttribute + Math.round(170+100*Math.sin(endAngle)); + dAttribute = dAttribute + 'z'; + pathElement.setAttributeNS(null, "d", dAttribute); + pathElement.setAttributeNS(null, "fill", "rgb("+gray+","+gray+","+gray+")"); + pathElement.setAttributeNS(null, "stroke", "black"); + pathElement.setAttributeNS(null, "stroke-width", "2"); + + // Temporary, for CSS styling. + pathElement.setAttributeNS(null, "fill", "rgb("+gray+","+gray+","+gray+")"); + pathElement.setAttributeNS(null, "stroke", "black"); + pathElement.setAttributeNS(null, "stroke-width", "2"); + + if (regionIndex == 0) { + var firstSliceOffset = 30; + var transformValue = "translate(" + + Math.round(firstSliceOffset * Math.cos(midAngle)) + + "," + + Math.round(firstSliceOffset * Math.sin(midAngle)) + + ")"; + pathElement.setAttributeNS(null, "transform", transformValue); + textElement.setAttributeNS(null, "transform", transformValue); + pathElement.setAttributeNS(null, "fill", "#FF6666"); + pathElement.setAttributeNS(null, "stroke", "#0000FF"); + pathElement.setAttributeNS(null, "stroke-width", "3"); + + // Temporary, for CSS styling. + pathElement.setAttributeNS(null, "fill", "#FF8888"); + pathElement.setAttributeNS(null, "stroke", "#0000FF"); + pathElement.setAttributeNS(null, "stroke-width", "3"); + + } + gElement.appendChild(pathElement); + gElement.appendChild(textElement); + startAngle = endAngle; + } + } + </script> + </defs> + <bd:Results id="results"> + <bd:Region> + <bd:RegionName>East</bd:RegionName> + <bd:RegionResult>3</bd:RegionResult> + </bd:Region> + <bd:Region> + <bd:RegionName>North</bd:RegionName> + <bd:RegionResult>4</bd:RegionResult> + </bd:Region> + <bd:Region> + <bd:RegionName>West</bd:RegionName> + <bd:RegionResult>5</bd:RegionResult> + </bd:Region> + <bd:Region> + <bd:RegionName>Central</bd:RegionName> + <bd:RegionResult>3.2</bd:RegionResult> + </bd:Region> + <bd:Region> + <bd:RegionName>South</bd:RegionName> + <bd:RegionResult>6</bd:RegionResult> + </bd:Region> + </bd:Results> + <text font-family="Arial" font-size="16" text-anchor="middle" x="240" y="30"> + Pie chart built from data in a different namespace. + </text> + </g> + <g id="PieParent" font-family="Arial" text-anchor="middle" font-size="14"> + <desc>Pie chart is built within this 'g' element</desc> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-background-01-f-manual.svg b/testing/web-platform/tests/svg/import/filters-background-01-f-manual.svg new file mode 100644 index 000000000..72510dd51 --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-background-01-f-manual.svg @@ -0,0 +1,159 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="ED" status="created" + version="$Revision: 1.2 $" testname="$RCSfile: filters-background-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#AccessingBackgroundImage"> + <p> + Test background image processing. + </p> + <p> + The first subtest enables background image processing and adds an empty ‘g’ element + which invokes the ShiftBGAndBlur filter. This filter takes the current accumulated + background image (i.e., the entire reference graphic) as input, shifts its offscreen + down, blurs it, and then writes the result to the canvas. Note that the offscreen for + the filter is initialized to transparent black, which allows the already rendered + rectangle, circle and triangle to show through after the filter renders its own + result to the canvas. + </p> + <p> + The second subtest enables background image processing and instead invokes the + ShiftBGAndBlur filter on the inner ‘g’ element. The accumulated background at the + time the filter is applied contains only the rectangle. Because the children + of the inner ‘g’ (i.e., the circle and triangle) are not part of the inner ‘g’ element's + background and because ShiftBGAndBlur ignores SourceGraphic, the children of the inner ‘g’ + do not appear in the result. + </p> + <p> + The third subtest enables background image processing and invokes the ShiftBGAndBlur on the + ‘polygon’ element that draws the triangle. The accumulated background at the time the filter + is applied contains the rectangle plus the circle ignoring the effect of the ‘opacity’ + property on the inner ‘g’ element. (Note that the blurred circle at the bottom does not + let the rectangle show through on its left side. This is due to ignoring the effect of + the ‘opacity’ property.) Because the triangle itself is not part of the accumulated background + and because ShiftBGAndBlur ignores SourceGraphic, the triangle does not appear in the result. + </p> + <p> + The fourth subtest is the same as the third except that filter ShiftBGAndBlur_WithSourceGraphic is + invoked instead of ShiftBGAndBlur. ShiftBGAndBlur_WithSourceGraphic performs the same effect as + ShiftBGAndBlur, but then renders the SourceGraphic on top of the shifted, blurred background + image. In this case, SourceGraphic is the blue triangle; thus, the result is the same as in + the fourth case except that the triangle now appears. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if: + </p> + <ul> + <li>each blue rectangle has the same shapes twice inside, once without filters applied, once with (blurred)</li> + <li>from left to right, the blue rectangles contain the following shapes: [rectangle, circle, triangle], [rectangle], [rectangle, circle], [rectangle, circle, triangle]</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-background-01-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <filter id="ShiftBGAndBlur" filterUnits="userSpaceOnUse" x="0" y="0" width="1200" height="400"> + <desc> + This filter discards the SourceGraphic, if any, and just produces + a result consisting of the BackgroundImage shifted down 125 units + and then blurred. + </desc> + <feOffset in="BackgroundImage" dx="0" dy="125" /> + <feGaussianBlur stdDeviation="8" /> + </filter> + <filter id="ShiftBGAndBlur_WithSourceGraphic" + filterUnits="userSpaceOnUse" x="0" y="0" width="1200" height="400"> + <desc> + This filter takes the BackgroundImage, shifts it down 125 units, blurs it, + and then renders the SourceGraphic on top of the shifted/blurred background. + </desc> + <feOffset in="BackgroundImage" dx="0" dy="125" /> + <feGaussianBlur stdDeviation="8" result="blur" /> + <feMerge> + <feMergeNode in="blur"/> + <feMergeNode in="SourceGraphic"/> + </feMerge> + </filter> + </defs> + + <g transform="scale(0.4) translate(-200 300)"> + <g enable-background="new" transform="translate(270,0)"> + <desc>The second adds an empty 'g' element which invokes ShiftBGAndBlur.</desc> + <rect x="25" y="25" width="100" height="100" fill="fuchsia"/> + <g opacity=".5"> + <circle cx="125" cy="75" r="45" fill="#D3FF00"/> + <polygon points="160,25 160,125 240,75" fill="#7A16FF"/> + </g> + <g filter="url(#ShiftBGAndBlur)"/> + <rect x="5" y="5" width="260" height="260" fill="none" stroke="blue"/> + </g> + + <g enable-background="new" transform="translate(540,0)"> + <desc>The third invokes ShiftBGAndBlur on the inner group.</desc> + <rect x="25" y="25" width="100" height="100" fill="fuchsia"/> + <g filter="url(#ShiftBGAndBlur)" opacity=".5"> + <circle cx="125" cy="75" r="45" fill="#D3FF00"/> + <polygon points="160,25 160,125 240,75" fill="#7A16FF"/> + </g> + <rect x="5" y="5" width="260" height="260" fill="none" stroke="blue"/> + </g> + + <g enable-background="new" transform="translate(810,0)"> + <desc>The fourth invokes ShiftBGAndBlur on the triangle.</desc> + <rect x="25" y="25" width="100" height="100" fill="fuchsia"/> + <g opacity=".5"> + <circle cx="125" cy="75" r="45" fill="#D3FF00"/> + <polygon points="160,25 160,125 240,75" fill="#7A16FF" + filter="url(#ShiftBGAndBlur)"/> + </g> + <rect x="5" y="5" width="260" height="260" fill="none" stroke="blue"/> + </g> + + <g enable-background="new" transform="translate(1080,0)"> + <desc>The fifth invokes ShiftBGAndBlur_WithSourceGraphic on the triangle.</desc> + <rect x="25" y="25" width="100" height="100" fill="fuchsia"/> + <g opacity=".5"> + <circle cx="125" cy="75" r="45" fill="#D3FF00"/> + <polygon points="160,25 160,125 240,75" fill="#7A16FF" + filter="url(#ShiftBGAndBlur_WithSourceGraphic)"/> + </g> + <rect x="5" y="5" width="260" height="260" fill="none" stroke="blue"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-blend-01-b-manual.svg b/testing/web-platform/tests/svg/import/filters-blend-01-b-manual.svg new file mode 100644 index 000000000..685a59ee5 --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-blend-01-b-manual.svg @@ -0,0 +1,108 @@ +<svg version="1.1" baseProfile="basic" preserveAspectRatio="xMidYMid meet" zoomAndPan="magnify" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: filters-blend-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feBlendElement"> + <p> + Verify correct operation of the five compositing modes + of the feBlend filter primitive. Seven rectangles are + blended into a gradient, with text strings identifying + which of the the five feBlend modes were used. + </p> + <p> + All rectangles but the fourth one have a blue fill, although the + blend mode will adjust this color. The fourth has a yellow fill. + </p> + <p> + The third and fourth rectangles are grouped and the filter is applied to the group. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image + exactly, except for possible variations in the + labelling text (per CSS2 rules). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-blend-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-size="9" transform="scale(3)"> + <image x="40" y="5" width="100" height="98" preserveAspectRatio="none" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAAABCAMAAAAfBfuPAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAEsUExURfb/AK3/AAD/9/9sAIn/AN7/ABT/AAB//zD/AP9GAAD/s1H/AAD/H/8AxwD/bn8A/1wA/wD/XJv/AP8Ai//MAGP/ABMA/wD/LP8A6P8KAP8AF/8A9QD/xAAA/wD1/9MA/wD/gABY/wD/Cf8ATJEA//+6AACT/wCn/+v/AAD/TAD/kf8AYKMA//8kAAAk/wAV/y0A/3b/AP80AAD/O/cA//8A/wD///8An/8A2QD/Ev8AAMQA/+0A/7MA////AP8ACuAA//8AJ24A/0sA//8AOAA0/wAK/wBF//8WAAgA/x8A///2AL//AP8AdTwA/wn/AP/bAP+AAP+UAM//AP+nAP8AtADp/wD/o0D/AP/qAADb/wC5/wDL/wD/AAD/7QD/0gD/4CH/AABr//9ZAG2IeB4AAABvSURBVHjaYrCyl3J0Udb2FTYP5bWQkDY1sXGQt7bVUeF3EnD2M/AS85R109dzdVdMYldTj46JCpMzY4pLiJfhCtdS4BPUNBbnsVSK9WdL5IjgFjVkEWL0CWbVYLDzjgwQUQ0JCmRO5jTS9ZAECDAA3aQTV3E5iioAAAAASUVORK5CYII="/> + <defs> + <filter id="BlendNormal" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feFlood in="BackgroundAlpha" flood-color="#0f0" flood-opacity="0.5" result="img1"/> + <feBlend in2="img1" in="SourceGraphic" mode="normal"/> + </filter> + <filter id="BlendMultiply" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feFlood in="SourceGraphic" flood-color="#0f0" flood-opacity="0.5" result="img2"/> + <feBlend in="SourceGraphic" in2="img2" mode="multiply"/> + </filter> + <filter id="BlendScreen" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feFlood in="SourceGraphic" flood-color="#0f0" flood-opacity="0.5" result="img2"/> + <feBlend in="SourceGraphic" in2="img2" mode="screen"/> + </filter> + <filter id="BlendDarken" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feFlood in="SourceGraphic" flood-color="#0f0" flood-opacity="0.5" result="img2"/> + <feBlend in="SourceGraphic" in2="img2" mode="darken"/> + </filter> + <filter id="BlendLighten" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feFlood in="SourceGraphic" flood-color="#0f0" flood-opacity="0.5" result="img2"/> + <feBlend in="SourceGraphic" in2="img2" mode="lighten"/> + </filter> + </defs> + <rect x="30" y="10" width="120" height="10" fill="blue" opacity="0.5" filter="url(#BlendNormal)"/> + <rect x="30" y="23" width="120" height="10" fill="blue" opacity="0.5" filter="url(#BlendMultiply)"/> + <g filter="url(#BlendMultiply)"> + <rect x="30" y="36" width="120" height="10" fill="blue" opacity="0.5"/> + <rect x="30" y="49" width="120" height="10" fill="#ff0" opacity="0.5"/> + </g> + <rect x="30" y="62" width="120" height="10" fill="blue" opacity="0.5" filter="url(#BlendScreen)"/> + <rect x="30" y="75" width="120" height="10" fill="blue" opacity="0.5" filter="url(#BlendDarken)"/> + <rect x="30" y="88" width="120" height="10" fill="blue" opacity="0.5" filter="url(#BlendLighten)"/> + <g fill="#333" font-size="7"> + <text x="5" y="17">Normal</text> + <text x="5" y="30">Multiply</text> + <text x="5" y="43">Multiply</text> + <text x="5" y="56">Multiply</text> + <text x="5" y="69">Screen</text> + <text x="5" y="82">Darken</text> + <text x="5" y="95">Lighten</text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-color-01-b-manual.svg b/testing/web-platform/tests/svg/import/filters-color-01-b-manual.svg new file mode 100644 index 000000000..53b993a0e --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-color-01-b-manual.svg @@ -0,0 +1,112 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: filters-color-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feColorMatrixElement"> + <p> + Test which verifies the basic facilities of + feColorMatrix. + </p> + <p> + This test uses the following elements : a nested + <svg> with a viewBox attribute, <linearGradient>, + <filter>, <feColorMatrix>, <feComposite>. + </p> + <p> + The test case shows five rectangles filled with a + gradient showing the effects of feColorMatrix: an + unfiltered rectangle acting as a reference, use of the + feColorMatrix matrix option to convert to grayscale, + use of the feColorMatrix saturate option, use of the + feColorMatrix hueRotate option, and use of the + feColorMatrix luminanceToAlpha option. + </p> + <p> + The test is somewhat self-explanatory as the strings + document the type of feColorMatrix operation that is + being used. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image + exactly, except for possible variations in the + labelling text (per CSS2 rules). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-color-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <svg xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="-10" y="5" width="500" height="290" viewBox="0 0 800 500"> + <title>Example feColorMatrix - Examples of feColorMatrix operations</title> + <desc>Five rectangles filled with a gradient showing the effects of feColorMatrix: an unfiltered rectangle acting as a reference, use of the feColorMatrix matrix option to convert to grayscale, use of the feColorMatrix saturate option, use of the feColorMatrix hueRotate option, and use of the feColorMatrix luminanceToAlpha option.</desc> + <defs> + <linearGradient id="MyGradient" gradientUnits="userSpaceOnUse" x1="20" y1="0" x2="760" y2="0"> + <stop offset="0" stop-color="#dd00dd"/> + <stop offset=".33" stop-color="#22cc22"/> + <stop offset=".67" stop-color="#400000"/> + <stop offset="1" stop-color="#a0a0ff"/> + </linearGradient> + <filter id="Matrix" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feColorMatrix type="matrix" in="SourceGraphic" values=".33 .33 .33 0 0 .33 .33 .33 0 0 .33 .33 .33 0 0 .33 .33 .33 0 0"/> + </filter> + <filter id="Saturate40" filterUnits="objectBoundingBox" x="-5%" y="-5%" width="110%" height="110%"> + <feColorMatrix type="saturate" in="SourceGraphic" values=".25"/> + </filter> + <filter id="HueRotate90" filterUnits="objectBoundingBox" x="-5%" y="-5%" width="110%" height="110%"> + <feColorMatrix type="hueRotate" in="SourceGraphic" values="90"/> + </filter> + <filter id="LuminanceToAlpha" filterUnits="objectBoundingBox" x="-5%" y="-5%" width="110%" height="110%"> + <feColorMatrix type="luminanceToAlpha" in="SourceGraphic" result="a"/> + <feComposite in="SourceGraphic" in2="a" operator="in"/> + </filter> + </defs> + <g font-size="40" font-family="Verdana"> + <rect fill="none" stroke="blue" x="1" y="1" width="798" height="498"/> + <rect x="20" y="20" width="760" height="40" fill="url(#MyGradient)"/> + <text x="20" y="95">Unfiltered</text> + <rect x="20" y="120" width="760" height="40" fill="url(#MyGradient)" filter="url(#Matrix)"/> + <text x="20" y="195">type="matrix" (grayscale matrix)</text> + <rect x="20" y="220" width="760" height="40" fill="url(#MyGradient)" filter="url(#Saturate40)"/> + <text x="20" y="295">type="saturate" values=".4"</text> + <rect x="20" y="320" width="760" height="40" fill="url(#MyGradient)" filter="url(#HueRotate90)"/> + <text x="20" y="395">type="hueRotate" values="90"</text> + <rect x="20" y="420" width="760" height="40" fill="url(#MyGradient)" filter="url(#LuminanceToAlpha)"/> + <text x="20" y="495">type="luminanceToAlpha"</text> + </g> + </svg> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-color-02-b-manual.svg b/testing/web-platform/tests/svg/import/filters-color-02-b-manual.svg new file mode 100644 index 000000000..ac399b980 --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-color-02-b-manual.svg @@ -0,0 +1,112 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="AG" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: filters-color-02-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feColorMatrixElement"> + <p> + Tests the default behaviour of feComponentTransfer + </p> + <p> + The test displays two rects with the same gradient fill. The gradient + fill has the stops red, green, blue and black all of which are evenly + spaced. + </p> + <p> + The first rect with the 'Reference' label beneath it has an + feComponentTransfer filter applied to it. This filter specifies a + 'linear' transform for the Red component such that Red is transformed to + Black. The Green component is specified as an 'identity' transform. The + remaining components (Green, Alpha) are unspecified and by default + must be treated as 'identity' transforms. + </p> + <p> + The second rect with the 'Default' label beneath it has an + feComponentTransfer filter applied to it. This filter specifies a + multiple transforms from the Red component. The last transform + specified for the Red component is a 'linear' transform that shifts Red + to Black. This is the transform that should be used by a conforming + implementation. There are no other components specified for the filter + of the second rect. A conforming implementation should treat + unspecified components in an feComponentTransfer as 'identity'. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + For this test to pass both rects must have a gradient fill that has the + stop colors Black, Green, Blue and Black, equally spaced. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-color-02-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <linearGradient id="MyGradient" gradientUnits="objectBoundingBox" x1="0" y1="0" x2="1" y2="0"> + <stop offset="0" stop-color="#ff0000"/> + <stop offset=".33" stop-color="#00ff00"/> + <stop offset=".67" stop-color="#0000ff"/> + <stop offset="1" stop-color="#000000"/> + </linearGradient> + + <filter id="Reference" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feComponentTransfer> + <feFuncR type="linear" slope="0" intercept="0"/> + <feFuncG type="identity"/> + </feComponentTransfer> + </filter> + + <filter id="Default" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <!-- Red becomes black, green/blue/alpha use the identity function, + since erratum specifies omitted functions are the identity + function, and duplicated ones take the last one. --> + <feComponentTransfer> + <feFuncR type="identity"/> + <feFuncR type="linear" slope="0" intercept="1"/> + <feFuncR type="linear" slope="0" intercept="0"/> + </feComponentTransfer> + </filter> + </defs> + + <g fill="url(#MyGradient)"> + <rect x="20" y="40" width="440" height="40" filter="url(#Reference)"/> + <rect x="20" y="140" width="440" height="40" filter="url(#Default)"/> + </g> + + <g font-family="Verdana" font-size="20" font-weight="bold"> + <text x="40" y="100">Reference</text> + <text x="40" y="200">Default</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-composite-02-b-manual.svg b/testing/web-platform/tests/svg/import/filters-composite-02-b-manual.svg new file mode 100644 index 000000000..23e4b9adf --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-composite-02-b-manual.svg @@ -0,0 +1,203 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: filters-composite-02-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feCompositeElement"> + <p> + Test which verifies the basic facilities of feComposite. + </p> + <p> + This test uses the following elements: <path>, <filter> + <feImage> <feComposite>. + </p> + <p> + The test case shows six pairs of overlapping triangles + depicting the six different feComposite operators. The + first row shows compositing when both triangles have + opacity=1. The second row shows compositing when both + triangles have opacity=.5. The six columns illustrate the + six types of compositing operations. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image + exactly, except for possible variations in the + labelling text (per CSS2 rules). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-composite-02-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="translate(15 -60)"> + <title>Example feComposite - Examples of feComposite operations</title> + <desc>Six pairs of overlapping triangles depicting the six different feComposite operators.</desc> + <defs> + <path id="Blue100" d="M 0 0 L 150 0 L 150 150 z" fill="#00ffff"/> + <path id="Red100" d="M 0 0 L 0 150 L 150 0 z" fill="#ff00ff"/> + <path id="Blue50" d="M 0 0 L 150 0 L 150 150 z" fill="#00ffff" fill-opacity="0.5"/> + <path id="Red50" d="M 0 0 L 0 150 L 150 0 z" fill="#ff00ff" fill-opacity="0.5"/> + + <filter id="over" x="0" y="0" width="1" height="1"> + <feImage xlink:href="#Blue100" result="blue"/> + <feImage xlink:href="#Red100" result="red"/> + <feComposite in2="blue" in="red" operator="over"/> + </filter> + + <filter id="over50" x="0" y="0" width="1" height="1"> + <feImage xlink:href="#Blue50" result="blue"/> + <feImage xlink:href="#Red50" result="red"/> + <feComposite in2="blue" in="red" operator="over"/> + </filter> + + <filter id="in" x="0" y="0" width="1" height="1"> + <feImage xlink:href="#Blue100" result="blue"/> + <feImage xlink:href="#Red100" result="red"/> + <feComposite in2="blue" in="red" operator="in"/> + </filter> + + <filter id="in50" x="0" y="0" width="1" height="1"> + <feImage xlink:href="#Blue50" result="blue"/> + <feImage xlink:href="#Red50" result="red"/> + <feComposite in2="blue" in="red" operator="in"/> + </filter> + + <filter id="out" x="0" y="0" width="1" height="1"> + <feImage xlink:href="#Blue100" result="blue"/> + <feImage xlink:href="#Red100" result="red"/> + <feComposite in2="blue" in="red" operator="out"/> + </filter> + + <filter id="out50" x="0" y="0" width="1" height="1"> + <feImage xlink:href="#Blue50" result="blue"/> + <feImage xlink:href="#Red50" result="red"/> + <feComposite in2="blue" in="red" operator="out"/> + </filter> + + <filter id="atop" x="0" y="0" width="1" height="1"> + <feImage xlink:href="#Blue100" result="blue"/> + <feImage xlink:href="#Red100" result="red"/> + <feComposite in2="blue" in="red" operator="atop"/> + </filter> + + <filter id="atop50" x="0" y="0" width="1" height="1"> + <feImage xlink:href="#Blue50" result="blue"/> + <feImage xlink:href="#Red50" result="red"/> + <feComposite in2="blue" in="red" operator="atop"/> + </filter> + + <filter id="xor" x="0" y="0" width="1" height="1"> + <feImage xlink:href="#Blue100" result="blue"/> + <feImage xlink:href="#Red100" result="red"/> + <feComposite in2="blue" in="red" operator="xor"/> + </filter> + + <filter id="xor50" x="0" y="0" width="1" height="1"> + <feImage xlink:href="#Blue50" result="blue"/> + <feImage xlink:href="#Red50" result="red"/> + <feComposite in2="blue" in="red" operator="xor"/> + </filter> + + <filter id="arithmetic" x="0" y="0" width="1" height="1"> + <feImage xlink:href="#Blue100" result="blue"/> + <feImage xlink:href="#Red100" result="red"/> + <feComposite in2="blue" in="red" operator="arithmetic" k1=".5" k2=".5" k3=".5" k4=".5"/> + </filter> + + <filter id="arithmetic50" x="0" y="0" width="1" height="1"> + <feImage xlink:href="#Blue50" result="blue"/> + <feImage xlink:href="#Red50" result="red"/> + <feComposite in2="blue" in="red" operator="arithmetic" k1=".5" k2=".5" k3=".5" k4=".5"/> + </filter> + </defs> + <g font-family="Verdana" font-size="60" shape-rendering="crispEdges" transform="translate(5,70) scale(.4)"> + <rect fill="none" stroke="blue" x="1" y="1" width="1098" height="723"/> + <text x="100" y="75">on first Row : opacity 1.0</text> + <text x="100" y="180">on second row opacity 0.5</text> + + <g transform="translate(15,230)"> + <rect x="0" y="0" width="150" height="150" filter="url(#over)"/> + <text x="10" y="400">over</text> + </g> + + <g transform="translate(15,430)"> + <rect x="0" y="0" width="150" height="150" filter="url(#over50)"/> + </g> + + <g transform="translate(195,230)"> + <rect x="0" y="0" width="150" height="150" filter="url(#in)"/> + <text x="10" y="400">in</text> + </g> + + <g transform="translate(195,430)"> + <rect x="0" y="0" width="150" height="150" filter="url(#in50)"/> + </g> + + <g transform="translate(375,230)"> + <rect x="0" y="0" width="150" height="150" filter="url(#out)"/> + <text x="10" y="400">out</text> + </g> + <g transform="translate(375,430)"> + <rect x="0" y="0" width="150" height="150" filter="url(#out50)"/> + </g> + + <g transform="translate(555,230)"> + <rect x="0" y="0" width="150" height="150" filter="url(#atop)"/> + <text x="10" y="400">atop</text> + </g> + <g transform="translate(555,430)"> + <rect x="0" y="0" width="150" height="150" filter="url(#atop50)"/> + </g> + + <g transform="translate(735,230)"> + <rect x="0" y="0" width="150" height="150" filter="url(#xor)"/> + <text x="10" y="400">xor</text> + </g> + <g transform="translate(735,430)"> + <rect x="0" y="0" width="150" height="150" filter="url(#xor50)"/> + </g> + <g transform="translate(915,230)"> + <rect x="0" y="0" width="150" height="150" filter="url(#arithmetic)"/> + <text x="-25" y="400">arith-</text> + <text x="-25" y="470">metic</text> + </g> + <g transform="translate(915,430)"> + <rect x="0" y="0" width="150" height="150" filter="url(#arithmetic50)"/> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-composite-03-f-manual.svg b/testing/web-platform/tests/svg/import/filters-composite-03-f-manual.svg new file mode 100644 index 000000000..39c9dca9e --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-composite-03-f-manual.svg @@ -0,0 +1,87 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="ED" status="accepted" + version="$Revision: 1.4 $" testname="$RCSfile: filters-composite-03-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feCompositeElement"> + <p> + Tests the arithmetic operator in feComposite. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there are four filled squares visible, and the + fill color matches the respective reference stroke exactly. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-composite-03-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <filter id="composite-ident" x="0" y="0" width="1" height="1"> + <feComposite operator="arithmetic" in="FillPaint" in2="StrokePaint" k1="0" k2="1" k3="-1" k4="0"/> + </filter> + <filter id="composite-negative" x="0" y="0" width="1" height="1"> + <feComposite operator="arithmetic" in="FillPaint" in2="FillPaint" k1="0" k2="2" k3="-1.5" k4="0"/> + </filter> + <filter id="composite-mixed" x="0" y="0" width="1" height="1"> + <feComposite operator="arithmetic" in="FillPaint" in2="StrokePaint" k1="1" k2="-0.5" k3="0.2" k4="-0.1"/> + </filter> + <filter id="composite-clamped" x="0" y="0" width="1" height="1"> + <feComposite operator="arithmetic" in="FillPaint" in2="StrokePaint" k1="0" k2="10" k3="20" k4="0"/> + </filter> + </defs> + + <g transform="translate(100 30)"> + <rect id="reference1" fill="lime" width="120" height="120"/> + <rect fill="red" stroke="red" filter="url(#composite-ident)" x="10" y="10" width="100" height="100"/> + </g> + <g transform="translate(250 30)"> + <rect fill="#0F0" filter="url(#composite-negative)" x="10" y="10" width="100" height="100"/> + <rect id="reference2" stroke="#7FFF7F" x="5" y="5" width="110" height="110" stroke-width="12" fill="none"/> + </g> + <g transform="translate(100 180)"> + <rect fill="rgb(43,17,12)" stroke="rgb(32,42,37)" filter="url(#composite-mixed)" x="10" y="10" width="100" height="100"/> + <rect id="reference3" stroke="#666" x="5" y="5" width="110" height="110" stroke-width="12" fill="none"/> + </g> + <g transform="translate(250 180)"> + <rect fill="rgb(0,127,0)" stroke="rgb(0,0,127)" filter="url(#composite-clamped)" x="10" y="10" width="100" height="100"/> + <rect id="reference4" stroke="rgb(0,255,255)" x="5" y="5" width="110" height="110" stroke-width="12" fill="none"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-composite-04-f-manual.svg b/testing/web-platform/tests/svg/import/filters-composite-04-f-manual.svg new file mode 100644 index 000000000..78404f10e --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-composite-04-f-manual.svg @@ -0,0 +1,78 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="[author]" status="empty" + version="$Revision: 1.1 $" testname="$RCSfile: filters-composite-04-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feCompositeElement"> + <p> + Test feComposite and the arithmetic operator to implement a simple dissolve operation. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if there are four images visible, each in + different stages of dissolving the bird in the foreground into the + tree in the background. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-composite-04-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <filter id="dissolve1" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/stefan_252_tRNS_opti.png" result="bird"/> + <feComposite operator="arithmetic" in="SourceGraphic" in2="bird" k1="0" k2="0.5" k3="0.5" k4="0"/> + </filter> + <filter id="dissolve2" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/stefan_252_tRNS_opti.png" result="bird"/> + <feComposite operator="arithmetic" in="SourceGraphic" in2="bird" k1="0" k2="0.1" k3="0.9" k4="0"/> + </filter> + <filter id="dissolve3" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/stefan_252_tRNS_opti.png" result="bird"/> + <feComposite operator="arithmetic" in="SourceGraphic" in2="bird" k1="0" k2="0.75" k3="0.25" k4="0"/> + </filter> + <filter id="dissolve4" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/stefan_252_tRNS_opti.png" result="bird"/> + <feComposite operator="arithmetic" in="SourceGraphic" in2="bird" k1="0" k2="0.25" k3="0.75" k4="0"/> + </filter> + </defs> + + <image width="120" height="80" xlink:href="../images/tree.jpg" filter="url(#dissolve1)" transform="translate(100 80)"/> + <image width="120" height="80" xlink:href="../images/tree.jpg" filter="url(#dissolve2)" transform="translate(250 80)"/> + <image width="120" height="80" xlink:href="../images/tree.jpg" filter="url(#dissolve3)" transform="translate(100 190)"/> + <image width="120" height="80" xlink:href="../images/tree.jpg" filter="url(#dissolve4)" transform="translate(250 190)"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.1 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-composite-05-f-manual.svg b/testing/web-platform/tests/svg/import/filters-composite-05-f-manual.svg new file mode 100644 index 000000000..0d4ffe8e4 --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-composite-05-f-manual.svg @@ -0,0 +1,68 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="ED" status="created" + version="$Revision: 1.1 $" testname="$RCSfile: filters-composite-05-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feCompositeElement"> + <p> + Testing the feComposite element and that the 'k2' and 'k3' attributes + are animatable. The result is an animated dissolve between two images. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Reload the testcase or click the image to run animation again. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if there is an animation effect that gradually + dissolves a photo of a tree into an image of a bird over the course + of two seconds. The final result is that the bird is fully visible + and the tree photo is invisible. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-composite-05-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <filter id="dissolve" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/stefan_252_tRNS_opti.png" result="bird"/> + <feComposite operator="arithmetic" in="SourceGraphic" in2="bird" k1="0" k2="1" k3="0" k4="0"> + <animate attributeName="k2" values="1;0" dur="2" begin="0s;image.click" fill="freeze"/> + <animate attributeName="k3" values="0;1" dur="2" begin="0s;image.click" fill="freeze"/> + </feComposite> + </filter> + </defs> + + <image id="image" width="320" height="160" xlink:href="../images/tree.jpg" filter="url(#dissolve)" transform="translate(80 80)"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.1 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-comptran-01-b-manual.svg b/testing/web-platform/tests/svg/import/filters-comptran-01-b-manual.svg new file mode 100644 index 000000000..4f94d9412 --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-comptran-01-b-manual.svg @@ -0,0 +1,126 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: filters-comptran-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feComponentTransferElement"> + <p> + Test which verifies the basic facilities of + feComponentTransfer. + </p> + <p> + This test uses the following elements : a nested <svg> + with a viewBox attribute, <linearGradient>, <filter>, + <feComponentTransfer>. + </p> + <p> + The test case shows four rectangles filled with a + gradient showing the effects of feComponentTransfer: an + identity function acting as a reference, use of the + feComponentTransfer table option, use of the + feComponentTransfer linear option, and use of the + feComponentTransfer gamma option. + </p> + <p> + The test is somewhat self-explanatory as the strings + document the type of feComponentTransfer operation that + is being used. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image + exactly, except for possible variations in the + labelling text (per CSS2 rules). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-comptran-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <svg xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="15" y="5" width="450" height="300" viewBox="0 0 630 420"> + <title>Example feComponentTransfer - Examples of feComponentTransfer operations</title> + <desc>Four rectangles filled with a gradient showing the effects of feComponentTransfer: an identity function acting as a reference, use of the feComponentTransfer table option, use of the feComponentTransfer linear option, and use of the feComponentTransfer gamma option.</desc> + <defs> + <linearGradient id="MyGradient" gradientUnits="userSpaceOnUse" x1="10" y1="0" x2="590" y2="0"> + <stop offset="0" stop-color="#ff0000"/> + <stop offset=".33" stop-color="#00ff00"/> + <stop offset=".67" stop-color="#0000ff"/> + <stop offset="1" stop-color="#000000"/> + </linearGradient> + <filter id="Identity" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feComponentTransfer> + <feFuncR type="identity"/> + <feFuncG type="identity"/> + <feFuncB type="identity"/> + <feFuncA type="identity"/> + </feComponentTransfer> + </filter> + <filter id="Table" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feComponentTransfer> + <feFuncR type="table" tableValues="0 0 1 1"/> + <feFuncG type="table" tableValues="1 1 0 0"/> + <feFuncB type="table" tableValues="0 1 1 0"/> + </feComponentTransfer> + </filter> + <filter id="Linear" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feComponentTransfer> + <feFuncR type="linear" slope=".5" intercept=".25"/> + <feFuncG type="linear" slope=".5" intercept="0"/> + <feFuncB type="linear" slope=".5" intercept=".5"/> + </feComponentTransfer> + </filter> + <filter id="Gamma" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feComponentTransfer> + <feFuncR type="gamma" amplitude="2" exponent="5" offset="0"/> + <feFuncG type="gamma" amplitude="2" exponent="3" offset="0"/> + <feFuncB type="gamma" amplitude="2" exponent="1" offset="0"/> + </feComponentTransfer> + </filter> + </defs> + <rect fill="none" stroke="blue" x="1" y="1" width="628" height="418"/> + <g font-size="30" font-family="Verdana"> + <rect fill="none" stroke="blue" x="1" y="1" width="628" height="418"/> + <rect x="10" y="10" width="580" height="40" fill="url(#MyGradient)" filter="url(#Identity)"/> + <text x="10" y="80">type: identity</text> + <rect x="10" y="110" width="580" height="40" fill="url(#MyGradient)" filter="url(#Table)"/> + <text x="10" y="180">type: table</text> + <rect x="10" y="210" width="580" height="40" fill="url(#MyGradient)" filter="url(#Linear)"/> + <text x="10" y="280">type:linear slope:.5 intercepts:.25/0/.5</text> + <rect x="10" y="310" width="580" height="40" fill="url(#MyGradient)" filter="url(#Gamma)"/> + <text x="10" y="380">type: gamma ampl:2 exponents:5/3/1</text> + </g> + </svg> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-conv-01-f-manual.svg b/testing/web-platform/tests/svg/import/filters-conv-01-f-manual.svg new file mode 100644 index 000000000..3ca53f6bb --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-conv-01-f-manual.svg @@ -0,0 +1,112 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: filters-conv-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feConvolveMatrixElement"> + <p> + Test which verifies the basic facilities of + feConvolveMatrix. + </p> + <p> + This test defines six filters that exercise traditional + convolutions: uniform blur, vertical and horizontal + blurs, edge detection, embossing and sharpening. Note + that the edge detection filter produces a fully + transparent image because the alpha channel is convolved + and produces 0 values. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image + exactly, except for possible variations in the + labelling text (per CSS2 rules). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-conv-01-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="12"> + <!--Generated by the Java 2D API Graphics2D SVG Generator, Sun Microsystems Inc.--> + <g transform="translate(20, 40)"> + <defs id="defs1"> + <filter id="convolve1" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feConvolveMatrix order="3 3" kernelMatrix="0.1111 0.1111 0.1111 0.1111 0.1111 0.1111 0.1111 0.1111 0.1111" edgeMode="none"/> + </filter> + <filter id="convolve2" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feConvolveMatrix order="3 3" kernelMatrix="-1 -1 -1 -1 8 -1 -1 -1 -1" edgeMode="duplicate"/> + </filter> + <filter id="convolve3" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feConvolveMatrix order="3 3" kernelMatrix="-1 -1 -1 -1 9 -1 -1 -1 -1" edgeMode="none"/> + </filter> + <filter id="convolve4" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feConvolveMatrix order="3 3" kernelMatrix="-2 0 0 0 1 0 0 0 2" edgeMode="none"/> + </filter> + <filter id="convolve5" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feConvolveMatrix order="3 1" kernelMatrix="0.3333 0.3333 0.3333" edgeMode="none"/> + </filter> + <filter id="convolve6" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feConvolveMatrix order="1 3" kernelMatrix="0.3333 0.3333 0.3333" edgeMode="none"/> + </filter> + </defs> + <g shape-rendering="geometricPrecision" text-rendering="geometricPrecision"> + <text x="10" y="20" stroke="none" opacity="1" filter="none">Blur (3x3)</text> + <g opacity="1" filter="none"> + <image width="50" height="63" xlink:href="../images/filters-conv-01-f.includeimage.png" x="10" y="30" filter="url(#convolve1)"/> + </g> + <text x="10" y="20" transform="translate(150,0)" stroke="none" opacity="1" filter="none">Edge Detection (3x3)</text> + <g transform="translate(150,0)" opacity="1" filter="none"> + <image width="50" height="63" xlink:href="../images/filters-conv-01-f.includeimage.png" x="10" y="30" filter="url(#convolve2)"/> + </g> + <text x="10" y="20" transform="translate(300,0)" stroke="none" opacity="1" filter="none">Sharpening (3x3)</text> + <g transform="translate(300,0)" opacity="1" filter="none"> + <image width="50" height="63" xlink:href="../images/filters-conv-01-f.includeimage.png" x="10" y="30" filter="url(#convolve3)"/> + </g> + <text x="10" y="20" transform="translate(0,93)" stroke="none" opacity="1" filter="none">Embossing (3x3)</text> + <g transform="translate(0,93)" opacity="1" filter="none"> + <image width="50" height="63" xlink:href="../images/filters-conv-01-f.includeimage.png" x="10" y="30" filter="url(#convolve4)"/> + </g> + <text x="10" y="20" transform="translate(150,93)" stroke="none" opacity="1" filter="none">Horizontal blur (3x1)</text> + <g transform="translate(150,93)" opacity="1" filter="none"> + <image width="50" height="63" xlink:href="../images/filters-conv-01-f.includeimage.png" x="10" y="30" filter="url(#convolve5)"/> + </g> + <text x="10" y="20" transform="translate(300,93)" stroke="none" opacity="1" filter="none">Vertical blur (1x3)</text> + <g transform="translate(300,93)" opacity="1" filter="none"> + <image width="50" height="63" xlink:href="../images/filters-conv-01-f.includeimage.png" x="10" y="30" filter="url(#convolve6)"/> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-conv-02-f-manual.svg b/testing/web-platform/tests/svg/import/filters-conv-02-f-manual.svg new file mode 100644 index 000000000..5912f422b --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-conv-02-f-manual.svg @@ -0,0 +1,77 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="CM" author="ED" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: filters-conv-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feConvolveMatrixElementOrderAttribute"> + <p> + Tests feConvolveMatrix with different values for the 'order' attribute. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required. + + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>You should see three filtered images. Each image is the same + and has the same filter applied to it. + The test has passed if all the three filtered images look the same, and the filtered result shows bright white edges on a dark background. + The rendered picture should match the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-conv-02-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <filter id="convolve-without-order" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feConvolveMatrix kernelMatrix="1 1 1 1 -8 1 1 1 1" preserveAlpha="true"/> + </filter> + <filter id="convolve-with-order1" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feConvolveMatrix order="3" kernelMatrix="1 1 1 1 -8 1 1 1 1" preserveAlpha="true"/> + </filter> + <filter id="convolve-with-order2" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feConvolveMatrix order="3 3" kernelMatrix="1 1 1 1 -8 1 1 1 1" preserveAlpha="true"/> + </filter> + </defs> + + <text x="50%" y="3em" style="font-size:18px; text-anchor:middle">feConvolveMatrix 'order' attribute</text> + + <image x="90" y="100" width="100" height="100" xlink:href="../images/image1.jpg" filter="url(#convolve-without-order)"/> + <text x="135" y="220" style="font-size:9px; text-anchor:middle">without order</text> + + <image x="190" y="100" width="100" height="100" xlink:href="../images/image1.jpg" filter="url(#convolve-with-order1)"/> + <text x="235" y="220" style="font-size:9px; text-anchor:middle">order="3"</text> + + <image x="290" y="100" width="100" height="100" xlink:href="../images/image1.jpg" filter="url(#convolve-with-order2)"/> + <text x="335" y="220" style="font-size:9px; text-anchor:middle">order="3 3"</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-conv-03-f-manual.svg b/testing/web-platform/tests/svg/import/filters-conv-03-f-manual.svg new file mode 100644 index 000000000..cb9d8448e --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-conv-03-f-manual.svg @@ -0,0 +1,102 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="CM" owner="ED" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: filters-conv-03-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/#feConvolveMatrixElementOrderAttribute"> + <p> + Tests the 'in1' DOM attribute on 'feConvolveMatrix'. + </p> + <p> + Load the testcase, you should see three nearly identical images that say "FAIL". + After 3 seconds all three images should be replaced by the same image of a bird. + The two images to the right have filters applied, while the one on the left is always unfiltered. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if: + </p> + <ul> + <li>the two images inside the blue rects look exactly the same</li> + <li>the same base image is used in all three rects</li> + <li>the purple image that says "FAIL" is replaced after 3 seconds by an image of a bird</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-conv-03-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <filter id="sharpenAnim" x="0" y="0" width="100%" height="100%"> + <feImage xlink:href="../images/stefan_252_tRNS_opti.png" result="passimg"/> + <feConvolveMatrix in="SourceGraphic" order="3" kernelMatrix="0 -1 0 + -1 5 -1 + 0 -1 0" preserveAlpha="true"> + <set attributeName="in" to="passimg" begin="3s" fill="freeze" onbegin="runtest()"/> + </feConvolveMatrix> + </filter> + <filter id="sharpenScript" x="0" y="0" width="100%" height="100%"> + <feImage xlink:href="../images/stefan_252_tRNS_opti.png" result="passimg"/> + <feConvolveMatrix id="prim" in="SourceGraphic" order="3" kernelMatrix="0 -1 0 + -1 5 -1 + 0 -1 0" preserveAlpha="true"/> + </filter> + + <text id="pass" x="240" y="150" text-anchor="middle" font-size="30px">PASS</text> + </defs> + + <script type="application/ecmascript"> + function runtest() + { + var img = document.getElementById("img"); + img.href.baseVal = "../images/stefan_252_tRNS_opti.png"; + var prim = document.getElementById("prim"); + prim.in1.baseVal = "passimg"; + } + </script> + + <text x="50%" y="3em" style="font-size:18px; text-anchor:middle">feConvolveMatrix 'in1' DOM</text> + <image id="img" xlink:href="../images/purplesquidj.png" x="80" y="100" width="100" height="100"/> + <image xlink:href="../images/purplesquidj.png" x="190" y="100" width="100" height="100" filter="url(#sharpenAnim)"/> + <image xlink:href="../images/purplesquidj.png" x="300" y="100" width="100" height="100" filter="url(#sharpenScript)"/> + <rect x="80" y="100" width="100" height="100" stroke="black" fill="none"/> + <rect x="190" y="100" width="100" height="100" stroke="blue" fill="none"/> + <rect x="300" y="100" width="100" height="100" stroke="blue" fill="none"/> + <text x="130" y="220" style="font-size:9px; text-anchor:middle">Original image</text> + <text x="240" y="220" style="font-size:9px; text-anchor:middle">Animated filter</text> + <text x="350" y="220" style="font-size:9px; text-anchor:middle">Scripted filter</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-conv-04-f-manual.svg b/testing/web-platform/tests/svg/import/filters-conv-04-f-manual.svg new file mode 100644 index 000000000..e1291c03d --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-conv-04-f-manual.svg @@ -0,0 +1,163 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="ED" owner="AG" status="created" + version="$Revision: 1.4 $" testname="$RCSfile: filters-conv-04-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feConvolveMatrixElementBiasAttribute"> + <p> + Tests the 'bias' attribute on 'feConvolveMatrix'. + </p> + <p> + The test uses a raster image and a vector graphic to test the effect + that the 'bias' attribute on 'feConvolveMatrix' has. + </p> + <p> + The first row of images in the test are four identical raster images. + The first image is the original unfiltered image. The second has the + filter kernel applied with no bias value specified. The third and fourth + images both have a bias value specified for the filter. + </p> + <p> + The second row of images in the test are four rectangle objects with a + gradient fill. The gradient fill transitions from opaque green to + transparent green. The first image is the original unfiltered graphic. The + second graphic has a filter kernel applied with no bias value specified. + The third and forth images both have a bias value specified for the + filter. + </p> + <p> + Behind each filter result there's a checkerboard pattern placed, to help + verify that there's transparency in the lower row, but not in the upper. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if: + </p> + <ul> + <li> + The raster images in the top row appears more faded and coarse for each instance + further to the right. + <ul> + <li>The first image (left most) must be smooth and clear</li> + <li> + The second image (second from the left) must contain the same colours as + the first image but have course outlining around the objects. + </li> + <li> + The third image (second from the right) must contain colour that is very faded + but have course outlining around the faded objects. + </li> + <li> + The last image (right most) must be completed faded such that all the colour + in the first image appears to have gone to white. Some course outlining should + appear in the image. + </li> + </ul> + </li> + <li> + The top row has no checkerboard pattern visible where the filtered results are. + </li> + <li> + The rectangle with a green gradient going from left to right appears + more faded for each instance further to the right. + <ul> + <li> + The first image (left most) must be a rect filled with a linear gradient that + transitions from solid green to transparent green. + </li> + <li>The second image (second from the left) must be identical to the first image.</li> + <li> + The third image (second from the right) must contain a linear gradient that transitions + from a solid faded green to transparent faded green. + </li> + <li> + The last image (right most) must contain a linear gradient that transitions from + solid white to transparent white. + </li> + </ul> + </li> + <li> + The bottom row must show 95% of the checkerboard pattern where the filtered results are + since the gradients are transparent. + </li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-conv-04-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <filter id="convolve-without-bias" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feConvolveMatrix kernelMatrix="1 1 1 1 -7 1 1 1 1" preserveAlpha="false"/> + </filter> + <filter id="convolve-with-bias05" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feConvolveMatrix kernelMatrix="1 1 1 1 -7 1 1 1 1" preserveAlpha="false" bias="0.5"/> + </filter> + <filter id="convolve-with-bias1" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feConvolveMatrix kernelMatrix="1 1 1 1 -7 1 1 1 1" preserveAlpha="false" bias="1"/> + </filter> + + <linearGradient id="test_linear_gradient" gradientUnits="objectBoundingBox" x1="0" x2="1" y1="0" y2="0"> + <stop stop-color="#00FF00" stop-opacity="1" offset="0"/> + <stop stop-color="#00FF00" stop-opacity="0" offset="1"/> + </linearGradient> + </defs> + + <g transform="translate(0, 20)"> + <image x="12" y="1" width="97" height="98" xlink:href="../images/DisplaceChecker.png"/> + <image x="127" y="1" width="97" height="98" xlink:href="../images/DisplaceChecker.png"/> + <image x="242" y="1" width="97" height="98" xlink:href="../images/DisplaceChecker.png"/> + <image x="357" y="1" width="97" height="98" xlink:href="../images/DisplaceChecker.png"/> + + <image x="10" y="0" width="100" height="100" xlink:href="../images/townsville.jpg" /> + <image x="125" y="0" width="100" height="100" xlink:href="../images/townsville.jpg" filter="url(#convolve-without-bias)"/> + <image x="240" y="0" width="100" height="100" xlink:href="../images/townsville.jpg" filter="url(#convolve-with-bias05)"/> + <image x="355" y="0" width="100" height="100" xlink:href="../images/townsville.jpg" filter="url(#convolve-with-bias1)"/> + </g> + + <g transform="translate(0, 110)"> + <image x="11" y="51" width="98" height="98" xlink:href="../images/DisplaceChecker.png"/> + <image x="126" y="51" width="98" height="98" xlink:href="../images/DisplaceChecker.png"/> + <image x="241" y="51" width="98" height="98" xlink:href="../images/DisplaceChecker.png"/> + <image x="356" y="51" width="98" height="98" xlink:href="../images/DisplaceChecker.png"/> + + <rect fill="url(#test_linear_gradient)" stroke="black" x="10" y="50" width="100" height="100"/> + <rect fill="url(#test_linear_gradient)" stroke="black" x="125" y="50" width="100" height="100" filter="url(#convolve-without-bias)"/> + <rect fill="url(#test_linear_gradient)" stroke="black" x="240" y="50" width="100" height="100" filter="url(#convolve-with-bias05)"/> + <rect fill="url(#test_linear_gradient)" stroke="black" x="355" y="50" width="100" height="100" filter="url(#convolve-with-bias1)"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-conv-05-f-manual.svg b/testing/web-platform/tests/svg/import/filters-conv-05-f-manual.svg new file mode 100644 index 000000000..b60f774ee --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-conv-05-f-manual.svg @@ -0,0 +1,83 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="CM" author="ED" status="created" + version="$Revision: 1.2 $" testname="$RCSfile: filters-conv-05-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feConvolveMatrixElementOrderAttribute"> + <p> + Tests feConvolveMatrix and the 'edgeMode' attribute. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + You should see three filtered images, each result should be slightly different, if they all look the same the test has failed. + The rendered picture should match the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-conv-05-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <filter id="emNone" filterUnits="objectBoundingBox" primitiveUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feConvolveMatrix kernelMatrix="1 1 1 1 -7 1 1 1 1" preserveAlpha="false" edgeMode="none"/> + </filter> + <filter id="emWrap" filterUnits="objectBoundingBox" primitiveUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feConvolveMatrix kernelMatrix="1 1 1 1 -7 1 1 1 1" preserveAlpha="false" edgeMode="wrap"/> + </filter> + <filter id="emDuplicate" filterUnits="objectBoundingBox" primitiveUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feConvolveMatrix kernelMatrix="1 1 1 1 -7 1 1 1 1" preserveAlpha="false" edgeMode="duplicate"/> + </filter> + + <g id="box"> + <rect width="10" height="100" fill="blue"/> + <rect x="10" width="100" height="10" fill="yellow"/> + <rect x="110" width="10" height="100" fill="lime"/> + <rect x="10" y="90" width="100" height="10" fill="black"/> + </g> + </defs> + + <text x="50%" y="3em" style="font-size:18px; text-anchor:middle">feConvolveMatrix 'edgeMode'</text> + + <use xlink:href="#box" filter="url(#emNone)" transform="translate(40 100)"/> + <text x="100" y="220" font-size="14" text-anchor="middle">none</text> + + <use xlink:href="#box" filter="url(#emWrap)" transform="translate(180 100)"/> + <text x="240" y="220" font-size="14" text-anchor="middle">wrap</text> + + <use xlink:href="#box" filter="url(#emDuplicate)" transform="translate(320 100)"/> + <text x="380" y="220" font-size="14" text-anchor="middle">duplicate</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-diffuse-01-f-manual.svg b/testing/web-platform/tests/svg/import/filters-diffuse-01-f-manual.svg new file mode 100644 index 000000000..5f8c3f080 --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-diffuse-01-f-manual.svg @@ -0,0 +1,152 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: filters-diffuse-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feDiffuseLightingElement"> + <p> + Verify the basic operation of the feDiffuseLighting + element. The test shows three rows of 3 images. Each + rows tests a different aspect of the filter and shows + the result of the filtering operation. + </p> + <p> + The first row shows the result of varying the + surfaceScale attribute. The second row shows the result + of varying the diffuse constant (kd) attribute. The last + row shows the result of varying the lighting-color + property. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-diffuse-01-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- Title --> + <text x="145" y="30" fill="black" font-size="12" font-family="Arial" font-weight="bold">Filters: feDiffuseLighting</text> + <!-- ===================================================================== --> + <!-- Filter definitions --> + <!-- ===================================================================== --> + <defs> + <!-- ================================================= --> + <!-- Surface scale --> + <!-- ================================================= --> + <filter id="surfaceScaleA" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="1"> + <feDistantLight azimuth="45" elevation="45"/> + </feDiffuseLighting> + </filter> + <filter id="surfaceScaleB" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10"> + <feDistantLight azimuth="45" elevation="45"/> + </feDiffuseLighting> + </filter> + <filter id="surfaceScaleC" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="-10"> + <feDistantLight azimuth="45" elevation="45"/> + </feDiffuseLighting> + </filter> + <!-- ================================================= --> + <!-- Diffuse Constants --> + <!-- ================================================= --> + <filter id="diffuseConstantA" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="0" surfaceScale="10"> + <feDistantLight azimuth="45" elevation="45"/> + </feDiffuseLighting> + </filter> + <filter id="diffuseConstantB" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10"> + <feDistantLight azimuth="45" elevation="45"/> + </feDiffuseLighting> + </filter> + <filter id="diffuseConstantC" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="2" surfaceScale="10"> + <feDistantLight azimuth="45" elevation="45"/> + </feDiffuseLighting> + </filter> + <!-- ================================================= --> + <!-- Lighting colors --> + <!-- ================================================= --> + <filter id="lightingColorA" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10" lighting-color="red"> + <feDistantLight azimuth="45" elevation="45"/> + </feDiffuseLighting> + </filter> + <filter id="lightingColorB" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10" lighting-color="yellow"> + <feDistantLight azimuth="45" elevation="45"/> + </feDiffuseLighting> + </filter> + <filter id="lightingColorC" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10" lighting-color="blue"> + <feDistantLight azimuth="45" elevation="45"/> + </feDiffuseLighting> + </filter> + </defs> + <!-- ==================================================== --> + <!-- The same image is rendered multiple times with using --> + <!-- different filters. --> + <!-- ==================================================== --> + <!-- Various Surface Scales --> + <g transform="translate(0, 50)"> + <text x="90" y="25">Various values for surfaceScale: 1, 10 and -10</text> + <image xlink:href="../images/bumpMap2.png" x="90" y="30" width="50" height="30" filter="url(#surfaceScaleA)"/> + <image xlink:href="../images/bumpMap2.png" x="160" y="30" width="50" height="30" filter="url(#surfaceScaleB)"/> + <image xlink:href="../images/bumpMap2.png" x="230" y="30" width="50" height="30" filter="url(#surfaceScaleC)"/> + </g> + <!-- Various Diffuse Constants --> + <g transform="translate(0, 120)"> + <text x="90" y="25">Various values for diffuseConstants: 0, 1 and 2</text> + <image xlink:href="../images/bumpMap2.png" x="90" y="30" width="50" height="30" filter="url(#diffuseConstantA)"/> + <image xlink:href="../images/bumpMap2.png" x="160" y="30" width="50" height="30" filter="url(#diffuseConstantB)"/> + <image xlink:href="../images/bumpMap2.png" x="230" y="30" width="50" height="30" filter="url(#diffuseConstantC)"/> + </g> + <!-- Various Light Colors --> + <g transform="translate(0, 190)"> + <text x="90" y="25">Various values for lighting color: red, yellow and blue</text> + <image xlink:href="../images/bumpMap2.png" x="90" y="30" width="50" height="30" filter="url(#lightingColorA)"/> + <image xlink:href="../images/bumpMap2.png" x="160" y="30" width="50" height="30" filter="url(#lightingColorB)"/> + <image xlink:href="../images/bumpMap2.png" x="230" y="30" width="50" height="30" filter="url(#lightingColorC)"/> + </g> + <!-- ===================================================== --> + <!-- Legends --> + <!-- ===================================================== --> + <!-- Surface Scale --> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-displace-01-f-manual.svg b/testing/web-platform/tests/svg/import/filters-displace-01-f-manual.svg new file mode 100644 index 000000000..2ff17a780 --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-displace-01-f-manual.svg @@ -0,0 +1,141 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Peter Graffagnino" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: filters-displace-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feDisplacementMapElement"> + <p> + Verify the basic capability to handle the feDisplacementMap filter + node. Six images should appear in 2 rows of 3. On the left in each + row a test image of a checker board is displayed. In the middle + column is the displacement map. In the right-hand column is the + result. All displacement maps are generated as png files with gamma + 1.0 and must be interpreted linearly for the proper geometric + displacement to occur. + </p> + <p> + The top row tests a displacement map which displaces each pixel by an + amount equivalent to a rotation of 20 degrees around the center of the + image. A blue reference rectangle is drawn on the result using an svg + transform attribute to mimick the same 20 degree rotation. The edges + of the blue rectangle should be parallel to the grid lines in the + displaced image. Distortion of the grid pattern such that the grid + lines are slightly curved is indicative of improper gamma handling in + the viewer. + </p> + <p> + The bottom row tests a displacement map which distorts the image + spherically. + </p> + <p> + In addition to feDisplacementMap, this test uses the 'feImage' and + 'rect' elements. Figure labeling uses the text element. The + reference blue rectangle uses fill, fill-opacity, and transform. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered image should match the reference image. The edges + of the blue rectangle must be parallel to the grid lines in the + displaced image. The center of the bottommost right distorted image + should be on a gridpoint. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-displace-01-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <filter id="DispMapChecker" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/DisplaceChecker.png"/> + </filter> + <filter id="RotateMap" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/rotate20.png"/> + </filter> + <filter id="SphereMap" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/sphere.png"/> + </filter> + <filter id="RotateMapTest" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feImage result="Map" xlink:href="../images/rotate20.png"/> + <feImage result="Texture" xlink:href="../images/DisplaceChecker.png"/> + <feDisplacementMap in="Texture" in2="Map" scale="64" xChannelSelector="R" yChannelSelector="G"/> + </filter> + <filter id="SphereMapTest" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feImage result="Map" xlink:href="../images/sphere.png"/> + <feImage result="Texture" xlink:href="../images/DisplaceChecker.png"/> + <feDisplacementMap in="Texture" in2="Map" scale="64" xChannelSelector="R" yChannelSelector="G"/> + </filter> + </defs> + + <g font-family="Arial" font-size="12" text-anchor="middle"> + <rect x="15" y="15" width="128" height="128" filter="url(#DispMapChecker)"/> + <rect x="20" y="115" width="118" height="20" fill="#DDD"/> + <text x="79" y="130">Checkerboard Image</text> + + <rect x="158" y="15" width="128" height="128" filter="url(#RotateMap)"/> + <rect x="163" y="112" width="118" height="30" fill="#DDD"/> + <text> + <tspan x="222" y="125">Displacement Map</tspan> + <tspan x="222" y="138">(20 deg. rotation)</tspan> + </text> + + + + <rect x="301" y="15" width="128" height="128" filter="url(#RotateMapTest)"/> + <rect x="-1" y="-1" width="2" height="2" transform="translate(365,79) rotate(20) scale(32)" fill="blue" fill-opacity="0.5"/> + <text> + <tspan x="365" y="160">Result</tspan> + <tspan x="365" y="172">(overlayed with 20 deg.</tspan> + <tspan x="365" y="184">rotated blue rectangle)</tspan> + </text> + + + <rect x="15" y="158" width="128" height="128" filter="url(#DispMapChecker)"/> + <rect x="20" y="258" width="118" height="20" fill="#DDD"/> + <text x="79" y="273">Checkerboard Image</text> + + + <rect x="158" y="158" width="128" height="128" filter="url(#SphereMap)"/> + <rect x="163" y="255" width="118" height="30" fill="#DDD"/> + <text> + <tspan x="222" y="268">Displacement Map</tspan> + <tspan x="222" y="283">(spherical distortion)</tspan> + </text> + + + <rect x="301" y="200" width="128" height="128" filter="url(#SphereMapTest)"/> + <text x="365" y="345">Result</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-displace-02-f-manual.svg b/testing/web-platform/tests/svg/import/filters-displace-02-f-manual.svg new file mode 100644 index 000000000..1fc1d1bc5 --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-displace-02-f-manual.svg @@ -0,0 +1,90 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CL" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: filters-displace-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feDisplacementMapElement"> + <p> + This tests feDisplacementMap without feImage. The input geometry is also used as the displacement map. + </p> + <p> + The bottom subtest tests that not specifying the 'xChannelSelector' attribute has the same effect as if 'A' was specified. + </p> + <p> + In both cases the filter input image consists of a gradient that is rendered using the default 'color-interpolation' which is 'sRGB'. + The default colorspace for filter primitives is 'linearRGB'. The filtering operation happens in 'linearRGB' space and the + result is then transformed back to 'sRGB' space for display. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if: + </p> + <ul> + <li>the top rectangle is overlapped by a gradient that has its blackest part centered around the vertical green line that splits the top rectangle</li> + <li>the bottom right corner of the area covered by the top gradient is aligned with the corner just below the top rectangle</li> + <li>the bottom rectangle is overlapped by a gradient that is displaced upwards with the maximum displacement the middle indicated by the vertical green line that splits the bottom rectangle</li> + <li>no part of the bottom gradient extends outside the bottom rectangle</li> + <li>both gradients use the same gradientcolors</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-displace-02-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <linearGradient id="fade" gradientUnits="objectBoundingBox"> + <stop offset="0" stop-color="#600" stop-opacity="0"/> + <stop offset="0.5" stop-color="#000" stop-opacity="1"/> + <stop offset="1.0" stop-color="#300" stop-opacity="0"/> + </linearGradient> + + <filter id="bend" filterUnits="objectBoundingBox" x="0" width="1.0" y="-1.3" height="2.28"> + <feDisplacementMap in="SourceGraphic" in2="SourceAlpha" yChannelSelector="A" scale="30"/> + </filter> + + <filter id="slide" filterUnits="objectBoundingBox" x="-0.3" width="1.3" y="0" height="1.3"> + <feDisplacementMap in="SourceGraphic" in2="SourceGraphic" xChannelSelector="R" yChannelSelector="G" scale="80"/> + </filter> + + <polyline points="280, 40, 280,120" stroke-width="2" stroke="green"/> + <polyline points="400, 144, 420,144, 420, 124" stroke-width="2" stroke="green" fill="none"/> + <rect width="360" height="80" x="60" y="40" fill="none" stroke="#933" stroke-width="2"/> + <rect width="360" height="80" x="60" y="40" fill="url(#fade)" filter="url(#slide)"/> + + <polyline points="240, 180, 240,260" stroke-width="2" stroke="green"/> + <rect width="360" height="80" x="60" y="180" fill="none" stroke="#933" stroke-width="2"/> + <rect width="360" height="80" x="60" y="180" fill="url(#fade)" filter="url(#bend)"/> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-example-01-b-manual.svg b/testing/web-platform/tests/svg/import/filters-example-01-b-manual.svg new file mode 100644 index 000000000..825f309b5 --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-example-01-b-manual.svg @@ -0,0 +1,93 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: filters-example-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#AnExample"> + <p> + A single filter that uses a combination of filter + primitives. You should see a gray rectangle that + contains a green outer ring and a green inner button + with "SVG" on it, both having a 3D appearance. + </p> + <p> + Verify that a typical usage of filtering is operation. + This test case creates a 3D lighting effect and requires + that several filters are working: feGaussianBlur, feOffset, + feSpecularLighting, feComposite and feMerge. The graphic + consisting of the string "SVG" sitting on top of oval + filled in green and surrounded by an oval outlined in green. + </p> + <p> + The test uses a nested 'svg' element, 'rect' element, + 'path' element, as well as basic fill (solid + colors), stroke (solid colors with stroke-width + lines), font-family (Verdana and Arial) and font-size properties. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image + exactly, except for possible variations in the labelling + text (per CSS2 rules). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-example-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- Here is the test case --> + <svg xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="80" y="110" width="300" height="180" viewBox="0 0 200 120"> + <title>Example filters01.svg - introducing filter effects</title> + <desc>An example which combines multiple filter primitives to produce a 3D lighting effect on a graphic consisting of the string "SVG" sitting on top of oval filled in green and surrounded by an oval outlined in green.</desc> + <defs> + <filter id="MyFilter" filterUnits="userSpaceOnUse" x="0" y="0" width="200" height="120"> + <feGaussianBlur in="SourceAlpha" stdDeviation="4" result="blur"/> + <feOffset in="blur" dx="4" dy="4" result="offsetBlur"/> + <feComposite in="SourceGraphic" in2="offsetBlur" operator="over"/> + </filter> + </defs> + <rect x="1" y="1" width="198" height="118" fill="#888888" stroke="blue"/> + <g filter="url(#MyFilter)"> + <g> + <path fill="none" stroke="#00D900" stroke-width="10" d="M50,90 C0,90 0,30 50,30 L150,30 C200,30 200,90 150,90 z"/> + <path fill="#00D900" d="M60,80 C30,80 30,40 60,40 L140,40 C170,40 170,80 140,80 z"/> + <g fill="#FFFFFF" stroke="black" font-size="45" font-family="Verdana"> + <text x="52" y="76">SVG</text> + </g> + </g> + </g> + </svg> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-felem-01-b-manual.svg b/testing/web-platform/tests/svg/import/filters-felem-01-b-manual.svg new file mode 100644 index 000000000..4ad95869d --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-felem-01-b-manual.svg @@ -0,0 +1,90 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="BB" author="CL" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: filters-felem-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#FilterElement"> + <p> + Test which verifies null filters and filter regions. + </p> + <p> + Four subtests each consist of a small red circle overdrawn with a larger green circle. + Filters are applied to three of the red circles, hiding them and showing the green circle. + </p> + <p> + The top left subtest has no filter applied to the circle, so the green circle is visible and the red one is not. + The top right subtest applies a filter to the red circle, but there is no corresponding filter element. + Thus, a null filter is applied and the red circle is not shown, allowing the green circle to be seen. + </p> + <p> + The bottom left subtest applies an empty filter element with the default filterRegion, and the bottom right + subtest applies an empty filter with a non-default filterRegion. In both cases where empty filters are applied, + the result of the filter is a transparent black offscreen, thus showing the green circle underneath. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there are four green circles visible. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-felem-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <filter id="null"/> + <filter id="nullreg" filterUnits="objectBoundingBox" x="40%" y="40%" width="20%" height="20%"/> + </defs> + <g> + <circle r="30" fill="red" cx="130" cy="60"/> + <circle r="40" fill="lime" cx="130" cy="60"/> + <text font-size="20" x="130" y="130" text-anchor="middle">No filter</text> + </g> + <g> + <circle r="30" fill="lime" cx="130" cy="210"/> + <circle r="40" fill="red" cx="130" cy="210" filter="url(#null)"/> + <text font-size="20" x="130" y="280" text-anchor="middle">Null filter</text> + </g> + <g> + <circle r="30" fill="lime" cx="330" cy="60"/> + <circle r="40" fill="red" cx="330" cy="60" filter="url(#notthere)"/> + <text font-size="20" x="330" y="130" text-anchor="middle">Non-existent filter</text> + </g> + <g> + <circle r="30" fill="lime" cx="330" cy="210"/> + <circle r="40" fill="red" cx="330" cy="210" filter="url(#nullreg)"/> + <text font-size="20" x="330" y="280" text-anchor="middle">Null with small region filter</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-felem-02-f-manual.svg b/testing/web-platform/tests/svg/import/filters-felem-02-f-manual.svg new file mode 100644 index 000000000..ebcdac5e0 --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-felem-02-f-manual.svg @@ -0,0 +1,127 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="TB" author="ED" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: filters-felem-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#FilterElementPrimitiveUnitsAttribute"> + <p> + This tests the 'primitiveUnits' attribute and how it affects other attribute values. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + You should see three rectangles in a row, then a row of three circles, then a row of three stars. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if: + </p> + <ul> + <li>There is no red visible anywhere</li> + <li>The first row has three green rectangles</li> + <li>The second row has three black circles, and the middle one has more blurred edges than the other two.</li> + <li>The third row has three green stars.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-felem-02-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <defs> + <filter id="usou1" primitiveUnits="userSpaceOnUse" x="0" y="0" width="100%" height="100%"> + <feFlood flood-color="lime" x="25" y="25" width="50" height="50"/> + </filter> + <filter id="obb1" primitiveUnits="objectBoundingBox" x="0" y="0" width="100%" height="100%"> + <feFlood flood-color="lime" x="25%" y="25%" width="50%" height="50%"/> + </filter> + <filter id="default1" x="0" y="0" width="100%" height="100%"> + <feFlood flood-color="lime" x="25" y="25" width="50" height="50"/> + </filter> + + <filter id="usou2" primitiveUnits="userSpaceOnUse" x="-50%" y="-50%" width="200%" height="200%"> + <feGaussianBlur stdDeviation="0.2"/> + </filter> + <filter id="obb2" primitiveUnits="objectBoundingBox" x="-50%" y="-50%" width="200%" height="200%"> + <feGaussianBlur stdDeviation="0.2"/> + </filter> + <filter id="default2" x="-50%" y="-50%" width="200%" height="200%"> + <feGaussianBlur stdDeviation="0.2"/> + </filter> + + <filter id="usou3" primitiveUnits="userSpaceOnUse" x="-50%" y="-50%" width="200%" height="200%"> + <feOffset dx="2" dy="2"/> + </filter> + <filter id="obb3" filterUnits="userSpaceOnUse" primitiveUnits="objectBoundingBox" x="-50%" y="-50%" width="200%" height="200%"> + <feOffset dx="2" dy="2"/> + </filter> + <filter id="default3" x="-50%" y="-50%" width="200%" height="200%"> + <feOffset dx="2" dy="2"/> + </filter> + + <polygon id="star" points="300,60 311.755,83.819 338.042,87.639 319.021,106.180 323.511,132.360 300,120 276.488,132.360 280.978,106.180 261.957,87.639 288.244,83.819 300,60 311.755,83.819"/> + + </defs> + + <g transform="translate(80 0)"> + + <rect fill="red" width="50" height="50" transform="translate(25 25)"/> + <rect fill="red" width="100" height="100" filter="url(#usou1)" transform="translate(0 0)"/> + + <rect fill="red" width="50" height="50" transform="translate(125 25)"/> + <rect fill="red" width="100" height="100" filter="url(#obb1)" transform="translate(100 0)"/> + + <rect fill="red" width="50" height="50" transform="translate(225 25)"/> + <rect fill="red" width="100" height="100" filter="url(#default1)" transform="translate(200 0)"/> + + <g transform="translate(50 40)"> + <circle r="30" filter="url(#usou2)" transform="translate(0 100)"/> + <circle r="30" filter="url(#obb2)" transform="translate(100 100)"/> + <circle r="30" filter="url(#default2)" transform="translate(200 100)"/> + </g> + + + <use xlink:href="#star" transform="translate(-250 150)" fill="red"/> + <use xlink:href="#star" transform="translate(-252 148)" fill="lime" filter="url(#usou3)"/> + <use xlink:href="#star" transform="translate(-250 150)" fill="none" stroke-width="2" stroke="lime"/> + + <use xlink:href="#star" transform="translate(-150 150)" fill="red"/> + <use xlink:href="#star" transform="translate(-302 5.1)" fill="lime" filter="url(#obb3)"/> + <use xlink:href="#star" transform="translate(-150 150)" fill="none" stroke-width="2" stroke="lime"/> + + <use xlink:href="#star" transform="translate(-50 150)" fill="red"/> + <use xlink:href="#star" transform="translate(-52 148)" fill="lime" filter="url(#default3)"/> + <use xlink:href="#star" transform="translate(-50 150)" fill="none" stroke-width="2" stroke="lime"/> + + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> + diff --git a/testing/web-platform/tests/svg/import/filters-gauss-01-b-manual.svg b/testing/web-platform/tests/svg/import/filters-gauss-01-b-manual.svg new file mode 100644 index 000000000..d1cd3a5f8 --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-gauss-01-b-manual.svg @@ -0,0 +1,93 @@ +<svg version="1.1" baseProfile="basic" preserveAspectRatio="xMidYMid meet" zoomAndPan="magnify" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Tim Thompson" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: filters-gauss-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#feGaussianBlurElement"> + <p> + In the upper left corner of the output are blue and yellow rectangles that overlap, + they appear normally, no gaussianBlur has been applied. + In the upper right the same rectangles are displayed with a blur filter applied, + the standard deviation is the same for both the x and y axis. + In the lower right corner the rectangles appear again, + this time the standard deviation is different along the x (20) and y (1) axis. + </p> + <p> + On top of the rectangles in the upper right and lower right, thin (half-pixel-wide) blue + lines are drawn to show the outline of the object bounding box (the inside lines) and the + outline of the filter region (the outside lines). The blur effect should be clipped + to the bounds of the filter region. + </p> + <p> + The test uses the 'rect' element, as well as basic fill (solid primary colors), + stroke (black 1-pixel and blue half-pixel lines), font-family (Arial) and font-size properties. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image, except for possible + variations in the labelling text (per CSS2 rules). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-gauss-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <g id="rects"> + <rect x="0" y="0" width="90" height="90" fill="blue"/> + <rect x="45" y="45" width="90" height="90" fill="yellow"/> + </g> + <g id="rect_outlines"> + <rect x="0" y="0" width="135" height="135" fill="none" stroke="blue" stroke-width=".5"/> + <rect x="-13.5" y="-13.5" width="162" height="162" fill="none" stroke="blue" stroke-width=".5"/> + </g> + <filter id="blur" filterUnits="objectBoundingBox" x="-10%" y="-10%" width="120%" height="120%"> + <feGaussianBlur stdDeviation="10"/> + </filter> + <filter id="blurxy" filterUnits="objectBoundingBox" x="-10%" y="-10%" width="120%" height="120%"> + <feGaussianBlur stdDeviation="20 1"/> + </filter> + </defs> + <use xlink:href="#rects"/> + <g transform="translate(310,15)"> + <use xlink:href="#rects" filter="url(#blur)"/> + <use xlink:href="#rect_outlines"/> + </g> + <g transform="translate(310,200)"> + <use xlink:href="#rects" filter="url(#blurxy)"/> + <use xlink:href="#rect_outlines"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-gauss-02-f-manual.svg b/testing/web-platform/tests/svg/import/filters-gauss-02-f-manual.svg new file mode 100644 index 000000000..003fc59ee --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-gauss-02-f-manual.svg @@ -0,0 +1,85 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="TB" author="ED" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: filters-gauss-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#feGaussianBlurElement"> + <p> + Test that when 'stdDeviation' is zero in one of X or Y the filter input image is + blurred only in the non-zero direction. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if: + </p> + <ul> + <li>the left subtest shows a blue and yellow rectangle fused together, with blur applied only in the vertical direction</li> + <li>the right subtest shows a blue and yellow rectangle fused together, with blur applied only in the horizontal direction</li> + <li>the blurred shapes are within the blue guidelines</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-gauss-02-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <g id="rects"> + <rect x="0" y="0" width="90" height="90" fill="blue"/> + <rect x="45" y="45" width="90" height="90" fill="yellow"/> + </g> + <g id="rect_outlines"> + <rect x="0" y="0" width="135" height="135" fill="none" stroke="blue" stroke-width=".5"/> + <rect x="-13.5" y="-13.5" width="162" height="162" fill="none" stroke="blue" stroke-width=".5"/> + </g> + <filter id="blury" filterUnits="objectBoundingBox" x="-10%" y="-10%" width="120%" height="120%"> + <feGaussianBlur stdDeviation="0 10"/> + </filter> + <filter id="blurx" filterUnits="objectBoundingBox" x="-10%" y="-10%" width="120%" height="120%"> + <feGaussianBlur stdDeviation="20 0"/> + </filter> + </defs> + <g transform="translate(80,100)"> + <use xlink:href="#rects" filter="url(#blury)"/> + <use xlink:href="#rect_outlines"/> + </g> + <g transform="translate(270,100)"> + <use xlink:href="#rects" filter="url(#blurx)"/> + <use xlink:href="#rect_outlines"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-gauss-03-f-manual.svg b/testing/web-platform/tests/svg/import/filters-gauss-03-f-manual.svg new file mode 100644 index 000000000..ea7c54cab --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-gauss-03-f-manual.svg @@ -0,0 +1,65 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="TB" author="ED" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: filters-gauss-03-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#feGaussianBlurElement"> + <p> + Test that when 'stdDeviation' is zero the result is a non-blurred image. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there's a green rectangle visible, and no red. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-gauss-03-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <rect id="rect" x="0" y="0" width="90" height="90"/> + <filter id="identity" filterUnits="objectBoundingBox" x="-10%" y="-10%" width="150%" height="150%"> + <feGaussianBlur stdDeviation="0"/> + </filter> + </defs> + <g transform="translate(190,120)"> + <use xlink:href="#rect" fill="red"/> + <use xlink:href="#rect" fill="lime" stroke="lime" stroke-width="2" filter="url(#identity)"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-image-01-b-manual.svg b/testing/web-platform/tests/svg/import/filters-image-01-b-manual.svg new file mode 100644 index 000000000..837850adf --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-image-01-b-manual.svg @@ -0,0 +1,59 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Tim Thompson" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: filters-image-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feImageElement"> + <p> + An image should be displayed in the middle of the view area. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-image-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <filter id="image"> + <feImage x="145" y="50" width="190" height="190" xlink:href="../images/image1.jpg"/> + </filter> + </defs> + <text font-family="Arial" font-size="12" x="240" y="20" text-anchor="middle">Basic test of feImage filter support.</text> + <rect width="480" height="360" filter="url(#image)"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-image-02-b-manual.svg b/testing/web-platform/tests/svg/import/filters-image-02-b-manual.svg new file mode 100644 index 000000000..ee30a7307 --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-image-02-b-manual.svg @@ -0,0 +1,79 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="ED" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: filters-image-02-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feImage"> + <p> + Tests the animatability of 'xlink:href' on the 'feImage' element. + The test will first show two blue images that should look exactly the same, + then after two seconds both images should simultaneously change to show two + pink images that also look exactly the same. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required. + + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if: + </p> + <ul> + <li>at first there are two identical <a href="../../images/bluesquidj.png">blue images</a> shown next to each other</li> + <li>after two seconds the two blue images are simultaneously replaced by two <a href="../../images/pinksquidj.png">pink images</a></li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-image-02-b.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <defs> + <filter id="feimage" x="0" y="0" width="100%" height="100%" filterUnits="objectBoundingBox"> + <feImage xlink:href="../images/bluesquidj.png"> + <set attributeName="xlink:href" to="../images/pinksquidj.png" begin="2s"/> + </feImage> + </filter> + </defs> + + <rect fill="red" filter="url(#feimage)" x="70" y="60" width="150" height="200"/> + <image xlink:href="../images/bluesquidj.png" x="260" y="60" width="150" height="200"> + <set attributeName="xlink:href" to="../images/pinksquidj.png" begin="2s"/> + </image> + + <g text-anchor="middle"> + <text x="50%" y="60" font-size="30">Animation in filters</text> + <text x="145" y="220">'feImage'</text> + <text x="335" y="220">'image'</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-image-03-f-manual.svg b/testing/web-platform/tests/svg/import/filters-image-03-f-manual.svg new file mode 100644 index 000000000..d8b2b92c6 --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-image-03-f-manual.svg @@ -0,0 +1,179 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="TB" author="ED" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: filters-image-03-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feImageElement"> + <p> + This tests the feImage element with a number of different filter primitive subregion values. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if: + </p> + <ul> + <li>the first row show four smiley faces of the same size, each framed by a blue rectangle</li> + <li>the first image on the left on the second row shows half a smiley face (horizontally offset)</li> + <li>the second image on the left on the second row shows half a smiley face (vertically offset)</li> + <li>the third image on the left on the second row shows the upper-lefthand quarter of the smiley face enlarged to fit the blue rectangle</li> + <li>the rightmost image on the second row shows the upper-lefthand quarter of the smiley face (horizontally and vertically offset)</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-image-03-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <!-- A breakdown of this testcase: + + All filters: + filterUnits not specified, defaults to objectBoundingBox. + x=0, y=0, width=1, height=1 -> filter region = bounding box. + + viewport is viewbox which is 0 0 480 360 + primitiveUnits not specified, defaults to userSpaceOnUse + preserveAspectRatio defaults to xMidYMid meet + + Top row + 1. Default: + x defaults to 0% relative to filter region (special case) + y defaults to 0% relative to filter region (special case) + width defaults to 100% of filter region (special case) + height defaults to 100% of filter region (special case) + + 2. All specified relative + x = 20.8% = 100/480 (0.2083) + y = 0% = 0/360 (0.0) + width = 10.4% = 50/480 (0.1042) + height = 13.8% = 50/360 (0.1388) + + 3. All specified absolute + x = 200 + y = 0 + width = 50 + height = 50 + + 4. y Specified + x defaults to 0% relative to filter region (special case) + y = 0% = 0/360 + width defaults to 100% of filter region (special case) + height defaults to 100% of filter region (special case) + + Bottom row + 1. Width specified + x defaults to 0% relative to filter region (special case) + y defaults to 0% relative to filter region (special case) + width 20.4% 97.92/480 **** Should be 20.8% + height defaults to 100% of filter region (special case) + + 2. Height specified + x defaults to 0% relative to filter region (special case) + y defaults to 0% relative to filter region (special case) + width defaults to 100% of filter region (special case) + height 27.6% 99.36/360 + + 3. Width and height specified + x defaults to 0% relative to filter region (special case) + y defaults to 0% relative to filter region (special case) + width 20.8% 99.8/480 (x2) + height 27.6% 99.36/360 (x2) + + 4. x, y specified + x = 67.7% = 325.0 + y = 34.6% = 125.0 + width defaults to 100% of filter region (special case) + height defaults to 100% of filter region (special case) + --> + <filter id="default" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/smiley.png"/> + </filter> + <filter id="all_specified_relative" x="0" y="0" width="1" height="1"> + <!-- x=100/480 y=0/360 width=50/480 height=50/360--> + <feImage x="20.8%" y="0%" width="10.4%" height="13.8%" + xlink:href="../images/smiley.png"/> + </filter> + <filter id="all_specified_absolute" x="0" y="0" width="1" height="1"> + <feImage x="200" y="0" height="50" width="50" + xlink:href="../images/smiley.png"/> + </filter> + <filter id="y_specified" x="0" y="0" width="1" height="1"> + <feImage y="0%" + xlink:href="../images/smiley.png"/> + </filter> + <filter id="width_specified" x="0" y="0" width="1" height="1"> + <feImage width="20.8%" + xlink:href="../images/smiley.png"/> + </filter> + <filter id="height_specified" x="0" y="0" width="1" height="1"> + <feImage height="27.6%" + xlink:href="../images/smiley.png"/> + </filter> + <filter id="width_height_specified" x="0" y="0" width="1" height="1"> + <feImage width="20.8%" height="27.6%" + xlink:href="../images/smiley.png"/> + </filter> + <filter id="x_y_specified" x="0" y="0" width="1" height="1"> + <feImage x="67.7%" y="34.6%" + xlink:href="../images/smiley.png"/> + </filter> + </defs> + + <g transform="translate(60 100)"> + <rect fill="red" width="50" height="50" filter="url(#default)"/> + <rect fill="red" x="100" width="50" height="50" filter="url(#all_specified_relative)"/> + <rect fill="red" x="200" width="50" height="50" filter="url(#all_specified_absolute)"/> + <rect fill="red" x="300" width="50" height="50" filter="url(#y_specified)"/> + + <rect fill="red" y="100" width="50" height="50" filter="url(#width_specified)"/> + <rect fill="red" x="100" y="100" width="50" height="50" filter="url(#height_specified)"/> + <rect fill="red" x="200" y="100" width="50" height="50" filter="url(#width_height_specified)"/> + <rect fill="red" x="300" y="100" width="50" height="50" filter="url(#x_y_specified)"/> + + <g id="reference_frames" stroke="blue" stroke-width="1" fill="none"> + <rect width="50" height="50" /> + <rect x="100" width="50" height="50"/> + <rect x="200" width="50" height="50"/> + <rect x="300" width="50" height="50"/> + <rect y="100" width="50" height="50"/> + <rect x="100" y="100" width="50" height="50"/> + <rect x="200" y="100" width="50" height="50"/> + <rect x="300" y="100" width="50" height="50"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-image-04-f-manual.svg b/testing/web-platform/tests/svg/import/filters-image-04-f-manual.svg new file mode 100644 index 000000000..ab2475dc4 --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-image-04-f-manual.svg @@ -0,0 +1,119 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2011 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="TB" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: filters-image-04-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feImageElement"> + <p> + This tests the feImage element with a number of different filter primitive subregion values. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if: + </p> + <ul> + <li>the first row show four smiley faces of the same size, each framed by a blue rectangle</li> + <li>the first image on the left on the second row shows half a smiley face (horizontally offset)</li> + <li>the second image on the left on the second row shows half a smiley face (vertically offset)</li> + <li>the third image on the left on the second row shows the upper-lefthand quarter of the smiley face enlarged to fit the blue rectangle</li> + <li>the rightmost image on the second row shows the upper-lefthand quarter of the smiley face (horizontally and vertically offset)</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-image-04-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <filter id="default" x="0" y="0" width="1" height="1" primitiveUnits="objectBoundingBox"> + <feImage xlink:href="../images/smiley.png"/> + </filter> + <filter id="all_specified_relative" x="0" y="0" width="1" height="1" primitiveUnits="objectBoundingBox"> + <feImage x="0%" y="0%" width="100%" height="100%" + xlink:href="../images/smiley.png"/> + </filter> + <filter id="all_specified_absolute" x="0" y="0" width="1" height="1" primitiveUnits="objectBoundingBox"> + <feImage x="0" y="0" height="1" width="1" + xlink:href="../images/smiley.png"/> + </filter> + <filter id="y_specified" x="0" y="0" width="1" height="1" primitiveUnits="objectBoundingBox"> + <feImage y="0%" + xlink:href="../images/smiley.png"/> + </filter> + <filter id="width_specified" x="0" y="0" width="1" height="1" primitiveUnits="objectBoundingBox"> + <feImage width="200%" + xlink:href="../images/smiley.png"/> + </filter> + <filter id="height_specified" x="0" y="0" width="1" height="1" primitiveUnits="objectBoundingBox"> + <feImage height="200%" + xlink:href="../images/smiley.png"/> + </filter> + <filter id="width_height_specified" x="0" y="0" width="1" height="1" primitiveUnits="objectBoundingBox"> + <feImage width="200%" height="200%" + xlink:href="../images/smiley.png"/> + </filter> + <filter id="x_y_specified" x="0" y="0" width="1" height="1" primitiveUnits="objectBoundingBox"> + <feImage x="0.5" y="0.5" + xlink:href="../images/smiley.png"/> + </filter> + </defs> + + <text text-anchor="middle" x="240" y="40" font-size="16">primitiveUnits = "objectBoundingBox"</text> + <g transform="translate(60 100)"> + <rect fill="red" width="50" height="50" filter="url(#default)"/> + <rect fill="red" x="100" width="50" height="50" filter="url(#all_specified_relative)"/> + <rect fill="red" x="200" width="50" height="50" filter="url(#all_specified_absolute)"/> + <rect fill="red" x="300" width="50" height="50" filter="url(#y_specified)"/> + + <rect fill="red" y="100" width="50" height="50" filter="url(#width_specified)"/> + <rect fill="red" x="100" y="100" width="50" height="50" filter="url(#height_specified)"/> + <rect fill="red" x="200" y="100" width="50" height="50" filter="url(#width_height_specified)"/> + <rect fill="red" x="300" y="100" width="50" height="50" filter="url(#x_y_specified)"/> + + <g id="reference_frames" stroke="blue" stroke-width="1" fill="none"> + <rect width="50" height="50" /> + <rect x="100" width="50" height="50"/> + <rect x="200" width="50" height="50"/> + <rect x="300" width="50" height="50"/> + <rect y="100" width="50" height="50"/> + <rect x="100" y="100" width="50" height="50"/> + <rect x="200" y="100" width="50" height="50"/> + <rect x="300" y="100" width="50" height="50"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-image-05-f-manual.svg b/testing/web-platform/tests/svg/import/filters-image-05-f-manual.svg new file mode 100644 index 000000000..eab4872db --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-image-05-f-manual.svg @@ -0,0 +1,195 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2011 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="Tavmjong Bah" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: filters-image-05-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feImageElement"> + <p> + This test verifies the implementation of the preserveAspectRatio attribute on <feImage> + referencing raster content. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + This test copies coords-viewattr-02-b, substituting feImage for image. + It exercises the various preserveAspectRatio values. An external bitmap + is referenced. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image exactly except for variations in the labeling text. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-image-05-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <filter id="default" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/smiley.png"/> + </filter> + <!-- Meet --> + <filter id="xMinYMinMeet" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/smiley.png" preserveAspectRatio="xMinYMin meet"/> + </filter> + <filter id="xMidYMinMeet" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/smiley.png" preserveAspectRatio="xMidYMin meet"/> + </filter> + <filter id="xMaxYMinMeet" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/smiley.png" preserveAspectRatio="xMaxYMin meet"/> + </filter> + <filter id="xMinYMidMeet" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/smiley.png" preserveAspectRatio="xMinYMid meet"/> + </filter> + <filter id="xMidYMidMeet" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/smiley.png" preserveAspectRatio="xMidYMid meet"/> + </filter> + <filter id="xMaxYMidMeet" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/smiley.png" preserveAspectRatio="xMaxYMid meet"/> + </filter> + <filter id="xMinYMaxMeet" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/smiley.png" preserveAspectRatio="xMinYMax meet"/> + </filter> + <filter id="xMidYMaxMeet" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/smiley.png" preserveAspectRatio="xMidYMax meet"/> + </filter> + <filter id="xMaxYMaxMeet" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/smiley.png" preserveAspectRatio="xMaxYMax meet"/> + </filter> + <!-- Slice --> + <filter id="xMinYMinSlice" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/smiley.png" preserveAspectRatio="xMinYMin slice"/> + </filter> + <filter id="xMidYMinSlice" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/smiley.png" preserveAspectRatio="xMidYMin slice"/> + </filter> + <filter id="xMaxYMinSlice" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/smiley.png" preserveAspectRatio="xMaxYMin slice"/> + </filter> + <filter id="xMinYMidSlice" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/smiley.png" preserveAspectRatio="xMinYMid slice"/> + </filter> + <filter id="xMidYMidSlice" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/smiley.png" preserveAspectRatio="xMidYMid slice"/> + </filter> + <filter id="xMaxYMidSlice" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/smiley.png" preserveAspectRatio="xMaxYMid slice"/> + </filter> + <filter id="xMinYMaxSlice" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/smiley.png" preserveAspectRatio="xMinYMax slice"/> + </filter> + <filter id="xMidYMaxSlice" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/smiley.png" preserveAspectRatio="xMidYMax slice"/> + </filter> + <filter id="xMaxYMaxSlice" x="0" y="0" width="1" height="1"> + <feImage xlink:href="../images/smiley.png" preserveAspectRatio="xMaxYMax slice"/> + </filter> + </defs> + <g font-size="9" transform="translate(0, 30)"> + <desc>Example PreserveAspectRatio - demonstrate available options</desc> + <text text-anchor="middle" x="240" font-size="16">Test preserveAspectRatio on an feImage element.</text> + <text x="40" y="30" text-anchor="middle">Raster to fit</text> + <g transform="translate(20,40)"> + <rect fill="red" width="40" height="40" filter="url(#default)"/> + </g> + <text x="35.5" y="110" text-anchor="middle">Viewport 1</text> + <g transform="translate(10,120)"><rect x='.5' y='.5' width='49' height='29' fill='none' stroke='blue'/></g> + <text x="35.5" y="180" text-anchor="middle">Viewport 2</text> + <g transform="translate(20,190)"><rect x='.5' y='.5' width='29' height='59' fill='none' stroke='blue'/></g> + <g id="meet-group-1" transform="translate(120, 50)"> + <text x="0" y="-20">---------- meet --------------------</text> + <g> + <text y="-5">xMin*</text> + <rect x='.5' y='.5' width='49' height='29' fill='none' stroke='blue'/> + <rect fill="red" width="50" height="30" filter="url(#xMinYMinMeet)"/> + </g> + <g transform="translate(70,0)"> + <text y="-5">xMid*</text> + <rect x='.5' y='.5' width='49' height='29' fill='none' stroke='blue'/> + <rect fill="red" width="50" height="30" filter="url(#xMidYMidMeet)"/> + </g> + <g transform="translate(0,50)"> + <text y="-5">xMax*</text> + <rect x='.5' y='.5' width='49' height='29' fill='none' stroke='blue'/> + <rect fill="red" width="50" height="30" filter="url(#xMaxYMaxMeet)"/> + </g> + </g> + <g id="meet-group-2" transform="translate(300, 50)"> + <text x="0" y="-20">---------- meet ------------------------</text> + <g> + <text y="-5">*YMin</text><rect x='.5' y='.5' width='29' height='59' fill='none' stroke='blue'/> + <rect fill="red" width="30" height="60" filter="url(#xMinYMinMeet)"/> + </g> + <g transform="translate(50, 0)"> + <text y="-5">*YMid</text><rect x='.5' y='.5' width='29' height='59' fill='none' stroke='blue'/> + <rect fill="red" width="30" height="60" filter="url(#xMidYMidMeet)"/> + </g> + <g transform="translate(100, 0)"> + <text y="-5">*YMax</text><rect x='.5' y='.5' width='29' height='59' fill='none' stroke='blue'/> + <rect fill="red" width="30" height="60" filter="url(#xMaxYMaxMeet)"/> + </g> + </g> + <g id="slice-group-1" transform="translate(120, 185)"> + <text x="0" y="-20">---------- slice -------------------------</text> + <g> + <text y="-5">xMin*</text><rect x='.5' y='.5' width='29' height='59' fill='none' stroke='blue'/> + <rect fill="red" width="30" height="60" filter="url(#xMinYMinSlice)"/> + </g> + <g transform="translate(50,0)"> + <text y="-5">xMid*</text><rect x='.5' y='.5' width='29' height='59' fill='none' stroke='blue'/> + <rect fill="red" width="30" height="60" filter="url(#xMidYMidSlice)"/> + </g> + <g transform="translate(100,0)"> + <text y="-5">xMax*</text><rect x='.5' y='.5' width='29' height='59' fill='none' stroke='blue'/> + <rect fill="red" width="30" height="60" filter="url(#xMaxYMaxSlice)"/> + </g> + </g> + <g id="slide-group-2" transform="translate(300, 155) translate(0, 30)"> + <text x="0" y="-20">---------- slice ---------------------</text> + <g> + <text y="-5">*YMin</text> + <rect x='.5' y='.5' width='49' height='29' fill='none' stroke='blue'/> + <rect fill="red" width="50" height="30" filter="url(#xMinYMinSlice)"/> + </g> + <g transform="translate(70,0)"> + <text y="-5">*YMid</text> + <rect x='.5' y='.5' width='49' height='29' fill='none' stroke='blue'/> + <rect fill="red" width="50" height="30" filter="url(#xMidYMidSlice)"/> + </g> + <g transform="translate(0,50)"> + <text y="-5">*YMax</text> + <rect x='.5' y='.5' width='49' height='29' fill='none' stroke='blue'/> + <rect fill="red" width="50" height="30" filter="url(#xMaxYMaxSlice)"/> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-light-01-f-manual.svg b/testing/web-platform/tests/svg/import/filters-light-01-f-manual.svg new file mode 100644 index 000000000..eb53871a5 --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-light-01-f-manual.svg @@ -0,0 +1,187 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: filters-light-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#LightSourceDefinitions"> + <p> + Verify the basic operation of the different lights used in the feDiffuseLighting + and feSpecularLighting elements. The test uses the same feDiffuseLighting filter, + using different lights. + </p> + <p> + The first row shows different settings for feDistantLight. The second row shows + different settings for fePointLight. The last row shows different settings for + feSpotLight. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered image should look approximately like the reference image, except for the last + feSpotLight test for which a reference image could not be created. The reference image may not be pixel accurate. However, the rendered image should show + at least 'similar' lighting results and bump maps. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-light-01-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- Title --> + <text x="240" y="20" fill="black" font-size="12" font-family="Arial" text-anchor="middle">Filters: feDistantLight, fePointLight, feSpotLight</text> + <!-- ===================================================================== --> + <!-- Filter definitions --> + <!-- ===================================================================== --> + <defs> + <!-- ================================================= --> + <!-- feDistantLight --> + <!-- ================================================= --> + <filter id="distantLightA" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10" lighting-color="white"> + <feDistantLight azimuth="0" elevation="0"/> + </feDiffuseLighting> + </filter> + <filter id="distantLightB" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10" lighting-color="white"> + <feDistantLight azimuth="45" elevation="0"/> + </feDiffuseLighting> + </filter> + <filter id="distantLightC" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10" lighting-color="white"> + <feDistantLight azimuth="0" elevation="45"/> + </feDiffuseLighting> + </filter> + <filter id="distantLightD" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10" lighting-color="white"> + <feDistantLight azimuth="45" elevation="45"/> + </feDiffuseLighting> + </filter> + <!-- ================================================= --> + <!-- fePointLight --> + <!-- ================================================= --> + <filter id="pointLightA" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10" lighting-color="white"> + <fePointLight x="0" y="0" z="10"/> + </feDiffuseLighting> + </filter> + <filter id="pointLightB" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10" lighting-color="white"> + <fePointLight x="50" y="0" z="10"/> + </feDiffuseLighting> + </filter> + <filter id="pointLightC" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10" lighting-color="white"> + <fePointLight x="0" y="30" z="10"/> + </feDiffuseLighting> + </filter> + <filter id="pointLightD" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10" lighting-color="white"> + <fePointLight x="50" y="30" z="10"/> + </feDiffuseLighting> + </filter> + <!-- ================================================= --> + <!-- feSpotLight --> + <!-- ================================================= --> + <filter id="spotLightA" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10" lighting-color="white"> + <feSpotLight x="25" y="0" z="35" pointsAtX="25" pointsAtY="30" pointsAtZ="0" specularExponent="0"/> + </feDiffuseLighting> + </filter> + <filter id="spotLightB" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10" lighting-color="white"> + <feSpotLight x="25" y="30" z="35" pointsAtX="25" pointsAtY="0" pointsAtZ="0" specularExponent="0"/> + </feDiffuseLighting> + </filter> + <filter id="spotLightC" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10" lighting-color="white"> + <feSpotLight x="25" y="0" z="35" pointsAtX="25" pointsAtY="30" pointsAtZ="0" specularExponent="1"/> + </feDiffuseLighting> + </filter> + <filter id="spotLightD" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10" lighting-color="white"> + <feSpotLight x="25" y="0" z="35" pointsAtX="25" pointsAtY="30" pointsAtZ="0" specularExponent="0" limitingConeAngle="30"/> + </feDiffuseLighting> + </filter> + </defs> + <!-- ==================================================== --> + <!-- The same image is rendered multiple times with using --> + <!-- different filters. --> + <!-- ==================================================== --> + <!-- Various feDistantLights --> + <g transform="translate(0, 40)"> + <text x="70" y="10">Various values for feDistantLight azimuth and elevation</text> + <text x="70" y="25">(0, 0)</text> + <text x="165" y="25">(45, 0)</text> + <text x="260" y="25">(0, 45)</text> + <text x="355" y="25">(45, 45)</text> + <image xlink:href="../images/bumpMap2.png" x="70" y="30" width="50" height="30" filter="url(#distantLightA)"/> + <image xlink:href="../images/bumpMap2.png" x="165" y="30" width="50" height="30" filter="url(#distantLightB)"/> + <image xlink:href="../images/bumpMap2.png" x="260" y="30" width="50" height="30" filter="url(#distantLightC)"/> + <image xlink:href="../images/bumpMap2.png" x="355" y="30" width="50" height="30" filter="url(#distantLightD)"/> + </g> + <!-- Various fePointLights --> + <g transform="translate(0, 120)"> + <text x="70" y="10">Various values for fePointLight's x, y and z</text> + <text x="70" y="25">(0, 0, 10)</text> + <text x="165" y="25">(50, 0, 10)</text> + <text x="260" y="25">(0, 30, 10)</text> + <text x="355" y="25">(50, 30, 10)</text> + </g> + <g> + <image transform="translate(70, 150)" xlink:href="../images/bumpMap2.png" width="50" height="30" filter="url(#pointLightA)"/> + <image transform="translate(165, 150)" xlink:href="../images/bumpMap2.png" width="50" height="30" filter="url(#pointLightB)"/> + <image transform="translate(260, 150)" xlink:href="../images/bumpMap2.png" width="50" height="30" filter="url(#pointLightC)"/> + <image transform="translate(355, 150)" xlink:href="../images/bumpMap2.png" width="50" height="30" filter="url(#pointLightD)"/> + </g> + <!-- feSpotLight --> + <g transform="translate(0, 210)"> + <text x="70" y="0">Various values for feSpotLight's x, y, z, pointsAtX, pointsAtY, pointsAtZ</text> + <text x="70" y="15">(25, 0, 25)</text> + <text x="70" y="30">(25, 30, 0)</text> + <text x="165" y="15">(25, 30, 25)</text> + <text x="165" y="30">(25, 0, 0)</text> + <text x="260" y="30">np=1</text> + <text x="355" y="30">limitingConeAngle=30</text> + </g> + <g> + <rect transform="translate(70, 245)" width="50" height="30" filter="url(#spotLightA)"/> + <rect transform="translate(165, 245)" width="50" height="30" filter="url(#spotLightB)"/> + <rect transform="translate(260, 245)" width="50" height="30" filter="url(#spotLightC)"/> + <rect transform="translate(355, 245)" width="50" height="30" filter="url(#spotLightD)"/> + </g> + <!-- ===================================================== --> + <!-- Legends --> + <!-- ===================================================== --> + <!-- Surface Scale --> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-light-02-f-manual.svg b/testing/web-platform/tests/svg/import/filters-light-02-f-manual.svg new file mode 100644 index 000000000..c5b61328e --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-light-02-f-manual.svg @@ -0,0 +1,97 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="CM" author="ED" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: filters-light-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feDistantLightAzimuthAttribute"> + <p> + This test verifies that the <a>'azimuth'</a> attribute is interpreted as a clockwise value in degrees. + </p> +<p>The test should show four arrows, indicating the direction of the incoming distant light. + As the four circles are lit by a specular lighting filter a faint shaded arc should appear. + The middle of each such arc should be where the corresponding arrow points.</p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if the shaded arcs are displayed only on the side indicated by the arrows. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-light-02-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <filter id="right"> + <feSpecularLighting surfaceScale="5" specularConstant="100" specularExponent="10"> + <feDistantLight azimuth="0" elevation="30"/> + </feSpecularLighting> + </filter> + <filter id="down"> + <feSpecularLighting surfaceScale="5" specularConstant="100" specularExponent="10"> + <feDistantLight azimuth="90" elevation="30"/> + </feSpecularLighting> + </filter> + <filter id="left"> + <feSpecularLighting surfaceScale="5" specularConstant="100" specularExponent="10"> + <feDistantLight azimuth="180" elevation="30"/> + </feSpecularLighting> + </filter> + <filter id="up"> + <feSpecularLighting surfaceScale="5" specularConstant="100" specularExponent="10"> + <feDistantLight azimuth="270" elevation="30"/> + </feSpecularLighting> + </filter> + + <marker id="arrow" markerWidth="10" markerHeight="10" viewBox="0 0 10 40" overflow="visible" orient="auto"> + <path d="M-1 5l10 -5l-10 -5z"/> + </marker> + </defs> + + <text x="50%" y="3em" style="font-size:18px; text-anchor:middle">'feDistantLight' azimuth</text> + + <g transform="scale(4) translate(0 50)"> + <circle id="c1" r="10" filter="url(#right)" transform="translate(20 0)"/> + <circle id="c2" r="10" filter="url(#down)" transform="translate(50 0)"/> + <circle id="c3" r="10" filter="url(#left)" transform="translate(80 0)"/> + <circle id="c4" r="10" filter="url(#up)" transform="translate(110 0)"/> + </g> + + <line marker-end="url(#arrow)" x1="0" y1="-25" x2="0" y2="25" stroke="black" stroke-width="3" transform="translate(200 180)"/> + <line marker-end="url(#arrow)" x1="0" y1="-25" x2="0" y2="25" stroke="black" stroke-width="3" transform="rotate(90) translate(200 -350)"/> + <line marker-end="url(#arrow)" x1="0" y1="-25" x2="0" y2="25" stroke="black" stroke-width="3" transform="rotate(180) translate(-440 -225)"/> + <line marker-end="url(#arrow)" x1="0" y1="-25" x2="0" y2="25" stroke="black" stroke-width="3" transform="rotate(270) translate(-200 50)"/> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-light-03-f-manual.svg b/testing/web-platform/tests/svg/import/filters-light-03-f-manual.svg new file mode 100644 index 000000000..65238a99f --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-light-03-f-manual.svg @@ -0,0 +1,124 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="CL" author="ED" status="accepted" + version="$Revision: 1.10 $" testname="$RCSfile: filters-light-03-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feDisplacementMap"> + <p> + Test resolving of 'primitiveUnits' on the 'z' attribute of 'fePointLight'. +You should see some shapes that have a black border, three circles and three rectangles. + The fill of these shapes should look the same. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if: + </p> + <ul> + <li>All of the circles look identical</li> + <li>The shapes all look like they have been filled with a gradient</li> + <li>No parts of the fill extend outside the black borders</li> + <li>All of the rects look identical</li> + <li>The circles must be fully filled by the filter output, which should resemble a radial gradient with a white focal point in the lower right position (about four o'clock, as shown by the small white circles)</li> + <li>The rects must be fully filled by the filter output, which should resemble a radial gradient with a white focal point in the lower right corner.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-light-03-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <filter id="light-primobjbbox" primitiveUnits="objectBoundingBox"> + <feSpecularLighting lighting-color="blue" surfaceScale="5" specularConstant="10" specularExponent="6"> + <!-- Note: for z this assumes that the scalefactor is + sqrt(bbox.width*bbox.width + bbox.height*bbox.height)/sqrt(2) --> + <fePointLight x="0.875" y="0.875" z="-0.0625"/> + </feSpecularLighting> + <feComposite operator="in" in2="SourceGraphic"/> + </filter> + <filter id="light-primobjbbox-rect" primitiveUnits="objectBoundingBox"> + <feSpecularLighting lighting-color="blue" surfaceScale="5" specularConstant="10" specularExponent="6"> + <!-- Note: for z the scalefactor is 31,622776601683793319988935444327 + sqrt(bbox.width*bbox.width + bbox.height*bbox.height)/sqrt(2) --> + <fePointLight x="0.75" y="1.5" z="-0.15811388300841896659994467722167"/> + </feSpecularLighting> + <feComposite operator="in" in2="SourceGraphic"/> + </filter> + <filter id="light-primusou" primitiveUnits="userSpaceOnUse"> + <feSpecularLighting lighting-color="blue" surfaceScale="5" specularConstant="10" specularExponent="6"> + <fePointLight x="30" y="30" z="-5"/> + </feSpecularLighting> + <feComposite operator="in" in2="SourceGraphic"/> + </filter> + <filter id="light-primdefault"> + <feSpecularLighting lighting-color="blue" surfaceScale="5" specularConstant="10" specularExponent="6"> + <fePointLight x="30" y="30" z="-5"/> + </feSpecularLighting> + <feComposite operator="in" in2="SourceGraphic"/> + </filter> + </defs> + + <g stroke="black" transform="translate(80 100)"> + <circle r="40" stroke-width="10" filter="url(#light-primobjbbox)" fill="black"/> + <circle r="44" stroke-width="1" fill="none"/> + <rect width="40" height="20" filter="url(#light-primobjbbox-rect)" fill="black" transform="translate(-20 60)"/> + <rect width="40" height="20" fill="none" transform="translate(-20 60)"/> + <text y="100" font-size="8" stroke="none" text-anchor="middle">primitiveUnits="objectBoundingBox"</text> + <circle cx="30" cy="30" r="5" fill="white"/> + </g> + + <g stroke="black" transform="translate(245 100)"> + <circle r="40" stroke-width="10" filter="url(#light-primusou)" fill="black"/> + <circle r="44" stroke-width="1" fill="none"/> + <rect width="40" height="20" filter="url(#light-primusou)" fill="black" transform="translate(-20 60)"/> + <rect width="40" height="20" fill="none" transform="translate(-20 60)"/> + <text y="100" font-size="8" stroke="none" text-anchor="middle">primitiveUnits="userSpaceOnUse"</text> + <circle cx="30" cy="30" r="5" fill="white"/> + </g> + + <g stroke="black" transform="translate(400 100)"> + <circle r="40" stroke-width="10" filter="url(#light-primdefault)" fill="black"/> + <circle r="44" stroke-width="1" fill="none"/> + <rect width="40" height="20" filter="url(#light-primdefault)" fill="black" transform="translate(-20 60)"/> + <rect width="40" height="20" fill="none" transform="translate(-20 60)"/> + <text y="100" font-size="8" stroke="none" text-anchor="middle">primitiveUnits unspecified</text> + <circle cx="30" cy="30" r="5" fill="white"/> + </g> + </g> + + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.10 $</text> + </g> + + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> + diff --git a/testing/web-platform/tests/svg/import/filters-light-04-f-manual.svg b/testing/web-platform/tests/svg/import/filters-light-04-f-manual.svg new file mode 100644 index 000000000..807380cf8 --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-light-04-f-manual.svg @@ -0,0 +1,136 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="ED" status="accepted" + version="$Revision: 1.4 $" testname="$RCSfile: filters-light-04-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feSpotLightLimitingConeAngleAttribute"> + <p> + Test various values for limitingConeAngle in feSpotLight. + </p> + <p> + There should be four rects in two rows. Each of the rects has a different filter applied, + and each of those filters uses different values for limitingConeAngle. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered image should look approximately like the reference image, and the third rectangle from the left + in each row must be animated. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-light-04-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- Title --> + <text x="240" y="50" fill="black" font-size="16" font-family="Arial" text-anchor="middle">feSpotLight's limitingConeAngle</text> + <!-- ===================================================================== --> + <!-- Filter definitions --> + <!-- ===================================================================== --> + <defs> + <!-- ================================================= --> + <!-- feSpotLight --> + <!-- ================================================= --> + <filter id="spotLightA" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10" lighting-color="white"> + <feSpotLight x="25" y="0" z="35" pointsAtX="25" pointsAtY="30" pointsAtZ="0" specularExponent="0" limitingConeAngle="30"/> + </feDiffuseLighting> + </filter> + <filter id="spotLightB" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10" lighting-color="white"> + <feSpotLight x="25" y="0" z="35" pointsAtX="25" pointsAtY="30" pointsAtZ="0" specularExponent="0" limitingConeAngle="20"/> + </feDiffuseLighting> + </filter> + <filter id="spotLightC" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10" lighting-color="white"> + <feSpotLight x="25" y="0" z="35" pointsAtX="25" pointsAtY="30" pointsAtZ="0" specularExponent="0" limitingConeAngle="0"> + <animate attributeName="limitingConeAngle" from="0" to="50" dur="10s" fill="freeze"/> + </feSpotLight> + </feDiffuseLighting> + </filter> + <filter id="spotLightD" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10" lighting-color="white"> + <feSpotLight x="25" y="0" z="35" pointsAtX="25" pointsAtY="30" pointsAtZ="0" specularExponent="0" limitingConeAngle="5"/> + </feDiffuseLighting> + </filter> + <filter id="spotLightE" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10" lighting-color="white"> + <feSpotLight x="25" y="0" z="35" pointsAtX="25" pointsAtY="30" pointsAtZ="0" specularExponent="0" limitingConeAngle="-30"/> + </feDiffuseLighting> + </filter> + <filter id="spotLightF" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10" lighting-color="white"> + <feSpotLight x="25" y="0" z="35" pointsAtX="25" pointsAtY="30" pointsAtZ="0" specularExponent="0" limitingConeAngle="-20"/> + </feDiffuseLighting> + </filter> + <filter id="spotLightG" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10" lighting-color="white"> + <feSpotLight x="25" y="0" z="35" pointsAtX="25" pointsAtY="30" pointsAtZ="0" specularExponent="0" limitingConeAngle="0"> + <animate attributeName="limitingConeAngle" from="0" to="-50" dur="10s" fill="freeze"/> + </feSpotLight> + </feDiffuseLighting> + </filter> + <filter id="spotLightH" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1"> + <feDiffuseLighting in="SourceGraphic" diffuseConstant="1" surfaceScale="10" lighting-color="white"> + <feSpotLight x="25" y="0" z="35" pointsAtX="25" pointsAtY="30" pointsAtZ="0" specularExponent="0" limitingConeAngle="-5"/> + </feDiffuseLighting> + </filter> + </defs> + <!-- feSpotLight --> + <g transform="translate(0 -20)"> + <g transform="translate(0 110)" font-size="9" font-family="Arial"> + <text x="70" y="30">30</text> + <text x="165" y="30">20</text> + <text x="260" y="30">Animated (0..50)</text> + <text x="355" y="30">5</text> + <g transform="translate(0 100)"> + <text x="70" y="30">-30</text> + <text x="165" y="30">-20</text> + <text x="260" y="30">Animated (0..-50)</text> + <text x="355" y="30">-5</text> + </g> + </g> + <g> + <rect transform="translate(70, 145)" width="50" height="30" filter="url(#spotLightA)"/> + <rect transform="translate(165, 145)" width="50" height="30" filter="url(#spotLightB)"/> + <rect transform="translate(260, 145)" width="50" height="30" filter="url(#spotLightC)"/> + <rect transform="translate(355, 145)" width="50" height="30" filter="url(#spotLightD)"/> + <rect transform="translate(70, 245)" width="50" height="30" filter="url(#spotLightE)"/> + <rect transform="translate(165, 245)" width="50" height="30" filter="url(#spotLightF)"/> + <rect transform="translate(260, 245)" width="50" height="30" filter="url(#spotLightG)"/> + <rect transform="translate(355, 245)" width="50" height="30" filter="url(#spotLightH)"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-light-05-f-manual.svg b/testing/web-platform/tests/svg/import/filters-light-05-f-manual.svg new file mode 100644 index 000000000..339837efe --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-light-05-f-manual.svg @@ -0,0 +1,252 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="ED" author="AG" status="reviewed" + version="$Revision: 1.3 $" testname="$RCSfile: filters-light-05-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feDistantLightElevationAttribute"> + <p> + This test verifies that the <a>'elevation'</a> attribute is interpreted as a + complementary value to the z-axis in degrees. + </p> + <p> + The test shows four different elevation angles that can be used for feDistantLight source. + The four different feDistantLight light sources are used in three different filter cases; feDiffuseLight, feSpecularLight + and feMerge which merges both feDiffuseLight and feSpecularLight to form a single filter. Using four different elevation values + in three different filter cases gives twelve different filters. All twelve filter cases are applied to a vector graphic and + then to a raster graphic. The vector graphic results are shown to the left and the raster graphic results are shown to the right. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if + </p> + <ul> + <li>The top row has from left to right for a single graphic set: + <ul> + <li>A green square with a black circle inside of it</li> + <li>A black square</li> + <li>A black square with a green semicircle inside the lefthand side of the rect</li> + <li>A black square with a green semicircle inside the righthand side of the rect</li> + </ul> + </li> + <li>The middle row has from left to right for a single graphic set: + <ul> + <li>A green square with a white circle inside of it</li> + <li>A green semicircle pointing to the right on top of a white background</li> + <li>A green square with a white crest inside pointing to the right</li> + <li>A green square with a white crest inside pointing to the left</li> + </ul> + </li> + <li>The bottom row has from left to right for a single graphic set: + <ul> + <li>A green square with a black circle inside of it</li> + <li>A black square with a green semicircle inside pointing to the right</li> + <li>A green square with a circle inside that has a shadow on the righthand side and a reflection on the lefthand side</li> + <li>A green square with a circle inside that has a shadow on the lefthand side and a reflection on the righthand side</li> + </ul> + </li> + </ul> + <p> + If the test shows any red, the test has failed. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-light-05-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs color="#00FF00"> + <filter id="distantLightUp"> + <feDiffuseLighting in="SourceGraphic" surfaceScale="10" diffuseConstant="1" lighting-color="currentColor"> + <feDistantLight azimuth="0" elevation="90"/> + </feDiffuseLighting> + </filter> + <filter id="distantLightDown"> + <feDiffuseLighting in="SourceGraphic" surfaceScale="10" diffuseConstant="1" lighting-color="currentColor"> + <feDistantLight azimuth="0" elevation="270"/> + </feDiffuseLighting> + </filter> + <filter id="distantLightLeft"> + <feDiffuseLighting in="SourceGraphic" surfaceScale="10" diffuseConstant="1" lighting-color="currentColor"> + <feDistantLight azimuth="0" elevation="180"/> + </feDiffuseLighting> + </filter> + <filter id="distantLightRight"> + <feDiffuseLighting in="SourceGraphic" surfaceScale="10" diffuseConstant="1" lighting-color="currentColor"> + <feDistantLight azimuth="0" elevation="0"/> + </feDiffuseLighting> + </filter> + + <filter id="specularLightUp"> + <feSpecularLighting in="SourceGraphic" surfaceScale="10" specularConstant="1" specularExponent="1" lighting-color="currentColor"> + <feDistantLight azimuth="0" elevation="90"/> + </feSpecularLighting> + </filter> + <filter id="specularLightDown"> + <feSpecularLighting in="SourceGraphic" surfaceScale="10" specularConstant="1" specularExponent="1" lighting-color="currentColor"> + <feDistantLight azimuth="0" elevation="270"/> + </feSpecularLighting> + </filter> + <filter id="specularLightLeft"> + <feSpecularLighting in="SourceGraphic" surfaceScale="10" specularConstant="1" specularExponent="1" lighting-color="currentColor"> + <feDistantLight azimuth="0" elevation="180"/> + </feSpecularLighting> + </filter> + <filter id="specularLightRight"> + <feSpecularLighting in="SourceGraphic" surfaceScale="10" specularConstant="1" specularExponent="1" lighting-color="currentColor"> + <feDistantLight azimuth="0" elevation="0"/> + </feSpecularLighting> + </filter> + + <filter id="combinedUp"> + <feDiffuseLighting in="SourceGraphic" surfaceScale="10" diffuseConstant="1" lighting-color="currentColor" result="res_a"> + <feDistantLight azimuth="0" elevation="90"/> + </feDiffuseLighting> + <feSpecularLighting in="SourceGraphic" surfaceScale="10" specularConstant="1" specularExponent="1" lighting-color="currentColor" result="res_b"> + <feDistantLight azimuth="0" elevation="90"/> + </feSpecularLighting> + <feMerge> + <feMergeNode in="res_a"/> + <feMergeNode in="res_b"/> + </feMerge> + </filter> + <filter id="combinedDown"> + <feDiffuseLighting in="SourceGraphic" surfaceScale="10" diffuseConstant="1" lighting-color="currentColor" result="res_a"> + <feDistantLight azimuth="0" elevation="270"/> + </feDiffuseLighting> + <feSpecularLighting in="SourceGraphic" surfaceScale="10" specularConstant="1" specularExponent="1" lighting-color="currentColor" result="res_b"> + <feDistantLight azimuth="0" elevation="270"/> + </feSpecularLighting> + <feMerge> + <feMergeNode in="res_a"/> + <feMergeNode in="res_b"/> + </feMerge> + </filter> + <filter id="combinedLeft"> + <feDiffuseLighting in="SourceGraphic" surfaceScale="10" diffuseConstant="1" lighting-color="currentColor" result="res_a"> + <feDistantLight azimuth="0" elevation="180"/> + </feDiffuseLighting> + <feSpecularLighting in="SourceGraphic" surfaceScale="10" specularConstant="1" specularExponent="1" lighting-color="currentColor" result="res_b"> + <feDistantLight azimuth="0" elevation="180"/> + </feSpecularLighting> + <feMerge> + <feMergeNode in="res_a"/> + <feMergeNode in="res_b"/> + </feMerge> + </filter> + <filter id="combinedRight"> + <feDiffuseLighting in="SourceGraphic" surfaceScale="10" diffuseConstant="1" lighting-color="currentColor" result="res_a"> + <feDistantLight azimuth="0" elevation="0"/> + </feDiffuseLighting> + <feSpecularLighting in="SourceGraphic" surfaceScale="10" specularConstant="1" specularExponent="1" lighting-color="currentColor" result="res_b"> + <feDistantLight azimuth="0" elevation="0"/> + </feSpecularLighting> + <feMerge> + <feMergeNode in="res_a"/> + <feMergeNode in="res_b"/> + </feMerge> + </filter> + </defs> + + <text x="70" y="40" stroke="none" fill="black">feDiffuseLight using feDistantLight source</text> + <g transform="scale(1.5) translate(5 45)"> + <circle id="c1" r="10" fill="red" filter="url(#distantLightUp)" transform="translate(20 0)"/> + <circle id="c2" r="10" fill="red" filter="url(#distantLightDown)" transform="translate(50 0)"/> + <circle id="c3" r="10" fill="red" filter="url(#distantLightLeft)" transform="translate(80 0)"/> + <circle id="c4" r="10" fill="red" filter="url(#distantLightRight)" transform="translate(110 0)"/> + </g> + <text x="20" y="100" font-size="10" stroke="none" fill="black">90 deg</text> + <text x="65" y="100" font-size="10" stroke="none" fill="black">270 deg</text> + <text x="110" y="100" font-size="10" stroke="none" fill="black">180 deg</text> + <text x="160" y="100" font-size="10" stroke="none" fill="black">0 deg</text> + + <text x="70" y="135" stroke="none" fill="black">feSpecularLight using feDistantLight source</text> + <g transform="scale(1.5) translate(5 110)"> + <circle id="c1" r="10" fill="red" filter="url(#specularLightUp)" transform="translate(20 0)"/> + <circle id="c2" r="10" fill="red" filter="url(#specularLightDown)" transform="translate(50 0)"/> + <circle id="c3" r="10" fill="red" filter="url(#specularLightLeft)" transform="translate(80 0)"/> + <circle id="c4" r="10" fill="red" filter="url(#specularLightRight)" transform="translate(110 0)"/> + </g> + <text x="20" y="195" font-size="10" stroke="none" fill="black">90 deg</text> + <text x="65" y="195" font-size="10" stroke="none" fill="black">270 deg</text> + <text x="110" y="195" font-size="10" stroke="none" fill="black">180 deg</text> + <text x="160" y="195" font-size="10" stroke="none" fill="black">0 deg</text> + + <text x="30" y="230" stroke="none" fill="black">feDiffuseLight and feSpecularLight using feDistantLight</text> + <g transform="scale(1.5) translate(5 170)"> + <circle id="c1" r="10" fill="red" filter="url(#combinedUp)" transform="translate(20 0)"/> + <circle id="c2" r="10" fill="red" filter="url(#combinedDown)" transform="translate(50 0)"/> + <circle id="c3" r="10" fill="red" filter="url(#combinedLeft)" transform="translate(80 0)"/> + <circle id="c4" r="10" fill="red" filter="url(#combinedRight)" transform="translate(110 0)"/> + </g> + <text x="20" y="290" font-size="10" stroke="none" fill="black">90 deg</text> + <text x="65" y="290" font-size="10" stroke="none" fill="black">270 deg</text> + <text x="110" y="290" font-size="10" stroke="none" fill="black">180 deg</text> + <text x="160" y="290" font-size="10" stroke="none" fill="black">0 deg</text> + + <g transform="translate(0, 55)"> + <image xlink:href="../images/bumpMap3.png" x="240" y="0" width="40" height="30" filter="url(#distantLightUp)"/> + <image xlink:href="../images/bumpMap3.png" x="300" y="0" width="40" height="30" filter="url(#distantLightDown)"/> + <image xlink:href="../images/bumpMap3.png" x="360" y="0" width="40" height="30" filter="url(#distantLightLeft)"/> + <image xlink:href="../images/bumpMap3.png" x="420" y="0" width="40" height="30" filter="url(#distantLightRight)"/> + </g> + <text x="245" y="100" font-size="10" stroke="none" fill="black">90 deg</text> + <text x="305" y="100" font-size="10" stroke="none" fill="black">270 deg</text> + <text x="365" y="100" font-size="10" stroke="none" fill="black">180 deg</text> + <text x="430" y="100" font-size="10" stroke="none" fill="black">0 deg</text> + + <g transform="translate(0, 150)"> + <image xlink:href="../images/bumpMap3.png" x="240" y="0" width="40" height="30" filter="url(#specularLightUp)"/> + <image xlink:href="../images/bumpMap3.png" x="300" y="0" width="40" height="30" filter="url(#specularLightDown)"/> + <image xlink:href="../images/bumpMap3.png" x="360" y="0" width="40" height="30" filter="url(#specularLightLeft)"/> + <image xlink:href="../images/bumpMap3.png" x="420" y="0" width="40" height="30" filter="url(#specularLightRight)"/> + </g> + <text x="245" y="195" font-size="10" stroke="none" fill="black">90 deg</text> + <text x="305" y="195" font-size="10" stroke="none" fill="black">270 deg</text> + <text x="365" y="195" font-size="10" stroke="none" fill="black">180 deg</text> + <text x="430" y="195" font-size="10" stroke="none" fill="black">0 deg</text> + + <g transform="translate(0, 240)"> + <image xlink:href="../images/bumpMap3.png" x="240" y="0" width="40" height="30" filter="url(#combinedUp)"/> + <image xlink:href="../images/bumpMap3.png" x="300" y="0" width="40" height="30" filter="url(#combinedDown)"/> + <image xlink:href="../images/bumpMap3.png" x="360" y="0" width="40" height="30" filter="url(#combinedLeft)"/> + <image xlink:href="../images/bumpMap3.png" x="420" y="0" width="40" height="30" filter="url(#combinedRight)"/> + </g> + <text x="245" y="290" font-size="10" stroke="none" fill="black">90 deg</text> + <text x="305" y="290" font-size="10" stroke="none" fill="black">270 deg</text> + <text x="365" y="290" font-size="10" stroke="none" fill="black">180 deg</text> + <text x="430" y="290" font-size="10" stroke="none" fill="black">0 deg</text> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-morph-01-f-manual.svg b/testing/web-platform/tests/svg/import/filters-morph-01-f-manual.svg new file mode 100644 index 000000000..af9a6b02f --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-morph-01-f-manual.svg @@ -0,0 +1,103 @@ +<svg version="1.1" baseProfile="full" preserveAspectRatio="xMidYMid meet" zoomAndPan="magnify" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: filters-morph-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feMorphologyElement"> + <p> + Test which verifies the basic facilities of feMorphology. + </p> + <p> + The test shows the same graphics filtered with four different feMorphology + settings. The top two have the type erode and a radius of 1(left) and 2(right). + The bottom two have the type dilate and a radius of 1(left) and 3(right). + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image, except for possible + variations in the labelling text (per CSS2 rules). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-morph-01-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x="240" y="16" text-anchor="middle" font-size="12pt">Filter Effect: feMorphology</text> + <g transform="translate(0, -6)"> + <defs> + <filter id="erode1" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feMorphology operator="erode" radius="1"/> + </filter> + <filter id="erode2" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feMorphology operator="erode" radius="2"/> + </filter> + <filter id="dilate1" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feMorphology operator="dilate" radius="1"/> + </filter> + <filter id="dilate2" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feMorphology operator="dilate" radius="3"/> + </filter> + <g id="morphologySource"> + <g fill-rule="nonzero" clip-rule="nonzero" stroke="#000000" stroke-miterlimit="4"> + <g> + <path fill="#FFFFFF" stroke="#6666FF" stroke-width="7.1711" d="M81.403,78.289H3.585v-64.75h77.818v64.75z"/> + <path fill="none" stroke="#00FF00" stroke-width="7.1711" d="M93.261,77.536c0,23.285-18.581,42.163-41.503,42.163c-22.921,0-41.503-18.877-41.503-42.163c0-23.286,18.582-42.163,41.503-42.163c22.922,0,41.503,18.877,41.503,42.163z"/> + <path fill="none" stroke="#FF8000" stroke-width="7.1711" d="M98.31,28.445l13.288,27.354l29.714,4.385l-21.501,21.292l5.076,30.064L98.31,97.347l-26.577,14.194l5.076-30.064L55.307,60.184l29.714-4.385L98.31,28.445z"/> + <path fill="none" stroke="#FFFF00" stroke-width="7.1711" d="M131.563,26.338c0,28.559-22.79,51.709-50.901,51.709c-22.489,0-40.72-18.521-40.72-41.367c0-18.278,14.584-33.095,32.576-33.095c14.394,0,26.061,11.854,26.061,26.475 c0,11.698-9.334,21.181-20.849,21.181c-9.211,0-16.68-7.586-16.68-16.944c0-7.486,5.975-13.555,13.344-13.555c5.895,0,10.674,4.855,10.674,10.844c0,4.791-3.823,8.676-8.54,8.676c-3.773,0-6.832-3.107-6.832-6.941"/> + </g> + </g> + </g> + </defs> + <g text-anchor="middle"> + <g transform="translate(0, 0)"> + <use xlink:href="#morphologySource" x="35" y="25" filter="url(#erode1)"/> + <text x="110" y="156">type=erode radius=1</text> + </g> + <g transform="translate(255, 0)"> + <use xlink:href="#morphologySource" x="35" y="25" filter="url(#erode2)"/> + <text x="110" y="156">type=erode radius=2</text> + </g> + <g transform="translate(0, 140)"> + <use xlink:href="#morphologySource" x="35" y="25" filter="url(#dilate1)"/> + <text x="110" y="156">type=dilate radius=1</text> + </g> + <g transform="translate(255, 140)"> + <use xlink:href="#morphologySource" x="35" y="25" filter="url(#dilate2)"/> + <text x="110" y="156">type=dilate radius=3</text> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-offset-01-b-manual.svg b/testing/web-platform/tests/svg/import/filters-offset-01-b-manual.svg new file mode 100644 index 000000000..d00ad44a6 --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-offset-01-b-manual.svg @@ -0,0 +1,112 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Peter Graffagnino" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: filters-offset-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feOffsetElement"> + <p> + The target crosshairs should align with + lower left bounds of the associated circle. + The color of each crosshair should match + the associated circle. + </p> + <p> + Verify the basic capability to handle the feOffset, feMerge and + feFlood filter nodes. Four copies of a filled circle should appear at + various offsets and colors. For each circle a reference crosshair is + drawn at the lower left of the circle to indicate the expected color, + opacity and position for the filtered element. The targets are drawn + with the standard svg path element. + </p> + <p> + In addition to feFlood, feMerge, and feOffset, this test uses + 'feComposite' to recolor the SourceGraphic with the feFlood color. + The source graphic uses 'circle'. The target cross hairs are drawn + with 'path' and use 'fill' and 'fill-opacity'. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered image should match the reference image. Additionally, the + target crosshairs should match the color, lower left corner, and + opacity of each copy of the filtered circle. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-offset-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <filter id="FOMTest" filterUnits="objectBoundingBox" x="0" y="0" width="2.5" height="4"> + + <feOffset result="Off1" dx="40" dy="30"/> + <feFlood result="F1" flood-color="#408000" flood-opacity=".8"/> + <feComposite in2="Off1" operator="in" result="C1"/> + + <feOffset in="SourceGraphic" result="Off2" dx="80" dy="60"/> + <feFlood result="F2" flood-color="#408000" flood-opacity=".6"/> + <feComposite in2="Off2" operator="in" result="C2"/> + + <feOffset in="SourceGraphic" result="Off3" dx="120" dy="90"/> + <feFlood result="F3" flood-color="#408000" flood-opacity=".4"/> + <feComposite in2="Off3" operator="in" result="C3"/> + + <feMerge> + <feMergeNode in="C3"/> + <feMergeNode in="C2"/> + <feMergeNode in="C1"/> + <feMergeNode in="SourceGraphic"/> + </feMerge> + </filter> + </defs> + + <circle cx="160" cy="50" r="40" fill="#000" filter="url(#FOMTest)"/> + + <!-- Add some crosshairs of the same color of the + flood at the same location as the offset --> + + <!-- 20 pixel cross hair at 120,90 --> + <path fill="#000" transform="translate(120, 90)" d="M-1,-11h2v10h10v2h-10v10h-2v-10h-10v-2h10v-10"/> + + <!-- 20 pixel cross hair at 160,120 --> + <path fill="#408000" fill-opacity=".8" transform="translate(160, 120)" d="M-1,-11h2v10h10v2h-10v10h-2v-10h-10v-2h10v-10"/> + + <!-- 20 pixel cross hair at 200,150 --> + <path fill="#408000" fill-opacity=".6" transform="translate(200, 150)" d="M-1,-11h2v10h10v2h-10v10h-2v-10h-10v-2h10v-10"/> + + <!-- 20 pixel cross hair at 240,180 --> + <path fill="#408000" fill-opacity=".4" transform="translate(240, 180)" d="M-1,-11h2v10h10v2h-10v10h-2v-10h-10v-2h10v-10"/> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-offset-02-b-manual.svg b/testing/web-platform/tests/svg/import/filters-offset-02-b-manual.svg new file mode 100644 index 000000000..bb933b9e2 --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-offset-02-b-manual.svg @@ -0,0 +1,83 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="ED" status="created" + version="$Revision: 1.4 $" testname="$RCSfile: filters-offset-02-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html"> + <p> + Tests primitiveUnits="objectBoundingBox" and relative values. +There should be three green rectangles with thick black stroke. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required. + + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if there is nothing red visible and there are three + green rectangles with black stroke. If any green is visible outside the + black stroked rectangles the test has failed. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-offset-02-b.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <defs> + <filter id="feoffset1" primitiveUnits="objectBoundingBox" x="0%" y="0%" width="200%" height="200%"> + <feFlood width="100%" height="100%" flood-color="lime"/> + <feOffset dx="0.1" dy="0.2"/> + </filter> + <filter id="feoffset2" primitiveUnits="objectBoundingBox" x="0%" y="0%" width="200%" height="200%"> + <feOffset dx="1" dy="1"/> + </filter> + <filter id="feoffset3" primitiveUnits="objectBoundingBox" x="-100%" y="0%" width="200%" height="100%"> + <feOffset dx="-1"/> + </filter> + </defs> + + <g transform="translate(-10 60)"> + <rect x="60" y="70" width="100" height="100" fill="red"/> + <rect x="50" y="50" width="100" height="100" fill="red" filter="url(#feoffset1)"/> + <rect x="60" y="70" width="100" height="100" fill="none" stroke="black" stroke-width="2"/> + + <rect x="200" y="70" width="100" height="100" fill="red"/> + <rect x="100" y="-30" width="100" height="100" fill="lime" filter="url(#feoffset2)"/> + <rect x="200" y="70" width="100" height="100" fill="none" stroke="black" stroke-width="2"/> + + <rect x="340" y="70" width="100" height="100" fill="red"/> + <rect x="440" y="70" width="100" height="100" fill="lime" filter="url(#feoffset3)"/> + <rect x="340" y="70" width="100" height="100" fill="none" stroke="black" stroke-width="2"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg>
\ No newline at end of file diff --git a/testing/web-platform/tests/svg/import/filters-overview-01-b-manual.svg b/testing/web-platform/tests/svg/import/filters-overview-01-b-manual.svg new file mode 100644 index 000000000..c5b9621c6 --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-overview-01-b-manual.svg @@ -0,0 +1,165 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="BB" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: filters-overview-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#FilterPrimitivesOverview"> + <p>The purpose of this file is to test the 'in' attribute on filter primitives.</p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + To pass this test, the UA must render all 6 cases (SourceGraphic, SourceAlpha, BackgroundImage, BackgroundAlpha, FillPaint, StrokePaint) correctly. + </p> + <ol> + <li>The result for in="SourceGraphic" is a non blurred vertical rectangle (green with dashed stroke) overlayed with three blurred circles (red/green/blue with dashed stroke).</li> + <li>The result for in="SourceAlpha" is a non blurred vertical rectangle (green with dashed stroke) overlayed with three blurred circles (dark gray with dashed stroke).</li> + <li>The result for in="BackgroundImage" is a blurred vertical rectangle (green with dashed stroke).</li> + <li>The result for in="BackgroundAlpha" is blurred vertical rectangle (dark gray with dashed stroke).</li> + <li>The results for in="FillPaint" and in="StrokePaint" are the same. They consists of a non blurred vertical rectangle (green with dashed stroke) overlayed with a blue rectangle with blurred edges.</li> + <li>The size of the blue rectangles are bigger than the blurred circles.</li> + </ol> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-overview-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <linearGradient id="grad1" gradientUnits="objectBoundingBox" x1="50%" y1="-3%" x2="50%" y2="106%"> + <stop offset="0.00" stop-color="#0000ff"/> + <stop offset="0.33" stop-color="#ffffff"/> + <stop offset="0.67" stop-color="#ff0000"/> + <stop offset="1.00" stop-color="#ffff00"/> + </linearGradient> + + <filter id="GaussianBlur1" filterUnits="objectBoundingBox" x="-20%" y="-20%" width="140%" height="140%"> + <feGaussianBlur in="SourceAlpha" stdDeviation="2"/> + </filter> + + <filter id="GaussianBlur2" filterUnits="objectBoundingBox" x="-20%" y="-20%" width="140%" height="140%"> + <feGaussianBlur in="SourceGraphic" stdDeviation="2"/> + </filter> + + <filter id="GaussianBlur3" filterUnits="objectBoundingBox" x="-30%" y="-30%" width="160%" height="160%"> + <feFlood flood-color="white" result="flood"/> + <feGaussianBlur in="BackgroundAlpha" stdDeviation="2" result="blur"/> + <feMerge> + <feMergeNode in="flood"/> + <feMergeNode in="blur"/> + </feMerge> + </filter> + + <filter id="GaussianBlur4" filterUnits="objectBoundingBox" x="-40%" y="-40%" width="180%" height="180%"> + <feFlood flood-color="white" result="flood"/> + <feGaussianBlur in="BackgroundImage" stdDeviation="2" result="blur"/> + <feMerge> + <feMergeNode in="flood"/> + <feMergeNode in="blur"/> + </feMerge> + </filter> + + <filter id="GaussianBlur5" filterUnits="objectBoundingBox" x="-20%" y="-20%" width="140%" height="140%"> + <feGaussianBlur in="StrokePaint" stdDeviation="5"/> + </filter> + + <filter id="GaussianBlur6" filterUnits="objectBoundingBox" x="-20%" y="-20%" width="140%" height="140%"> + <feGaussianBlur in="FillPaint" stdDeviation="5"/> + </filter> + </defs> + + <g enable-background="new" stroke-dasharray="25 5" stroke="black" stroke-width="3" font-size="14" fill="black"> + + <rect x="90" y="50" width="16" height="95" fill="green"/> + <g fill-opacity="0.6" stroke="black" stroke-width="3" filter="url(#GaussianBlur1)"> + <circle cx="098" cy="085" r="25" fill="red"/> + <circle cx="080" cy="110" r="25" fill="blue"/> + <circle cx="116" cy="110" r="25" fill="green"/> + </g> + <text x="98" y="160" stroke="none" text-anchor="middle">SourceAlpha</text> + + <desc> =========================================================================================== </desc> + + <rect x="90" y="185" width="16" height="95" fill="green"/> + <g fill-opacity="0.6" stroke="black" stroke-width="3" filter="url(#GaussianBlur2)"> + <circle cx="098" cy="220" r="25" fill="red"/> + <circle cx="080" cy="245" r="25" fill="blue"/> + <circle cx="116" cy="245" r="25" fill="green"/> + </g> + <text x="98" y="295" stroke="none" text-anchor="middle">SourceGraphic</text> + + <desc> =========================================================================================== </desc> + + <rect x="230" y="50" width="16" height="95" fill="green"/> + <g fill-opacity="0.6" stroke="black" stroke-width="3" filter="url(#GaussianBlur3)"> + <circle cx="238" cy="085" r="25" fill="red"/> + <circle cx="220" cy="110" r="25" fill="blue"/> + <circle cx="256" cy="110" r="25" fill="green"/> + </g> + <text x="238" y="160" stroke="none" text-anchor="middle">BackgroundAlpha</text> + + <desc> =========================================================================================== </desc> + + <rect x="230" y="185" width="16" height="95" fill="green"/> + <g fill-opacity="0.6" stroke="black" stroke-width="3" filter="url(#GaussianBlur4)"> + <circle cx="238" cy="220" r="25" fill="red"/> + <circle cx="220" cy="245" r="25" fill="blue"/> + <circle cx="256" cy="245" r="25" fill="green"/> + </g> + <text x="238" y="295" stroke="none" text-anchor="middle">BackgroundImage</text> + + <desc> =========================================================================================== </desc> + + <rect x="370" y="50" width="16" height="95" fill="green"/> + <g id='g' stroke-opacity="0.6" stroke="blue" stroke-width="3" filter="url(#GaussianBlur5)"> + <circle cx="378" cy="085" r="25" fill="red"/> + <circle cx="360" cy="110" r="25" fill="blue"/> + <circle cx="396" cy="110" r="25" fill="green"/> + </g> + <text x="378" y="160" stroke="none" text-anchor="middle">FillPaint</text> + + <desc> =========================================================================================== </desc> + + <rect x="370" y="185" width="16" height="95" fill="green"/> + <g fill-opacity="0.6" fill="blue" stroke="black" stroke-width="3" filter="url(#GaussianBlur6)"> + <circle cx="378" cy="220" r="25"/> + <circle cx="360" cy="245" r="25"/> + <circle cx="396" cy="245" r="25"/> + </g> + <text x="378" y="295" stroke="none" text-anchor="middle">StrokePaint</text> + + </g> + + <text x="240" y="30" font-size="20" text-anchor="middle">Filter input test</text> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-overview-02-b-manual.svg b/testing/web-platform/tests/svg/import/filters-overview-02-b-manual.svg new file mode 100644 index 000000000..89f48d75c --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-overview-02-b-manual.svg @@ -0,0 +1,178 @@ +<svg version="1.1" baseProfile="basic" id="svg-root"
+ width="100%" height="100%" viewBox="0 0 480 360"
+ xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+ <!--======================================================================-->
+ <!--= SVG 1.1 2nd Edition Test Case =-->
+ <!--======================================================================-->
+ <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =-->
+ <!--= Institute of Technology, European Research Consortium for =-->
+ <!--= Informatics and Mathematics (ERCIM), Keio University). =-->
+ <!--= All Rights Reserved. =-->
+ <!--= See http://www.w3.org/Consortium/Legal/. =-->
+ <!--======================================================================-->
+ <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/"
+ template-version="1.4" reviewer="CL" author="BB" status="created"
+ version="$Revision: 1.1 $" testname="$RCSfile: filters-overview-02-b.svg,v $">
+ <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#FilterPrimitivesOverview">
+ <p>
+ The purpose of this file is to test the 'in' attribute on filter primitives.
+ This test is the same as filters-overview-01-b.svg but uses gradients with gradientUnits="userSpaceOnUse" instead for the
+ FillPaint/StrokePaint.
+ </p>
+ </d:testDescription>
+ <d:operatorScript xmlns="http://www.w3.org/1999/xhtml">
+ <p>
+ Run the test. No interaction required.
+ </p>
+ </d:operatorScript>
+ <d:passCriteria xmlns="http://www.w3.org/1999/xhtml">
+ <p>
+ To pass this test, the UA must render all 6 cases (SourceGraphic, SourceAlpha, BackgroundImage, BackgroundAlpha, FillPaint, StrokePaint) correctly.
+ </p>
+ <ol>
+ <li>The result for in="SourceGraphic" is a non blurred vertical rectangle (green with dashed stroke) overlayed with three blurred circles (red/green/blue with dashed stroke).</li>
+ <li>The result for in="SourceAlpha" is a non blurred vertical rectangle (green with dashed stroke) overlayed with three blurred circles (dark gray with dashed stroke).</li>
+ <li>The result for in="BackgroundImage" is a blurred vertical rectangle (green with dashed stroke).</li>
+ <li>The result for in="BackgroundAlpha" is blurred vertical rectangle (dark gray with dashed stroke).</li>
+ <li>The results for in="FillPaint" and in="StrokePaint" are the same. They consists of a non blurred vertical rectangle (green with dashed stroke) overlayed with a blurred gradiant (blue/white/red/yellow).</li>
+ <li>The size of the gradients are bigger than the blurred circles.</li>
+ </ol>
+ </d:passCriteria>
+ </d:SVGTestCase>
+ <title id="test-title">$RCSfile: filters-overview-02-b.svg,v $</title>
+ <defs>
+ <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F">
+ <font-face-src>
+ <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/>
+ </font-face-src>
+ </font-face>
+ </defs>
+ <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18">
+ <defs>
+ <linearGradient id="grad1" gradientUnits="userSpaceOnUse" x1="140.5" y1="57.75" x2="140.5" y2="139.5">
+ <stop offset="0.00" stop-color="#0000ff"/>
+ <stop offset="0.33" stop-color="#ffffff"/>
+ <stop offset="0.67" stop-color="#ff0000"/>
+ <stop offset="1.00" stop-color="#ffff00"/>
+ </linearGradient>
+
+ <linearGradient id="grad2" gradientUnits="userSpaceOnUse" x1="140.5" y1="192.75" x2="140.5" y2="274.5">
+ <stop offset="0.00" stop-color="#0000ff"/>
+ <stop offset="0.33" stop-color="#ffffff"/>
+ <stop offset="0.67" stop-color="#ff0000"/>
+ <stop offset="1.00" stop-color="#ffff00"/>
+ </linearGradient>
+
+ <filter id="GaussianBlur1" filterUnits="objectBoundingBox" x="-20%" y="-20%" width="140%" height="140%">
+ <feGaussianBlur in="SourceAlpha" stdDeviation="2"/>
+ </filter>
+
+ <filter id="GaussianBlur2" filterUnits="objectBoundingBox" x="-20%" y="-20%" width="140%" height="140%">
+ <feGaussianBlur in="SourceGraphic" stdDeviation="2"/>
+ </filter>
+
+ <filter id="GaussianBlur3" filterUnits="objectBoundingBox" x="-30%" y="-30%" width="160%" height="160%">
+ <feFlood flood-color="white" result="flood"/>
+ <feGaussianBlur in="BackgroundAlpha" stdDeviation="2" result="blur"/>
+ <feMerge>
+ <feMergeNode in="flood"/>
+ <feMergeNode in="blur"/>
+ </feMerge>
+ </filter>
+
+ <filter id="GaussianBlur4" filterUnits="objectBoundingBox" x="-40%" y="-40%" width="180%" height="180%">
+ <feFlood flood-color="white" result="flood"/>
+ <feGaussianBlur in="BackgroundImage" stdDeviation="2" result="blur"/>
+ <feMerge>
+ <feMergeNode in="flood"/>
+ <feMergeNode in="blur"/>
+ </feMerge>
+ </filter>
+
+ <filter id="GaussianBlur5" filterUnits="objectBoundingBox" x="-20%" y="-20%" width="140%" height="140%">
+ <feGaussianBlur in="StrokePaint" stdDeviation="5"/>
+ </filter>
+
+ <filter id="GaussianBlur6" filterUnits="objectBoundingBox" x="-20%" y="-20%" width="140%" height="140%">
+ <feGaussianBlur in="FillPaint" stdDeviation="5"/>
+ </filter>
+ </defs>
+
+ <g enable-background="new" stroke-dasharray="25 5" stroke="black" stroke-width="3" font-size="14" fill="black">
+
+ <rect x="90" y="50" width="16" height="95" fill="green"/>
+ <g fill-opacity="0.6" stroke="black" stroke-width="3" filter="url(#GaussianBlur1)">
+ <circle cx="098" cy="085" r="25" fill="red"/>
+ <circle cx="080" cy="110" r="25" fill="blue"/>
+ <circle cx="116" cy="110" r="25" fill="green"/>
+ </g>
+ <text x="98" y="160" stroke="none" text-anchor="middle">SourceAlpha</text>
+
+ <desc> =========================================================================================== </desc>
+
+ <rect x="90" y="185" width="16" height="95" fill="green"/>
+ <g fill-opacity="0.6" stroke="black" stroke-width="3" filter="url(#GaussianBlur2)">
+ <circle cx="098" cy="220" r="25" fill="red"/>
+ <circle cx="080" cy="245" r="25" fill="blue"/>
+ <circle cx="116" cy="245" r="25" fill="green"/>
+ </g>
+ <text x="98" y="295" stroke="none" text-anchor="middle">SourceGraphic</text>
+
+ <desc> =========================================================================================== </desc>
+
+ <rect x="230" y="50" width="16" height="95" fill="green"/>
+ <g fill-opacity="0.6" stroke="black" stroke-width="3" filter="url(#GaussianBlur3)">
+ <circle cx="238" cy="085" r="25" fill="red"/>
+ <circle cx="220" cy="110" r="25" fill="blue"/>
+ <circle cx="256" cy="110" r="25" fill="green"/>
+ </g>
+ <text x="238" y="160" stroke="none" text-anchor="middle">BackgroundAlpha</text>
+
+ <desc> =========================================================================================== </desc>
+
+ <rect x="230" y="185" width="16" height="95" fill="green"/>
+ <g fill-opacity="0.6" stroke="black" stroke-width="3" filter="url(#GaussianBlur4)">
+ <circle cx="238" cy="220" r="25" fill="red"/>
+ <circle cx="220" cy="245" r="25" fill="blue"/>
+ <circle cx="256" cy="245" r="25" fill="green"/>
+ </g>
+ <text x="238" y="295" stroke="none" text-anchor="middle">BackgroundImage</text>
+
+ <desc> =========================================================================================== </desc>
+
+ <rect x="370" y="50" width="16" height="95" fill="green"/>
+ <!-- bbox: 335 60 86 75 -->
+ <g stroke-opacity="0.6" stroke="url(#grad1)" stroke-width="3" filter="url(#GaussianBlur5)">
+ <circle cx="378" cy="085" r="25" fill="red"/>
+ <circle cx="360" cy="110" r="25" fill="blue"/>
+ <circle cx="396" cy="110" r="25" fill="green"/>
+ </g>
+ <text x="378" y="160" stroke="none" text-anchor="middle">FillPaint</text>
+
+ <desc> =========================================================================================== </desc>
+
+ <rect x="370" y="185" width="16" height="95" fill="green"/>
+ <!-- bbox: 335 195 86 75 -->
+ <g fill-opacity="0.6" fill="url(#grad2)" stroke="black" stroke-width="3" filter="url(#GaussianBlur6)">
+ <circle cx="378" cy="220" r="25"/>
+ <circle cx="360" cy="245" r="25"/>
+ <circle cx="396" cy="245" r="25"/>
+ </g>
+ <text x="378" y="295" stroke="none" text-anchor="middle">StrokePaint</text>
+
+ </g>
+
+ <text x="240" y="30" font-size="20" text-anchor="middle">Filter input test</text>
+
+ </g>
+ <g font-family="SVGFreeSansASCII,sans-serif" font-size="32">
+ <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.1 $</text>
+ </g>
+ <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/>
+ <!-- comment out this watermark once the test is approved -->
+ <g id="draft-watermark">
+ <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/>
+ <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240"
+ text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text>
+ </g>
+</svg>
diff --git a/testing/web-platform/tests/svg/import/filters-overview-03-b-manual.svg b/testing/web-platform/tests/svg/import/filters-overview-03-b-manual.svg new file mode 100644 index 000000000..c5688b3a8 --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-overview-03-b-manual.svg @@ -0,0 +1,166 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="BB" status="created" + version="$Revision: 1.2 $" testname="$RCSfile: filters-overview-03-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#FilterPrimitivesOverview"> + <!-- XXX make a more extensive test of FillPaint/StrokePaint in this test --> + <p>The purpose of this file is to test the 'in' attribute on filter primitives.</p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + To pass this test, the UA must render all 6 cases (SourceGraphic, SourceAlpha, BackgroundImage, BackgroundAlpha, FillPaint, StrokePaint) correctly. + </p> + <ol> + <li>The result for in="SourceGraphic" is a non blurred vertical rectangle (green with dashed stroke) overlayed with three blurred circles (red/green/blue with dashed stroke).</li> + <li>The result for in="SourceAlpha" is a non blurred vertical rectangle (green with dashed stroke) overlayed with three blurred circles (dark gray with dashed stroke).</li> + <li>The result for in="BackgroundImage" is a blurred vertical rectangle (green with dashed stroke).</li> + <li>The result for in="BackgroundAlpha" is blurred vertical rectangle (dark gray with dashed stroke).</li> + <li>The results for in="FillPaint" and in="StrokePaint" are the same. They consists of a non blurred vertical rectangle (green with dashed stroke) overlayed with a blurred gradiant (blue/white/red/yellow).</li> + <li>The size of the gradients are bigger than the blurred circles.</li> + </ol> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-overview-03-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <linearGradient id="grad1" gradientUnits="objectBoundingBox" x1="50%" y1="-3%" x2="50%" y2="106%"> + <stop offset="0.00" stop-color="#0000ff"/> + <stop offset="0.33" stop-color="#ffffff"/> + <stop offset="0.67" stop-color="#ff0000"/> + <stop offset="1.00" stop-color="#ffff00"/> + </linearGradient> + + <filter id="GaussianBlur1" filterUnits="objectBoundingBox" x="-20%" y="-20%" width="140%" height="140%"> + <feGaussianBlur in="SourceAlpha" stdDeviation="2"/> + </filter> + + <filter id="GaussianBlur2" filterUnits="objectBoundingBox" x="-20%" y="-20%" width="140%" height="140%"> + <feGaussianBlur in="SourceGraphic" stdDeviation="2"/> + </filter> + + <filter id="GaussianBlur3" filterUnits="objectBoundingBox" x="-30%" y="-30%" width="160%" height="160%"> + <feFlood flood-color="white" result="flood"/> + <feGaussianBlur in="BackgroundAlpha" stdDeviation="2" result="blur"/> + <feMerge> + <feMergeNode in="flood"/> + <feMergeNode in="blur"/> + </feMerge> + </filter> + + <filter id="GaussianBlur4" filterUnits="objectBoundingBox" x="-40%" y="-40%" width="180%" height="180%"> + <feFlood flood-color="white" result="flood"/> + <feGaussianBlur in="BackgroundImage" stdDeviation="2" result="blur"/> + <feMerge> + <feMergeNode in="flood"/> + <feMergeNode in="blur"/> + </feMerge> + </filter> + + <filter id="GaussianBlur5" filterUnits="objectBoundingBox" x="-20%" y="-20%" width="140%" height="140%"> + <feGaussianBlur in="StrokePaint" stdDeviation="5"/> + </filter> + + <filter id="GaussianBlur6" filterUnits="objectBoundingBox" x="-20%" y="-20%" width="140%" height="140%"> + <feGaussianBlur in="FillPaint" stdDeviation="5"/> + </filter> + </defs> + + <g enable-background="new" stroke-dasharray="25 5" stroke="black" stroke-width="3" font-size="14" fill="black"> + + <rect x="90" y="50" width="16" height="95" fill="green"/> + <g fill-opacity="0.6" stroke="black" stroke-width="3" filter="url(#GaussianBlur1)"> + <circle cx="098" cy="085" r="25" fill="red"/> + <circle cx="080" cy="110" r="25" fill="blue"/> + <circle cx="116" cy="110" r="25" fill="green"/> + </g> + <text x="98" y="160" stroke="none" text-anchor="middle">SourceAlpha</text> + + <desc> =========================================================================================== </desc> + + <rect x="90" y="185" width="16" height="95" fill="green"/> + <g fill-opacity="0.6" stroke="black" stroke-width="3" filter="url(#GaussianBlur2)"> + <circle cx="098" cy="220" r="25" fill="red"/> + <circle cx="080" cy="245" r="25" fill="blue"/> + <circle cx="116" cy="245" r="25" fill="green"/> + </g> + <text x="98" y="295" stroke="none" text-anchor="middle">SourceGraphic</text> + + <desc> =========================================================================================== </desc> + + <rect x="230" y="50" width="16" height="95" fill="green"/> + <g fill-opacity="0.6" stroke="black" stroke-width="3" filter="url(#GaussianBlur3)"> + <circle cx="238" cy="085" r="25" fill="red"/> + <circle cx="220" cy="110" r="25" fill="blue"/> + <circle cx="256" cy="110" r="25" fill="green"/> + </g> + <text x="238" y="160" stroke="none" text-anchor="middle">BackgroundAlpha</text> + + <desc> =========================================================================================== </desc> + + <rect x="230" y="185" width="16" height="95" fill="green"/> + <g fill-opacity="0.6" stroke="black" stroke-width="3" filter="url(#GaussianBlur4)"> + <circle cx="238" cy="220" r="25" fill="red"/> + <circle cx="220" cy="245" r="25" fill="blue"/> + <circle cx="256" cy="245" r="25" fill="green"/> + </g> + <text x="238" y="295" stroke="none" text-anchor="middle">BackgroundImage</text> + + <desc> =========================================================================================== </desc> + + <rect x="370" y="50" width="16" height="95" fill="green"/> + <g id='g' stroke-opacity="0.6" stroke="url(#grad1)" stroke-width="3" filter="url(#GaussianBlur5)"> + <circle cx="378" cy="085" r="25" fill="red"/> + <circle cx="360" cy="110" r="25" fill="blue"/> + <circle cx="396" cy="110" r="25" fill="green"/> + </g> + <text x="378" y="160" stroke="none" text-anchor="middle">FillPaint</text> + + <desc> =========================================================================================== </desc> + + <rect x="370" y="185" width="16" height="95" fill="green"/> + <g fill-opacity="0.6" fill="url(#grad1)" stroke="black" stroke-width="3" filter="url(#GaussianBlur6)"> + <circle cx="378" cy="220" r="25"/> + <circle cx="360" cy="245" r="25"/> + <circle cx="396" cy="245" r="25"/> + </g> + <text x="378" y="295" stroke="none" text-anchor="middle">StrokePaint</text> + + </g> + + <text x="240" y="30" font-size="20" text-anchor="middle">Filter input test</text> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-specular-01-f-manual.svg b/testing/web-platform/tests/svg/import/filters-specular-01-f-manual.svg new file mode 100644 index 000000000..a49e4b3bd --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-specular-01-f-manual.svg @@ -0,0 +1,195 @@ +<svg version="1.1" baseProfile="full" preserveAspectRatio="xMidYMid meet" zoomAndPan="magnify" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: filters-specular-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feSpecularLightingElement"> + <p> + Verify the basic operation of the feSpecularLighting element. The test shows + four rows of 3 images. Each row tests a different aspect of the filter and + shows the result of the filtering operation. + </p> + <p> + The first row shows the result of varying the surfaceScale attribute. The second + row shows the result of varying the specular constant (ks) attribute. The third + row shows the result of varying the specular exponent (np) attribute. The last + row shows the result of varying the lighting-color property. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-specular-01-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- Title --> + <text x="240" y="20" fill="black" font-size="12" font-family="Arial" text-anchor="middle">Filters: feSpecularLighting</text> + <!-- ===================================================================== --> + <!-- Filter definitions --> + <!-- ===================================================================== --> + <defs> + <!-- ================================================= --> + <!-- Surface scale --> + <!-- ================================================= --> + <filter id="surfaceScaleA" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feSpecularLighting in="SourceGraphic" specularConstant="1" specularExponent="1" surfaceScale="1" lighting-color="white"> + <feDistantLight azimuth="45" elevation="45"/> + </feSpecularLighting> + </filter> + <filter id="surfaceScaleB" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feSpecularLighting in="SourceGraphic" specularConstant="1" specularExponent="1" surfaceScale="10" lighting-color="white"> + <feDistantLight azimuth="45" elevation="45"/> + </feSpecularLighting> + </filter> + <filter id="surfaceScaleC" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feSpecularLighting in="SourceGraphic" specularConstant="1" specularExponent="1" surfaceScale="-10" lighting-color="white"> + <feDistantLight azimuth="45" elevation="45"/> + </feSpecularLighting> + </filter> + <!-- ================================================= --> + <!-- Specular Constants --> + <!-- ================================================= --> + <filter id="specularConstantA" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feSpecularLighting in="SourceGraphic" specularConstant="0" specularExponent="1" surfaceScale="10" lighting-color="white"> + <feDistantLight azimuth="45" elevation="45"/> + </feSpecularLighting> + </filter> + <filter id="specularConstantB" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feSpecularLighting in="SourceGraphic" specularConstant="1" specularExponent="1" surfaceScale="10" lighting-color="white"> + <feDistantLight azimuth="45" elevation="45"/> + </feSpecularLighting> + </filter> + <filter id="specularConstantC" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feSpecularLighting in="SourceGraphic" specularConstant="2" specularExponent="1" surfaceScale="10" lighting-color="white"> + <feDistantLight azimuth="45" elevation="45"/> + </feSpecularLighting> + </filter> + <!-- ================================================= --> + <!-- Specular Exponent --> + <!-- ================================================= --> + <filter id="specularExponentA" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feSpecularLighting in="SourceGraphic" specularConstant="1" specularExponent="1" surfaceScale="10" lighting-color="white"> + <feDistantLight azimuth="45" elevation="45"/> + </feSpecularLighting> + </filter> + <filter id="specularExponentB" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feSpecularLighting in="SourceGraphic" specularConstant="1" specularExponent="2" surfaceScale="10" lighting-color="white"> + <feDistantLight azimuth="45" elevation="45"/> + </feSpecularLighting> + </filter> + <filter id="specularExponentC" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feSpecularLighting in="SourceGraphic" specularConstant="1" specularExponent="4" surfaceScale="10" lighting-color="white"> + <feDistantLight azimuth="45" elevation="45"/> + </feSpecularLighting> + </filter> + <!-- ================================================= --> + <!-- Lighting colors --> + <!-- ================================================= --> + <filter id="lightingColorA" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feSpecularLighting in="SourceGraphic" specularConstant="1" specularExponent="1" surfaceScale="10" lighting-color="red"> + <feDistantLight azimuth="45" elevation="45"/> + </feSpecularLighting> + </filter> + <filter id="lightingColorB" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feSpecularLighting in="SourceGraphic" specularConstant="1" specularExponent="1" surfaceScale="10" lighting-color="yellow"> + <feDistantLight azimuth="45" elevation="45"/> + </feSpecularLighting> + </filter> + <filter id="lightingColorC" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feSpecularLighting in="SourceGraphic" specularConstant="1" specularExponent="1" surfaceScale="10" lighting-color="blue"> + <feDistantLight azimuth="45" elevation="45"/> + </feSpecularLighting> + </filter> + </defs> + <!-- ==================================================== --> + <!-- The same image is rendered multiple times with using --> + <!-- different filters. --> + <!-- ==================================================== --> + <!-- Various Surface Scales --> + <g transform="translate(0, 20)"> + <text x="90" y="25">Various values for surfaceScale: 1, 10 and -10</text> + <g fill="black"> + <rect x="90" y="30" width="50" height="30"/> + <rect x="205" y="30" width="50" height="30"/> + <rect x="320" y="30" width="50" height="30"/> + </g> + <image xlink:href="../images/bumpMap2.png" x="90" y="30" width="50" height="30" filter="url(#surfaceScaleA)"/> + <image xlink:href="../images/bumpMap2.png" x="205" y="30" width="50" height="30" filter="url(#surfaceScaleB)"/> + <image xlink:href="../images/bumpMap2.png" x="320" y="30" width="50" height="30" filter="url(#surfaceScaleC)"/> + </g> + <!-- Various Specular Constants --> + <g transform="translate(0, 90)"> + <text x="90" y="25">Various values for specularConstants: 0, 1 and 2</text> + <g fill="black"> + <rect x="90" y="30" width="50" height="30"/> + <rect x="205" y="30" width="50" height="30"/> + <rect x="320" y="30" width="50" height="30"/> + </g> + <image xlink:href="../images/bumpMap2.png" x="90" y="30" width="50" height="30" filter="url(#specularConstantA)"/> + <image xlink:href="../images/bumpMap2.png" x="205" y="30" width="50" height="30" filter="url(#specularConstantB)"/> + <image xlink:href="../images/bumpMap2.png" x="320" y="30" width="50" height="30" filter="url(#specularConstantC)"/> + </g> + <!-- Various Specular Exponents --> + <g transform="translate(0, 160)"> + <text x="90" y="25">Various values for specularExponents: 1, 2 and 4</text> + <g fill="black"> + <rect x="90" y="30" width="50" height="30"/> + <rect x="205" y="30" width="50" height="30"/> + <rect x="320" y="30" width="50" height="30"/> + </g> + <image xlink:href="../images/bumpMap2.png" x="90" y="30" width="50" height="30" filter="url(#specularExponentA)"/> + <image xlink:href="../images/bumpMap2.png" x="205" y="30" width="50" height="30" filter="url(#specularExponentB)"/> + <image xlink:href="../images/bumpMap2.png" x="320" y="30" width="50" height="30" filter="url(#specularExponentC)"/> + </g> + <!-- Various Light Colors --> + <g transform="translate(0, 230)"> + <text x="90" y="25">Various values for lighting color: red, yellow and blue</text> + <g fill="black"> + <rect x="90" y="30" width="50" height="30"/> + <rect x="205" y="30" width="50" height="30"/> + <rect x="320" y="30" width="50" height="30"/> + </g> + <image xlink:href="../images/bumpMap2.png" x="90" y="30" width="50" height="30" filter="url(#lightingColorA)"/> + <image xlink:href="../images/bumpMap2.png" x="205" y="30" width="50" height="30" filter="url(#lightingColorB)"/> + <image xlink:href="../images/bumpMap2.png" x="320" y="30" width="50" height="30" filter="url(#lightingColorC)"/> + </g> + <!-- ===================================================== --> + <!-- Legends --> + <!-- ===================================================== --> + <!-- Surface Scale --> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-tile-01-b-manual.svg b/testing/web-platform/tests/svg/import/filters-tile-01-b-manual.svg new file mode 100644 index 000000000..df49b53aa --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-tile-01-b-manual.svg @@ -0,0 +1,80 @@ +<svg version="1.1" baseProfile="basic" preserveAspectRatio="xMidYMid meet" zoomAndPan="magnify" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Rick Graham" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: filters-tile-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feTileElement"> + <p> + The test case constructs a filter that uses feTile to tile the entire specified filter region. + The tile consists of a green rectangle over a larger transparent rectangle. + The green rectangle is created with feFlood and feOffset. There is also a semi-transparent + blue rectangle that should exactly cover one of the tiled rectangles, creating a purple + tile with a black stroke (4 tiles down and 3 across). + </p> + <p> + The test uses the 'rect' element, feTile, feFlood, feOffset, feMerge, fill style, stroke, + font-family and font-size properties. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image, except for possible variations + in the labelling text (per CSS2 rules). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-tile-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-size="15" x="240" y="25" text-anchor="middle">feTile filter test: a tiled pattern</text> + <!-- ====================================================================== --> + <!-- Tiled created in defs then applied to rectangle --> + <!-- this seems pretty complex to me --> + <!-- ====================================================================== --> + <defs> + <filter id="feTileFilter" filterUnits="userSpaceOnUse" primitiveUnits="userSpaceOnUse" x="115" y="40" width="250" height="250"> + <feFlood x="115" y="40" width="54" height="19" flood-color="lime"/> + <feOffset x="115" y="40" width="50" height="25" dx="6" dy="6" result="offset"/> + <feTile/> + </filter> + </defs> + <!-- The 'g' has no content, but the filter causes a rectangle + to be created which is filled with a tiled pattern. --> + <g filter="url(#feTileFilter)"/> + <!-- Show the outline of the rectangle which is filled with the tiled pattern. --> + <rect x="115" y="40" width="250" height="250" fill="none" stroke="blue" stroke-width="2"/> + <!-- draw a semi-transparent rectangle over one of the tiles --> + <rect x="215" y="115" width="50" height="25" fill="blue" fill-opacity="0.5" stroke="black"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-turb-01-f-manual.svg b/testing/web-platform/tests/svg/import/filters-turb-01-f-manual.svg new file mode 100644 index 000000000..9d0ef617b --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-turb-01-f-manual.svg @@ -0,0 +1,102 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: filters-turb-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feTurbulenceElement"> + <p> + Test which verifies the basic facilities of feTurbulence. Six rectangular areas showing the + effects of various parameter settings for feTurbulence. The sample image indicates the + parameter settings to produce the given image. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image, except for possible variations + in the labelling text (per CSS2 rules). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-turb-01-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <desc>Six rectangular areas showing the effects of various parameter settings for feTurbulence.</desc> + <g font-family="Verdana" text-anchor="middle" font-size="10"> + <defs> + <filter id="Turb1" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feTurbulence type="turbulence" baseFrequency="0.05" numOctaves="2"/> + </filter> + <filter id="Turb2" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feTurbulence type="turbulence" baseFrequency="0.1" numOctaves="2"/> + </filter> + <filter id="Turb3" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feTurbulence type="turbulence" baseFrequency="0.05" numOctaves="8"/> + </filter> + <filter id="Turb4" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feTurbulence type="fractalNoise" baseFrequency="0.1" numOctaves="4"/> + </filter> + <filter id="Turb5" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feTurbulence type="fractalNoise" baseFrequency="0.4" numOctaves="4"/> + </filter> + <filter id="Turb6" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%"> + <feTurbulence type="fractalNoise" baseFrequency="0.1" numOctaves="1"/> + </filter> + </defs> + <rect x="25" y="25" width="100" height="75" filter="url(#Turb1)"/> + <text x="75" y="117">type=turbulence</text> + <text x="75" y="129">baseFrequency=0.05</text> + <text x="75" y="141">numOctaves=2</text> + <rect x="175" y="25" width="100" height="75" filter="url(#Turb2)"/> + <text x="225" y="117">type=turbulence</text> + <text x="225" y="129">baseFrequency=0.1</text> + <text x="225" y="141">numOctaves=2</text> + <rect x="325" y="25" width="100" height="75" filter="url(#Turb3)"/> + <text x="375" y="117">type=turbulence</text> + <text x="375" y="129">baseFrequency=0.05</text> + <text x="375" y="141">numOctaves=8</text> + <rect x="25" y="180" width="100" height="75" filter="url(#Turb4)"/> + <text x="75" y="272">type=fractalNoise</text> + <text x="75" y="284">baseFrequency=0.1</text> + <text x="75" y="296">numOctaves=4</text> + <rect x="175" y="180" width="100" height="75" filter="url(#Turb5)"/> + <text x="225" y="272">type=fractalNoise</text> + <text x="225" y="284">baseFrequency=0.4</text> + <text x="225" y="296">numOctaves=4</text> + <rect x="325" y="180" width="100" height="75" filter="url(#Turb6)"/> + <text x="375" y="272">type=fractalNoise</text> + <text x="375" y="284">baseFrequency=0.1</text> + <text x="375" y="296">numOctaves=1</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/filters-turb-02-f-manual.svg b/testing/web-platform/tests/svg/import/filters-turb-02-f-manual.svg new file mode 100644 index 000000000..779bacc77 --- /dev/null +++ b/testing/web-platform/tests/svg/import/filters-turb-02-f-manual.svg @@ -0,0 +1,147 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="CM" author="ED" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: filters-turb-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/filters.html#feTurbulenceSeedAttribute"> + <p> + This tests the <a>'seed'</a> attribute on <a>'feTurbulence'</a>. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>You should see three rectangles with black stroke. In each of these rectangles there should be + a series of numbers indicating the value for <a>'seed'</a> that was used on the small rectangle + directly above the number. The top stroked rectangle should contain 7 smaller rects that all + have a different filter applied to them, the lower two rectangles should contain 2 smaller rects + each. The filtered rectangles in each stroked rectangle should all look exactly the same. + If the filtered rectangles are red, that indicates that the test has failed. + </p> + <p> + The test has passed if: + </p> + <ul> + <li>the top stroked rectangle contains 7 smaller rectangles that are all identical</li> + <li>the lower left stroked rectangle contains 2 smaller rectangles that are identical</li> + <li>the lower right stroked rectangle contains 2 smaller rectangles that are identical</li> + <li>there's no red visible inside the stroked rectangles</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: filters-turb-02-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <!-- test negative values, these two should be same as seed="0" and seed="1" --> + <filter id="turbneg1" x="0" y="0" width="100%" height="100%"> + <feTurbulence seed="-0.2" baseFrequency="0.01" type="turbulence"/> + </filter> + <filter id="turbneg2" x="0" y="0" width="100%" height="100%"> + <feTurbulence seed="-0.5" baseFrequency="0.01" type="turbulence"/> + </filter> + <filter id="turbneg3" x="0" y="0" width="100%" height="100%"> + <feTurbulence seed="-0.8" baseFrequency="0.01" type="turbulence"/> + </filter> + + <!-- the reference for seed="0" --> + <filter id="turbzero" x="0" y="0" width="100%" height="100%"> + <feTurbulence seed="0" baseFrequency="0.01" type="turbulence"/> + </filter> + + <!-- seed="0" is transformed by the setup_seed method to be equal to seed="1" --> + <filter id="turbpos1" x="0" y="0" width="100%" height="100%"> + <feTurbulence seed="0.2" baseFrequency="0.01" type="turbulence"/> + </filter> + <filter id="turbpos2" x="0" y="0" width="100%" height="100%"> + <feTurbulence seed="0.5" baseFrequency="0.01" type="turbulence"/> + </filter> + <filter id="turbpos3" x="0" y="0" width="100%" height="100%"> + <feTurbulence seed="1.5" baseFrequency="0.01" type="turbulence"/> + </filter> + + <!-- These should be the same --> + <filter id="turbneg4" x="0" y="0" width="100%" height="100%"> + <feTurbulence seed="-1" baseFrequency="0.01" type="turbulence"/> + </filter> + <filter id="turbneg5" x="0" y="0" width="100%" height="100%"> + <feTurbulence seed="-1.5" baseFrequency="0.01" type="turbulence"/> + </filter> + + <!-- These should be the same --> + <filter id="turbneg6" x="0" y="0" width="100%" height="100%"> + <feTurbulence seed="-2" baseFrequency="0.01" type="turbulence"/> + </filter> + <filter id="turbneg7" x="0" y="0" width="100%" height="100%"> + <feTurbulence seed="-2.6" baseFrequency="0.01" type="turbulence"/> + </filter> + + <style type="text/css"> + #subtests text { fill: black } + </style> + </defs> + + <text x="50%" y="2em" style="font-size:24px; text-anchor:middle">feTurbulence seed</text> + + <g id="subtests" transform="translate(65 80)" text-anchor="middle" fill="red"> + <rect width="50" height="50" filter="url(#turbneg3)"/> + <text x="25" y="80">-0.8</text> + <rect width="50" height="50" filter="url(#turbneg2)" transform="translate(50 0)"/> + <text x="75" y="80">-0.5</text> + <rect width="50" height="50" filter="url(#turbneg1)" transform="translate(100 0)"/> + <text x="125" y="80">-0.2</text> + <rect width="50" height="50" filter="url(#turbzero)" transform="translate(150 0)"/> + <text x="175" y="80">0</text> + <rect width="50" height="50" filter="url(#turbpos1)" transform="translate(200 0)"/> + <text x="225" y="80">0.2</text> + <rect width="50" height="50" filter="url(#turbpos2)" transform="translate(250 0)"/> + <text x="275" y="80">0.5</text> + <rect width="50" height="50" filter="url(#turbpos3)" transform="translate(300 0)"/> + <text x="325" y="80">1.5</text> + <rect x="-5" y="-5" width="360" height="100" stroke="black" fill="none"/> + + <rect width="50" height="50" filter="url(#turbneg4)" transform="translate(0 120)"/> + <text x="25" y="200">-1</text> + <rect width="50" height="50" filter="url(#turbneg5)" transform="translate(50 120)"/> + <text x="75" y="200">-1.5</text> + <rect x="-5" y="115" width="110" height="100" stroke="black" fill="none"/> + + <rect width="50" height="50" filter="url(#turbneg6)" transform="translate(250 120)"/> + <text x="275" y="200">-2</text> + <rect width="50" height="50" filter="url(#turbneg7)" transform="translate(300 120)"/> + <text x="325" y="200">-2.6</text> + <rect x="245" y="115" width="110" height="100" stroke="black" fill="none"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/fonts-desc-01-t-manual.svg b/testing/web-platform/tests/svg/import/fonts-desc-01-t-manual.svg new file mode 100644 index 000000000..e5e4c73ef --- /dev/null +++ b/testing/web-platform/tests/svg/import/fonts-desc-01-t-manual.svg @@ -0,0 +1,107 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="CN" status="issue" + version="$Revision: 1.6 $" testname="$RCSfile: fonts-desc-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/fonts.html#SVGFontsOverview"> + <p> + This tests case show the behaviour of CSS font matching + based on the font-size attribute. + </p> + <!-- the test creator appears to have misunderstood the specification here. + None of the supplied fonts specifies a font-size descriptor. + Its not clear what this test is trying to test. + --> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The most correct output is + two squares, the exact match of the size, but as these are + vector fonts, and therefore scalable, the user agent can + use a margin of error, so conformant results may vary. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: fonts-desc-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <font horiz-adv-x="500"> + <font-face font-family="SVGFont1" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="diamond" d="M0 500L250 250L500 500L250 750Z"/> + </font> + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont1" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="square" d="M0 250L250 250L250 500L0 500Z"/> + </font> + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont1" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="upward-triangle" d="M0 0L500 0L250 900Z"/> + </font> + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont2" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="upward-triangle" d="M0 0L500 0L250 900Z"/> + </font> + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont2" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="square" d="M0 250L250 250L250 500L0 500Z"/> + </font> + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont2" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="diamond" d="M0 500L250 250L500 500L250 750Z"/> + </font> + </defs> + <g font-size="50" transform="translate(50, 50)"> + <text x="50" y="50" font-family="SVGFont1">a</text> + <text x="100" y="50" font-family="SVGFont2">a</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/fonts-desc-02-t-manual.svg b/testing/web-platform/tests/svg/import/fonts-desc-02-t-manual.svg new file mode 100644 index 000000000..7bd720b5c --- /dev/null +++ b/testing/web-platform/tests/svg/import/fonts-desc-02-t-manual.svg @@ -0,0 +1,152 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="CN" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: fonts-desc-02-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/fonts.html#SVGFontsOverview"> + <p> + This tests the behaviour of CSS font matching based on font-variant attribute. + </p> + <p> + The first line of text tests that the small-caps font is used for the second text element. + </p> + <p> + The second line of text tests that the order of font specification does not effect the selection + of these fonts. + </p> + <p> + The third line of text tests that the correct font is selected when a font in the list does not support + the variant required. Note that the fonts provide no x-height so scaling + (allowed by CSS) cannot be used to simulate a small cap from a regular font. + </p> + <p> + The last line tests if small-caps are synthesized. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The first line of text should be 'square' 'triangle'. + </p> + <p> + The second line of text should be 'square' 'triangle'. + </p> + <p> + The third line of text should be 'square', 'diamond', 'square', 'diamond'. + Note that the fonts provide no x-height so scaling + (allowed by CSS) cannot be used to simulate a small cap from a regular font. + </p> + <p> + The last line of test can be 'square', 'a', 'a' (from a fallback font), + 'diamond'. The first 'a' + can be replaced with a smallcaps 'A', if there is a smallcaps font installed + or if synthesis is supported. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: fonts-desc-02-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <font horiz-adv-x="500"> + <font-face font-family="SVGFont1" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="square" d="M0 250L500 250L500 750L0 750Z"/> + </font> + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont1" font-variant="small-caps" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="upward-triangle" d="M0 0L500 0L250 900Z"/> + </font> + + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont2" font-variant="small-caps" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="upward-triangle" d="M0 0L500 0L250 900Z"/> + </font> + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont2" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="square" d="M0 250L500 250L500 750L0 750Z"/> + </font> + + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont4" font-variant="normal" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="square" d="M0 250L500 250L500 750L0 750Z"/> + </font> + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont5" font-variant="small-caps" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="diamond" d="M0 500L250 250L500 500L250 750Z"/> + </font> + + </defs> + + <g font-size="30"> + <!-- This should produce a square followed by a triangle --> + <text x="50" y="50" font-family="SVGFont1">a</text> + <text x="100" y="50" font-family="SVGFont1" font-variant="small-caps">a</text> + + <!-- This should produce a square followed by a triangle --> + <text x="50" y="100" font-family="SVGFont2">a</text> + <text x="100" y="100" font-family="SVGFont2" font-variant="small-caps">a</text> + + <!-- This should produce a square, diamond, square, diamond. --> + <text x="50" y="150" font-family="SVGFont5,SVGFont4" font-variant="normal">a</text> + <text x="100" y="150" font-family="SVGFont5,SVGFont4" font-variant="small-caps">a</text> + <text x="150" y="150" font-family="SVGFont4,SVGFont5" font-variant="normal">a</text> + <text x="200" y="150" font-family="SVGFont4,SVGFont5" font-variant="small-caps">a</text> + + <!-- + This should produce a square, 'a', 'a', diamond. Or a small-caps version of the 'A' + instead of the first lower-case 'a' if synethesis is supported + --> + <text x="50" y="200" font-family="SVGFont4" font-variant="normal">a</text> + <text x="100" y="200" font-family="SVGFont4" font-variant="small-caps">a</text> + <text x="150" y="200" font-family="SVGFont5" font-variant="normal">a</text> + <text x="200" y="200" font-family="SVGFont5" font-variant="small-caps">a</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/fonts-desc-03-t-manual.svg b/testing/web-platform/tests/svg/import/fonts-desc-03-t-manual.svg new file mode 100644 index 000000000..d6de08d04 --- /dev/null +++ b/testing/web-platform/tests/svg/import/fonts-desc-03-t-manual.svg @@ -0,0 +1,128 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="CN" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: fonts-desc-03-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/fonts.html#SVGFontsOverview"> + <p> + This test demonstrates CSS font matching based on the + font-weight attribute. + </p> + <p> + The first line tests selecting a bold font. + </p> + <p> + The second line tests that order of font definition does not + effect selection. + </p> + <p> + The last line tests basic font-weight selection using + font-weight numbers. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The first line should show a square and then a triangle. + </p> + <p> + The second line should show a triangle and then a square. + </p> + <p> + The last line should show a square then a triangle. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: fonts-desc-03-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <font horiz-adv-x="500"> + <font-face font-family="SVGFont1" font-weight="normal" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="square" d="M0 250L500 250L500 750L0 750Z"/> + </font> + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont1" font-weight="bold" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="upward-triangle" d="M0 0L500 0L250 900Z"/> + </font> + + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont2" font-weight="bold" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="square" d="M0 250L500 250L500 750L0 750Z"/> + </font> + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont2" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="upward-triangle" d="M0 0L500 0L250 900Z"/> + </font> + + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont3" font-weight="300" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="square" d="M0 250L500 250L500 750L0 750Z"/> + </font> + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont3" font-weight="700" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="upward-triangle" d="M0 0L500 0L250 900Z"/> + </font> + + </defs> + + <g font-size="50"> + <text x="50" y="50" font-family="SVGFont1">a</text> + <text x="100" y="50" font-family="SVGFont1" font-weight="bold">a</text> + + <text x="50" y="150" font-family="SVGFont2">a</text> + <text x="100" y="150" font-family="SVGFont2" font-weight="bold">a</text> + + <text x="50" y="250" font-family="SVGFont3" font-weight="100">a</text> + <text x="100" y="250" font-family="SVGFont3" font-weight="900">a</text> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> --> +</svg> diff --git a/testing/web-platform/tests/svg/import/fonts-desc-04-t-manual.svg b/testing/web-platform/tests/svg/import/fonts-desc-04-t-manual.svg new file mode 100644 index 000000000..fb77128d2 --- /dev/null +++ b/testing/web-platform/tests/svg/import/fonts-desc-04-t-manual.svg @@ -0,0 +1,154 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="CN" status="reviewed" + version="$Revision: 1.7 $" testname="$RCSfile: fonts-desc-04-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/fonts.html#SVGFontsOverview"> + <p> + This test demonstrates CSS font matching based on the + font-style attribute. + </p> + <p> + The first line of text tests selecting an italic font. + </p> + <p> + The second line tests that order of font definition + does not effect correct matching. + </p> + <p> + The third line tests selecting an italic and an oblique font. + Italic can match against oblique or italic, but all other values must match exactly. + The letter 'a' will be an UA-dependent default font-family, + it should be oblique, possiblely a transformation of a + normal font. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The first line of text should produce a square followed + by a triangle. + </p> + <p> + The second line should produce a square followed + by a triangle. + </p> + <p> + The third line should produce in first place + either a triangle, a diamond, or a letter 'a' in some fallback font. + (All are correct,and depend on which font is chosen for fallback). + This is followed by two diamonds. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: fonts-desc-04-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <font horiz-adv-x="500"> + <font-face font-family="SVGFont1" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="square" d="M0 250L500 250L500 750L0 750Z"/> + </font> + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont1" font-style="italic" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="upward-triangle" d="M0 0L500 0L250 900Z"/> + </font> + + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont2" font-style="italic" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="upward-triangle" d="M0 0L500 0L250 900Z"/> + </font> + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont2" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="square" d="M0 250L500 250L500 750L0 750Z"/> + </font> + + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont3" font-style="italic" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="square" d="M0 250L500 250L500 750L0 750Z"/> + </font> + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont3" font-style="oblique" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="upward-triangle" d="M0 0L500 0L250 900Z"/> + </font> + + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont4" font-style="italic" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="square" d="M0 250L500 250L500 750L0 750Z"/> + </font> + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont5" font-style="oblique" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="diamond" d="M0 500L250 250L500 500L250 750Z"/> + </font> + + </defs> + + <g font-size="50"> + <!-- This should produce a square followed by a triangle --> + <text x="50" y="50" font-family="SVGFont1">a</text> + <text x="100" y="50" font-family="SVGFont1" font-style="italic">a</text> + + <!-- This should produce a square followed by a triangle --> + <text x="50" y="150" font-family="SVGFont2">a</text> + <text x="100" y="150" font-family="SVGFont2" font-style="italic">a</text> + + <!-- This should produce a letter 'a' followed by a diamond --> + <text x="50" y="250" font-family="SVGFont4" font-style="oblique">a</text> + <text x="100" y="250" font-family="SVGFont4,SVGFont5" font-style="oblique">a</text> + <text x="150" y="250" font-family="SVGFont5" font-style="italic">a</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/fonts-desc-05-t-manual.svg b/testing/web-platform/tests/svg/import/fonts-desc-05-t-manual.svg new file mode 100644 index 000000000..41cff386f --- /dev/null +++ b/testing/web-platform/tests/svg/import/fonts-desc-05-t-manual.svg @@ -0,0 +1,136 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="CN" status="reviewed" + version="$Revision: 1.7 $" testname="$RCSfile: fonts-desc-05-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/fonts.html#SVGFontsOverview"> + <p> + This tests a combination of font attribute matching. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The correct result for the first line is diamond, diamond, upward-triangle, + downard-triangle. The correct result for the second line is + upward-triangle, downard triangle, and a right-triangle. + </p> + <p> + Reasoning for glyphs on the first line: + The first character is a diamond because it is matched purely + on the font-style attribute. The second character is a diamond + because font-style (italic) is of highest precedence, followed + by font-variant (normal), then font-weight (bold). The third + character matches upward-triangle because again font-variant + (small-caps) is a higher precedence than font-weight. The + fourth character undisputedly matches the downward-triangle. + </p> + <p> + Reasoning for the glyphs on the second line: + The first character is a upward-triangle because the font + matching must fall back to SVGFont1 to get a match + for small-caps. The second character is a downward-triangle + because there is no match for small-caps in SVGFont2. + The third character is a right facing triangle because + italic should match oblique in SVGFont2. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: fonts-desc-05-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <font horiz-adv-x="500"> + <font-face font-family="SVGFont1" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="square" d="M0 250L500 250L500 750L0 750Z"/> + </font> + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont1" font-style="italic" font-variant="small-caps" font-weight="bold" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="upward-triangle" d="M0 0L500 0L250 900Z"/> + </font> + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont1" font-variant="small-caps" font-weight="bold" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="downward-triangle" d="M250 0L0 900L500 900Z"/> + </font> + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont1" font-style="italic" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="diamond" d="M0 500L250 250L500 500L250 750Z"/> + </font> + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont1" font-style="oblique" font-weight="bold" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="circle" d="M250 500A 250,250 0 1,0 250 499 Z"/> + </font> + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont2" font-style="oblique" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="right-triangle" d="M0 100L0 600L900 350Z"/> + </font> + + <font horiz-adv-x="500"> + <font-face font-family="SVGFont2" font-weight="bold" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="left-triangle" d="M900 100L900 600L0 350Z"/> + </font> + + </defs> + <g transform="scale(1.5) translate(0, -50)"> + <!-- This should produce a diamond, diamond, upward-triangle, downard-triangle. --> + <text x="50" y="100" font-size="20" font-family="SVGFont1" font-style="italic">a</text> + <text x="100" y="100" font-size="20" font-family="SVGFont1" font-style="italic" font-weight="bold">a</text> + <text x="150" y="100" font-size="20" font-family="SVGFont1" font-style="italic" font-variant="small-caps">a</text> + <text x="200" y="100" font-size="20" font-family="SVGFont1" font-variant="small-caps" font-weight="bold">a</text> + + <!-- This should produce a upward-triangle, downard triangle, and a right-triangle. --> + <text x="50" y="200" font-size="20" font-family="SVGFont2, SVGFont1" font-style="italic" font-variant="small-caps" font-weight="bold">a</text> + <text x="100" y="200" font-size="20" font-family="SVGFont2, SVGFont1" font-variant="small-caps" font-weight="bold">a</text> + <text x="150" y="200" font-size="20" font-family="SVGFont2, SVGFont1" font-style="italic">a</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/fonts-elem-01-t-manual.svg b/testing/web-platform/tests/svg/import/fonts-elem-01-t-manual.svg new file mode 100644 index 000000000..9ff421cf6 --- /dev/null +++ b/testing/web-platform/tests/svg/import/fonts-elem-01-t-manual.svg @@ -0,0 +1,120 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Dean Jackson" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: fonts-elem-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/fonts.html#FontElement"> + <p> + This is a basic test for embedded SVG fonts. The font "Comic Sans" + (available from Microsoft) has been converted into an SVG font and embedded + in the SVG file. The test contains two text areas, each with the character + string "AyÖ@ç" drawn at the same font size. + </p> + <p> + The upper area contains the glyphs from the embedded font placed in + the SVG file as path elements. Each glyph is placed at the location it + would be if rendered using normal text rendering (ie. the horizontal + advance between characters has been preserved). + </p> + <p> + The lower area contains the text string rendered using the embedded + SVG font. It should appear exactly the same as the upper text area, + ie. font size, character baseline and horizontal advance should be + the same. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test passes if the string "AyÖ@ç" is visible and fontsize, + character baseline and horizontal advances are the same on both lines, + as shown in the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: fonts-elem-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ===================================================================== --> + <!-- Define the font for embedding - using Microsoft's "Comic Sans MS" --> + <!-- This is an SVG Font version of Comic. The Comic font license --> + <!-- allows editable and installable font embedding. --> + <!-- Only need to embed the characters that are used in the test --> + <!-- ===================================================================== --> + <defs> + <font horiz-adv-x="959"> + <font-face font-family="TestComic" units-per-em="2048" panose-1="3 15 7 2 3 3 2 2 2 4" ascent="2257" descent="-597" alphabetic="0"/> + <missing-glyph horiz-adv-x="1024" d="M128 0V1638H896V0H128zM256 128H768V1510H256V128z"/> + <glyph unicode="@" horiz-adv-x="1907" d="M1306 412Q1200 412 1123 443T999 535Q945 482 894 455T793 428Q682 428 584 518T485 717Q485 902 630 1055T961 1208Q1003 1208 1031 1177T1059 1102Q1059 1042 959 1013Q826 975 771 926Q690 855 690 717Q690 688 717 661Q748 631 794 633Q881 637 955 795Q1022 933 1074 933Q1116 933 1142 902T1168 826Q1168 806 1162 766T1155 706Q1155 641 1211 624Q1233 617 1306 617Q1443 617 1498 684Q1548 744 1548 883Q1548 1128 1351 1283Q1171 1425 921 1425Q630 1425 465 1205Q316 1009 316 712Q316 438 491 250Q673 54 959 54Q1040 54 1142 85L1317 150Q1361 166 1374 166Q1415 166 1445 134T1475 58Q1475 -37 1262 -96Q1101 -140 961 -140Q820 -140 673 -86T420 60Q110 328 110 712Q110 1096 322 1354Q547 1630 921 1630Q1259 1630 1500 1427Q1753 1212 1753 883Q1753 658 1643 537Q1528 412 1306 412z"/> + <glyph unicode="A" horiz-adv-x="1498" d="M1250 -30Q1158 -30 1090 206Q1064 296 1025 521Q923 507 758 471L492 416Q442 285 321 33Q289 -23 234 -23Q194 -23 163 6T131 78Q131 126 282 443Q265 469 265 503Q265 584 363 607Q477 821 651 1099Q888 1478 946 1478Q1025 1478 1054 1368L1117 1032L1266 337L1323 179Q1352 98 1352 71Q1352 28 1321 -1T1250 -30zM897 1113L611 652Q732 683 978 727L897 1113z"/> + <glyph unicode="y" horiz-adv-x="1066" d="M1011 892L665 144Q537 -129 469 -313L403 -507Q377 -579 313 -579Q271 -579 241 -552T210 -483Q210 -383 426 96L68 785L23 858Q-4 904 -4 935Q-4 976 27 1007T98 1038Q144 1038 169 1003Q339 767 534 331L682 676Q762 855 836 984Q868 1040 920 1040Q961 1040 992 1011T1024 942Q1024 920 1011 892z"/> + <glyph unicode="Ö" horiz-adv-x="1635" d="M802 -61Q520 -61 324 108Q116 288 116 572Q116 918 321 1201Q550 1515 892 1515Q1221 1515 1381 1367Q1548 1213 1548 881Q1548 535 1360 257Q1144 -61 802 -61zM892 1310Q647 1310 477 1066Q320 842 320 572Q320 379 463 258Q600 144 802 144Q1045 144 1203 389Q1344 608 1344 881Q1344 1120 1237 1217Q1135 1310 892 1310zM682 1848Q813 1848 813 1743Q813 1713 769 1685Q729 1660 694 1660Q571 1660 571 1763Q571 1792 608 1820T682 1848zM1221 1856Q1255 1856 1290 1825T1325 1763Q1325 1671 1182 1671Q1141 1671 1109 1692Q1073 1716 1073 1755Q1073 1824 1118 1844Q1143 1856 1221 1856z"/> + <glyph unicode="ç" horiz-adv-x="1052" d="M770 -196Q770 -320 710 -382T528 -445Q443 -445 367 -413Q271 -371 271 -298Q271 -244 339 -244Q375 -244 420 -268T517 -293Q566 -292 590 -269T614 -201Q614 -153 577 -115T463 -48Q304 -12 208 104Q105 227 105 404Q105 607 240 823Q390 1063 578 1063Q676 1063 797 1017Q950 958 950 873Q950 835 925 806T863 776Q834 776 813 793T771 828Q712 875 578 875Q476 875 376 693Q285 526 285 404Q285 272 375 196Q459 125 591 125Q651 125 719 157L835 219Q865 235 878 235Q915 235 942 206T969 138Q969 35 713 -40Q742 -78 756 -117T770 -196z"/> + </font> + </defs> + <text fill="black" stroke="none" font-size="35" x="56" y="35">Basic SVG font element</text> + <!-- ====================================================================== --> + <!-- First place the glyphs by hand --> + <!-- ====================================================================== --> + <g fill="black" stroke="none"> + <text x="30" y="130" font-size="18">Placed Glyphs</text> + <!-- translate to text position and flip y axis (glyphs are drawn --> + <!-- upside down --> + <g transform="translate(165,140) scale(1, -1)"> + <line x1="0" y1="0" x2="210" y2="0" stroke-width="1" stroke="#888888"/> + <!-- fontsize / units-per-em == 60 / 2048 == 0.029296875 --> + <g transform="scale(0.029296875)"> + <!-- uppercase A --> + <line x1="0" y1="-3500" x2="0" y2="2000" stroke-width="50" stroke="#888888"/> + <path d="M1250 -30Q1158 -30 1090 206Q1064 296 1025 521Q923 507 758 471L492 416Q442 285 321 33Q289 -23 234 -23Q194 -23 163 6T131 78Q131 126 282 443Q265 469 265 503Q265 584 363 607Q477 821 651 1099Q888 1478 946 1478Q1025 1478 1054 1368L1117 1032L1266 337L1323 179Q1352 98 1352 71Q1352 28 1321 -1T1250 -30zM897 1113L611 652Q732 683 978 727L897 1113z"/> + <!-- lowercase y --> + <line x1="1498" y1="-3500" x2="1498" y2="2000" stroke-width="50" stroke="#888888"/> + <path transform="translate(1498,0)" d="M1011 892L665 144Q537 -129 469 -313L403 -507Q377 -579 313 -579Q271 -579 241 -552T210 -483Q210 -383 426 96L68 785L23 858Q-4 904 -4 935Q-4 976 27 1007T98 1038Q144 1038 169 1003Q339 767 534 331L682 676Q762 855 836 984Q868 1040 920 1040Q961 1040 992 1011T1024 942Q1024 920 1011 892z"/> + <!-- unicode 00D6 --> + <line x1="2564" y1="-3500" x2="2564" y2="2000" stroke-width="50" stroke="#888888"/> + <path transform="translate(2564,0)" d="M802 -61Q520 -61 324 108Q116 288 116 572Q116 918 321 1201Q550 1515 892 1515Q1221 1515 1381 1367Q1548 1213 1548 881Q1548 535 1360 257Q1144 -61 802 -61zM892 1310Q647 1310 477 1066Q320 842 320 572Q320 379 463 258Q600 144 802 144Q1045 144 1203 389Q1344 608 1344 881Q1344 1120 1237 1217Q1135 1310 892 1310zM682 1848Q813 1848 813 1743Q813 1713 769 1685Q729 1660 694 1660Q571 1660 571 1763Q571 1792 608 1820T682 1848zM1221 1856Q1255 1856 1290 1825T1325 1763Q1325 1671 1182 1671Q1141 1671 1109 1692Q1073 1716 1073 1755Q1073 1824 1118 1844Q1143 1856 1221 1856z"/> + <!-- @ sign --> + <line x1="4199" y1="-3500" x2="4199" y2="2000" stroke-width="50" stroke="#888888"/> + <path transform="translate(4199,0)" d="M1306 412Q1200 412 1123 443T999 535Q945 482 894 455T793 428Q682 428 584 518T485 717Q485 902 630 1055T961 1208Q1003 1208 1031 1177T1059 1102Q1059 1042 959 1013Q826 975 771 926Q690 855 690 717Q690 688 717 661Q748 631 794 633Q881 637 955 795Q1022 933 1074 933Q1116 933 1142 902T1168 826Q1168 806 1162 766T1155 706Q1155 641 1211 624Q1233 617 1306 617Q1443 617 1498 684Q1548 744 1548 883Q1548 1128 1351 1283Q1171 1425 921 1425Q630 1425 465 1205Q316 1009 316 712Q316 438 491 250Q673 54 959 54Q1040 54 1142 85L1317 150Q1361 166 1374 166Q1415 166 1445 134T1475 58Q1475 -37 1262 -96Q1101 -140 961 -140Q820 -140 673 -86T420 60Q110 328 110 712Q110 1096 322 1354Q547 1630 921 1630Q1259 1630 1500 1427Q1753 1212 1753 883Q1753 658 1643 537Q1528 412 1306 412z"/> + <!-- unicode 00E7 --> + <line x1="6106" y1="-3500" x2="6106" y2="2000" stroke-width="50" stroke="#888888"/> + <path transform="translate(6106,0)" d="M770 -196Q770 -320 710 -382T528 -445Q443 -445 367 -413Q271 -371 271 -298Q271 -244 339 -244Q375 -244 420 -268T517 -293Q566 -292 590 -269T614 -201Q614 -153 577 -115T463 -48Q304 -12 208 104Q105 227 105 404Q105 607 240 823Q390 1063 578 1063Q676 1063 797 1017Q950 958 950 873Q950 835 925 806T863 776Q834 776 813 793T771 828Q712 875 578 875Q476 875 376 693Q285 526 285 404Q285 272 375 196Q459 125 591 125Q651 125 719 157L835 219Q865 235 878 235Q915 235 942 206T969 138Q969 35 713 -40Q742 -78 756 -117T770 -196z"/> + <line x1="7158" y1="-3500" x2="7158" y2="2000" stroke-width="50" stroke="#888888"/> + </g> + </g> + </g> + <text x="65" y="210" font-size="18">SVG Font</text> + <g transform="translate(165, 220)" font-family="TestComic" font-size="60" fill="black" stroke="none"> + <line x1="0" y1="0" x2="210" y2="0" stroke-width="1" stroke="#888888"/> + <text>AyÖ@ç</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/fonts-elem-02-t-manual.svg b/testing/web-platform/tests/svg/import/fonts-elem-02-t-manual.svg new file mode 100644 index 000000000..7a8e34767 --- /dev/null +++ b/testing/web-platform/tests/svg/import/fonts-elem-02-t-manual.svg @@ -0,0 +1,128 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Dean Jackson" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: fonts-elem-02-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/fonts.html#FontElement"> + <p> + This is an accuracy test for embedded SVG fonts. The font "Comic Sans" + (available from Microsoft) has been converted into an SVG font and embedded + in the SVG file. The test contains two text areas, each with the character + string "AyÖ@ç" drawn at the same font size. + </p> + <p> + The upper area has the placed glyphs as path elements filled with + white over a solid black background (creating a white cutout). The + embedded SVG font text is then drawn over the cutout. + </p> + <p> + The lower area is the reverse of the upper area, with the placed + black glyphs filling the cutout created by white SVG font text. + An implementation that passes this test should completely fill the + cutout, leaving a solid black area (some slight antialiasing effects + may remain). + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed iff the black text exactly overlays the white text + on black, giving a solid black area. Some slight antialiasing effects may + remain and do not cause the test to fail. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: fonts-elem-02-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ===================================================================== --> + <!-- Define the font for embedding - using Microsoft's "Comic Sans MS" --> + <!-- This is an SVG Font version of Comic. The Comic font license --> + <!-- allows editable and installable font embedding. --> + <!-- Only need to embed the characters that are used in the test --> + <!-- ===================================================================== --> + <defs> + <font horiz-adv-x="959"> + <font-face font-family="TestComic" units-per-em="2048" panose-1="3 15 7 2 3 3 2 2 2 4" ascent="2257" descent="-597" alphabetic="0"/> + <missing-glyph horiz-adv-x="1024" d="M128 0V1638H896V0H128zM256 128H768V1510H256V128z"/> + <glyph unicode="@" horiz-adv-x="1907" d="M1306 412Q1200 412 1123 443T999 535Q945 482 894 455T793 428Q682 428 584 518T485 717Q485 902 630 1055T961 1208Q1003 1208 1031 1177T1059 1102Q1059 1042 959 1013Q826 975 771 926Q690 855 690 717Q690 688 717 661Q748 631 794 633Q881 637 955 795Q1022 933 1074 933Q1116 933 1142 902T1168 826Q1168 806 1162 766T1155 706Q1155 641 1211 624Q1233 617 1306 617Q1443 617 1498 684Q1548 744 1548 883Q1548 1128 1351 1283Q1171 1425 921 1425Q630 1425 465 1205Q316 1009 316 712Q316 438 491 250Q673 54 959 54Q1040 54 1142 85L1317 150Q1361 166 1374 166Q1415 166 1445 134T1475 58Q1475 -37 1262 -96Q1101 -140 961 -140Q820 -140 673 -86T420 60Q110 328 110 712Q110 1096 322 1354Q547 1630 921 1630Q1259 1630 1500 1427Q1753 1212 1753 883Q1753 658 1643 537Q1528 412 1306 412z"/> + <glyph unicode="A" horiz-adv-x="1498" d="M1250 -30Q1158 -30 1090 206Q1064 296 1025 521Q923 507 758 471L492 416Q442 285 321 33Q289 -23 234 -23Q194 -23 163 6T131 78Q131 126 282 443Q265 469 265 503Q265 584 363 607Q477 821 651 1099Q888 1478 946 1478Q1025 1478 1054 1368L1117 1032L1266 337L1323 179Q1352 98 1352 71Q1352 28 1321 -1T1250 -30zM897 1113L611 652Q732 683 978 727L897 1113z"/> + <glyph unicode="y" horiz-adv-x="1066" d="M1011 892L665 144Q537 -129 469 -313L403 -507Q377 -579 313 -579Q271 -579 241 -552T210 -483Q210 -383 426 96L68 785L23 858Q-4 904 -4 935Q-4 976 27 1007T98 1038Q144 1038 169 1003Q339 767 534 331L682 676Q762 855 836 984Q868 1040 920 1040Q961 1040 992 1011T1024 942Q1024 920 1011 892z"/> + <glyph unicode="Ö" horiz-adv-x="1635" d="M802 -61Q520 -61 324 108Q116 288 116 572Q116 918 321 1201Q550 1515 892 1515Q1221 1515 1381 1367Q1548 1213 1548 881Q1548 535 1360 257Q1144 -61 802 -61zM892 1310Q647 1310 477 1066Q320 842 320 572Q320 379 463 258Q600 144 802 144Q1045 144 1203 389Q1344 608 1344 881Q1344 1120 1237 1217Q1135 1310 892 1310zM682 1848Q813 1848 813 1743Q813 1713 769 1685Q729 1660 694 1660Q571 1660 571 1763Q571 1792 608 1820T682 1848zM1221 1856Q1255 1856 1290 1825T1325 1763Q1325 1671 1182 1671Q1141 1671 1109 1692Q1073 1716 1073 1755Q1073 1824 1118 1844Q1143 1856 1221 1856z"/> + <glyph unicode="ç" horiz-adv-x="1052" d="M770 -196Q770 -320 710 -382T528 -445Q443 -445 367 -413Q271 -371 271 -298Q271 -244 339 -244Q375 -244 420 -268T517 -293Q566 -292 590 -269T614 -201Q614 -153 577 -115T463 -48Q304 -12 208 104Q105 227 105 404Q105 607 240 823Q390 1063 578 1063Q676 1063 797 1017Q950 958 950 873Q950 835 925 806T863 776Q834 776 813 793T771 828Q712 875 578 875Q476 875 376 693Q285 526 285 404Q285 272 375 196Q459 125 591 125Q651 125 719 157L835 219Q865 235 878 235Q915 235 942 206T969 138Q969 35 713 -40Q742 -78 756 -117T770 -196z"/> + </font> + </defs> + <text fill="black" stroke="none" font-size="35" x="28" y="35">SVG font element accuracy</text> + <rect x="165" y="80" width="220" height="165" fill="black"/> + <text x="7" y="130" font-size="18">SVG over Glyphs</text> + <!-- translate to text position and flip y axis (glyphs are drawn --> + <!-- upside down --> + <g transform="translate(165,140) scale(1, -1)" fill="white"> + <!-- fontsize / units-per-em == 60 / 2048 == 0.029296875 --> + <g transform="scale(0.029296875)"> + <!-- uppercase A --> + <path d="M1250 -30Q1158 -30 1090 206Q1064 296 1025 521Q923 507 758 471L492 416Q442 285 321 33Q289 -23 234 -23Q194 -23 163 6T131 78Q131 126 282 443Q265 469 265 503Q265 584 363 607Q477 821 651 1099Q888 1478 946 1478Q1025 1478 1054 1368L1117 1032L1266 337L1323 179Q1352 98 1352 71Q1352 28 1321 -1T1250 -30zM897 1113L611 652Q732 683 978 727L897 1113z"/> + <!-- lowercase y --> + <path transform="translate(1498,0)" d="M1011 892L665 144Q537 -129 469 -313L403 -507Q377 -579 313 -579Q271 -579 241 -552T210 -483Q210 -383 426 96L68 785L23 858Q-4 904 -4 935Q-4 976 27 1007T98 1038Q144 1038 169 1003Q339 767 534 331L682 676Q762 855 836 984Q868 1040 920 1040Q961 1040 992 1011T1024 942Q1024 920 1011 892z"/> + <!-- unicode 00D6 --> + <path transform="translate(2564,0)" d="M802 -61Q520 -61 324 108Q116 288 116 572Q116 918 321 1201Q550 1515 892 1515Q1221 1515 1381 1367Q1548 1213 1548 881Q1548 535 1360 257Q1144 -61 802 -61zM892 1310Q647 1310 477 1066Q320 842 320 572Q320 379 463 258Q600 144 802 144Q1045 144 1203 389Q1344 608 1344 881Q1344 1120 1237 1217Q1135 1310 892 1310zM682 1848Q813 1848 813 1743Q813 1713 769 1685Q729 1660 694 1660Q571 1660 571 1763Q571 1792 608 1820T682 1848zM1221 1856Q1255 1856 1290 1825T1325 1763Q1325 1671 1182 1671Q1141 1671 1109 1692Q1073 1716 1073 1755Q1073 1824 1118 1844Q1143 1856 1221 1856z"/> + <!-- @ sign --> + <path transform="translate(4199,0)" d="M1306 412Q1200 412 1123 443T999 535Q945 482 894 455T793 428Q682 428 584 518T485 717Q485 902 630 1055T961 1208Q1003 1208 1031 1177T1059 1102Q1059 1042 959 1013Q826 975 771 926Q690 855 690 717Q690 688 717 661Q748 631 794 633Q881 637 955 795Q1022 933 1074 933Q1116 933 1142 902T1168 826Q1168 806 1162 766T1155 706Q1155 641 1211 624Q1233 617 1306 617Q1443 617 1498 684Q1548 744 1548 883Q1548 1128 1351 1283Q1171 1425 921 1425Q630 1425 465 1205Q316 1009 316 712Q316 438 491 250Q673 54 959 54Q1040 54 1142 85L1317 150Q1361 166 1374 166Q1415 166 1445 134T1475 58Q1475 -37 1262 -96Q1101 -140 961 -140Q820 -140 673 -86T420 60Q110 328 110 712Q110 1096 322 1354Q547 1630 921 1630Q1259 1630 1500 1427Q1753 1212 1753 883Q1753 658 1643 537Q1528 412 1306 412z"/> + <!-- unicode 00E7 --> + <path transform="translate(6106,0)" d="M770 -196Q770 -320 710 -382T528 -445Q443 -445 367 -413Q271 -371 271 -298Q271 -244 339 -244Q375 -244 420 -268T517 -293Q566 -292 590 -269T614 -201Q614 -153 577 -115T463 -48Q304 -12 208 104Q105 227 105 404Q105 607 240 823Q390 1063 578 1063Q676 1063 797 1017Q950 958 950 873Q950 835 925 806T863 776Q834 776 813 793T771 828Q712 875 578 875Q476 875 376 693Q285 526 285 404Q285 272 375 196Q459 125 591 125Q651 125 719 157L835 219Q865 235 878 235Q915 235 942 206T969 138Q969 35 713 -40Q742 -78 756 -117T770 -196z"/> + </g> + </g> + <g transform="translate(165, 140)" font-family="TestComic" font-size="60" fill="black" stroke="none"> + <text>AyÖ@ç</text> + </g> + <text x="7" y="210" font-size="18">Glyphs over SVG</text> + <g transform="translate(165, 210)" font-family="TestComic" font-size="60" fill="white" stroke="none"> + <text>AyÖ@ç</text> + </g> + <!-- translate to text position and flip y axis (glyphs are drawn --> + <!-- upside down --> + <g transform="translate(165,210) scale(1, -1)" fill="black"> + <!-- fontsize / units-per-em == 60 / 2048 == 0.029296875 --> + <g transform="scale(0.029296875)"> + <!-- uppercase A --> + <path d="M1250 -30Q1158 -30 1090 206Q1064 296 1025 521Q923 507 758 471L492 416Q442 285 321 33Q289 -23 234 -23Q194 -23 163 6T131 78Q131 126 282 443Q265 469 265 503Q265 584 363 607Q477 821 651 1099Q888 1478 946 1478Q1025 1478 1054 1368L1117 1032L1266 337L1323 179Q1352 98 1352 71Q1352 28 1321 -1T1250 -30zM897 1113L611 652Q732 683 978 727L897 1113z"/> + <!-- lowercase y --> + <path transform="translate(1498,0)" d="M1011 892L665 144Q537 -129 469 -313L403 -507Q377 -579 313 -579Q271 -579 241 -552T210 -483Q210 -383 426 96L68 785L23 858Q-4 904 -4 935Q-4 976 27 1007T98 1038Q144 1038 169 1003Q339 767 534 331L682 676Q762 855 836 984Q868 1040 920 1040Q961 1040 992 1011T1024 942Q1024 920 1011 892z"/> + <!-- unicode 00D6 --> + <path transform="translate(2564,0)" d="M802 -61Q520 -61 324 108Q116 288 116 572Q116 918 321 1201Q550 1515 892 1515Q1221 1515 1381 1367Q1548 1213 1548 881Q1548 535 1360 257Q1144 -61 802 -61zM892 1310Q647 1310 477 1066Q320 842 320 572Q320 379 463 258Q600 144 802 144Q1045 144 1203 389Q1344 608 1344 881Q1344 1120 1237 1217Q1135 1310 892 1310zM682 1848Q813 1848 813 1743Q813 1713 769 1685Q729 1660 694 1660Q571 1660 571 1763Q571 1792 608 1820T682 1848zM1221 1856Q1255 1856 1290 1825T1325 1763Q1325 1671 1182 1671Q1141 1671 1109 1692Q1073 1716 1073 1755Q1073 1824 1118 1844Q1143 1856 1221 1856z"/> + <!-- @ sign --> + <path transform="translate(4199,0)" d="M1306 412Q1200 412 1123 443T999 535Q945 482 894 455T793 428Q682 428 584 518T485 717Q485 902 630 1055T961 1208Q1003 1208 1031 1177T1059 1102Q1059 1042 959 1013Q826 975 771 926Q690 855 690 717Q690 688 717 661Q748 631 794 633Q881 637 955 795Q1022 933 1074 933Q1116 933 1142 902T1168 826Q1168 806 1162 766T1155 706Q1155 641 1211 624Q1233 617 1306 617Q1443 617 1498 684Q1548 744 1548 883Q1548 1128 1351 1283Q1171 1425 921 1425Q630 1425 465 1205Q316 1009 316 712Q316 438 491 250Q673 54 959 54Q1040 54 1142 85L1317 150Q1361 166 1374 166Q1415 166 1445 134T1475 58Q1475 -37 1262 -96Q1101 -140 961 -140Q820 -140 673 -86T420 60Q110 328 110 712Q110 1096 322 1354Q547 1630 921 1630Q1259 1630 1500 1427Q1753 1212 1753 883Q1753 658 1643 537Q1528 412 1306 412z"/> + <!-- unicode 00E7 --> + <path transform="translate(6106,0)" d="M770 -196Q770 -320 710 -382T528 -445Q443 -445 367 -413Q271 -371 271 -298Q271 -244 339 -244Q375 -244 420 -268T517 -293Q566 -292 590 -269T614 -201Q614 -153 577 -115T463 -48Q304 -12 208 104Q105 227 105 404Q105 607 240 823Q390 1063 578 1063Q676 1063 797 1017Q950 958 950 873Q950 835 925 806T863 776Q834 776 813 793T771 828Q712 875 578 875Q476 875 376 693Q285 526 285 404Q285 272 375 196Q459 125 591 125Q651 125 719 157L835 219Q865 235 878 235Q915 235 942 206T969 138Q969 35 713 -40Q742 -78 756 -117T770 -196z"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/fonts-elem-03-b-manual.svg b/testing/web-platform/tests/svg/import/fonts-elem-03-b-manual.svg new file mode 100644 index 000000000..6d7306705 --- /dev/null +++ b/testing/web-platform/tests/svg/import/fonts-elem-03-b-manual.svg @@ -0,0 +1,122 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Dean Jackson" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: fonts-elem-03-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/fonts.html#FontElement"> + <p> + This is a basic test for external SVG fonts. The font "Comic Sans" + (available from Microsoft) has been converted into an SVG font and placed + in an external SVG file referenced by a font-face-src element. + The test contains two text areas, each with the character + string "AyÖ@ç" drawn at the same font size. + </p> + <p> + The upper area contains the glyphs from the font placed in + the SVG file as path elements. Each glyph is placed at the location it + would be if rendered using normal text rendering (ie. the horizontal + advance between characters has been preserved). + </p> + <p> + The lower area contains the text string rendered using the external + SVG font. It should appear exactly the same as the upper text area, + ie. font size, character baseline and horizontal advance should be + the same. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test passes if the upper and lower lines show the same glyphs with + the same glyph positioing and inter-glyph spacing. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: fonts-elem-03-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <!--style type="text/css"> + <![CDATA[ + @font-face { + font-family: 'TestComic'; + font-weight: normal; + font-style: normal; + src: url("../images/ext-TestComic.svg#Font") format("svg") + } + ]]> + </style--> + <font-face font-family="TestComic"> + <font-face-src> + <font-face-uri xlink:href="../images/ext-TestComic.svg#Font"/> + </font-face-src> + </font-face> + </defs> + <text fill="black" stroke="none" font-size="30" x="26" y="35">External SVG font element (xml)</text> + <!-- ====================================================================== --> + <!-- First place the glyphs by hand --> + <!-- ====================================================================== --> + <g fill="black" stroke="none"> + <text x="31" y="130" font-size="18">Placed Glyphs</text> + <!-- translate to text position and flip y axis (glyphs are drawn --> + <!-- upside down --> + <g transform="translate(165,140) scale(1, -1)"> + <line x1="0" y1="0" x2="210" y2="0" stroke-width="1" stroke="#888888"/> + <!-- fontsize / units-per-em == 60 / 2048 == 0.029296875 --> + <g transform="scale(0.029296875)"> + <!-- uppercase A --> + <line x1="0" y1="-3500" x2="0" y2="2000" stroke-width="50" stroke="#888888"/> + <path d="M1250 -30Q1158 -30 1090 206Q1064 296 1025 521Q923 507 758 471L492 416Q442 285 321 33Q289 -23 234 -23Q194 -23 163 6T131 78Q131 126 282 443Q265 469 265 503Q265 584 363 607Q477 821 651 1099Q888 1478 946 1478Q1025 1478 1054 1368L1117 1032L1266 337L1323 179Q1352 98 1352 71Q1352 28 1321 -1T1250 -30zM897 1113L611 652Q732 683 978 727L897 1113z"/> + <!-- lowercase y --> + <line x1="1498" y1="-3500" x2="1498" y2="2000" stroke-width="50" stroke="#888888"/> + <path transform="translate(1498,0)" d="M1011 892L665 144Q537 -129 469 -313L403 -507Q377 -579 313 -579Q271 -579 241 -552T210 -483Q210 -383 426 96L68 785L23 858Q-4 904 -4 935Q-4 976 27 1007T98 1038Q144 1038 169 1003Q339 767 534 331L682 676Q762 855 836 984Q868 1040 920 1040Q961 1040 992 1011T1024 942Q1024 920 1011 892z"/> + <!-- unicode 00D6 --> + <line x1="2564" y1="-3500" x2="2564" y2="2000" stroke-width="50" stroke="#888888"/> + <path transform="translate(2564,0)" d="M802 -61Q520 -61 324 108Q116 288 116 572Q116 918 321 1201Q550 1515 892 1515Q1221 1515 1381 1367Q1548 1213 1548 881Q1548 535 1360 257Q1144 -61 802 -61zM892 1310Q647 1310 477 1066Q320 842 320 572Q320 379 463 258Q600 144 802 144Q1045 144 1203 389Q1344 608 1344 881Q1344 1120 1237 1217Q1135 1310 892 1310zM682 1848Q813 1848 813 1743Q813 1713 769 1685Q729 1660 694 1660Q571 1660 571 1763Q571 1792 608 1820T682 1848zM1221 1856Q1255 1856 1290 1825T1325 1763Q1325 1671 1182 1671Q1141 1671 1109 1692Q1073 1716 1073 1755Q1073 1824 1118 1844Q1143 1856 1221 1856z"/> + <!-- @ sign --> + <line x1="4199" y1="-3500" x2="4199" y2="2000" stroke-width="50" stroke="#888888"/> + <path transform="translate(4199,0)" d="M1306 412Q1200 412 1123 443T999 535Q945 482 894 455T793 428Q682 428 584 518T485 717Q485 902 630 1055T961 1208Q1003 1208 1031 1177T1059 1102Q1059 1042 959 1013Q826 975 771 926Q690 855 690 717Q690 688 717 661Q748 631 794 633Q881 637 955 795Q1022 933 1074 933Q1116 933 1142 902T1168 826Q1168 806 1162 766T1155 706Q1155 641 1211 624Q1233 617 1306 617Q1443 617 1498 684Q1548 744 1548 883Q1548 1128 1351 1283Q1171 1425 921 1425Q630 1425 465 1205Q316 1009 316 712Q316 438 491 250Q673 54 959 54Q1040 54 1142 85L1317 150Q1361 166 1374 166Q1415 166 1445 134T1475 58Q1475 -37 1262 -96Q1101 -140 961 -140Q820 -140 673 -86T420 60Q110 328 110 712Q110 1096 322 1354Q547 1630 921 1630Q1259 1630 1500 1427Q1753 1212 1753 883Q1753 658 1643 537Q1528 412 1306 412z"/> + <!-- unicode 00E7 --> + <line x1="6106" y1="-3500" x2="6106" y2="2000" stroke-width="50" stroke="#888888"/> + <path transform="translate(6106,0)" d="M770 -196Q770 -320 710 -382T528 -445Q443 -445 367 -413Q271 -371 271 -298Q271 -244 339 -244Q375 -244 420 -268T517 -293Q566 -292 590 -269T614 -201Q614 -153 577 -115T463 -48Q304 -12 208 104Q105 227 105 404Q105 607 240 823Q390 1063 578 1063Q676 1063 797 1017Q950 958 950 873Q950 835 925 806T863 776Q834 776 813 793T771 828Q712 875 578 875Q476 875 376 693Q285 526 285 404Q285 272 375 196Q459 125 591 125Q651 125 719 157L835 219Q865 235 878 235Q915 235 942 206T969 138Q969 35 713 -40Q742 -78 756 -117T770 -196z"/> + <line x1="7158" y1="-3500" x2="7158" y2="2000" stroke-width="50" stroke="#888888"/> + </g> + </g> + </g> + <text x="67" y="210" font-size="18">SVG Font</text> + <g transform="translate(165, 220)" font-family="TestComic" font-size="60" fill="black" stroke="none"> + <line x1="0" y1="0" x2="210" y2="0" stroke-width="1" stroke="#888888"/> + <text>AyÖ@ç</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/fonts-elem-04-b-manual.svg b/testing/web-platform/tests/svg/import/fonts-elem-04-b-manual.svg new file mode 100644 index 000000000..07362e512 --- /dev/null +++ b/testing/web-platform/tests/svg/import/fonts-elem-04-b-manual.svg @@ -0,0 +1,122 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Dean Jackson" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: fonts-elem-04-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/fonts.html#FontElement"> + <p> + This is a basic test for external SVG fonts. The font "Comic Sans" + (available from Microsoft) has been converted into an SVG font and placed + in an external SVG file referenced by a CSS stylesheet with an @font-face rule. + The test contains two text areas, each with the character + string "AyÖ@ç" drawn at the same font size. + </p> + <p> + The upper area contains the glyphs from the font placed in + the SVG file as path elements. Each glyph is placed at the location it + would be if rendered using normal text rendering (ie. the horizontal + advance between characters has been preserved). + </p> + <p> + The lower area contains the text string rendered using the external + SVG font. It should appear exactly the same as the upper text area, + ie. font size, character baseline and horizontal advance should be + the same. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test passes if the upper and lower lines show the same glyphs with + the same glyph positioing and inter-glyph spacing. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: fonts-elem-04-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <style type="text/css"> + + @font-face { + font-family: 'TestComic'; + font-weight: normal; + font-style: normal; + src: url("../images/ext-TestComic.svg#Font") format("svg") + } + + </style> + <!--font-face font-family="TestComic"> + <font-face-src> + <font-face-uri xlink:href="../images/ext-TestComic.svg#Font"/> + </font-face-src> + </font-face--> + </defs> + <text fill="black" stroke="none" font-size="30" x="26" y="35">External SVG font element (css)</text> + <!-- ====================================================================== --> + <!-- First place the glyphs by hand --> + <!-- ====================================================================== --> + <g fill="black" stroke="none"> + <text x="31" y="130" font-size="18">Placed Glyphs</text> + <!-- translate to text position and flip y axis (glyphs are drawn --> + <!-- upside down --> + <g transform="translate(165,140) scale(1, -1)"> + <line x1="0" y1="0" x2="210" y2="0" stroke-width="1" stroke="#888888"/> + <!-- fontsize / units-per-em == 60 / 2048 == 0.029296875 --> + <g transform="scale(0.029296875)"> + <!-- uppercase A --> + <line x1="0" y1="-3500" x2="0" y2="2000" stroke-width="50" stroke="#888888"/> + <path d="M1250 -30Q1158 -30 1090 206Q1064 296 1025 521Q923 507 758 471L492 416Q442 285 321 33Q289 -23 234 -23Q194 -23 163 6T131 78Q131 126 282 443Q265 469 265 503Q265 584 363 607Q477 821 651 1099Q888 1478 946 1478Q1025 1478 1054 1368L1117 1032L1266 337L1323 179Q1352 98 1352 71Q1352 28 1321 -1T1250 -30zM897 1113L611 652Q732 683 978 727L897 1113z"/> + <!-- lowercase y --> + <line x1="1498" y1="-3500" x2="1498" y2="2000" stroke-width="50" stroke="#888888"/> + <path transform="translate(1498,0)" d="M1011 892L665 144Q537 -129 469 -313L403 -507Q377 -579 313 -579Q271 -579 241 -552T210 -483Q210 -383 426 96L68 785L23 858Q-4 904 -4 935Q-4 976 27 1007T98 1038Q144 1038 169 1003Q339 767 534 331L682 676Q762 855 836 984Q868 1040 920 1040Q961 1040 992 1011T1024 942Q1024 920 1011 892z"/> + <!-- unicode 00D6 --> + <line x1="2564" y1="-3500" x2="2564" y2="2000" stroke-width="50" stroke="#888888"/> + <path transform="translate(2564,0)" d="M802 -61Q520 -61 324 108Q116 288 116 572Q116 918 321 1201Q550 1515 892 1515Q1221 1515 1381 1367Q1548 1213 1548 881Q1548 535 1360 257Q1144 -61 802 -61zM892 1310Q647 1310 477 1066Q320 842 320 572Q320 379 463 258Q600 144 802 144Q1045 144 1203 389Q1344 608 1344 881Q1344 1120 1237 1217Q1135 1310 892 1310zM682 1848Q813 1848 813 1743Q813 1713 769 1685Q729 1660 694 1660Q571 1660 571 1763Q571 1792 608 1820T682 1848zM1221 1856Q1255 1856 1290 1825T1325 1763Q1325 1671 1182 1671Q1141 1671 1109 1692Q1073 1716 1073 1755Q1073 1824 1118 1844Q1143 1856 1221 1856z"/> + <!-- @ sign --> + <line x1="4199" y1="-3500" x2="4199" y2="2000" stroke-width="50" stroke="#888888"/> + <path transform="translate(4199,0)" d="M1306 412Q1200 412 1123 443T999 535Q945 482 894 455T793 428Q682 428 584 518T485 717Q485 902 630 1055T961 1208Q1003 1208 1031 1177T1059 1102Q1059 1042 959 1013Q826 975 771 926Q690 855 690 717Q690 688 717 661Q748 631 794 633Q881 637 955 795Q1022 933 1074 933Q1116 933 1142 902T1168 826Q1168 806 1162 766T1155 706Q1155 641 1211 624Q1233 617 1306 617Q1443 617 1498 684Q1548 744 1548 883Q1548 1128 1351 1283Q1171 1425 921 1425Q630 1425 465 1205Q316 1009 316 712Q316 438 491 250Q673 54 959 54Q1040 54 1142 85L1317 150Q1361 166 1374 166Q1415 166 1445 134T1475 58Q1475 -37 1262 -96Q1101 -140 961 -140Q820 -140 673 -86T420 60Q110 328 110 712Q110 1096 322 1354Q547 1630 921 1630Q1259 1630 1500 1427Q1753 1212 1753 883Q1753 658 1643 537Q1528 412 1306 412z"/> + <!-- unicode 00E7 --> + <line x1="6106" y1="-3500" x2="6106" y2="2000" stroke-width="50" stroke="#888888"/> + <path transform="translate(6106,0)" d="M770 -196Q770 -320 710 -382T528 -445Q443 -445 367 -413Q271 -371 271 -298Q271 -244 339 -244Q375 -244 420 -268T517 -293Q566 -292 590 -269T614 -201Q614 -153 577 -115T463 -48Q304 -12 208 104Q105 227 105 404Q105 607 240 823Q390 1063 578 1063Q676 1063 797 1017Q950 958 950 873Q950 835 925 806T863 776Q834 776 813 793T771 828Q712 875 578 875Q476 875 376 693Q285 526 285 404Q285 272 375 196Q459 125 591 125Q651 125 719 157L835 219Q865 235 878 235Q915 235 942 206T969 138Q969 35 713 -40Q742 -78 756 -117T770 -196z"/> + <line x1="7158" y1="-3500" x2="7158" y2="2000" stroke-width="50" stroke="#888888"/> + </g> + </g> + </g> + <text x="67" y="210" font-size="18">SVG Font</text> + <g transform="translate(165, 220)" font-family="TestComic" font-size="60" fill="black" stroke="none"> + <line x1="0" y1="0" x2="210" y2="0" stroke-width="1" stroke="#888888"/> + <text>AyÖ@ç</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/fonts-elem-05-t-manual.svg b/testing/web-platform/tests/svg/import/fonts-elem-05-t-manual.svg new file mode 100644 index 000000000..7460c158c --- /dev/null +++ b/testing/web-platform/tests/svg/import/fonts-elem-05-t-manual.svg @@ -0,0 +1,132 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: fonts-elem-05-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/fonts.html#FontElement"> + <p> + This tests the horiz-origin-x attributes on the font and glyph elements. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + There are three subtests. The test is passed if for each subtest there is labelling text on the left and on the right, a series of black squares whose lower-left corner aligns with the centre of the corresponding small, pale blue square as shown in the reference graphic. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: fonts-elem-05-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x="240" y="50" text-anchor="middle" font-size="30"><font> horiz-origin-x</text> + <defs> + <font id="orginDefault" horiz-adv-x="1000"> + <font-face font-family="originDefault" units-per-em="1000" ascent="1000" descent="0" alphabetic="0"/> + <missing-glyph horiz-adv-x="800" d="M50 0V800H750V0H50ZM700 50V750H100V50H700Z"/> + <glyph unicode="1" glyph-name="gl_1" horiz-adv-x="1500" d="M 0 0 L 250 0 L 250 250 L 0 250 Z"/> + <glyph unicode="2" glyph-name="gl_2" horiz-adv-x="1500" d="M 0 0 L 500 0 L 500 500 L 0 500 Z"/> + <glyph unicode="3" glyph-name="gl_3" horiz-adv-x="1500" d="M 0 0 L 750 0 L 750 750 L 0 750 Z"/> + <glyph unicode="4" glyph-name="gl_4" horiz-adv-x="1500" d="M 0 0 L 1000 0 L 1000 1000 L 0 1000 Z"/> + </font> + + <font id="orgin500" horiz-adv-x="1000" horiz-origin-x="500"> + <font-face font-family="origin500" units-per-em="1000" ascent="1000" descent="0" alphabetic="0"/> + <missing-glyph horiz-adv-x="800" d="M50 0V800H750V0H50ZM700 50V750H100V50H700Z"/> + <glyph unicode="1" glyph-name="gl_1" horiz-adv-x="1500" d="M 0 0 L 250 0 L 250 250 L 0 250 Z"/> + <glyph unicode="2" glyph-name="gl_2" horiz-adv-x="1500" d="M 0 0 L 500 0 L 500 500 L 0 500 Z"/> + <glyph unicode="3" glyph-name="gl_3" horiz-adv-x="1500" d="M 0 0 L 750 0 L 750 750 L 0 750 Z"/> + <glyph unicode="4" glyph-name="gl_4" horiz-adv-x="1500" d="M 0 0 L 1000 0 L 1000 1000 L 0 1000 Z"/> + </font> + + <font id="orgin1000" horiz-adv-x="1000" horiz-origin-x="1000"> + <font-face font-family="origin1000" units-per-em="1000" ascent="1000" descent="0" alphabetic="0"/> + <missing-glyph horiz-adv-x="800" d="M50 0V800H750V0H50ZM700 50V750H100V50H700Z"/> + <glyph unicode="1" glyph-name="gl_1" horiz-adv-x="1500" d="M 0 0 L 250 0 L 250 250 L 0 250 Z"/> + <glyph unicode="2" glyph-name="gl_2" horiz-adv-x="1500" d="M 0 0 L 500 0 L 500 500 L 0 500 Z"/> + <glyph unicode="3" glyph-name="gl_3" horiz-adv-x="1500" d="M 0 0 L 750 0 L 750 750 L 0 750 Z"/> + <glyph unicode="4" glyph-name="gl_4" horiz-adv-x="1500" d="M 0 0 L 1000 0 L 1000 1000 L 0 1000 Z"/> + </font> + + + <g id="marker"> + <line y2="-40" stroke="blue"/> + <rect x="-4" y="-4" width="8" height="8" fill="#8888ff"/> + </g> + + <g id="marker500"> + <line y2="-40" stroke="blue"/> + <line x1="15" x2="15" y2="-40" stroke="blue"/> + <line x2="15" stroke="blue"/> + <rect x="-4" y="-4" width="8" height="8" fill="#8888ff"/> + </g> + + <g id="marker1000"> + <line y2="-40" stroke="blue"/> + <line x1="30" x2="30" y2="-40" stroke="blue"/> + <line x2="30" stroke="blue"/> + <rect x="-4" y="-4" width="8" height="8" fill="#8888ff"/> + </g> + </defs> + + <g transform="translate(20, 120)" font-size="14"> + + <g> + <text>horiz-origin-x unspecified (0)</text> + <use xlink:href="#marker" x="240"/> + <use xlink:href="#marker" x="285"/> + <use xlink:href="#marker" x="330"/> + <use xlink:href="#marker" x="375"/> + <text x="240" font-family="originDefault" font-size="30">1234</text> + </g> + + <g transform="translate(0, 60)"> + <text>horiz-origin-x=500</text> + <use xlink:href="#marker500" x="240"/> + <use xlink:href="#marker500" x="285"/> + <use xlink:href="#marker500" x="330"/> + <use xlink:href="#marker500" x="375"/> + <text x="240" font-family="origin500" font-size="30">1234</text> + </g> + + + <g transform="translate(0, 120)"> + <text>horiz-adv-x=1000 but ignored</text> + <use xlink:href="#marker1000" x="240"/> + <use xlink:href="#marker1000" x="285"/> + <use xlink:href="#marker1000" x="330"/> + <use xlink:href="#marker1000" x="375"/> + <text x="240" font-family="origin1000" font-size="30">1234</text> + </g> + + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/fonts-elem-06-t-manual.svg b/testing/web-platform/tests/svg/import/fonts-elem-06-t-manual.svg new file mode 100644 index 000000000..a6116e1ee --- /dev/null +++ b/testing/web-platform/tests/svg/import/fonts-elem-06-t-manual.svg @@ -0,0 +1,122 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: fonts-elem-06-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/fonts.html#FontElement"> + <p> + This test validates that the font element's horiz-adv-x is used as + the default glyph's advance when there is no glyph advance specified. + All fonts have a units-per-em of 1000. + </p> + <p> + The first row shows a layout with a default advance of 1000. + Glyphs have no advance so the 1000 default should be used. + </p> + <p> + The second row shows a layout with a default advance of 2000. + Glyphs have no advance so the 2000 default should be used. + </p> + <p> + The last row shows a layout with a default advance of 0. + Glyphs have a specified advance so the 0 default should be ignored. + </p> + <p> + Blue reference markers show the expected glyph positions. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + There are three subtests. The test is passed if for each subtest there is labelling text on the left and on the right, a series of black squares whose lower-left corner aligns with the centre of the corresponding small, pale blue square as shown in the reference graphic. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: fonts-elem-06-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x="240" y="50" text-anchor="middle" font-size="30"><font> horiz-adv-x</text> + <defs> + <font id="advance1000" horiz-adv-x="1000"> + <font-face font-family="advance1000" units-per-em="1000" ascent="1000" descent="0" alphabetic="0"/> + <missing-glyph d="M50 0V800H750V0H50ZM700 50V750H100V50H700Z"/> + <glyph unicode="1" glyph-name="gl_1" d="M 0 0 L 250 0 L 250 250 L 0 250 Z"/> + <glyph unicode="2" glyph-name="gl_2" d="M 0 0 L 500 0 L 500 500 L 0 500 Z"/> + </font> + + <font id="advance2000" horiz-adv-x="2000"> + <font-face font-family="advance2000" units-per-em="1000" ascent="1000" descent="0" alphabetic="0"/> + <missing-glyph d="M50 0V800H750V0H50ZM700 50V750H100V50H700Z"/> + <glyph unicode="1" glyph-name="gl_1" d="M 0 0 L 250 0 L 250 250 L 0 250 Z"/> + <glyph unicode="2" glyph-name="gl_2" d="M 0 0 L 500 0 L 500 500 L 0 500 Z"/> + </font> + + <font id="advanceIgnored" horiz-adv-x="0"> + <font-face font-family="advanceIgnored" units-per-em="1000" ascent="1000" descent="0" alphabetic="0"/> + <missing-glyph horiz-adv-x="800" d="M50 0V800H750V0H50ZM700 50V750H100V50H700Z"/> + <glyph unicode="1" glyph-name="gl_1" horiz-adv-x="3000" d="M 0 0 L 250 0 L 250 250 L 0 250 Z"/> + <glyph unicode="2" glyph-name="gl_2" horiz-adv-x="3000" d="M 0 0 L 500 0 L 500 500 L 0 500 Z"/> + </font> + + <g id="marker"> + <line y2="-20" stroke="blue"/> + <rect x="-4" y="-4" width="8" height="8" fill="#8888ff"/> + </g> + </defs> + + <g transform="translate(20, 120)" font-size="14"> + + <g> + <text>horiz-adv-x=1000</text> + <use xlink:href="#marker" x="240"/> + <use xlink:href="#marker" x="270"/> + <text x="240" font-family="advance1000" font-size="30">12</text> + </g> + + <g transform="translate(0, 40)"> + <text>horiz-adv-x=2000</text> + <use xlink:href="#marker" x="240"/> + <use xlink:href="#marker" x="300"/> + <text x="240" font-family="advance2000" font-size="30">12</text> + </g> + + + <g transform="translate(0, 80)"> + <text>horiz-adv-x=1000 but ignored</text> + <use xlink:href="#marker" x="240"/> + <use xlink:href="#marker" x="330"/> + <text x="240" font-family="advanceIgnored" font-size="30">12</text> + </g> + + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/fonts-elem-07-b-manual.svg b/testing/web-platform/tests/svg/import/fonts-elem-07-b-manual.svg new file mode 100644 index 000000000..f9167aeb3 --- /dev/null +++ b/testing/web-platform/tests/svg/import/fonts-elem-07-b-manual.svg @@ -0,0 +1,132 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="BB" author="CL" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: fonts-elem-07-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/fonts.html#FontElement"> + <p> + This is a basic test for embedded SVG fonts. The font "Comic Sans" + (available from Microsoft) has been converted into an SVG font and embedded + in the SVG file. The test contains two text areas, each with the character + string "AyÖ@ç" drawn at the same font size. + </p> + <p> + The upper area contains the glyphs from the embedded font placed in + the SVG file as path elements. Each glyph is placed at the location it + would be if rendered using normal text rendering (ie. the horizontal + advance between characters has been preserved). + </p> + <p> + The lower area contains the text string rendered using the embedded + SVG font, referenced with a CSS @font-face declaration. The SVG font does not have a font-family attribute, so the reference is via the @font-face block which points to a font element by ID. It should appear + exactly the same as the upper text area, + ie. font size, character baseline and horizontal advance should be + the same. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test passes if the string "AyÖ@ç" is visible and fontsize, + character baseline and horizontal advances are the same on both lines, + as shown in the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: fonts-elem-07-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <style type="text/css"> + @font-face { + font-family: 'TestComic'; + font-weight: normal; + font-style: normal; + src: url("#InternalFont") format("svg") + } + #foo {font-family: TestComic} + </style> + </defs> + <!-- ===================================================================== --> + <!-- Define the font for embedding - using Microsoft's "Comic Sans MS" --> + <!-- This is an SVG Font version of Comic. The Comic font license --> + <!-- allows editable and installable font embedding. --> + <!-- Only need to embed the characters that are used in the test --> + <!-- ===================================================================== --> + <defs> + <font horiz-adv-x="959" id="InternalFont"> + <font-face units-per-em="2048" panose-1="3 15 7 2 3 3 2 2 2 4" ascent="2257" descent="-597" alphabetic="0"/> + <missing-glyph horiz-adv-x="1024" d="M128 0V1638H896V0H128zM256 128H768V1510H256V128z"/> + <glyph unicode="@" horiz-adv-x="1907" d="M1306 412Q1200 412 1123 443T999 535Q945 482 894 455T793 428Q682 428 584 518T485 717Q485 902 630 1055T961 1208Q1003 1208 1031 1177T1059 1102Q1059 1042 959 1013Q826 975 771 926Q690 855 690 717Q690 688 717 661Q748 631 794 633Q881 637 955 795Q1022 933 1074 933Q1116 933 1142 902T1168 826Q1168 806 1162 766T1155 706Q1155 641 1211 624Q1233 617 1306 617Q1443 617 1498 684Q1548 744 1548 883Q1548 1128 1351 1283Q1171 1425 921 1425Q630 1425 465 1205Q316 1009 316 712Q316 438 491 250Q673 54 959 54Q1040 54 1142 85L1317 150Q1361 166 1374 166Q1415 166 1445 134T1475 58Q1475 -37 1262 -96Q1101 -140 961 -140Q820 -140 673 -86T420 60Q110 328 110 712Q110 1096 322 1354Q547 1630 921 1630Q1259 1630 1500 1427Q1753 1212 1753 883Q1753 658 1643 537Q1528 412 1306 412z"/> + <glyph unicode="A" horiz-adv-x="1498" d="M1250 -30Q1158 -30 1090 206Q1064 296 1025 521Q923 507 758 471L492 416Q442 285 321 33Q289 -23 234 -23Q194 -23 163 6T131 78Q131 126 282 443Q265 469 265 503Q265 584 363 607Q477 821 651 1099Q888 1478 946 1478Q1025 1478 1054 1368L1117 1032L1266 337L1323 179Q1352 98 1352 71Q1352 28 1321 -1T1250 -30zM897 1113L611 652Q732 683 978 727L897 1113z"/> + <glyph unicode="y" horiz-adv-x="1066" d="M1011 892L665 144Q537 -129 469 -313L403 -507Q377 -579 313 -579Q271 -579 241 -552T210 -483Q210 -383 426 96L68 785L23 858Q-4 904 -4 935Q-4 976 27 1007T98 1038Q144 1038 169 1003Q339 767 534 331L682 676Q762 855 836 984Q868 1040 920 1040Q961 1040 992 1011T1024 942Q1024 920 1011 892z"/> + <glyph unicode="Ö" horiz-adv-x="1635" d="M802 -61Q520 -61 324 108Q116 288 116 572Q116 918 321 1201Q550 1515 892 1515Q1221 1515 1381 1367Q1548 1213 1548 881Q1548 535 1360 257Q1144 -61 802 -61zM892 1310Q647 1310 477 1066Q320 842 320 572Q320 379 463 258Q600 144 802 144Q1045 144 1203 389Q1344 608 1344 881Q1344 1120 1237 1217Q1135 1310 892 1310zM682 1848Q813 1848 813 1743Q813 1713 769 1685Q729 1660 694 1660Q571 1660 571 1763Q571 1792 608 1820T682 1848zM1221 1856Q1255 1856 1290 1825T1325 1763Q1325 1671 1182 1671Q1141 1671 1109 1692Q1073 1716 1073 1755Q1073 1824 1118 1844Q1143 1856 1221 1856z"/> + <glyph unicode="ç" horiz-adv-x="1052" d="M770 -196Q770 -320 710 -382T528 -445Q443 -445 367 -413Q271 -371 271 -298Q271 -244 339 -244Q375 -244 420 -268T517 -293Q566 -292 590 -269T614 -201Q614 -153 577 -115T463 -48Q304 -12 208 104Q105 227 105 404Q105 607 240 823Q390 1063 578 1063Q676 1063 797 1017Q950 958 950 873Q950 835 925 806T863 776Q834 776 813 793T771 828Q712 875 578 875Q476 875 376 693Q285 526 285 404Q285 272 375 196Q459 125 591 125Q651 125 719 157L835 219Q865 235 878 235Q915 235 942 206T969 138Q969 35 713 -40Q742 -78 756 -117T770 -196z"/> + </font> + </defs> + <text fill="black" stroke="none" font-size="35" x="56" y="35">Basic SVG font element</text> + <!-- ====================================================================== --> + <!-- First place the glyphs by hand --> + <!-- ====================================================================== --> + <g fill="black" stroke="none"> + <text x="30" y="130" font-size="18">Placed Glyphs</text> + <!-- translate to text position and flip y axis (glyphs are drawn --> + <!-- upside down --> + <g transform="translate(165,140) scale(1, -1)"> + <line x1="0" y1="0" x2="210" y2="0" stroke-width="1" stroke="#888888"/> + <!-- fontsize / units-per-em == 60 / 2048 == 0.029296875 --> + <g transform="scale(0.029296875)"> + <!-- uppercase A --> + <line x1="0" y1="-3500" x2="0" y2="2000" stroke-width="50" stroke="#888888"/> + <path d="M1250 -30Q1158 -30 1090 206Q1064 296 1025 521Q923 507 758 471L492 416Q442 285 321 33Q289 -23 234 -23Q194 -23 163 6T131 78Q131 126 282 443Q265 469 265 503Q265 584 363 607Q477 821 651 1099Q888 1478 946 1478Q1025 1478 1054 1368L1117 1032L1266 337L1323 179Q1352 98 1352 71Q1352 28 1321 -1T1250 -30zM897 1113L611 652Q732 683 978 727L897 1113z"/> + <!-- lowercase y --> + <line x1="1498" y1="-3500" x2="1498" y2="2000" stroke-width="50" stroke="#888888"/> + <path transform="translate(1498,0)" d="M1011 892L665 144Q537 -129 469 -313L403 -507Q377 -579 313 -579Q271 -579 241 -552T210 -483Q210 -383 426 96L68 785L23 858Q-4 904 -4 935Q-4 976 27 1007T98 1038Q144 1038 169 1003Q339 767 534 331L682 676Q762 855 836 984Q868 1040 920 1040Q961 1040 992 1011T1024 942Q1024 920 1011 892z"/> + <!-- unicode 00D6 --> + <line x1="2564" y1="-3500" x2="2564" y2="2000" stroke-width="50" stroke="#888888"/> + <path transform="translate(2564,0)" d="M802 -61Q520 -61 324 108Q116 288 116 572Q116 918 321 1201Q550 1515 892 1515Q1221 1515 1381 1367Q1548 1213 1548 881Q1548 535 1360 257Q1144 -61 802 -61zM892 1310Q647 1310 477 1066Q320 842 320 572Q320 379 463 258Q600 144 802 144Q1045 144 1203 389Q1344 608 1344 881Q1344 1120 1237 1217Q1135 1310 892 1310zM682 1848Q813 1848 813 1743Q813 1713 769 1685Q729 1660 694 1660Q571 1660 571 1763Q571 1792 608 1820T682 1848zM1221 1856Q1255 1856 1290 1825T1325 1763Q1325 1671 1182 1671Q1141 1671 1109 1692Q1073 1716 1073 1755Q1073 1824 1118 1844Q1143 1856 1221 1856z"/> + <!-- @ sign --> + <line x1="4199" y1="-3500" x2="4199" y2="2000" stroke-width="50" stroke="#888888"/> + <path transform="translate(4199,0)" d="M1306 412Q1200 412 1123 443T999 535Q945 482 894 455T793 428Q682 428 584 518T485 717Q485 902 630 1055T961 1208Q1003 1208 1031 1177T1059 1102Q1059 1042 959 1013Q826 975 771 926Q690 855 690 717Q690 688 717 661Q748 631 794 633Q881 637 955 795Q1022 933 1074 933Q1116 933 1142 902T1168 826Q1168 806 1162 766T1155 706Q1155 641 1211 624Q1233 617 1306 617Q1443 617 1498 684Q1548 744 1548 883Q1548 1128 1351 1283Q1171 1425 921 1425Q630 1425 465 1205Q316 1009 316 712Q316 438 491 250Q673 54 959 54Q1040 54 1142 85L1317 150Q1361 166 1374 166Q1415 166 1445 134T1475 58Q1475 -37 1262 -96Q1101 -140 961 -140Q820 -140 673 -86T420 60Q110 328 110 712Q110 1096 322 1354Q547 1630 921 1630Q1259 1630 1500 1427Q1753 1212 1753 883Q1753 658 1643 537Q1528 412 1306 412z"/> + <!-- unicode 00E7 --> + <line x1="6106" y1="-3500" x2="6106" y2="2000" stroke-width="50" stroke="#888888"/> + <path transform="translate(6106,0)" d="M770 -196Q770 -320 710 -382T528 -445Q443 -445 367 -413Q271 -371 271 -298Q271 -244 339 -244Q375 -244 420 -268T517 -293Q566 -292 590 -269T614 -201Q614 -153 577 -115T463 -48Q304 -12 208 104Q105 227 105 404Q105 607 240 823Q390 1063 578 1063Q676 1063 797 1017Q950 958 950 873Q950 835 925 806T863 776Q834 776 813 793T771 828Q712 875 578 875Q476 875 376 693Q285 526 285 404Q285 272 375 196Q459 125 591 125Q651 125 719 157L835 219Q865 235 878 235Q915 235 942 206T969 138Q969 35 713 -40Q742 -78 756 -117T770 -196z"/> + <line x1="7158" y1="-3500" x2="7158" y2="2000" stroke-width="50" stroke="#888888"/> + </g> + </g> + </g> + <text x="65" y="210" font-size="18">SVG Font</text> + <g transform="translate(165, 220)" font-size="60" fill="black" stroke="none"> + <line x1="0" y1="0" x2="210" y2="0" stroke-width="1" stroke="#888888"/> + <text id="foo">AyÖ@ç</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/fonts-glyph-02-t-manual.svg b/testing/web-platform/tests/svg/import/fonts-glyph-02-t-manual.svg new file mode 100644 index 000000000..68ce4fa73 --- /dev/null +++ b/testing/web-platform/tests/svg/import/fonts-glyph-02-t-manual.svg @@ -0,0 +1,88 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="CN" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: fonts-glyph-02-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/fonts.html#GlyphElement"> + <p> + The first subtest tests the arabic-form attribute on the glyph element, + the second subtest is the same, but with glyphs for the letter khah. + It should match the reference image. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The first subtest must produce a + 'downward triangle', a 'space', a 'square', a 'diamond' + and then an 'upward triangle' in this order. Remembering + that arabic text is right to left. + </p> + <p>The second subtest must produce the isolated, initial, medial, final and + glyphs of the letter khah. Again in the writing direction, from right to left. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: fonts-glyph-02-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <font horiz-adv-x="300"> + <font-face font-family="SVGFont" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space" horiz-adv-x="300"/> + <glyph unicode="ښ" glyph-name="downward-triangle" horiz-adv-x="500" arabic-form="isolated" d="M0 900L500 900L250 0Z"/> + <glyph unicode="ښ" glyph-name="square" horiz-adv-x="500" arabic-form="initial" d="M0 250L500 250L500 750L0 750Z"/> + <glyph unicode="ښ" glyph-name="diamond" horiz-adv-x="500" arabic-form="medial" d="M0 500L250 250L500 500L250 750Z"/> + <glyph unicode="ښ" glyph-name="upward-triangle" horiz-adv-x="500" arabic-form="terminal" d="M0 0L500 0L250 900Z"/> + </font> + <font horiz-adv-x="573"> + <font-face font-family="SVGAr" units-per-em="1000" panose-1="5 1 1 1 1 1 1 1 1 1" ascent="1025" descent="-399" alphabetic="0"/> + <missing-glyph horiz-adv-x="500" d="M31 0V800H469V0H31ZM438 31V769H62V31H438Z"/> + <glyph unicode=" " glyph-name="space" horiz-adv-x="370"/> + <glyph unicode="خ" glyph-name="khah-isolated" arabic-form="isolated" horiz-adv-x="562" d="M309 360Q309 353 297 335T271 317Q260 317 227 337T194 370Q194 380 205 397T232 415Q246 415 277 395T309 360ZM518 -265Q516 -269 509 -275Q507 -277 502 -281Q447 -319 424 -330Q356 -363 281 -363Q228 -363 186 -347T110 -294Q69 -249 54 -199Q44 -167 44 -127Q44 -96 50 -65T76 12Q88 39 110 70Q152 127 152 137Q152 151 148 156T121 161Q95 161 85 156Q72 146 62 140Q44 128 35 130Q35 138 35 146Q37 151 43 162Q77 208 98 219T159 231Q170 231 234 221Q255 218 298 210H340Q347 210 382 218T425 230T435 235Q446 239 449 234Q454 226 444 189T426 152Q418 152 393 154T360 156Q327 156 297 149T228 120Q180 93 142 36Q96 -33 96 -110Q96 -209 168 -257Q223 -294 300 -294Q343 -294 371 -291Q429 -285 489 -267Q506 -260 511 -260Q514 -262 518 -265Z"/> + <glyph unicode="خ" glyph-name="khah-initial" arabic-form="initial" horiz-adv-x="728" d="M297 372Q297 365 285 347T259 329Q248 329 215 349T182 382Q182 392 193 409T220 427Q234 427 265 407T297 372ZM600 0H0V68H373Q396 68 396 86Q396 89 394 95Q377 137 347 159Q308 188 243 188Q210 188 183 171Q165 160 157 158T145 156Q138 156 138 164L140 174Q145 196 191 220Q228 240 269 240Q313 240 355 221T447 160Q488 120 530 81Q543 73 563 71T609 68Q619 68 620 68T625 68Q645 68 645 46Q645 30 633 15T600 0Z"/> + <glyph unicode="خ" glyph-name="khah-medial" arabic-form="medial" horiz-adv-x="625" d="M296 376Q296 369 284 351T258 333Q247 333 214 353T181 386Q181 396 192 413T219 431Q233 431 264 411T296 376ZM625 0H0V68H373Q396 68 396 86Q396 89 394 95Q377 137 347 159Q308 188 243 188Q210 188 183 171Q165 160 157 158T145 156Q138 156 138 164L140 174Q145 196 191 220Q228 240 269 240Q313 240 355 221T447 160Q488 120 530 81Q543 73 563 71T609 68Q619 68 620 68T625 68V0Z"/> + <glyph unicode="خ" glyph-name="khah-terminal" arabic-form="terminal" horiz-adv-x="514" d="M296 352Q296 345 284 327T258 309Q247 309 214 329T181 362Q181 372 192 389T219 407Q233 407 264 387T296 352ZM514 0H375Q313 0 298 64T261 128Q209 128 153 62Q91 -12 91 -101Q91 -199 162 -243Q220 -279 319 -279Q367 -279 390 -276T463 -259Q466 -258 475 -255T488 -252Q490 -252 491 -254T489 -263Q484 -272 466 -286T433 -307Q408 -320 401 -323Q349 -344 277 -344Q169 -344 104 -274Q44 -210 44 -118Q44 -88 51 -53T73 14Q80 31 97 56Q132 108 132 118Q132 127 126 134T110 141Q92 141 85 137Q72 127 59 117Q49 112 44 112Q38 112 38 119Q38 122 40 128Q49 156 80 182Q116 212 157 212Q170 212 188 208Q232 198 258 198H320Q345 198 357 201Q374 207 383 209T398 214T412 216Q420 216 421 212Q424 202 414 170T396 137Q394 137 382 140T362 143Q346 143 337 135T327 104Q327 91 341 80T379 68H514V0Z"/> + </font> + </defs> + <g font-family="SVGFont" font-size="80" text-anchor="middle"> + <!-- This should produce 'downward triangle' 'space' 'square' 'diamond' 'upward-triangle' --> + <text x="240" y="100" direction="rtl">ښ ښښښ</text> + </g> + <g font-family="SVGAr" font-size="80" text-anchor="middle"> + <!-- this should produce isolated khah, followed by initial,medial and terminal khah --> + <text x="240" y="200" direction="rtl">خ خخخ</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/fonts-glyph-03-t-manual.svg b/testing/web-platform/tests/svg/import/fonts-glyph-03-t-manual.svg new file mode 100644 index 000000000..e7bcc10b1 --- /dev/null +++ b/testing/web-platform/tests/svg/import/fonts-glyph-03-t-manual.svg @@ -0,0 +1,78 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="CN" status="issue" + version="$Revision: 1.6 $" testname="$RCSfile: fonts-glyph-03-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/fonts.html#GlyphElement"> + <p>ISSUE: http://www.w3.org/2011/02/27-svg-irc#T22-20-51 - unapprove test for now</p> + <p> + This files tests the lang attribute support of the glyph + element. The test should produce an upward-triangle for + the first (en) test element and a square for the second (fr) + and third (fr-ca) text element. In the third case, a glyph for + fr is also suitable for a more specific language text fr-ca. + In the fourth case, no suitable language specific or general + glyph is provided by the test so a fallback font for the letter + 'a' should be used. A triangle or square must not be + displayed in the fourth case. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if, from top to bottom, you see an upward pointing triangle, then two squares, and finally the letter "a". + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: fonts-glyph-03-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <font horiz-adv-x="500"> + <font-face font-family="SVGFont" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <missing-glyph horiz-adv-x="500" d="M0 0L500 0L500 1000L0 1000M50 50L50 950L450 950L450 50Z"/> + <glyph unicode=" " glyph-name="space"/> + <glyph unicode="a" glyph-name="upward-triangle" lang="en" d="M0 0L500 0L250 900Z"/> + <glyph unicode="a" glyph-name="square" lang="fr" d="M0 250L500 250L500 750L0 750Z"/> + </font> + </defs> + <g font-family="SVGFont" font-size="50"> + <!-- Should produce an upward pointing triangle --> + <text x="50" y="50" xml:lang="en">a</text> + <!-- Should produce a square --> + <text x="50" y="120" xml:lang="fr">a</text> + <!-- Should also produce a square --> + <text x="50" y="190" xml:lang="fr-ca">a</text> + <!-- Should fall back to another font --> + <text x="50" y="260" xml:lang="de">a</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/fonts-glyph-04-t-manual.svg b/testing/web-platform/tests/svg/import/fonts-glyph-04-t-manual.svg new file mode 100644 index 000000000..498244b84 --- /dev/null +++ b/testing/web-platform/tests/svg/import/fonts-glyph-04-t-manual.svg @@ -0,0 +1,69 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="CN" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: fonts-glyph-04-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/fonts.html#GlyphElement"> + <p> + This tests that glyph selection is done in the + order in the definition of the font element. + The first line of text should be represented by + two triangles and an 'l'. The second line should + be represented by a square. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if on the first line you see two upward pointed triangles + followed by the letter "l". On the second line, a single square. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: fonts-glyph-04-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <font horiz-adv-x="500"> + <font-face font-family="SVGFont1" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <glyph unicode="f" glyph-name="upward-triangle" d="M0 0L500 0L250 900Z"/> + <glyph unicode="ffl" glyph-name="square" d="M0 250L500 250L500 750L0 750Z"/> + </font> + <font horiz-adv-x="500"> + <font-face font-family="SVGFont2" units-per-em="1000" ascent="800" descent="200" alphabetic="200"/> + <glyph unicode="ffl" glyph-name="square 2" d="M0 250L500 250L500 750L0 750Z"/> + <glyph unicode="f" glyph-name="upward-triangle 2" d="M0 0L500 0L250 900Z"/> + </font> + </defs> + <text x="100" y="100" font-size="50" font-family="SVGFont1">ffl</text> + <text x="100" y="200" font-size="50" font-family="SVGFont2">ffl</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/fonts-kern-01-t-manual.svg b/testing/web-platform/tests/svg/import/fonts-kern-01-t-manual.svg new file mode 100644 index 000000000..0b52ff662 --- /dev/null +++ b/testing/web-platform/tests/svg/import/fonts-kern-01-t-manual.svg @@ -0,0 +1,293 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: fonts-kern-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/fonts.html#KernElements"> + <p> + This test validates handling of the hkern element. + </p> + <p> + In all instances, a text element matching a font with hkern + is displayed along with reference markers showing the expected + glyph positioning. + </p> + <p> + The 'fontA' cell shows the string "12" with "fontA" for which there + in a kerning pair defined with u1="1" and u2="2". + </p> + <p> + The 'fontB' cell shows the string "12" with "fontB" for which there + in a kerning pair defined with g1="gl_1" and g2="gl_2", + where "gl_1" has unicode="1" and "gl_2" has unicode="2". + </p> + <p> + The 'fontC' cell shows the string "1234" with "fontC" were the same kerning pair + uses u1/u2 to match "12" and g1/g2 to match "34". + </p> + <p> + The 'fontD' cell shows the string "1234" with "fontD" were the same kerning pair + uses u1/u2 to match "12" and "34" (u1/u2 are lists of character vales). + </p> + <p> + The 'fontE' cell shows the string "1234" with "fontE" were the same kerning pair + uses g1/g2 to match "12" and "34" (g1/g2 are lists of names). + </p> + <p> + The 'fontF' cell shows the string "1234" with "fontF" were the same kerning pair + uses u1/u2 to match "12" and "34" (u1/u2 are unicode ranges). + </p> + <p> + The 'fontG' cell shows the string "12" with "fontG" were for which there + is a kerning pair with u1 matching "1" and g2 matching "gl_2". + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if for each of the seven subtests there is a series of black squares whose lower-left corner aligns with the centre of the corresponding small, red square as shown in the reference graphic. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: fonts-kern-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <g id="marker"> + <!-- <rect x="0" y="-10" width="10" height="10" /> --> + <line y2="-12" stroke="red" stroke-width="1"/> + <line x2="12" stroke="red" stroke-width="1"/> + <rect x="-2" y="-2" width="4" height="4" fill="red"/> + </g> + <g id="sampleBkg"> + <rect width="200" height="20" fill="#eeeeee"/> + <rect y="20" width="200" height="30" fill="#cccccc"/> + <rect width="200" height="50" fill="none" stroke="black"/> + </g> + </defs> + <defs> + + <font horiz-adv-x="224"> +<font-face font-family="fontG" units-per-em="1000" ascent="917" descent="-250"/> + <missing-glyph horiz-adv-x="800" d="M 0 0 L 750 0 L 750 1000 L 0 1000 Z"/> + <glyph unicode="1" glyph-name="gl_1" horiz-adv-x="250" d="M 0 0 L 250 0 L 250 250 L 0 250 Z"/> + <glyph unicode="2" glyph-name="gl_2" horiz-adv-x="1500" d="M 0 0 L 500 0 L 500 500 L 0 500 Z"/> + <hkern u1="1" g2="gl_2" k="-1000"/> + </font> + + <font horiz-adv-x="224"> +<font-face font-family="fontF" units-per-em="1000" ascent="917" descent="-250"/> + <missing-glyph horiz-adv-x="800" d="M 0 0 L 750 0 L 750 1000 L 0 1000 Z"/> + <glyph unicode="1" glyph-name="gl_1" horiz-adv-x="250" d="M 0 0 L 250 0 L 250 250 L 0 250 Z"/> + <glyph unicode="2" glyph-name="gl_2" horiz-adv-x="1500" d="M 0 0 L 500 0 L 500 500 L 0 500 Z"/> + <glyph unicode="3" glyph-name="gl_3" horiz-adv-x="750" d="M 0 0 L 750 0 L 750 750 L 0 750 Z"/> + <glyph unicode="4" glyph-name="gl_4" horiz-adv-x="1000" d="M 0 0 L 1000 0 L 1000 1000 L 0 1000 Z"/> + <!-- u1 covers '0' to '9' and ':' ';' '<' '=' '>' '?' --> + <!-- u2 covers '1' '2' '3' and '4' --> + <!-- So, this is a match for '12', '23' and '34' --> + <hkern u1="U+003?" u2="U+0031-0034" k="-1500"/> + </font> + + <font horiz-adv-x="224"> +<font-face font-family="fontE" units-per-em="1000" ascent="917" descent="-250"/> + <missing-glyph horiz-adv-x="800" d="M 0 0 L 750 0 L 750 1000 L 0 1000 Z"/> + <glyph unicode="1" glyph-name="gl_1" horiz-adv-x="250" d="M 0 0 L 250 0 L 250 250 L 0 250 Z"/> + <glyph unicode="2" glyph-name="gl_2" horiz-adv-x="1500" d="M 0 0 L 500 0 L 500 500 L 0 500 Z"/> + <glyph unicode="3" glyph-name="gl_3" horiz-adv-x="750" d="M 0 0 L 750 0 L 750 750 L 0 750 Z"/> + <glyph unicode="4" glyph-name="gl_4" horiz-adv-x="1000" d="M 0 0 L 1000 0 L 1000 1000 L 0 1000 Z"/> + <hkern g1="gl_1,gl_3" g2="gl_2,gl_4" k="-1500"/> + </font> + + <font horiz-adv-x="224"> +<font-face font-family="fontD" units-per-em="1000" ascent="917" descent="-250"/> + <missing-glyph horiz-adv-x="800" d="M 0 0 L 750 0 L 750 1000 L 0 1000 Z"/> + <glyph unicode="1" glyph-name="gl_1" horiz-adv-x="250" d="M 0 0 L 250 0 L 250 250 L 0 250 Z"/> + <glyph unicode="2" glyph-name="gl_2" horiz-adv-x="1500" d="M 0 0 L 500 0 L 500 500 L 0 500 Z"/> + <glyph unicode="3" glyph-name="gl_3" horiz-adv-x="750" d="M 0 0 L 750 0 L 750 750 L 0 750 Z"/> + <glyph unicode="4" glyph-name="gl_4" horiz-adv-x="1000" d="M 0 0 L 1000 0 L 1000 1000 L 0 1000 Z"/> + <hkern u1="1,3" u2="2,4" k="-1500"/> + </font> + + <font horiz-adv-x="224"> +<font-face font-family="fontC" units-per-em="1000" ascent="917" descent="-250"/> + <missing-glyph horiz-adv-x="800" d="M 0 0 L 750 0 L 750 1000 L 0 1000 Z"/> + <glyph unicode="1" glyph-name="gl_1" horiz-adv-x="250" d="M 0 0 L 250 0 L 250 250 L 0 250 Z"/> + <glyph unicode="2" glyph-name="gl_2" horiz-adv-x="1500" d="M 0 0 L 500 0 L 500 500 L 0 500 Z"/> + <glyph unicode="3" glyph-name="gl_3" horiz-adv-x="750" d="M 0 0 L 750 0 L 750 750 L 0 750 Z"/> + <glyph unicode="4" glyph-name="gl_4" horiz-adv-x="1000" d="M 0 0 L 1000 0 L 1000 1000 L 0 1000 Z"/> + + <hkern u1="1" u2="2" g1="gl_3" g2="gl_4" k="-1500"/> + </font> + + <font horiz-adv-x="224"> +<font-face font-family="fontB" units-per-em="1000" ascent="917" descent="-250"/> + <missing-glyph horiz-adv-x="800" d="M 0 0 L 750 0 L 750 1000 L 0 1000 Z"/> + <glyph unicode="1" glyph-name="gl_1" horiz-adv-x="250" d="M 0 0 L 250 0 L 250 250 L 0 250 Z"/> + <glyph unicode="2" glyph-name="gl_2" horiz-adv-x="500" d="M 0 0 L 500 0 L 500 500 L 0 500 Z"/> + <hkern g1="gl_1" g2="gl_2" k="-2000"/> + </font> + + <font horiz-adv-x="224"> +<font-face font-family="fontA" units-per-em="1000" ascent="917" descent="-250"/> + <missing-glyph horiz-adv-x="800" d="M 0 0 L 750 0 L 750 1000 L 0 1000 Z"/> + <glyph unicode="1" glyph-name="gl_1" horiz-adv-x="250" d="M 0 0 L 250 0 L 250 250 L 0 250 Z"/> + <glyph unicode="2" glyph-name="gl_2" horiz-adv-x="500" d="M 0 0 L 500 0 L 500 500 L 0 500 Z"/> + <hkern u1="1" u2="2" k="-1000"/> + </font> + + </defs> + <text x="240" y="30" font-size="20" text-anchor="middle"><hkern></text> + <g id="legend" transform="translate(30, 60)"> + <g> + <g> + <rect x="-20" width="20" height="50" fill="none" stroke="black"/> + <text transform="translate(-5, 25) rotate(-90)" text-anchor="middle">font A</text> + </g> + <use xlink:href="#sampleBkg"/> + <text x="5" y="15" font-size="12">u1="1" u2="2"</text> + <g transform="translate(5, 45) scale(2)" font-size="10"> + <!-- Advance for '1': 0 --> + <use xlink:href="#marker" fill="#8888ff"/> + + <!-- Advance for '2' : '1'.advance + kerning --> + <!-- : ((250 - (-1000))/1000)*10 --> + <!-- : 12.5 --> + <use xlink:href="#marker" x="12.5" fill="#8888ff"/> + <text font-family="fontA" font-size="10">12</text> + </g> + </g> + + <g transform="translate(0, 55)"> + <g> + <rect x="-20" width="20" height="50" fill="none" stroke="black"/> + <text transform="translate(-5, 25) rotate(-90)" text-anchor="middle">font B</text> + </g> + <use xlink:href="#sampleBkg"/> + <text x="5" y="15" font-size="12">g1="gl_1" g2="gl_2"</text> + <g transform="translate(5, 45) scale(2)"> + <use xlink:href="#marker" fill="#8888ff"/> + <use xlink:href="#marker" x="22.5" fill="#8888ff"/> + <text font-family="fontB" font-size="10">12</text> + </g> + </g> + + <g transform="translate(0, 110)"> + <g> + <rect x="-20" width="20" height="50" fill="none" stroke="black"/> + <text transform="translate(-5, 25) rotate(-90)" text-anchor="middle">font C</text> + </g> + <use xlink:href="#sampleBkg"/> + <text x="5" y="15" font-size="12">u1="1" u2="2" g1="gl_3" g2="gl_4"</text> + <g transform="translate(5, 45) scale(2)"> + <use xlink:href="#marker" fill="#8888ff"/> + <!-- ((1.adv + '12'.k)/unitsPerEm)*fontSize --> + <use xlink:href="#marker" x="17.5" fill="#8888ff"/> + <use xlink:href="#marker" x="32.5" fill="#8888ff"/> + <!-- ((3.adv + '34'.k)/unitsPerEm)*fontSize --> + <use xlink:href="#marker" x="55" fill="#8888ff"/> + <text font-family="fontC" font-size="10">1234</text> + </g> + </g> + + <g transform="translate(0, 165)"> + <g> + <rect x="-20" width="20" height="50" fill="none" stroke="black"/> + <text transform="translate(-5, 25) rotate(-90)" text-anchor="middle">font D</text> + </g> + <use xlink:href="#sampleBkg"/> + <text x="5" y="15" font-size="12">u1="1,3" u2="2,4"</text> + <g transform="translate(5, 45) scale(2)"> + <use xlink:href="#marker" fill="#8888ff"/> + <use xlink:href="#marker" x="17.5" fill="#8888ff"/> + <use xlink:href="#marker" x="32.5" fill="#8888ff"/> + <use xlink:href="#marker" x="55" fill="#8888ff"/> + <text font-family="fontD" font-size="10">1234</text> + </g> + </g> + + <g transform="translate(240, 0)"> + <g> + <rect x="-20" width="20" height="50" fill="none" stroke="black"/> + <text transform="translate(-5, 25) rotate(-90)" text-anchor="middle">font E</text> + </g> + <use xlink:href="#sampleBkg"/> + <text x="5" y="15" font-size="12">g1="gl_1,gl_3" g2="gl_2,gl_4"</text> + <g transform="translate(5, 45) scale(2)"> + <use xlink:href="#marker" fill="#8888ff"/> + <use xlink:href="#marker" x="17.5" fill="#8888ff"/> + <use xlink:href="#marker" x="32.5" fill="#8888ff"/> + <use xlink:href="#marker" x="55" fill="#8888ff"/> + <text font-family="fontE" font-size="10">1234</text> + </g> + </g> + + <g transform="translate(240, 55)"> + <g> + <rect x="-20" width="20" height="50" fill="none" stroke="black"/> + <text transform="translate(-5, 25) rotate(-90)" text-anchor="middle">font F</text> + </g> + <use xlink:href="#sampleBkg"/> + <text x="5" y="15" font-size="12">u1="U+003?" u2="U+0031-34"</text> + <g transform="translate(5, 45) scale(2)"> + <use xlink:href="#marker" fill="#8888ff"/> + <!-- '2' --> + <use xlink:href="#marker" x="17.5" fill="#8888ff"/> + <!-- '3' --> + <use xlink:href="#marker" x="47.5" fill="#8888ff"/> + <!-- '4' --> + <use xlink:href="#marker" x="70" fill="#8888ff"/> + <text font-family="fontF" font-size="10">1234</text> + </g> + </g> + + <g transform="translate(240, 110)"> + <g> + <rect x="-20" width="20" height="50" fill="none" stroke="black"/> + <text transform="translate(-5, 25) rotate(-90)" text-anchor="middle">font G</text> + </g> + <use xlink:href="#sampleBkg"/> + <text x="5" y="15" font-size="12">u1="1" g2="gl_2"</text> + <g transform="translate(5, 45) scale(2)"> + <!-- Advance for '1': 0 --> + <use xlink:href="#marker" fill="#8888ff"/> + + <!-- Advance for '2' : '1'.advance + kerning --> + <!-- : ((250 - (-1000))/1000)*10 --> + <!-- : 12.5 --> + <use xlink:href="#marker" x="12.5" fill="#8888ff"/> + <text font-family="fontG" font-size="10">12</text> + </g> + </g> + </g> + <g id="testContent" transform="translate(320, 100)" font-size="10"> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/fonts-overview-201-t-manual.svg b/testing/web-platform/tests/svg/import/fonts-overview-201-t-manual.svg new file mode 100644 index 000000000..65de3f474 --- /dev/null +++ b/testing/web-platform/tests/svg/import/fonts-overview-201-t-manual.svg @@ -0,0 +1,122 @@ +<?xml version="1.0" encoding="UTF-8"?> +<svg version="1.2" baseProfile="tiny" id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:xe="http://www.w3.org/2001/xml-events"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AE" author="CL" status="accepted" + version="$Revision: 1.2 $" testname="$RCSfile: fonts-overview-201-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/fonts.html#SVGFontsOverview"> + <p> + This tests a range of values for the 'units per em' attribute. + </p> + <p> + The same glyph is defined three times in three fonts, but with different values + for units-per-em - 1,000, 10, and 10,000 - and with the other numerical values + that depend on units-per-em scaled accordingly. Text using these fonts must all be displayed at the same size, + because the same font-size is used throughout. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the three letter β are all the same size. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: fonts-overview-201-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <font id="beta" horiz-adv-x="550" > + <font-face + font-family="SVGbeta1" + font-weight="500" + units-per-em="1000" + ascent="800" + descent="-200" + unicode-range="U+03B2" + /> + <missing-glyph /> + <glyph glyph-name="beta" unicode="β" + d="M522.35 177.05c0 -103.55 -73.73 -201.4 -190.89 -201.4c-62.62 0 -123.22 22.7998 -138.37 85.5h-2.01999v-261.15h-135.34v573.7c0 136.8 37.3691 304.95 218.16 304.95c95.95 0 198.97 -40.85 198.97 -145.35c0 -94.05 -72.72 -133 -160.59 -152v-1.89999 + c126.25 -16.15 210.08 -76 210.08 -202.35zM360.75 128.6v80.75c0 41.8 -3.03 149.15 -67.67 149.15c-15.15 0 -29.29 -8.54999 -44.44 -8.54999c-14.14 0 -20.2 18.05 -20.2 28.5c0 11.4 9.09 24.7 22.22 24.7c12.12 0 24.24 -6.64999 36.36 -6.64999 + c45.45 0 45.45 79.8 45.45 108.3c0 42.75 2.01999 146.3 -63.63 146.3c-75.75 0 -77.77 -138.7 -77.77 -188.1v-394.25h31.31c3.03 -23.75 29.29 -49.4004 55.55 -49.4004c68.68 0 82.82 56.0508 82.82 109.25z" /> + </font> + <font id="beta2" horiz-adv-x="5.50" > + <font-face + font-family="SVGbeta2" + font-weight="500" + units-per-em="10" + ascent="8" + descent="-2" + unicode-range="U+03B2" + /> + <missing-glyph /> + <glyph glyph-name="beta" unicode="β" + d="M5.2235 1.7705c0 -1.0355 -0.7373 -2.014 -1.9089 -2.014c-0.6262 0 -1.2322 0.227998 -1.3837 0.855h-0.0201999v-2.6115h-1.3534v5.737c0 1.368 0.373691 3.0495 2.1816 3.0495c0.9595 0 1.9897 -0.4085 1.9897 -1.4535c0 -0.9405 -0.7272 -1.33 -1.6059 -1.52v-0.0189999 + c1.2625 -0.1615 2.1008 -0.76 2.1008 -2.0235zM3.6075 1.286v0.8075c0 0.418 -0.0303 1.4915 -0.6767 1.4915c-0.1515 0 -0.2929 -0.0854999 -0.4444 -0.0854999c-0.1414 0 -0.202 0.1805 -0.202 0.285c0 0.114 0.0909 0.247 0.2222 0.247c0.1212 0 0.2424 -0.0664999 0.3636 -0.0664999 + c0.4545 0 0.4545 0.798 0.4545 1.083c0 0.4275 0.0201999 1.463 -0.6363 1.463c-0.7575 0 -0.7777 -1.387 -0.7777 -1.881v-3.9425h0.3131c0.0303 -0.2375 0.2929 -0.494004 0.5555 -0.494004c0.6868 0 0.8282 0.560508 0.8282 1.0925z" /> + </font> + <font id="beta3" horiz-adv-x="55000" > + <font-face + font-family="SVGbeta3" + font-weight="500" + units-per-em="10000" + ascent="8000" + descent="-2000" + unicode-range="U+03B2" + /> + <missing-glyph /> + <glyph glyph-name="beta" unicode="β" + d="M5223.5 1770.5c0 -1035.5 -737.3 -2014.0 -1908.9 -2014.0c-626.2 0 -1232.2 227.998 -1383.7 855.0h-20.1999v-2611.5h-1353.4v5737.0c0 1368.0 373.691 3049.5 2181.6 3049.5c959.5 0 1989.7 -408.5 1989.7 -1453.5c0 -940.5 -727.2 -1330.0 -1605.9 -1520.0v-18.9999 + c1262.5 -161.5 2100.8 -760.0 2100.8 -2023.5zM3607.5 1286.0v807.5c0 418.0 -30.3 1491.5 -676.7 1491.5c-151.5 0 -292.9 -85.4999 -444.4 -85.4999c-141.4 0 -202.0 180.5 -202.0 285.0c0 114.0 90.9 247.0 222.2 247.0c121.2 0 242.4 -66.4999 363.6 -66.4999 + c454.5 0 454.5 798.0 454.5 1083.0c0 427.5 20.1999 1463.0 -636.3 1463.0c-757.5 0 -777.7 -1387.0 -777.7 -1881.0v-3942.5h313.1c30.3 -237.5 292.9 -494.004 555.5 -494.004c686.8 0 828.2 560.508 828.2 1092.5z" /> + </font> + </defs> + <!-- alphabetic baseline --> + <path stroke-width="2" stroke="#888" d="M 50,200 H 420"/> + <!-- ascent --> + <path stroke-width="2" stroke="#888" d="M 50, 56 H 420"/> + <!-- descent --> + <path stroke-width="2" stroke="#888" d="M 50, 236 H 420"/> + + <text x="50" y="200" font-family="SVGbeta1" font-size="180">β</text> + <text x="180" y="200" font-family="SVGbeta2" font-size="180">β</text> + <text x="310" y="200" font-family="SVGbeta3" font-size="180">β</text> + + <text x="60" y="260" font-size="10">1,000</text> + <text x="190" y="260" font-size="10">10</text> + <text x="320" y="260" font-size="10">10,000</text> + <text x="110" y="280" font-size="16">varying units-per-em values</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg>
\ No newline at end of file diff --git a/testing/web-platform/tests/svg/import/imp-path-01-f-manual.svg b/testing/web-platform/tests/svg/import/imp-path-01-f-manual.svg new file mode 100644 index 000000000..1cae43261 --- /dev/null +++ b/testing/web-platform/tests/svg/import/imp-path-01-f-manual.svg @@ -0,0 +1,54 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="CL" author="Microsoft" status="reviewed" version="$Revision: 1.5 $" testname="$RCSfile: imp-path-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/implnote.html#PathElementImplementationNotes"> + <p> + Tests that markers are drawn on zero-length 'path' and 'line' segments. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there are two blue boxes, positioned as in the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: imp-path-01-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <marker id="testMarker"> + <rect width="96" height="96" fill="blue" /> + </marker> + </defs> + <path d="m 0 0 L 0 0" stroke-width="25" marker-end="url(#testMarker)" /> + <line x1="0" x2="0" y1="100" y2="100" stroke-width="25" marker-end="url(#testMarker)" /> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/interact-cursor-01-f-manual.svg b/testing/web-platform/tests/svg/import/interact-cursor-01-f-manual.svg new file mode 100644 index 000000000..ff7d71650 --- /dev/null +++ b/testing/web-platform/tests/svg/import/interact-cursor-01-f-manual.svg @@ -0,0 +1,158 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Chris Lilley" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: interact-cursor-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#Cursors"> + <p> + Purpose of test is to determine if the cursor property and cursor element are + supported. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + This test requires user interaction. Firstly, the default cursor behaviour should be examined. + Move the cursor to the top left corner, in the white area. This is the default + cursor. Now move the cursor over the text at the top of the example. The cursor + changes to the text cursor. Lastly, move the cursor to the blue link + text - the cursor changes to the pointer cursor. + </p> + <p> + Now, move the cursor in turn to each of the gray rectangles (but not on top + of the white text label text). From top to bottom in the first row, the cursor + should change to: + </p> + <p> + A crosshair or other 'accurate positioning' cursor + The 'default' cursor, as noted above + The 'pointer' cursor, as noted above + A cursor indicating movement, such as panning + </p> + <p>Now from top to bottom in the second row, the cursor should change to: </p> + <p> + The 'text' cursor, as noted above + A 'wait' cursor + A 'help' cursor + A special cursor which looks like a small magnifying glass. This is a downloaded image cursor. + + </p> + <p> + Moving to the bottom-leftmost of the eight red triangles, and moving around them clockwise, the + cursor should change to: + </p> + <p> + SouthEast-resize, South-resize, SouthWest resize, West-resize, + NorthWest-resize, North-resize, NorthEast-resize, East-resize. + </p> + <p> + Lastly, move the cursor to the target in the bottom-right of the test. The cursor must not + change to the 'pointer' cursor, but instead to the custom magnifying glass cursor as noted + above. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if, at each position, the cursor changes as described in the operator script. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: interact-cursor-01-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <cursor id="magglass" xlink:href="../images/magnify.png" x="10" y="11"/> + </defs> + <text x="240" y="25" text-anchor="middle" font-size="26"> + Text Cursor + <a xlink:href="http://www.w3.org/TR/SVG/interact#Cursors" fill="blue" xlink:show="new">Pointer Cursor</a> + </text> + <!-- use this text to check the native 'text' and 'pointer' cursor --> + <rect x="120" y="40" width="240" height="236" stroke="#666" stroke-width="3" fill="none"/> + <!-- ====================================================================== --> + <!-- Predefined keyword values for cursors ===================== --> + <!-- ====================================================================== --> + <g class="button"> + <g cursor="crosshair"> + <rect stroke="none" fill="#666" x="148" y="70" width="80" height="32"/> + <text stroke="none" fill="#FFF" font-family="Geneva, Arial, Helvetica, sans-serif" font-weight="bold" font-size="16" x="154" y="90">crosshair</text> + </g> + <g cursor="default"> + <rect stroke="none" fill="#666" x="148" y="118" width="80" height="32"/> + <text stroke="none" fill="#FFF" font-family="Geneva, Arial, Helvetica, sans-serif" font-weight="bold" font-size="16" x="154" y="138">default</text> + </g> + <g cursor="pointer"> + <rect stroke="none" fill="#666" x="148" y="166" width="80" height="32"/> + <text stroke="none" fill="#FFF" font-family="Geneva, Arial, Helvetica, sans-serif" font-weight="bold" font-size="16" x="154" y="186">pointer</text> + </g> + <g cursor="move"> + <rect stroke="none" fill="#666" x="148" y="214" width="80" height="32"/> + <text stroke="none" fill="#FFF" font-family="Geneva, Arial, Helvetica, sans-serif" font-weight="bold" font-size="16" x="154" y="235">move</text> + </g> + <g cursor="text"> + <rect stroke="none" fill="#666" x="252" y="70" width="80" height="32"/> + <text stroke="none" fill="#FFF" font-family="Geneva, Arial, Helvetica, sans-serif" font-weight="bold" font-size="16" x="258" y="90">text</text> + </g> + <g cursor="wait"> + <rect stroke="none" fill="#666" x="252" y="118" width="80" height="32"/> + <text stroke="none" fill="#FFF" font-family="Geneva, Arial, Helvetica, sans-serif" font-weight="bold" font-size="16" x="258" y="138">wait</text> + </g> + <g cursor="help"> + <rect stroke="none" fill="#666" x="252" y="166" width="80" height="32"/> + <text stroke="none" fill="#FFF" font-family="Geneva, Arial, Helvetica, sans-serif" font-weight="bold" font-size="16" x="258" y="186">help</text> + </g> + <g cursor="url(#magglass),crosshair"> + <rect stroke="none" fill="#666" x="252" y="214" width="80" height="32"/> + <text stroke="none" fill="#FFF" font-family="Geneva, Arial, Helvetica, sans-serif" font-weight="bold" font-size="16" x="258" y="235"><url></text> + </g> + </g> + <g stroke="black" stroke-width="1" fill="#900"> + <polygon points="116,36 116,68 148,36" cursor="nw-resize"/> + <polygon points="364,36 364,68 332,36" cursor="ne-resize"/> + <polygon points="364,280 332,280 364,248" cursor="se-resize"/> + <polygon points="116,280 148,280 116,248" cursor="sw-resize"/> + <polygon points="340,134 340,182 364,158" cursor="e-resize"/> + <polygon points="116,158 140,134 140,182" cursor="w-resize"/> + <polygon points="240,36 264,63.3 214,63.3" cursor="n-resize"/> + <polygon points="240,280 264,252.7 214,252.7" cursor="s-resize"/> + </g> + <!-- link to check consistency of 'pointer' cursor --> + <!-- target for hotspot test --> + <g id="target" stroke-width="1" stroke="black" cursor="url(#magglass),crosshair"> + <!-- make a target to test the hotspot --> + <circle cx="390" cy="315" r="16" stroke="none" fill="#FFC"/> + <polyline points="390,295 390,335"/> + <polyline points="370,315 410,315"/> + <circle cx="390" cy="315" r="6" stroke="none" fill="#FFF"/> + <!-- make the hotspot, taking care the cursor stays the same --> + <a fill="blue" xlink:href="http://www.w3.org/Icons/w3c_home"> + <circle cx="390" cy="315" r="2" stroke="none" fill="#000"/> + </a> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/interact-dom-01-b-manual.svg b/testing/web-platform/tests/svg/import/interact-dom-01-b-manual.svg new file mode 100644 index 000000000..907cc20bc --- /dev/null +++ b/testing/web-platform/tests/svg/import/interact-dom-01-b-manual.svg @@ -0,0 +1,133 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" onload="initTest(evt)" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: interact-dom-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#DOMInterfaces"> + <p> + Verify basic support for DOM event listener registration. The root svg element + has an onload handler where a click event listener is registered on group element 'Start Button'. + </p> + <p> + If UI events listener registration is supported (and UI events), + when the user clicks on the button a text node is inserted reading "Event Listeners supported". + </p> + <p> + At the end of the test, the start test button is changed to green, + and the click event listener is removed from the the start button. + </p> + <p> + Subsequent clicks on the start button should cause no effect if + the event listener has been removed successfully. + If additional lines of text appear in the document that say "Event Listeners supported", + then the implementation has not successfully removed the event listener. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>This test requires user interaction. Run the test, then click on the grey rectangle. + If it turns green, click it again. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + After clicking once on the button, the rectangle should have a green fill + and the text "Event listeners supported" should appear, once. + + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: interact-dom-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <script type="text/ecmascript"> + <![CDATA[ + + var svg_ns = "http://www.w3.org/2000/svg" + var doc; + var content; + var startButton; + var buttonRect; + var yLocation = 280; + // + // onload handler for top level svg element. Sets a UI event listener for + // the test start button. + // + function initTest(evt){ + // Get Document + var target = evt.target; + doc = target.ownerDocument; + content = doc.getElementById("test-body-content"); + + // Get start rect and add a UI listener + startButton = doc.getElementById("startButton"); + buttonRect = doc.getElementById("buttonRect"); + startButton.addEventListener("click", uiEventDetected, false); + } + + // + // click handler for 'startButton' rect element. + // + function uiEventDetected(evt) { + // + // Add an element to show that UI event was detected + // + var newText = doc.createElementNS(svg_ns, 'text'); + newText.setAttribute('x', '5'); + newText.setAttribute('y', yLocation); + newText.setAttribute('font-size', '40'); + var message = "Event Listeners supported"; + var textContent = doc.createTextNode(message); + newText.appendChild(textContent); + content.appendChild(newText); + + startButton.removeEventListener("click", uiEventDetected, false); + + // Make start button green + buttonRect.setAttribute("fill", "#88ff88"); + buttonRect.setAttribute("stroke", "black"); + + // If test does not successfully remove the event listener, then + // a second click will cause a subsequent text string to appear 50 units + // below the first new text string. + yLocation = yLocation + 50; + } + + ]]> + </script> + + <!-- ===================================================================== --> + <!-- Start button --> + <!-- ===================================================================== --> + <g id="startButton"> + <rect id="buttonRect" x="65" y="20" width="350" height="200" fill="#dddddd" stroke="black"/> + <text font-size="54" x="120" y="130">Start Test</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/interact-events-01-b-manual.svg b/testing/web-platform/tests/svg/import/interact-events-01-b-manual.svg new file mode 100644 index 000000000..e31961e34 --- /dev/null +++ b/testing/web-platform/tests/svg/import/interact-events-01-b-manual.svg @@ -0,0 +1,123 @@ +<svg version="1.1" baseProfile="basic" onload="onEvent(evt, 'Rect6', 'visible')" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted +" + version="$Revision: 1.6 $" testname="$RCSfile: interact-events-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#SVGEvents"> + <p> + Test 'onload' event attribute. + </p> + <p> + Six blue rectangles have been defined, each initially defined with + 'visibility:hidden'. 'onload' event attributes are assigned in + a variety of ways, usually to set 'visibility:visible'. + The red text indicates the correct behavior + (whether a given rectangle should appear in the visual result). + </p> + <p> + The first rectangle has no associated 'onload' event so it remains invisible. + The second rectangle has an 'onload' event on itself, which invokes a script + which sets 'visibility:visible', so it should appear. + The third rectangle has an 'onload' event on its parent 'g', which invokes a script + which sets 'visibility:visible' on the rectangle, so it should appear. + The fourth rectangle has an 'onload' event on an ancestor 'svg', which invokes a script + which sets 'visibility:visible' on the rectangle, so it should appear. + The fifth rectangle has an 'onload' event both itself and its parent 'g'. + The rectangle's script sets 'visibility:visible' on the rectangle + but the parent's script sets 'visibility:hidden' on the rectangle, + which should happen afterwards, so the rectangle should not appear. + The sixth rectangle has an 'onload' event on the outermost 'svg', which invokes a script + which sets 'visibility:visible' on the rectangle, so it should appear. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if blue squares are visible for subtests 2, 3, 4 and 6 (only) + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: interact-events-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <script type="text/ecmascript"><![CDATA[ + + function onEvent(evt, indicatorId, visibilityValue){ + // Get Document + var target = evt.target; + var doc = target.ownerDocument; + + // Mark test as passed + var elementToShow = doc.getElementById(indicatorId); + elementToShow.setAttribute('visibility', '' + visibilityValue); + } + + ]]></script> + </defs> + <text font-family="Arial" font-size="40" x="30" y="40"> + 'onload' event attribute. + </text> + <g font-family="Arial" font-size="40" fill="blue" stroke="none"> + <g transform="translate(77.5,45)"> + <rect id="Rect1" width="80" height="80" visibility="hidden"/> + <text x="-30" y="120" fill="red">1: No</text> + </g> + <g transform="translate(202.5,45)"> + <rect id="Rect2" width="80" height="80" onload="onEvent(evt, 'Rect2', 'visible')" visibility="hidden"/> + <text x="-30" y="120" fill="red">2: Yes</text> + </g> + <g transform="translate(327.5,45)"> + <g onload="onEvent(evt, 'Rect3', 'visible')"> + <rect id="Rect3" width="80" height="80" visibility="hidden"/> + </g> + <text x="-30" y="120" fill="red">3: Yes</text> + </g> + <g transform="translate(77.5,178)"> + <svg xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="200" height="200" onload="onEvent(evt, 'Rect4', 'visible')"> + <rect id="Rect4" width="80" height="80" visibility="hidden"/> + </svg> + <text x="-30" y="120" fill="red">4: Yes</text> + </g> + <g transform="translate(202.5,178)"> + <g onload="onEvent(evt, 'Rect5', 'hidden')"> + <rect id="Rect5" width="80" height="80" onload="onEvent(evt, 'Rect5', 'visible')" visibility="hidden"/> + </g> + <text x="-30" y="120" fill="red">5: No</text> + </g> + <g transform="translate(327.5,178)"> + <rect id="Rect6" width="80" height="80" visibility="hidden"/> + <text x="-30" y="120" fill="red">6: Yes</text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/interact-events-02-b-manual.svg b/testing/web-platform/tests/svg/import/interact-events-02-b-manual.svg new file mode 100644 index 000000000..60e377cc7 --- /dev/null +++ b/testing/web-platform/tests/svg/import/interact-events-02-b-manual.svg @@ -0,0 +1,77 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" onload='f(evt)'> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="ED" author="CM" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: interact-events-02-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#SVGEvents"> + <p> + This tests that the SVGLoad event does not bubble. + </p> + <p> + After loading the tests, two rectangles are displayed. + The left rectangle indicates whether the SVGLoad event + dispatched to the root 'svg' element did not bubble + and the right rectangle indicates whether the SVGLoad + event dispatched to an 'image' element did not bubble. + Each rectangle is red if the sub-test failed or green + if it passed. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if both rectangles are green + once the document has loaded. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: interact-events-02-b.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text x='10' y='30'>Testing that SVGLoad does not bubble</text> + + <rect id='r1' x='10' y='50' width='50' height='50' fill='red'/> + <rect id='r2' x='210' y='50' width='50' height='50' fill='red'/> + <g font-size='14'> + <text x='10' y='130'>On root <svg></text> + <text x='210' y='130'>On an <image></text> + </g> + + <script><![CDATA[ + function f(evt) { if (!evt.bubbles && evt.target == document.getElementById("svg-root")) document.getElementById('r1').setAttribute('fill', 'green'); } + function g(evt) { if (!evt.bubbles && evt.target == document.getElementById("image")) document.getElementById('r2').setAttribute('fill', 'green'); } + ]]></script> + + <image id="image" xlink:href='../images/20x20.png' width='20' height='20' visibility='hidden' onload='g(evt)'/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5>" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/interact-events-202-f-manual.svg b/testing/web-platform/tests/svg/import/interact-events-202-f-manual.svg new file mode 100644 index 000000000..61ed1c017 --- /dev/null +++ b/testing/web-platform/tests/svg/import/interact-events-202-f-manual.svg @@ -0,0 +1,83 @@ +<svg id="svg-root" width="100%" height="100%"
+ viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg"
+ xmlns:xlink="http://www.w3.org/1999/xlink">
+ <!--======================================================================-->
+ <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =-->
+ <!--= Institute of Technology, European Research Consortium for =-->
+ <!--= Informatics and Mathematics (ERCIM), Keio University). =-->
+ <!--= All Rights Reserved. =-->
+ <!--= See http://www.w3.org/Consortium/Legal/. =-->
+ <!--======================================================================-->
+ <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/"
+ template-version="1.4" reviewer="AE" author="ASl" status="accepted"
+ version="$Revision: 1.3 $" testname="$RCSfile: interact-events-202-f.svg,v $">
+ <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#SVGEvents">
+ <p>
+ Testing event bubbling through 'use' element.
+ </p>
+ </d:testDescription>
+ <d:operatorScript xmlns="http://www.w3.org/1999/xhtml">
+ <p>
+ Mouseover the blue rect, then the green rect and then away from the rects.
+ </p>
+ </d:operatorScript>
+ <d:passCriteria xmlns="http://www.w3.org/1999/xhtml">
+ <p>
+ Moving the mouse over the blue rect should make a yellow rect visible underneath it.
+ Moving the mouse over the green rect should make a purple rect visible underneath it.
+ Moving the mouse away from the blue/green rect should hide the rect underneath it again.
+ </p>
+ </d:passCriteria>
+ </d:SVGTestCase>
+ <title id="test-title">$RCSfile: interact-events-202-f.svg,v $</title>
+ <defs>
+ <font-face
+ font-family="SVGFreeSansASCII"
+ unicode-range="U+0-7F">
+ <font-face-src>
+ <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/>
+ </font-face-src>
+ </font-face>
+ </defs>
+ <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18">
+ <defs>
+ <rect id="r1" x="10" y="20" width="90" height="65" visibility="inherit" fill="inherit"/>
+ </defs>
+
+ <g id="g1" transform="translate( 0, 0)" visibility="visible">
+ <use xlink:href="#r1" visibility="inherit" fill="blue"
+ onmouseover="g3.setAttribute('visibility', 'visible')"
+ onmouseout="g3.setAttribute('visibility', 'hidden')"/>
+ </g>
+ <g id="g2" transform="translate(90, 0)" visibility="visible"
+ onmouseover="g4.setAttribute('visibility', 'visible')"
+ onmouseout="g4.setAttribute('visibility', 'hidden')">
+ <use xlink:href="#r1" visibility="inherit" fill="green"/>
+ </g>
+ <g id="g3" transform="translate( 0, 65)" visibility="hidden">
+ <use xlink:href="#r1" visibility="inherit" fill="yellow"/>
+ </g>
+ <g id="g4" transform="translate(90, 65)" visibility="hidden">
+ <use xlink:href="#r1" visibility="inherit" fill="purple"/>
+ </g>
+
+ <script type="text/ecmascript">
+ var g1 = document.getElementById("g1");
+ var g2 = document.getElementById("g2");
+ var g3 = document.getElementById("g3");
+ var g4 = document.getElementById("g4");
+ </script>
+
+ </g>
+ <g font-family="SVGFreeSansASCII,sans-serif" font-size="32">
+ <text id="revision" x="10" y="340" stroke="none"
+ fill="black">$Revision: 1.3 $</text>
+ </g>
+ <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/>
+ <!-- comment out this watermark once the test is approved
+ <g id="draft-watermark">
+ <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/>
+ <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240"
+ text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text>
+ </g>-->
+</svg>
\ No newline at end of file diff --git a/testing/web-platform/tests/svg/import/interact-events-203-t-manual.svg b/testing/web-platform/tests/svg/import/interact-events-203-t-manual.svg new file mode 100644 index 000000000..6b3f94492 --- /dev/null +++ b/testing/web-platform/tests/svg/import/interact-events-203-t-manual.svg @@ -0,0 +1,109 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AE" author="ASl" status="accepted" + version="$Revision: 1.4 $" testname="$RCSfile: interact-events-203-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#SVGEvents"> + <p>Tests 'mouseover' event on SVGElementInstance</p> + <p> + What each case tests is as follows. + Case 1: mouseover event on SVGElementInstance. Referenceing an element that contains an event. + Case 2: mouseover event on referencing element. Event bubbling from SVGElementInstance to referencing element. + Case 3: mouseover event on parent of referencing element. Event bubbling from SVGElementInstance to referencing element ancestors. + Case 4: mousedown event on referencing element. SVGElementInstance is not effected by event listener on referencing element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Mouseover each of the red rectangles, and then click on the bottommost rectangle. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + This test contains four cases. The cases must produce the following results for the test to pass. + </p> + <ul> + <li>Case 1: On a mouseover event on the top square, all four squares must turn blue.</li> + <li>Case 2: On a mouseover event on the top middle square, all four squares must turn blue and a black stroke + must appear on the referencing square (element).</li> + <li>Case 3: On a mouseover event on the bottom middle square, all four squares must turn blue and a black + stroke must appear on the referencing square (element).</li> + <li>Case 4: On a mouseover event on the bottom square, all four squares must turn blue, and on a mousedown event + a black stroke must appear on the referencing square (element).</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: interact-events-203-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <defs> + <!-- SVGElementInstance animates fill on mouseover --> + <rect id="rect" width="50" height="50" fill="red" onmouseover="document.getElementById('rect').setAttribute('fill','blue')" onmouseout="document.getElementById('rect').setAttribute('fill','red')" /> + </defs> + + <text x="120" y="20" font-size="15">Shadow tree event listener chain</text> + + <!--basic event dispatch - all rectangles turn blue --> + <use fill="red" x="30" y="30" xlink:href="#rect"/> + <text x="95" y="45" font-size="12">Case 1: on mouseover all squares must turn blue</text> + + <!-- event bubbling from SVGElementInstance to referencing element --> + <!-- all rectangles turn blue and second rectangle displays black stroke --> + <use id="use2" fill="red" x="30" y="100" xlink:href="#rect" onmouseover="document.getElementById('rect1').setAttribute('stroke','black')" onmouseout="document.getElementById('rect1').setAttribute('stroke','none')"/> + <rect id="rect1" pointer-events="none" x="30" y="100" width="50" height="50" fill="none" stroke-width="5" stroke="none"/> + + <g font-size="12"> + <text x="95" y="115">Case 2: on mouseover all squares must turn blue</text> + <text x="95" y="130">and a black stroke must appear on reference square</text> + </g> + + <!-- event bubbling from SVGElementInstance to referencing element ancestors--> + <!-- all rectangles turn blue and third rectangle displays black stroke --> + <g id="g1" onmouseover="document.getElementById('rect2').setAttribute('stroke','black')" onmouseout="document.getElementById('rect2').setAttribute('stroke','none')"> + <use fill="red" x="30" y="170" xlink:href="#rect"/> + <rect id="rect2" pointer-events="none" x="30" y="170" width="50" height="50" fill="none" stroke-width="5" stroke="none"/> + </g> + <g font-size="12"> + <text x="95" y="185">Case 3: on mouseover all squares must turn blue</text> + <text x="95" y="200">and a black stroke must appear on reference square</text> + </g> + + <!--SVGElementInstance is not effected by event listener on referencing element --> + <!-- all rectangles turn blue and displays black stroke only on mouse down --> + <use id="use3" fill="red" x="30" y="240" xlink:href="#rect" onmousedown="document.getElementById('rect3').setAttribute('stroke','black')" onmouseup="document.getElementById('rect3').setAttribute('stroke','none')"/> + <rect id="rect3" pointer-events="none" x="30" y="240" width="50" height="50" fill="none" stroke-width="5" stroke="none"/> + <g font-size="12"> + <text x="95" y="255">Case 4: on mouseover all squares must turn blue</text> + <text x="95" y="270">and on mousedown a black stroke must appear on reference square</text> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/interact-order-01-b-manual.svg b/testing/web-platform/tests/svg/import/interact-order-01-b-manual.svg new file mode 100644 index 000000000..c552a9609 --- /dev/null +++ b/testing/web-platform/tests/svg/import/interact-order-01-b-manual.svg @@ -0,0 +1,105 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: interact-order-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#UIEventProcessing"> + <p> + Test event bubbling of event attributes, part a. + </p> + <p> + The two circles test whether event bubbling is occurring + to parents of the target object, and whether the target object + is able to prevent bubbling. The supplemental text next to + the circles describes what should occur. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>This test requires user interaction. Firstly, move the pointer + over the top circle. Then, move it over the bottom circle.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if two black circles are displayed. The top circle +must turn pink when the pointer is over the circle, and go back to black once +the pointer leaves. The second circle must turn blue when the pointer is over +the circle, and go back to black once the pointer leaves. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: interact-order-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <script type="text/ecmascript"> + + function bubbleYes(evt, color){ + // Get Document + var target = evt.target; + target.setAttribute('fill', '' +color); + } + function bubbleNo(evt, color){ + // Get Document + var target = evt.target; + target.setAttribute('fill', '' +color); + evt.stopPropagation(); + evt.preventDefault(); + } + + </script> + </defs> + <text font-family="Arial" font-size="40" x="60" y="45">Event bubbling - a</text> + <g id="background"> + <rect fill="#EEE" stroke="#000" x="10" y="60" width="460" height="120"/> + <rect fill="#FFF" stroke="#000" x="10" y="180" width="460" height="120"/> + </g> + <g fill="#000" font-family="Arial" font-size="40"> + <!-- Event bubbling (i.e., propagation) is not turned off, so + event if first processed by 'circle', but then processed by 'g', + with result that circle turns blue, but then instantaneously + turns pink. --> + <g onmouseover="bubbleYes(evt, '#F08')" onmouseout="bubbleYes(evt, 'inherit')"> + <circle onmouseover="bubbleYes(evt, '#00F')" onmouseout="bubbleYes(evt, 'inherit')" cx="70" cy="120" r="50"/> + <circle onmouseover="bubbleNo(evt, '#00F')" onmouseout="bubbleNo(evt, 'inherit')" cx="70" cy="240" r="50"/> + </g> + <text x="150" y="110"> + Pointer in circle, + </text> + <text x="150" y="150"> + circle turns pink + </text> + <text x="150" y="230"> + Pointer in circle, + </text> + <text x="150" y="270"> + circle turns blue + </text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/interact-order-02-b-manual.svg b/testing/web-platform/tests/svg/import/interact-order-02-b-manual.svg new file mode 100644 index 000000000..175a739c9 --- /dev/null +++ b/testing/web-platform/tests/svg/import/interact-order-02-b-manual.svg @@ -0,0 +1,102 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: interact-order-02-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#UIEventProcessing"> + <p> + Test event bubbling of event attributes, part b. + </p> + <p> + The two circles test whether events are handled in the + proper order. Events listeners and event attributes are processed + before hyperlink processing, which is processed before text selection. + + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Click on the first circle, then the second, and lastly the new third circle.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Clicking on the first circle should change the circle from black to red. Clicking + on the second circle should take you to another SVG file titled "Hyperlink target for + interact-order-02.svg. Cliking on the circle in this SVG file should return you to the orginal + two circles. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: interact-order-02-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <script type="text/ecmascript"><![CDATA[ + + function bubbleYes(evt, color){ + // Get Document + var target = evt.target; + target.setAttribute('fill', '' +color); + } + function bubbleNo(evt, color){ + // Get Document + var target = evt.target; + target.setAttribute('fill', '' +color); + evt.stopPropagation(); + evt.preventDefault(); + } + + ]]></script> + </defs> + <text font-family="Arial" font-size="40" x="60" y="45">Event bubbling - b</text> + <g id="background"> + <rect fill="#EEE" stroke="#000" x="10" y="60" width="460" height="120"/> + <rect fill="#FFF" stroke="#000" x="10" y="180" width="460" height="120"/> + </g> + <g fill="#000" font-family="Arial" font-size="40"> + <!-- Test the order of events --> + <!-- Ensure that events get the event before the hyperlink. --> + <a xlink:href="../images/interact-order-02-b-targ.svg"> + <circle onclick="bubbleNo(evt, 'red')" onmouseout="bubbleNo(evt, 'inherit')" cx="70" cy="120" r="50"/> + <circle onclick="bubbleYes(evt, 'blue')" onmouseout="bubbleNo(evt, 'inherit')" cx="70" cy="240" r="50"/> + </a> + <text x="135" y="110"> + Click on circle, + </text> + <text x="135" y="150"> + circle turns red + </text> + <text x="135" y="230"> + Click on circle, + </text> + <text x="135" y="270"> + hyperlink + </text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/interact-order-03-b-manual.svg b/testing/web-platform/tests/svg/import/interact-order-03-b-manual.svg new file mode 100644 index 000000000..da13af3e8 --- /dev/null +++ b/testing/web-platform/tests/svg/import/interact-order-03-b-manual.svg @@ -0,0 +1,100 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: interact-order-03-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#UIEventProcessing"> + <p> + Test event bubbling of event attributes, part c. + </p> + <p> + The three strings tests event handling behavior on text. + Text selection only is available after event listeners and event + attributes have been processed, and after hyperlink processing + has occurred. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + First, click the string on the first line; then the second. Lastly, all text should be selectable. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The supplemental text below the text strings describes what should occur. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: interact-order-03-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <script type="text/ecmascript"><![CDATA[ + + function bubbleYes(evt, color){ + // Get Document + var target = evt.target; + target.setAttribute('fill', '' +color); + } + function bubbleNo(evt, color){ + // Get Document + var target = evt.target; + target.setAttribute('fill', '' +color); + evt.stopPropagation(); + evt.preventDefault(); + } + + ]]></script> + </defs> + <text font-family="Arial" font-size="40" x="60" y="40">Event bubbling - c</text> + <g id="background"> + <rect fill="#EEE" stroke="#000" x="10" y="55" width="460" height="230"/> + </g> + <g fill="#000" font-family="Arial" font-size="40"> + <!-- Ensure that events get the event before the hyperlink which + happens before text selection --> + <a xlink:href="../images/interact-order-03-b-targ.svg" font-size="40"> + <text x="20" y="90" onclick="bubbleNo(evt, 'red')" onmouseout="bubbleNo(evt, 'inherit')"> + String turns red on click + </text> + <g onclick="bubbleYes(evt, 'blue')" onmouseout="bubbleYes(evt, 'inherit')"> + <text x="60" y="160"> + String hyperlinks to + </text> + <text x="20" y="200" font-size="33"> + interact-order-03b-targ.svg + </text> + </g> + <text x="30" y="270" onclick="bubbleNo(evt, 'inherit')"> + All strings are selectable. + </text> + </a> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/interact-pevents-01-b-manual.svg b/testing/web-platform/tests/svg/import/interact-pevents-01-b-manual.svg new file mode 100644 index 000000000..75c11e92b --- /dev/null +++ b/testing/web-platform/tests/svg/import/interact-pevents-01-b-manual.svg @@ -0,0 +1,197 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="ED" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: interact-pevents-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#PointerEventsProperty"> + <p> + This test tests 'pointer-events' on text. Initially you should see four big rects with black stroke. + In the uppermost rect there should be 10 'O':s with black fill. + In the second rect from the top there should be 10 'O':s with no fill but with black stroke. + In the third and fourth rects there should be no visible 'O':s at all. + In the fourth rect there should be two green rects, and in each of the other three rects there should be one green rect. + </p> + <p> + For UA debugging purposes it's possible to click the "Toggle freeze" button before running the test. + That will reset the visibility, fill and stroke on each 'O' as the cursor moves over them so that it's + possible to trigger the change more than once. If the "Toggle freeze" button is clicked once again that + means the change will remain after the cursor moves out. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Using the pointer device move the cursor over the rects all the rects from left to right. + As the mouseover event triggers the 'O':s will become visible and marked in either green (a pass) or red (a fail). + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if after moving the cursor over all the rects: + </p> + <ol> + <li>all the 'O':s in the green rects have green fill</li> + <li>there are no red 'O':s visible</li> + <li>there are 9 green 'O':s in the first and second rect, 4 in the third rect and 6 in the fourth rect</li> + </ol> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: interact-pevents-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-family="sans-serif" font-size="40" text-rendering="geometricPrecision"> + <script><![CDATA[ + var no_reset = 1; + + function pass_in(elm) + { + elm.setAttribute("fill", "green"); + elm.setAttribute("visibility", "visible"); + } + + function pass_out(elm) + { + if(!no_reset) + { + elm.removeAttribute("fill"); + elm.removeAttribute("visibility"); + } + } + + function fail_in(elm) + { + elm.setAttribute("fill", "red"); + elm.setAttribute("visibility", "visible"); + } + + function fail_out(elm) + { + if(!no_reset) + { + elm.removeAttribute("fill"); + elm.removeAttribute("visibility"); + } + } + + function toggle_freeze() + { + no_reset = !no_reset; + } + ]]></script> + + <text x="240" y="40" text-anchor="middle" font-size="20">Test pointer-events on text</text> + <g transform="translate(40, -10)"> + <g id="first-line"> + <text x="50" y="100" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="80" y="100" pointer-events="visiblePainted" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="110" y="100" pointer-events="visibleFill" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="140" y="100" pointer-events="visibleStroke" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="170" y="100" pointer-events="visible" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="200" y="100" pointer-events="painted" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="230" y="100" pointer-events="fill" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="260" y="100" pointer-events="stroke" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="290" y="100" pointer-events="all" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="320" y="100" pointer-events="none" onmouseover="fail_in(evt.target)" onmouseout="fail_out(evt.target)">O</text> + + <g pointer-events="none"> + <rect x="50" y="65" height="40" width="270" fill="green" fill-opacity="0.5" visibility="visible"/> + + <rect x="50" y="65" height="40" width="300" fill="none" stroke="black" visibility="visible"/> + </g> + </g> + + <g id="second-line" transform="translate(0 60)" fill="none" stroke="black"> + <text x="50" y="100" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="80" y="100" pointer-events="visiblePainted" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="110" y="100" pointer-events="visibleFill" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="140" y="100" pointer-events="visibleStroke" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="170" y="100" pointer-events="visible" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="200" y="100" pointer-events="painted" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="230" y="100" pointer-events="fill" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="260" y="100" pointer-events="stroke" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="290" y="100" pointer-events="all" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="320" y="100" pointer-events="none" onmouseover="fail_in(evt.target)" onmouseout="fail_out(evt.target)">O</text> + + <g pointer-events="none"> + <rect x="50" y="65" height="40" width="270" fill="green" fill-opacity="0.5" visibility="visible" stroke="none"/> + + <rect x="50" y="65" height="40" width="300" fill="none" stroke="black" visibility="visible"/> + </g> + </g> + + <g id="third-line" transform="translate(0 120)" visibility="hidden"> + <text x="50" y="100" onmouseover="fail_in(evt.target)" onmouseout="fail_out(evt.target)">O</text> + <text x="80" y="100" pointer-events="visiblePainted" onmouseover="fail_in(evt.target)" onmouseout="fail_out(evt.target)">O</text> + <text x="110" y="100" pointer-events="visibleFill" onmouseover="fail_in(evt.target)" onmouseout="fail_out(evt.target)">O</text> + <text x="140" y="100" pointer-events="visibleStroke" onmouseover="fail_in(evt.target)" onmouseout="fail_out(evt.target)">O</text> + <text x="170" y="100" pointer-events="visible" onmouseover="fail_in(evt.target)" onmouseout="fail_out(evt.target)">O</text> + <text x="200" y="100" pointer-events="painted" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="230" y="100" pointer-events="fill" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="260" y="100" pointer-events="stroke" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="290" y="100" pointer-events="all" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="320" y="100" pointer-events="none" onmouseover="fail_in(evt.target)" onmouseout="fail_out(evt.target)">O</text> + + <g pointer-events="none"> + <rect x="200" y="65" height="40" width="120" fill="green" fill-opacity="0.5" visibility="visible"/> + + <rect x="50" y="65" height="40" width="300" fill="none" stroke="black" visibility="visible"/> + </g> + </g> + + <g id="fourth-line" transform="translate(0 180)" fill="none" stroke="none"> + <text x="50" y="100" onmouseover="fail_in(evt.target)" onmouseout="fail_out(evt.target)">O</text> + <text x="80" y="100" pointer-events="visiblePainted" onmouseover="fail_in(evt.target)" onmouseout="fail_out(evt.target)">O</text> + + <text x="110" y="100" pointer-events="visibleFill" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="140" y="100" pointer-events="visibleStroke" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="170" y="100" pointer-events="visible" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + + <text x="200" y="100" pointer-events="painted" onmouseover="fail_in(evt.target)" onmouseout="fail_out(evt.target)">O</text> + + <text x="230" y="100" pointer-events="fill" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="260" y="100" pointer-events="stroke" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + <text x="290" y="100" pointer-events="all" onmouseover="pass_in(evt.target)" onmouseout="pass_out(evt.target)">O</text> + + <text x="320" y="100" pointer-events="none" onmouseover="fail_in(evt.target)" onmouseout="fail_out(evt.target)">O</text> + + <g pointer-events="none"> + <rect x="110" y="65" height="40" width="90" fill="green" fill-opacity="0.5" visibility="visible"/> + <rect x="230" y="65" height="40" width="90" fill="green" fill-opacity="0.5" visibility="visible"/> + + <rect x="50" y="65" height="40" width="300" fill="none" stroke="black" visibility="visible"/> + </g> + </g> + + <g transform="translate(275, 300) scale(0.5)" onclick="toggle_freeze();"> + <rect id="button" width="150" height="26" fill="blue"/> + <text x="75" y="19" text-anchor="middle" font-size="20" fill="white">Toggle freeze</text> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/interact-pevents-03-b-manual.svg b/testing/web-platform/tests/svg/import/interact-pevents-03-b-manual.svg new file mode 100644 index 000000000..5da26cfbb --- /dev/null +++ b/testing/web-platform/tests/svg/import/interact-pevents-03-b-manual.svg @@ -0,0 +1,131 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="ED" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: interact-pevents-03-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#PointerEventsProperty"> + <p>Tests that pointer events are not delivered to text elements when the pointer is + over any white space due to letter-spacing.</p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>For each line of text, slowly move the mouse from left to right over and between all of the visible glyphs. + When the mouse is at various points along each line of text, the text will become green.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>For all of the lines of text, when the mouse is over a visible glyph, that line of text + must be green. When the mouse is between the visible glyphs, it must be either green or + black as follows:</p> + <ul> + <li>For the first, third and fifth lines, the text must be black when the mouse + is between any of the visible glyphs.</li> + <li>For the second and fourth lines, the space between each pair of visible glyphs is divided into + three parts (not necessarily of equal size): + <ul> + <li>When the mouse is over the first (left) part of the space between a pair of visible glyphs, the text must be black.</li> + <li>When the mouse is over the second (middle) part of the space between a pair of visible glyphs, the text must be green.</li> + <li>When the mouse is over the third (right) part of the space between a pair of visible glyphs, the text must be black.</li> + </ul></li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: interact-pevents-03-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-family="sans-serif" font-size="30" text-rendering="geometricPrecision"> + <defs> + <!-- ===================================================================== --> + <!-- Define the font for embedding - using Microsoft's "Comic Sans MS" --> + <!-- This is an SVG Font version of Comic. The Comic font license --> + <!-- allows editable and installable font embedding. --> + <!-- Only need to embed the characters that are used in the test --> + <!-- ===================================================================== --> + <font horiz-adv-x="959"> + <font-face font-family="TestComicSVGFont" units-per-em="2048" panose-1="3 15 7 2 3 3 2 2 2 4" ascent="2257" descent="-597" alphabetic="0"/> + <missing-glyph horiz-adv-x="1024" d="M128 0V1638H896V0H128zM256 128H768V1510H256V128z"/> + <glyph unicode=" " horiz-adv-x="1024" d="M0 0l1024 0l0 2048l-1024 0l0 -1024Z"/> + <glyph unicode="@" horiz-adv-x="1907" d="M1306 412Q1200 412 1123 443T999 535Q945 482 894 455T793 428Q682 428 584 518T485 717Q485 902 630 1055T961 1208Q1003 1208 1031 1177T1059 1102Q1059 1042 959 1013Q826 975 771 926Q690 855 690 717Q690 688 717 661Q748 631 794 633Q881 637 955 795Q1022 933 1074 933Q1116 933 1142 902T1168 826Q1168 806 1162 766T1155 706Q1155 641 1211 624Q1233 617 1306 617Q1443 617 1498 684Q1548 744 1548 883Q1548 1128 1351 1283Q1171 1425 921 1425Q630 1425 465 1205Q316 1009 316 712Q316 438 491 250Q673 54 959 54Q1040 54 1142 85L1317 150Q1361 166 1374 166Q1415 166 1445 134T1475 58Q1475 -37 1262 -96Q1101 -140 961 -140Q820 -140 673 -86T420 60Q110 328 110 712Q110 1096 322 1354Q547 1630 921 1630Q1259 1630 1500 1427Q1753 1212 1753 883Q1753 658 1643 537Q1528 412 1306 412z"/> + <glyph unicode="A" horiz-adv-x="1498" d="M1250 -30Q1158 -30 1090 206Q1064 296 1025 521Q923 507 758 471L492 416Q442 285 321 33Q289 -23 234 -23Q194 -23 163 6T131 78Q131 126 282 443Q265 469 265 503Q265 584 363 607Q477 821 651 1099Q888 1478 946 1478Q1025 1478 1054 1368L1117 1032L1266 337L1323 179Q1352 98 1352 71Q1352 28 1321 -1T1250 -30zM897 1113L611 652Q732 683 978 727L897 1113z"/> + <glyph unicode="y" horiz-adv-x="1066" d="M1011 892L665 144Q537 -129 469 -313L403 -507Q377 -579 313 -579Q271 -579 241 -552T210 -483Q210 -383 426 96L68 785L23 858Q-4 904 -4 935Q-4 976 27 1007T98 1038Q144 1038 169 1003Q339 767 534 331L682 676Q762 855 836 984Q868 1040 920 1040Q961 1040 992 1011T1024 942Q1024 920 1011 892z"/> + <glyph unicode="Ö" horiz-adv-x="1635" d="M802 -61Q520 -61 324 108Q116 288 116 572Q116 918 321 1201Q550 1515 892 1515Q1221 1515 1381 1367Q1548 1213 1548 881Q1548 535 1360 257Q1144 -61 802 -61zM892 1310Q647 1310 477 1066Q320 842 320 572Q320 379 463 258Q600 144 802 144Q1045 144 1203 389Q1344 608 1344 881Q1344 1120 1237 1217Q1135 1310 892 1310zM682 1848Q813 1848 813 1743Q813 1713 769 1685Q729 1660 694 1660Q571 1660 571 1763Q571 1792 608 1820T682 1848zM1221 1856Q1255 1856 1290 1825T1325 1763Q1325 1671 1182 1671Q1141 1671 1109 1692Q1073 1716 1073 1755Q1073 1824 1118 1844Q1143 1856 1221 1856z"/> + <glyph unicode="ç" horiz-adv-x="1052" d="M770 -196Q770 -320 710 -382T528 -445Q443 -445 367 -413Q271 -371 271 -298Q271 -244 339 -244Q375 -244 420 -268T517 -293Q566 -292 590 -269T614 -201Q614 -153 577 -115T463 -48Q304 -12 208 104Q105 227 105 404Q105 607 240 823Q390 1063 578 1063Q676 1063 797 1017Q950 958 950 873Q950 835 925 806T863 776Q834 776 813 793T771 828Q712 875 578 875Q476 875 376 693Q285 526 285 404Q285 272 375 196Q459 125 591 125Q651 125 719 157L835 219Q865 235 878 235Q915 235 942 206T969 138Q969 35 713 -40Q742 -78 756 -117T770 -196z"/> + </font> + + <font horiz-adv-x="959"> + <font-face font-family="TestComicSVGFont-space" units-per-em="2048" panose-1="3 15 7 2 3 3 2 2 2 4" ascent="2257" descent="-597" alphabetic="0"/> + <missing-glyph horiz-adv-x="1024" d="M128 0V1638H896V0H128zM256 128H768V1510H256V128z"/> + <glyph unicode=" " horiz-adv-x="1024"/> + <glyph unicode="@" horiz-adv-x="1907" d="M1306 412Q1200 412 1123 443T999 535Q945 482 894 455T793 428Q682 428 584 518T485 717Q485 902 630 1055T961 1208Q1003 1208 1031 1177T1059 1102Q1059 1042 959 1013Q826 975 771 926Q690 855 690 717Q690 688 717 661Q748 631 794 633Q881 637 955 795Q1022 933 1074 933Q1116 933 1142 902T1168 826Q1168 806 1162 766T1155 706Q1155 641 1211 624Q1233 617 1306 617Q1443 617 1498 684Q1548 744 1548 883Q1548 1128 1351 1283Q1171 1425 921 1425Q630 1425 465 1205Q316 1009 316 712Q316 438 491 250Q673 54 959 54Q1040 54 1142 85L1317 150Q1361 166 1374 166Q1415 166 1445 134T1475 58Q1475 -37 1262 -96Q1101 -140 961 -140Q820 -140 673 -86T420 60Q110 328 110 712Q110 1096 322 1354Q547 1630 921 1630Q1259 1630 1500 1427Q1753 1212 1753 883Q1753 658 1643 537Q1528 412 1306 412z"/> + <glyph unicode="A" horiz-adv-x="1498" d="M1250 -30Q1158 -30 1090 206Q1064 296 1025 521Q923 507 758 471L492 416Q442 285 321 33Q289 -23 234 -23Q194 -23 163 6T131 78Q131 126 282 443Q265 469 265 503Q265 584 363 607Q477 821 651 1099Q888 1478 946 1478Q1025 1478 1054 1368L1117 1032L1266 337L1323 179Q1352 98 1352 71Q1352 28 1321 -1T1250 -30zM897 1113L611 652Q732 683 978 727L897 1113z"/> + <glyph unicode="y" horiz-adv-x="1066" d="M1011 892L665 144Q537 -129 469 -313L403 -507Q377 -579 313 -579Q271 -579 241 -552T210 -483Q210 -383 426 96L68 785L23 858Q-4 904 -4 935Q-4 976 27 1007T98 1038Q144 1038 169 1003Q339 767 534 331L682 676Q762 855 836 984Q868 1040 920 1040Q961 1040 992 1011T1024 942Q1024 920 1011 892z"/> + <glyph unicode="Ö" horiz-adv-x="1635" d="M802 -61Q520 -61 324 108Q116 288 116 572Q116 918 321 1201Q550 1515 892 1515Q1221 1515 1381 1367Q1548 1213 1548 881Q1548 535 1360 257Q1144 -61 802 -61zM892 1310Q647 1310 477 1066Q320 842 320 572Q320 379 463 258Q600 144 802 144Q1045 144 1203 389Q1344 608 1344 881Q1344 1120 1237 1217Q1135 1310 892 1310zM682 1848Q813 1848 813 1743Q813 1713 769 1685Q729 1660 694 1660Q571 1660 571 1763Q571 1792 608 1820T682 1848zM1221 1856Q1255 1856 1290 1825T1325 1763Q1325 1671 1182 1671Q1141 1671 1109 1692Q1073 1716 1073 1755Q1073 1824 1118 1844Q1143 1856 1221 1856z"/> + <glyph unicode="ç" horiz-adv-x="1052" d="M770 -196Q770 -320 710 -382T528 -445Q443 -445 367 -413Q271 -371 271 -298Q271 -244 339 -244Q375 -244 420 -268T517 -293Q566 -292 590 -269T614 -201Q614 -153 577 -115T463 -48Q304 -12 208 104Q105 227 105 404Q105 607 240 823Q390 1063 578 1063Q676 1063 797 1017Q950 958 950 873Q950 835 925 806T863 776Q834 776 813 793T771 828Q712 875 578 875Q476 875 376 693Q285 526 285 404Q285 272 375 196Q459 125 591 125Q651 125 719 157L835 219Q865 235 878 235Q915 235 942 206T969 138Q969 35 713 -40Q742 -78 756 -117T770 -196z"/> + </font> + <script><![CDATA[ + function mouseover(elm) + { + elm.setAttribute("fill", "green"); + } + + function mouseout(elm) + { + elm.removeAttribute("fill"); + } + ]]></script> + </defs> + + <text x="240" y="40" text-anchor="middle" font-size="20">Test pointer-events on text</text> + + <g transform="translate(0, -10)" text-anchor="middle"> + <g font-family="TestComicSVGFont"> + <g id="first-line" letter-spacing="10"> + <text x="240" y="100" onmouseover="mouseover(evt.target)" onmouseout="mouseout(evt.target)">@ A y Ö ç</text> + </g> + + <g id="second-line" transform="translate(0 50)" letter-spacing="10" font-family="TestComicSVGFont-space"> + <text x="240" y="100" onmouseover="mouseover(evt.target)" onmouseout="mouseout(evt.target)">@ A y Ö ç</text> + </g> + + <g id="third-line" transform="translate(0 100)" letter-spacing="30"> + <text x="240" y="100" onmouseover="mouseover(evt.target)" onmouseout="mouseout(evt.target)">@AyÖç</text> + </g> + </g> + + <g font-family="sans-serif"> + <g id="fourth-line" transform="translate(0 150)" letter-spacing="10"> + <text x="240" y="100" onmouseover="mouseover(evt.target)" onmouseout="mouseout(evt.target)">@ A y Ö ç</text> + </g> + + <g id="fifth-line" transform="translate(0 200)" letter-spacing="30"> + <text x="240" y="100" onmouseover="mouseover(evt.target)" onmouseout="mouseout(evt.target)">@AyÖç</text> + </g> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/interact-pevents-04-t-manual.svg b/testing/web-platform/tests/svg/import/interact-pevents-04-t-manual.svg new file mode 100644 index 000000000..2ed7c6eee --- /dev/null +++ b/testing/web-platform/tests/svg/import/interact-pevents-04-t-manual.svg @@ -0,0 +1,132 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="ED" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: interact-pevents-04-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#PointerEventsProperty"> + <p> + Tests where text is considered intersected by the cursor when letter-spacing is used. + </p> + <p> + The first two lines should look the same, but the second line is using a slightly different svgfont that defines an empty path for the space glyph. + </p> + <p> + The third line doesn't have any spaces, just letter-spacing, so there are no glyphs in between the letters. Hovering the whitespace between the letters should not highlight the line. + </p> + <p> + The fourth line has a space glyph between the other glyphs, and letter-spacing. + </p> + <p> + The fifth line has no spaces only letter-spacing. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Slowly move the mouse over the characters on each row. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <ul> + <li>The first two lines must behave the same way, and must turn green only when a glyph is hovered, note that this includes the space glyph which covers about half the distance between each pair of the other glyphs.</li> + <li>The third line must turn green only when hovering each of the visible glyphs, not the whitespace.</li> + <li>The fourth line must turn green only when a glyph is hovered, note that this includes the space glyph which covers about half the distance between each pair of the other glyphs.</li> + <li>The fifth line must turn green only when hovering each of the visible glyphs, not the whitespace.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: interact-pevents-04-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-family="sans-serif" font-size="30" text-rendering="geometricPrecision"> + <defs> + <!-- ===================================================================== --> + <!-- Define the font for embedding - using Microsoft's "Comic Sans MS" --> + <!-- This is an SVG Font version of Comic. The Comic font license --> + <!-- allows editable and installable font embedding. --> + <!-- Only need to embed the characters that are used in the test --> + <!-- ===================================================================== --> + <font horiz-adv-x="959"> + <font-face font-family="TestComicSVGFont" units-per-em="2048" panose-1="3 15 7 2 3 3 2 2 2 4" ascent="2257" descent="-597" alphabetic="0"/> + <missing-glyph horiz-adv-x="1024" d="M128 0V1638H896V0H128zM256 128H768V1510H256V128z"/> + <glyph unicode=" " horiz-adv-x="1024" d="M0 0Z"/> + <glyph unicode="@" horiz-adv-x="1907" d="M1306 412Q1200 412 1123 443T999 535Q945 482 894 455T793 428Q682 428 584 518T485 717Q485 902 630 1055T961 1208Q1003 1208 1031 1177T1059 1102Q1059 1042 959 1013Q826 975 771 926Q690 855 690 717Q690 688 717 661Q748 631 794 633Q881 637 955 795Q1022 933 1074 933Q1116 933 1142 902T1168 826Q1168 806 1162 766T1155 706Q1155 641 1211 624Q1233 617 1306 617Q1443 617 1498 684Q1548 744 1548 883Q1548 1128 1351 1283Q1171 1425 921 1425Q630 1425 465 1205Q316 1009 316 712Q316 438 491 250Q673 54 959 54Q1040 54 1142 85L1317 150Q1361 166 1374 166Q1415 166 1445 134T1475 58Q1475 -37 1262 -96Q1101 -140 961 -140Q820 -140 673 -86T420 60Q110 328 110 712Q110 1096 322 1354Q547 1630 921 1630Q1259 1630 1500 1427Q1753 1212 1753 883Q1753 658 1643 537Q1528 412 1306 412z"/> + <glyph unicode="A" horiz-adv-x="1498" d="M1250 -30Q1158 -30 1090 206Q1064 296 1025 521Q923 507 758 471L492 416Q442 285 321 33Q289 -23 234 -23Q194 -23 163 6T131 78Q131 126 282 443Q265 469 265 503Q265 584 363 607Q477 821 651 1099Q888 1478 946 1478Q1025 1478 1054 1368L1117 1032L1266 337L1323 179Q1352 98 1352 71Q1352 28 1321 -1T1250 -30zM897 1113L611 652Q732 683 978 727L897 1113z"/> + <glyph unicode="y" horiz-adv-x="1066" d="M1011 892L665 144Q537 -129 469 -313L403 -507Q377 -579 313 -579Q271 -579 241 -552T210 -483Q210 -383 426 96L68 785L23 858Q-4 904 -4 935Q-4 976 27 1007T98 1038Q144 1038 169 1003Q339 767 534 331L682 676Q762 855 836 984Q868 1040 920 1040Q961 1040 992 1011T1024 942Q1024 920 1011 892z"/> + <glyph unicode="Ö" horiz-adv-x="1635" d="M802 -61Q520 -61 324 108Q116 288 116 572Q116 918 321 1201Q550 1515 892 1515Q1221 1515 1381 1367Q1548 1213 1548 881Q1548 535 1360 257Q1144 -61 802 -61zM892 1310Q647 1310 477 1066Q320 842 320 572Q320 379 463 258Q600 144 802 144Q1045 144 1203 389Q1344 608 1344 881Q1344 1120 1237 1217Q1135 1310 892 1310zM682 1848Q813 1848 813 1743Q813 1713 769 1685Q729 1660 694 1660Q571 1660 571 1763Q571 1792 608 1820T682 1848zM1221 1856Q1255 1856 1290 1825T1325 1763Q1325 1671 1182 1671Q1141 1671 1109 1692Q1073 1716 1073 1755Q1073 1824 1118 1844Q1143 1856 1221 1856z"/> + <glyph unicode="ç" horiz-adv-x="1052" d="M770 -196Q770 -320 710 -382T528 -445Q443 -445 367 -413Q271 -371 271 -298Q271 -244 339 -244Q375 -244 420 -268T517 -293Q566 -292 590 -269T614 -201Q614 -153 577 -115T463 -48Q304 -12 208 104Q105 227 105 404Q105 607 240 823Q390 1063 578 1063Q676 1063 797 1017Q950 958 950 873Q950 835 925 806T863 776Q834 776 813 793T771 828Q712 875 578 875Q476 875 376 693Q285 526 285 404Q285 272 375 196Q459 125 591 125Q651 125 719 157L835 219Q865 235 878 235Q915 235 942 206T969 138Q969 35 713 -40Q742 -78 756 -117T770 -196z"/> + </font> + + <font horiz-adv-x="959"> + <font-face font-family="TestComicSVGFont-space" units-per-em="2048" panose-1="3 15 7 2 3 3 2 2 2 4" ascent="2257" descent="-597" alphabetic="0"/> + <missing-glyph horiz-adv-x="1024" d="M128 0V1638H896V0H128zM256 128H768V1510H256V128z"/> + <glyph unicode=" " horiz-adv-x="1024"/> + <glyph unicode="@" horiz-adv-x="1907" d="M1306 412Q1200 412 1123 443T999 535Q945 482 894 455T793 428Q682 428 584 518T485 717Q485 902 630 1055T961 1208Q1003 1208 1031 1177T1059 1102Q1059 1042 959 1013Q826 975 771 926Q690 855 690 717Q690 688 717 661Q748 631 794 633Q881 637 955 795Q1022 933 1074 933Q1116 933 1142 902T1168 826Q1168 806 1162 766T1155 706Q1155 641 1211 624Q1233 617 1306 617Q1443 617 1498 684Q1548 744 1548 883Q1548 1128 1351 1283Q1171 1425 921 1425Q630 1425 465 1205Q316 1009 316 712Q316 438 491 250Q673 54 959 54Q1040 54 1142 85L1317 150Q1361 166 1374 166Q1415 166 1445 134T1475 58Q1475 -37 1262 -96Q1101 -140 961 -140Q820 -140 673 -86T420 60Q110 328 110 712Q110 1096 322 1354Q547 1630 921 1630Q1259 1630 1500 1427Q1753 1212 1753 883Q1753 658 1643 537Q1528 412 1306 412z"/> + <glyph unicode="A" horiz-adv-x="1498" d="M1250 -30Q1158 -30 1090 206Q1064 296 1025 521Q923 507 758 471L492 416Q442 285 321 33Q289 -23 234 -23Q194 -23 163 6T131 78Q131 126 282 443Q265 469 265 503Q265 584 363 607Q477 821 651 1099Q888 1478 946 1478Q1025 1478 1054 1368L1117 1032L1266 337L1323 179Q1352 98 1352 71Q1352 28 1321 -1T1250 -30zM897 1113L611 652Q732 683 978 727L897 1113z"/> + <glyph unicode="y" horiz-adv-x="1066" d="M1011 892L665 144Q537 -129 469 -313L403 -507Q377 -579 313 -579Q271 -579 241 -552T210 -483Q210 -383 426 96L68 785L23 858Q-4 904 -4 935Q-4 976 27 1007T98 1038Q144 1038 169 1003Q339 767 534 331L682 676Q762 855 836 984Q868 1040 920 1040Q961 1040 992 1011T1024 942Q1024 920 1011 892z"/> + <glyph unicode="Ö" horiz-adv-x="1635" d="M802 -61Q520 -61 324 108Q116 288 116 572Q116 918 321 1201Q550 1515 892 1515Q1221 1515 1381 1367Q1548 1213 1548 881Q1548 535 1360 257Q1144 -61 802 -61zM892 1310Q647 1310 477 1066Q320 842 320 572Q320 379 463 258Q600 144 802 144Q1045 144 1203 389Q1344 608 1344 881Q1344 1120 1237 1217Q1135 1310 892 1310zM682 1848Q813 1848 813 1743Q813 1713 769 1685Q729 1660 694 1660Q571 1660 571 1763Q571 1792 608 1820T682 1848zM1221 1856Q1255 1856 1290 1825T1325 1763Q1325 1671 1182 1671Q1141 1671 1109 1692Q1073 1716 1073 1755Q1073 1824 1118 1844Q1143 1856 1221 1856z"/> + <glyph unicode="ç" horiz-adv-x="1052" d="M770 -196Q770 -320 710 -382T528 -445Q443 -445 367 -413Q271 -371 271 -298Q271 -244 339 -244Q375 -244 420 -268T517 -293Q566 -292 590 -269T614 -201Q614 -153 577 -115T463 -48Q304 -12 208 104Q105 227 105 404Q105 607 240 823Q390 1063 578 1063Q676 1063 797 1017Q950 958 950 873Q950 835 925 806T863 776Q834 776 813 793T771 828Q712 875 578 875Q476 875 376 693Q285 526 285 404Q285 272 375 196Q459 125 591 125Q651 125 719 157L835 219Q865 235 878 235Q915 235 942 206T969 138Q969 35 713 -40Q742 -78 756 -117T770 -196z"/> + </font> + </defs> + + <text x="240" y="40" text-anchor="middle" font-size="20">Test pointer-events on text</text> + + <g transform="translate(0, -10)"> + <g font-family="TestComicSVGFont"> + <g id="first-line" letter-spacing="10"> + <text id="line1" x="120" y="100">@ A y Ö ç</text> + </g> + + <g id="second-line" transform="translate(0 50)" letter-spacing="10" font-family="TestComicSVGFont-space"> + <text id="line2" x="120" y="100">@ A y Ö ç</text> + </g> + + <g id="third-line" transform="translate(0 100)" letter-spacing="30"> + <text id="line3" x="120" y="100">@AyÖç</text> + </g> + </g> + + <g font-family="sans-serif"> + <g id="fourth-line" transform="translate(0 150)" letter-spacing="10"> + <text id="line4" x="120" y="100">@ A y Ö ç</text> + </g> + + <g id="fifth-line" transform="translate(0 200)" letter-spacing="30"> + <text id="line5" x="120" y="100">@AyÖç</text> + </g> + </g> + + <set attributeName="fill" to="green" begin="line1.mouseover" end="line1.mouseout" dur="indefinite" xlink:href="#line1"/> + <set attributeName="fill" to="green" begin="line2.mouseover" end="line2.mouseout" dur="indefinite" xlink:href="#line2"/> + <set attributeName="fill" to="green" begin="line3.mouseover" end="line3.mouseout" dur="indefinite" xlink:href="#line3"/> + <set attributeName="fill" to="green" begin="line4.mouseover" end="line4.mouseout" dur="indefinite" xlink:href="#line4"/> + <set attributeName="fill" to="green" begin="line5.mouseover" end="line5.mouseout" dur="indefinite" xlink:href="#line5"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/interact-pevents-05-b-manual.svg b/testing/web-platform/tests/svg/import/interact-pevents-05-b-manual.svg new file mode 100644 index 000000000..7a6f6815a --- /dev/null +++ b/testing/web-platform/tests/svg/import/interact-pevents-05-b-manual.svg @@ -0,0 +1,121 @@ +<svg version="1.1" baseProfile="tiny" onload="init()" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="ED" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: interact-pevents-05-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#PointerEventsProperty"> + <p> + Tests when text is considered hit by pointer-events. + According to SVG 1.1 pointer-events on text is not supposed to use the text boundingbox, instead it should use the 'character cells'. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Consider each of the two light blue boxes to be divided up into nine vertical strips: + five consisting of areas just wide enough to fit each of the glyphs, and four + consisting of the white space between those five other strips. For each of these + vertical strips, move the mouse slowly from the top of the light blue box to the bottom, + keeping the mouse within the strip. At various points, all of the glyphs within + the box will be green and at others they will all be black.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>When the mouse is over a glyph, then all of the glyphs within the light blue box + must be green.</p> + <p>When the mouse is within one of the white space strips, then all of the glyphs + within the light blue box must be black.</p> + <p>When the mouse is within the strip containing the first, second or fourth + glyph ("@", "A" or "Ö") and it is below the glyph, then all of the glyphs + within the light blue box must be black.</p> + <p>When the mouse is within the strip containing the second, third, fourth or + fifth glyph ("A", "y", "Ö" or "ç") and it is above the glyph, then all of the glyphs + within the light blue box must be black.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: interact-pevents-05-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-family="sans-serif" font-size="30" text-rendering="geometricPrecision"> + <defs> + <!-- ===================================================================== --> + <!-- Define the font for embedding - using Microsoft's "Comic Sans MS" --> + <!-- This is an SVG Font version of Comic. The Comic font license --> + <!-- allows editable and installable font embedding. --> + <!-- Only need to embed the characters that are used in the test --> + <!-- ===================================================================== --> + <font horiz-adv-x="959"> + <font-face font-family="TestComicSVGFont" units-per-em="2048" panose-1="3 15 7 2 3 3 2 2 2 4" ascent="2257" descent="-597" alphabetic="0"/> + <missing-glyph horiz-adv-x="1024" d="M128 0V1638H896V0H128zM256 128H768V1510H256V128z"/> + <glyph unicode=" " horiz-adv-x="1024" d="M0 0l1024 0l0 2048l-1024 0l0 -1024Z"/> + <glyph unicode="@" horiz-adv-x="1907" d="M1306 412Q1200 412 1123 443T999 535Q945 482 894 455T793 428Q682 428 584 518T485 717Q485 902 630 1055T961 1208Q1003 1208 1031 1177T1059 1102Q1059 1042 959 1013Q826 975 771 926Q690 855 690 717Q690 688 717 661Q748 631 794 633Q881 637 955 795Q1022 933 1074 933Q1116 933 1142 902T1168 826Q1168 806 1162 766T1155 706Q1155 641 1211 624Q1233 617 1306 617Q1443 617 1498 684Q1548 744 1548 883Q1548 1128 1351 1283Q1171 1425 921 1425Q630 1425 465 1205Q316 1009 316 712Q316 438 491 250Q673 54 959 54Q1040 54 1142 85L1317 150Q1361 166 1374 166Q1415 166 1445 134T1475 58Q1475 -37 1262 -96Q1101 -140 961 -140Q820 -140 673 -86T420 60Q110 328 110 712Q110 1096 322 1354Q547 1630 921 1630Q1259 1630 1500 1427Q1753 1212 1753 883Q1753 658 1643 537Q1528 412 1306 412z"/> + <glyph unicode="A" horiz-adv-x="1498" d="M1250 -30Q1158 -30 1090 206Q1064 296 1025 521Q923 507 758 471L492 416Q442 285 321 33Q289 -23 234 -23Q194 -23 163 6T131 78Q131 126 282 443Q265 469 265 503Q265 584 363 607Q477 821 651 1099Q888 1478 946 1478Q1025 1478 1054 1368L1117 1032L1266 337L1323 179Q1352 98 1352 71Q1352 28 1321 -1T1250 -30zM897 1113L611 652Q732 683 978 727L897 1113z"/> + <glyph unicode="y" horiz-adv-x="1066" d="M1011 892L665 144Q537 -129 469 -313L403 -507Q377 -579 313 -579Q271 -579 241 -552T210 -483Q210 -383 426 96L68 785L23 858Q-4 904 -4 935Q-4 976 27 1007T98 1038Q144 1038 169 1003Q339 767 534 331L682 676Q762 855 836 984Q868 1040 920 1040Q961 1040 992 1011T1024 942Q1024 920 1011 892z"/> + <glyph unicode="Ö" horiz-adv-x="1635" d="M802 -61Q520 -61 324 108Q116 288 116 572Q116 918 321 1201Q550 1515 892 1515Q1221 1515 1381 1367Q1548 1213 1548 881Q1548 535 1360 257Q1144 -61 802 -61zM892 1310Q647 1310 477 1066Q320 842 320 572Q320 379 463 258Q600 144 802 144Q1045 144 1203 389Q1344 608 1344 881Q1344 1120 1237 1217Q1135 1310 892 1310zM682 1848Q813 1848 813 1743Q813 1713 769 1685Q729 1660 694 1660Q571 1660 571 1763Q571 1792 608 1820T682 1848zM1221 1856Q1255 1856 1290 1825T1325 1763Q1325 1671 1182 1671Q1141 1671 1109 1692Q1073 1716 1073 1755Q1073 1824 1118 1844Q1143 1856 1221 1856z"/> + <glyph unicode="ç" horiz-adv-x="1052" d="M770 -196Q770 -320 710 -382T528 -445Q443 -445 367 -413Q271 -371 271 -298Q271 -244 339 -244Q375 -244 420 -268T517 -293Q566 -292 590 -269T614 -201Q614 -153 577 -115T463 -48Q304 -12 208 104Q105 227 105 404Q105 607 240 823Q390 1063 578 1063Q676 1063 797 1017Q950 958 950 873Q950 835 925 806T863 776Q834 776 813 793T771 828Q712 875 578 875Q476 875 376 693Q285 526 285 404Q285 272 375 196Q459 125 591 125Q651 125 719 157L835 219Q865 235 878 235Q915 235 942 206T969 138Q969 35 713 -40Q742 -78 756 -117T770 -196z"/> + </font> + <script> + <![CDATA[ + function init() + { + drawBBox("line1"); + drawBBox("line2"); + } + + function mouseover(elm) + { + elm.setAttribute("fill", "green"); + } + + function mouseout(elm) + { + elm.removeAttribute("fill"); + } + + function drawBBox(id) + { + var elm = document.getElementById(id); + var bbox = elm.getBBox(); + var bboxrect = document.createElementNS("http://www.w3.org/2000/svg", "rect"); + bboxrect.setAttribute("x", bbox.x); + bboxrect.setAttribute("y", bbox.y); + bboxrect.setAttribute("width", bbox.width); + bboxrect.setAttribute("height", bbox.height); + bboxrect.setAttribute("fill-opacity", "0.1"); + bboxrect.setAttribute("fill", "blue"); + elm.parentNode.insertBefore(bboxrect, elm); + } + ]]></script> + </defs> + + <text x="240" y="40" text-anchor="middle" font-size="20">Test pointer-events on text</text> + <g transform="translate(0, -10)" text-anchor="middle"> + <text id="line1" dx="0 10 10 10 10 10" dy="-10 10 60 -10 10" x="240" y="100" onmouseover="mouseover(evt.target)" onmouseout="mouseout(evt.target)">@AyÖç</text> + <text id="line2" font-family="TestComicSVGFont" dx="0 10 10 10 10 10" dy="-10 10 60 -10 10" x="240" y="220" onmouseover="mouseover(evt.target)" onmouseout="mouseout(evt.target)">@AyÖç</text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/interact-pevents-07-t-manual.svg b/testing/web-platform/tests/svg/import/interact-pevents-07-t-manual.svg new file mode 100644 index 000000000..e78f68ee2 --- /dev/null +++ b/testing/web-platform/tests/svg/import/interact-pevents-07-t-manual.svg @@ -0,0 +1,114 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="DOH" author="AE" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: interact-pevents-07-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#PointerEventsProperty"> + <p>Testing pointer-events and rendering order</p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Move the mouse over the blue and purple shapes. Click the red circle on the top left. Move the mouse over the blue and purple shapes again. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + For the test to pass the blue rectangles must always turn red on mouseover, and the ovals must turn red on mouseover only if pointer-events are set to "ALL". + If a shape other than the one currently hovered turns red then the test has failed. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: interact-pevents-07-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <script><![CDATA[ + function changeFill(id, fill) + { + document.getElementById(id).setAttribute("fill", fill); + } + + function changePointerEvents(value) + { + if ('on' == value) + { + document.getElementById('all').setAttribute("visibility", 'visible'); + document.getElementById('none').setAttribute("visibility", 'hidden'); + document.getElementById('on').setAttribute("stroke-width", '3'); + document.getElementById('off').setAttribute("stroke-width", '1'); + document.getElementById('c10').setAttribute("pointer-events", 'all'); + document.getElementById('c11').setAttribute("pointer-events", 'all'); + document.getElementById('c12').setAttribute("pointer-events", 'all'); + } + else + { + document.getElementById('all').setAttribute("visibility", 'hidden'); + document.getElementById('none').setAttribute("visibility", 'visible'); + document.getElementById('on').setAttribute("stroke-width", '1'); + document.getElementById('off').setAttribute("stroke-width", '3'); + document.getElementById('c10').setAttribute("pointer-events", 'none'); + document.getElementById('c11').setAttribute("pointer-events", 'none'); + document.getElementById('c12').setAttribute("pointer-events", 'none'); + } + + } + ]]></script> + <rect x="15" y="15" height="280" width="450" fill="none" stroke="black" stroke-width="0.25"/> + <g text-anchor="middle"> + <text x="240" y="30" fill="black" font-size="15">Testing pointer-events and rendering order</text> + <text x="240" y="42" fill="#555" font-size="10">Rectangles should turn RED on mouseover </text> + <text x="240" y="54" fill="#555" font-size="10">Ovals should turn RED if Pointer-Events are set to "ALL"</text> + </g> + <g id="buttons"> + <g text-anchor="middle" font-size="8" fill="#555" transform="translate(0,10)"> + <text x="400" y="85">Change "Pointer-Events" of </text> + <text x="400" y="95">ovals from "ALL" to "NONE"</text> + <circle id="on" cx="385" cy="65" r="10" fill-opacity="1" fill="#3c5" stroke="black" stroke-width="3" onmousedown="changePointerEvents('on')" /> + <circle id="off" cx="415" cy="65" r="10" fill-opacity="1" fill="#f35" stroke="black" onmousedown="changePointerEvents('off')" /> + </g> + <g text-anchor="middle" font-size="12" fill="#555"> + <text id="all" x="240" y="285" fill="#555" visibility="visible" >Purple ovals have "Pointer-Events" set to "ALL".</text> + <text id="none" x="240" y="285" fill="#555" visibility="hidden">Purple ovals have Pointer-Events set to "NONE".</text> + </g> + </g> + <g transform="scale(0.75, 0.5) translate(100, 85)"> + <circle id="c10" cx="160" cy="350" r="100" fill-opacity="1" fill="#53f" stroke="black" pointer-events="all" onmouseover="changeFill('c10', '#F55')" onmouseout="changeFill('c10', '#53F')" /> + <rect id="r10" x="10" y="50" width="300" height="300" fill-opacity="1" fill="#35f" stroke="black" onmouseover="changeFill('r10', '#F55')" onmouseout="changeFill('r10', '#35F')" /> + <circle id="c11" cx="310" cy="350" r="90" fill-opacity="1" fill="#75f" stroke="black" pointer-events="all" onmouseover="changeFill('c11', '#F55')" onmouseout="changeFill('c11', '#75f')" /> + <rect id="r11" x="60" y="100" width="200" height="200" fill-opacity="1" fill="#57f" stroke="black" onmouseover="changeFill('r11', '#F55')" onmouseout="changeFill('r11', '#57f')" /> + <circle id="c12" cx="310" cy="200" r="75" fill-opacity="1" fill="#97f" stroke="black" pointer-events="all" onmouseover="changeFill('c12', '#F55')" onmouseout="changeFill('c12', '#97f')" /> + <rect id="r12" x="110" y="150" width="100" height="100" fill-opacity="1" fill="#79f" stroke="black" onmouseover="changeFill('r12', '#F55')" onmouseout="changeFill('r12', '#79F')" /> + <g id="dasharray-rectangles" stroke-width="0.5" stroke-dasharray="4, 4"> + <rect id="r-dash10" x="10" y="50" width="300" height="300" fill-opacity="0" fill="none" stroke="black" pointer-events="none"/> + <rect id="r-dash11" x="60" y="100" width="200" height="200" fill-opacity="0" fill="none" stroke="black" pointer-events="none"/> + <rect id="r-dash12" x="110" y="150" width="100" height="100" fill-opacity="0" fill="none" stroke="black" pointer-events="none"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/interact-pevents-08-f-manual.svg b/testing/web-platform/tests/svg/import/interact-pevents-08-f-manual.svg new file mode 100644 index 000000000..f3a3d3bd0 --- /dev/null +++ b/testing/web-platform/tests/svg/import/interact-pevents-08-f-manual.svg @@ -0,0 +1,185 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVG" author="ED" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: interact-pevents-08-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#PointerEventsProperty"> + <p>Tests the pointer-events attribute with different 'visible' values, same as the interact-pevents-201-t test but with script instead of declarative animation</p> + <p> + The 2nd and 3rd columns represent respectively rects with no fill/stroke and transparent fill/stroke. + The 4th column (most right column) has a non activatable pointer event as the visibility of the column + is set to hidden. + </p> + <p> + The first row tests the default value for pointer-event, i.e. visible fill and stroke will trigger an event. + The second row tests pointer-events="visiblePainted", i.e. visible fill and stroke will trigger an event. + The third row tests pointer-events="visibleFill", i.e. visible fill only an event. + The fourth row tests pointer-events="visibleStroke", i.e. visible stroke only an event. + The fifth row tests pointer-events="visible", i.e. visible fill and stroke will trigger an event. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Slowly move the mouse over the rectangles in each row while checking the pass criteria. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the following conditions are met: + </p> + <ul> + <li>In the first row of squares, the fill and stroke of squares 1 and 3 only must trigger a pale red rectangle to appear + over the squares on mouseover.</li> + <li>In the second row of squares, the fill and stroke of squares 1 and 3 only must trigger a pale red rectangle to appear + over the squares on mouseover.</li> + <li>In the third row of squares, the fill only of squares 1, 2 and 3 must trigger a pale red rectangle to appear + over the squares on mouseover.</li> + <li>In the fourth row of squares, the stroke only of squares 1, 2 and 3 must trigger a pale red rectangle to appear + over the squares on mouseover.</li> + <li>In the fifth row of squares, the fill and stroke of squares 1, 2 and 3 must trigger a pale red rectangle to appear + over the squares on mouseover.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: interact-pevents-08-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <script><![CDATA[ + function show(id) + { + document.getElementById(id).setAttribute("fill-opacity", "0.4"); + } + + function hide(id) + { + document.getElementById(id).setAttribute("fill-opacity", "0"); + } + ]]></script> + <g text-anchor="middle"> + <text id="display-title" x="240" y="25" fill="#555" font-size="12"> + <tspan fill="black" font-size="10">Testing pointer-events</tspan> - pale RED rect should appear on mouseover. + </text> + <text id="comment-1" x="240" y="37" fill="#555" font-size="10"> + 2nd and 3rd columns represent respectively rects with no fill/stroke and transparent fill/stroke + </text> + </g> + <g transform="translate(0, 5)"> + <g transform="translate(25, 50)"> + <rect id="m1" x="-10" y="-10" width="200" height="50" fill="red" fill-opacity="0"/> + <rect id="r10" width="30" height="30" fill="blue" stroke-width="10" stroke="blue" fill-opacity=".3" stroke-opacity=".3" onmouseover="show('m1')" onmouseout="hide('m1')"/> + <rect x="50" width="30" height="30" fill="black" fill-opacity="0.1" stroke-width="10" stroke="black" stroke-opacity="0.1"/> + <rect id="r11" x="50" width="30" height="30" fill="none" stroke-width="10" stroke="none" fill-opacity=".3" stroke-opacity=".3" onmouseover="show('m1')" onmouseout="hide('m1')"/> + <rect x="100" width="30" height="30" fill="blue" fill-opacity="0.1" stroke-width="10" stroke="blue" stroke-opacity="0.1"/> + <rect id="r12" x="100" width="30" height="30" fill="blue" stroke-width="10" stroke="blue" fill-opacity="0" stroke-opacity="0" onmouseover="show('m1')" onmouseout="hide('m1')"/> + <rect x="145" y="-5" width="40" height="40" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect x="150" width="30" height="30" fill="none" stroke-width="1" stroke="black" stroke-dasharray="1,1"/> + <rect x="155" y="5" width="20" height="20" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect id="r13" x="150" width="30" height="30" fill="black" stroke-width="10" stroke="black" visibility="hidden" onmouseover="show('m1')" onmouseout="hide('m1')"/> + <g font-size="12"> + <text x="200" y="15">default : </text> + <text x="200" y="30" fill="#777">fill and stroke of rects 1 and 3 must trigger</text> + </g> + </g> + <g transform="translate(25, 100)"> + <rect id="m2" x="-10" y="-10" width="200" height="50" fill="red" fill-opacity="0"/> + <rect id="r20" width="30" height="30" fill="blue" stroke-width="10" stroke="blue" fill-opacity=".3" stroke-opacity=".3" pointer-events="visiblePainted" onmouseover="show('m2')" onmouseout="hide('m2')"/> + <rect x="50" width="30" height="30" fill="black" fill-opacity="0.1" stroke-width="10" stroke="black" stroke-opacity="0.1"/> + <rect id="r21" x="50" width="30" height="30" fill="none" stroke-width="10" stroke="none" fill-opacity=".3" stroke-opacity=".3" pointer-events="visiblePainted" onmouseover="show('m2')" onmouseout="hide('m2')"/> + <rect x="100" width="30" height="30" fill="blue" fill-opacity="0.1" stroke-width="10" stroke="blue" stroke-opacity="0.1"/> + <rect id="r22" x="100" width="30" height="30" fill="blue" stroke-width="10" stroke="blue" fill-opacity="0" stroke-opacity="0" pointer-events="visiblePainted" onmouseover="show('m2')" onmouseout="hide('m2')"/> + <rect x="145" y="-5" width="40" height="40" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect x="150" width="30" height="30" fill="none" stroke-width="1" stroke="black" stroke-dasharray="1,1"/> + <rect x="155" y="5" width="20" height="20" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect id="r23" x="150" width="30" height="30" fill="black" stroke-width="10" stroke="black" visibility="hidden" pointer-events="visiblePainted" onmouseover="show('m2')" onmouseout="hide('m2')"/> + <g font-size="12"> + <text x="200" y="15">visiblePainted : </text> + <text x="200" y="30" fill="#777">fill and stroke of rects 1 and 3 must trigger</text> + </g> + </g> + <g transform="translate(25, 150)"> + <rect id="m3" x="-10" y="-10" width="200" height="50" fill="red" fill-opacity="0"/> + <rect id="r30" width="30" height="30" fill="blue" stroke-width="10" stroke="black" fill-opacity=".3" stroke-opacity=".3" pointer-events="visibleFill" onmouseover="show('m3')" onmouseout="hide('m3')"/> + + <rect x="50" width="30" height="30" fill="blue" fill-opacity="0.1" stroke-width="10" stroke="black" stroke-opacity="0.1"/> + <rect id="r31" x="50" width="30" height="30" fill="none" stroke-width="10" stroke="none" fill-opacity=".3" stroke-opacity=".3" pointer-events="visibleFill" onmouseover="show('m3')" onmouseout="hide('m3')"/> + + <rect x="100" width="30" height="30" fill="blue" fill-opacity="0.1" stroke-width="10" stroke="black" stroke-opacity="0.1"/> + <rect id="r32" x="100" width="30" height="30" fill="blue" stroke-width="10" stroke="black" fill-opacity="0" stroke-opacity="0" pointer-events="visibleFill" onmouseover="show('m3')" onmouseout="hide('m3')"/> + + <rect x="145" y="-5" width="40" height="40" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect x="150" width="30" height="30" fill="none" stroke-width="1" stroke="black" stroke-dasharray="1,1"/> + <rect x="155" y="5" width="20" height="20" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect id="r33" x="150" width="30" height="30" fill="black" stroke-width="10" stroke="black" visibility="hidden" pointer-events="visibleFill" onmouseover="show('m3')" onmouseout="hide('m3')"/> + <g font-size="12"> + <text x="200" y="15">visibleFill : </text> + <text x="200" y="30" fill="#777">only fill of rects 1, 2 and 3 must trigger</text> + </g> + </g> + <g transform="translate(25, 200)"> + <rect id="m4" x="-10" y="-10" width="200" height="50" fill="red" fill-opacity="0"/> + <rect id="r40" width="30" height="30" fill="black" stroke-width="10" stroke="blue" fill-opacity=".3" stroke-opacity=".3" pointer-events="visibleStroke" onmouseover="show('m4')" onmouseout="hide('m4')"/> + + <rect x="50" width="30" height="30" fill="black" fill-opacity="0.1" stroke-width="10" stroke="blue" stroke-opacity="0.1"/> + <rect id="r41" x="50" width="30" height="30" fill="none" stroke-width="10" stroke="none" fill-opacity=".3" stroke-opacity=".3" pointer-events="visibleStroke" onmouseover="show('m4')" onmouseout="hide('m4')"/> + + <rect x="100" width="30" height="30" fill="black" fill-opacity="0.1" stroke-width="10" stroke="blue" stroke-opacity="0.1"/> + <rect id="r42" x="100" width="30" height="30" fill="black" stroke-width="10" stroke="blue" fill-opacity="0" stroke-opacity="0" pointer-events="visibleStroke" onmouseover="show('m4')" onmouseout="hide('m4')"/> + + <rect x="145" y="-5" width="40" height="40" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect x="150" width="30" height="30" fill="none" stroke-width="1" stroke="black" stroke-dasharray="1,1"/> + <rect x="155" y="5" width="20" height="20" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect id="r43" x="150" width="30" height="30" fill="black" stroke-width="10" stroke="black" visibility="hidden" pointer-events="visibleStroke" onmouseover="show('m4')" onmouseout="hide('m4')"/> + <g font-size="12"> + <text x="200" y="15">visibleStroke : </text> + <text x="200" y="30" fill="#777">only stroke of rects 1, 2 and 3 must trigger</text> + </g> + </g> + <g transform="translate(25, 250)"> + <rect id="m5" x="-10" y="-10" width="200" height="50" fill="red" fill-opacity="0"/> + <rect id="r50" width="30" height="30" fill="blue" stroke-width="10" stroke="blue" fill-opacity=".3" stroke-opacity=".3" pointer-events="visible" onmouseover="show('m5')" onmouseout="hide('m5')"/> + + <rect x="50" width="30" height="30" fill="blue" fill-opacity="0.1" stroke-width="10" stroke="blue" stroke-opacity="0.1"/> + <rect id="r51" x="50" width="30" height="30" fill="none" stroke-width="10" stroke="none" fill-opacity=".3" stroke-opacity=".3" pointer-events="visible" onmouseover="show('m5')" onmouseout="hide('m5')"/> + + <rect x="100" width="30" height="30" fill="blue" fill-opacity="0.1" stroke-width="10" stroke="blue" stroke-opacity="0.1"/> + <rect id="r52" x="100" width="30" height="30" fill="blue" stroke-width="10" stroke="blue" fill-opacity="0" stroke-opacity="0" pointer-events="visible" onmouseover="show('m5')" onmouseout="hide('m5')"/> + + <rect x="145" y="-5" width="40" height="40" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect x="150" width="30" height="30" fill="none" stroke-width="1" stroke="black" stroke-dasharray="1,1"/> + <rect x="155" y="5" width="20" height="20" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect id="r53" x="150" width="30" height="30" fill="black" stroke-width="10" stroke="black" visibility="hidden" pointer-events="visible" onmouseover="show('m5')" onmouseout="hide('m5')"/> + <g font-size="12"> + <text x="200" y="15">visible : </text> + <text x="200" y="30" fill="#777">fill and stroke of rects 1, 2 and 3 must trigger</text> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/interact-pevents-09-f-manual.svg b/testing/web-platform/tests/svg/import/interact-pevents-09-f-manual.svg new file mode 100644 index 000000000..44d7372ec --- /dev/null +++ b/testing/web-platform/tests/svg/import/interact-pevents-09-f-manual.svg @@ -0,0 +1,174 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="ED" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: interact-pevents-09-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#PointerEventsProperty"> + <p>Tests the pointer-events attribute with different painting values, same as the interact-pevents-202-t test but with script instead of declarative animation</p> + <p> + The 2nd and 3rd columns represent respectively rects with no fill/stroke and transparent fill/stroke. + The 4th column has visibility set to hidden. + </p> + <p> + The first row tests pointer-events="painted", i.e. event on fill and stroke that are set. + The second row tests pointer-events="fill", i.e. event on a fill that is set. + The third row tests pointer-events="stroke", i.e. even on a stroke that is et. + The fourth row tests pointer-events="all", i.e. event on fill and stroke that are set. + The fifth row tests pointer-events="none", i.e. no event. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Slowly move the mouse over the rectangles in each row while checking the pass criteria. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the following conditions are met: + </p> + <ul> + <li>In the first row of squares, the fill and stroke of squares 1, 3 and 4 only must trigger a pale red rectangle to appear + over the squares on mouseover.</li> + <li>In the second row of squares, the fill only of all squares must trigger a pale red rectangle to appear + over the squares on mouseover.</li> + <li>In the third row of squares, the stroke only of all must trigger a pale red rectangle to appear + over the squares on mouseover.</li> + <li>In the fourth row of squares, the fill and stroke of all squares must trigger a pale red rectangle to appear + over the squares on mouseover.</li> + <li>In the fifth row of squares, nothing is to trigger on mouseover.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: interact-pevents-09-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <script><![CDATA[ + function show(id) + { + document.getElementById(id).setAttribute("fill-opacity", "0.4"); + } + + function hide(id) + { + document.getElementById(id).setAttribute("fill-opacity", "0"); + } + ]]></script> + <g text-anchor="middle"> + <text id="display-title" x="240" y="25" fill="#555" font-size="12"> + <tspan fill="black" font-size="10">Testing pointer-events</tspan> - pale RED rect should appear on mouseover. + </text> + <text id="comment-1" x="240" y="37" fill="#555" font-size="10"> + 2nd and 3rd columns represent respectively rects with no fill/stroke and transparent fill/stroke + </text> + </g> + <g transform="translate(0, 5)"> + <g transform="translate(25, 50)"> + <rect id="m1" x="-10" y="-10" width="200" height="50" fill="red" fill-opacity="0"/> + <rect id="r60" width="30" height="30" fill="blue" stroke-width="10" stroke="blue" fill-opacity=".3" stroke-opacity=".3" pointer-events="painted" onmouseover="show('m1')" onmouseout="hide('m1')"/> + <rect x="50" width="30" height="30" fill="black" fill-opacity="0.1" stroke-width="10" stroke="black" stroke-opacity="0.1"/> + <rect id="r61" x="50" width="30" height="30" fill="none" stroke-width="10" stroke="none" fill-opacity=".3" stroke-opacity=".3" pointer-events="painted" onmouseover="show('m1')" onmouseout="hide('m1')"/> + <rect x="100" width="30" height="30" fill="blue" fill-opacity="0.1" stroke-width="10" stroke="blue" stroke-opacity="0.1"/> + <rect id="r62" x="100" width="30" height="30" fill="blue" stroke-width="10" stroke="blue" fill-opacity="0" stroke-opacity="0" pointer-events="painted" onmouseover="show('m1')" onmouseout="hide('m1')"/> + <rect x="145" y="-5" width="40" height="40" fill="none" stroke-width="1" stroke="blue" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect x="150" width="30" height="30" fill="none" stroke-width="1" stroke="blue" stroke-dasharray="1,1"/> + <rect x="155" y="5" width="20" height="20" fill="none" stroke-width="1" stroke="blue" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect id="r63" x="150" width="30" height="30" fill="blue" stroke-width="10" stroke="blue" visibility="hidden" pointer-events="painted" onmouseover="show('m1')" onmouseout="hide('m1')"/> + <g font-size="12"> + <text x="200" y="15">painted : </text> + <text x="200" y="30" fill="#777">fill and stroke of rects 1, 3 and 4 must trigger</text> + </g> + </g> + <g transform="translate(25, 100)"> + <rect id="m2" x="-10" y="-10" width="200" height="50" fill="red" fill-opacity="0"/> + <rect id="r70" width="30" height="30" fill="blue" stroke-width="10" stroke="black" fill-opacity=".3" stroke-opacity=".3" pointer-events="fill" onmouseover="show('m2')" onmouseout="hide('m2')"/> + <rect x="50" width="30" height="30" fill="blue" fill-opacity="0.1" stroke-width="10" stroke="black" stroke-opacity="0.1"/> + <rect id="r71" x="50" width="30" height="30" fill="none" stroke-width="10" stroke="none" fill-opacity=".3" stroke-opacity=".3" pointer-events="fill" onmouseover="show('m2')" onmouseout="hide('m2')"/> + <rect x="100" width="30" height="30" fill="blue" fill-opacity="0.1" stroke-width="10" stroke="black" stroke-opacity="0.1"/> + <rect id="r72" x="100" width="30" height="30" fill="blue" stroke-width="10" stroke="black" fill-opacity="0" stroke-opacity="0" pointer-events="fill" onmouseover="show('m2')" onmouseout="hide('m2')"/> + <rect x="145" y="-5" width="40" height="40" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect x="150" width="30" height="30" fill="none" stroke-width="1" stroke="black" stroke-dasharray="1,1"/> + <rect x="155" y="5" width="20" height="20" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect id="r73" x="150" width="30" height="30" fill="blue" stroke-width="10" stroke="black" visibility="hidden" pointer-events="fill" onmouseover="show('m2')" onmouseout="hide('m2')"/> + <g font-size="12"> + <text x="200" y="15">fill : </text> + <text x="200" y="30" fill="#777">fill of rects 1 to 4 must trigger</text> + </g> + </g> + <g transform="translate(25, 150)"> + <rect id="m3" x="-10" y="-10" width="200" height="50" fill="red" fill-opacity="0"/> + <rect id="r80" width="30" height="30" fill="black" stroke-width="10" stroke="blue" fill-opacity=".3" stroke-opacity=".3" pointer-events="stroke" onmouseover="show('m3')" onmouseout="hide('m3')"/> + <rect x="50" width="30" height="30" fill="black" fill-opacity="0.1" stroke-width="10" stroke="blue" stroke-opacity="0.1"/> + <rect id="r81" x="50" width="30" height="30" fill="none" stroke-width="10" stroke="none" fill-opacity=".3" stroke-opacity=".3" pointer-events="stroke" onmouseover="show('m3')" onmouseout="hide('m3')"/> + <rect x="100" width="30" height="30" fill="black" fill-opacity="0.1" stroke-width="10" stroke="blue" stroke-opacity="0.1"/> + <rect id="r82" x="100" width="30" height="30" fill="black" stroke-width="10" stroke="blue" fill-opacity="0" stroke-opacity="0" pointer-events="stroke" onmouseover="show('m3')" onmouseout="hide('m3')"/> + <rect x="145" y="-5" width="40" height="40" fill="none" stroke-width="1" stroke="blue" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect x="150" width="30" height="30" fill="none" stroke-width="1" stroke="blue" stroke-dasharray="1,1"/> + <rect x="155" y="5" width="20" height="20" fill="none" stroke-width="1" stroke="blue" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect id="r83" x="150" width="30" height="30" fill="black" stroke-width="10" stroke="blue" visibility="hidden" pointer-events="stroke" onmouseover="show('m3')" onmouseout="hide('m3')"/> + <g font-size="12"> + <text x="200" y="15">stroke : </text> + <text x="200" y="30" fill="#777">stroke of rects 1 to 4 must trigger</text> + </g> + </g> + <g transform="translate(25, 200)"> + <rect id="m4" x="-10" y="-10" width="200" height="50" fill="red" fill-opacity="0"/> + <rect id="r90" width="30" height="30" fill="blue" stroke-width="10" stroke="blue" fill-opacity=".3" stroke-opacity=".3" pointer-events="all" onmouseover="show('m4')" onmouseout="hide('m4')"/> + <rect x="50" width="30" height="30" fill="blue" fill-opacity="0.1" stroke-width="10" stroke="blue" stroke-opacity="0.1"/> + <rect id="r91" x="50" width="30" height="30" fill="none" stroke-width="10" stroke="none" fill-opacity=".3" stroke-opacity=".3" pointer-events="all" onmouseover="show('m4')" onmouseout="hide('m4')"/> + <rect x="100" width="30" height="30" fill="blue" fill-opacity="0.1" stroke-width="10" stroke="blue" stroke-opacity="0.1"/> + <rect id="r92" x="100" width="30" height="30" fill="blue" stroke-width="10" stroke="blue" fill-opacity="0" stroke-opacity="0" pointer-events="all" onmouseover="show('m4')" onmouseout="hide('m4')"/> + <rect x="145" y="-5" width="40" height="40" fill="none" stroke-width="1" stroke="blue" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect x="150" width="30" height="30" fill="none" stroke-width="1" stroke="blue" stroke-dasharray="1,1"/> + <rect x="155" y="5" width="20" height="20" fill="none" stroke-width="1" stroke="blue" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect id="r93" x="150" width="30" height="30" fill="blue" stroke-width="10" stroke="blue" visibility="hidden" pointer-events="all" onmouseover="show('m4')" onmouseout="hide('m4')"/> + <g font-size="12"> + <text x="200" y="15">all : </text> + <text x="200" y="30" fill="#777">stroke and fill of rects 1 to 4 must trigger</text> + </g> + </g> + <g transform="translate(25, 250)"> + <rect id="m5" x="-10" y="-10" width="200" height="50" fill="red" fill-opacity="0"/> + <rect id="r00" width="30" height="30" fill="black" stroke-width="10" stroke="black" fill-opacity=".3" stroke-opacity=".3" pointer-events="none" onmouseover="show('m5')" onmouseout="hide('m5')"/> + <rect x="50" width="30" height="30" fill="black" fill-opacity="0.1" stroke-width="10" stroke="black" stroke-opacity="0.1"/> + <rect id="r01" x="50" width="30" height="30" fill="none" stroke-width="10" stroke="none" fill-opacity=".3" stroke-opacity=".3" pointer-events="none" onmouseover="show('m5')" onmouseout="hide('m5')"/> + <rect x="100" width="30" height="30" fill="black" fill-opacity="0.1" stroke-width="10" stroke="black" stroke-opacity="0.1"/> + <rect id="r02" x="100" width="30" height="30" fill="black" stroke-width="10" stroke="black" fill-opacity="0" stroke-opacity="0" pointer-events="none" onmouseover="show('m5')" onmouseout="hide('m5')"/> + <rect x="145" y="-5" width="40" height="40" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect x="150" width="30" height="30" fill="none" stroke-width="1" stroke="black" stroke-dasharray="1,1"/> + <rect x="155" y="5" width="20" height="20" fill="none" stroke-width="1" stroke="black" stroke-dasharray="3,3" stroke-opacity=".5"/> + <rect id="r03" x="150" width="30" height="30" fill="black" stroke-width="10" stroke="black" visibility="hidden" pointer-events="none" onmouseover="show('m5')" onmouseout="hide('m5')"/> + <g font-size="12"> + <text x="200" y="15">none : </text> + <text x="200" y="30" fill="#777">nothing is to trigger</text> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/interact-pevents-10-f-manual.svg b/testing/web-platform/tests/svg/import/interact-pevents-10-f-manual.svg new file mode 100644 index 000000000..c05e2b361 --- /dev/null +++ b/testing/web-platform/tests/svg/import/interact-pevents-10-f-manual.svg @@ -0,0 +1,82 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="Microsoft" status="accepted" + version="$Revision: 1.4 $" testname="$RCSfile: interact-pevents-10-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#PointerEvents"> + <p> + An element with 'display' set to 'none' or an element whose parent has 'display' set to 'none' is not a target of pointer events. + </p> + <p> + Stack a 'circle' element with 'display' equal to 'none' on another 'circle' element. + Specify an 'onclick' event handler on the 'circle' with 'display' set to 'none' that will change the 'visibility' of 'FAIL' text to 'visible'. + Verify that the event handler does not fire which clicking on the top 'circle' element. + Repeat with another set of 'circle' elements with the parent of one of the 'circle' elements having its 'display' set to 'none'. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Click on both black circles. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page after clicking the black circles. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: interact-pevents-10-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <circle cx="100" cy="200" r="50" /> + <circle onclick="failTest()" display="none" cx="100" cy="200" r="50" /> + <circle cx="250" cy="200" r="50" pointer-events="none" /> + <g display="none"> + <circle onclick="failTest()" cx="250" cy="200" r="50" /> + </g> + <text id="failText" visibility="hidden" x="100" y="100" font-size="80" fill="red">FAIL</text> + <script type="text/javascript"><![CDATA[ + try + { + function failTest() + { + var testElement = document.getElementById("failText"); + testElement.setAttribute("visibility", "visible"); + } + } + catch(ex) + { + //alert('ERROR: ' + ex.message); + }]]> + </script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg> diff --git a/testing/web-platform/tests/svg/import/interact-pointer-01-t-manual.svg b/testing/web-platform/tests/svg/import/interact-pointer-01-t-manual.svg new file mode 100644 index 000000000..086d12033 --- /dev/null +++ b/testing/web-platform/tests/svg/import/interact-pointer-01-t-manual.svg @@ -0,0 +1,78 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="DAS" author="CM" status="accepted" + version="$Revision: 1.4 $" testname="$RCSfile: interact-pointer-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#PointerEventsProperty"> + <p> + This tests that zero opacity pixels in a mask do not affect + hit testing for the purpose of pointer event targetting. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + After loading the test, a rectangle will be displayed. + Move the pointer over the rectangle, and it will change color + to indicate whether the test was passed. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + If the rectangle turns green once the pointing device is moved over it, + the test was passed. If instead it turns red (or remains black), + then the test failed. If the rectangle was initially red when + the document was loaded, then that also indicates that the test failed. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: interact-pointer-01-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text x='10' y='40' font-size='18'>Test pointer events with zero opacity mask pixels</text> + + <mask id='m' maskUnits='userSpaceOnUse' x='10' y='80' width='50' height='50'/> + <rect id='r' x='10' y='80' width='50' height='50' onmouseover='report(false)'/> + <rect x='10' y='80' width='50' height='50' mask='url(#m)' fill='red' onmouseover='report(true)'/> + + <g id='g'> + <text id='t' x='10' y='150' font-size='13'>Move the pointing device over the rectangle.</text> + <text id='t2' x='10' y='166' font-size='13'>If it is red, you've already failed.</text> + </g> + + <script> + function report(pass) { + document.getElementById('r').setAttribute('fill', pass ? 'green' : 'red'); + document.getElementById('t').firstChild.nodeValue = pass ? "If the rectangle is green, you've passed! Otherwise, you've failed." : "You've failed."; + document.getElementById('g').removeChild(document.getElementById('t2')); + } + </script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/interact-pointer-02-t-manual.svg b/testing/web-platform/tests/svg/import/interact-pointer-02-t-manual.svg new file mode 100644 index 000000000..2e57e378d --- /dev/null +++ b/testing/web-platform/tests/svg/import/interact-pointer-02-t-manual.svg @@ -0,0 +1,77 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="DAS" author="CM" status="accepted" + version="$Revision: 1.4 $" testname="$RCSfile: interact-pointer-02-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#PointerEventsProperty"> + <p> + This tests that clipped-out parts of shapes do not receive pointer events. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + After loading the test, a rectangle will be displayed. + Move the pointer over the rectangle, and it will change color + to indicate whether the test was passed. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + If the rectangle turns green once the pointing device is moved over it, + the test was passed. If instead it turns red (or remains black), + then the test failed. If the rectangle was initially red when + the document was loaded, then that also indicates that the test failed. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: interact-pointer-02-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text x='10' y='40' font-size='17'>Test pointer events with shapes that have clip paths</text> + + <clipPath id='c' clipPathUnits='userSpaceOnUse' x='10' y='80' width='50' height='50'/> + <rect id='r' x='10' y='80' width='50' height='50' onmouseover='report(true)'/> + <rect x='10' y='80' width='50' height='50' clip-path='url(#c)' fill='red' onmouseover='report(false)'/> + + <g id='g'> + <text id='t' x='10' y='150' font-size='13'>Move the pointing device over the rectangle.</text> + <text id='t2' x='10' y='166' font-size='13'>If it is red, you've already failed.</text> + </g> + + <script> + function report(pass) { + document.getElementById('r').setAttribute('fill', pass ? 'green' : 'red'); + document.getElementById('t').firstChild.nodeValue = pass ? "If the rectangle is green, you've passed! Otherwise, you've failed." : "You've failed."; + document.getElementById('g').removeChild(document.getElementById('t2')); + } + </script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/interact-pointer-03-t-manual.svg b/testing/web-platform/tests/svg/import/interact-pointer-03-t-manual.svg new file mode 100644 index 000000000..7e0c062e9 --- /dev/null +++ b/testing/web-platform/tests/svg/import/interact-pointer-03-t-manual.svg @@ -0,0 +1,77 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="DAS" author="CM" status="accepted" + version="$Revision: 1.4 $" testname="$RCSfile: interact-pointer-03-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#PointerEventsProperty"> + <p> + This tests that the "painted" keyword for the pointer-events property + does not cause pointer events to be captured when a shape's fill falls + back to "none" because a referenced paint server was not available. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + After loading the test, a rectangle will be displayed. + Move the pointer over the rectangle, and it will change color + to indicate whether the test was passed. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + If the rectangle turns green once the pointing device is moved over it, + the test was passed. If instead it turns red (or remains black), + then the test failed. If the rectangle was initially red when + the document was loaded, then that also indicates that the test failed. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: interact-pointer-03-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text x='10' y='40' font-size='12'>Test pointer-events="painted" with paint server fallback</text> + + <rect id='r1' x='10' y='80' width='50' height='50' onmouseover='report(true)'/> + <rect id='r2' x='10' y='80' width='50' height='50' clip-path='url(#c)' fill='url(#invalid) none' pointer-events='painted' onmouseover='report(false)'/> + + <g id='g'> + <text id='t' x='10' y='150' font-size='13'>Move the pointing device over the rectangle.</text> + </g> + + <script> + function report(pass) { + var color = pass ? 'green' : 'red'; + document.getElementById('r1').setAttribute('fill', color); + document.getElementById('t').firstChild.nodeValue = pass ? "You've passed!" : "You've failed."; + } + </script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/interact-pointer-04-f-manual.svg b/testing/web-platform/tests/svg/import/interact-pointer-04-f-manual.svg new file mode 100644 index 000000000..7c8ec0e3c --- /dev/null +++ b/testing/web-platform/tests/svg/import/interact-pointer-04-f-manual.svg @@ -0,0 +1,88 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="[reviewer]" author="Microsoft" status="created" version="$Revision: 1.2 $" testname="$RCSfile: interact-pointer-04-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/interact.html#PointerEventsProperty"> + <p> + <!--[[ + A mask effect regardless of opacity does not prevent an element from being the target of a pointer event. + ]]--> + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + <!--[[ + Specify a 'rect' element which references a rectangular 'mask' which completely masks out the element. Specify an 'onmouseover' event handler function on the 'rect' element and verify that the function fires when mouseing over it. Repeat the same thing using a 'mask' element with zero opacity. + ]]--> + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + <!--[[ + Move the mouse over both the blue and grey boxes. + ]]--> + </p> + <p> + <!--[[ + Test passes if both of the boxes turn orange. + ]]--> + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: interact-pointer-04-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <mask id="normalMask"> + <rect x="0" y="0" width="100" height="100" fill="#dddddd" /> + </mask> + <rect x="0" y="0" width="100" height="100" fill="#aabbcc" mask="url(#normalMask)" onmouseover="test(this)" /> + <rect id="passRect" x="200" y="0" width="100" height="100" fill="blue" /> + <mask id="opacityMask" opacity="0"> + <rect x="0" y="0" width="100" height="100" fill="black" /> + </mask> + <rect x="200" y="0" width="100" height="100" fill="#dddddd" mask="url(#opacityMask)" onmouseover="testOpacity()" /> + <script type="text/javascript"><![CDATA[ + try + { + function test(testElement) + { + testElement.setAttribute("fill", "orange"); + } + + function testOpacity() + { + var passRect = document.getElementById("passRect"); + passRect.setAttribute("fill", "orange"); + } + } + catch(ex) + { + alert('ERROR: ' + ex.message); + }]]> + </script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/interact-zoom-01-t-manual.svg b/testing/web-platform/tests/svg/import/interact-zoom-01-t-manual.svg new file mode 100644 index 000000000..e9f615823 --- /dev/null +++ b/testing/web-platform/tests/svg/import/interact-zoom-01-t-manual.svg @@ -0,0 +1,72 @@ +<svg version="1.1" baseProfile="tiny" zoomAndPan="magnify" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="CL" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: interact-zoom-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#EnableZoomAndPanControls"> + <p> + Verify correct handling by Dynamic (interactive) viewers for the + "zoomAndPan" attribute on the 'svg' element. This is the second of three + tests, and tests the default value. + </p> + <p> + The test consists of a set of black circles with a blue stroke. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + After the initial picture is displayed, the user should attempt to use + the magnify controls that are required on conforming Dynamic SVG + viewers. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The correct behaviour is that magnification and panning works + correctly, as required by a conformant viewer. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: interact-zoom-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-size="6"> + <text x="5" y="7" fill="black" font-family="Arial">Test default value of </text> + <text x="5" y="14" fill="black" font-family="Arial">zoomAndPan attribute.</text> + <g fill="black" stroke="blue" stroke-width="1"> + <circle cx="20" cy="32" r="10"/> + <circle cx="30" cy="32" r="10"/> + <circle cx="60" cy="32" r="10"/> + <circle cx="50" cy="32" r="10"/> + <circle cx="40" cy="32" r="10"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/interact-zoom-02-t-manual.svg b/testing/web-platform/tests/svg/import/interact-zoom-02-t-manual.svg new file mode 100644 index 000000000..2c211f552 --- /dev/null +++ b/testing/web-platform/tests/svg/import/interact-zoom-02-t-manual.svg @@ -0,0 +1,72 @@ +<svg version="1.1" baseProfile="tiny" zoomAndPan="magnify" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="CL" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: interact-zoom-02-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#EnableZoomAndPanControls"> + <p> + Verify correct handling by Dynamic (interactive) viewers for the + "zoomAndPan" attribute on the 'svg' element. This is the second of three + tests, and tests the value "magnify". + </p> + <p> + The test consists of a set of black circles with a blue stroke. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + After the initial picture is displayed, the user should attempt to use + the magnify controls that are required on conforming Dynamic SVG + viewers. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The correct behaviour is that magnification and panning works + correctly, as required by a conformant viewer. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: interact-zoom-02-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-size="6"> + <text x="5" y="7" fill="black" font-family="Arial">Test "magnify" value of </text> + <text x="5" y="14" fill="black" font-family="Arial">zoomAndPan attribute.</text> + <g fill="black" stroke="blue" stroke-width="1"> + <circle cx="20" cy="32" r="10"/> + <circle cx="30" cy="32" r="10"/> + <circle cx="60" cy="32" r="10"/> + <circle cx="50" cy="32" r="10"/> + <circle cx="40" cy="32" r="10"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/interact-zoom-03-t-manual.svg b/testing/web-platform/tests/svg/import/interact-zoom-03-t-manual.svg new file mode 100644 index 000000000..6821e1a4e --- /dev/null +++ b/testing/web-platform/tests/svg/import/interact-zoom-03-t-manual.svg @@ -0,0 +1,74 @@ +<svg version="1.1" baseProfile="tiny" zoomAndPan="disable" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="CL" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: interact-zoom-03-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/interact.html#EnableZoomAndPanControls"> + <p> + Verify correct handling by Dynamic (interactive) viewers for the + "zoomAndPan" attribute on the 'svg' element. This is the third of three + tests, and tests the value "disable". + </p> + <p> + The test consists of a set of black circles with a blue stroke. + </p> + + + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + After the initial picture is displayed, the user should attempt to use + the magnify controls that are required on conforming Dynamic SVG + viewers. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The correct behaviour is that the magnify and pan controls + shall have no effect -- the viewer shall disable them. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: interact-zoom-03-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-size="6" transform="scale(6,6)"> + <!-- Title --> + <text x="5" y="7" fill="black" font-family="Arial">Test "disable" value of </text> + <text x="5" y="14" fill="black" font-family="Arial">zoomAndPan attribute.</text> + <g fill="black" stroke="blue" stroke-width="1"> + <circle cx="20" cy="32" r="10"/> + <circle cx="30" cy="32" r="10"/> + <circle cx="60" cy="32" r="10"/> + <circle cx="50" cy="32" r="10"/> + <circle cx="40" cy="32" r="10"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/linking-a-01-b-manual.svg b/testing/web-platform/tests/svg/import/linking-a-01-b-manual.svg new file mode 100644 index 000000000..cf397adac --- /dev/null +++ b/testing/web-platform/tests/svg/import/linking-a-01-b-manual.svg @@ -0,0 +1,80 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Lofton Henderson" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: linking-a-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/linking.html#Links"> + <p> + This is the first of a set of three tests that verify the capability to + handle links into SVG content, using + each of the three fragment identifier forms permissible in SVG. + </p> + <p> + There is a colored arrow comprising the content of an 'a' element. The + link destination is in an auxiliary file, linkingCircle-f.svg, and + is expressed by xlink:href="linkingCircle-f.svg#fragmentValue". + The initial view of this test contains one pale blue arrow plus labelling text. + </p> + <p> + The (blue) arrow uses the "bare name" fragment identifier + form, "#circle-2", to target the circle with id "circle-2" in the external + file. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + The user should activate the link on the center blue arrow. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Upon clicking the first arrow, the full image of the linkingCircle-f.svg + file should replace the initial view of this test case in the viewer frame. + </p> + <p> + The reference image illustrates the correct image after the link is + activated (full view of linkingCircle-f.svg). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: linking-a-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="scale(2)"> + <a xlink:href="../images/linkingCircle-f.svg#circle-2"> + <path fill="aqua" stroke="blue" d="M 185,40 h -100 v -12 l -45 36 l 45 36 v -12 h 100 z"/> + </a> + <!-- Code from target file, linkingCircle-f.svg... + <circle id="circle-2" cx="85" cy="153" r="20" stroke="lime" fill="yellow" stroke-width="4" /> + <text font-family="Arial" font-size="12" x="65" y="189">circle-2</text> + <rect x="49" y="227" width="72" height="72" fill="none" stroke="black" /> + --> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/linking-a-03-b-manual.svg b/testing/web-platform/tests/svg/import/linking-a-03-b-manual.svg new file mode 100644 index 000000000..8e5ef764b --- /dev/null +++ b/testing/web-platform/tests/svg/import/linking-a-03-b-manual.svg @@ -0,0 +1,82 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Lofton Henderson" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: linking-a-03-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/linking.html#Links"> + <p> + This is the third of a set of three tests that verify the capability to + handle links into SVG content, using + each of the three fragment identifier forms permissible in SVG. + </p> + <p> + There is a colored arrow comprising the content of an 'a' element. The + link destination is in an auxiliary file, linkingCircle-f.svg, and + is expressed by "xlink:href=linkingCircle-f.svg#fragmentValue". + The initial view of this test contains one green arrow plus labelling text. + </p> + <p> + The (green) arrow uses the SVG view specification form, + "linkingCircle-f.svg#svgView(viewBox(63,226,74,74))", + to target the circle with id "circle-2" + in the external file. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + The user should activate the link on the center green arrow. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Upon clicking this arrow, circle-2 should fill most of the + viewer frame (white space on each side is 25% of the diameter of the circle). + </p> + <p> + The reference image illustrates the correct image after the link is + activated, with the circle-2's + framing rect filling the viewer frame, uniformly scaled. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: linking-a-03-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="scale(2)"> + <a xlink:href="../images/linkingCircle-f.svg#svgView(viewBox(64,227,72,72))"> + <path fill="lime" stroke="blue" d="M 185,40 h -100 v -12 l -45 36 l 45 36 v -12 h 100 z"/> + </a> + <!-- Code from target file, linkingCircle-f.svg... + <circle id="circle-2" cx="85" cy="153" r="20" stroke="lime" fill="yellow" stroke-width="4" /> + <text font-family="Arial" font-size="12" x="65" y="189">circle-2</text> + <rect x="49" y="227" width="72" height="72" fill="none" stroke="black" /> + --> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/linking-a-04-t-manual.svg b/testing/web-platform/tests/svg/import/linking-a-04-t-manual.svg new file mode 100644 index 000000000..02db16bfc --- /dev/null +++ b/testing/web-platform/tests/svg/import/linking-a-04-t-manual.svg @@ -0,0 +1,113 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Lee Klosterman" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: linking-a-04-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/linking.html#Links"> + <p> + Verify the capability to handle basic links out of SVG content + using the 'a' element, with the xlink:href attributes. + There are three subtests, in each of which one + of three colored arrows comprise the content of an 'a' element. The + link destination is expressed by "xlink:href=". + The initial view of this test contains the three arrows, a colored + circle, labelling text, and the usual template legend and frame. + </p> + + <p> + There are several reference images associated with this test case. The first + illustrates the correct "start" or initial state of the rendered SVG file. + The second illustrates the correct image after the first link is activated + (to the linkingToc.svg file). The third (for browser-environment viewers) + should match the current image of the W3C home page, as viewed with a + conventional browser. (Note. This harness does not yet + provide access to multiple PNGs; the first, initial-state PNG is shown.) + </p> + <p> + The test uses the 'rect' and 'polygon' elements, as well as basic fill (solid simple colors), + stroke (black and colored wide and 1-pixel lines), font-family (Arial) and font-size properties. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + The user should interact with each of the arrows activating each of the links, + using the UA's back mechanism to restart each link test. + </p> + + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The top-most (yellow) arrow links to an external SVG file, which is + local (in the same directory). The target file contains SVG 'text' elements + which comprise a TOC and brief description of all of the test files + for Linking. Upon clicking the first arrow, the image of the linkingToc-t.svg + file should replace the initial view of this test case in the viewer frame. + </p> + <p> + The middle (green) arrow links to an object in this SVG test file, the yellow + circle (id="internal-circle") immediately to its right, using "#circle-object" + as the value of of the xlink:href attribute. + There should be no change to the viewer frame upon clicking this arrow. + </p> + <p> + The bottom-most (blue) arrow links to remote non-SVG content, the W3C home page + using xlink:href attribute value "http://www.w3.org". For viewers in a Web + browser environment, the W3C home page should replace the initial view + of this test case in the browser/viewer frame. For other viewers (e.g., + interactive but SVG-only standalone viewers), the result is undefined, but could + include such actions as a diagnostic "Error parsing..." message. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: linking-a-04-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x="90" y="16" font-size="12">Basic out-bound links and the 'a' element.</text> + <!-- First linking test: link to another SVG file in same location. --> + <a xlink:href="../images/linkingToc-t.svg"> + <path fill="yellow" stroke="blue" d="M 165,40 h 100 v -12 l 45 36 l -45 36 v -12 h -100 z"/> + </a> + <!-- Second linking test: link to another object in this file. --> + <g transform="translate(0,90)"> + <a xlink:href="#internal-circle"> + <path fill="lime" stroke="blue" d="M 165,40 h 100 v -12 l 45 36 l -45 36 v -12 h -100 z"/> + </a> + </g> + <!-- Third linking test: links to external, remote, non-SVG content (for --> + <!-- plugin viewers in browser environments.) --> + <g transform="translate(0,180)"> + <a xlink:href="http://www.w3.org"> + <path fill="aqua" stroke="blue" d="M 165,40 h 100 v -12 l 45 36 l -45 36 v -12 h -100 z"/> + </a> + </g> + <!-- Link target of second test --> + <circle id="internal-circle" cx="390" cy="153" r="20" stroke="lime" fill="yellow" stroke-width="4"/> + <text x="350" y="189" font-size="10">id="internal-circle"</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/linking-a-05-t-manual.svg b/testing/web-platform/tests/svg/import/linking-a-05-t-manual.svg new file mode 100644 index 000000000..7a6360e06 --- /dev/null +++ b/testing/web-platform/tests/svg/import/linking-a-05-t-manual.svg @@ -0,0 +1,102 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="MI" author="CN" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: linking-a-05-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/linking.html#Links"> + <p> + Verify if the 'a' element properly accept the transform + attibute. There are three subtests, in each of which one + of three sets of colored arrows comprise the content of + an 'a' element. The link destination is expressed by + "xlink:href=" as in the test 'linking-a-04-t.svg'. + The arrows transformed is in the brighter color, and the + arrows before transformation is shown in the darker color. + The transformation parameters used for each 'a' element is + shown on the left side of each arrow. + </p> + <p> + The top-most arrow (yellow) is rotated for 20 degree. + The middle arrow (green) is skewed horizontally for + -30 degree, and the last arrow (cyan) is translated + for (-10, -20). + </p> + + <p> + The test uses the 'rect' and 'polygon' elements, as well as basic fill (solid simple colors and RGB values), + stroke (black and colored wide and 1-pixel lines), font-family (Arial) and font-size properties. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + The user should interact with each of the arrows activating each of the links, + using the UA's back mechanism to restart each link test. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Each arrow, i.e. link, should behave as described + in 'linking-a-04-t.svg'. The arrows in this test + have the same 'xlink:href' attribute as the 'linking-a-04-t' + test. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: linking-a-05-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x="90" y="16" font-size="12">Verify transform attributes in the 'a' element.</text> + <!-- First linking test: link to another SVG file in same location. --> + <path fill="rgb(128,128,0)" stroke="rgb(0,0,128)" d="M 165,40 h 100 v -12 l 45 36 l -45 36 v -12 h -100 z"/> + <a xlink:href="../images/linkingToc-t.svg" transform="rotate(20,225,65)"> + <path fill="yellow" stroke="blue" d="M 165,40 h 100 v -12 l 45 36 l -45 36 v -12 h -100 z"/> + </a> + <text x="10" y="45" font-size="10">transform="rotate(20,225,65)</text> + <!-- Second linking test: link to another object in this file. --> + <g transform="translate(0,90)"> + <path fill="rgb(0,128,0)" stroke="rgb(0,0,128)" d="M 165,40 h 100 v -12 l 45 36 l -45 36 v -12 h -100 z"/> + <a xlink:href="#internal-circle" transform="skewX(-30)"> + <path fill="lime" stroke="blue" d="M 165,40 h 100 v -12 l 45 36 l -45 36 v -12 h -100 z"/> + </a> + <text x="10" y="45" font-size="10">transform="skewX(-30)</text> + </g> + <!-- Third linking test: links to external, remote, non-SVG content (for --> + <!-- plugin viewers in browser environments.) --> + <g transform="translate(0,180)"> + <path fill="rgb(0,128,128)" stroke="rgb(0,0,128)" d="M 165,40 h 100 v -12 l 45 36 l -45 36 v -12 h -100 z"/> + <a xlink:href="http://www.w3.org" transform="translate(-10,-20)"> + <path fill="aqua" stroke="blue" d="M 165,40 h 100 v -12 l 45 36 l -45 36 v -12 h -100 z"/> + </a> + <text x="10" y="45" font-size="10">transform="translate(-10,-20)</text> + </g> + <!-- Link target of second test --> + <circle id="internal-circle" cx="390" cy="153" r="20" stroke="lime" fill="yellow" stroke-width="4"/> + <text x="350" y="189" font-size="10">id="internal-circle"</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/linking-a-07-t-manual.svg b/testing/web-platform/tests/svg/import/linking-a-07-t-manual.svg new file mode 100644 index 000000000..7ea4441c7 --- /dev/null +++ b/testing/web-platform/tests/svg/import/linking-a-07-t-manual.svg @@ -0,0 +1,110 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="BB" author="CL" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: linking-a-07-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/linking.html#Links"> + <p> + Verify that the target attribute on the 'a' element takes precedence over the xlink:show attribute. + There are three subtests, in each of which two similarly + colored arrows comprise the content of an 'a' element. The arrow on the left, outlined + in blue, has no "target" attribute; the arrow on the right, outlined in red, has a + "target" attribute. The + link destination is expressed by "xlink:href=". + The initial view of this test contains the six arrows, labelling text, and the usual template legend and frame. + </p> + <p> + The top-most (yellow) arrows link to an external SVG file, which is + local (in the same directory). The target file contains SVG 'text' elements + which comprise a TOC and brief description of all of the test files + for Linking. + </p> + <p> + The middle (green) arrows links to the same external SVG file, but with xlink:show="new". + </p> + <p> + The bottom-most (blue) arrows links to the same external SVG file, but with xlink:show="replace". + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Click each of the arrows once. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if: + </p> + <ul> + <li>Upon clicking the left-most yellow arrow, the image of the linkingToc-t.svg + file replaces the initial view of this test case in the viewer frame. On clicking the right-most yellow arrow, + the image of the linkingToc-t.svg appears in a new frame.</li> + <li>Upon clicking any of the green arrows the image of the linkingToc-t.svg appears in a new frame.</li> + <li>Upon clicking the left-most blue arrow, the image of the linkingToc-t.svg file replaces the initial + view of this test case in the viewer frame. + On clicking the right blue arrow produces the image of the linkingToc-t.svg in a new frame.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: linking-a-07-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x="90" y="16" font-size="12">xlink 'show' attribute on 'a' element.</text> + <g transform="translate(-120)"> + <a xlink:href="../images/linkingToc-t.svg"> + <path fill="yellow" stroke="blue" d="M 165,40 h 100 v -12 l 45 36 l -45 36 v -12 h -100 z"/> + </a> + <g transform="translate(0,90)"> + <a xlink:href="../images/linkingToc-t.svg" xlink:show="new"> + <path fill="lime" stroke="blue" d="M 165,40 h 100 v -12 l 45 36 l -45 36 v -12 h -100 z"/> + </a> + </g> + <g transform="translate(0,180)"> + <a xlink:href="../images/linkingToc-t.svg" xlink:show="replace"> + <path fill="aqua" stroke="blue" d="M 165,40 h 100 v -12 l 45 36 l -45 36 v -12 h -100 z"/> + </a> + </g> + </g> + <g transform="translate(120)"> + <a xlink:href="../images/linkingToc-t.svg" target="foo"> + <path fill="yellow" stroke="red" d="M 165,40 h 100 v -12 l 45 36 l -45 36 v -12 h -100 z"/> + </a> + <g transform="translate(0,90)"> + <a xlink:href="../images/linkingToc-t.svg" xlink:show="new" target="foo"> + <path fill="lime" stroke="red" d="M 165,40 h 100 v -12 l 45 36 l -45 36 v -12 h -100 z"/> + </a> + </g> + <g transform="translate(0,180)"> + <a xlink:href="../images/linkingToc-t.svg" xlink:show="replace" target="foo"> + <path fill="aqua" stroke="red" d="M 165,40 h 100 v -12 l 45 36 l -45 36 v -12 h -100 z"/> + </a> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/linking-a-08-t-manual.svg b/testing/web-platform/tests/svg/import/linking-a-08-t-manual.svg new file mode 100644 index 000000000..c0c2ccdf8 --- /dev/null +++ b/testing/web-platform/tests/svg/import/linking-a-08-t-manual.svg @@ -0,0 +1,61 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CL" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: linking-a-08-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/linking.html#Links"> + <p> + This is a simple test for links on text elements. The upper subtest has an 'a' element + inside a 'text' element; the lower subtest has the 'a' outside the 'text'. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Click each of the links once. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Both lines of text must be working links, and must take you to <a href="../../images/linkingToc-t.svg">the linking TOC svg</a> in the same frame. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: linking-a-08-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-size="20"> + <text x="240" y="150" text-anchor="middle"> + <a xlink:href="../images/linkingToc-t.svg">Link inside text</a> + </text> + <a xlink:href="../images/linkingToc-t.svg"> + <text x="240" y="230" text-anchor="middle">Link around text</text> + </a> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/linking-a-09-b-manual.svg b/testing/web-platform/tests/svg/import/linking-a-09-b-manual.svg new file mode 100644 index 000000000..1099cd75a --- /dev/null +++ b/testing/web-platform/tests/svg/import/linking-a-09-b-manual.svg @@ -0,0 +1,71 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CL" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: linking-a-09-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/linking.html#Links"> + <p> + This is a simple test for links on tspan elements. The upper subtest has an 'a' element + inside a 'tspan' element; the lower subtest has the 'a' outside the tspan. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Click each of the links once. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Both lines of text must be working links, and must take you to <a href="../../images/linkingToc-t.svg">the linking TOC svg</a> in the same frame. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: linking-a-09-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-size="20"> + <text x="240" y="150" text-anchor="middle"> + A <tspan color="green"> + <a xlink:href="../images/linkingToc-t.svg"> + link + inside tspan + </a> for testing + </tspan> + </text> + <text x="240" y="230" text-anchor="middle"> + A <a xlink:href="../images/linkingToc-t.svg"> + <tspan color="green"> + link + around tspan + </tspan> + </a> for testing + </text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/linking-a-10-f-manual.svg b/testing/web-platform/tests/svg/import/linking-a-10-f-manual.svg new file mode 100644 index 000000000..5138de88b --- /dev/null +++ b/testing/web-platform/tests/svg/import/linking-a-10-f-manual.svg @@ -0,0 +1,83 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" version="$Revision: 1.4 $" testname="$RCSfile: linking-a-10-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/linking.html#AElement"> + <p> + Test that the 'a' element supports various types of graphics and container elements as content. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there are fourteen blue shapes on the page, in the sizes and positions + shown in the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: linking-a-10-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <a> + <rect x="360" width="100" height="100" fill="blue" /> + <ellipse cx="120" cy="290" rx="25" ry="50" fill="blue" /> + <line x1="380" y1="250" x2="320" y2="340" stroke-width="5" stroke="blue" /> + <polygon fill="blue" points="0,0 0,100 100,100 100,0" /> + <path d="M 280 250 L 250 350 L 310 330 z" fill="blue" /> + <text x="10" y="320" font-size="100" fill="blue">X</text> + <image xlink:href="../images/blue_10x10.png" x="360" y="120" width="100" height="100" /> + <g> + <rect x="240" y="120" width="100" height="100" fill="blue" /> + </g> + <svg> + <rect y="120" width="100" height="100" fill="blue" /> + </svg> + <defs> + <rect width="100" height="100" fill="blue" id="testRect" /> + <linearGradient id="testGradient"> + <stop offset="1" stop-color="blue" /> + </linearGradient> + <symbol id="testSymbol"> + <circle cx="40" cy="40" r="40" fill="blue" /> + </symbol> + <marker id="testMarker"> + <rect width="100" height="100" fill="blue" /> + </marker> + <pattern id="testPattern" width="100" height="100" patternUnits="userSpaceOnUse" viewBox="0 0 100 100"> + <rect width="100" height="100" fill="blue" /> + </pattern> + </defs> + <use xlink:href="#testRect" x="120" /> + <rect fill="url(#testGradient)" x="120" y="120" width="100" height="100" /> + <use x="390" y="250" xlink:href="#testSymbol" /> + <line x1="150" y1="260" x2="165" y2="260" stroke-width="25" marker-end="url(#testMarker)" /> + <rect fill="url(#testPattern)" x="240" width="100" height="100" /> + </a> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg>
\ No newline at end of file diff --git a/testing/web-platform/tests/svg/import/linking-frag-01-f-manual.svg b/testing/web-platform/tests/svg/import/linking-frag-01-f-manual.svg new file mode 100644 index 000000000..f69c50208 --- /dev/null +++ b/testing/web-platform/tests/svg/import/linking-frag-01-f-manual.svg @@ -0,0 +1,66 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="" author="CL" status="created" + version="$Revision: 1.2 $" testname="$RCSfile: linking-frag-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/linking.html#Links"> + + <p> + Tests svgView(viewBox();transform()) syntax, with and without escaped semicolons. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. Click on the green arrow. If that results in circle-2 being displayed, go back to this test and click on the blue arrow. If that shows a quarter of circle-2, go back to this test and click on the purple arrow. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if you clicked on three arrows, and clicking the purple arrow results in a quarter of circle-2 being displayed. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: linking-frag-01-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <a xlink:href="../images/linkingCircle-f.svg#svgView(viewBox(64,227,72,72))"> + <path fill="lime" stroke="blue" d="M 185,40 h -100 v -12 l -45 36 l 45 36 v -12 h 100 z"/> + </a> + <g transform="translate(0,100)"> + <a xlink:href="../images/linkingCircle-f.svg#svgView(viewBox(64,227,72,72);transform(translate(36,36)))"> + <path fill="blue" stroke="blue" d="M 185,40 h -100 v -12 l -45 36 l 45 36 v -12 h 100 z"/> + </a> + </g> + <g transform="translate(0,200)"> + <a xlink:href="../images/linkingCircle-f.svg#svgView(viewBox(64,227,72,72)%3Btransform(translate(36,36)))"> + <path fill="purple" stroke="lime" d="M 185,40 h -100 v -12 l -45 36 l 45 36 v -12 h 100 z"/> + </a> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/linking-uri-01-b-manual.svg b/testing/web-platform/tests/svg/import/linking-uri-01-b-manual.svg new file mode 100644 index 000000000..eebc9f628 --- /dev/null +++ b/testing/web-platform/tests/svg/import/linking-uri-01-b-manual.svg @@ -0,0 +1,149 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Lee Klosterman" status="accepted" + version="$Revision: 1.12 $" testname="$RCSfile: linking-uri-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/linking.html#LinksIntoSVG"> + <p> + Verify the capability to handle links to 'view' elements, and the + permissible attributes on those elements. All of the links in this + test case are <em>internal</em>, i.e., to 'view' elements in the same SVG file. + </p> + <p> + This test is identical to linking-uri-02-b except that the links there are external. + </p> + <p> + In the four quadrants of the initial picture are four graphical objects. + Clockwise from upper right, they are + a purple rectangle, blue ellipse, green polygon (pentagon), and yellow + circle. Each is labelled and tightly boxes with a rectangular frame. + These are identical to their counterparts in linking-uri-01-b.svg, in which + file each has an associated 'view' element, with attributes + per the labels in the initial picture. + </p> + <p> + In the center is a gray box with four lines of text, each of which says + "Go to" followed by Rectangle, Ellipse, Polygon, and Circle, respectively. + Each of these is contained within an 'a' element, whose xlink:href names + the respective 'view' element of the respective graphical object. + </p> + <p> + There are several reference images associated with this test case. The first + illustrates the correct initial state of the rendered SVG file, which should + also be the correct picture after the Rectangle link is executed. + The second, third, and fourth illustrate the correct images as described + above after respectively the Ellipse, Polygon, and Circle links are activated. + (Note. This harness does not yet provide access to multiple PNGs; the PNG for the + initial view is shown.) + </p> + <p> + The test uses the 'rect', 'circle', 'ellipse', and 'polygon' elements, + as well as basic fill (solid simple colors), + stroke (black and colored 1-pixel lines), font-family (Arial) and font-size properties. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + In turn, activate each of the "Rectangle", "Ellipse", "Polygon" and "Circle" links + in the gray box in the middle of the document, navigating back (for example with + the Back button if in a browser) after activating each one. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if all of the sub-tests have the correct behavior: + </p> + <ul> + <li>After activating the "Rectangle" link, the whole of the linking-uri-01-b.svg + document must be displayed; that is, there will be no visual change. (The + 'view' element has no attributes (other than id), so the correct view in + the frame is of the parent 'svg' element, which is the whole picture.)</li> + <li>After navigating back and activating the "Ellipse" link, the view must change so that it is + zoomed (uniformly scaled) and centered on the ellipse. The black rectangle + surrounding the ellipse must be just within the frame.</li> + <li>After navigating back and activating the "Circle" link, the view must change so that it is + zoomed and centered on the yellow circle. The view is scaled non-uniformly, however, + so that the circle is stretched horizontally ito an ellipse. The black rectangle + surrounding it must be just within the frame.</li> + <li>After navigating back and activating the "Polygon" link, the view must not change.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: linking-uri-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x="65" y="16" font-size="12">Link test of the 'view' element and its attributes, 1 of 2, internal.</text> + <g font-size="14"> + <g transform="translate(-150,75)"> + <rect x="300" y="55" width="125" height="85" fill="#aaa"/> + <a xlink:href="#rect-view"> + <text x="310" y="70" fill="purple">Go to Rectangle</text> + </a> + <a xlink:href="#ellipse-view"> + <text x="310" y="90" fill="blue">Go to Ellipse</text> + </a> + <a xlink:href="#circle-view"> + <text x="310" y="110" fill="yellow">Go to Circle</text> + </a> + <a xlink:href="#polygon-view"> + <text x="310" y="130" fill="green">Go to Polygon</text> + </a> + <text x="315" y="152" font-size="12">Click element's line</text> + <text x="315" y="164" font-size="12">to link to its view</text> + </g> + + <!-- View with no attributes. Picture should not change. --> + <view id="rect-view"/> + <rect id="rect-object" fill="purple" x="295" y="36" width="135" height="68"/> + <text id="rect-label" x="362.5" y="116" text-anchor="middle">Rectangle</text> + <rect x="292" y="29" width="141" height="91" fill="none" stroke="black"/> + <text x="362.5" y="132" font-size="10" text-anchor="middle">No view attributes except id.</text> + <!-- Test viewBox. Should blow-up the ellipse in the frame. --> + <view id="ellipse-view" viewBox="295 216 150 82"/> + <ellipse id="ellipse-object" fill="blue" cx="370" cy="251" rx="72" ry="32"/> + <text id="ellipse-label" x="370" y="295" text-anchor="middle">Ellipse</text> + <rect x="295" y="216" width="150" height="82" fill="none" stroke="black"/> + <text x="315" y="212" font-size="10">viewBox, should fill frame.</text> + <!-- Test preserveAspectRatio. --> + <view id="circle-view" viewBox="36 29 98 91" preserveAspectRatio="none"/> + <circle id="circle-object" fill="yellow" cx="85" cy="68" r="36"/> + <text id="circle-label" x="85" y="116" text-anchor="middle">Circle</text> + <rect x="36" y="29" width="98" height="91" fill="none" stroke="black"/> + <text x="85" y="130" font-size="10" text-anchor="middle">viewBox & non-uniform</text> + <text x="85" y="139" font-size="10" text-anchor="middle">preserveAspectRatio</text> + <!-- Test viewTarget attribute, no change to the viewport. --> + <view id="polygon-view" viewTarget="polygon-object"/> + <polygon id="polygon-object" fill="green" points="87,211 134,238 116,283 57,283 39,238 87,211"/> + <text id="polygon-label" x="85" y="295" text-anchor="middle">Polygon</text> + <rect x="36" y="208" width="100" height="89" fill="none" stroke="black"/> + <text x="85" y="195" font-size="10" text-anchor="middle">viewTarget, no</text> + <text x="85" y="204" font-size="10" text-anchor="middle">changes to viewport</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.12 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/linking-uri-02-b-manual.svg b/testing/web-platform/tests/svg/import/linking-uri-02-b-manual.svg new file mode 100644 index 000000000..69d8a4719 --- /dev/null +++ b/testing/web-platform/tests/svg/import/linking-uri-02-b-manual.svg @@ -0,0 +1,156 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Lee Klosterman" status="accepted" + version="$Revision: 1.10 $" testname="$RCSfile: linking-uri-02-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/linking.html#LinksIntoSVG"> + <p> + Verify the capability to handle links to 'view' elements, and the + permissible attributes on those elements. All of the links in this + test case are <em>external</em>, i.e., to 'view' elements in another SVG file. + That file is linking-uri-01-b.svg. + </p> + <p> + This test is identical to linking-uri-01-b except that the links here are external. + </p> + <p> + In the four quadrants of the initial picture are four graphical objects. + Clockwise from upper right, they are + a purple rectangle, blue ellipse, green polygon (pentagon), and yellow + circle. Each is labelled and tightly boxes with a rectangular frame. + These are identical to their counterparts in linking-uri-01-b.svg, in which + file each has an associated 'view' element, with attributes + per the labels in the initial picture. + </p> + <p> + In the center is a gray box with four lines of text, each of which says + "Go to" followed by Rectangle, Ellipse, Polygon, and Circle, respectively. + Each of these is contained within an 'a' element, whose xlink:href names + the respective 'view' element of the respective graphical object. + </p> + <p> + There are several reference images associated with this test case. The first + illustrates the correct initial state of the rendered SVG file, which should + also be the correct picture after the Rectangle link is executed. + The second, third, and fourth illustrate the correct images as described + above after respectively the Ellipse, Polygon, and Circle links are activated. + (Note. This harness does not yet provide access to multiple PNGs; the PNG for the + initial view is shown.) + </p> + <p> + The test uses the 'rect', 'circle', 'ellipse', and 'polygon' elements, + as well as basic fill (solid simple colors), + stroke (black and colored 1-pixel lines), font-family (Arial) and font-size properties. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + In turn, activate each of the "Rectangle", "Ellipse", "Polygon" and "Circle" links + in the gray box in the middle of the document, navigating back (for example with + the Back button if in a browser) after activating each one. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if all of the sub-tests have the correct behavior: + </p> + <ul> + <li>After activating the "Rectangle" link, the whole of linking-uri-01-b.svg + must be displayed, which is visually similar to this document, linking-uri-02-b.svg. + (The 'view' element has no attributes (other than id), so the correct view in + the frame is of the parent 'svg' element, which is the whole picture.)</li> + <li>After navigating back and activating the "Ellipse" link, the view must change so that it is + zoomed (uniformly scaled) and centered on the ellipse in linking-uri-01-b.svg. + The black rectangle surrounding the ellipse must be just within the frame.</li> + <li>After navigating back and activating the "Circle" link, the view must change so that it is + zoomed and centered on the yellow circle in linking-uri-01-b.svg. The view is scaled non-uniformly, however, + so that the circle is stretched horizontally ito an ellipse. The black rectangle + surrounding it must be just within the frame.</li> + <li>After navigating back and activating the "Polygon" link, the whole of + linking-uri-01-b.svg must be displayed.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: linking-uri-02-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x="50" y="16" font-size="12">Link test of the 'view' element and its attributes, 2 of 2, external.</text> + <g font-size="14"> + <g transform="translate(-150,75)"> + <rect x="300" y="55" width="125" height="85" fill="#aaa"/> + <a xlink:href="../images/linking-uri-01-b.svg#rect-view"> + <text x="310" y="70" fill="purple">Go to Rectangle</text> + </a> + <a xlink:href="../images/linking-uri-01-b.svg#ellipse-view"> + <text x="310" y="90" fill="blue">Go to Ellipse</text> + </a> + <a xlink:href="../images/linking-uri-01-b.svg#circle-view"> + <text x="310" y="110" fill="yellow">Go to Circle</text> + </a> + <a xlink:href="../images/linking-uri-01-b.svg#polygon-view"> + <text x="310" y="130" fill="green">Go to Polygon</text> + </a> + <text x="310" y="150" font-size="12">Click element's line</text> + <text x="310" y="162" font-size="12">to link to its view in</text> + <text x="310" y="174" font-size="12">linking-uri-01-b.</text> + </g> + + <!-- In linking-uri-01-b, there is the following 'view' element. --> + <!-- View with no attributes. Picture should not change. --> + <!-- <view id="rect-view" /> --> + <rect id="rect-object" fill="purple" x="295" y="36" width="135" height="68"/> + <text id="rect-label" x="362.5" y="116" text-anchor="middle">Rectangle</text> + <rect x="292" y="29" width="141" height="91" fill="none" stroke="black"/> + <text x="362.5" y="132" font-size="10" text-anchor="middle">No view attributes except id.</text> + <!-- In linking-uri-01-b, there is the following 'view' element. --> + <!-- Test viewBox. Should blow-up the ellipse in the frame. --> + <!-- <view id="ellipse-view" viewBox="295 216 150 82"/> --> + <ellipse id="ellipse-object" fill="blue" cx="370" cy="251" rx="72" ry="32"/> + <text id="ellipse-label" x="370" y="295" text-anchor="middle">Ellipse</text> + <rect x="295" y="216" width="150" height="82" fill="none" stroke="black"/> + <text x="370" y="212" font-size="10" text-anchor="middle">viewBox, should fill frame.</text> + <!-- In linking-uri-01-b, there is the following 'view' element. --> + <!-- Test preserveAspectRatio. --> + <!-- <view id="circle-view" viewBox="20 29 128 91.5" preserveAspectRatio="none"/> --> + <circle id="circle-object" fill="yellow" cx="85" cy="68" r="36"/> + <text id="circle-label" x="85" y="116" text-anchor="middle">Circle</text> + <rect x="36" y="29" width="98" height="91" fill="none" stroke="black"/> + <text x="85" y="130" font-size="10" text-anchor="middle">viewBox & non-uniform</text> + <text x="85" y="139" font-size="10" text-anchor="middle">preserveAspectRatio</text> + <!-- In linking-uri-01-b, there is the following 'view' element. --> + <!-- Test viewTarget attribute, no change to the viewport. --> + <!-- <view id="polygon-view" viewTarget="polygon-object" /> --> + <polygon id="polygon-object" fill="green" points="87,211 134,238 116,283 57,283 39,238 87,211"/> + <text id="polygon-label" x="85" y="295" text-anchor="middle">Polygon</text> + <rect x="36" y="208" width="100" height="89" fill="none" stroke="black"/> + <text x="85" y="195" font-size="10" text-anchor="middle">viewTarget, no</text> + <text x="85" y="204" font-size="10" text-anchor="middle">changes to viewport</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.10 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/linking-uri-03-t-manual.svg b/testing/web-platform/tests/svg/import/linking-uri-03-t-manual.svg new file mode 100644 index 000000000..52c766e02 --- /dev/null +++ b/testing/web-platform/tests/svg/import/linking-uri-03-t-manual.svg @@ -0,0 +1,92 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Lee Klosterman" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: linking-uri-03-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/linking.html#LinksIntoSVG"> + <p> + Verify the handling of the allowable xlink attributes on the 'a' element. + The initial view of this test contains a single green triangle, labelling text, + and the usual template legend and frame. + </p> + <p> + The purpose of the test is to + verify that viewers tolerate the presence of xlink attributes on the 'a' + element. The presence of the attributes should not change the behavior of + the test in any way. + </p> + <p> + There are two reference images associated with this test case. The first + illustrates the correct "start" or initial state of the rendered SVG file. + The second illustrates the correct image after the link is activated + (to the linkingToc-t.svg file). (Note. This harness does not yet + provide access to multiple PNGs; the first, initial-state PNG is shown.) + </p> + <p> + The test uses the 'rect' element, as well as basic fill (solid simple colors), + stroke (black and colored wide and 1-pixel lines), font-family (Arial) and font-size properties. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Click on the center green triangle.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + There is a link on the triangle, pointing to an external SVG file, which is + local (in the same directory). The target file contains SVG 'text' elements + which comprise a TOC and brief description of all of the BE test files + for Linking. Upon clicking the triangle, the image of the linkingToc-t.svg + file should replace the initial view of this test case in the viewer frame. + </p> + <p> + The results of executing the link should be identical + to executing the first (topmost) link of linking-a-04-t. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: linking-uri-03-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x="75" y="16" font-size="12">Simple exercise of xlink attributes on the 'a' element.</text> + <a xlink:type="simple" xlink:show="replace" xlink:actuate="onRequest" xlink:href="../images/linkingToc-t.svg" xlink:role="figure-out-a-role-value-and-associated-xmlns" xlink:title="TOC of Linking BE tests." target="_self"> + <path d="M 135 122 l 130 0 l -65 130 z" fill="lime" stroke="blue"/> + </a> + <text x="160" y="116" font-size="12">Click for TOC</text> + <text x="25" y="172" font-size="12">Link to local file</text> + <text x="25" y="182" font-size="12">linkingToc-t.svg.</text> + <rect x="19" y="160" width="100" height="26" fill="none" stroke="black"/> + <text x="275" y="144" font-size="10">xlink:type="simple"</text> + <text x="275" y="155" font-size="10">xlink:show="replace"</text> + <text x="275" y="166" font-size="10">xlink:actuate="onRequest"</text> + <text x="275" y="177" font-size="10">xlink:href="linkingToc-t.svg"</text> + <text x="275" y="188" font-size="10">xlink:role="figure-out-a-role"</text> + <text x="275" y="199" font-size="10">xlink:title="TOC of Linking BE tests."</text> + <text x="275" y="210" font-size="10">target="_self"</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/masking-filter-01-f-manual.svg b/testing/web-platform/tests/svg/import/masking-filter-01-f-manual.svg new file mode 100644 index 000000000..777c6c693 --- /dev/null +++ b/testing/web-platform/tests/svg/import/masking-filter-01-f-manual.svg @@ -0,0 +1,81 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AG" author="CM" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: masking-filter-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/masking.html#Introduction"> + <p> + This tests that the 'filter' property does not apply to 'mask'. + </p> + <p> + The mask 'm' covers a rectangular area (200 x 200) except for a window + (100 x 100) in the top left hand corner. Initially the mask window is + set on top of the green square. Hence, the green square is shown and + the red square is covered. If filters are supported the window within + the mask will be shifted by an offset of 100,100 placing it on top of + the red square. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test passes if a green square is shown. If any + red shows, the test has failed. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: masking-filter-01-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g shape-rendering="geometricPrecision"> + <text font-size="18" x="10" y="35">Testing 'filter' applied to 'mask'</text> + + <defs> + <filter id="f" x="0" y="0" width="200" height="200" + filterUnits="userSpaceOnUse" filterPrimitiveUnits="userSpaceOnUse"> + <feOffset dx="100" dy="100"/> + </filter> + <mask id="m" x="0" y="0" width="200" height="200" + maskUnits="userSpaceOnUse" maskContentUnits="userSpaceOnUse" + filter="url(#f)"> + <rect width="100" height="100" fill="white"/> + </mask> + </defs> + + <g mask="url(#m)" transform="translate(10,50)"> + <rect width="100" height="100" fill="green"/> + <rect x="101" y="101" width="99" height="99" fill="red"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/masking-intro-01-f-manual.svg b/testing/web-platform/tests/svg/import/masking-intro-01-f-manual.svg new file mode 100644 index 000000000..4a0357bd7 --- /dev/null +++ b/testing/web-platform/tests/svg/import/masking-intro-01-f-manual.svg @@ -0,0 +1,81 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="BB" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: masking-intro-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/masking.html#Introduction"> + <p> + The rules are different regarding the geometry of a shape when clipping and masking. + For example, a clip-path does not take into account the stroke of the shape used for clipping. + It is however, used when masking. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there are two identical darkblue circles at the top of the illustration, and + below those two circles, two more circles should appear. They are of lighter appearance, + the one on the left has a darker and thick stroke. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: masking-intro-01-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g shape-rendering="geometricPrecision"> + <title id="test-title">masking-mask-04-f.svg</title> + <desc id="test-desc">Tests the impact of strokes within clipPath and mask</desc> + <text font-size="18" x="240" y="35" text-anchor="middle">Testing stroke inclusion for 'clip-path' and 'mask'</text> + + <defs> + <clipPath id="one" clipPathUnits="objectBoundingBox"> + <circle cx="0.3" cy="0.5" r="0.2" stroke-width="0.15" fill="none" stroke="red"/> + <circle cx="0.7" cy="0.5" r="0.2" stroke-width="0.15" fill="none" stroke="none"/> + </clipPath> + </defs> + + <rect x="150" y="0" width="200" height="200" fill="darkblue" clip-path="url(#one)"/> + <text x="50" y="110">With a 'clip-path':</text> + + <defs> + <mask id="two" maskUnits="objectBoundingBox" maskContentUnits="objectBoundingBox" color-interpolation="linearRGB"> + <circle cx="0.3" cy="0.5" r="0.2" stroke-width="0.15" fill="blue" stroke="red"/> + <circle cx="0.7" cy="0.5" r="0.2" stroke-width="0.15" fill="blue" stroke="none"/> + </mask> + </defs> + + <rect x="150" y="150" width="200" height="200" fill="darkblue" mask="url(#two)"/> + <text x="50" y="260">With a 'mask':</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/masking-mask-01-b-manual.svg b/testing/web-platform/tests/svg/import/masking-mask-01-b-manual.svg new file mode 100644 index 000000000..5928d57ea --- /dev/null +++ b/testing/web-platform/tests/svg/import/masking-mask-01-b-manual.svg @@ -0,0 +1,131 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Haroon Sheikh" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: masking-mask-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/masking.html#Masking"> + <p> + Test to see if the masking features using the mask element and mask + property are available. + </p> + <p> + A red rectangle is displayed in the background to help view the result + of transparency and masking. + </p> + <p> + From top to bottom, the tests are as follows. + </p> + <p> + In the top test, a linear gradient is used inside the mask to change the opacity + of the rectangle from 1.0 (at the top) to 0.5 (at the bottom). + </p> + <p> + In the second test, a simple 50% opaque rectangle is used as a mask. + </p> + <p> + In the third test, no mask is used, but a rectangle is shown with 50% opacity. + The second and third test should look the same. + </p> + <p> + Lastly, a string of text has a mask applied to it. The mask only covers a partial + area of the text, so the text should only be half visible. Also the mask consists + of 4 rectangles with various levels of opacity. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image, except + variations are possible in the labelling text (per CSS2 rules). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: masking-mask-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <style type="text/css"> + @font-face { + font-family: larabie-anglepoise; + src: url(woffs/anglepoi.woff) format("woff"); + } + </style> + <defs> + <font horiz-adv-x="313"> + <!-- Converted from Larabie Anglepoise by Batik ttf2svg --> + <font-face font-family="larabie-anglepoise" units-per-em="1000" panose-1="0 0 4 0 0 0 0 0 0 0" ascent="703" descent="-300" alphabetic="0"/> + <missing-glyph horiz-adv-x="500" d="M63 0V700H438V0H63ZM125 63H375V638H125V63Z"/> + <glyph unicode="S" glyph-name="S" horiz-adv-x="385" d="M371 1H29V144H264Q264 151 264 166Q265 180 265 188Q265 212 249 212H132Q83 212 55 247Q29 279 29 329V566H335V422H136V375Q136 360 144 356Q148 355 168 355H279Q327 355 352 309Q371 273 371 221V1Z"/> + <glyph unicode="V" glyph-name="V" horiz-adv-x="351" d="M365 563L183 -33L0 563H101L183 296L270 563H365Z"/> + <glyph unicode="G" glyph-name="G" horiz-adv-x="367" d="M355 1H18V564H355V420H125V144H248V211H156V355H355V1Z"/> + <hkern g1="V" g2="G" k="-40"/> + </font> + </defs> + <g font-family="SVGFreeSansASCII,sans-serif"> + <text font-size="14" x="10" y="20">Test for mask support</text> + <!-- Draw a red rectangle in the background --> + <rect x="10" y="30" width="100" height="260" fill="red"/> + <!-- Apply a gradient ramp based opacity --> + <mask id="mask1" maskUnits="userSpaceOnUse" x="60" y="50" width="100" height="60" color-interpolation="linearRGB"> + <defs> + <linearGradient gradientUnits="userSpaceOnUse" id="Grad1" x1="60" y1="50" x2="60" y2="120"> + <stop stop-color="white" stop-opacity="1" offset="0"/> + <stop stop-color="white" stop-opacity="0.5" offset="1"/> + </linearGradient> + </defs> + <rect x="60" y="50" width="100" height="60" fill="url(#Grad1)"/> + </mask> + <rect x="60" y="50" width="100" height="60" fill="lime" mask="url(#mask1)"/> + <text font-size="12" x="200" y="65">Mask with linear gradient from</text> + <text font-size="12" x="200" y="80">opacity=1 to opactity=0.5</text> + <!-- Simulate a uniform opacity using a mask --> + <mask id="mask2" maskUnits="userSpaceOnUse" x="60" y="120" width="100" height="30" color-interpolation="linearRGB"> + <rect x="60" y="120" width="100" height="30" fill-opacity="0.5" fill="white"/> + </mask> + <rect x="60" y="120" width="100" height="30" fill="lime" mask="url(#mask2)"/> + <text font-size="12" x="200" y="135">Mask with uniform opacity of 0.5</text> + <!-- Apply a uniform opacity --> + <rect x="60" y="160" width="100" height="30" fill="lime" fill-opacity="0.5"/> + <text font-size="12" x="200" y="175">Rectangle with uniform opacity of 0.5</text> + <!-- Apply a mask to text --> + <mask id="mask3" maskUnits="userSpaceOnUse" x="60" y="200" width="200" height="100" color-interpolation="linearRGB"> + <rect x="60" y="200" width="200" height="25" fill="white" fill-opacity="0.5"/> + <rect x="60" y="225" width="200" height="25" fill="white" fill-opacity="0.2"/> + <rect x="60" y="250" width="200" height="25" fill="white" fill-opacity="1"/> + <rect x="60" y="275" width="200" height="25" fill="white" fill-opacity="0.7"/> + </mask> + <text x="60" y="280" font-family="larabie-anglepoise" font-size="110" fill="lime" mask="url(#mask3)">SVG</text> + <text font-size="12" x="200" y="225">Text with mask containing rectangles</text> + <text font-size="12" x="200" y="240">of various opacities</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/masking-mask-02-f-manual.svg b/testing/web-platform/tests/svg/import/masking-mask-02-f-manual.svg new file mode 100644 index 000000000..38cd9420e --- /dev/null +++ b/testing/web-platform/tests/svg/import/masking-mask-02-f-manual.svg @@ -0,0 +1,50 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" version="$Revision: 1.3 $" testname="$RCSfile: masking-mask-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/masking.html#Masking"> + <p> + If the 'mask' property references a 'mask' element containing no children, the element referencing it is not rendered. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is a single green rectangle, with no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: masking-mask-02-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <mask id="testMask" /> + <rect x="100" y="100" width="250" height="150" fill="green" /> + <rect x="100" y="100" width="250" height="150" fill="red" mask="url(#testMask)" /> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg>
\ No newline at end of file diff --git a/testing/web-platform/tests/svg/import/masking-opacity-01-b-manual.svg b/testing/web-platform/tests/svg/import/masking-opacity-01-b-manual.svg new file mode 100644 index 000000000..ce34caeb6 --- /dev/null +++ b/testing/web-platform/tests/svg/import/masking-opacity-01-b-manual.svg @@ -0,0 +1,125 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Haroon Sheikh" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: masking-opacity-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/masking.html#ObjectAndGroupOpacityProperties"> + <p> + Test to see the effect of applying an opacity property to a group. + </p> + <p> + A blue rectangle with a green rectangle on top are contained in a + group. This opacity of the group and the opacity of the rectangles are + changed in this test. A red rectangle is provided in the background so + that opacity changes are obvious visually. + </p> + <p> + From top to bottom, the tests are as follows. + </p> + <p> + In the top test, the opacities of the group and the individual rectangles are + all set to 1. + </p> + <p> + In the second test, the group is given an opacity of 0.5. + </p> + <p> + In the third test, the group maintains a group opacity of 1 whereas each individual + rectangle is given an opacity of 0.5 in the group. + </p> + <p> + Lastly, the group and individual rectangles are all given an opacity of 0.5. + </p> + + + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + In the top test, the green rectangle should appear on top of the blue + rectangle. + </p> + <p> + In the second test, the blue + rectangle should not show through in the region where the green and blue overlap. + </p> + <p> + In the third test, the blue rectangle + should show through in the overlap region. + </p> + <p> + Lastly, the + result should be similar to the previous test only fainter (because the opacity) is + resulting in less contribution. + </p> + <p> + The rendered picture should match the reference image exactly, except for possible + variations in the labelling text (per CSS2 rules). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: masking-opacity-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-size="24" x="50" y="27">Test for opacity property on a group.</text> + <rect x="10" y="30" width="100" height="260" fill="red"/> + <g opacity="1"> + <rect x="60" y="50" width="80" height="40" fill="blue"/> + <rect x="70" y="60" width="80" height="40" fill="lime"/> + </g> + <text font-size="20" x="200" y="62">Group opacity: 1</text> + <text font-size="20" x="200" y="80">Blue rectangle opacity: 1</text> + <text font-size="20" x="200" y="98">Green rectangle opacity: 1</text> + <g opacity="0.5"> + <rect x="60" y="110" width="80" height="40" fill="blue"/> + <rect x="70" y="120" width="80" height="40" fill="lime"/> + </g> + <text font-size="20" x="200" y="122">Group opacity: 0.5</text> + <text font-size="20" x="200" y="140">Blue rectangle opacity: 1</text> + <text font-size="20" x="200" y="158">Green rectangle opacity: 1</text> + <g opacity="1"> + <rect x="60" y="170" width="80" height="40" fill="blue" opacity=".5"/> + <rect x="70" y="180" width="80" height="40" fill="lime" opacity=".5"/> + </g> + <text font-size="20" x="200" y="182">Group opacity: 1</text> + <text font-size="20" x="200" y="200">Blue rectangle opacity: 0.5</text> + <text font-size="20" x="200" y="218">Green rectangle opacity: 0.5</text> + <g opacity="0.5"> + <rect x="60" y="230" width="80" height="40" fill="blue" opacity=".5"/> + <rect x="70" y="240" width="80" height="40" fill="lime" opacity=".5"/> + </g> + <text font-size="20" x="200" y="242">Group opacity: 0.5</text> + <text font-size="20" x="200" y="260">Blue rectangle opacity: 0.5</text> + <text font-size="20" x="200" y="278">Green rectangle opacity: 0.5</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/masking-path-01-b-manual.svg b/testing/web-platform/tests/svg/import/masking-path-01-b-manual.svg new file mode 100644 index 000000000..81dbc8da5 --- /dev/null +++ b/testing/web-platform/tests/svg/import/masking-path-01-b-manual.svg @@ -0,0 +1,95 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="LH" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: masking-path-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/masking.html#ClippingPaths"> + <p> + Test to see if the basic clipping works using the clipPath element + and the clip-path property. + </p> + <p> + This test uses the following elements : <clipPath> and the following + properties : clip-path. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test at the top shows an orange rectangle (with black stroke) being clipped by another rectangle. + So only the middle portion of the orange rectangle should be visible. Also the black stroke should + only be visible along the top and bottom edge of the rectangle. + </p> + <p> + The example at the bottom has a group containing a text string and two rectangles. The group + has a clipping path defined using two overlapping rectangles. Of concern is the overlapping area + shared by the two rectangles. There should not be holes in this overlapping area, the + clip region is the union of the two rectangles. For clarity, + guide rectangles in grey show the position of the clipping rectangles. + </p> + <p> + The rendered picture should match the reference image exactly, except for possible + variations in the labelling text (per CSS2 rules). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: masking-path-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g shape-rendering="geometricPrecision"> + <!--text font-size="14" x="10" y="20">Test for clipping using clipPath element</text--> + <defs> + <clipPath id="clip1"> + <rect x="200" y="10" width="60" height="100"/> + </clipPath> + <clipPath id="clip2"> + <rect x="90" y="150" width="175" height="100"/> + <rect x="225" y="160" width="95" height="75"/> + </clipPath> + </defs> + <rect x="20" y="20" width="440" height="60" fill="orange" stroke="black" stroke-width="5" clip-path="url(#clip1)"/> + <text font-size="30" x="20" y="130">Rectangle being clipped</text> + <g clip-path="url(#clip2)"> + <rect x="115" y="190" width="225" height="40" fill="aqua" stroke="blue" stroke-width="5"/> + <rect x="115" y="240" width="225" height="40" fill="lime" stroke="green" stroke-width="5"/> + <text font-size="30" x="115" y="180">Line of text to be clipped</text> + </g> + <text font-size="30" x="20" y="280">Group being clipped</text> + <!-- show the two rects and the overlap area --> + <g fill="none" stroke="#999" stroke-width="2"> + <rect x="90" y="150" width="175" height="100"/> + <rect x="225" y="160" width="95" height="75"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/masking-path-02-b-manual.svg b/testing/web-platform/tests/svg/import/masking-path-02-b-manual.svg new file mode 100644 index 000000000..d952df142 --- /dev/null +++ b/testing/web-platform/tests/svg/import/masking-path-02-b-manual.svg @@ -0,0 +1,84 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Haroon Sheikh" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: masking-path-02-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/masking.html#ClippingPaths"> + <p> + Test to see if clipPathUnits attribute is handled properly on a + clipPath element. Only tests the userSpaceOnUse and + objectBoundingBox items of the clipPathUnits. userSpace has been + tested by the previous test as it is the default. + </p> + <p> + The test at the top shows a pink rectangle that has been clipped by a + rectangular clipping path. The clipping path is defined using clipPathUnits=objectBoundingBox. + + </p> + <p> + The example at the bottom a rotated blue rectangle that has been clipped by a + rectangular clipping path. The clipping path is defined using clipPathUnits=userSpaceOnUse. + + </p> + <p> + The rendered picture should match the reference image exactly, except for possible + variations in the labelling text (per CSS2 rules). + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test passes if the pink rectangle and blue diamond do not have any + color painted outside of their black borders. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: masking-path-02-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g shape-rendering="geometricPrecision"> + <clipPath id="clip1" clipPathUnits="objectBoundingBox"> + <rect x=".25" y=".5" width=".6" height="1"/> + </clipPath> + <rect x="10" y="10" width="430" height="80" fill="#F08" clip-path="url(#clip1)"/> + <rect x="117" y="50" width="258" height="40" fill="none" stroke="black" stroke-width="4"/> + <text font-size="30" x="20" y="130">clipPathUnits=objectBoundingBox</text> + <clipPath id="clip2" clipPathUnits="userSpaceOnUse"> + <rect x="60" y="60" width="80" height="80"/> + </clipPath> + <rect transform="translate(100 200) rotate(-45)" x="0" y="0" width="120" height="120" fill="blue" clip-path="url(#clip2)"/> + <rect transform="translate(100 200) rotate(-45)" x="60" y="60" width="60" height="60" fill="none" stroke="black" stroke-width="4"/> + <text font-size="30" x="20" y="280">clipPathUnits=userSpaceOnUse</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/masking-path-03-b-manual.svg b/testing/web-platform/tests/svg/import/masking-path-03-b-manual.svg new file mode 100644 index 000000000..92186a6c5 --- /dev/null +++ b/testing/web-platform/tests/svg/import/masking-path-03-b-manual.svg @@ -0,0 +1,134 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: masking-path-03-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/masking.html#ClippingPaths"> + <p> + Test 'overflow'/'clip' on outermost and inner 'svg' elements. + </p> + <p> + There are two parts to the test. The first part tests viewport clipping + on outermost 'svg' elements. The second part tests viewport clipping + on inner 'svg' elements. + </p> + <p> + The test case also tests the initial value of the 'overflow' property + to ensure that it is set to 'hidden' for all 'svg' elements. + Tester should zoom out and/or pan to check this. + </p> + <p> + To test clipping to the outermost 'svg' element, + a rectangle with a light blue interior, a light red border and a black + string that says "Clip to outer 'svg'" is painted four times such that + it will overflow each of the top, left, right and bottom + sides of the bounds of the outermost 'svg' element, respectively. + </p> + <p> + To test clipping to inner 'svg' elements, a rectangle with a light red + interior, a light blue border and a black string that says "Clip to + inner 'svg'" is painted four times such that it will overflow each of + the top, left, right and bottom sides of the bounds of an inner 'svg' + element, respectively. + </p> + <p> + Note that minor text layout differences, as are permissible under CSS2 + rules, can lead to slightly different visual results regarding where + the text strings get clipped. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if:</p> + <ul> + <li>The four "Outer Clip" boxed strings must not render outside the + outermost 'svg' element (the 480x360 rectangular viewport) and + must continue to be clipped to this viewport if the image is zoomed in or out, + or panned.</li> + <li>The four "Inner Clip" boxed strings must not render outside the + bounds of the green rectangle.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: masking-path-03-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g shape-rendering="geometricPrecision"> + <!--text font-size="18" text-anchor="middle" x="240" y="70">Test 'overflow'/'clip' on outermost and inner 'svg' elements</text--> + <text font-size="18" x="10" y="70">Test 'overflow'/'clip' on outermost and inner 'svg' elements</text> + <!-- Test initial value for 'overflow' property (i.e., hidden) + on outermost 'svg' --> + <g font-size="48" stroke-width="2"> + <g transform="translate(115,-20)"> + <rect width="250" height="60" fill="#ccccff" stroke="#ff8888"/> + <text x="15" y="45">Outer Clip</text> + </g> + <g transform="translate(-175,150)"> + <rect width="250" height="60" fill="#ccccff" stroke="#ff8888"/> + <text x="15" y="45">Outer Clip</text> + </g> + <g transform="translate(405,150)"> + <rect width="250" height="60" fill="#ccccff" stroke="#ff8888"/> + <text x="15" y="45">Outer Clip</text> + </g> + <g transform="translate(115,330)"> + <rect width="250" height="60" fill="#ccccff" stroke="#ff8888"/> + <text x="15" y="45">Outer Clip</text> + </g> + </g> + <!-- Test initial value for 'overflow' property (i.e., hidden) + on inner 'svg' --> + <rect x="115" y="100" width="250" height="160" fill="none" stroke="#006600" stroke-width="5"/> + <svg xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="115" y="100" width="250" height="160"> + <g font-size="32" stroke-width="2"> + <g transform="translate(50,-15)"> + <rect width="150" height="35" fill="#ffaaaa" stroke="#6666ff"/> + <text x="6" y="26">Inner Clip</text> + </g> + <g transform="translate(-50,62.5)"> + <rect width="150" height="35" fill="#ffaaaa" stroke="#6666ff"/> + <text x="6" y="26">Inner Clip</text> + </g> + <g transform="translate(150,62.5)"> + <rect width="150" height="35" fill="#ffaaaa" stroke="#6666ff"/> + <text x="6" y="26">Inner Clip</text> + </g> + <g transform="translate(50,140)"> + <rect width="150" height="35" fill="#ffaaaa" stroke="#6666ff"/> + <text x="6" y="26">Inner Clip</text> + </g> + </g> + </svg> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/masking-path-04-b-manual.svg b/testing/web-platform/tests/svg/import/masking-path-04-b-manual.svg new file mode 100644 index 000000000..983bfd1b4 --- /dev/null +++ b/testing/web-platform/tests/svg/import/masking-path-04-b-manual.svg @@ -0,0 +1,79 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Chris Lilley" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: masking-path-04-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/masking.html#ClippingPaths"> + <p> + This test exercises basic user-specified clip paths, using a text + string (i.e., content of a 'text' element) as the clip path. + </p> + <p> + There is a rectangular image of a swirly blue pattern with large + yellow text, "Clip Test" superimposed. The image is a PNG file, + imported into the picture via the 'image' element. + </p> + <p> + The test uses the 'rect' element, as well as basic fill (solid primary + colors), stroke (black 1-pixel lines), font-family (Arial and + Impact) and font-size properties. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image, except for + possible variations in the labelling text (per CSS2 rules). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: masking-path-04-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g shape-rendering="geometricPrecision"> + <defs> + <clipPath id="sample" clipPathUnits="userSpaceOnUse"> + <text x="45" y="270" font-size="100" font-family="Impact">Clip Test</text> + </clipPath> + </defs> + + <g> + <image xlink:href="../images/bluesquidj.png" preserveAspectRatio="none" x="30" y="20" width="410" height="140"/> + <text x="55" y="130" font-size="100" font-family="Impact" fill="yellow">Clip Test</text> + </g> + <g> + <image xlink:href="../images/bluesquidj.png" preserveAspectRatio="none" x="20" y="170" width="410" height="160" clip-path="url(#sample)"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/masking-path-05-f-manual.svg b/testing/web-platform/tests/svg/import/masking-path-05-f-manual.svg new file mode 100644 index 000000000..e6146eabd --- /dev/null +++ b/testing/web-platform/tests/svg/import/masking-path-05-f-manual.svg @@ -0,0 +1,78 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Haroon Sheikh" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: masking-path-05-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/masking.html#ClippingPaths"> + <p> + Test to see if clip-rule property has been implemented properly. + </p> + <p> + The test at the top shows a red rectangle that has been clipped by a + clipping path that overlaps itself. + </p> + <p> + The test at the bottom shows a blue rectangle that has been clipped by a + clipping path that overlaps itself. + </p> + <p> + The rendered picture should match the reference image exactly, except for possible + variations in the labelling text (per CSS2 rules). + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + In the first rectangle, the clip-rule is defined to be evenodd so the overlap should have a hole in it. + The clip-rule is defined to be nonzero so the overlap should be filled. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: masking-path-05-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g shape-rendering="geometricPrecision"> + <text font-size="14" x="150" y="20">Test for clip-rule property.</text> + <clipPath id="clip1"> + <path clip-rule="evenodd" d="M200,40l20,0 0,60 20,0 0,-20 -60,0 0,-20 80,0 0,60 -60,0 0,-80z"/> + </clipPath> + <rect x="50" y="30" width="350" height="100" fill="red" clip-path="url(#clip1)"/> + <text font-size="12" x="100" y="140">clip-rule=evenodd</text> + <clipPath id="clip2"> + <path clip-rule="nonzero" d="M200,170l20,0 0,60 20,0 0,-20 -60,0 0,-20 80,0 0,60 -60,0 0,-80z"/> + </clipPath> + <rect x="50" y="160" width="350" height="100" fill="blue" clip-path="url(#clip2)"/> + <text font-size="12" x="100" y="270">cliprule=nonzero</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/masking-path-06-b-manual.svg b/testing/web-platform/tests/svg/import/masking-path-06-b-manual.svg new file mode 100644 index 000000000..6d0425ab5 --- /dev/null +++ b/testing/web-platform/tests/svg/import/masking-path-06-b-manual.svg @@ -0,0 +1,66 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="BB" status="issue" + version="$Revision: 1.8 $" testname="$RCSfile: masking-path-06-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/masking.html#ClippingPaths"> + <p> + The intent of this file to test the 'clip' property. In this test, the clipped objects are + raster and SVG images. + + <!-- ED: The bottom right subtest is the source of the issue, since CSS2.1 changed how 'clip' should be interpreted compared to CSS2.0. --> + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The UA should render two images inside the red rectangles.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: masking-path-06-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g shape-rendering="geometricPrecision"> + <text font-size="20" x="240" y="30" text-anchor="middle">'clip' property on images</text> + + <image x="35" y="45" width="200" height="120" overflow="hidden" clip="rect(10,10,10,10)" xlink:href="../images/plant.jpg" preserveAspectRatio="none"/> + <rect x="35" y="45" width="200" height="120" fill="none" stroke="blue"/> + <rect x="45" y="55" width="180" height="100" fill="none" stroke="red"/> + <text font-size="25" x="245" y="110"><-- raster image</text> + + <image x="245" y="180" width="200" height="120" overflow="hidden" clip="rect(10,10,10,10)" xlink:href="../images/SVGImageTest.svg" preserveAspectRatio="none"/> + <rect x="245" y="180" width="200" height="120" fill="none" stroke="blue"/> + <rect x="255" y="190" width="180" height="100" fill="none" stroke="red"/> + <text font-size="25" x="70" y="250">SVG image --></text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/masking-path-07-b-manual.svg b/testing/web-platform/tests/svg/import/masking-path-07-b-manual.svg new file mode 100644 index 000000000..63f73d821 --- /dev/null +++ b/testing/web-platform/tests/svg/import/masking-path-07-b-manual.svg @@ -0,0 +1,147 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="CM" author="ED" status="accepted" + version="$Revision: 1.11 $" testname="$RCSfile: masking-path-07-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/masking.html#ClippingPaths"> + <p> + This tests that 'clipPath' elements can be used together and how the clipping paths are intersected. + </p> + <p> + There is a gray-white pattern as a background for the two subtest rectangles. This is to show that the holes that are cut out using clip-paths are transparent. + The first subtest verifies that when you use the 'clip-path' property on a child element inside a 'clipPath' element the child element is clipped correctly. + The second subtest verifies that when a 'clipPath' element has a 'clip-path' property the result is the intersection of the two clip paths. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if the following conditions are met: + </p> + <ul> + <li>There is no red visible.</li> + <li>No shapes extend outside of the rects that have a thick black border.</li> + <li>For the left subtest: + <ul> + <li>There must be a large blue rect with a transparent smaller rect in it, and the intersection of two circles.</li> + <li>The borders of the clipregions are shown with black stroke.</li> + <li>The blue shapes must be visible only inside of these stroked regions.</li> + </ul> + </li> + <li>For the right subtest: + <ul> + <li>The test on the right must show part of the large blue rect shape with a transparent rect in it, and part of a circle.</li> + <li>The blue shapes must only be visible inside of the circle that has black stroke.</li> + </ul> + </li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: masking-path-07-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <defs> + <clipPath id="clipCircle1"> + <circle id="c1" cx="100" cy="100" r="50"/> + </clipPath> + + <clipPath id="clipCircle2"> + <circle id="c2" cx="150" cy="150" r="50"/> + </clipPath> + + <clipPath id="clipPath1"> + <path id="p1" d="M10 10l100 0 0 100 -100 0ZM50 50l40 0 0 40 -40 0Z" clip-rule="evenodd"/> + </clipPath> + + <!-- "If a valid 'clip-path' reference is placed on one of the children of a 'clipPath' element, + then the given child element is clipped by the referenced clipping path before OR'ing the + silhouette of the child element with the silhouettes of the other child elements." --> + <clipPath id="clipRects1"> + <rect x="50" y="30" width="25" height="100"/> + <rect x="25" y="50" width="10" height="10" clip-path="url(#clipTwoCircles)"/> + </clipPath> + + <!-- Test use in a clipPath --> + <clipPath id="clipTwoCircles"> + <use xlink:href="#c1"/> + <use xlink:href="#c2"/> + </clipPath> + + <clipPath id="clipInClip1"> + <use xlink:href="#c2" clip-path="url(#clipCircle1)"/> + <use xlink:href="#p1"/> + </clipPath> + + <clipPath id="clipOnClip1" clip-path="url(#clipCircle1)"> + <use xlink:href="#c2"/> + <use xlink:href="#p1"/> + </clipPath> + + <pattern patternUnits="userSpaceOnUse" id="pattern" x="0" y="0" width="20" height="20"> + <rect x="0" y="0" width="10" height="10" fill="gray"/> + <rect x="10" y="10" width="10" height="10" fill="gray"/> + </pattern> + </defs> + + <rect x="20" y="70" width="210" height="210" fill="url(#pattern)" stroke="black" stroke-width="4"/> + <rect x="250" y="70" width="210" height="210" fill="url(#pattern)" stroke="black" stroke-width="4"/> + + <text x="240" y="2em" text-anchor="middle">Test clip unions and intersections</text> + + <g transform="translate(20, 70)"> + <g id="subtest1"> + <use xlink:href="#p1" fill="red" fill-rule="evenodd"/> + <use xlink:href="#c2" fill="red" clip-path="url(#clipCircle1)"/> + <use xlink:href="#c1" fill="red" clip-path="url(#clipCircle2)"/> + + <rect width="200" height="200" fill="blue" clip-path="url(#clipInClip1)"/> + + <use xlink:href="#c2" fill="none" clip-path="url(#clipCircle1)" stroke="black"/> + <use xlink:href="#c1" fill="none" clip-path="url(#clipCircle2)" stroke="black"/> + <use xlink:href="#p1" fill="none" stroke="black"/> + </g> + + <g id="subtest2" transform="translate(230,0)"> + <g clip-path="url(#clipCircle1)"> + <use xlink:href="#c2" fill="red"/> + <use xlink:href="#p1" fill="red" fill-rule="evenodd"/> + </g> + + <rect width="300" height="300" fill="blue" clip-path="url(#clipOnClip1)"/> + + <use xlink:href="#c1" fill="none" stroke="black"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.11 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/masking-path-08-b-manual.svg b/testing/web-platform/tests/svg/import/masking-path-08-b-manual.svg new file mode 100644 index 000000000..17291ade9 --- /dev/null +++ b/testing/web-platform/tests/svg/import/masking-path-08-b-manual.svg @@ -0,0 +1,140 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="CM" author="ED" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: masking-path-08-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/masking.html#EstablishingANewClippingPath"> + <p> + This tests a few 'clip-path' cases to see that clipping paths are applied and constructed properly. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + There are nine subtests in this test. There should be a big stroked rectangle with nine smaller rectangles inside. If all of the smaller rectangles are green the test has passed. + </p> + <p> + The test has passed if: + </p> + <ul> + <li>There is no red visible.</li> + <li>Each of the nine small rectangles are green.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: masking-path-08-b.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <defs> + <clipPath id="emptyclip"> + </clipPath> + <clipPath id="hiddenclip"> + <rect width="100" height="100" visibility="hidden"/> + </clipPath> + <clipPath id="displayclip"> + <rect width="100" height="100" display="none"/> + </clipPath> + <clipPath id="opacityclip"> + <rect width="100" height="100" opacity="0"/> + </clipPath> + <clipPath id="strokefillclip"> + <rect width="100" height="100" stroke="none" fill="none"/> + </clipPath> + <clipPath id="strokewidthclip"> + <rect x="40" y="40" width="20" height="20" stroke="black" stroke-width="80"/> + </clipPath> + <clipPath id="strokeopacityclip"> + <rect x="40" y="40" width="20" height="20" stroke="black" stroke-opacity="0" stroke-width="80"/> + </clipPath> + <clipPath id="fillopacityclip"> + <rect width="100" height="100" fill-opacity="0"/> + </clipPath> + </defs> + + <text x="240" y="50" text-anchor="middle">Establishing a new clipping path</text> + + <g transform="scale(0.5) translate(320 200)"> + <rect width="100" height="100" fill="lime"/> + <rect width="100" height="100" fill="red" clip-path="url(#emptyclip)"/> + + <g transform="translate(110 0)"> + <rect width="100" height="100" fill="lime"/> + <rect width="100" height="100" fill="red" clip-path="url(#hiddenclip)"/> + </g> + + <g transform="translate(220 0)"> + <rect width="100" height="100" fill="lime"/> + <rect width="100" height="100" fill="red" clip-path="url(#displayclip)"/> + </g> + + <!-- This has an intentionally broken clip-path url --> + <g transform="translate(0 110)"> + <rect x="0.5" y="0.5" width="99" height="99" fill="red"/> + <rect width="100" height="100" fill="lime" clip-path="url(#unknown)"/> + </g> + + <g transform="translate(110 110)"> + <rect x="0.5" y="0.5" width="99" height="99" fill="red"/> + <rect width="100" height="100" fill="lime" clip-path="url(#opacityclip)"/> + </g> + + <g transform="translate(220 110)"> + <rect x="0.5" y="0.5" width="99" height="99" fill="red"/> + <rect width="100" height="100" fill="lime" clip-path="url(#strokefillclip)"/> + </g> + + <g transform="translate(0 220)"> + <rect width="100" height="100" fill="lime"/> + <rect width="100" height="100" fill="red" clip-path="url(#strokewidthclip)"/> + <rect x="39" y="39" width="22" height="22" fill="lime"/> + </g> + + <g transform="translate(110 220)"> + <rect width="100" height="100" fill="lime"/> + <rect width="100" height="100" fill="red" clip-path="url(#strokeopacityclip)"/> + <rect x="39" y="39" width="22" height="22" fill="lime"/> + </g> + + <g transform="translate(220 220)"> + <rect x="0.5" y="0.5" width="99" height="99" fill="red"/> + <rect width="100" height="100" fill="lime" clip-path="url(#fillopacityclip)"/> + </g> + + <rect width="320" height="320" fill="none" stroke="black"/> + </g> + + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/masking-path-09-b-manual.svg b/testing/web-platform/tests/svg/import/masking-path-09-b-manual.svg new file mode 100644 index 000000000..d272e605c --- /dev/null +++ b/testing/web-platform/tests/svg/import/masking-path-09-b-manual.svg @@ -0,0 +1,73 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="DAS" author="CM" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: masking-path-09-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/masking.html#EstablishingANewClippingPath"> + <p> + This tests that a clip path applied to an element does not affect + bounding box computation. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the rectangle is green. The test is failed + if any part of the rectangle is red. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: masking-path-09-b.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text x='10' y='40' font-size='13'>Test bounding box calculations with clip paths</text> + + <clipPath id='c' clipPathUnits='userSpaceOnUse'> + <rect x='10' y='50' width='50' height='50'/> + </clipPath> + + <g id='g' clip-path='url(#c)' fill='red'> + <rect x='10' y='50' width='50' height='50'/> + <rect x='60' y='50' width='50' height='50' fill='red'/> + </g> + + <script> + var g = document.getElementById('g'); + if (g.getBBox().width == 100) { + g.setAttribute('fill', 'green'); + } + </script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/masking-path-10-b-manual.svg b/testing/web-platform/tests/svg/import/masking-path-10-b-manual.svg new file mode 100644 index 000000000..251d34bdf --- /dev/null +++ b/testing/web-platform/tests/svg/import/masking-path-10-b-manual.svg @@ -0,0 +1,138 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="SVGWG" author="ED" status="accepted" + version="$Revision: 1.4 $" testname="$RCSfile: masking-path-10-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/masking.html#Masking"> + <p> + This tests a few 'mask' cases to see that masks are applied and constructed properly. + </p> + <p> + There are nine subtests in this test. There should be a big stroked rectangle with nine smaller rectangles inside. If all of the smaller rectangles are green the test has passed. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if: + </p> + <ul> + <li>There is no red visible.</li> + <li>Each of the nine small rectangles are green.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: masking-path-10-b.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <defs> + <mask id="emptymask"/> + <mask id="hiddenmask"> + <rect width="100" height="100" visibility="hidden"/> + </mask> + <mask id="displaymask"> + <rect width="100" height="100" display="none"/> + </mask> + <mask id="opacitymask"> + <rect width="100" height="100" opacity="0"/> + </mask> + <mask id="strokefillmask"> + <rect width="100" height="100" stroke="none" fill="none"/> + </mask> + <mask id="strokewidthmask"> + <rect x="40" y="40" width="20" height="20" stroke="white" stroke-width="20"/> + </mask> + <mask id="strokeopacitymask"> + <rect x="40" y="40" width="20" height="20" stroke="white" stroke-opacity="0" stroke-width="20"/> + </mask> + <mask id="fillopacitymask"> + <rect width="100" height="100" fill-opacity="0"/> + </mask> + </defs> + + <text x="240" y="50" text-anchor="middle">Establishing a new masking path</text> + + <g transform="scale(0.5) translate(320 200)"> + <rect width="100" height="100" fill="lime"/> + <rect width="100" height="100" fill="red" mask="url(#emptymask)"/> + + <g transform="translate(110 0)"> + <rect width="100" height="100" fill="lime"/> + <rect width="100" height="100" fill="red" mask="url(#hiddenmask)"/> + </g> + + <g transform="translate(220 0)"> + <rect width="100" height="100" fill="lime"/> + <rect width="100" height="100" fill="red" mask="url(#displaymask)"/> + </g> + + <!-- This has an intentionally broken mask url --> + <g transform="translate(0 110)"> + <rect x="0.5" y="0.5" width="99" height="99" fill="red"/> + <rect width="100" height="100" fill="lime" mask="url(#unknown)"/> + </g> + + <g transform="translate(110 110)"> + <rect x="0.5" y="0.5" width="99" height="99" fill="lime"/> + <rect width="100" height="100" fill="red" mask="url(#opacitymask)"/> + </g> + + <g transform="translate(220 110)"> + <rect x="0.5" y="0.5" width="99" height="99" fill="lime"/> + <rect width="100" height="100" fill="red" mask="url(#strokefillmask)"/> + </g> + + <g transform="translate(0 220)"> + <rect width="100" height="100" fill="lime"/> + <rect width="100" height="100" fill="red" mask="url(#strokewidthmask)"/> + <rect x="29" y="29" width="42" height="42" fill="lime"/> + </g> + + <g transform="translate(110 220)"> + <rect width="100" height="100" fill="lime"/> + <rect width="100" height="100" fill="red" mask="url(#strokeopacitymask)"/> + </g> + + <g transform="translate(220 220)"> + <rect x="0.5" y="0.5" width="99" height="99" fill="lime"/> + <rect width="100" height="100" fill="red" mask="url(#fillopacitymask)"/> + </g> + + <rect width="320" height="320" fill="none" stroke="black"/> + </g> + + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/masking-path-11-b-manual.svg b/testing/web-platform/tests/svg/import/masking-path-11-b-manual.svg new file mode 100644 index 000000000..957f85319 --- /dev/null +++ b/testing/web-platform/tests/svg/import/masking-path-11-b-manual.svg @@ -0,0 +1,67 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="ED" status="accepted" + version="$Revision: 1.4 $" testname="$RCSfile: masking-path-11-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/masking.html#Masking"> + <p> + Test the mask element with child elements with white and black fills, + to create a mask that clips out some text in the middle. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the letters 'ABC' are visible inside a blue + circle, and the letters are transparent, showing the checkered + background image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: masking-path-11-b.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <defs> + <mask id="maskedtext"> + <circle cx="50%" cy="50%" r="50" fill="white"/> + <text x="50%" y="55%" text-anchor="middle" font-size="48">ABC</text> + </mask> + </defs> + + <image xlink:href="../images/DisplaceChecker.png" x="140" y="80" width="200" height="200"/> + <rect width="100" height="100" x="190" y="130" fill="blue" mask="url(#maskedtext)"/> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/masking-path-12-f-manual.svg b/testing/web-platform/tests/svg/import/masking-path-12-f-manual.svg new file mode 100644 index 000000000..60c689493 --- /dev/null +++ b/testing/web-platform/tests/svg/import/masking-path-12-f-manual.svg @@ -0,0 +1,78 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" version="$Revision: 1.5 $" testname="$RCSfile: masking-path-12-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/masking.html#clipPath-geometry"> + <p> + Properties inherit into the 'clipPath' element and its children. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is a green rect visible, and no red. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: masking-path-12-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g display="table"> + <clipPath id="testClip" display="inherit"> + <rect x="100" y="100" width="50" height="50" display="inherit" /> + </clipPath> + </g> + + <rect id="pass" x="200" y="100" width="50" height="50" fill="green"/> + <rect id="fail" x="200" y="100" width="50" height="50" fill="red"/> + + <script type="text/javascript"><![CDATA[ + try + { + var test = document.getElementById("testClip"); + var testChild = test.firstChild.nextSibling; + var testAppliedStyle = document.defaultView.getComputedStyle(test, null).getPropertyValue("display"); + var testChildAppliedStyle = document.defaultView.getComputedStyle(testChild, null).getPropertyValue("display"); + var testExpectedStyle = "table"; + if((testAppliedStyle == testExpectedStyle) && (testChildAppliedStyle == testExpectedStyle)) + { + document.getElementById("fail").setAttribute("display", "none"); + } + } + catch(ex) + { + //alert('ERROR: ' + ex.message); + }]]> + </script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg>
\ No newline at end of file diff --git a/testing/web-platform/tests/svg/import/masking-path-13-f-manual.svg b/testing/web-platform/tests/svg/import/masking-path-13-f-manual.svg new file mode 100644 index 000000000..89b85421b --- /dev/null +++ b/testing/web-platform/tests/svg/import/masking-path-13-f-manual.svg @@ -0,0 +1,52 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" version="$Revision: 1.2 $" testname="$RCSfile: masking-path-13-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/masking.html#clipPath-geometry"> + <p> + Test that the children of the 'clipPath' element are not rendered directly. + </p> + </d:testDescription> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is a green rectangle, and no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: masking-path-13-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <rect x="100" y="100" width="200" height="100" fill="green" /> + <clipPath id="testClip"> + <rect x="100" y="100" width="200" height="100" fill="red" /> + </clipPath> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg>
\ No newline at end of file diff --git a/testing/web-platform/tests/svg/import/masking-path-14-f-manual.svg b/testing/web-platform/tests/svg/import/masking-path-14-f-manual.svg new file mode 100644 index 000000000..b0c39c0f4 --- /dev/null +++ b/testing/web-platform/tests/svg/import/masking-path-14-f-manual.svg @@ -0,0 +1,72 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" version="$Revision: 1.2 $" testname="$RCSfile: masking-path-14-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/masking.html#EstablishingANewClippingPath"> + <p> + The 'clipPath' element itself and its children elements do not inherit clipping paths from ancestors of the 'clipPath' element. + </p> + <p> + Overlay a red 'rect' with a black 'rect' of a larger size. Define a 'clipPath' with a 'rect' of the same size as the red 'rect', but different 'x' and 'y' offsets. Reference that 'clipPath' from a 'g' element containing another 'clipPath' element. In this latter 'clipPath', specify a 'rect' of the same size and same 'x' and 'y' offsets as the red 'rect', and reference it from the black 'rect' element. Reference the same 'clipPath' elements, but this time with a black 'rect' which overlays a red 'rect' of a larger size. If there is no red on the page, the first 'clipPath' was not inherited by the second 'clipPath'. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there are two black rectangles, and there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: masking-path-14-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <clipPath id="testClipPathAncestor"> + <rect x="50" y="50" width="50" height="50" /> + </clipPath> + <g clip-path="url(#testClipPathAncestor)"> + <clipPath id="testClipPath"> + <rect x="0" y="0" width="50" height="50" /> + </clipPath> + </g> + <svg x="0" y="0" width="200" height="200"> + <rect x="0" y="0" width="50" height="50" fill="red" /> + <rect x="0" y="0" width="200" height="200" fill="black" clip-path="url(#testClipPath)" /> + </svg> + <svg x="200" y="0" width="200" height="200"> + <rect x="0" y="0" width="200" height="200" fill="red" clip-path="url(#testClipPath)" /> + <rect x="0" y="0" width="50" height="50" fill="black" /> + </svg> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg>
\ No newline at end of file diff --git a/testing/web-platform/tests/svg/import/metadata-example-01-t-manual.svg b/testing/web-platform/tests/svg/import/metadata-example-01-t-manual.svg new file mode 100644 index 000000000..69eda51c9 --- /dev/null +++ b/testing/web-platform/tests/svg/import/metadata-example-01-t-manual.svg @@ -0,0 +1,160 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Chris Lilley" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: metadata-example-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/metadata.html#Example"> + <p> + Check that metadata in a variety of namespaces, inside a metadata + element, does not affect rendering in any way. The file is not valid to + the SVG 1.1 DTD, but is well formed. + </p> + <p>The diagram on the table is, by the way, a visualization of the + RDF metadata in the graphic.</p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered result should match the reference image and there should be + no error messages or warnings + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: metadata-example-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <metadata> + <rdf:RDF + xmlns:prism="http://prismstandard.org/namespaces/1.0/basic/" + xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" + xmlns:dc="http://purl.org/dc/elements/1.1/" + xmlns:rdfs="http://www.w3.org/2000/01/rdf-schema#"> + <!-- The empty value for the rdf:about attribute means it is describing + the file this is contained in. --> + <rdf:Description rdf:about=""> + <dc:description>Line drawing of woman in antique attire, + which looks legal or perhaps mystical.</dc:description> + <dc:format>image/svg+xml</dc:format> + <dc:subject>Sibyll Trelawney</dc:subject> + <dc:type rdf:resource="http://prismstandard.org/vocabularies/1.0/resourcetype.xml#birdsEye"/> + <dc:type rdf:resource="http://prismstandard.org/vocabularies/1.0/resourcetype.xml#illustration"/> + </rdf:Description> + </rdf:RDF> + </metadata> + <g transform="scale(1.2)"> + <g id="Sibyll" fill="#FFF" stroke="#000" stroke-miterlimit="4"> + <g stroke="none"> + <path fill="#000" d="M132.386,113.177c0.394-2.645,0.978-6.189,1.681-10.262c-7.597-5.655-19.264-14.488-26.764-25.988l-1.667-0.667c5.333,15.167,25,32.833,26.75,36.917l15.583,15.25c0,0,10,10.667,12.167,13.833c2.167,3.167,3.5,7.167,1.333,9.833 c-1.667-1-4.833-5.333-8-9.167c0,0-7-1.5-13.833-1.333c0,0,2.667,5.5,3.833,8c0.563,1.207,0.465,2.141,0.064,3.047c6.241,4.828,12.252,13.801,16.102,18.453c4,4.833,5.548,8.822,12.167,10.167c10.667,2.167,16.667,7.5,19.667,10s3,4,1.833,4.833 c0,0-4.167,1.5-11,2c-6.833,0.5-12.333-3.333-15.167-3.333c-4.333-0.167-6.333-3-7.833-6.333c-1.5-3.333-4.5-4.833-9.167-7.667c-4.293-2.606-14.858-7.894-19.053-14.174c-4.791,3.163-10.643,5.756-17.447,8.34l-1.333-1.333c-1.933,0.773-4.538,1.52-7.574,1.925 c2.113,6.17,7.926,15.123,10.157,16.908c2.5,2,4.25,4.25,4.25,6.5s-0.75,5.5-3.75,9.5c-0.5,13-6,19.75-12.5,22.25c-4.5-15-0.5-25.25,1.5-31.25c0,0-7.472-6.813-12.938-12.608c0.73,3.979,1.468,7.703,2.188,10.942c0,0-1.232,1.575-3.5,0.833 c-8.667-2.833-22.167-10.333-27.333-16.333c-2.667-7.833-6.5-33.667-7.667-44.333c0,0-5.167-1.333-10.167-2.667c0,0-0.667-0.333-1.5-3.5c0,0-5.667-1.667-11.833-3c-6.167-1.333-5.667-2.667-6.667-6.167s0.667-28.5,2.5-36.667c1.833-8.167,10.5-22.167,15.833-28 c0,0-1.006-0.135-1.833-2.5c-5.833-16.667-7.833-27.333-0.667-37.667c7.167-10.333,20.167-6,26.667-2.833c6.5,3.167,6.667,8.333,8.167,10.833s0.333,4.833,2,7.167c17.667,7,26.833,16.667,38.833,27.167c7.5,3.667,13.667,9.667,18.667,13.833 c1.124,0.937,2.323,2.151,3.556,3.525c1.444-7.663,2.858-14.936,3.944-20.275c3-14.75,9.5-47,10.25-49.25l3,0.25c29.25,0.25,69.75-1,69.75-1c0.25,20.25,0.25,62.5,0.25,74.25s0,39,0.25,42.25c0,0-3.75,2-8.333,2.75c1,0.167,1.667,2.5-0.167,3.333 c-3,0.167-25.333,0.167-33-1c-1.245-0.189-2.923-0.326-4.879-0.422c2.441,2.484,8.906,8.839,19.629,17.838l-0.25,8.25l-9,0.25l-31.952-26.426c-4.665,0.081-8.525,0.176-10.215,0.176l-15.583-15.25z"/> + <path fill="#000" d="M60.654,1.358c-0.844,0.915-1.808,2.263-2.857,3.938c-1.195-1.07-3.74-3.216-6.342-4.566l-1.904,2.413l6.058,5.882c-0.131,0.236-0.264,0.477-0.397,0.721C46.57,3.133,43.441,0.554,43.441,0.554l-2.39,2.766 c3.972,4.632,9.453,8.916,11.891,10.729c-0.211,0.413-0.423,0.831-0.636,1.255C39.417,5.651,34.449,0.917,34.449,0.917l-2.717,2.945c7.647,7.33,15.917,14.754,18.024,16.638c-0.204,0.425-0.408,0.854-0.613,1.284C36.8,12.691,27.994,4.367,25.422,0.449 l-2.39,2.765c8.104,8.539,20.319,19.211,24.227,22.583c-0.206,0.443-0.411,0.888-0.617,1.333c-9.527-6.31-14.627-11.31-18.931-15.432C23.201,7.377,17.976,1.917,15.896,0L13.02,3.119c7.717,8.503,25.108,24.004,31.619,28.399 c-0.243,0.537-0.485,1.073-0.726,1.607C30.32,22.46,10.721,5.175,6.985,2.362L4.901,4.448c8.872,9.074,31.669,29.336,36.615,34.038c-0.3,0.677-0.597,1.346-0.89,2.006C25.883,27.823,2.664,6.874,2.664,6.874L1.12,9.939c10.493,10.57,33.952,32.544,37.258,35.638 c-0.259,0.585-0.512,1.158-0.758,1.715C22.515,33.526,7.848,20.476,3.401,16.852l-2.237,2.426c11.139,10.986,30.478,28.518,34.581,32.227c-0.323,0.72-0.628,1.394-0.913,2.015C21.063,40.369,5.95,27.057,2.685,23.887l-2.383,2.932 c8.691,8.46,29.709,27.74,32.738,30.515c-0.304,0.651-0.648,1.404-1.029,2.247C18.259,46.584,5.606,34.76,2.869,32.553l-2.25,2.092c9.949,10.825,26.338,25.906,29.82,28.451c-0.32,0.724-0.656,1.485-1.006,2.28C16.333,52.826,2.679,40.233,2.679,40.233 l-2.224,2.759c9.067,9.678,23.141,23.04,27.343,26.12c-0.297,0.683-0.602,1.383-0.912,2.098C15.543,60.602,2.703,49.073,2.703,49.073C1.238,49.966,0,52.352,0,52.352C11.334,63.218,22.136,73.12,24.95,75.689c-0.261,0.606-0.525,1.22-0.792,1.841 C8.771,63.626,2.36,57.093,2.36,57.093l-1.884,2.912c8.419,8.851,18.809,19.06,21.778,21.963c-0.157,0.366-0.313,0.733-0.472,1.102C10.825,74.056,2.944,67.412,2.944,67.412l-1.737,2.405c8.374,8.123,16.46,14.983,18.948,17.065 c-0.242,0.567-0.484,1.137-0.728,1.709C10.261,82.019,3.115,75.745,3.115,75.745l-1.85,3.745c8.161,7.937,14.37,12.905,16.005,14.183c-0.244,0.576-0.488,1.152-0.732,1.729C7.159,87.785,4.131,84.377,4.131,84.377l-2.363,3.432 c5.442,5.678,11.379,9.753,13.319,11.023c-0.25,0.592-0.5,1.183-0.748,1.773l-10.71-8.035l-1.884,2.912l10.717,9.579c-0.152,0.362-0.303,0.723-0.455,1.083l-8.603-6.725l-1.724,2.738l8.792,7.647c-0.276,0.659-0.549,1.313-0.821,1.962l-6.45-5l-1.737,2.405 l6.509,6.618c-0.19,0.457-0.379,0.911-0.566,1.36l-5.095-3.509l-1.384,2.892l4.96,4.278c-0.144,0.347-0.286,0.69-0.427,1.031l-2.546-1.553l-1.211,3.051l2.199,2.281c-1.341,3.262-2.508,6.131-3.433,8.444l2.725,1.391c1.204-3.218,31.228-73.322,36-83.189 S60.577,7.7,62.173,1.797l-1.519-0.439z"/> + <path d="M142.803,106.261c-1,0.5-3,1-5-0.5c0,0-3.667,12.333-2.667,17.667c3.667,1.833,42.833,2.5,52.667,2.5c16.833,0,26.167,1,30,0.5c4.583-0.75,8.333-2.75,8.333-2.75c-0.25-3.25-0.25-30.5-0.25-42.25s1.333-54.354-0.25-74.25c0,0-40.5,1.25-69.75,1 c0.5,5.75-2.395,17.829-4,24.25c-1.5,6-5,25.25-9.929,48.894c3.256,4.04,6.499,8.469,9.012,11.273c0,0,0.089,1.697-0.189,3.521c3.856,1.062,6.481,3.062,7.981,5.312s2.25,5.625,1.375,7.875c0.625,3.125,0.5,5.375-0.875,5.75s-2.5,1-4.5,0.25 c-0.875,3.25-1.25,3.5-1.25,3.5c-1.75,0-2.375-0.125-2.375-0.125c-3-4.125-8.667-7.833-8.333-12.417z"/> + <path fill="#000" d="M207.303,18.594c0,0-19,6.167-39.167,13.333c0,0,0.716,6.012,1.617,11.404c-4.629,2.158-9.096,4.243-12.617,5.93c0,0,5,18,10.333,30.333c2.833-2.167,23-11.833,37.167-19.667c0,0-0.888-2.858-2.156-6.833 c1.809-0.587,7.883-2.55,9.156-2.833c1.5-0.333,1.5-2.833,1.5-2.833s-4.333-21.667-5.833-28.833z"/> + <path d="M133.469,159.427c-6.038,5.712-26.618,15.097-44.84,10.635c-1.833-11.777-3.345-23.232-3.993-29.635c-1.333-13.167-1.5-27.167-1.5-27.167c7,0.833,11.333-0.333,11.333-0.333c-0.333-4,0.5-9.5,0.5-9.5c2.5,3.167,7,5,8.333,1.833 c1.333-3.167,2.5-8.667,2.5-8.667c3.5,2.167,10,9.667,15.833,19c5.833,9.333,11.833,18.833,15.333,26.5c3.5,7.667,2.667,11.5-3.5,17.333z"/> + <path d="M150.303,98.094c-0.573,1.604-3.428,4.624-5.483,6.519c0.691,4.564,3.566,8.189,4.941,9.189s2.75,2,2.75,2c0.625-2.125-0.25-4.25-3.125-5.625c-0.375-1,0.75-3,1.75-2s2,0.375,2,0.375c1.875,2.75,2.125,4.125,2.125,4.125l2,0.5 c0-3.125-0.625-4.5,0.375-6.25c-1-3.75-2.292-7.042-7.333-8.833z"/> + <path d="M115.386,197.677c-1.5,7.25-3.25,13.25-4.5,16.25s-0.75,5.25-4.75,5c-3.25-1.5-3.5-3.75-2.25-8.5s3.5-9,3.5-12.25c-6.583-7.147-13.873-14.577-17.08-17.819c-0.354-2.073-0.703-4.181-1.043-6.295c4.057,1.386,8.024,1.841,11.607,1.757 c3.328,8.71,11.053,18.163,14.516,21.857z"/> + <path d="M141.636,155.761c0.054-0.094,0.108-0.187,0.164-0.277c7.517,8.107,12.258,14.859,14.67,17.111c2.5,2.333,6.5,8.667,10,9.833c3.5,1.167,11.833,4.167,14.333,5.333s2.667,1.833,2.167,3.667c-0.5,1.833-1.333,2.833-7,2.167 c-5.667-0.667-11.833-1.5-12.167-3.833c-0.333-2.333-7.333-9.5-11.833-11.5c-4.067-1.808-15.622-8.652-18.299-13.521c3.277-2.538,5.95-5.452,7.965-8.979z"/> + <path d="M193.136,150.927l-3,0.25c-13.131-11.256-23.025-19.555-27.146-22.997c1.969-0.023,3.993-0.039,5.991-0.041c9.588,10.269,24.155,22.788,24.155,22.788z"/> + <path d="M169.303,74.427c-4.667-11.833-7.833-23.667-7.833-23.667c13.333-6.333,32-15.167,32-15.167c2.5,9.167,7.333,23.333,7.333,23.333c-15.833,7.5-31.5,15.5-31.5,15.5z"/> + <path d="M201.697,50.65c-2.207-6.863-5.115-15.666-6.728-19.556c-2.217,1.478-12.056,6.098-21.979,10.728c-0.355-1.502-1.255-5.506-1.521-8.561c2.5-0.5,22.333-6.667,33.5-10.167c0.333,2.833,2.333,12.833,4.667,25.167c-1.124,0.75-5.709,1.873-7.938,2.389z"/> + <path d="M121.636,69.302l-0.333-2.333c5.333,3.333,20.667,18,26.167,25.667c0,2-1.833,1.333-2.833,0.333s-3.667-5.167-9-10.5c-5.333-5.333-12-13.333-14-13.167z"/> + <path d="M119.136,74.136c-0.667-6.833-3.333-11.333-12-18.5c-8.667-7.167-19.833-16.667-26.667-18.5c1.167,1.167,1.5,2.333,1.5,2.333c9.167,4.667,25.667,18.833,29.5,24.333s6.333,10,7.667,10.333z"/> + <path d="M68.441,165.532c-0.229-1.13-0.446-2.215-0.649-3.251c-1.987-0.381-3.908-1.266-5.172-1.943c0.2,1.172,0.399,2.327,0.595,3.453c1.945,0.734,3.919,1.353,5.227,1.741z"/> + <path d="M69.66,171.421c-2.355-0.877-4.315-1.616-5.454-2.046c0.217,1.205,0.426,2.347,0.622,3.412c2.266,0.833,4.26,1.692,5.618,2.308c-0.274-1.266-0.536-2.491-0.786-3.674z"/> + <path d="M61.589,154.129c2.229,0.848,3.901,1.444,4.997,1.822c-0.184-0.999-0.351-1.93-0.504-2.797c-1.253-0.34-2.919-0.923-4.952-1.916c0.151,0.962,0.304,1.927,0.46,2.891z"/> + <path d="M65.795,177.971c0.369,1.946,0.59,3.082,0.59,3.082s3.25,3.75,6.5,5c-0.317-1.384-0.622-2.732-0.916-4.042c-2.397-1.074-4.802-2.904-6.174-4.04z"/> + <path d="M64.884,145.852c-0.178-1.214-0.249-1.8-0.249-1.8l-4.75-1.25c0.093,0.678,0.189,1.366,0.288,2.06c1.966,0.497,3.552,0.803,4.711,0.99z"/> + <path d="M41.469,94.136c0.5,5.5,2.833,15.333,2.833,15.333l7.333,0.833l1.5,1.5c1-3.667,3.5-5.333,6.5-5.167s13.167,0,13.167,0c0.167-4.5,0.833-11,0.833-11c-2,4-3.5,4.833-6.333,4.167c-2.833-0.667-22.167-5.5-25.833-5.667z"/> + <path d="M44.303,90.636l2.167-2.833c11.667,1.5,25.333,5.667,25.333,5.667s-1,2.833-2.667,3.667c-12.333-2.667-24.833-6.5-24.833-6.5z"/> + <path d="M49.636,114.969c-0.5,2.167-0.5,8.5-0.5,8.5c3.333,0,4.833,0.5,4.667,1.833c1.5,0.167,2.833,1.5,2.833,1.5c2.833-0.333,5.167,1.333,9.167,1.5c4,0.167,5.5,2,8.5-0.667c-3.5,0.167-9.167-0.167-9.5-2.333c4.333-0.333,9.167,0.333,10.333-0.5 c0.833-1,0-1.667,0-1.667c-5.167,0-11.167-0.333-11-2c0.167-1.667,4.333-0.333,6.5-0.167c2.167,0.167,6,0.333,6.167-1.5c0.167-1.833-2.833-0.833-4.833-0.833s-7.5,0.167-7.333-1.5c0.167-1.667,2-1,5.5-0.833c3.5,0.167,6,0,6.167-1.333 c-3-0.5-7.5-1.333-9.833-1.667c-2.333-0.333-5.5-0.167-5.5-0.167c-0.5-1.667,1.333-2.833,4-2.167c2.667,0.667,5,0.667,5,0.667s3.5-0.667,2.5-1.667s-7.333-0.333-10.5-1c-3.167-0.667-6.167-0.333-6.833,2.167c-0.667,2.5-0.833,4.333-5.5,3.833z"/> + <path d="M52.969,128.302c-0.167,3-1.333,4.5-1.333,4.5c7,1.167,13.667,2,15.833,2.667c2.5-1.667,2.5-4,2.5-4c-6-0.167-11-1.167-17-3.167z"/> + <path d="M48.303,83.802c0.32-0.641,0.712-1.385,1.158-2.195c-3.615-2.958-6.491-4.972-6.491-4.972c0.531-1.044,1.041-2.015,1.535-2.927c2.657,2.698,5.046,4.441,6.417,5.345c0.384-0.646,0.789-1.311,1.211-1.984c-2.489-1.858-5.061-4.094-6.501-5.381 c0.501-0.871,0.986-1.675,1.458-2.414c2.28,2.454,5.479,4.286,6.863,5.014c0.36-0.527,0.728-1.049,1.1-1.563c-2.814-2.162-4.917-4.646-6.071-6.168c0.626-0.813,1.238-1.517,1.844-2.126c2.739,2.539,5.216,4.473,6.461,5.41c0.314-0.374,0.627-0.733,0.94-1.077 c-2.576-2.421-4.665-4.903-5.513-5.949c0.684-0.484,1.375-0.871,2.09-1.181c1.745,2.559,3.975,4.467,5.164,5.387c0.454-0.404,0.901-0.759,1.336-1.054l-3.5-4.167c0,0-4.5-1.167-11.167-2.333c-2.833,2.5-10.167,14-13.667,20.5s-5,22.5-5.167,28.167 c-0.167,5.667-0.833,12,0.5,15.333c0,0,0.506-0.025,1.369-0.083c0.068-3.272-0.202-6.251-0.202-6.251s0.64-0.07,1.667-0.163v6.307c0.644-0.051,1.375-0.113,2.167-0.188v-6.298c0.526-0.04,1.087-0.079,1.668-0.115l1.005,6.131c0.435-0.051,0.878-0.105,1.327-0.163 v-6.086c0.758-0.03,1.52-0.049,2.261-0.055l0.32,5.773c0.916-0.145,1.831-0.305,2.723-0.482l-0.111-5.215c0.679,0.048,1.292,0.12,1.806,0.223l0.974,4.384c0.064-0.017,0.129-0.034,0.192-0.051c0.167-2.667,0.333-6.333,1.667-8c0,0-4.333-0.833-7.833-1.667 c-3.5-0.833-7.167,1.333-7.167,1.333l-1-3.167c0,0,2.333-0.167,5.833-3.167c0,0,1.333-2.833,2.333-7c0,0,0.5-2.667-0.5-5c-1-2.333,0.167-4,1.667-4c0,0,1.667-1,2.833-4c-0.833-1-0.333-2.833-2.167-4.333l1-3.5c0,0,2.333,2.833,6.167,5.167z"/> + <path d="M72.469,87.636c-3-10-4.333-21.333-4.333-21.333c1.833,0.167,3-1.667,2.833-3.333c-0.167-1.667,0.167-3.833,0.167-3.833c2.5,0,6.833,2.667,6.5-2.167l1.833-0.5l-0.667,1.333c5.667,2.5,10.167,8,13,11c-0.167,3.167-1.333,4.833-1.333,4.833 c-7.5-8.5-10.667-11.667-17.5-13.5c-0.833-0.167-1.167,0.833-1.167,0.833c3.667,11.5,7.667,18.5,6.5,24.833c-1.167,1.833-5.833,1.833-5.833,1.833z"/> + <path d="M71.803,57.136c1.333-0.5,3.5-0.167,3.5-0.167v1c0,0-1.833,0.833-3.5-0.833z"/> + <path d="M69.303,59.469c-0.5,2-0.833,4.833-0.833,4.833c-2.833-0.5-7-2.167-8.333-5c-0.167-1.833-0.5-3.333-0.5-3.333c4.167,2.333,7.833,3.833,9.667,3.5z"/> + <path d="M61.041,22.638c1.264-0.02,4.413-0.208,7.262-1.502c-1.5-6.333-16.5-5.667-19-5.167s-6,3.833-7.333,6.667c0.407,0.078,0.821,0.147,1.241,0.209c0.353-0.971,0.765-1.43,0.967-1.61c0.539-0.141,1.064-0.269,1.579-0.386l-0.121,2.274 c0.448,0.038,0.897,0.069,1.347,0.094c0.278-0.639,0.836-1.885,1.368-2.879c0.916-0.149,1.796-0.258,2.648-0.325l-0.633,3.291c0.734-0.001,1.454-0.015,2.151-0.036l1.019-3.336c1.12,0.02,2.201,0.116,3.266,0.287v2.805c0.273-0.022,0.535-0.045,0.784-0.068 l1.205-2.329c0.706,0.176,1.409,0.385,2.118,0.627l0.132,1.386z"/> + <path d="M80.719,45.948c-1.216,1.93-3.617,3.119-4.833,3.229c0,0,1.265-2.633,3.503-5c0.58-0.479,0.58-1.229-0.12-1.646c-0.467,0.238-1.198,0.661-1.884,1.27c-1.125,1-2.75-0.25-3.25-1.5c0.781-1.45,3.351-1.408,4.961-1.827c0.622-0.527-0.128-1.34-0.128-1.34 c-2.833-3-7.167-4.333-7.167-6.833c0-1.414,0.373-2.507,0.697-3.191c-0.643,0.122-1.472-0.365-1.614-0.934c-0.201-0.805-0.323-1.369-1.407-2.732c-0.147,0.09-0.295,0.181-0.444,0.273c0.392,1.027,0.987,2.527,1.727,4.209c1.375,3.125-2.125,2.625-2.25,1.125 c-0.093-1.118-0.742-2.652-1.688-3.931c-0.119,0.078-0.237,0.157-0.356,0.236c0.75,1.878,1.31,4.497,1.793,6.819c0.625,3-2.375,2.25-2.625,1c-0.205-1.023-0.83-3.555-2.079-5.744c-0.127,0.098-0.253,0.196-0.379,0.296c0.56,2.288,0.947,5.64,1.333,7.573 c0.5,2.5-2.375,2.5-2.625,0.5c-0.212-1.696-0.245-2.944-1.242-5.878c-0.208,0.2-0.414,0.402-0.616,0.608c0.012,3.123-0.009,8.49-0.268,10.646c-0.375,3.125-2.875,2.375-2.75,1c0.109-1.197-0.161-3.154-0.068-7.767c-0.046,0.076-0.095,0.15-0.14,0.226 c-0.833,5.333-1.167,12.833,4.833,15.5s14.292,3.313,18,0.5c4.208-2.563,1.083-4.313,1.083-6.688z"/> + <g fill="#000"> + <path d="M108.89,146.162c-0.826-0.792-1.639-1.586-2.431-2.375c-3.331,1.829-7.613,3.162-9.51,3.705c0.6,0.995,1.222,2.013,1.855,3.04c5.627-1.592,8.655-3.34,10.085-4.369z"/> + <path d="M101.191,138.181c-2.182,1.709-5.985,3.141-7.535,3.682c0.5,0.895,1.054,1.857,1.647,2.868c4.203-1.098,7.043-2.515,8.666-3.492c-0.993-1.046-1.926-2.07-2.778-3.058z"/> + <path d="M102.346,156.194c5.876-1.628,9.702-4.044,11.53-5.404c-0.834-0.752-1.673-1.518-2.508-2.293c-2.729,2.457-8.69,4.159-10.893,4.725c0.627,1.002,1.253,1.998,1.871,2.973z"/> + <path d="M123.275,158.893c-3.958,2.792-11.935,5.487-15.034,6.474c1.168,1.793,1.895,2.894,1.895,2.894s12.5-3.333,16.5-6.667c-0.892-0.694-2.039-1.613-3.361-2.701z"/> + <path d="M117.5,154c-3.033,2.28-10.208,4.545-13.112,5.402c0.657,1.026,1.285,2.002,1.869,2.907c6.353-1.963,11.13-4.771,13.516-6.351c-0.735-0.626-1.496-1.281-2.273-1.958z"/> + <path d="M99.333,135.915c-0.582-0.755-1.097-1.476-1.531-2.154c-2.333,1.5-6.667,3-6.667,3c0.173,0.519,0.483,1.221,0.902,2.066c2.759-0.008,4.985-0.774,7.296-2.913z"/> + <path d="M66.386,44.677c2.125-1.75,5.375-4.25,5.125-7.25l-1.25-0.625l-0.125-0.75c-5.125,3.25-7.75,4.375-8.5,5c0.875,1.875,2.5,1.375,2.5,1.375c2.125-1.125,4-2.375,4-2.375c-1.875,2.125-2.5,3.125-2.5,3.125s-0.125,0.875,0.75,1.5z"/> + </g> + </g> + </g> + <g id="vis" transform="translate(153,58) rotate(-27) scale(0.05)" stroke="rgb(66,105,66)" font-family="dialog, sans-serif" font-size="10"> + <g fill="rgb(115,191,115)"> + <ellipse cx="195" cy="210" rx="27" ry="18"/> + <ellipse cx="645" cy="102" rx="225" ry="18"/> + <ellipse cx="645" cy="156" rx="230" ry="18"/> + </g> + <g fill="rgb(255,223,123)" stroke="rgb(132,117,66)"> + <rect height="36" width="100" x="595" y="192"/> + <rect height="36" width="276" x="507" y="246"/> + <rect height="36" width="106" x="592" y="300"/> + </g> + <g fill="none" stroke="rgb(90,89,206)"> + <path d="M201 193C212 170 215 158 240 143 279 122 377 112 428 107"/> + <path d="M216 200C224 196 232 193 240 191 311 174 390 165 423 161"/> + <path d="M221 210C295 210 497 210 595 210"/> + <path d="M221 210C295 210 497 210 595 210"/> + <path d="M216 220C224 224 232 227 240 229 334 252 444 261 506 264"/> + <path d="M201 227C212 253 215 265 240 280 352 344 508 337 592 325"/> + </g> + <g fill="rgb(90,89,206)" stroke="none"> + <polygon points="433,107 425,111 425,103"/> + <polygon points="428,160 421,165 420,157"/> + <polygon points="600,210 592,214 592,206"/> + <polygon points="511,264 503,268 503,260"/> + <polygon points="597,324 590,329 588,321"/> + </g> + <g fill="rgb(66,105,66)"> + <text x="458" y="105">http://prismstandard.org/vocabularies/1.0/resourcetype.xml#birdsEye</text> + <text x="453" y="159">http://prismstandard.org/vocabularies/1.0/resourcetype.xml#illustration</text> + <text x="604" y="213">image/svg+xml</text> + <text x="530" y="267">Line drawing of woman in antique attire, ...</text> + <text x="177" y="213">online:</text> + <text x="601" y="321">Sibyll Trelawney</text> + </g> + <g stroke="rgb(90,89,206)" fill="rgb(90,89,206)"> + <text x="256" y="158">http://purl.org/dc/elements/1.1/type</text> + <text x="250" y="206">http://purl.org/dc/elements/1.1/format</text> + <text x="250" y="276">http://purl.org/dc/elements/1.1/subject</text> + <text x="256" y="105">http://purl.org/dc/elements/1.1/type</text> + <text x="240" y="225">http://purl.org/dc/elements/1.1/description</text> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-control-01-f-manual.svg b/testing/web-platform/tests/svg/import/painting-control-01-f-manual.svg new file mode 100644 index 000000000..07c1261d5 --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-control-01-f-manual.svg @@ -0,0 +1,107 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" + version="$Revision: 1.4 $" testname="$RCSfile: painting-control-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#VisibilityControl"> + <p> + Elements are rendered when the 'display' attribute is set to any valid value other than 'none'. + </p> + <p> + For each valid 'display' value (except none), the test creates a 'rect' element with that 'display' value assigned. Under that + element, a red 'rect' is placed at the exact same 'x', 'y' position with the same height and width. Test passes if the 'rect' + with 'display' covers the red 'rect'. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if 16 black rectangles are shown and there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-control-01-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <rect width="48px" height="48px" fill="red" /> + <rect width="48px" height="48px" display="inline" /> + + <rect x="50px" width="48px" height="48px" fill="red" /> + <rect x="50px" width="48px" height="48px" display="block" /> + + <rect x="100px" width="48px" height="48px" fill="red" /> + <rect x="100px" width="48px" height="48px" display="list-item" /> + + <rect x="150px" width="48px" height="48px" fill="red" /> + <rect x="150px" width="48px" height="48px" display="run-in" /> + + <rect y="50px" width="48px" height="48px" fill="red" /> + <rect y="50px" width="48px" height="48px" display="compact" /> + + <rect x="50px" y="50px" width="48px" height="48px" fill="red" /> + <rect x="50px" y="50px" width="48px" height="48px" display="marker" /> + + <rect x="100px" y="50px" width="48px" height="48px" fill="red" /> + <rect x="100px" y="50px" width="48px" height="48px" display="table" /> + + <rect x="150px" y="50px" width="48px" height="48px" fill="red" /> + <rect x="150px" y="50px" width="48px" height="48px" display="inline-table" /> + + <rect y="100px" width="48px" height="48px" fill="red" /> + <rect y="100px" width="48px" height="48px" display="table-row-group" /> + + <rect x="50px" y="100px" width="48px" height="48px" fill="red" /> + <rect x="50px" y="100px" width="48px" height="48px" display="table-header-group" /> + + <rect x="100px" y="100px" width="48px" height="48px" fill="red" /> + <rect x="100px" y="100px" width="48px" height="48px" display="table-footer-group" /> + + <rect x="150px" y="100px" width="48px" height="48px" fill="red" /> + <rect x="150px" y="100px" width="48px" height="48px" display="table-row" /> + + <rect y="150px" width="48px" height="48px" fill="red" /> + <rect y="150px" width="48px" height="48px" display="table-column-group" /> + + <rect x="50px" y="150px" width="48px" height="48px" fill="red" /> + <rect x="50px" y="150px" width="48px" height="48px" display="table-column" /> + + <rect x="100px" y="150px" width="48px" height="48px" fill="red" /> + <rect x="100px" y="150px" width="48px" height="48px" display="table-cell" /> + + <rect x="150px" y="150px" width="48px" height="48px" fill="red" /> + <rect x="150px" y="150px" width="48px" height="48px" display="table-caption" /> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-control-02-f-manual.svg b/testing/web-platform/tests/svg/import/painting-control-02-f-manual.svg new file mode 100644 index 000000000..8177e60bf --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-control-02-f-manual.svg @@ -0,0 +1,65 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: painting-control-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#StrokeProperties"> + <p> + 'Stroke' attributes affected by directionality start at the point at which the graphics element starts. + </p> + <p> + The test creates two 'path' elements that have the same 'stroke-dasharray' assignment. The paths will create the same visual shape, + but the start and end points will be opposite. Test passes if the 'stroke-dasharray' of each path is drawn differently. + Second subtest is the same but with stroke-dashoffset. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there are two lines, each composed of alternating black and orange boxes. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-control-02-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <path d="M 100 100 L 100 190" fill="none" stroke="orange" stroke-width="20" stroke-dasharray="10px 20px 20px" /> + <path d="M 100 190 L 100 100" fill="none" stroke="black" stroke-width="20" stroke-dasharray="10px 20px 20px" /> + + <path d="M 200 100 L 200 190" fill="none" stroke="orange" stroke-width="20" stroke-dashoffset="5px" stroke-dasharray="10px 10px 10px" /> + <path d="M 200 190 L 200 100" fill="none" stroke="black" stroke-width="20" stroke-dashoffset="5px" stroke-dasharray="10px 10px 10px" /> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-control-03-f-manual.svg b/testing/web-platform/tests/svg/import/painting-control-03-f-manual.svg new file mode 100644 index 000000000..d76402359 --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-control-03-f-manual.svg @@ -0,0 +1,65 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: painting-control-03-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#FillProperties"> + <p> + Open polyline and path elements are filled as if they were closed with the last point linked to the first point. + </p> + <p> + The test specifies two polylines and two paths on the page with five points each. One polyline/path closes the shape with the fifth + point linking to the first. One polyline/path is open (no link from fifth point to first). Both polylines/paths are filled. + The open subpath is placed over the closed one. Test passes if the open subpath fills over the closed path. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if two black shapes are shown and no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-control-03-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <path d="M 20 100 L 50 150 L 100 200 L 175 175 L 150 150 z" fill="red" /> + <path d="M 20 100 L 50 150 L 100 200 L 175 175 L 150 150" fill="black" stroke="black" /> + + <polyline points="200 100 250 150 300 200 375 175 350 150 " fill="red" /> + <polyline points="200 100 250 150 300 200 375 175 350 150 200 100" fill="black" stroke="black" /> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-control-04-f-manual.svg b/testing/web-platform/tests/svg/import/painting-control-04-f-manual.svg new file mode 100644 index 000000000..95b526281 --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-control-04-f-manual.svg @@ -0,0 +1,58 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" + version="$Revision: 1.4 $" testname="$RCSfile: painting-control-04-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#StrokeProperties"> + <p> + A zero length subpath with 'stroke-linecap' set to 'square' or 'round' is stroked, but not stroked when 'stroke-linecap' is set to 'butt'. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is a blue circle, a blue square, and no red on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-control-04-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <path d="M 96 96 L 96 96" stroke="red" stroke-width="96" stroke-linecap="butt" /> + <path d="M 196 96 L 196 96" stroke="blue" stroke-width="96" stroke-linecap="round" /> + <path d="M 296 96 L 296 96" stroke="blue" stroke-width="96" stroke-linecap="square" /> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-control-05-f-manual.svg b/testing/web-platform/tests/svg/import/painting-control-05-f-manual.svg new file mode 100644 index 000000000..48a984d21 --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-control-05-f-manual.svg @@ -0,0 +1,114 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="ED" author="Microsoft" status="accepted" version="$Revision: 1.3 $" testname="$RCSfile: painting-control-05-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#VisibilityControl"> + <p> + This tests setting the 'display' property to 'none' on an element that is a child of a 'mask' or 'clipPath' element, which should cause the element to not be + included in the 'mask' or 'clip' region. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there are 8 green rectangles visible, and no red. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-control-05-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <rect id="displaynone_rect" width="100%" height="100%" display="none" /> + <rect id="rect" width="100%" height="100%" /> + <use id="displaynone_use_rect" xlink:href="#displaynone_rect"/> + + <!-- an empty mask where the basic shape element has display=none --> + <mask id="testMask1"> + <rect width="100%" height="100%" display="none" fill="white" /> + </mask> + <!-- an empty mask where display=none is inherited down to the basic shape --> + <mask id="testMask2"> + <g display="none"> + <rect width="100%" height="100%" fill="white" /> + </g> + </mask> + <!-- an empty mask where the referenced element has display=none --> + <mask id="testMask3"> + <use xlink:href="#displaynone_rect" fill="white"/> + </mask> + <!-- an empty mask by two levels of indirection --> + <mask id="testMask4"> + <use xlink:href="#displaynone_use_rect" fill="white"/> + </mask> + + <!-- an empty clip-path where the basic shape element has display=none --> + <clipPath id="testClip1"> + <rect width="100%" height="100%" display="none" /> + </clipPath> + <!-- an empty clip-path where the referenced element has display=none --> + <clipPath id="testClip2"> + <use xlink:href="#displaynone_rect"/> + </clipPath> + <!-- an empty clip-path where the referencing element has display=none --> + <clipPath id="testClip3"> + <use xlink:href="#rect" display="none"/> + </clipPath> + <!-- an empty clip-path by having both a display=none element and a non-rendered rect that's visible --> + <clipPath id="testClip4"> + <rect width="100%" height="100%" display="none" /> + <rect width="0" height="0"/> + </clipPath> + </defs> + + <g id="reference" fill="lime" stroke="black"> + <rect x="50" y="50" width="100" height="100"/> + <rect x="150" y="50" width="100" height="100"/> + <rect x="250" y="50" width="100" height="100"/> + <rect x="350" y="50" width="100" height="100"/> + <rect x="50" y="200" width="100" height="100"/> + <rect x="150" y="200" width="100" height="100"/> + <rect x="250" y="200" width="100" height="100"/> + <rect x="350" y="200" width="100" height="100"/> + </g> + + <rect x="50" y="50" width="100" height="100" fill="red" mask="url(#testMask1)"/> + <rect x="150" y="50" width="100" height="100" fill="red" mask="url(#testMask2)"/> + <rect x="250" y="50" width="100" height="100" fill="red" mask="url(#testMask3)"/> + <rect x="350" y="50" width="100" height="100" fill="red" mask="url(#testMask4)"/> + + <rect x="50" y="200" width="100" height="100" fill="red" clip-path="url(#testClip1)"/> + <rect x="150" y="200" width="100" height="100" fill="red" clip-path="url(#testClip2)"/> + <rect x="250" y="200" width="100" height="100" fill="red" clip-path="url(#testClip3)"/> + <rect x="350" y="200" width="100" height="100" fill="red" clip-path="url(#testClip4)"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-control-06-f-manual.svg b/testing/web-platform/tests/svg/import/painting-control-06-f-manual.svg new file mode 100644 index 000000000..58e4efd32 --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-control-06-f-manual.svg @@ -0,0 +1,64 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" + reviewer="ED" author="Microsoft" status="accepted" version="$Revision: 1.4 $" testname="$RCSfile: painting-control-06-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#VisibilityControl"> + <p> + Setting the 'visibility' property to 'hidden' on a 'g' tag will affect its children, unless the children of the 'g' tag override the parent setting. + </p> + <p> + Have a 'g' tag with an red filled shape as a child. Set 'visibility: hidden' on the 'g' tag. Verify no red is on the page. + Also, have a 'g' tag with a green filled shape as a child. Set 'visibility: hidden' on the 'g' tag. Set 'visibility: visible' on + the child tag. Verify that the green 'rect' renders on the page. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there are two green squares visible on the page, and no red. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-control-06-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <rect x="96" y="96" width="96" height="96" fill="lime" /> + <g visibility="hidden"> + <rect x="96" y="96" width="96" height="96" fill="red" /> + </g> + <rect x="196.5" y="196.5" width="95" height="95" fill="red"/> + <g visibility="hidden"> + <rect x="196" y="196" width="96" height="96" fill="lime" visibility="visible" /> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-fill-01-t-manual.svg b/testing/web-platform/tests/svg/import/painting-fill-01-t-manual.svg new file mode 100644 index 000000000..bb66cb0d9 --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-fill-01-t-manual.svg @@ -0,0 +1,65 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Kevin McCluskey" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: painting-fill-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#FillProperties"> + <p> + Verify the basic capability to handle the fill properties fill:none, + and fill with a color (fill:green) + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + There should be two rectangles, the rectangle on the left hollow (fill:none) and the rectangle on the right filled with green. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-fill-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-size="36" x="40" y="42">Basic paint: fill properties.</text> + + <!-- ============================================================================= --> + <!-- Draw two simple rectangles. One without fill other with fill:green --> + <!-- ============================================================================= --> + + <rect id="fill-01" fill="none" stroke="#000000" x="75" y="70" width="100" height="160"/> + + <rect id="fill-02" fill="green" stroke="#000000" x="275" y="70" width="100" height="160"/> + + <text font-size="36" x="75" y="280">fill="none"</text> + <text font-size="36" x="275" y="280">fill="green"</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-fill-02-t-manual.svg b/testing/web-platform/tests/svg/import/painting-fill-02-t-manual.svg new file mode 100644 index 000000000..36413ac73 --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-fill-02-t-manual.svg @@ -0,0 +1,69 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Kevin McCluskey" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: painting-fill-02-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#FillProperties"> + <p> + The test uses the "currentColor" value for the "fill" attribute. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rectangle on the left should be green filled, the rectangle on the right should be blue. + The text above the rectangles should be black. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-fill-02-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g color="green"> + + <text font-family="Arial" font-size="36" x="30" y="42">Basic paint: fill properties.</text> + <text font-family="Arial" font-size="36" x="100" y="80">fill="currentColor"</text> + + <!-- ====================================================================== --> + <!-- Second set of rectangles with fill:currentColor --> + <!-- ====================================================================== --> + + <rect id="fill-03" fill="currentColor" stroke="#000000" x="75" y="110" width="100" height="140"/> + <rect id="fill-04" color="blue" fill="currentColor" stroke="#000000" x="275" y="110" width="100" height="140"/> + + <text font-family="Arial" font-size="36" x="80" y="280">green</text> + <text font-family="Arial" font-size="36" x="290" y="280">blue</text> + + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-fill-03-t-manual.svg b/testing/web-platform/tests/svg/import/painting-fill-03-t-manual.svg new file mode 100644 index 000000000..158f7cf4d --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-fill-03-t-manual.svg @@ -0,0 +1,62 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Kevin McCluskey" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: painting-fill-03-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#FillProperties"> + <p> + Verify the basic capability to handle the fill rule properties evenodd and nonzero + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + There should be two green filled stars, the leftmost star should be unfilled in the very center. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-fill-03-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-size="36" x="30" y="42">Basic paint: fill properties.</text> + + <!-- ====================================================================== --> + <!-- Third test fill-rule:evenodd and fill-rule:nonzero --> + <!-- ====================================================================== --> + + <path fill="lime" fill-rule="evenodd" d="M 110 75 l 50 160 l -130 -100 l 160 0 l -130 100 z"/> + <path fill="lime" fill-rule="nonzero" d="M 365 75 l 50 160 l -130 -100 l 160 0 l -130 100 z"/> + <text font-size="24" x="10" y="282">fill-rule="evenodd"</text> + <text font-size="24" x="260" y="282">fill-rule="nonzero"</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-fill-04-t-manual.svg b/testing/web-platform/tests/svg/import/painting-fill-04-t-manual.svg new file mode 100644 index 000000000..73381091e --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-fill-04-t-manual.svg @@ -0,0 +1,74 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Tim Thompson" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: painting-fill-04-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#FillProperties"> + <p> + This tests inheritance of three properties: "fill", "stroke" and "stroke-width". There is a "g" element (id="G1") which + sets fill="blue", stroke="purple", and stroke-width="5". The first two rectangles on top should inherit all those + properties. The middle left rectangle has fill="yellow" and stroke-width="2", it should inherit the stroke="purple" + from the parent container. The middle rectangle on the right has stroke="yellow", it should inherit fill and + stroke-width from the parent "g". The bottom two rectangles are in another "g" element (id="G2") which is a child + of "G1". "G2" sets fill="yellow". It should inherit the stroke and stroke width from the parent "G1". The two + bottom rectangles set no fill or stroke properties, they should inherit through the parents, stroke="purple" + and stroke-width="5". + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image, except for possible + variations in the labeling text (per CSS2 rules). + </p> + <p> + The test uses the "rect" element, as well as basic fill (solid primary colors), + stroke (black 1-pixel lines), font-family (Arial) and font-size properties. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-fill-04-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g id="G1" fill="blue" stroke="purple" stroke-width="5" transform="translate(120,30)"> + <rect x="0" y="0" width="90" height="70"/> + <rect x="100" y="0" width="90" height="70"/> + <rect x="0" y="80" width="90" height="70" fill="yellow" stroke-width="2"/> + <rect x="100" y="80" width="90" height="70" stroke="yellow"/> + <g id="G2" fill="yellow"> + <rect x="0" y="160" width="90" height="70"/> + <rect x="100" y="160" width="90" height="70"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-fill-05-b-manual.svg b/testing/web-platform/tests/svg/import/painting-fill-05-b-manual.svg new file mode 100644 index 000000000..a508b69b9 --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-fill-05-b-manual.svg @@ -0,0 +1,75 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="DJ" author="CN" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: painting-fill-05-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#FillProperties"> + <p> + Test using "fill-opacity" values for "rect" element. + This test verifies that opacity is clamped to the + specified range. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The six rect elements on the left have varying 'fill-opacity' values + within the valid range of 0 to 1. The six elements on the right have + 'fill-opacity' values outside the 0 to 1 range, and must be clamped. + The top three rect elements on the right must have their 'fill-opacity' + clamped to 0, while the bottom three rect elements on the right must + be clamped to 1. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-fill-05-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <!-- Use multiple values for opacity --> + <rect x="20" y="20" width="60" height="60" fill-opacity="0.0" fill="#0000FF" stroke="black"/> + <rect x="50" y="50" width="60" height="60" fill-opacity="0.2" fill="#0000FF" stroke="black"/> + <rect x="80" y="80" width="60" height="60" fill-opacity="0.4" fill="#0000FF" stroke="black"/> + <rect x="110" y="110" width="60" height="60" fill-opacity="0.6" fill="#0000FF" stroke="black"/> + <rect x="140" y="140" width="60" height="60" fill-opacity="0.8" fill="#0000FF" stroke="black"/> + <rect x="170" y="170" width="60" height="60" fill-opacity="1.0" fill="#0000FF" stroke="black"/> + <!-- Values outside the range 0.0 - 1.0 should be clamped to this range --> + <rect x="200" y="20" width="60" height="60" fill-opacity="-100.0" fill="#0000FF" stroke="black"/> + <rect x="230" y="50" width="60" height="60" fill-opacity="-10.0" fill="#0000FF" stroke="black"/> + <rect x="260" y="80" width="60" height="60" fill-opacity="-0.1" fill="#0000FF" stroke="black"/> + <rect x="290" y="110" width="60" height="60" fill-opacity="1.1" fill="#0000FF" stroke="black"/> + <rect x="320" y="140" width="60" height="60" fill-opacity="10.0" fill="#0000FF" stroke="black"/> + <rect x="350" y="170" width="60" height="60" fill-opacity="100.0" fill="#0000FF" stroke="black"/> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-marker-01-f-manual.svg b/testing/web-platform/tests/svg/import/painting-marker-01-f-manual.svg new file mode 100644 index 000000000..b48c390fc --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-marker-01-f-manual.svg @@ -0,0 +1,157 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Dean Jackson" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: painting-marker-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#Markers"> + <p> + Tests the basic support for markers. + </p> + <p> + The top test examines the basic support for the marker element and style. The markers are purple rectangles. + </p> + <p> + The middle test examines the support for the different styles of marker properties. The + "marker-start" property defines the marker to use at the first vertex of the marked path, + in this case a purple rectangle. The "marker-end" property defines the marker to use at the + last vertex of the marked path, in this case a blue triangle. The "marker-mid" property + defines the marker to use at all vertices, other than the first and last, of the marked path, + in this case a green circle. + </p> + <p> + The bottom test examines the support for marker orientation along the + path direction. The second vertex, the top right corner of the path, has a marker that + is rotated 45 degrees, since that is the average of the horizontal and vertical segments + each side. The last vertex, the bottom right corner of the path, has a marker rotated 90 + degrees since that is the direction of the last path segment. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + For the three tests, there should be two identical paths with markers drawn. + The path on the left is rendered using the marker elements. The path on the + right is rendered using the equivalent SVG, showing what the marked path should + look like. + </p> + <p> + The rendered picture should match the reference image, except for possible + variations in the labelling text (per CSS2 rules). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-marker-01-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <!-- ===================================================================== --> + <!-- Define a few simple marker elements --> + <!-- ===================================================================== --> + <marker id="marker1" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="5" refY="5" markerUnits="strokeWidth"> + <rect width="10" height="10" fill="purple" stroke="none"/> + </marker> + <marker id="marker2" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="5" refY="5" markerUnits="strokeWidth" orient="auto"> + <path d="M 5 0 L 10 10 L 0 10 Z" fill="blue" stroke="none"/> + </marker> + <marker id="markerStart" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="5" refY="5" markerUnits="strokeWidth"> + <rect width="10" height="10" fill="purple" stroke="none"/> + </marker> + <marker id="markerMiddle" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="5" refY="5" markerUnits="strokeWidth"> + <circle cx="5" cy="5" r="5" fill="green" stroke="none"/> + </marker> + <marker id="markerEnd" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="5" refY="5" markerUnits="strokeWidth"> + <path d="M 5 0 L 10 10 L 0 10 Z" fill="blue" stroke="none"/> + </marker> + </defs> + <!-- ===================================================================== --> + <!-- Basic Marker Test --> + <!-- ===================================================================== --> + <text x="170" y="30" font-size="14">Basic Markers</text> + <path fill="none" stroke="black" stroke-width="8" marker-start="url(#marker1)" marker-mid="url(#marker1)" marker-end="url(#marker1)" d="M 130 40 L 180 40 L 180 90"/> + <!-- ===================================================================== --> + <!-- Generate the equivalent SVG --> + <!-- ===================================================================== --> + <g transform="translate(120,0)"> + <path fill="none" stroke="black" stroke-width="8" d="M 130 40 L 180 40 L 180 90"/> + <g transform="translate(130,40) scale(8) scale(0.2, 0.2) translate(-5, -5)" fill="none" stroke="black" stroke-width="8"> + <rect width="10" height="10" fill="purple" stroke="none"/> + </g> + <g transform="translate(180,40) scale(8) scale(0.2, 0.2) translate(-5, -5)" fill="none" stroke="black" stroke-width="8"> + <rect width="10" height="10" fill="purple" stroke="none"/> + </g> + <g transform="translate(180,90) scale(8) scale(0.2, 0.2) translate(-5, -5)" fill="none" stroke="black" stroke-width="8"> + <rect width="10" height="10" fill="purple" stroke="none"/> + </g> + </g> + <!-- ===================================================================== --> + <!-- Start, Middle and End Marker Test --> + <!-- ===================================================================== --> + <text x="145" y="125" font-size="14">Start, Middle and End</text> + <path fill="none" stroke="black" stroke-width="8" marker-start="url(#markerStart)" marker-mid="url(#markerMiddle)" marker-end="url(#markerEnd)" d="M 130 135 L 180 135 L 180 185"/> + <!-- ===================================================================== --> + <!-- Generate the equivalent SVG --> + <!-- ===================================================================== --> + <g transform="translate(120,0)"> + <path fill="none" stroke="black" stroke-width="8" d="M 130 135 L 180 135 L 180 185"/> + <g transform="translate(130,135) scale(8) scale(0.2, 0.2) translate(-5, -5)" fill="none" stroke="black" stroke-width="8"> + <rect width="10" height="10" fill="purple" stroke="none"/> + </g> + <g transform="translate(180,135) scale(8) scale(0.2, 0.2) translate(-5, -5)" fill="none" stroke="black" stroke-width="8"> + <circle cx="5" cy="5" r="5" fill="green" stroke="none"/> + </g> + <g transform="translate(180,185) scale(8) scale(0.2, 0.2) translate(-5, -5)" fill="none" stroke="black" stroke-width="8"> + <path d="M 5 0 L 10 10 L 0 10 Z" fill="blue" stroke="none"/> + </g> + </g> + <!-- ===================================================================== --> + <!-- Auto Orientation Marker Test --> + <!-- ===================================================================== --> + <text x="145" y="220" font-size="14">Automatic Orientation</text> + <path fill="none" stroke="black" stroke-width="8" marker-start="url(#marker2)" marker-mid="url(#marker2)" marker-end="url(#marker2)" d="M 130 230 L 180 230 L 180 280"/> + <!-- ===================================================================== --> + <!-- Generate the equivalent SVG --> + <!-- ===================================================================== --> + <g transform="translate(120,0)"> + <path fill="none" stroke="black" stroke-width="8" d="M 130 230 L 180 230 L 180 280"/> + <g transform="translate(130,230) rotate(0) scale(8) scale(0.2, 0.2) translate(-5, -5)" fill="none" stroke="black" stroke-width="8"> + <path d="M 5 0 L 10 10 L 0 10 Z" fill="blue" stroke="none"/> + </g> + <g transform="translate(180,230) rotate(45) scale(8) scale(0.2, 0.2) translate(-5, -5)" fill="none" stroke="black" stroke-width="8"> + <path d="M 5 0 L 10 10 L 0 10 Z" fill="blue" stroke="none"/> + </g> + <g transform="translate(180,280) rotate(90) scale(8) scale(0.2, 0.2) translate(-5, -5)" fill="none" stroke="black" stroke-width="8"> + <path d="M 5 0 L 10 10 L 0 10 Z" fill="blue" stroke="none"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-marker-02-f-manual.svg b/testing/web-platform/tests/svg/import/painting-marker-02-f-manual.svg new file mode 100644 index 000000000..bab08fc27 --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-marker-02-f-manual.svg @@ -0,0 +1,245 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Dean Jackson" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: painting-marker-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#Markers"> + <p> + Tests the rendering of markers, specifically property inheritance. For the four tests, there should + be two identical paths with markers drawn. + </p> + <p> + The top two tests examine the rendering of markers when the marker and the path + referencing it share the same parent and all painting properties are specfied on + that parent. The first test show inheritance of the 'fill' property and the + second the inheritance of the 'paint' property. In both tests, the marker + is painting using the same properties as the referencing object. Because of + scaling transformations on the marker, the stroke on the second test is thinner + than on the referencing object. + </p> + <p> + The third and fourth tests examine the rendering of markers in a situation where the + marker and referencing path do NOT share the same parent and painting + properties are specified both on the parent of the marked path and on the contents + of the marker itself. In both cases, the marker's parent specifies + fill="green" stroke="blue" stroke-width="8". For the third test, the marker contents + override with stroke="black". For the fourth test, the marker contents + override with fill="black". In neither case should you see + fill="orange" or stroke="blue" or "stroke="purple" on the markers as these properties + are specified on the ancestor of the referencing object or the referencing object itself + and thus shouldn't affect the marker. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The path on the left is rendered using the marker elements. + The path on the right is rendered using the equivalent SVG, + showing what the marked path should look like. These should be + identical and match the image to the right. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-marker-02-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <clipPath id="overflowHiddenClip1" clipPathUnits="userSpaceOnUse"> + <rect x="0" y="0" width="2" height="2"/> + </clipPath> + <clipPath id="overflowHiddenClip" clipPathUnits="userSpaceOnUse"> + <rect x="0" y="0" width="4" height="4"/> + </clipPath> + </defs> + <g fill="green"> + <text x="125" y="30" font-size="14" fill="black">Marker Rendering Properties</text> + <!-- ===================================================================== --> + <!-- Fill property --> + <!-- ===================================================================== --> + <g fill="black" stroke="none" stroke-width="8"> + <marker id="marker1" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="5" refY="5" markerUnits="strokeWidth"> + <rect width="10" height="10"/> + </marker> + <text x="100" y="140" font-size="10" fill="black" stroke="none">Fill Property</text> + <path marker-start="url(#marker1)" marker-mid="url(#marker1)" marker-end="url(#marker1)" d="M 30 60 L 80 60 L 80 110 Z"/> + <!-- ===================================================================== --> + <!-- Generate the equivalent SVG --> + <!-- ===================================================================== --> + <g transform="translate(120,0)"> + <path d="M 30 60 L 80 60 L 80 110 Z"/> + <g transform="translate(30,60) scale(8) translate(-1, -1)"> + <g clip-path="url(#overflowHiddenClip1)"> + <g transform="scale(0.2, 0.2)"> + <rect width="10" height="10"/> + </g> + </g> + </g> + <g transform="translate(80,60) scale(8) translate(-1, -1)"> + <g clip-path="url(#overflowHiddenClip1)"> + <g transform="scale(0.2, 0.2)"> + <rect width="10" height="10"/> + </g> + </g> + </g> + <g transform="translate(80,110) scale(8) translate(-1, -1)"> + <g clip-path="url(#overflowHiddenClip1)"> + <g transform="scale(0.2, 0.2)"> + <rect width="10" height="10"/> + </g> + </g> + </g> + </g> + </g> + <!-- ===================================================================== --> + <!-- Stroke property --> + <!-- ===================================================================== --> + <g fill="none" stroke="black" stroke-width="4"> + <marker id="marker2" viewBox="0 0 20 20" markerWidth="4" markerHeight="4" refX="10" refY="10" markerUnits="strokeWidth"> + <rect width="20" height="20"/> + </marker> + <text x="340" y="140" font-size="10" fill="black" stroke="none">Stroke Property</text> + <path marker-start="url(#marker2)" marker-mid="url(#marker2)" marker-end="url(#marker2)" d="M 270 60 L 320 60 L 320 110 Z"/> + <!-- ===================================================================== --> + <!-- Generate the equivalent SVG --> + <!-- ===================================================================== --> + <g transform="translate(120,0)"> + <path d="M 270 60 L 320 60 L 320 110 Z"/> + <!-- ===================================================================== --> + <!-- Generate the equivalent SVG --> + <!-- ===================================================================== --> + <g transform="translate(270,60) scale(4) translate(-2, -2)"> + <g clip-path="url(#overflowHiddenClip)"> + <g transform="scale(0.2, 0.2)"> + <rect width="20" height="20"/> + </g> + </g> + </g> + <g transform="translate(320,60) scale(4) translate(-2, -2)"> + <g clip-path="url(#overflowHiddenClip)"> + <g transform="scale(0.2, 0.2)"> + <rect width="20" height="20"/> + </g> + </g> + </g> + <g transform="translate(320, 110) scale(4) translate(-2, -2)"> + <g clip-path="url(#overflowHiddenClip)"> + <g transform="scale(0.2, 0.2)"> + <rect width="20" height="20"/> + </g> + </g> + </g> + </g> + </g> + <!-- ===================================================================== --> + <!-- Define marker element with parents setting painting properties --> + <!-- ===================================================================== --> + <g fill="green" stroke="blue" stroke-width="8"> + <marker id="marker3" viewBox="0 0 20 20" markerWidth="4" markerHeight="4" refX="10" refY="10" markerUnits="strokeWidth"> + <rect width="20" height="20" stroke="black"/> + </marker> + <marker id="marker4" viewBox="0 0 10 10" markerWidth="4" markerHeight="4" refX="5" refY="5" markerUnits="strokeWidth"> + <rect width="10" height="10" fill="black" stroke-width="4"/> + </marker> + </g> + <!-- ===================================================================== --> + <!-- Parent and specified properties --> + <!-- ===================================================================== --> + <g fill="orange" stroke="blue"> + <text x="90" y="270" font-size="10" fill="black" stroke="none">Mixed Properties</text> + <path stroke="purple" stroke-width="4" marker-start="url(#marker3)" marker-mid="url(#marker3)" marker-end="url(#marker3)" d="M 30 190 L 80 190 L 80 240 Z"/> + <!-- ===================================================================== --> + <!-- Generate the equivalent SVG --> + <!-- ===================================================================== --> + <g transform="translate(120,0)"> + <path stroke="purple" stroke-width="4" d="M 30 190 L 80 190 L 80 240 Z"/> + <g fill="green" stroke="black" stroke-width="8"> + <g transform="translate(30,190) scale(4) translate(-2, -2)"> + <g clip-path="url(#overflowHiddenClip)"> + <g transform="scale(.2, .2)"> + <rect width="20" height="20"/> + </g> + </g> + </g> + <g transform="translate(80,190) scale(4) translate(-2, -2)"> + <g clip-path="url(#overflowHiddenClip)"> + <g transform="scale(0.2, 0.2)"> + <rect width="20" height="20"/> + </g> + </g> + </g> + <g transform="translate(80,240) scale(4) translate(-2, -2)"> + <g clip-path="url(#overflowHiddenClip)"> + <g transform="scale(0.2, 0.2)"> + <rect width="20" height="20"/> + </g> + </g> + </g> + </g> + </g> + </g> + <g fill="orange" stroke="green"> + <text x="340" y="270" font-size="10" fill="black" stroke="none">Mixed Properties</text> + <path stroke="purple" stroke-width="4" marker-start="url(#marker4)" marker-mid="url(#marker4)" marker-end="url(#marker4)" d="M 270 190 L 320 190 L 320 240 Z"/> + <!-- ===================================================================== --> + <!-- Generate the equivalent SVG --> + <!-- ===================================================================== --> + <g transform="translate(120,0)"> + <path stroke="purple" stroke-width="4" d="M 270 190 L 320 190 L 320 240 Z"/> + <g fill="black" stroke="blue" stroke-width="4"> + <g transform="translate(270,190) scale(4) translate(-2, -2)"> + <g clip-path="url(#overflowHiddenClip)"> + <g transform="scale(0.4, 0.4)"> + <rect width="10" height="10"/> + </g> + </g> + </g> + <g transform="translate(320,190) scale(4) translate(-2, -2)"> + <g clip-path="url(#overflowHiddenClip)"> + <g transform="scale(0.4, 0.4)"> + <rect width="10" height="10"/> + </g> + </g> + </g> + <g transform="translate(320,240) scale(4) translate(-2, -2)"> + <g clip-path="url(#overflowHiddenClip)"> + <g transform="scale(0.4, 0.4)"> + <rect width="10" height="10"/> + </g> + </g> + </g> + </g> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-marker-03-f-manual.svg b/testing/web-platform/tests/svg/import/painting-marker-03-f-manual.svg new file mode 100644 index 000000000..220935193 --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-marker-03-f-manual.svg @@ -0,0 +1,86 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="DJ" author="BB" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: painting-marker-03-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#Markers"> + <p> + The SVG specification defines three properties to reference markers: marker-start, marker-mid, + marker-end. It also provides a shorthand property,marker. Using the marker property from a style sheet + is equivalent to using all three (start, mid, end). However, shorthand properties cannot be used as presentation attributes. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test passes if the two rows of shapes are identical, and that + all of the shapes have small blue markers (26 in total per row). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-marker-03-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <marker id="marker1" markerUnits="strokeWidth" refX="50" refY="50" markerWidth="5" markerHeight="5" viewBox="0 0 100 100"> + <rect width="100" height="100" fill="royalblue" stroke="none"/> + </marker> + <marker id="marker2" markerUnits="strokeWidth" refX="100" refY="100" markerWidth="15" markerHeight="15" viewBox="0 0 200 200"> + <rect width="200" height="200" fill="red" stroke="none"/> + </marker> + <style type="text/css"> + #markme { marker: url(#marker1) } + </style> + </defs> + + <text font-size="20" x="240" y="28" text-anchor="middle">'marker' property test</text> + + <text font-size="20" x="240" y="70" text-anchor="middle" fill="forestgreen">'marker' property</text> + <g fill="gold" stroke="black" fill-rule="evenodd" transform="translate(50,20)" id="markme"> + <path d="M10,60 Q90,60 90,140 Q10,140 10,60 Z M10,140 Q10,60 90,60 Q90,140 10,140 Z M50,70 L80,100 50,130 20,100 Z"/> + <polygon points="100,60 120,140 140,60 160,140 180,60 180,100 100,100"/> + <polyline points="190,60 210,140 230,60 250,140 270,60 270,100 190,100"/> + <line x1="280" x2="370" y1="60" y2="140"/> + <line x1="370" x2="280" y1="60" y2="140"/> + </g> + + <text font-size="20" x="240" y="200" text-anchor="middle" fill="forestgreen">'marker-start', 'marker-mid' & 'marker-end' attribute</text> + <g marker-mid="url(#marker1)" marker-end="url(#marker1)" marker-start="url(#marker1)" fill="gold" stroke="black" fill-rule="evenodd" transform="translate(50,150)"> + <path d="M10,60 Q90,60 90,140 Q10,140 10,60 Z M10,140 Q10,60 90,60 Q90,140 10,140 Z M50,70 L80,100 50,130 20,100 Z"/> + <polygon points="100,60 120,140 140,60 160,140 180,60 180,100 100,100"/> + <polyline points="190,60 210,140 230,60 250,140 270,60 270,100 190,100"/> + <line x1="280" x2="370" y1="60" y2="140"/> + <line x1="370" x2="280" y1="60" y2="140"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-marker-04-f-manual.svg b/testing/web-platform/tests/svg/import/painting-marker-04-f-manual.svg new file mode 100644 index 000000000..6abd8cefb --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-marker-04-f-manual.svg @@ -0,0 +1,84 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="BB" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: painting-marker-04-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#Markers"> + <p> + The SVG specification defines three properties to reference markers: marker-start, marker-mid, + marker-end. It also provides a shorthand property,marker. Using the marker property from a style sheet + is equivalent to using all three (start, mid, end). However, shorthand properties cannot be used as presentation attributes. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test passes if the shapes in the top row have no markers, + while the shapes in the bottom rom have small blue markers + (26 in total). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-marker-04-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <marker id="marker1" markerUnits="strokeWidth" refX="50" refY="50" markerWidth="5" markerHeight="5" viewBox="0 0 100 100"> + <rect width="100" height="100" fill="royalblue" stroke="none"/> + </marker> + <marker id="marker2" markerUnits="strokeWidth" refX="100" refY="100" markerWidth="15" markerHeight="15" viewBox="0 0 200 200"> + <rect width="200" height="200" fill="red" stroke="none"/> + </marker> + </defs> + + <text font-size="20" x="240" y="28" text-anchor="middle">'marker' attribute test</text> + + <text font-size="20" x="240" y="70" text-anchor="middle" fill="forestgreen">'marker' attribute</text> + <g marker="url(#marker2)" fill="gold" stroke="black" fill-rule="evenodd" transform="translate(50,20)" id="markme"> + <path d="M10,60 Q90,60 90,140 Q10,140 10,60 Z M10,140 Q10,60 90,60 Q90,140 10,140 Z M50,70 L80,100 50,130 20,100 Z"/> + <polygon points="100,60 120,140 140,60 160,140 180,60 180,100 100,100"/> + <polyline points="190,60 210,140 230,60 250,140 270,60 270,100 190,100"/> + <line x1="280" x2="370" y1="60" y2="140"/> + <line x1="370" x2="280" y1="60" y2="140"/> + </g> + + <text font-size="20" x="240" y="200" text-anchor="middle" fill="forestgreen">'marker-start', 'marker-mid' & 'marker-end' attributes</text> + <g marker-mid="url(#marker1)" marker-end="url(#marker1)" marker-start="url(#marker1)" fill="gold" stroke="black" fill-rule="evenodd" transform="translate(50,150)"> + <path d="M10,60 Q90,60 90,140 Q10,140 10,60 Z M10,140 Q10,60 90,60 Q90,140 10,140 Z M50,70 L80,100 50,130 20,100 Z"/> + <polygon points="100,60 120,140 140,60 160,140 180,60 180,100 100,100"/> + <polyline points="190,60 210,140 230,60 250,140 270,60 270,100 190,100"/> + <line x1="280" x2="370" y1="60" y2="140"/> + <line x1="370" x2="280" y1="60" y2="140"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-marker-05-f-manual.svg b/testing/web-platform/tests/svg/import/painting-marker-05-f-manual.svg new file mode 100644 index 000000000..72aab3820 --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-marker-05-f-manual.svg @@ -0,0 +1,240 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="DOH" author="ED" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: painting-marker-05-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#Markers"> + <p> + Test all the 'overflow' property values except 'inherit' on the 'marker' element. + </p> + <p> + Each column tests a value of the 'overflow' property. + The first row uses the 'marker' property to set the same marker on start-, mid- and end-points on the path. + The second row uses 'marker-start', 'marker-mid' and 'marker-end' to give each point its own marker. + The third row uses the 'marker' property like the first row, but here the marker has orient="auto" set. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if: + + The columns labeled 'visible' and 'auto' show markers without clipping them. + All other columns show clipped markers. + The rendered picture matches the reference image, except for possible + variations in the labelling text (per CSS2 rules). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-marker-05-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <marker id="marker1" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="7.5" refY="7.5" markerUnits="strokeWidth"> + <rect width="15" height="15" fill="purple" stroke="none"/> + </marker> + <marker id="marker2" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="10" refY="10" markerUnits="strokeWidth" orient="auto"> + <path d="M 10 0 L 20 20 L 0 20 Z" fill="blue" stroke="none"/> + </marker> + <marker id="markerStart" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="7.5" refY="7.5" markerUnits="strokeWidth"> + <rect width="15" height="15" fill="purple" stroke="none"/> + </marker> + <marker id="markerMiddle" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="5" refY="5" markerUnits="strokeWidth"> + <circle cx="5" cy="5" r="7" fill="green" stroke="none"/> + </marker> + <marker id="markerEnd" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="10" refY="10" markerUnits="strokeWidth"> + <path d="M 10 0 L 20 20 L 0 20 Z" fill="blue" stroke="none"/> + </marker> + + <marker id="vmarker1" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="7.5" refY="7.5" markerUnits="strokeWidth" overflow="visible"> + <rect width="15" height="15" fill="purple" stroke="none"/> + </marker> + <marker id="vmarker2" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="10" refY="10" markerUnits="strokeWidth" orient="auto" overflow="visible"> + <path d="M 10 0 L 20 20 L 0 20 Z" fill="blue" stroke="none"/> + </marker> + <marker id="vmarkerStart" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="7.5" refY="7.5" markerUnits="strokeWidth" overflow="visible"> + <rect width="15" height="15" fill="purple" stroke="none"/> + </marker> + <marker id="vmarkerMiddle" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="5" refY="5" markerUnits="strokeWidth" overflow="visible"> + <circle cx="5" cy="5" r="7" fill="green" stroke="none"/> + </marker> + <marker id="vmarkerEnd" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="10" refY="10" markerUnits="strokeWidth" overflow="visible"> + <path d="M 10 0 L 20 20 L 0 20 Z" fill="blue" stroke="none"/> + </marker> + + <marker id="amarker1" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="7.5" refY="7.5" markerUnits="strokeWidth" overflow="auto"> + <rect width="15" height="15" fill="purple" stroke="none"/> + </marker> + <marker id="amarker2" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="10" refY="10" markerUnits="strokeWidth" orient="auto" overflow="auto"> + <path d="M 10 0 L 20 20 L 0 20 Z" fill="blue" stroke="none"/> + </marker> + <marker id="amarkerStart" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="7.5" refY="7.5" markerUnits="strokeWidth" overflow="auto"> + <rect width="15" height="15" fill="purple" stroke="none"/> + </marker> + <marker id="amarkerMiddle" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="5" refY="5" markerUnits="strokeWidth" overflow="auto"> + <circle cx="5" cy="5" r="7" fill="green" stroke="none"/> + </marker> + <marker id="amarkerEnd" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="10" refY="10" markerUnits="strokeWidth" overflow="auto"> + <path d="M 10 0 L 20 20 L 0 20 Z" fill="blue" stroke="none"/> + </marker> + + <marker id="smarker1" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="7.5" refY="7.5" markerUnits="strokeWidth" overflow="scroll"> + <rect width="15" height="15" fill="purple" stroke="none"/> + </marker> + <marker id="smarker2" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="10" refY="10" markerUnits="strokeWidth" orient="auto" overflow="scroll"> + <path d="M 10 0 L 20 20 L 0 20 Z" fill="blue" stroke="none"/> + </marker> + <marker id="smarkerStart" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="7.5" refY="7.5" markerUnits="strokeWidth" overflow="scroll"> + <rect width="15" height="15" fill="purple" stroke="none"/> + </marker> + <marker id="smarkerMiddle" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="5" refY="5" markerUnits="strokeWidth" overflow="scroll"> + <circle cx="5" cy="5" r="7" fill="green" stroke="none"/> + </marker> + <marker id="smarkerEnd" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="10" refY="10" markerUnits="strokeWidth" overflow="scroll"> + <path d="M 10 0 L 20 20 L 0 20 Z" fill="blue" stroke="none"/> + </marker> + + <marker id="hmarker1" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="7.5" refY="7.5" markerUnits="strokeWidth" overflow="hidden"> + <rect width="15" height="15" fill="purple" stroke="none"/> + </marker> + <marker id="hmarker2" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="10" refY="10" markerUnits="strokeWidth" orient="auto" overflow="hidden"> + <path d="M 10 0 L 20 20 L 0 20 Z" fill="blue" stroke="none"/> + </marker> + <marker id="hmarkerStart" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="7.5" refY="7.5" markerUnits="strokeWidth" overflow="hidden"> + <rect width="15" height="15" fill="purple" stroke="none"/> + </marker> + <marker id="hmarkerMiddle" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="5" refY="5" markerUnits="strokeWidth" overflow="hidden"> + <circle cx="5" cy="5" r="7" fill="green" stroke="none"/> + </marker> + <marker id="hmarkerEnd" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="10" refY="10" markerUnits="strokeWidth" overflow="hidden"> + <path d="M 10 0 L 20 20 L 0 20 Z" fill="blue" stroke="none"/> + </marker> + </defs> + + <style type="text/css"> + .testpaths { + fill:none; + stroke:black; + stroke-width:8px; + } + + /* no overflow specified */ + #p1 { marker: url(#marker1); } + #p2 { + marker-start: url(#markerStart); + marker-mid:url(#markerMiddle); + marker-end: url(#markerEnd); + } + #p3 { marker: url(#marker2); } + + /* overflow = visible */ + #p4 { marker: url(#vmarker1); } + #p5 { + marker-start: url(#vmarkerStart); + marker-mid:url(#vmarkerMiddle); + marker-end: url(#vmarkerEnd); + } + #p6 { marker: url(#vmarker2); } + + /* overflow = auto */ + #p7 { marker: url(#amarker1); } + #p8 { + marker-start: url(#amarkerStart); + marker-mid:url(#amarkerMiddle); + marker-end: url(#amarkerEnd); + } + #p9 { marker: url(#amarker2); } + + /* overflow = scroll */ + #p10 { marker: url(#smarker1); } + #p11 { + marker-start: url(#smarkerStart); + marker-mid:url(#smarkerMiddle); + marker-end: url(#smarkerEnd); + } + #p12 { marker: url(#smarker2); } + + /* overflow = hidden */ + #p13 { marker: url(#hmarker1); } + #p14 { + marker-start: url(#hmarkerStart); + marker-mid:url(#hmarkerMiddle); + marker-end: url(#hmarkerEnd); + } + #p15 { marker: url(#hmarker2); } + </style> + + <text x="50%" y="3em" style="font: 18px SVGFreeSansASCII,sans-serif; text-anchor:middle;">Test marker overflow</text> + + <g style="font: 14px SVGFreeSansASCII,sans-serif; text-anchor:middle" transform="translate(0,280)"> + <text x="60">default</text> + <text x="155">'visible'</text> + <text x="245">'auto'</text> + <text x="340">'scroll'</text> + <text x="430">'hidden'</text> + </g> + + <g transform="translate(-30,75)"> + + <g id="subtest1" transform="scale(0.6)"> + <path id="p1" class="testpaths" d="M 130 40 L 180 40 L 180 90"/> + <path id="p2" class="testpaths" d="M 130 135 L 180 135 L 180 185"/> + <path id="p3" class="testpaths" d="M 130 230 L 180 230 L 180 280"/> + </g> + + <g id="subtest2" transform="scale(0.6) translate(150,0)"> + <path id="p4" class="testpaths" d="M 130 40 L 180 40 L 180 90"/> + <path id="p5" class="testpaths" d="M 130 135 L 180 135 L 180 185"/> + <path id="p6" class="testpaths" d="M 130 230 L 180 230 L 180 280"/> + </g> + + <g id="subtest3" transform="scale(0.6) translate(300,0)"> + <path id="p7" class="testpaths" d="M 130 40 L 180 40 L 180 90"/> + <path id="p8" class="testpaths" d="M 130 135 L 180 135 L 180 185"/> + <path id="p9" class="testpaths" d="M 130 230 L 180 230 L 180 280"/> + </g> + + <g id="subtest4" transform="scale(0.6) translate(450,0)"> + <path id="p10" class="testpaths" d="M 130 40 L 180 40 L 180 90"/> + <path id="p11" class="testpaths" d="M 130 135 L 180 135 L 180 185"/> + <path id="p12" class="testpaths" d="M 130 230 L 180 230 L 180 280"/> + </g> + + <g id="subtest5" transform="scale(0.6) translate(600,0)"> + <path id="p13" class="testpaths" d="M 130 40 L 180 40 L 180 90"/> + <path id="p14" class="testpaths" d="M 130 135 L 180 135 L 180 185"/> + <path id="p15" class="testpaths" d="M 130 230 L 180 230 L 180 280"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-marker-06-f-manual.svg b/testing/web-platform/tests/svg/import/painting-marker-06-f-manual.svg new file mode 100644 index 000000000..c1929f81e --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-marker-06-f-manual.svg @@ -0,0 +1,159 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AG" author="ED" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: painting-marker-06-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#MarkerElement"> + <p> + Tests the basic support for markers. For the three tests, there + should be two identical paths with markers drawn. The path on the left is + rendered using the marker elements. The path on the right is rendered using + the equivalent SVG, showing what the marked path should look like. + </p> + <p> + This test is similar to the painting-marker-01-f.svg test, but has some viewBox attributes + that have a non-zero offset. + </p> + <p> + The top test examines the basic support for the marker element and style. The markers are purple rectangles. + </p> + <p> + The middle test examines the support for the different styles of marker properties. The + "marker-start" property defines the marker to use at the first vertex of the marked path, + in this case a purple rectangle. The "marker-end" property defines the marker to use at the + last vertex of the marked path, in this case a blue triangle. The "marker-mid" property + defines the marker to use at all vertices, other than the first and last, of the marked path, + in this case a green circle. + </p> + <p> + The bottom test examines the support for marker orientation along the + path direction. The second vertex, the top right corner of the path, has a marker that + is rotated 45 degrees, since that is the average of the horizontal and vertical segments + each side. The last vertex, the bottom right corner of the path, has a marker rotated 90 + degrees since that is the direction of the last path segment. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image, except for possible + variations in the labelling text (per CSS2 rules). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-marker-06-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <!-- ===================================================================== --> + <!-- Define a few simple marker elements --> + <!-- ===================================================================== --> + <marker id="marker1" viewBox="20 20 10 10" markerWidth="2" markerHeight="2" refX="25" refY="25" markerUnits="strokeWidth"> + <rect x="20" y="20" width="10" height="10" fill="purple" stroke="none"/> + </marker> + <marker id="marker2" viewBox="-5 -5 10 10" markerWidth="2" markerHeight="2" markerUnits="strokeWidth" orient="auto"> + <path d="M 0 -5 L 5 5 L -5 5 Z" fill="blue" stroke="none"/> + </marker> + <marker id="markerStart" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="5" refY="5" markerUnits="strokeWidth"> + <rect width="10" height="10" fill="purple" stroke="none"/> + </marker> + <marker id="markerMiddle" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="5" refY="5" markerUnits="strokeWidth"> + <circle cx="5" cy="5" r="5" fill="green" stroke="none"/> + </marker> + <marker id="markerEnd" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="5" refY="5" markerUnits="strokeWidth"> + <path d="M 5 0 L 10 10 L 0 10 Z" fill="blue" stroke="none"/> + </marker> + </defs> + <!-- ===================================================================== --> + <!-- Basic Marker Test --> + <!-- ===================================================================== --> + <text x="170" y="30" font-size="14">Basic Markers</text> + <path fill="none" stroke="black" stroke-width="8" marker-start="url(#marker1)" marker-mid="url(#marker1)" marker-end="url(#marker1)" d="M 130 40 L 180 40 L 180 90"/> + <!-- ===================================================================== --> + <!-- Generate the equivalent SVG --> + <!-- ===================================================================== --> + <g transform="translate(120,0)"> + <path fill="none" stroke="black" stroke-width="8" d="M 130 40 L 180 40 L 180 90"/> + <g transform="translate(130,40) scale(8) scale(0.2, 0.2) translate(-5, -5)" fill="none" stroke="black" stroke-width="8"> + <rect width="10" height="10" fill="purple" stroke="none"/> + </g> + <g transform="translate(180,40) scale(8) scale(0.2, 0.2) translate(-5, -5)" fill="none" stroke="black" stroke-width="8"> + <rect width="10" height="10" fill="purple" stroke="none"/> + </g> + <g transform="translate(180,90) scale(8) scale(0.2, 0.2) translate(-5, -5)" fill="none" stroke="black" stroke-width="8"> + <rect width="10" height="10" fill="purple" stroke="none"/> + </g> + </g> + <!-- ===================================================================== --> + <!-- Start, Middle and End Marker Test --> + <!-- ===================================================================== --> + <text x="145" y="125" font-size="14">Start, Middle and End</text> + <path fill="none" stroke="black" stroke-width="8" marker-start="url(#markerStart)" marker-mid="url(#markerMiddle)" marker-end="url(#markerEnd)" d="M 130 135 L 180 135 L 180 185"/> + <!-- ===================================================================== --> + <!-- Generate the equivalent SVG --> + <!-- ===================================================================== --> + <g transform="translate(120,0)"> + <path fill="none" stroke="black" stroke-width="8" d="M 130 135 L 180 135 L 180 185"/> + <g transform="translate(130,135) scale(8) scale(0.2, 0.2) translate(-5, -5)" fill="none" stroke="black" stroke-width="8"> + <rect width="10" height="10" fill="purple" stroke="none"/> + </g> + <g transform="translate(180,135) scale(8) scale(0.2, 0.2) translate(-5, -5)" fill="none" stroke="black" stroke-width="8"> + <circle cx="5" cy="5" r="5" fill="green" stroke="none"/> + </g> + <g transform="translate(180,185) scale(8) scale(0.2, 0.2) translate(-5, -5)" fill="none" stroke="black" stroke-width="8"> + <path d="M 5 0 L 10 10 L 0 10 Z" fill="blue" stroke="none"/> + </g> + </g> + <!-- ===================================================================== --> + <!-- Auto Orientation Marker Test --> + <!-- ===================================================================== --> + <text x="145" y="220" font-size="14">Automatic Orientation</text> + <path fill="none" stroke="black" stroke-width="8" marker-start="url(#marker2)" marker-mid="url(#marker2)" marker-end="url(#marker2)" d="M 130 230 L 180 230 L 180 280"/> + <!-- ===================================================================== --> + <!-- Generate the equivalent SVG --> + <!-- ===================================================================== --> + <g transform="translate(120,0)"> + <path fill="none" stroke="black" stroke-width="8" d="M 130 230 L 180 230 L 180 280"/> + <g transform="translate(130,230) rotate(0) scale(8) scale(0.2, 0.2) translate(-5, -5)" fill="none" stroke="black" stroke-width="8"> + <path d="M 5 0 L 10 10 L 0 10 Z" fill="blue" stroke="none"/> + </g> + <g transform="translate(180,230) rotate(45) scale(8) scale(0.2, 0.2) translate(-5, -5)" fill="none" stroke="black" stroke-width="8"> + <path d="M 5 0 L 10 10 L 0 10 Z" fill="blue" stroke="none"/> + </g> + <g transform="translate(180,280) rotate(90) scale(8) scale(0.2, 0.2) translate(-5, -5)" fill="none" stroke="black" stroke-width="8"> + <path d="M 5 0 L 10 10 L 0 10 Z" fill="blue" stroke="none"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-marker-07-f-manual.svg b/testing/web-platform/tests/svg/import/painting-marker-07-f-manual.svg new file mode 100644 index 000000000..fc086730e --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-marker-07-f-manual.svg @@ -0,0 +1,66 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" version="$Revision: 1.3 $" testname="$RCSfile: painting-marker-07-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#Markers"> + <p> + A 'marker' element with 'display' set to 'none' on that + element or any ancestor is rendered when referenced by another element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there are two green triangles visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-marker-07-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <marker id="testMarker" markerWidth="100" markerHeight="100" display="none"> + <path d="M 0 0 L 200 200 L 0 150 z" fill="green" /> + </marker> + <g display="none"> + <marker id="testMarker2" markerWidth="100" markerHeight="100"> + <path d="M 0 0 L 200 200 L 0 150 z" fill="green" /> + </marker> + </g> + </defs> + <path d="M 0 0 L 25 25" marker-end="url(#testMarker)" /> + <path d="M 100 0 L 125 25" marker-end="url(#testMarker2)" /> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg>
\ No newline at end of file diff --git a/testing/web-platform/tests/svg/import/painting-marker-properties-01-f-manual.svg b/testing/web-platform/tests/svg/import/painting-marker-properties-01-f-manual.svg new file mode 100644 index 000000000..cbac3a7db --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-marker-properties-01-f-manual.svg @@ -0,0 +1,95 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="[reviewer]" author="Microsoft" status="created" version="$Revision: 1.2 $" testname="$RCSfile: painting-marker-properties-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/painting.html#MarkerProperties"> + <p> + <!--[[ + 'Marker-start', 'marker-mid', and 'marker-end' only render markers at the appropriate vertices when applied to 'line', 'path', 'polygon' and 'polyline' elements. + ]]--> + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + <!--[[ + For each attribute ('marker-start', 'marker-mid', and 'marker-end'), create a top 'rect' and a bottom 'rect' that define where the marker + 'rect's should align. Create the 'line', 'path', 'polygon', and 'polyline' elements to render their markers between the top and bottom 'rect' + elements such that an unbreaking line is formed. The 'line' element does not create a mid marker, so the top marker for the 'mid' column is + larger than the rest. + ]]--> + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + <!--[[ + Test passes if there are three unbroken blue rectangles visible on the page. + ]]--> + </p> + </d:passCriteria> + </d:SVGTestCase> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <style type="text/css"><![CDATA[ + .start + { + marker-start: url(#markerTest); + } + .end + { + marker-end: url(#markerTest); + } + .mid + { + marker-mid: url(#markerTest); + }]]> + </style> + <defs> + <marker id="markerTest" markerWidth="100" markerHeight="100" fill="blue"> + <rect width="50" height="55" /> + </marker> + </defs> + <rect width="50" height="55" fill="blue" /> + <line class="start" y1="50" x2="100" y2="50" stroke="none" /> + <path class="start" d="M 0 100 L 50 100 L 100 100" /> + <polygon class="start" points="0,150 50,150 100,150" /> + <polyline class="start" points="0,200 50,200 100,200" /> + <rect y="250" width="50" height="50" fill="blue" /> + + <rect x="250" width="50" height="55" fill="blue" /> + <line class="end" x1="150" y1="50" x2="250" y2="50" stroke="none" /> + <path class="end" d="M 150 100 L 200 100 L 250 100" /> + <polygon class="end" points="250,150 200,150" /> + <polyline class="end" points="150,200 200,200 250,200" /> + <rect x="250" y="250" width="50" height="50" fill="blue" /> + + <rect x="350" width="50" height="105" fill="blue" /> + <path class="mid" d="M 300 100 L 350 100 L 400 100" /> + <polygon class="mid" points="300,150 350,150" /> + <polyline class="mid" points="300,200 350,200 400,200" /> + <rect x="350" y="250" width="50" height="50" fill="blue" /> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-render-01-b-manual.svg b/testing/web-platform/tests/svg/import/painting-render-01-b-manual.svg new file mode 100644 index 000000000..6367fb093 --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-render-01-b-manual.svg @@ -0,0 +1,146 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Tim Thompson" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: painting-render-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#RenderingProperties"> + <p> + This tests shows the same linear gradient used with different values for the + color-interpolation rendering property. The top bar is painted using the + default color-interpolation value, which should produce the same result as + sRGB. The middle bar is painted using the 'sRGB' color-interpolation and + should be the same as the top bar. Finally, the bottom bar is painted using + the linearRGB interpolation, which produces a result visibly different from + the top two bars: the white to blue ramp is whiter, the blue to red ramp + goes through a pinkish color and the red to yellow ramp turns orange before + the similar sRGB rampl. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The top two gradients must look the same, and the bottom gradient must look + different to the top two. The rendered picture should match the reference image, except for possible + variations in the labelling text (per CSS2 rules). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-render-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <linearGradient id="gradientDefault" gradientUnits="objectBoundingBox"> + <stop offset="0" stop-color="white"/> + <stop offset=".33" stop-color="blue"/> + <stop offset=".66" stop-color="red"/> + <stop offset="1" stop-color="yellow"/> + </linearGradient> + <linearGradient id="gradientSRGB" gradientUnits="objectBoundingBox" color-interpolation="sRGB"> + <stop offset="0" stop-color="white"/> + <stop offset=".33" stop-color="blue"/> + <stop offset=".66" stop-color="red"/> + <stop offset="1" stop-color="yellow"/> + </linearGradient> + <linearGradient id="gradientLinearRGB" gradientUnits="objectBoundingBox" color-interpolation="linearRGB"> + <stop offset="0" stop-color="white"/> + <stop offset=".33" stop-color="blue"/> + <stop offset=".66" stop-color="red"/> + <stop offset="1" stop-color="yellow"/> + </linearGradient> + </defs> + <text font-size="22" text-anchor="middle" x="225" y="30">Basic test of color-interpolation property.</text> + <!-- ====================================== --> + <!-- Default color-interpolation (sRGB) --> + <!-- ====================================== --> + <g transform="translate(40, 80)"> + <rect x="0" y="0" width="300" height="40" fill="url(#gradientDefault)" stroke="black"/> + <circle cx="0" cy="-10" r="3" fill="white" stroke="black"/> + <line x1="0" y1="-7" x2="0" y2="40" stroke="black"/> + <rect x="48" y="18" width="4" height="4" fill="rgb(128, 128, 255)" stroke="black"/> + <line x1="50" y1="15" x2="50" y2="25" stroke="rgb(128, 128, 255)"/> + <circle cx="100" cy="-10" r="3" fill="blue" stroke="black"/> + <line x1="0" y1="-7" x2="0" y2="40" stroke="black" transform="translate(100, 0)"/> + <rect x="148" y="18" width="4" height="4" fill="rgb(128, 0, 128)" stroke="black"/> + <line x1="150" y1="15" x2="150" y2="25" stroke="rgb(128, 0, 128)"/> + <circle cx="200" cy="-10" r="3" fill="red" stroke="black"/> + <line x1="0" y1="-7" x2="0" y2="40" stroke="black" transform="translate(200, 0)"/> + <rect x="248" y="18" width="4" height="4" fill="rgb(255, 128, 0)" stroke="black"/> + <line x1="250" y1="15" x2="250" y2="25" stroke="rgb(255, 128, 0)"/> + <circle cx="300" cy="-10" r="3" fill="yellow" stroke="black"/> + <line x1="0" y1="-7" x2="0" y2="40" stroke="black" transform="translate(300, 0)"/> + <text x="310" y="20" font-size="16">default (sRGB)</text> + </g> + <!-- ====================================== --> + <!-- sRGB color-interpolation --> + <!-- ====================================== --> + <g transform="translate(40, 160)"> + <rect x="0" y="0" width="300" height="40" fill="url(#gradientSRGB)" stroke="black"/> + <circle cx="0" cy="-10" r="3" fill="white" stroke="black"/> + <line x1="0" y1="-7" x2="0" y2="40" stroke="black"/> + <rect x="48" y="18" width="4" height="4" fill="rgb(128, 128, 255)" stroke="black"/> + <line x1="50" y1="15" x2="50" y2="25" stroke="rgb(128, 128, 255)"/> + <circle cx="100" cy="-10" r="3" fill="blue" stroke="black"/> + <line x1="0" y1="-7" x2="0" y2="40" stroke="black" transform="translate(100, 0)"/> + <rect x="148" y="18" width="4" height="4" fill="rgb(128, 0, 128)" stroke="black"/> + <line x1="150" y1="15" x2="150" y2="25" stroke="rgb(128, 0, 128)"/> + <circle cx="200" cy="-10" r="3" fill="red" stroke="black"/> + <line x1="0" y1="-7" x2="0" y2="40" stroke="black" transform="translate(200, 0)"/> + <rect x="248" y="18" width="4" height="4" fill="rgb(255, 128, 0)" stroke="black"/> + <line x1="250" y1="15" x2="250" y2="25" stroke="rgb(255, 128, 0)"/> + <circle cx="300" cy="-10" r="3" fill="yellow" stroke="black"/> + <line x1="0" y1="-7" x2="0" y2="40" stroke="black" transform="translate(300, 0)"/> + <text x="310" y="20" font-size="16">sRGB</text> + </g> + <!-- ====================================== --> + <!-- linearRGB color-interpolation --> + <!-- ====================================== --> + <g transform="translate(40, 240)"> + <rect x="0" y="0" width="300" height="40" fill="url(#gradientLinearRGB)" stroke="black"/> + <circle cx="0" cy="-10" r="3" fill="white" stroke="black"/> + <line x1="0" y1="-7" x2="0" y2="40" stroke="black"/> + <rect x="48" y="18" width="4" height="4" fill="rgb(128, 128, 255)" stroke="black"/> + <line x1="50" y1="15" x2="50" y2="25" stroke="rgb(128, 128, 255)"/> + <circle cx="100" cy="-10" r="3" fill="blue" stroke="black"/> + <line x1="0" y1="-7" x2="0" y2="40" stroke="black" transform="translate(100, 0)"/> + <rect x="148" y="18" width="4" height="4" fill="rgb(128, 0, 128)" stroke="black"/> + <line x1="150" y1="15" x2="150" y2="25" stroke="rgb(128, 0, 128)"/> + <circle cx="200" cy="-10" r="3" fill="red" stroke="black"/> + <line x1="0" y1="-7" x2="0" y2="40" stroke="black" transform="translate(200, 0)"/> + <rect x="248" y="18" width="4" height="4" fill="rgb(255, 128, 0)" stroke="black"/> + <line x1="250" y1="15" x2="250" y2="25" stroke="rgb(255, 128, 0)"/> + <circle cx="300" cy="-10" r="3" fill="yellow" stroke="black"/> + <line x1="0" y1="-7" x2="0" y2="40" stroke="black" transform="translate(300, 0)"/> + <text x="310" y="20" font-size="16">linearRGB</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-render-02-b-manual.svg b/testing/web-platform/tests/svg/import/painting-render-02-b-manual.svg new file mode 100644 index 000000000..1845b1842 --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-render-02-b-manual.svg @@ -0,0 +1,100 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="AG" author="CM" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: painting-render-02-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#ColorInterpolationProperty"> + <p> + This tests that the 'color-interpolation' property is honored when + alpha compositing is performed. + </p> + <p> + The test slide consists of seven rectangular regions, + each of which is filled with either a dark or light + shade of gray. The 'color-interpolation' property + is used on the rectangles to control whether a + dark or light shade of gray appears. Text inside each + rectangular region indicates whether the shade of gray + should be dark or light. The top two rectangular regions + are references against which the remaining five are to + be compared. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if: + </p> + <ul> + <li>all rectangles marked as "dark" have the same fill color,</li> + <li>all rectangles marked as "light" have the same fill color,</li> + <li>the rectangle marked "dark or light" has the same fill color + as either the "dark" rectangles or the "light" rectangles, and</li> + <li>the rendering matches the reference rendering, except for + any differences in font used to render the text.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-render-02-b.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <g transform='translate(90,10)'> + <rect y='100' width='300' height='200'/> + <g stroke='black' stroke-width='2'> + <rect width='150' height='100' fill='#7F7F7F'/> + <rect x='150' width='150' height='100' fill='#BBBBBB'/> + <g fill='white' fill-opacity='0.5'> + <rect y='100' width='100' height='100'/> + <g color-interpolation='linearRGB'> + <rect x='100' y='100' width='100' height='100' color-interpolation='linearRGB'/> + <rect x='200' y='100' width='100' height='100' color-interpolation='sRGB'/> + <rect y='200' width='150' height='100' color-interpolation='auto'/> + <rect x='150' y='200' width='150' height='100' color-interpolation='inherit'/> + </g> + </g> + </g> + <g text-anchor='middle' transform='translate(0,5)'> + <text x='75' y='50'>dark</text> + <text x='225' y='50'>light</text> + <text x='50' y='150'>dark</text> + <text x='150' y='150'>light</text> + <text x='250' y='150'>dark</text> + <text x='75' y='250'>dark or light</text> + <text x='225' y='250'>light</text> + </g> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-stroke-01-t-manual.svg b/testing/web-platform/tests/svg/import/painting-stroke-01-t-manual.svg new file mode 100644 index 000000000..837a64b2e --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-stroke-01-t-manual.svg @@ -0,0 +1,68 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Kevin McCluskey" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: painting-stroke-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#StrokeProperties"> + <p> + Verify the basic capability to handle the stroke properties ("stroke") + in combination with the "rect" element . + The pair should be rendered as two blue rectangles, + the upper one without a stroke and the lower with a green stroke. + </p> + <p> + The test uses the "rect" element, as well as basic "fill" (solid primary colors), + "stroke", stroke="green", "font-family" and "font-size" attributes. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image, except for possible + variations in the labeling text (per CSS2 rules). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-stroke-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ============================================================================= --> + <!-- Draw two simple rectangles. One without stroke other with stroke:green --> + <!-- ============================================================================= --> + <text font-size="36" x="10" y="40">Basic paint: stroke properties.</text> + <rect id="stroke-01" fill="blue" stroke="none" x="90" y="70" width="300" height="50"/> + <rect id="stroke-02" fill="blue" stroke-width="20" stroke="green" x="90" y="190" width="300" height="50"/> + <text font-size="30" x="140" y="150">stroke="none"</text> + <text font-size="30" x="148" y="280">stroke="green"</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-stroke-02-t-manual.svg b/testing/web-platform/tests/svg/import/painting-stroke-02-t-manual.svg new file mode 100644 index 000000000..0bde5eb0d --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-stroke-02-t-manual.svg @@ -0,0 +1,63 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Kevin McCluskey" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: painting-stroke-02-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#StrokeProperties"> + <p> + Verify the basic capability to handle the stroke properties ("stroke", "stroke-width", + "stroke-linejoin") in combination with the "rect" element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The pair should be rendered as two blue rectangles without an interior fill. + The upper rectangle should have a thick stroke and sharp corners. + The lower rectangle should have a thick stroke and round corners. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-stroke-02-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ====================================================================== --> + <!-- Set of rectangles with stroke-width:10 and stroke-linejoin:round--> + <!-- ====================================================================== --> + <text font-size="36" x="10" y="40">Basic paint: stroke properties.</text> + <rect id="stroke-01" fill="none" stroke="blue" stroke-width="20" x="90" y="70" width="300" height="50"/> + <rect id="stroke-02" fill="none" stroke="blue" stroke-width="20" stroke-linejoin="round" x="90" y="190" width="300" height="50"/> + <text font-size="40" x="120" y="160">stroke-width="20"</text> + <text font-size="40" x="58" y="290">stroke-linejoin="round"</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-stroke-03-t-manual.svg b/testing/web-platform/tests/svg/import/painting-stroke-03-t-manual.svg new file mode 100644 index 000000000..719a8b0ae --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-stroke-03-t-manual.svg @@ -0,0 +1,64 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Kevin McCluskey" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: painting-stroke-03-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#StrokeProperties"> + <p> + This test checks the basic capability of handling the stroke properties ("stroke", "stroke-width" + "stroke-linejoin", "stroke-linecap", "stroke-miterlimit") + with straight-line path commands. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The two paths should be rendered as two blue line segments. + The upper segment should have round end caps. The lower segment + should be chopped off where the two line segments meet. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-stroke-03-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ====================================================================== --> + <!-- Test stroke-linecap:round and stroke-miterlimit:1 --> + <!-- ====================================================================== --> + <text font-size="36" x="10" y="40">Basic paint: stroke properties.</text> + <path fill="none" stroke="blue" stroke-width="30" stroke-linecap="round" d="M 160 70 l 200 20 l -200 20 "/> + <path fill="none" stroke="blue" stroke-width="30" stroke-linejoin="miter" stroke-miterlimit="1" d="M 160 190 l 200 20 l -200 20"/> + <text font-size="40" x="60" y="160">stroke-linecap="round"</text> + <text font-size="40" x="130" y="280">stroke-miterlimit="1"</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-stroke-04-t-manual.svg b/testing/web-platform/tests/svg/import/painting-stroke-04-t-manual.svg new file mode 100644 index 000000000..5e23638f6 --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-stroke-04-t-manual.svg @@ -0,0 +1,60 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Kevin McCluskey" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: painting-stroke-04-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#StrokeProperties"> + <p> + This test checks the "stroke-dasharray" and "stroke-dashoffset" properties. Two lines are drawn, one blue + and one black. Both have a "stroke-dasharray" of "10,10" giving a dashed appearance + where the size of the gaps and the size of the dash is equal. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + Run the test. No interaction required. + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The black line is lower than but parallel to the blue line. The "stroke-dashoffset" on each line should make the dashes of each line line up with the gaps in the other line. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-stroke-04-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ====================================================================== --> + <!-- Test stroke-dasharray and stroke-dashoffset --> + <!-- ====================================================================== --> + <text font-size="36" x="10" y="60">Basic paint: stroke properties.</text> + <path id="stroke-7b" fill="none" stroke="blue" stroke-width="25" stroke-dashoffset="0" stroke-dasharray="10,10" d="M 50 120 L 430 120"/> + <path id="stroke-7c" fill="none" stroke="black" stroke-width="25" stroke-dashoffset="10" stroke-dasharray="10,10" d="M 50 140 L 430 140"/> + <text font-size="30" x="65" y="210">stroke-dasharray="10, 10"</text> + <text font-size="30" x="75" y="260">stroke-dashoffset="10"</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-stroke-05-t-manual.svg b/testing/web-platform/tests/svg/import/painting-stroke-05-t-manual.svg new file mode 100644 index 000000000..f40270188 --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-stroke-05-t-manual.svg @@ -0,0 +1,88 @@ +<svg version="1.1" baseProfile="tiny" shape-rendering="geometricPrecision" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="BB" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: painting-stroke-05-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#StrokeProperties"> + <p> + User agents may render graphical primitives with different levels of accuracy. + This test is aimed at determining how a UA renders thin strokes. + </p> + <p> + The test file contains a number of vertical and horizontal lines. + The stroke width of the vertical lines increase from left to right. + The stroke width of the horizontal lines increase from top to bottom. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + Run the test. No interaction required. + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if user is able to see a smooth stroke width + increment for the vertical and horizontal lines. The top left hand + corner should contain strokes that are very thin in width and the bottom + right hand corner should contain thick strokes. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-stroke-05-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-size="20" x="240" y="30" text-anchor="middle">Rendering thin strokes</text> + + <polyline points="030,50 030,300" stroke="black" stroke-width="0.001"/> + <polyline points="50,50 50,300" stroke="black" stroke-width="0.1"/> + <polyline points="70,50 70,300" stroke="black" stroke-width="0.2"/> + <polyline points="90,50 90,300" stroke="black" stroke-width="0.3"/> + <polyline points="110,50 110,300" stroke="black" stroke-width="0.4"/> + <polyline points="130,50 130,300" stroke="black" stroke-width="0.5"/> + <polyline points="150,50 150,300" stroke="black" stroke-width="0.6"/> + <polyline points="170,50 170,300" stroke="black" stroke-width="0.7"/> + <polyline points="190,50 190,300" stroke="black" stroke-width="0.8"/> + <polyline points="210,50 210,300" stroke="black" stroke-width="0.9"/> + <polyline points="230,50 230,300" stroke="black" stroke-width="1.0"/> + <polyline points="250,50 250,300" stroke="black" stroke-width="1.1"/> + <polyline points="270,50 270,300" stroke="black" stroke-width="1.2"/> + <polyline points="290,50 290,300" stroke="black" stroke-width="1.3"/> + <polyline points="310,50 310,300" stroke="black" stroke-width="1.4"/> + <polyline points="330,50 330,300" stroke="black" stroke-width="1.5"/> + <polyline points="350,50 350,300" stroke="black" stroke-width="1.6"/> + <polyline points="370,50 370,300" stroke="black" stroke-width="1.7"/> + <polyline points="390,50 390,300" stroke="black" stroke-width="1.8"/> + <polyline points="410,50 410,300" stroke="black" stroke-width="1.9"/> + <polyline points="430,50 430,300" stroke="black" stroke-width="2.0"/> + <polyline points="450,50 450,300" stroke="black" stroke-width="2.1"/> + + <line x1="10" x2="470" y1="100" y2="100" stroke="darkblue" stroke-width="0.1"/> + <line x1="10" x2="470" y1="150" y2="150" stroke="darkblue" stroke-width="0.5"/> + <line x1="10" x2="470" y1="200" y2="200" stroke="darkblue" stroke-width="1"/> + <line x1="10" x2="470" y1="250" y2="250" stroke="darkblue" stroke-width="2"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-stroke-06-t-manual.svg b/testing/web-platform/tests/svg/import/painting-stroke-06-t-manual.svg new file mode 100644 index 000000000..829633f5c --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-stroke-06-t-manual.svg @@ -0,0 +1,74 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="CN" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: painting-stroke-06-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#StrokeProperties"> + <p> + Test default effects of stroke-dasharray. + </p> + <p> + This specifically tests the values of none and 0. + This also tests an odd number of values in a dash-array attribute + and in combination with an offset. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + Run the test. No interaction required. + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The top two lines must be solid black. The next line shows a thick + black line with a thinner blue line on top; both must have the same + dash pattern. The bottom two lines, one black and one blue, must render + so that the gaps of one correspond to the dashes of the other. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-stroke-06-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="scale(1.8)"> + + <!-- No dasharray --> + <path stroke="black" stroke-width="10" fill="none" stroke-dasharray="none" d=" M 20 20 L 200 20"/> + + <path stroke="black" stroke-width="10" fill="none" stroke-dasharray="0" d=" M 20 40 L 200 40"/> + + <!-- Odd number, should repeat to make an even number --> + <path stroke="black" stroke-width="20" fill="none" stroke-dasharray="5,2,5,5,2,5" d=" M 20 60 L 200 60"/> + <path stroke="blue" stroke-width="10" fill="none" stroke-dasharray="5,2,5" d=" M 20 60 L 200 60"/> + + <!-- Odd number, with a dashoffset test --> + <path stroke="black" stroke-width="10" fill="none" stroke-dasharray="2" d=" M 20 80 L 200 80"/> + + <path stroke="blue" stroke-width="10" fill="none" stroke-dasharray="2" stroke-dashoffset="2" d=" M 20 90 L 200 90"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-stroke-07-t-manual.svg b/testing/web-platform/tests/svg/import/painting-stroke-07-t-manual.svg new file mode 100644 index 000000000..853bda408 --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-stroke-07-t-manual.svg @@ -0,0 +1,63 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="CN" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: painting-stroke-07-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#StrokeProperties"> + <p> + Test effect of different stroke-miterlimits. For this particular combination of + stroke width and angle, the cut off value of stroke-miterlimit is 18.028. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The first and second subtests should not truncate the stroke, and all the rest must truncate it. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-stroke-07-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="scale(1.2) translate(60, 30)"> + <!-- test different miterlimits --> + <path stroke="black" stroke-width="10" stroke-linejoin="miter" stroke-miterlimit="20" fill="none" d="M 20 20 L 200 30 L 20 40"/> + <path stroke="black" stroke-width="10" stroke-linejoin="miter" stroke-miterlimit="18.1" fill="none" d="M 20 50 L 200 60 L 20 70"/> + <path stroke="black" stroke-width="10" stroke-linejoin="miter" stroke-miterlimit="17.9" fill="none" d="M 20 80 L 200 90 L 20 100"/> + <path stroke="black" stroke-width="10" stroke-linejoin="miter" stroke-miterlimit="17" fill="none" d="M 20 110 L 200 120 L 20 130"/> + <path stroke="black" stroke-width="10" stroke-linejoin="miter" stroke-miterlimit="4" fill="none" d="M 20 140 L 200 150 L 20 160"/> + <path stroke="black" stroke-width="10" stroke-linejoin="miter" stroke-miterlimit="1" fill="none" d="M 20 170 L 200 180 L 20 190"/> + + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-stroke-08-t-manual.svg b/testing/web-platform/tests/svg/import/painting-stroke-08-t-manual.svg new file mode 100644 index 000000000..a16b2965a --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-stroke-08-t-manual.svg @@ -0,0 +1,78 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="CN" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: painting-stroke-08-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#StrokeProperties"> + <p> + Test effects of stroke-opacity range. Values + outside the range 0-1.0 must be clamped. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + Run the test. No interaction required. + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + There must be no blue bars visible beside the three pink dots. + Four semitransparent blue bars, increasingly more opaque, + must line up with the yellow dots. Three fully opaque + blue bars must line up with the green dots. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-stroke-08-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="translate(50, 0) scale(1.7)"> + <circle r="5" fill="#f66" cx="200" cy="20"/> + <circle r="5" fill="#f66" cx="200" cy="40"/> + <circle r="5" fill="#f66" cx="200" cy="60"/> + <circle r="5" fill="#f66" cx="200" cy="80"/> + <circle r="5" fill="#ff0" cx="200" cy="80"/> + <circle r="5" fill="#ff0" cx="200" cy="100"/> + <circle r="5" fill="#ff0" cx="200" cy="120"/> + <circle r="5" fill="#ff0" cx="200" cy="140"/> + <circle r="5" fill="#6f3" cx="200" cy="160"/> + <circle r="5" fill="#6f3" cx="200" cy="180"/> + <circle r="5" fill="#6f3" cx="200" cy="200"/> + <!-- Test range and values outside range (should be clamped to valid range) --> + <path stroke="blue" stroke-width="10" fill="none" stroke-opacity="-1.0" d=" M 20 20 L 200 20"/> + <path stroke="blue" stroke-width="10" fill="none" stroke-opacity="-0.1" d=" M 20 40 L 200 40"/> + <path stroke="blue" stroke-width="10" fill="none" stroke-opacity="0.0" d=" M 20 60 L 200 60"/> + <path stroke="blue" stroke-width="10" fill="none" stroke-opacity="0.2" d=" M 20 80 L 200 80"/> + <path stroke="blue" stroke-width="10" fill="none" stroke-opacity="0.4" d=" M 20 100 L 200 100"/> + <path stroke="blue" stroke-width="10" fill="none" stroke-opacity="0.6" d=" M 20 120 L 200 120"/> + <path stroke="blue" stroke-width="10" fill="none" stroke-opacity="0.8" d=" M 20 140 L 200 140"/> + <path stroke="blue" stroke-width="10" fill="none" stroke-opacity="1.0" d=" M 20 160 L 200 160"/> + <path stroke="blue" stroke-width="10" fill="none" stroke-opacity="1.1" d=" M 20 180 L 200 180"/> + <path stroke="blue" stroke-width="10" fill="none" stroke-opacity="2.0" d=" M 20 200 L 200 200"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-stroke-09-t-manual.svg b/testing/web-platform/tests/svg/import/painting-stroke-09-t-manual.svg new file mode 100644 index 000000000..850962c84 --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-stroke-09-t-manual.svg @@ -0,0 +1,59 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="CL" author="CM" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: painting-stroke-09-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#StrokeDasharrayProperty"> + <p> + This tests that the "stroke-dasharray" property accepts values + that are separated by white space. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if it matches the reference rendering + by showing a thick stroke with alternating long and short + stroke dashes. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-stroke-09-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ====================================================================== --> + <!-- Test stroke-dasharray and stroke-dashoffset --> + <!-- ====================================================================== --> + <path fill="none" stroke="black" stroke-width="25" stroke-dasharray="25 5 , 5 5" d="M50,120 h385"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/painting-stroke-10-t-manual.svg b/testing/web-platform/tests/svg/import/painting-stroke-10-t-manual.svg new file mode 100644 index 000000000..1bad081e6 --- /dev/null +++ b/testing/web-platform/tests/svg/import/painting-stroke-10-t-manual.svg @@ -0,0 +1,78 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="CM" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: painting-stroke-10-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#StrokeProperties"> + <p> + This tests that stroking of zero length subpaths will result in + some rendering if the 'stroke-linecap' property is set to + 'square' or 'round', but not if it is set to 'butt'. + </p> + <p> + Simply load the test. Two rows of shapes should be presented, + with a text label describing the row. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Simply load the test. Two rows of shapes should be presented, + with a text label describing the row. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: painting-stroke-10-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text x='10' y='40'>Test stroking of zero length subpaths</text> + + <g stroke-width='50' stroke='blue' fill='none'> + <path d='M190,170 L190,170' stroke-linecap='round'/> + <path d='M290,170 L290,170' stroke-linecap='square'/> + <path d='M390,170 L390,170' stroke-linecap='butt' stroke='red'/> + + <path d='M190,240 c0,0 0,0 0,0' stroke-linecap='round'/> + <path d='M290,240 c0,0 0,0 0,0' stroke-linecap='square'/> + <path d='M390,240 c0,0 0,0 0,0' stroke-linecap='butt' stroke='red'/> + </g> + + <g font-size='12'> + <text x='10' y='175'>Using an 'L' command:</text> + <text x='10' y='245'>Using a 'c' command:</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- +<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/paths-data-01-t-manual.svg b/testing/web-platform/tests/svg/import/paths-data-01-t-manual.svg new file mode 100644 index 000000000..e6b972d7a --- /dev/null +++ b/testing/web-platform/tests/svg/import/paths-data-01-t-manual.svg @@ -0,0 +1,151 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Lofton Henderson" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: paths-data-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/paths.html#PathData"> + <p> + Test that the viewer has the basic capability to handle the 'path' + element and its data (d) attribute in combination with the cubic + Bezier curveto commands, C, c, S, s (plus Mm and Zz). + </p> + <p> + There are 8 subtests, each composed from the cubic Bezier path commands per + the label by the subtest. On-curve control points (i.e., the curve position) + are marked by small blue squares. Subtests are filled, or stroked, or + both, using simple style properties and colors. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image exactly + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: paths-data-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ====================================================================== --> + <!-- First Curve "X" that has subpath utilizing M, C, S, m, c, & s ======== --> + <!-- ====================================================================== --> + <text font-size="12" x="100" y="14">Cubic bezier curves drawn with commands:</text> + <path id="X_curve_MCSmcs" fill="#00FF00" stroke="#00C000" d=" M 210 130 C 145 130 110 80 110 80 S 75 25 10 25 m 0 105 c 65 0 100 -50 100 -50 s 35 -55 100 -55 "/> + <!-- ====================================================================== --> + <!-- Markers for path control points ===================================== --> + <!-- ====================================================================== --> + <rect x="208" y="128" width="4" height="4" fill="#4A83FF" stroke="none"/> + <rect x="108" y="78" width="4" height="4" fill="#4A83FF" stroke="none"/> + <rect x="8" y="23" width="4" height="4" fill="#4A83FF" stroke="none"/> + <rect x="8" y="128" width="4" height="4" fill="#4A83FF" stroke="none"/> + <rect x="108" y="78" width="4" height="4" fill="#4A83FF" stroke="none"/> + <rect x="208" y="23" width="4" height="4" fill="#4A83FF" stroke="none"/> + <text font-size="12" x="5" y="82">M, C, S, m, c, s</text> + <!-- ====================================================================== --> + <!-- Infinity using M, c, c, c, C & z ===================================== --> + <!-- ====================================================================== --> + <path id="Infinity_McccCz" fill="none" stroke="#000000" d=" M 240 90 c 0 30 7 50 50 0 c 43 -50 50 -30 50 0 c 0 83 -68 -34 -90 -30 C 240 60 240 90 240 90 z "/> + <!-- ====================================================================== --> + <!-- Markers for path control points ====================================== --> + <!-- ====================================================================== --> + <rect x="238" y="88" width="4" height="4" fill="#4A83FF" stroke="none"/> + <rect x="288" y="88" width="4" height="4" fill="#4A83FF" stroke="none"/> + <rect x="338" y="88" width="4" height="4" fill="#4A83FF" stroke="none"/> + <rect x="248" y="58" width="4" height="4" fill="#4A83FF" stroke="none"/> + <text font-size="12" x="253" y="50">M, c, c, c, C, z</text> + <!-- ====================================================================== --> + <!-- Horizontal line utilizing M, C & Z =================================== --> + <!-- ====================================================================== --> + <path id="Line_MCZ" fill="none" stroke="#000000" d="M80 170 C100 170 160 170 180 170Z"/> + <!-- ====================================================================== --> + <!-- Markers for path control points ====================================== --> + <!-- ====================================================================== --> + <rect x="78" y="168" width="4" height="4" fill="#4A83FF" stroke="none"/> + <rect x="178" y="168" width="4" height="4" fill="#4A83FF" stroke="none"/> + <text font-size="12" x="110" y="190">M, C, Z</text> + <!-- ====================================================================== --> + <!-- Inverted V using M, C, c & Z ========================================= --> + <!-- ====================================================================== --> + <path id="Inv_V_MCcZ" fill="#00C000" stroke="none" d="M5 260 C40 260 60 175 55 160 c -5 15 15 100 50 100Z"/> + <!-- ====================================================================== --> + <!-- Markers for path control points ====================================== --> + <!-- ====================================================================== --> + <rect x="3" y="258" width="4" height="4" fill="#4A83FF" stroke="none"/> + <rect x="53" y="158" width="4" height="4" fill="#4A83FF" stroke="none"/> + <rect x="103" y="258" width="4" height="4" fill="#4A83FF" stroke="none"/> + <text font-size="12" x="85" y="220">M, C, c, Z</text> + <!-- ====================================================================== --> + <!-- Remembrance Ribbon using m, c & s ==================================== --> + <!-- ====================================================================== --> + <path id="Rem_Rib_mcs" fill="none" stroke="#000000" d="m 200 260 c 50 -40 50 -100 25 -100 s -25 60 25 100 "/> + <!-- ====================================================================== --> + <!-- Markers for path control points ====================================== --> + <!-- ====================================================================== --> + <rect x="198" y="258" width="4" height="4" fill="#4A83FF" stroke="none"/> + <rect x="223" y="158" width="4" height="4" fill="#4A83FF" stroke="none"/> + <rect x="248" y="258" width="4" height="4" fill="#4A83FF" stroke="none"/> + <text font-size="12" x="165" y="210">m, c, s</text> + <!-- ====================================================================== --> + <!-- 90 degree arc using M & C ============================================ --> + <!-- ====================================================================== --> + <path id="Arc_MC" fill="#0000FF" stroke="#000000" d=" M 360 100 C 420 90 460 140 450 190"/> + <!-- ====================================================================== --> + <!-- Markers for path control points ====================================== --> + <!-- ====================================================================== --> + <rect x="358" y="98" width="4" height="4" fill="#4A83FF" stroke="none"/> + <rect x="448" y="188" width="4" height="4" fill="#4A83FF" stroke="none"/> + <text font-size="12" x="360" y="150">M, C</text> + <!-- ====================================================================== --> + <!-- Circle using M, c, s, s, s & z ======================================= --> + <!-- ====================================================================== --> + <path id="Circle_Mcssz" fill="#FFFF00" stroke="#000000" d="M360 210 c 0 20 -16 36 -36 36 s -36 -16 -36 -36 s 16 -36 36 -36 s 36 16 36 36 z "/> + <!-- ====================================================================== --> + <!-- Markers for path control points ====================================== --> + <!-- ====================================================================== --> + <rect x="358" y="208" width="4" height="4" fill="#4A83FF" stroke="none"/> + <rect x="322" y="244" width="4" height="4" fill="#4A83FF" stroke="none"/> + <rect x="286" y="208" width="4" height="4" fill="#4A83FF" stroke="none"/> + <rect x="322" y="172" width="4" height="4" fill="#4A83FF" stroke="none"/> + <text font-size="12" x="290" y="265">M, c, s, s, s, z</text> + <!-- ====================================================================== --> + <!-- Inverted horseshoe using m, c & z ==================================== --> + <!-- ====================================================================== --> + <path id="Horseshoe_Mcs" fill="#F0F0F0" stroke="#00AA00" d="m 360 325 c -40 -60 95 -100 80 0 z "/> + <!-- ====================================================================== --> + <!-- Markers for path control points ====================================== --> + <!-- ====================================================================== --> + <rect x="358" y="323" width="4" height="4" fill="#4A83FF" stroke="none"/> + <rect x="438" y="323" width="4" height="4" fill="#4A83FF" stroke="none"/> + <text font-size="12" x="380" y="340">m, c, z</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/paths-data-02-t-manual.svg b/testing/web-platform/tests/svg/import/paths-data-02-t-manual.svg new file mode 100644 index 000000000..cad5865d6 --- /dev/null +++ b/testing/web-platform/tests/svg/import/paths-data-02-t-manual.svg @@ -0,0 +1,124 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Lofton Henderson" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: paths-data-02-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/paths.html#PathData"> + <p> + Test that the viewer has the basic capability to handle the 'path' + element and its data (d) attribute in combination with the quadratic + Bezier curveto commands, Q, q, T, t (plus Mm and Zz). + </p> + <p> + There are 7 subtests, each composed from the quadric Bezier path commands per + the label by the subtest. On-curve control points (i.e., the curve position) + are marked by small colored squares. Subtests are filled, or stroked, or + both, using simple style properties and colors. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image exactly + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: paths-data-02-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-size="12" x="120" y="14">Quadric bezier curves drawn with commands:</text> + <!-- ====================================================================== --> + <!-- Quad Bezier with sub-path using M, Q, M, q, & z ====================== --> + <!-- ====================================================================== --> + <path id="Bez_MQMqz" fill="none" stroke="#0000FF" stroke-width="3" d="M 15 20 Q 30 120 130 30 M 180 80 q -75 -100 -163 -60z"/> + <text font-size="12" x="80" y="86">M, Q, M, q, z</text> + <rect x="13" y="18" width="4" height="4" fill="#00C000" stroke="none"/> + <rect x="128" y="28" width="4" height="4" fill="#00C000" stroke="none"/> + <rect x="178" y="78" width="4" height="4" fill="#00C000" stroke="none"/> + <rect x="15" y="18" width="4" height="4" fill="#00C000" stroke="none"/> + <!-- ====================================================================== --> + <!-- Quad Bezier with sub-path using m, q, z, m, q, & z =================== --> + <!-- ====================================================================== --> + <path id="Bez_fill_MQzmqz" fill="#FFFF00" stroke="#0000CF" d="M372 130Q272 50 422 10zm70 0q50-150-80-90z"/> + <text font-size="12" x="352" y="150">m, q, z, m, q, z</text> + <rect x="370" y="128" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="420" y="8" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="440" y="128" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="360" y="38" width="4" height="4" fill="#0000FF" stroke="none"/> + <!-- ====================================================================== --> + <!-- Simple Bezier using M, Q, & Z ======================================== --> + <!-- ====================================================================== --> + <path id="Bez_stroke_MQz" fill="none" stroke="#00FFFF" d="M224 103Q234 -12 304 33Z"/> + <text font-size="12" x="192" y="36">M, Q, Z</text> + <rect x="222" y="101" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="302" y="31" width="4" height="4" fill="#0000FF" stroke="none"/> + <!-- ====================================================================== --> + <!-- Tri Bezier using M, Q, T, Q, & z ===================================== --> + <!-- ====================================================================== --> + <path id="Tri_MQTQz" fill="#00C000" stroke="#000000" d="M208 168Q258 268 308 168T258 118Q128 88 208 168z"/> + <text font-size="12" x="308" y="188">M, Q, T, Q, z</text> + <rect x="206" y="166" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="306" y="166" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="256" y="116" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="206" y="206" width="4" height="4" fill="#0000FF" stroke="none"/> + <!-- ====================================================================== --> + <!-- Double Bezier using M, Q, Q, & z ===================================== --> + <!-- ====================================================================== --> + <path id="Inv_V_MCcZ" fill="#00CF00" stroke="none" d=" M 60 100 Q -40 150 60 200 Q 160 150 60 100 z "/> + <text font-size="12" x="80" y="200">M, Q, Q, z</text> + <rect x="58" y="98" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="58" y="198" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="58" y="98" width="4" height="4" fill="#0000FF" stroke="none"/> + <!-- ====================================================================== --> + <!-- Sin Wave using M, q, t, t, t, t, & z ================================ --> + <!-- ====================================================================== --> + <path id="Sin_Mqttttz" fill="none" stroke="#40DD20" d="M240 296q25-100 47 0t47 0t47 0t47 0t47 0z"/> + <text font-size="12" x="380" y="236">M, q, t, t, t, t, z</text> + <rect x="238" y="294" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="285" y="294" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="332" y="294" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="379" y="294" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="426" y="294" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="473" y="294" width="4" height="4" fill="#0000FF" stroke="none"/> + <!-- ====================================================================== --> + <!-- Double Spade using M, q, Q, q, Q, & z ================================ --> + <!-- ====================================================================== --> + <path id="Dbl_spd_MCcZ" fill="#0000C0" stroke="#00CF00" stroke-width="2" d="M172 193q-100 50 0 50Q72 243 172 293q100 -50 0 -50Q272 243 172 193z"/> + <text font-size="12" x="48" y="280">M, q, Q, q, Q, z</text> + <rect x="170" y="191" width="4" height="4" fill="#40DD20" stroke="none"/> + <rect x="170" y="241" width="4" height="4" fill="#40DD20" stroke="none"/> + <rect x="170" y="291" width="4" height="4" fill="#40DD20" stroke="none"/> + <rect x="170" y="241" width="4" height="4" fill="#40DD20" stroke="none"/> + <rect x="170" y="191" width="4" height="4" fill="#40DD20" stroke="none"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/paths-data-03-f-manual.svg b/testing/web-platform/tests/svg/import/paths-data-03-f-manual.svg new file mode 100644 index 000000000..3f087fdce --- /dev/null +++ b/testing/web-platform/tests/svg/import/paths-data-03-f-manual.svg @@ -0,0 +1,113 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Lofton Henderson" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: paths-data-03-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/paths.html#PathData"> + <p> + Test that the viewer has the basic capability to handle the 'path' + element and its data (d) attribute in combination with the elliptical + arc curveto commands, A, a (plus Mm and Zz). + </p> + <p> + There are 6 subtests, each composed from the elliptical arc path commands per + the label by the subtest. The curve positions + are marked by small colored squares. Subtests are filled, or stroked, or + both, using simple style properties and colors. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image exactly + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: paths-data-03-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-size="12" x="120" y="14">Elliptical arc curves drawn with commands:</text> + <!-- ====================================================================== --> + <!-- Simple circle using MAZ ============================ --> + <!-- ====================================================================== --> + <path id="Arc_MAZ" fill="none" stroke="#03DD20" stroke-width="10" d=" M 25 70 A 40 40 0 1 0 25 69 Z "/> + <text font-size="12" x="48" y="70">M, A, Z</text> + <rect x="23" y="68" width="4" height="4" fill="#00C000" stroke="none"/> + <rect x="23" y="67" width="4" height="4" fill="#00C000" stroke="none"/> + <!-- ====================================================================== --> + <!-- filled arc using m, a, & z =================== --> + <!-- ====================================================================== --> + <path id="Arc_fill_maz" fill="#00FF00" stroke="#0000FF" d=" m 150 100 a 50 40 0 1 0 25 -70 z "/> + <text font-size="12" x="124" y="45">m, a, z</text> + <rect x="148" y="98" width="4" height="4" fill="#CF0000" stroke="none"/> + <rect x="173" y="28" width="4" height="4" fill="#CF0000" stroke="none"/> + <!-- ====================================================================== --> + <!-- Unterminated arc using M & a ======================================== --> + <!-- ====================================================================== --> + <path id="Arc_Ma" fill="none" stroke="#000000" d=" M 350 245 a 40 40 0 1 0 80 60 "/> + <text font-size="12" x="390" y="300">M, a</text> + <rect x="348" y="243" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="428" y="303" width="4" height="4" fill="#0000FF" stroke="none"/> + <!-- ====================================================================== --> + <!-- Triple Arc using M, A, a, a, & z ===================================== --> + <!-- ====================================================================== --> + <path id="Tri_MAaaz" fill="#0067C0" stroke="none" fill-rule="evenodd" d=" M 270 30 A 50 50 0 1 0 345 30 a 50 50 0 1 0 50 0 a 50 50 0 1 0 25 0 z "/> + <text font-size="12" x="280" y="135">M, A, a, a, z</text> + <rect x="268" y="28" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="343" y="28" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="393" y="28" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="418" y="28" width="4" height="4" fill="#0000FF" stroke="none"/> + <!-- ====================================================================== --> + <!-- Tripple arc using M, a, Z, m, A, Z, m, a & z ===================================== --> + <!-- ====================================================================== --> + <path id="Arc_MaZmAzmaz" fill="#609040" stroke="#000000" stroke-width="3" d=" M 30 150 a 40 40 0 0 1 65 50 Z m 30 30 A 20 20 0 0 0 125 230 Z m 40 24 a 20 20 0 0 1 65 50 z "/> + <text font-size="12" x="25" y="270">M, a, Z, m, A, Z, m, a, z</text> + <rect x="28" y="148" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="93" y="198" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="58" y="178" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="123" y="228" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="98" y="202" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="163" y="252" width="4" height="4" fill="#0000FF" stroke="none"/> + <!-- ====================================================================== --> + <!-- Sin Wave using M, q, t, t, t, t, & z ================================ --> + <!-- ====================================================================== --> + <path id="Sin_MAAAAA" fill="none" stroke="#40DD20" d=" M 215 190 A 40 200 10 0 0 265 190 A 40 200 20 0 1 315 190 A 40 200 30 0 0 365 190 A 40 200 40 0 1 415 190 A 40 200 50 0 0 465 190 "/> + <text font-size="12" x="215" y="246">M, A, A, A, A</text> + <rect x="213" y="188" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="263" y="188" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="313" y="188" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="363" y="188" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="413" y="188" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="463" y="188" width="4" height="4" fill="#0000FF" stroke="none"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/paths-data-04-t-manual.svg b/testing/web-platform/tests/svg/import/paths-data-04-t-manual.svg new file mode 100644 index 000000000..63fef4358 --- /dev/null +++ b/testing/web-platform/tests/svg/import/paths-data-04-t-manual.svg @@ -0,0 +1,82 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Lofton Henderson" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: paths-data-04-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/paths.html#PathData"> + <p> + Verify the basic capability to handle the 'path' element, and its data attribute (d) + in combination with the straight-line path commands. + Two pairs of concentric equilateral triangles are drawn using respectively + M,L,Z and m,l,z. The shapes are identical, with one stroked and + one filled. The fill-mode default of "even-odd" means that + the inner triangle is hollow. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image exactly + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: paths-data-04-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ====================================================================== --> + <!-- First Group of Triangles using M, L & Z commands ===================== --> + <!-- ====================================================================== --> + <g transform="scale(1.8)"> + <!-- <text font-size="12" x="160" y="14">Lines drawn with commands:</text> --> + <text font-size="12" x="88" y="30">M, L, L, L, Z,</text> + <text font-size="12" x="98" y="46">subpath</text> + <text font-size="12" x="88" y="61">M, L, L, L, Z</text> + <path id="Triangle_stroke_MLZ" fill="none" stroke="#000000" d=" M 62.00000 56.00000 L 113.96152 146.00000 L 10.03848 146.00000 L 62.00000 56.00000 Z M 62.00000 71.00000 L 100.97114 138.50000 L 23.02886 138.50000 L 62.00000 71.00000 Z "/> + <rect x="60.00000" y="54.00000" width="4" height="4" fill="#00C000" stroke="none"/> + <rect x="111.96152" y="144.00000" width="4" height="4" fill="#00C000" stroke="none"/> + <rect x="8.03848" y="144.00000" width="4" height="4" fill="#00C000" stroke="none"/> + <rect x="60.00000" y="69.00000" width="4" height="4" fill="#00C000" stroke="none"/> + <rect x="98.97114" y="136.50000" width="4" height="4" fill="#00C000" stroke="none"/> + <rect x="21.02886" y="136.50000" width="4" height="4" fill="#00C000" stroke="none"/> + <text font-size="12" x="42" y="162">stroked</text> + <path id="Triangle_fill_MLZ" fill="#7FA" stroke="none" fill-rule="evenodd" d=" M 177.00000 56.00000 L 228.96152 146.00000 L 125.03848 146.00000 L 177.00000 56.00000 Z M 177.00000 71.00000 L 215.97114 138.50000 L 138.02886 138.50000 L 177.00000 71.00000 Z "/> + <rect x="175.00000" y="54.00000" width="4" height="4" fill="#00C000" stroke="none"/> + <rect x="226.96152" y="144.00000" width="4" height="4" fill="#00C000" stroke="none"/> + <rect x="123.03848" y="144.00000" width="4" height="4" fill="#00C000" stroke="none"/> + <rect x="175.00000" y="69.00000" width="4" height="4" fill="#00C000" stroke="none"/> + <rect x="213.97114" y="136.50000" width="4" height="4" fill="#00C000" stroke="none"/> + <rect x="136.02886" y="136.50000" width="4" height="4" fill="#00C000" stroke="none"/> + <text font-size="12" x="162" y="162">filled</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/paths-data-05-t-manual.svg b/testing/web-platform/tests/svg/import/paths-data-05-t-manual.svg new file mode 100644 index 000000000..cea68ca97 --- /dev/null +++ b/testing/web-platform/tests/svg/import/paths-data-05-t-manual.svg @@ -0,0 +1,79 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Lofton Henderson" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: paths-data-05-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/paths.html#PathData"> + <p> + Verify the basic capability to handle the 'path' element, and its data attribute (d) + in combination with the straight-line path commands. + Two pairs of concentric equilateral triangles are drawn using respectively + M,L,Z and m,l,z. The shapes in each pair are identical, with one stroked and + one filled. The fill-mode default of "even-odd" means that + the inner triangle is hollow. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image exactly + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: paths-data-05-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ====================================================================== --> + <!-- Second Group of Triangles using m, l & z commands===================== --> + <!-- ====================================================================== --> + <g transform="scale(1.8) translate(0, -150)"> + <text font-size="12" x="96" y="180">m, l, l, l, z,</text> + <text font-size="12" x="100" y="194">subpath</text> + <text font-size="12" x="97" y="208">m, l, l, l, z</text> + <path id="Triangle_stroke_mlz" fill="none" stroke="#000000" d=" m 62.00000 190.00000 l 51.96152 90.00000 l -103.92304 0.00000 l 51.96152 -90.00000 z m 0.00000 15.00000 l 38.97114 67.50000 l -77.91228 0.00000 l 38.97114 -67.50000 z "/> + <rect x="60.00000" y="188.00000" width="4" height="4" fill="#40DD20" stroke="none"/> + <rect x="111.96152" y="278.00000" width="4" height="4" fill="#40DD20" stroke="none"/> + <rect x="8.03848" y="278.00000" width="4" height="4" fill="#40DD20" stroke="none"/> + <rect x="60.00000" y="203.00000" width="4" height="4" fill="#40DD20" stroke="none"/> + <rect x="98.97114" y="270.50000" width="4" height="4" fill="#40DD20" stroke="none"/> + <rect x="21.02886" y="270.50000" width="4" height="4" fill="#40DD20" stroke="none"/> + <path id="Triangle_fill_mlz" fill="#006000" stroke="none" fill-rule="evenodd" d=" m 177.00000 190.00000 l 51.96152 90.00000 l -103.92304 0.00000 l 51.96152 -90.00000 z m 0.00000 15.00000 l 38.97114 67.50000 l -77.91228 0.00000 l 38.97114 -67.50000 z "/> + <rect x="175.00000" y="188.00000" width="4" height="4" fill="#40DD20" stroke="none"/> + <rect x="226.96152" y="278.00000" width="4" height="4" fill="#40DD20" stroke="none"/> + <rect x="123.03848" y="278.00000" width="4" height="4" fill="#40DD20" stroke="none"/> + <rect x="175.00000" y="203.00000" width="4" height="4" fill="#40DD20" stroke="none"/> + <rect x="213.97114" y="270.50000" width="4" height="4" fill="#40DD20" stroke="none"/> + <rect x="136.02886" y="270.50000" width="4" height="4" fill="#40DD20" stroke="none"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/paths-data-06-t-manual.svg b/testing/web-platform/tests/svg/import/paths-data-06-t-manual.svg new file mode 100644 index 000000000..5e0fa31c1 --- /dev/null +++ b/testing/web-platform/tests/svg/import/paths-data-06-t-manual.svg @@ -0,0 +1,83 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Lofton Henderson" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: paths-data-06-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/paths.html#PathData"> + <p> + Verify the basic capability to handle the 'path' element, and its data attribute (d) + in combination with the straight-line path commands. + Two pairs of staircase figures are drawn using + respectively M,H,V,Z and m,h,v,z. The shapes in each pair are identical, with one stroked and + one filled. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image exactly + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: paths-data-06-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="scale(1.8) translate(-200, 0)"> + <!-- ====================================================================== --> + <!-- First Group of Stairs using M, H, V & Z commands====================== --> + <!-- ====================================================================== --> + <text font-size="12" x="288" y="30">M, H, V, H,</text> + <text font-size="12" x="288" y="46">V. H, V, H,</text> + <text font-size="12" x="304" y="62">V, Z</text> + <path id="Stairs_stroke_MHVZ" fill="none" stroke="#000000" d=" M 240.00000 56.00000 H 270.00000 V 86.00000 H 300.00000 V 116.00000 H 330.00000 V 146.00000 H 240.00000 V 56.00000 Z "/> + <rect x="238.00000" y="54.00000" width="4" height="4" fill="#FFFF00" stroke="none"/> + <rect x="268.00000" y="54.00000" width="4" height="4" fill="#FFFF00" stroke="none"/> + <rect x="268.00000" y="84.00000" width="4" height="4" fill="#FFFF00" stroke="none"/> + <rect x="298.00000" y="84.00000" width="4" height="4" fill="#FFFF00" stroke="none"/> + <rect x="298.00000" y="114.00000" width="4" height="4" fill="#FFFF00" stroke="none"/> + <rect x="328.00000" y="114.00000" width="4" height="4" fill="#FFFF00" stroke="none"/> + <rect x="328.00000" y="144.00000" width="4" height="4" fill="#FFFF00" stroke="none"/> + <rect x="238.00000" y="144.00000" width="4" height="4" fill="#FFFF00" stroke="none"/> + <path id="Stairs_fill_MHVZ" fill="#0000FF" stroke="none" d=" M 350.00000 56.00000 H 380.00000 V 86.00000 H 410.00000 V 116.00000 H 440.00000 V 146.00000 H 350.00000 V 56.00000 Z "/> + <rect x="348.00000" y="54.00000" width="4" height="4" fill="#FFFF00" stroke="none"/> + <rect x="378.00000" y="54.00000" width="4" height="4" fill="#FFFF00" stroke="none"/> + <rect x="378.00000" y="84.00000" width="4" height="4" fill="#FFFF00" stroke="none"/> + <rect x="408.00000" y="84.00000" width="4" height="4" fill="#FFFF00" stroke="none"/> + <rect x="408.00000" y="114.00000" width="4" height="4" fill="#FFFF00" stroke="none"/> + <rect x="438.00000" y="114.00000" width="4" height="4" fill="#FFFF00" stroke="none"/> + <rect x="438.00000" y="144.00000" width="4" height="4" fill="#FFFF00" stroke="none"/> + <rect x="348.00000" y="144.00000" width="4" height="4" fill="#FFFF00" stroke="none"/> + <!-- ====================================================================== --> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/paths-data-07-t-manual.svg b/testing/web-platform/tests/svg/import/paths-data-07-t-manual.svg new file mode 100644 index 000000000..806e0b569 --- /dev/null +++ b/testing/web-platform/tests/svg/import/paths-data-07-t-manual.svg @@ -0,0 +1,82 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Lofton Henderson" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: paths-data-07-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/paths.html#PathData"> + <p> + Verify the basic capability to handle the 'path' element, and its data attribute (d) + in combination with the straight-line path commands. + Two pairs of staircase figures are drawn using + respectively M,H,V,Z and m,h,v,z. The shapes in each pair are identical, with one stroked and + one filled. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image exactly + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: paths-data-07-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="scale(1.8) translate(-200, -150)"> + <!-- ====================================================================== --> + <!-- Second Group of Stairs using m, h, v & z commands====================== --> + <!-- ====================================================================== --> + <text font-size="12" x="288" y="180">m, h, v, h</text> + <text font-size="12" x="288" y="194">v, h, v, h</text> + <text font-size="12" x="304" y="208">v, z</text> + <path id="Stairs_stroke_mhvz" fill="none" stroke="#000000" d=" m 240.00000 190.00000 h 30.00000 v 30.00000 h 30.00000 v 30.00000 h 30.00000 v 30.00000 h -90.00000 v -90.00000 z "/> + <rect x="238.00000" y="188.00000" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="268.00000" y="188.00000" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="268.00000" y="218.00000" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="298.00000" y="218.00000" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="298.00000" y="248.00000" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="328.00000" y="248.00000" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="328.00000" y="278.00000" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="238.00000" y="278.00000" width="4" height="4" fill="#0000FF" stroke="none"/> + <path id="Stairs_fill_mhvz" fill="#FFFF00" stroke="none" d=" m 350.00000 190.00000 h 30.00000 v 30.00000 h 30.00000 v 30.00000 h 30.00000 v 30.00000 h -90.00000 v -90.00000 z "/> + <rect x="348.00000" y="188.00000" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="378.00000" y="188.00000" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="378.00000" y="218.00000" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="408.00000" y="218.00000" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="408.00000" y="248.00000" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="438.00000" y="248.00000" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="438.00000" y="278.00000" width="4" height="4" fill="#0000FF" stroke="none"/> + <rect x="348.00000" y="278.00000" width="4" height="4" fill="#0000FF" stroke="none"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/paths-data-08-t-manual.svg b/testing/web-platform/tests/svg/import/paths-data-08-t-manual.svg new file mode 100644 index 000000000..5b2af84fd --- /dev/null +++ b/testing/web-platform/tests/svg/import/paths-data-08-t-manual.svg @@ -0,0 +1,82 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="SH" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: paths-data-08-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/paths.html#PathData"> + <p> + Verify the basic capability to handle the 'path' element, and its data attribute (d) + in combination with the straight-line path commands. + Two pairs of concentric equilateral triangles are drawn using + M and Z. No L commands are used in this test as they are implied after + an M or Z command. The shapes are identical, with one stroked and + one filled. The fill-mode default of "even-odd" means that + the inner triangle is hollow. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image exactly + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: paths-data-08-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ====================================================================== --> + <!-- First Group of Triangles using M & Z commands ======================== --> + <!-- ====================================================================== --> + <text font-size="24" x="75" y="34">Lines drawn with commands:</text> + <text font-size="24" x="180" y="64">M and Z</text> + + <g transform="scale(1.8)"> + <path id="Triangle_stroke_MZ" fill="none" stroke="#000000" d=" M 62.00000 56.00000 113.96152 146.00000 10.03848 146.00000 62.00000 56.00000 Z M 62.00000 71.00000 100.97114 138.50000 23.02886 138.50000 62.00000 71.00000 Z "/> + <rect x="60.00000" y="54.00000" width="4" height="4" fill="#00C000" stroke="none"/> + <rect x="111.96152" y="144.00000" width="4" height="4" fill="#00C000" stroke="none"/> + <rect x="8.03848" y="144.00000" width="4" height="4" fill="#00C000" stroke="none"/> + <rect x="60.00000" y="69.00000" width="4" height="4" fill="#00C000" stroke="none"/> + <rect x="98.97114" y="136.50000" width="4" height="4" fill="#00C000" stroke="none"/> + <rect x="21.02886" y="136.50000" width="4" height="4" fill="#00C000" stroke="none"/> + <text font-size="12" x="42" y="162">stroked</text> + <path id="Triangle_fill_MZ" fill="#05D" stroke="none" fill-rule="evenodd" d=" M 177.00000 56.00000 228.96152 146.00000 125.03848 146.00000 177.00000 56.00000 Z M 177.00000 71.00000 215.97114 138.50000 138.02886 138.50000 177.00000 71.00000 Z "/> + <rect x="175.00000" y="54.00000" width="4" height="4" fill="#00C000" stroke="none"/> + <rect x="226.96152" y="144.00000" width="4" height="4" fill="#00C000" stroke="none"/> + <rect x="123.03848" y="144.00000" width="4" height="4" fill="#00C000" stroke="none"/> + <rect x="175.00000" y="69.00000" width="4" height="4" fill="#00C000" stroke="none"/> + <rect x="213.97114" y="136.50000" width="4" height="4" fill="#00C000" stroke="none"/> + <rect x="136.02886" y="136.50000" width="4" height="4" fill="#00C000" stroke="none"/> + <text font-size="12" x="162" y="162">filled</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/paths-data-09-t-manual.svg b/testing/web-platform/tests/svg/import/paths-data-09-t-manual.svg new file mode 100644 index 000000000..d2908c207 --- /dev/null +++ b/testing/web-platform/tests/svg/import/paths-data-09-t-manual.svg @@ -0,0 +1,79 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="SH" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: paths-data-09-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/paths.html#PathData"> + <p> + Verify the basic capability to handle the 'path' element, and its data attribute (d) + in combination with the straight-line path commands. + Two pairs of concentric equilateral triangles are drawn using + m and z. No l commands are used in this test as they are implied after + an m or z command. The shapes are identical, with one stroked and + one filled. The fill-mode default of "even-odd" means that + the inner triangle is hollow. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image exactly + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: paths-data-09-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ====================================================================== --> + <!-- Second Group of Triangles using m & z commands ===================== --> + <!-- ====================================================================== --> + <text font-size="24" x="75" y="34">Lines drawn with commands:</text> + <text font-size="24" x="180" y="64">m and z</text> + <g transform="scale(1.8) translate(0, -150)"> + <path id="Triangle_stroke_mz" fill="none" stroke="#000000" d=" m 62.00000 190.00000 51.96152 90.00000 -103.92304 0.00000 51.96152 -90.00000 z m 0.00000 15.00000 38.97114 67.50000 -77.91228 0.00000 38.97114 -67.50000 z "/> + <rect x="60.00000" y="188.00000" width="4" height="4" fill="#40DD20" stroke="none"/> + <rect x="111.96152" y="278.00000" width="4" height="4" fill="#40DD20" stroke="none"/> + <rect x="8.03848" y="278.00000" width="4" height="4" fill="#40DD20" stroke="none"/> + <rect x="60.00000" y="203.00000" width="4" height="4" fill="#40DD20" stroke="none"/> + <rect x="98.97114" y="270.50000" width="4" height="4" fill="#40DD20" stroke="none"/> + <rect x="21.02886" y="270.50000" width="4" height="4" fill="#40DD20" stroke="none"/> + <path id="Triangle_fill_mz" fill="#006000" stroke="none" fill-rule="evenodd" d=" m 177.00000 190.00000 51.96152 90.00000 -103.92304 0.00000 51.96152 -90.00000 z m 0.00000 15.00000 38.97114 67.50000 -77.91228 0.00000 38.97114 -67.50000 z "/> + <rect x="175.00000" y="188.00000" width="4" height="4" fill="#40DD20" stroke="none"/> + <rect x="226.96152" y="278.00000" width="4" height="4" fill="#40DD20" stroke="none"/> + <rect x="123.03848" y="278.00000" width="4" height="4" fill="#40DD20" stroke="none"/> + <rect x="175.00000" y="203.00000" width="4" height="4" fill="#40DD20" stroke="none"/> + <rect x="213.97114" y="270.50000" width="4" height="4" fill="#40DD20" stroke="none"/> + <rect x="136.02886" y="270.50000" width="4" height="4" fill="#40DD20" stroke="none"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/paths-data-10-t-manual.svg b/testing/web-platform/tests/svg/import/paths-data-10-t-manual.svg new file mode 100644 index 000000000..ebfcda851 --- /dev/null +++ b/testing/web-platform/tests/svg/import/paths-data-10-t-manual.svg @@ -0,0 +1,111 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="SH" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: paths-data-10-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/paths.html#PathData"> + <p> + Verify that the viewer renders the line caps and line joins for + open and closed paths properly. + Verify that the open triangular paths are stroked differently at + ends of the path than they are at their intermediate corners. + In contrast, the corners of a closed path should all appear the + same. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image exactly + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: paths-data-10-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="translate(10,10)"> + <text font-size="18" x="10" y="20">open</text> + <text font-size="18" x="10" y="38">join=round</text> + <text font-size="18" x="10" y="56">cap=butt</text> + <text font-size="18" x="10" y="74">M, L</text> + <g transform="translate(115,0)"> + <path id="triangle-01" fill="green" stroke="#39D" stroke-width="15" stroke-linecap="butt" stroke-linejoin="round" d="M 100 0 L 100 80 0 40 100 0"/> + </g> + </g> + <g transform="translate(10,115)"> + <text font-size="18" x="10" y="20">open</text> + <text font-size="18" x="10" y="38">join=bevel</text> + <text font-size="18" x="10" y="56">cap=round</text> + <text font-size="18" x="10" y="74">m, l</text> + <g transform="translate(115,0)"> + <path id="triangle-02" fill="green" stroke="#39D" stroke-width="15" stroke-linecap="round" stroke-linejoin="bevel" d="m 100 0 l 0 80 -100 -40 100 -40"/> + </g> + </g> + <g transform="translate(10,220)"> + <text font-size="18" x="10" y="20">open</text> + <text font-size="18" x="10" y="38">join=miter</text> + <text font-size="18" x="10" y="56">cap=square</text> + <text font-size="18" x="10" y="74">M, L</text> + <g transform="translate(115,0)"> + <path id="triangle-03" fill="green" stroke="#39D" stroke-width="15" stroke-linecap="square" stroke-linejoin="miter" d="M 100 0 L 100 80 0 40 100 0"/> + </g> + </g> + <g transform="translate(250,10)"> + <text font-size="18" x="125" y="20">closed</text> + <text font-size="18" x="125" y="38">join=round</text> + <text font-size="18" x="125" y="56">cap=butt</text> + <text font-size="18" x="125" y="74">M, L, Z</text> + <g transform="translate(0,0)"> + <path id="triangle-04" fill="green" stroke="#39D" stroke-width="15" stroke-linecap="butt" stroke-linejoin="round" d="M 0 0 L 100 40 0 80 Z"/> + </g> + </g> + <g transform="translate(250,115)"> + <text font-size="18" x="125" y="20">closed</text> + <text font-size="18" x="125" y="38">join=bevel</text> + <text font-size="18" x="125" y="56">cap=round</text> + <text font-size="18" x="125" y="74">m, l, z</text> + <g transform="translate(0,0)"> + <path id="triangle-05" fill="green" stroke="#39D" stroke-width="15" stroke-linecap="round" stroke-linejoin="bevel" d="m 0 0 l 100 40 -100 40 z"/> + </g> + </g> + <g transform="translate(250,220)"> + <text font-size="18" x="125" y="20">closed</text> + <text font-size="18" x="125" y="38">join=miter</text> + <text font-size="18" x="125" y="56">cap=square</text> + <text font-size="18" x="125" y="74">M, L, Z</text> + <g transform="translate(0,0)"> + <path id="triangle-06" fill="green" stroke="#39D" stroke-width="15" stroke-linecap="square" stroke-linejoin="miter" d="M 0 0 L 100 40 0 80 Z"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/paths-data-12-t-manual.svg b/testing/web-platform/tests/svg/import/paths-data-12-t-manual.svg new file mode 100644 index 000000000..ef5666c45 --- /dev/null +++ b/testing/web-platform/tests/svg/import/paths-data-12-t-manual.svg @@ -0,0 +1,66 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CN" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: paths-data-12-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/paths.html#PathData"> + <p> + Test using multiple coord sets to build a polybeizer, and implicit values for initial S. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image exactly, except for possible variations in the labelling text (per CSS2 rules). + </p> + + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: paths-data-12-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- Use multiple coord sets to build a polybeizer--> + <path fill="none" stroke="black" stroke-width="3" d="M 100 100 C 100 20 200 20 200 100 S 300 180 300 100"/> + <rect x="100" y="100" width="4" height="4" fill="blue" stroke="none"/> + <rect x="200" y="100" width="4" height="4" fill="blue" stroke="none"/> + <rect x="300" y="100" width="4" height="4" fill="blue" stroke="none"/> + <!-- Test if S not preceeded by either C or S , first control point is coincident with the current point.--> + <path fill="none" stroke="black" stroke-width="3" d="M 100 250 S 200 200 200 250 300 300 300 250"/> + <rect x="100" y="250" width="4" height="4" fill="blue" stroke="none"/> + <rect x="200" y="200" width="4" height="4" fill="blue" stroke="none"/> + <rect x="200" y="250" width="4" height="4" fill="blue" stroke="none"/> + <rect x="200" y="300" width="4" height="4" fill="blue" stroke="none"/> + <rect x="300" y="300" width="4" height="4" fill="blue" stroke="none"/> + <rect x="300" y="250" width="4" height="4" fill="blue" stroke="none"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/paths-data-13-t-manual.svg b/testing/web-platform/tests/svg/import/paths-data-13-t-manual.svg new file mode 100644 index 000000000..8525043b2 --- /dev/null +++ b/testing/web-platform/tests/svg/import/paths-data-13-t-manual.svg @@ -0,0 +1,56 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CN" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: paths-data-13-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/paths.html#PathData"> + <p> + Test multiple coordinates for V and H. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test is passed if there is one horizontal green line and one vertical blue line. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: paths-data-13-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- Use multiple coords to H, should get a straight horizontal line --> + <path stroke="green" stroke-width="5" d=" M 240.00000 56.00000 H 270.00000 300.00000 320.00000 400.00000 "/> + + <!-- Use multiple coords to V, should get a straight vertical line --> + <path stroke="blue" stroke-width="5" d=" M 240.00000 156.00000 V 180.00000 200.00000 260.00000 300.00000 "/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/paths-data-14-t-manual.svg b/testing/web-platform/tests/svg/import/paths-data-14-t-manual.svg new file mode 100644 index 000000000..543370e1c --- /dev/null +++ b/testing/web-platform/tests/svg/import/paths-data-14-t-manual.svg @@ -0,0 +1,56 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CN" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: paths-data-14-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/paths.html#PathData"> + <p> + Test implicit values for moveto. If the first command is 'm' it should be taken as an absolute moveto, plus implicit lineto. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test is passed if the three triangles are shown: two concentric, unfilled + triangles with black strokes on the left, and one unfilled triangle with + a thick blue stroke on the right.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: paths-data-14-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="scale(1.8)"> + <!-- If the first command is 'm' it should be taken as an absolute moveto, plus implicit lineto. --> + <path fill="none" stroke="#000000" d=" m 62.00000 56.00000 51.96152 90.00000 -103.92304 0.00000 51.96152 -90.00000 z m 0.00000 15.00000 38.97114 67.50000 -77.91228 0.00000 38.97114 -67.50000 z "/> + <!-- Test implicit lineto. --> + <path fill="#0000FF" stroke="none" fill-rule="evenodd" d=" M 177.00000 56.00000 228.96152 146.00000 125.03848 146.00000 177.00000 56.00000 Z M 177.00000 71.00000 215.97114 138.50000 138.02886 138.50000 177.00000 71.00000 Z "/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/paths-data-15-t-manual.svg b/testing/web-platform/tests/svg/import/paths-data-15-t-manual.svg new file mode 100644 index 000000000..7b9dcbbb2 --- /dev/null +++ b/testing/web-platform/tests/svg/import/paths-data-15-t-manual.svg @@ -0,0 +1,60 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CN" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: paths-data-15-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/paths.html#PathData"> + <p> + Test using multiple coord sets to build a polybezier, then T with no preceding Q or T. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if the rendering matches the reference image, apart from any allowable font selection differences due to CSS2.</p> + <p>A purple wavy line above a short, blue horizontal line must be shown. + Small black triangles pointing to the start, middle and end of the blue + line must also be shown.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: paths-data-15-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="scale(1.8) translate(20 50)"> + <!-- Use multiple coord sets to build a polybezier--> + <path fill="none" stroke="purple" stroke-width="3" d="M 20 20 Q 50 10 80 20 110 30 140 20 170 10 200 20"/> + <!-- Test if T not preceded by either Q or T , control point should be coincident with the current point.--> + <path fill="none" stroke="blue" stroke-width="3" d="M 20 50 T 50 50 80 50"/> + <path d="M 20,52 l-2,4 h4 z"/> + <path d="M 50,52 l-2,4 h4 z"/> + <path d="M 80,52 l-2,4 h4 z"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/paths-data-16-t-manual.svg b/testing/web-platform/tests/svg/import/paths-data-16-t-manual.svg new file mode 100644 index 000000000..ce768ecca --- /dev/null +++ b/testing/web-platform/tests/svg/import/paths-data-16-t-manual.svg @@ -0,0 +1,69 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CM" status="accepted" + version="$Revision: 1.4 $" testname="$RCSfile: paths-data-16-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/paths.html#PathData"> + <p> + This tests that any implicit lineto commands that result from an + 'M' or 'm' command with more than one pair of coordinates are absolute + if the moveto was specified with 'M' and relative if the moveto was + specified with 'm'. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + After loading the test, the test is passed if two yellow + triangles with black borders are shown. Otherwise, the + test has failed. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: paths-data-16-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text x='10' y='40' font-size='13'>Test relative-ness of implicit lineto path commands</text> + + <g fill='red' stroke='red' stroke-width='16' stroke-linejoin='round'> + <path d='M100,120 L160,220 L40,220 z'/> + <path d='M350,120 L410,220 L290,220 z'/> + </g> + <g fill='gold' stroke='black' stroke-width='16' stroke-linejoin='round'> + <path d='M100,120 160,220 40,220 z'/> + <path d='m350,120 60,100 -120,0 z'/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/paths-data-17-f-manual.svg b/testing/web-platform/tests/svg/import/paths-data-17-f-manual.svg new file mode 100644 index 000000000..d6801a864 --- /dev/null +++ b/testing/web-platform/tests/svg/import/paths-data-17-f-manual.svg @@ -0,0 +1,65 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="Microsoft" status="accepted" + version="$Revision: 1.4 $" testname="$RCSfile: paths-data-17-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/paths.html#PathDataClosePathCommand"> + <p> + Test that the 'z' and 'Z' command have the same effect. + </p> + <p> + Specify four 'path' elements that each use three 'L' commands to draw three sides of a square. The fourth line of each + square is drawn via a 'closepath' command. A red square closed via 'z' is covered with a black square closed via 'Z' and + vice versa. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if two black-stroked, unfilled squares are visible and + there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: paths-data-17-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <path d="M 50 50 L 50 150 L 150 150 L 150 50 z" stroke-width="5" stroke="red" fill="none" /> + <path d="M 50 50 L 50 150 L 150 150 L 150 50 Z" stroke-width="6" stroke="black" fill="none" /> + <path d="M 250 50 L 250 150 L 350 150 L 350 50 Z" stroke-width="5" stroke="red" fill="none" /> + <path d="M 250 50 L 250 150 L 350 150 L 350 50 z" stroke-width="6" stroke="black" fill="none" /> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/paths-data-18-f-manual.svg b/testing/web-platform/tests/svg/import/paths-data-18-f-manual.svg new file mode 100644 index 000000000..e50a85079 --- /dev/null +++ b/testing/web-platform/tests/svg/import/paths-data-18-f-manual.svg @@ -0,0 +1,100 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: paths-data-18-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/paths.html#PathDataGeneralInformation"> + <p> + The 'path' element's 'd' attribute ignores additional whitespace, newline characters, and commas, and BNF processing consumes as much content as possible, stopping as soon as a character that doesn't satisfy the production is encountered. + </p> + <p> + Various black path segments are rendered that each demonstrate one of the parsing rules. Each path segment is placed on top + of a similar path segment that lacks the particular parsing rule that is being tested. Test passes if no red is visible. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test passes if seven thick black horizontal lines are shown with corresponding + gold horizontal lines just above them, and the black and gold lines are all of the + same length and horizontal position. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: paths-data-18-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <g fill="gold"> + <rect x="220" y="40" width="160" height="8"/> + <rect x="220" y="80" width="160" height="8"/> + <rect x="220" y="120" width="160" height="8"/> + <rect x="220" y="160" width="160" height="8"/> + <rect x="64.6" y="200" width="319.5" height="8"/> + <rect x="140" y="240" width="160" height="8"/> + <rect x="220" y="280" width="160" height="8"/> + </g> + + <g transform="translate(60,-30) scale(8,2)"> + <path d="M 20 40 H 40" stroke-width="2" stroke="red" /> + <path d="M 20 40 + H 40" stroke-width="4" stroke="black" /> + + <path d="M 20 60 H 40" stroke-width="2" stroke="red" /> + <path d=" + M + 20 + 60 + H + 40 + " stroke-width="4" stroke="black" /> + + <path d="M 20 80 H40" stroke-width="2" stroke="red" /> + <path d="M 20,80 H 40" stroke-width="4" stroke="black" /> + + <path d="M 20 100 H 40#90" stroke-width="2" stroke="red" /> + <path d="M 20 100 H 40" stroke-width="4" stroke="black" /> + + <path d="M 20 120 H 40.5 0.6" stroke-width="2" stroke="red" /> + <path d="M 20 120 H 40.5.6" stroke-width="4" stroke="black" /> + + <path d="M 20 140 h 10 -20" stroke-width="2" stroke="red" /> + <path d="M 20 140 h 10-20" stroke-width="4" stroke="black" /> + + <path d="M 20 160 H 40" stroke-width="2" stroke="red" /> + <path d="M 20 160 H 40#90" stroke-width="4" stroke="black" /> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> --> +</svg> diff --git a/testing/web-platform/tests/svg/import/paths-data-19-f-manual.svg b/testing/web-platform/tests/svg/import/paths-data-19-f-manual.svg new file mode 100644 index 000000000..5d6d49a9e --- /dev/null +++ b/testing/web-platform/tests/svg/import/paths-data-19-f-manual.svg @@ -0,0 +1,107 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="Microsoft" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: paths-data-19-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/paths.html#PathDataGeneralInformation"> + <p> + Test that additional parameters to pathdata commands are treated as additional calls to the most recent command. + </p> + <p> + Each of the applicable 'pathdata' commands are used in separate 'path' elements. Each command is repeated in red and + overlayed with another 'path' element with identical coordinates specified but without the repeated command in black. + Commands that do not render or do not take parameters are omitted. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: paths-data-19-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <path d="M20 20 H40 H60" stroke-width="3" stroke="red" fill="none" /> + <path d="M20 20 H40 60" stroke-width="3" stroke="black" fill="none" /> + + <path d="M20 40 h20 h20" stroke-width="3" stroke="red" fill="none" /> + <path d="M20 40 h20 20" stroke-width="3" stroke="black" fill="none" /> + + <path d="M120 20 V40 V60" stroke-width="3" stroke="red" fill="none" /> + <path d="M120 20 V40 60" stroke-width="3" stroke="black" fill="none" /> + + <path d="M140 20 v20 v20" stroke-width="3" stroke="red" fill="none" /> + <path d="M140 20 v20 20" stroke-width="3" stroke="black" fill="none" /> + + <path d="M220 20 L 240 20 L260 20" stroke-width="3" stroke="red" fill="none" /> + <path d="M220 20 L 240 20 260 20 " stroke-width="3" stroke="black" fill="none" /> + + <path d="M220 40 l 20 0 l 20 0" stroke-width="3" stroke="red" fill="none" /> + <path d="M220 40 l 20 0 20 0" stroke-width="3" stroke="black" fill="none" /> + + <path d="M50 150 C50 50 200 50 200 150 C200 50 350 50 350 150" stroke-width="3" stroke="red" fill="none" /> + <path d="M50 150 C50 50 200 50 200 150 200 50 350 50 350 150" stroke-width="3" stroke="black" fill="none" /> + + <path d="M50, 200 c0,-100 150,-100 150,0 c0,-100 150,-100 150,0" stroke-width="3" stroke="red" fill="none" /> + <path d="M50, 200 c0,-100 150,-100 150,0 0,-100 150,-100 150,0" stroke-width="3" stroke="black" fill="none" /> + + <path d="M50 250 S125 200 200 250 S275, 200 350 250" stroke-width="3" stroke="red" fill="none" /> + <path d="M50 250 S125 200 200 250 275, 200 350 250" stroke-width="3" stroke="black" fill="none" /> + + <path d="M50 275 s75 -50 150 0 s75, -50 150 0" stroke-width="3" stroke="red" fill="none" /> + <path d="M50 275 s75 -50 150 0 75, -50 150 0" stroke-width="3" stroke="black" fill="none" /> + + <path d="M50 300 Q 125 275 200 300 Q 275 325 350 300" stroke-width="3" stroke="red" fill="none" /> + <path d="M50 300 Q 125 275 200 300 275 325 350 300" stroke-width="3" stroke="black" fill="none" /> + + <path d="M50 325 q 75 -25 150 0 q 75 25 150 0" stroke-width="3" stroke="red" fill="none" /> + <path d="M50 325 q 75 -25 150 0 75 25 150 0" stroke-width="3" stroke="black" fill="none" /> + + <path d="M425 25 T 425 75 T 425 125" stroke-width="3" stroke="red" fill="none" /> + <path d="M425 25 T 425 75 425 125" stroke-width="3" stroke="black" fill="none" /> + + <path d="M450 25 t 0 50 t 0 50" stroke-width="3" stroke="red" fill="none" /> + <path d="M450 25 t 0 50 0 50" stroke-width="3" stroke="black" fill="none" /> + + <path d="M400,200 A25 25 0 0 0 425 150 A25 25 0 0 0 400 200" stroke-width="3" stroke="red" fill="none" /> + <path d="M400,200 A25 25 0 0 0 425 150 25 25 0 0 0 400 200" stroke-width="3" stroke="black" fill="none" /> + + <path d="M400,300 a25 25 0 0 0 25 -50 a25 25 0 0 0 -25 50" stroke-width="3" stroke="red" fill="none" /> + <path d="M400,300 a25 25 0 0 0 25 -50 25 25 0 0 0 -25 50" stroke-width="3" stroke="black" fill="none" /> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> --> +</svg> diff --git a/testing/web-platform/tests/svg/import/paths-data-20-f-manual.svg b/testing/web-platform/tests/svg/import/paths-data-20-f-manual.svg new file mode 100644 index 000000000..b0827e5ca --- /dev/null +++ b/testing/web-platform/tests/svg/import/paths-data-20-f-manual.svg @@ -0,0 +1,87 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="ED" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: paths-data-20-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/paths.html#PathDataEllipticalArcCommands"> + <p> + Tests parsing of the elliptical arc path syntax. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if the image looks as if there are eight green circles that have + two white rectangles overlapping them, like in the reference image. If any red is visible + the test has failed. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: paths-data-20-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <!-- no commawsp between arc flags --> + <path d="M120,120 h25 a25,25 0 1,0 -25,25 z" fill="red" stroke="lime"/> + <path d="M120,120 h25 a25,25 0 10 -25,25z" fill="lime"/> + + <!-- no commawsp between arc flags and no commawsp after arc flags --> + <path d="M200,120 h-25 a25,25 0 1,1 25,25 z" fill="red" stroke="lime"/> + <path d="M200,120 h-25 a25,25 0 1125,25 z" fill="lime"/> + + <!-- out of range large-arc-flag value --> + <path d="M280,120 h25 a25,25 0 1,0 -25,25 z" fill="lime" stroke="lime"/> + <path d="M280,120 h25 a25,25 0 6 0 -25,25 z" fill="red"/> + + <!-- negative sweep-flag value --> + <path d="M360,120 h-25 a25,25 0 1,1 25,25 z" fill="lime" stroke="lime"/> + <path d="M360,120 h-25 a25,25 0 1 -1 25,25 z" fill="red"/> + + <!-- no commawsp between sweep-flag and following coordinate-pair --> + <path d="M120,200 h25 a25,25 0 1,1 -25,-25 z" fill="red" stroke="lime"/> + <path d="M120,200 h25 a25,25 0 1 1-25,-25 z" fill="lime"/> + + <!-- no commawsp before arc flags --> + <path d="M200,200 h-25 a25,25 0 1,0 25,-25 z" fill="lime" stroke="lime"/> + <path d="M200,200 h-25 a25,2501 025,-25 z" fill="red"/> + + <!-- out of range sweep-flag value --> + <path d="M280,200 h25 a25,25 0 1,1 -25,-25 z" fill="lime" stroke="lime"/> + <path d="M280,200 h25 a25 25 0 1 7 -25 -25 z" fill="red"/> + + <!-- negative large-arc-flag value --> + <path d="M360,200 h-25 a25,25 0 1,0 25,-25 z" fill="lime" stroke="lime"/> + <path d="M360,200 h-25 a25,25 0 -1 0 25,-25 z" fill="red"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> --> +</svg> diff --git a/testing/web-platform/tests/svg/import/paths-dom-01-f-manual.svg b/testing/web-platform/tests/svg/import/paths-dom-01-f-manual.svg new file mode 100644 index 000000000..7c79f352f --- /dev/null +++ b/testing/web-platform/tests/svg/import/paths-dom-01-f-manual.svg @@ -0,0 +1,140 @@ +<svg version="1.1" baseProfile="full" onload="init();" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="ED" status="created" + version="$Revision: 1.6 $" testname="$RCSfile: paths-dom-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/paths.html#DOMInterfaces"> + <p> + Test the getTotalLength, getPointAtLength and getPathSegAtLength DOM methods. + </p> + <p> + The left green rect should have text around it. The text should start at 50 user units distance-along-the-path, which is the same as half the rect width. + The right green rect should also have text around it, but the text should start 50 units along the path relative to the provided pathLength. Since 50 is + half of the provided pathLength the text will start at the lower right-hand corner, and if the text is too long to fit it will be cut off when reaching + the upper left corner of the rect. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test has passed if:</p> + <ul> + <li>the value for getTotalLength is "300" for both rects</li> + <li>the value for getPointAtLength is "(60,80)" for the left rect, and "(300,80)" for the right rect</li> + <li>the value for getPathSegAtLength is "0" on the first line for both rects, and on the second line "m 60 80" for the left rect and "m 300 80" for the right rect</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: paths-dom-01-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <script><![CDATA[ + function init() + { + var box = document.getElementById("box"); + var boxpl = document.getElementById("boxWithPathlength"); + + document.getElementById("tl1").firstChild.data = box.getTotalLength(); + document.getElementById("tl2").firstChild.data = boxpl.getTotalLength(); + + var pt = box.getPointAtLength(0); + document.getElementById("tp1").firstChild.data = "(" + pt.x + ", " + pt.y + ")"; + var circle = document.createElementNS("http://www.w3.org/2000/svg", "circle"); + circle.setAttribute("cx", pt.x); + circle.setAttribute("cy", pt.y); + circle.setAttribute("r", 3); + circle.setAttribute("fill", "blue"); + document.getElementById("test-body-content").appendChild(circle); + + pt = boxpl.getPointAtLength(0); + document.getElementById("tp2").firstChild.data = "(" + pt.x + ", " + pt.y + ")"; + circle = document.createElementNS("http://www.w3.org/2000/svg", "circle"); + circle.setAttribute("cx", pt.x); + circle.setAttribute("cy", pt.y); + circle.setAttribute("r", 3); + circle.setAttribute("fill", "cyan"); + document.getElementById("test-body-content").appendChild(circle); + + var segnum = box.getPathSegAtLength(0); + var seg = box.pathSegList.getItem(segnum); + document.getElementById("ts1").firstChild.data = segnum; + document.getElementById("tss1").firstChild.data = seg.pathSegTypeAsLetter + " " + seg.x + " " + seg.y; + + segnum = boxpl.getPathSegAtLength(0); + seg = boxpl.pathSegList.getItem(segnum); + document.getElementById("ts2").firstChild.data = segnum; + document.getElementById("tss2").firstChild.data = seg.pathSegTypeAsLetter + " " + seg.x + " " + seg.y; + } + ]]></script> + <defs> + <path id="box" d="m 60 80 h 100 v 50 h -100 v -50" fill="green"/> + <path id="boxWithPathlength" d="m 300 80 h 100 v 50 h -100 v -50" fill="green" pathLength="100"/> + </defs> + <g font-size="14"> + <text x="30" y="30">Using startOffset="50":</text> + + <use xlink:href="#box"/> + <text> + <textPath xlink:href="#box" startOffset="50"> + The text goes around the rect. + </textPath> + </text> + + <text x="270" y="30">Using startOffset="50" and</text> + <text x="270" y="50">pathLength="100":</text> + <use xlink:href="#boxWithPathlength"/> + <text> + <textPath xlink:href="#boxWithPathlength" startOffset="50"> + The text goes around the rect. + </textPath> + </text> + + <g id="dom-results" transform="translate(0,-10)"> + <text x="10" y="180">getTotalLength:</text> + <text x="60" y="200" id="tl1">-1</text> + <text x="300" y="200" id="tl2">-1</text> + + <text x="10" y="220">getPointAtLength(0):</text> + <text x="60" y="240" id="tp1">-1</text> + <text x="300" y="240" id="tp2">-1</text> + + <text x="10" y="260">getPathSegAtLength(0):</text> + <text x="60" y="280" id="ts1"> + -1<tspan x="60" dy="20" id="tss1">n/a</tspan> + </text> + <text x="300" y="280" id="ts2"> + -1<tspan x="300" dy="20" id="tss2">n/a</tspan> + </text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/paths-dom-02-f-manual.svg b/testing/web-platform/tests/svg/import/paths-dom-02-f-manual.svg new file mode 100644 index 000000000..5274ffcfe --- /dev/null +++ b/testing/web-platform/tests/svg/import/paths-dom-02-f-manual.svg @@ -0,0 +1,274 @@ +<svg version="1.1" baseProfile="full" onload="CreatePath();setTimeout('AnimatePath();', 500);" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="ED" status="created" + version="$Revision: 1.5 $" testname="$RCSfile: paths-dom-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/paths.html#DOMInterfaces"> + <p> + This test is designed to test the PathSegList interface. At first a flower-like shape with 6 petals should be displayed. + The roundness and number of petals are then animated using script. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + The roundness of the petals is animated from star-like sharp petals to softly rounded petals and back again, and is repeated like that until the animation stops. + The number of petals should increase one by one until the flower has a total of 12 petals, and then go back one by one until it has 6 petals, then increase again one by one until the flower has 9 petals. + Then the animation will stop. The rendered image should look exactly like the reference image. + </p> + <p> + If the flower is clicked after the animation has finished, it will restart the animation and repeat it for some time. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + [[Describe the pass criteria of the test here. The pass criteria is what + should be displayed when the test is run.]] + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: paths-dom-02-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <script><![CDATA[ + var offset_angle = 90; + var current_shift = 0; + var shift_inc = 1; + var THRESHOLD = 60; + var segments_added = 0; + var seg_diff = 1; + var adjust_count = 0; + var anim_count = 0; + var adjust_count_max = 8; + var anim_count_max = 10; + var stopped = false; + + function DegToRad(degs) + { + return (degs * Math.PI) / 180; + } + + function CreatePath() + { + var pathelm = document.getElementById("mypath"); + var pathlist = pathelm.pathSegList; + + var move = pathelm.createSVGPathSegMovetoAbs(240 + 30 * Math.cos(DegToRad(offset_angle - 30)), + 180 + 30 * Math.sin(DegToRad(offset_angle - 30))); + pathlist.appendItem(move); + + var angle = offset_angle; + for (var i = 0; i < 6; i++) + { + var x, y, xcp, ycp; + + x = 240 + 30 * Math.cos(DegToRad(angle + 30)); + y = 180 + 30 * Math.sin(DegToRad(angle + 30)); + + xcp = 240 + 120 * Math.cos(DegToRad(angle)); + ycp = 180 + 120 * Math.sin(DegToRad(angle)); + + var curve = pathelm.createSVGPathSegCurvetoCubicAbs(x, y, + xcp, ycp, + xcp, ycp); + + pathlist.appendItem(curve); + + angle += 60; + } + + pathlist.appendItem(pathelm.createSVGPathSegClosePath()); + setTimeout('AdjustPath()', 500); + } + + function AddSegment() + { + var pathelm = document.getElementById("mypath"); + var pathlist = pathelm.pathSegList; + + var segments = pathlist.numberOfItems - 2; // Not MoveTo and Close + var angle = offset_angle; + var inc_angle = 360/(segments+1); + var shift_v_x, shift_v_y, xcp, ycp; + + var move = pathlist.getItem(0); + move.x = 240 + 30 * Math.cos(DegToRad(offset_angle - inc_angle/2)); + move.y = 180 + 30 * Math.sin(DegToRad(offset_angle - inc_angle/2)); + + for (var i = 0; i < segments; i++) + { + var curve = pathlist.getItem(1+i); + + shift_v_x = current_shift * Math.cos(DegToRad(angle + 90)); + shift_v_y = current_shift * Math.sin(DegToRad(angle + 90)); + + xcp = 240 + 120 * Math.cos(DegToRad(angle)); + ycp = 180 + 120 * Math.sin(DegToRad(angle)); + + curve.x = 240 + 30 * Math.cos(DegToRad(angle + inc_angle/2)); + curve.y = 180 + 30 * Math.sin(DegToRad(angle + inc_angle/2)); + + curve.x1 = xcp - shift_v_x; + curve.y1 = ycp - shift_v_y; + + curve.x2 = xcp + shift_v_x; + curve.y2 = ycp + shift_v_y; + + angle += inc_angle; + } + + shift_v_x = current_shift * Math.cos(DegToRad(angle + 90)); + shift_v_y = current_shift * Math.sin(DegToRad(angle + 90)); + + xcp = 240 + 120 * Math.cos(DegToRad(angle)); + ycp = 180 + 120 * Math.sin(DegToRad(angle)); + + var x = 240 + 30 * Math.cos(DegToRad(angle + inc_angle/2)); + var y = 180 + 30 * Math.sin(DegToRad(angle + inc_angle/2)); + + var curve = pathelm.createSVGPathSegCurvetoCubicAbs(x, y, + xcp - shift_v_x, + ycp - shift_v_y, + xcp + shift_v_x, + ycp + shift_v_y); + + pathlist.insertItemBefore(curve, pathlist.numberOfItems-1); + } + + function RemoveSegment() + { + var pathelm = document.getElementById("mypath"); + var pathlist = pathelm.pathSegList; + + var segments = pathlist.numberOfItems - 2; // Not MoveTo and Close + var angle = offset_angle; + var inc_angle = 360/(segments-1); + var shift_v_x, shift_v_y, xcp, ycp; + + var move = pathlist.getItem(0); + move.x = 240 + 30 * Math.cos(DegToRad(offset_angle - inc_angle/2)); + move.y = 180 + 30 * Math.sin(DegToRad(offset_angle - inc_angle/2)); + + for (var i = 0; i < segments-1; i++) + { + var curve = pathlist.getItem(1+i); + + shift_v_x = current_shift * Math.cos(DegToRad(angle + 90)); + shift_v_y = current_shift * Math.sin(DegToRad(angle + 90)); + + xcp = 240 + 120 * Math.cos(DegToRad(angle)); + ycp = 180 + 120 * Math.sin(DegToRad(angle)); + + curve.x = 240 + 30 * Math.cos(DegToRad(angle + inc_angle/2)); + curve.y = 180 + 30 * Math.sin(DegToRad(angle + inc_angle/2)); + + curve.x1 = xcp - shift_v_x; + curve.y1 = ycp - shift_v_y; + + curve.x2 = xcp + shift_v_x; + curve.y2 = ycp + shift_v_y; + + angle += inc_angle; + } + + pathlist.removeItem(pathlist.numberOfItems-2); + } + + function AdjustPath() + { + if (seg_diff > 0) + { + AddSegment(); + } + else + { + RemoveSegment(); + } + + segments_added += seg_diff; + + if (segments_added > 5) + seg_diff = -1; + else if (segments_added <= 0) + seg_diff = 1; + + if(adjust_count < adjust_count_max) + { + adjust_count++; + setTimeout('AdjustPath()', 500); + } + } + + function AnimatePath() + { + var pathelm = document.getElementById("mypath"); + var pathlist = pathelm.pathSegList; + + var segments = pathlist.numberOfItems - 2; // Not MoveTo and Close + var angle = offset_angle; + var inc_angle = 360/segments; + for (var i = 0; i < segments; i++) + { + var curve = pathlist.getItem(1+i); + + var shift_v_x, shift_v_y, xcp, ycp; + + shift_v_x = current_shift * Math.cos(DegToRad(angle + 90)); + shift_v_y = current_shift * Math.sin(DegToRad(angle + 90)); + + xcp = 240 + 120 * Math.cos(DegToRad(angle)); + ycp = 180 + 120 * Math.sin(DegToRad(angle)); + + curve.x1 = xcp - shift_v_x; + curve.y1 = ycp - shift_v_y; + + curve.x2 = xcp + shift_v_x; + curve.y2 = ycp + shift_v_y; + + angle += inc_angle; + } + + current_shift += shift_inc; + if (current_shift >= THRESHOLD || current_shift < 0) + shift_inc = -shift_inc; + + if(adjust_count >= adjust_count_max) + { + anim_count++; + } + + if(anim_count < anim_count_max) + setTimeout('AnimatePath();', 50); + else + document.getElementById("mypath").addEventListener("click", function func() { adjust_count_max=32768;anim_count_max=32768; AdjustPath(); AnimatePath(); }, false); + } + + ]]></script> + <path d="" id="mypath" stroke="black" fill="blue"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-grad-01-b-manual.svg b/testing/web-platform/tests/svg/import/pservers-grad-01-b-manual.svg new file mode 100644 index 000000000..77b756537 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-grad-01-b-manual.svg @@ -0,0 +1,69 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Haroon Sheikh" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: pservers-grad-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Gradients"> + <p> + Test that the viewer can handle the xlink:href attribute on + linear gradients. The top rectangle has a simple + blue (left) to lime (right) linear gradient. The lower one + has a different gradient definition, but + should look the same as the one above, because the gradient makes a + reference to the first gradient, without modifying any attribute. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> +Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there are two rectangles, both with a blue to lime gradient. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-grad-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ====================================================================== --> + <!-- Linear Gradient using a xlink:href to another linear gradient --> + <!-- ====================================================================== --> + <linearGradient id="Grad1a" gradientUnits="objectBoundingBox" x1="0" y1="0" x2="1" y2="0"> + <stop stop-color="blue" offset="0"/> + <stop stop-color="lime" offset="1"/> + </linearGradient> + <linearGradient id="Grad1b" xlink:href="#Grad1a"/> + <rect x="20" y="20" width="440" height="80" fill="url(#Grad1a)"/> + <text font-size="30" x="20" y="130">Linear gradient.</text> + <rect x="20" y="150" width="440" height="80" fill="url(#Grad1b)"/> + <text font-size="30" x="20" y="260">Referencing gradient below.</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-grad-02-b-manual.svg b/testing/web-platform/tests/svg/import/pservers-grad-02-b-manual.svg new file mode 100644 index 000000000..bbdfb9b03 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-grad-02-b-manual.svg @@ -0,0 +1,79 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Haroon Sheikh" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: pservers-grad-02-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Gradients"> + <p> + Test that the viewer can handle the xlink:href attribute on + radial gradients. + </p> + <p> + There are two rectangles. The top one has + a radial gradient (black to orange) that should appear elliptical + to fit the aspect ratio of the rectangle. The units are + specified in objectBoundingBox space. The gradient + on the lower one + references the gradient of the top rectangle, but modifies + the units to use userSpace instead. So it is only using the + stops from the gradient to the left, with a different geometry. The radial gradient appears circular. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if the rendering matches the reference image, except + for any differences in text due to CSS2 rules. Specifically:</p> + <ul> + <li>The top rectangle is filled with an elliptical radial gradient, + with black in the center and orange at the outside edges of the rectangle.</li> + <li>The bottom rectangle is filled with a circular radial gradient, + with black in the center and orange at the top and bottom edges of the rectangle. + Outside the circular area, the rectangle is filled with plain orange.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-grad-02-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ====================================================================== --> + <!-- Radial Gradient using a xlink:href to another radial gradient --> + <!-- ====================================================================== --> + <radialGradient id="Grad2a" gradientUnits="objectBoundingBox" cx=".5" cy=".5" fx=".5" fy=".5" r=".5"> + <stop stop-color="black" offset="0"/> + <stop stop-color="rgb(255,165,0)" offset="1"/> + </radialGradient> + <radialGradient id="Grad2b" xlink:href="#Grad2a" gradientUnits="userSpaceOnUse" cx="240" cy="190" fx="240" fy="190" r="40"/> + <rect x="20" y="20" width="440" height="80" fill="url(#Grad2a)"/> + <text font-size="30" x="20" y="130">Radial gradient.</text> + <rect x="20" y="150" width="440" height="80" fill="url(#Grad2b)"/> + <text font-size="30" x="20" y="260">Referencing gradient below.</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-grad-03-b-manual.svg b/testing/web-platform/tests/svg/import/pservers-grad-03-b-manual.svg new file mode 100644 index 000000000..f3dfc259c --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-grad-03-b-manual.svg @@ -0,0 +1,77 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Haroon Sheikh" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: pservers-grad-03-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Gradients"> + <p> + Test that the viewer can handle the xlink:href attribute on + patterns. + </p> + <p> + There are two rectangles with a pattern fill made + up of 4 rectangles. The pattern definition of the lower one references the pattern definition + of the upper one, using the xlink:href attribute. Because + the particular way that the patterns and rectangles are + defined in this test case, the two fills will appear the + same - the rectangles are positioned on pattern-size + boundaries, so that the offsets into the pattern at the left + edges of the respective rectangles is identical. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if the rendering matches the reference image, except + for any differences in text due to CSS2 rules. Note that the top rectangle must + look identical to the bottom rectangle.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-grad-03-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ====================================================================== --> + <!-- Pattern filled rectangles using a xlink:href to another pattern fill --> + <!-- ====================================================================== --> + <pattern id="Pat3a" x="0" y="0" width="20" height="20" patternUnits="userSpaceOnUse"> + <rect x="0" y="0" width="10" height="10" fill="#93D"/> + <rect x="10" y="0" width="10" height="10" fill="green"/> + <rect x="0" y="10" width="10" height="10" fill="blue"/> + <rect x="10" y="10" width="10" height="10" fill="yellow"/> + </pattern> + <pattern id="Pat3b" xlink:href="#Pat3a" width="20" height="20"/> + <rect x="20" y="20" width="440" height="80" fill="url(#Pat3a)"/> + <text font-size="30" x="20" y="130">Pattern fill.</text> + <rect x="20" y="160" width="440" height="80" fill="url(#Pat3b)"/> + <text font-size="30" x="20" y="270">Referencing pattern fill below.</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-grad-04-b-manual.svg b/testing/web-platform/tests/svg/import/pservers-grad-04-b-manual.svg new file mode 100644 index 000000000..876a07a64 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-grad-04-b-manual.svg @@ -0,0 +1,88 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Haroon Sheikh" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: pservers-grad-04-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Gradients"> + <p> + Test that checks the capability of the stop element in linear and radial + gradients. + </p> + <p> + The first rectangle has a linear gradient fill with a vector starting at top left + and going to bottom right. The stop colors are at 20% spacing apart and are in the + following order : violet, blue, lime, yellow, orange, green. + Because the gradient vector vector goes from (0,0) to (1,1) in object bounding box space + and because the object bounding box has a larger width than height, the gradient vector + is skewed off of a pure 45 degree angle. The gradient stripes are also skewed + so that they are no longer perpendicular to the gradient vector. + </p> + <p> + The next rectangle has a radial gradient fill with a multi-color stops from innermost + to outermost in the following order: black, yellow, orange, blue, white, green. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if the rendering matches the reference image, except for + any differences in text due to CSS2 rules.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-grad-04-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <linearGradient id="Grad1" gradientUnits="objectBoundingBox" x1="0" y1="0" x2="1" y2="1"> + <stop stop-color="rgb(238,130,238)" offset="0"/> + <stop stop-color="blue" offset="0.2"/> + <stop stop-color="lime" offset="0.4"/> + <stop stop-color="yellow" offset="0.6"/> + <stop stop-color="rgb(255,165,0)" offset="0.8"/> + <stop stop-color="green" offset="1"/> + </linearGradient> + <rect x="20" y="20" width="440" height="80" fill="url(#Grad1)"/> + <text font-size="30" x="20" y="130">Multi-color linear gradient.</text> + <!-- ====================================================================== --> + <!-- Radial gradient on the stroke of a rectangle ======== --> + <!-- ====================================================================== --> + <radialGradient id="Grad2" gradientUnits="userSpaceOnUse" cx="240" cy="210" r="220" fx="240" fy="210"> + <stop stop-color="black" offset="0"/> + <stop stop-color="yellow" offset="0.2"/> + <stop stop-color="orange" offset="0.4"/> + <stop stop-color="blue" offset="0.6"/> + <stop stop-color="white" offset="0.8"/> + <stop stop-color="green" offset="1"/> + </radialGradient> + <rect x="20" y="150" width="440" height="80" fill="url(#Grad2)" stroke-width="40"/> + <text font-size="30" x="20" y="260">Multi-color radial gradient.</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-grad-05-b-manual.svg b/testing/web-platform/tests/svg/import/pservers-grad-05-b-manual.svg new file mode 100644 index 000000000..d08e1f7e5 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-grad-05-b-manual.svg @@ -0,0 +1,94 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Haroon Sheikh" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: pservers-grad-05-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Gradients"> + <p> + Test that checks the capability of the stop opacity in linear and radial + gradients. + </p> + <p> + There are two tests which contain rectangles with gradients using stop-opacity properties. + A cyan color text string "Background" is put behind both of the rectangles to help + demonstrate the opacity concept. + </p> + <p> + From top-down the appearance of objects is as follows. + </p> + <p> + The first rectangle has a linear gradient fill with a vector starting at top left + and going to bottom right. The stop colors are at 20% spacing apart and are in the + following order : violet, blue, lime, yellow, orange, black. + Also a stop opacity is given to the colors in the following order: 1, 0.2, 0.5, 0, 0.8, 1 + Because the gradient vector vector goes from (0,0) to (1,1) in object bounding box space + and because the object bounding box has a larger width than height, the gradient vector + is skewed off of a pure 45 degree angle. The gradient stripes are also skewed + so that they are no longer perpendicular to the gradient vector. + </p> + <p> + The next rectangle has a radial gradient fill with a multi-color stops from innermost + to outermost in the following order: black, yellow, red, blue, white, green. + Also a stop opacity is given to the colors in the following order: 1, 0.2, 0.5, 0, 0.8, 1 + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if the rendering matches the reference image, except for + any differences in text due to CSS2 rules.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-grad-05-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-size="60" fill="aqua" x="70" y="80">Background</text> + <linearGradient id="Grad1" gradientUnits="objectBoundingBox" x1="0" y1="0" x2="1" y2="1"> + <stop stop-color="rgb(238,130,238)" stop-opacity="1" offset="0"/> + <stop stop-color="blue" stop-opacity="0" offset="0.2"/> + <stop stop-color="lime" stop-opacity="0.5" offset="0.4"/> + <stop stop-color="yellow" stop-opacity="0.2" offset="0.6"/> + <stop stop-color="rgb(255,165,0)" stop-opacity="0.8" offset="0.8"/> + <stop stop-color="black" stop-opacity="1" offset="1"/> + </linearGradient> + <rect x="20" y="20" width="440" height="80" fill="url(#Grad1)"/> + + <text font-size="60" fill="aqua" x="70" y="210">Background</text> + <radialGradient id="Grad2" gradientUnits="userSpaceOnUse" cx="240" cy="210" r="220" fx="240" fy="210"> + <stop stop-color="black" stop-opacity="1" offset="0"/> + <stop stop-color="yellow" stop-opacity="0" offset="0.2"/> + <stop stop-color="red" stop-opacity="0.5" offset="0.4"/> + <stop stop-color="blue" stop-opacity="0.2" offset="0.6"/> + <stop stop-color="white" stop-opacity="0.8" offset="0.8"/> + <stop stop-color="green" stop-opacity="1" offset="1"/> + </radialGradient> + <rect x="20" y="150" width="440" height="80" fill="url(#Grad2)" stroke-width="40"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-grad-06-b-manual.svg b/testing/web-platform/tests/svg/import/pservers-grad-06-b-manual.svg new file mode 100644 index 000000000..374b1e3e2 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-grad-06-b-manual.svg @@ -0,0 +1,109 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Haroon Sheikh" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: pservers-grad-06-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Gradients"> + <p> + Test that the viewer can handle the gradientTransform and the patternTransform + attribute on gradients and patterns respectively. + </p> + <p> + From top-down the appearance of objects is as follows. + </p> + <p> + The top rectangle has a linear gradient whose coordinate system has been scaled down by + a half. So the gradient travelling from left to right (from blue to green to lime) should + only occuply the left half the rectangle. + </p> + <p> + The next rectangle has radial gradient that has been translated to the center and skewed + in the positive X direction by 45 degrees. Therefore the gradient should appear + ellipltical and rotated around the center. + </p> + <p> + The last row contains a rectangle with pattern on the fill. The transformation on the + pattern moves the coordinate system to the top left of the rectangle and then scales it + by a factor of 2 and then skew's it in the X direction by 45 degrees. The pattern + consists of a 2 by 2 array of colored rectangles. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if the rendering matches the reference image, apart + from any differences in font choice due to CSS2 rules. Specifically:</p> + <ul> + <li>The top rectangle is filled with a linear gradient from blue on the left, + to lime in the middle. The right half of the rectangle is filled with plain lime.</li> + <li>The middle rectangle is filled with an elliptical radial gradient with + black on the inside and orange on the outside. The center point of the gradient + is near the center-bottom of the rectangle. The gradient is skewed, so that it appears + as a rotated elliptical gradient.</li> + <li>The bottom rectangle is filled with a repeating pattern of tiled + red, green, yellow and blue parallelograms.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-grad-06-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ====================================================================== --> + <!-- Linear Gradient with gradientTransforms --> + <!-- ====================================================================== --> + <linearGradient id="Grad1" gradientUnits="userSpaceOnUse" x1="0" y1="0" x2="430" y2="0" gradientTransform="translate(25 35) scale(0.5)"> + <stop stop-color="blue" offset="0"/> + <stop stop-color="green" offset="0.5"/> + <stop stop-color="lime" offset="1"/> + </linearGradient> + <rect x="20" y="20" width="440" height="50" fill="url(#Grad1)"/> + <text font-size="30" x="20" y="100">scale(0.5) on gradient</text> + <!-- ====================================================================== --> + <!-- Radial Gradiant with a gradientTransform --> + <!-- ====================================================================== --> + <radialGradient id="Grad2" gradientUnits="userSpaceOnUse" cx="0" cy="0" fx="0" fy="0" r="60" gradientTransform="translate(240,155) skewX(45)"> + <stop stop-color="black" offset="0"/> + <stop stop-color="rgb(255,165,0)" offset="1"/> + </radialGradient> + <rect x="20" y="110" width="440" height="50" fill="url(#Grad2)"/> + <text font-size="30" x="20" y="190">skewX(45) on gradient</text> + <!-- ====================================================================== --> + <!-- Pattern filled rectangles with a patternTransform. --> + <!-- ====================================================================== --> + <pattern patternUnits="userSpaceOnUse" id="Pat3" x="0" y="0" width="20" height="20" patternTransform="translate(25 215) scale(2) skewX(45)"> + <rect x="0" y="0" width="10" height="10" fill="maroon"/> + <rect x="10" y="0" width="10" height="10" fill="green"/> + <rect x="0" y="10" width="10" height="10" fill="blue"/> + <rect x="10" y="10" width="10" height="10" fill="yellow"/> + </pattern> + <rect x="20" y="210" width="440" height="50" fill="url(#Pat3)"/> + <text font-size="30" x="20" y="290">scale(2), skewX(45) on pattern</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-grad-07-b-manual.svg b/testing/web-platform/tests/svg/import/pservers-grad-07-b-manual.svg new file mode 100644 index 000000000..9e9b32dc0 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-grad-07-b-manual.svg @@ -0,0 +1,88 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Haroon Sheikh" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: pservers-grad-07-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Gradients"> + <p> + Test that the viewer has basic capability to handle linear gradients + on fills and stroke of objects and text. + </p> + <p> + This test uses the following elements : <linearGradient>, <stop> + and the following properties : stop-color, fill:url(# ), stroke(url# ) + </p> + <p> + Both elements in this test use the same simple gradient. It is a linear gradient from + blue (left) to lime (right). From top-down the appearance of objects is as follows. + </p> + <p> + The top rectangle should be filled with the gradient. + </p> + <p> + The next rectangle has no fill, but has a thick stroke on which the gradient is + applied. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if the rendering matches the reference image, apart + from any differences in font choice due to CSS2 rules. Specifically:</p> + <ul> + <li>The top rectangle is filled with a gradient from blue on the left to lime on the right.</li> + <li>The bottom rectangle is unfilled and stroked with a thick stroke using a gradient from blue on the left to lime on the right.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-grad-07-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="scale(1, 1.5)"> + <!-- ====================================================================== --> + <!-- Very simple blue to red linear gradient from left to right ========== --> + <!-- ====================================================================== --> + <linearGradient id="Gradient" gradientUnits="userSpaceOnUse" x1="10" y1="10" x2="440" y2="10"> + <stop stop-color="blue" offset="0"/> + <stop stop-color="lime" offset="1"/> + </linearGradient> + <!-- ====================================================================== --> + <!-- Linear gradient on the fill of a rectangle ======== --> + <!-- ====================================================================== --> + <rect x="10" y="10" width="430" height="60" fill="url(#Gradient)"/> + <text font-size="24" x="10" y="90">Linear gradient filled rectangle</text> + <!-- ====================================================================== --> + <!-- Linear gradient on the stroke of a rectangle ======== --> + <!-- ====================================================================== --> + <rect x="25" y="110" width="400" height="30" fill="none" stroke="url(#Gradient)" stroke-width="20"/> + <text font-size="24" x="10" y="170">Linear gradient on stroke of rectangle</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-grad-08-b-manual.svg b/testing/web-platform/tests/svg/import/pservers-grad-08-b-manual.svg new file mode 100644 index 000000000..654ec8d40 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-grad-08-b-manual.svg @@ -0,0 +1,100 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Haroon Sheikh" status="accepted" + version="$Revision: 1.13 $" testname="$RCSfile: pservers-grad-08-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Gradients"> + <p> + Test that the viewer has basic capability to handle linear gradients + on fills and stroke of text. + </p> + <p> + Both elements in this test use the same simple gradient. It is a linear gradient from blue (left) to lime (right). From top-down the appearance of objects is as follows. + </p> + <p> + The first item is a text string "Gradient on fill" with the gradient on the fill of the text. + </p> + <p> + The second item is a text string that is not filled. It has a 2 user unit stroke on which the gradient is applied. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if the rendering matches the reference image, apart + from any differences in font choice due to CSS2 rules. Specifically:</p> + <ul> + <li>The text string "Gradient on fill" must be filled with a gradient + from blue on the left to lime on the right.</li> + <li>The text string "Gradient on stroke" must be unfilled and stroked with + a gradient from blue on the left to lime on the right.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-grad-08-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <style type="text/css"> + @font-face { + font-family: Blocky; + src: url(woffs/Blocky.woff) format("woff"); + </style> + <defs> + <font-face font-family="Blocky" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/Blocky.svg#Blocky"/> + </font-face-src> + </font-face> + </defs> + <g transform="scale(1, 1.5)"> + <!-- ====================================================================== --> + <!-- Very simple blue to red linear gradient from left to right ========== --> + <!-- ====================================================================== --> + <linearGradient id="Gradient" gradientUnits="userSpaceOnUse" x1="10" y1="10" x2="440" y2="10"> + <stop stop-color="blue" offset="0"/> + <stop stop-color="lime" offset="1"/> + </linearGradient> + <!-- ====================================================================== --> + <!-- Gradient on fill of text ======== --> + <!-- ====================================================================== --> + <text font-family="Blocky" font-size="68" fill="url(#Gradient)" x="20" y="70">Gradient on fill</text> + <!-- ====================================================================== --> + <!-- Gradient on stroke of text ======== --> + <!-- ====================================================================== --> + <text font-family="Blocky" x="20" y="160" font-size="55" fill="none" stroke="url(#Gradient)" stroke-width="3">Gradient on stroke</text> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="28"> + <text x="40" y="145">Linear gradient on filled text</text> + <text x="30" y="280">Linear gradient on stroke of text</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.13 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-grad-09-b-manual.svg b/testing/web-platform/tests/svg/import/pservers-grad-09-b-manual.svg new file mode 100644 index 000000000..670e914bf --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-grad-09-b-manual.svg @@ -0,0 +1,107 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Haroon Sheikh" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: pservers-grad-09-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Gradients"> + <p> + Test that the viewer can handle the gradientUnits attribute on linear gradients. + It tests the following values of gradientUnits: default (userSpace), objectBoundingBox, + and userSpaceOnUse. + </p> + <p> + From top-down the appearance of objects is as follows. + </p> + <p> + The first rectangle uses the default attributes on the linearGradient element. + Therefore the linear gradient should default to objectBoundingBox. It should appear + from the left edge of the rectangle (blue) to the right edge of the rectangle (lime). + The rectangle is smaller than the viewport, because a previous version of the SVG spec had the default value be 'viewport'. + The test fails if only a portion of the gradient is shown. + </p> + <p> + The next rectangle uses gradientUnits=objectBoundingBox. The linear gradient should + travel from blue (top) to lime (bottom). + </p> + <p> + The last rectangle uses gradientUnits=userSpaceOnUse. The rectangle element is given it's + own transformation and the gradient is assumed to be in this user space. + The gradient should appear as a linear gradient from lime (left) to blue (right). + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if the rendering matches the reference image, apart + from any differences in font choice due to CSS2 rules. Specifically:</p> + <ul> + <li>The top rectangle is filled with a linear gradient from lime on the left to blue on the right.</li> + <li>The middle rectangle is filled with a linear gradient from blue on the top to lime on the bottom.</li> + <li>The bottom rectangle is filled with a linear gradient from lime on the left to blue on the right.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-grad-09-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-size="15" x="10" y="25">Testing gradientUnits attribute</text> + <!-- ====================================================================== --> + <!-- Linear gradient with default attributes on <linear gradient> element. --> + <!-- ====================================================================== --> + <linearGradient id="Grad1"> + <stop stop-color="lime" offset="0"/> + <stop stop-color="blue" offset="1"/> + </linearGradient> + <rect x="125" y="35" width="200" height="50" fill="url(#Grad1)"/> + <!--<text font-size="12" x="10" y="100">Linear gradient with default attributes (thus, same as objectBoundingBox)</text>--> + <!--text font-size="12" x="10" y="125">Gradient is from the viewport left edge (lime) to viewport right edge (blue)</text--> + <!--<text font-size="12" x="10" y="115">Gradient is from the object left edge (lime) to object right edge (blue)</text>--> + <!-- ====================================================================== --> + <!-- Linear gradient with gradientUnits=objectBoundingBox ======== --> + <!-- ====================================================================== --> + <linearGradient id="Grad2" gradientUnits="objectBoundingBox" x1="0" y1="0" x2="0" y2="1"> + <stop stop-color="blue" offset="0"/> + <stop stop-color="lime" offset="1"/> + </linearGradient> + <rect x="10" y="125" width="430" height="50" fill="url(#Grad2)"/> + <!--<text font-size="12" x="10" y="190">gradientUnits=objectBoundingBox</text>--> + <!--<text font-size="12" x="10" y="205">Gradient is from the object top edge (blue) to object bottom edge (lime)</text>--> + <!-- ====================================================================== --> + <!-- Gradient using gradientUnits="userSpaceOnUse" --> + <!-- ====================================================================== --> + <linearGradient id="Grad3" x1="0" y1="0" x2="0" y2="430" gradientUnits="userSpaceOnUse"> + <stop stop-color="lime" offset="0"/> + <stop stop-color="blue" offset="1"/> + </linearGradient> + <rect transform="translate(10, 260) rotate(-90)" x="0" y="0" width="50" height="430" fill="url(#Grad3)"/> + <!--<text font-size="12" x="10" y="275">gradientUnits=userSpaceOnUse</text>--> + <!--<text font-size="12" x="10" y="290">Gradient is from the object left edge (lime) to object right edge (blue)</text>--> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-grad-10-b-manual.svg b/testing/web-platform/tests/svg/import/pservers-grad-10-b-manual.svg new file mode 100644 index 000000000..52d893e3e --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-grad-10-b-manual.svg @@ -0,0 +1,93 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Haroon Sheikh" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: pservers-grad-10-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Gradients"> + <p> + Test that the viewer can handle the spreadMethod attribute on linear gradients. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if the rendering matches the reference image, apart + from any differences in font choice due to CSS2 rules. Each of the + three rectangles is filled with a linear gradient from blue on the left + to lime on the right. The width of the gradient is only a fifth of + the width of the rectangle, so:</p> + <ul> + <li>The top rectangle is filled with plain blue in the left two-fifths + and with plain lime in the right two-fifths.</li> + <li>The middle rectangle is filled with alternating copies of the blue-to-lime + gradient. Thus, from left to right, the rectangle is filled with + a gradient that goes from blue to lime to blue to lime to blue to lime.</li> + <li>The bottom rectangle is filled with five copies of the blue-to-lime + gradient. Thus, from left to right, the rectangle is filled with + a gradient that goes from blue to lime, abruptly changing back to blue + then smoothly changing to lime, etc.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-grad-10-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-size="15" x="10" y="25">Testing spreadMethod attribute</text> + <!-- ====================================================================== --> + <!-- Linear Gradient with spreadMethod=pad --> + <!-- ====================================================================== --> + <linearGradient id="Grad1" gradientUnits="objectBoundingBox" x1=".4" y1="0" x2=".6" y2="0" spreadMethod="pad"> + <stop stop-color="blue" offset="0"/> + <stop stop-color="lime" offset="1"/> + </linearGradient> + <rect x="10" y="35" width="460" height="55" fill="url(#Grad1)"/> + <text font-size="12" x="10" y="105">spreadMethod=pad</text> + <!-- ====================================================================== --> + <!-- Linear Gradient with spreadMethod=reflect --> + <!-- ====================================================================== --> + <linearGradient id="Grad2" gradientUnits="objectBoundingBox" x1=".4" y1="0" x2=".6" y2="0" spreadMethod="reflect"> + <stop stop-color="blue" offset="0"/> + <stop stop-color="lime" offset="1"/> + </linearGradient> + <rect x="10" y="120" width="460" height="55" fill="url(#Grad2)"/> + <text font-size="12" x="10" y="190">spreadMethod=reflect</text> + <!-- ====================================================================== --> + <!-- Linear Gradient with spreadMethod=repeat --> + <!-- ====================================================================== --> + <linearGradient id="Grad3" gradientUnits="objectBoundingBox" x1=".4" y1="0" x2=".6" y2="0" spreadMethod="repeat"> + <stop stop-color="blue" offset="0"/> + <stop stop-color="lime" offset="1"/> + </linearGradient> + <rect x="10" y="205" width="460" height="55" fill="url(#Grad3)"/> + <text font-size="12" x="10" y="275">spreadMethod=repeat</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="lime" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-grad-11-b-manual.svg b/testing/web-platform/tests/svg/import/pservers-grad-11-b-manual.svg new file mode 100644 index 000000000..dc5e21209 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-grad-11-b-manual.svg @@ -0,0 +1,124 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Haroon Sheikh" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: pservers-grad-11-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Gradients"> + <p> + Test that the viewer has basic capability to handle radial gradients + on fills and stroke of objects and text. + </p> + <p> + This test uses the following elements : <radialGradient>, <stop> + and the following properties : stop-color, fill:url(# ), stroke(url# ) + </p> + <p> + From top-down (left to right) the appearance of objects is as follows. + </p> + <p> + The top left rectangle should be a radial gradient from dark blue (in) to lime (outside). + The gradient is applied to the fill of the rectangle. + </p> + <p> + The next rectangle has no fill, but has a thick stroke on which the gradient is + applied. The gradient goes from dark orange(in) to pale yellow (out). + </p> + <p> + The next item is a text with a radial gradient on the fill. The gradient goes + from green (in) to yellow (out). + </p> + <p> + The last item is a text with a 2 user unit stroke on which a black (in) to magenta + (out) linear gradient is applied. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if the rendering matches the reference image, apart + from any differences in font choice due to CSS2 rules. Specifically:</p> + <ul> + <li>The top-left rectangle must be filled with a circular radial gradient + with dark blue inside and lime outside. The center point of the gradient + is in the lower-left quadrant of the rectangle.</li> + <li>The top-right rectangle has no fill, but a thick stroke which is painted + with a radial gradient with dark orange inside and yellow outside. The + center point of this gradient is in the lower-left quadrant of the + rectangle.</li> + <li>The "Gradient on text fill" text must be filled with a circular radial + gradient with green inside and yellow outside. The center point of the + gradient is the center of the text.</li> + <li>The "Gradient on text stroke" has no fill, but a stroke which is painted with + a circular radial gradient with black inside and pink outside. The center point of the + gradient is the center of the text.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-grad-11-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ====================================================================== --> + <!-- Very simple black to red radial gradient ======== --> + <!-- ====================================================================== --> + <radialGradient gradientUnits="userSpaceOnUse" id="Grad1" cx="75" cy="100" r="130" fx="75" fy="100"> + <stop stop-color="#009" offset="0"/> + <stop stop-color="#2e2" offset="1"/> + </radialGradient> + <rect x="10" y="10" width="210" height="140" fill="url(#Grad1)"/> + <text font-family="Arial" font-size="12" x="10" y="165">Radial gradient on fill of rectangle</text> + <!-- ====================================================================== --> + <!-- Radial gradient on the stroke of a rectangle ======== --> + <!-- ====================================================================== --> + <radialGradient id="Grad2" gradientUnits="userSpaceOnUse" cx="295" cy="100" r="150" fx="295" fy="100"> + <stop stop-color="#e22" offset="0"/> + <stop stop-color="#ff6" offset="1"/> + </radialGradient> + <rect x="250" y="30" width="170" height="100" fill="none" stroke="url(#Grad2)" stroke-width="40"/> + <text font-family="Arial" font-size="12" x="230" y="165">Radial gradient on stroke of rectangle</text> + <!-- ====================================================================== --> + <!-- Gradient on fill of text ======== --> + <!-- ====================================================================== --> + <radialGradient id="Grad3" gradientUnits="userSpaceOnUse" cx="225" cy="180" r="90" fx="225" fy="180"> + <stop stop-color="#060" offset="0"/> + <stop stop-color="yellow" offset="1"/> + </radialGradient> + <text font-family="Arial" font-size="50" fill="url(#Grad3)" x="10" y="210">Gradient on text fill</text> + <text font-family="Arial" font-size="12" x="10" y="225">Radial gradient on text, black to yellow</text> + <!-- ====================================================================== --> + <!-- Gradient on stroke of text ======== --> + <!-- ====================================================================== --> + <radialGradient id="Grad4" gradientUnits="userSpaceOnUse" cx="225" cy="245" r="90" fx="225" fy="245"> + <stop stop-color="black" offset="0"/> + <stop stop-color="#D6D" offset="1"/> + </radialGradient> + <text font-family="Arial" font-size="45" fill="none" stroke="url(#Grad4)" stroke-width="2" x="10" y="270">Gradient on text stroke</text> + <text font-family="Arial" font-size="12" x="10" y="285">Radial gradient on stroke of text, black to red</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-grad-12-b-manual.svg b/testing/web-platform/tests/svg/import/pservers-grad-12-b-manual.svg new file mode 100644 index 000000000..d00f73af8 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-grad-12-b-manual.svg @@ -0,0 +1,110 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Haroon Sheikh" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: pservers-grad-12-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Gradients"> + <p> + Test that the viewer can handle the gradientUnits attribute on radial gradients. + It tests the following values of gradientUnits: default (objectBoundingBox), objectBoundingBox, + and userSpaceOnUse. + </p> + <p> + From top-down the appearance of objects is as follows. + </p> + <p> + The first rectangle uses the default attributes on the radialGradient element. + Therefore the radial gradient should be relative to the object bounding box. It should appear + from the center of the viewport (blue) to the edges of the viewport (lime). + The rectangle is wider than tall so it the gradient should be elliptical, not circular. + </p> + <p> + The next rectangle uses gradientUnits=objectBoundingBox. The radial gradient should + travel from a center of 20%, 20% of the rectangle with a radius of 50%. + </p> + <p> + The last rectangle uses gradientUnits=userSpaceOnUse. The rectangle element is given it's + own transformation and the gradient is assumed to be in this user space. + The gradient should appear in the center of the rectangle as a radial gradient from yellow (center) to blue (edge). + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if the rendering of the three rectangles matches those + in the reference image. Specifically:</p> + <ul> + <li>The upper rectangle is filled with an elliptical radial gradient + with blue at the center and lime at its edges.</li> + <li>The middle rectangle is also filled with an elliptical radial + gradient with blue inside and lime outside, but with the center + point of the gradient in the top-left quadrant of the rectangle.</li> + <li>The bottom rectangle is filled with a circular radial gradient + with yellow at the center and blue at its edges. Since it is circular, + most of the rectangle is filled with plain blue.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-grad-12-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-size="15" x="10" y="25">Testing gradientUnits attribute</text> + <!-- ====================================================================== --> + <!-- Radial gradient with default attributes on <radial gradient> element. --> + <!-- ====================================================================== --> + <radialGradient id="Grad1"> + <stop stop-color="#009" offset="0"/> + <stop stop-color="lime" offset="1"/> + </radialGradient> + <rect x="10" y="35" width="460" height="50" fill="url(#Grad1)"/> + <text font-size="12" x="10" y="100">Radial gradient with default attributes (from blue to yellow)</text> + <text font-size="12" x="10" y="115">Gradient is blue at the object center and lime at the object edges</text> + <!-- ====================================================================== --> + <!-- Radial gradient with gradientUnits=objectBoundingBox ======== --> + <!-- ====================================================================== --> + <radialGradient id="Grad2" gradientUnits="objectBoundingBox" cx=".2" cy=".2" fx=".2" fy=".2" r=".5"> + <stop stop-color="#009" offset="0"/> + <stop stop-color="lime" offset="1"/> + </radialGradient> + <rect x="10" y="125" width="460" height="50" fill="url(#Grad2)"/> + <text font-size="12" x="10" y="190">gradientUnits=objectBoundingBox</text> + <text font-size="12" x="10" y="205">cx=.2, cy=.2, r=.5, fx=.2 fy=.2</text> + <!-- ====================================================================== --> + <!-- Gradient using gradientUnits="userSpaceOnUse" --> + <!-- ====================================================================== --> + <radialGradient id="Grad3" cx="25" cy="215" r="25" fx="25" fy="215" gradientUnits="userSpaceOnUse"> + <stop stop-color="yellow" offset="0"/> + <stop stop-color="blue" offset="1"/> + </radialGradient> + <rect transform="translate(10, 260) rotate(-90)" x="0" y="0" width="50" height="460" fill="url(#Grad3)"/> + <text font-size="12" x="10" y="275">gradientUnits=userSpaceOnUse</text> + <text font-size="12" x="10" y="290">Gradient is yellow to blue radial gradient from center to horizontal bounds</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-grad-13-b-manual.svg b/testing/web-platform/tests/svg/import/pservers-grad-13-b-manual.svg new file mode 100644 index 000000000..02d67691e --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-grad-13-b-manual.svg @@ -0,0 +1,171 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="BB" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: pservers-grad-13-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Gradients"> + <p> + The purpose of this file is to test several values for focal points of radial gradients. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if the rendered image matches the reference image, except + for any differences in font choice due to CSS2.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-grad-13-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x="240" y="30" font-size="20" text-anchor="middle">Radial gradient focal point</text> + <defs> + <g id="alpha"> + <rect x="00" y="0" width="100" height="60" fill="yellow"/> + <rect x="00" y="0" width="10" height="60" fill="gold"/> + <rect x="15" y="0" width="10" height="60" fill="orange"/> + <rect x="30" y="0" width="10" height="60" fill="sienna"/> + <rect x="45" y="0" width="10" height="60" fill="gold"/> + <rect x="60" y="0" width="10" height="60" fill="sienna"/> + <rect x="75" y="0" width="10" height="60" fill="orange"/> + <rect x="90" y="0" width="10" height="60" fill="gold"/> + <rect x="00" y="0" width="100" height="60"/> + <!-- inherits a radial gradient --> + </g> + </defs> + <defs> + <radialGradient id="grad1a" gradientUnits="objectBoundingBox" cx="10%" cy="10%" r="75%" fx="00.00%" fy="00%"> + <stop offset="0" stop-opacity="0"/> + <stop offset=".5" stop-color="darkblue"/> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + <radialGradient id="grad2a" gradientUnits="objectBoundingBox" cx="10%" cy="10%" r="75%" fx="16.66%" fy="00%"> + <stop offset="0" stop-opacity="0"/> + <stop offset=".5" stop-color="darkblue"/> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + <radialGradient id="grad4a" gradientUnits="objectBoundingBox" cx="10%" cy="10%" r="75%" fx="50.00%" fy="00%"> + <stop offset="0" stop-opacity="0"/> + <stop offset=".5" stop-color="darkblue"/> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + <radialGradient id="grad6a" gradientUnits="objectBoundingBox" cx="10%" cy="10%" r="75%" fx="83.33%" fy="00%"> + <stop offset="0" stop-opacity="0"/> + <stop offset=".5" stop-color="darkblue"/> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + + <radialGradient id="grad1b" gradientUnits="objectBoundingBox" cx="10%" cy="10%" r="75%" fx="00.00%" fy="25%"> + <stop offset="0" stop-opacity="0"/> + <stop offset=".5" stop-color="darkblue"/> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + <radialGradient id="grad2b" gradientUnits="objectBoundingBox" cx="10%" cy="10%" r="75%" fx="16.66%" fy="25%"> + <stop offset="0" stop-opacity="0"/> + <stop offset=".5" stop-color="darkblue"/> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + <radialGradient id="grad4b" gradientUnits="objectBoundingBox" cx="10%" cy="10%" r="75%" fx="50.00%" fy="25%"> + <stop offset="0" stop-opacity="0"/> + <stop offset=".5" stop-color="darkblue"/> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + <radialGradient id="grad6b" gradientUnits="objectBoundingBox" cx="10%" cy="10%" r="75%" fx="83.33%" fy="25%"> + <stop offset="0" stop-opacity="0"/> + <stop offset=".5" stop-color="darkblue"/> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + + <radialGradient id="grad1c" gradientUnits="objectBoundingBox" cx="10%" cy="10%" r="75%" fx="00.00%" fy="50%"> + <stop offset="0" stop-opacity="0"/> + <stop offset=".5" stop-color="darkblue"/> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + <radialGradient id="grad2c" gradientUnits="objectBoundingBox" cx="10%" cy="10%" r="75%" fx="16.66%" fy="50%"> + <stop offset="0" stop-opacity="0"/> + <stop offset=".5" stop-color="darkblue"/> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + <radialGradient id="grad4c" gradientUnits="objectBoundingBox" cx="10%" cy="10%" r="75%" fx="50.00%" fy="50%"> + <stop offset="0" stop-opacity="0"/> + <stop offset=".5" stop-color="darkblue"/> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + <radialGradient id="grad6c" gradientUnits="objectBoundingBox" cx="10%" cy="10%" r="75%" fx="83.33%" fy="50%"> + <stop offset="0" stop-opacity="0"/> + <stop offset=".5" stop-color="darkblue"/> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + + <radialGradient id="grad1d" gradientUnits="objectBoundingBox" cx="10%" cy="10%" r="75%" fx="00.00%" fy="75%"> + <stop offset="0" stop-opacity="0"/> + <stop offset=".5" stop-color="darkblue"/> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + <radialGradient id="grad2d" gradientUnits="objectBoundingBox" cx="10%" cy="10%" r="75%" fx="16.66%" fy="75%"> + <stop offset="0" stop-opacity="0"/> + <stop offset=".5" stop-color="darkblue"/> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + <radialGradient id="grad4d" gradientUnits="objectBoundingBox" cx="10%" cy="10%" r="75%" fx="50.00%" fy="75%"> + <stop offset="0" stop-opacity="0"/> + <stop offset=".5" stop-color="darkblue"/> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + <radialGradient id="grad6d" gradientUnits="objectBoundingBox" cx="10%" cy="10%" r="75%" fx="83.33%" fy="75%"> + <stop offset="0" stop-opacity="0"/> + <stop offset=".5" stop-color="darkblue"/> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + </defs> + + <g id="group1" stroke="black" stroke-width="0.5"> + <use xlink:href="#alpha" x="017.5" y="045" fill="url(#grad1a)"/> + <use xlink:href="#alpha" x="130" y="045" fill="url(#grad2a)"/> + <use xlink:href="#alpha" x="242.5" y="045" fill="url(#grad4a)"/> + <use xlink:href="#alpha" x="355" y="045" fill="url(#grad6a)"/> + + <use xlink:href="#alpha" x="017.5" y="110" fill="url(#grad1b)"/> + <use xlink:href="#alpha" x="130" y="110" fill="url(#grad2b)"/> + <use xlink:href="#alpha" x="242.5" y="110" fill="url(#grad4b)"/> + <use xlink:href="#alpha" x="355" y="110" fill="url(#grad6b)"/> + + <use xlink:href="#alpha" x="017.5" y="175" fill="url(#grad1c)"/> + <use xlink:href="#alpha" x="130" y="175" fill="url(#grad2c)"/> + <use xlink:href="#alpha" x="242.5" y="175" fill="url(#grad4c)"/> + <use xlink:href="#alpha" x="355" y="175" fill="url(#grad6c)"/> + + <use xlink:href="#alpha" x="017.5" y="240" fill="url(#grad1d)"/> + <use xlink:href="#alpha" x="130" y="240" fill="url(#grad2d)"/> + <use xlink:href="#alpha" x="242.5" y="240" fill="url(#grad4d)"/> + <use xlink:href="#alpha" x="355" y="240" fill="url(#grad6d)"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-grad-14-b-manual.svg b/testing/web-platform/tests/svg/import/pservers-grad-14-b-manual.svg new file mode 100644 index 000000000..63045cfa6 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-grad-14-b-manual.svg @@ -0,0 +1,120 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="BB" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: pservers-grad-14-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Gradients"> + <p> + The intent of this file is to test the 4 allowed spread methods for linear and radial gradients. + The 4 values (pad, reflect, repeat and default) are available for both types of gradients. + On the left side are the linear gradient results, and on the right, the radial results. + The UA should render a result equivalent to the reference image. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if the rendered image matches the reference image, except + for any differences in font choice due to CSS2.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-grad-14-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <linearGradient id="lgSpreadPad" gradientUnits="userSpaceOnUse" y1="0" x1="50" y2="0" x2="100" spreadMethod="pad"> + <stop offset="000%" stop-color="black"/> + <stop offset="100%" stop-color="gold"/> + </linearGradient> + + <linearGradient id="lgSpreadReflect" gradientUnits="userSpaceOnUse" y1="0" x1="50" y2="0" x2="100" spreadMethod="reflect"> + <stop offset="000%" stop-color="black"/> + <stop offset="100%" stop-color="gold"/> + </linearGradient> + + <linearGradient id="lgSpreadRepeat" gradientUnits="userSpaceOnUse" y1="0" x1="50" y2="0" x2="100" spreadMethod="repeat"> + <stop offset="000%" stop-color="black"/> + <stop offset="100%" stop-color="gold"/> + </linearGradient> + + <linearGradient id="lgSpreadDefault" gradientUnits="userSpaceOnUse" y1="0" x1="50" y2="0" x2="100"> + <stop offset="000%" stop-color="black"/> + <stop offset="100%" stop-color="gold"/> + </linearGradient> + + <radialGradient id="rgSpreadPad" gradientUnits="objectBoundingBox" cx="0.5" cy="0.5" r="0.2" spreadMethod="pad"> + <stop offset="000%" stop-color="black"/> + <stop offset="100%" stop-color="gold"/> + </radialGradient> + + <radialGradient id="rgSpreadReflect" gradientUnits="objectBoundingBox" cx="0.5" cy="0.5" r="0.2" spreadMethod="reflect"> + <stop offset="000%" stop-color="black"/> + <stop offset="100%" stop-color="gold"/> + </radialGradient> + + <radialGradient id="rgSpreadRepeat" gradientUnits="objectBoundingBox" cx="0.5" cy="0.5" r="0.2" spreadMethod="repeat"> + <stop offset="000%" stop-color="black"/> + <stop offset="100%" stop-color="gold"/> + </radialGradient> + + <radialGradient id="rgSpreadDefault" gradientUnits="objectBoundingBox" cx="0.5" cy="0.5" r="0.2"> + <stop offset="000%" stop-color="black"/> + <stop offset="100%" stop-color="gold"/> + </radialGradient> + </defs> + + <text font-size="20" x="240" y="30" text-anchor="middle">Gradient 'spreadMethod' values</text> + + <rect x="10" y="060" width="225" height="40" fill="url(#lgSpreadPad)" stroke="none"/> + <text font-size="16" x="10" y="55">spreadMethod="pad"</text> + + <rect x="10" y="130" width="225" height="40" fill="url(#lgSpreadReflect)" stroke="none"/> + <text font-size="16" x="10" y="125">spreadMethod="reflect"</text> + + <rect x="10" y="200" width="225" height="40" fill="url(#lgSpreadRepeat)" stroke="none"/> + <text font-size="16" x="10" y="195">spreadMethod="repeat"</text> + + <rect x="10" y="270" width="225" height="40" fill="url(#lgSpreadDefault)" stroke="none"/> + <text font-size="16" x="10" y="265">spreadMethod="default"</text> + + + <rect x="245" y="060" width="225" height="40" fill="url(#rgSpreadPad)" stroke="none"/> + <text font-size="16" x="245" y="55">spreadMethod="pad"</text> + + <rect x="245" y="130" width="225" height="40" fill="url(#rgSpreadReflect)" stroke="none"/> + <text font-size="16" x="245" y="125">spreadMethod="reflect"</text> + + <rect x="245" y="200" width="225" height="40" fill="url(#rgSpreadRepeat)" stroke="none"/> + <text font-size="16" x="245" y="195">spreadMethod="repeat"</text> + + <rect x="245" y="270" width="225" height="40" fill="url(#rgSpreadDefault)" stroke="none"/> + <text font-size="16" x="245" y="265">spreadMethod="default"</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-grad-15-b-manual.svg b/testing/web-platform/tests/svg/import/pservers-grad-15-b-manual.svg new file mode 100644 index 000000000..84ecd8f25 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-grad-15-b-manual.svg @@ -0,0 +1,70 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="CN" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: pservers-grad-15-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Gradients"> + <p> + Test linear and radial gradient defaults. Includes + testing defaults for linear grad x1,y1,y2 = 0%, x2 = 100%. + and testing defaults for radial grad cx,cy,r = 50%, fx,fy = cx,cy. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The top rectangle must be blue at the lefthand side and fuchsia at the right + hand side, fading smoothly accross. The lower rectangle must be fuchsia at + the edges with a black centre to the radial gradient at the centre of the + rectangle, and the gradient occupying the whole rectangle. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-grad-15-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- Test defaults for linear grad x1,y1,y2 = 0%, x2 = 100%. --> + <linearGradient id="defs1" gradientUnits="objectBoundingBox"> + <stop stop-color="blue" offset="0"/> + <stop stop-color="fuchsia" offset="1"/> + </linearGradient> + <!-- Test defaults for radial grad cx,cy,r = 50%, fx,fy = cx,cy. --> + <radialGradient id="defs2" gradientUnits="objectBoundingBox"> + <stop stop-color="black" offset="0"/> + <stop stop-color="fuchsia" offset="1"/> + </radialGradient> + + <rect x="20" y="20" width="440" height="80" fill="url(#defs1)"/> + <rect x="20" y="150" width="440" height="80" fill="url(#defs2)"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-grad-16-b-manual.svg b/testing/web-platform/tests/svg/import/pservers-grad-16-b-manual.svg new file mode 100644 index 000000000..1f62ca838 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-grad-16-b-manual.svg @@ -0,0 +1,81 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="CN" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: pservers-grad-16-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Gradients"> + <p> + Test gradient stop rules. Including: + No stops, like fill = none. + One stop, like fill = black. + If a stop less than all previous stops, it is set equal to the largest stop. + If two stops are equal the last stop controls the color at the overlap point. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + [[ + Describe how to use the here. The instructions should specify any + steps requied to run the test or any manual operation that need + to be performed to run the test. + ]] + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The top rectangle must have a pink outline and no fill. The middle rectangle must have a + solid black fill. The lower rectangle must have a yellow to pink to green + linear gradient on the left-hand half and a solid blue fill for the right hand half. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-grad-16-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- No stops, like fill = none --> + <linearGradient id="defs1" gradientUnits="objectBoundingBox" x1="0" y1="0" x2="1" y2="0"> + </linearGradient> + <!-- One stop, like fill = black --> + <linearGradient id="defs2" gradientUnits="objectBoundingBox" x1="0" y1="0" x2="1" y2="0"> + <stop stop-color="black" offset="1"/> + </linearGradient> + <!-- If a stop less than all previous stops, it is set equal to the largest stop--> + <!-- This also tests if two stops are equal the last stop controls the color at the overlap point--> + <linearGradient id="defs3" gradientUnits="objectBoundingBox" x1="0" y1="0" x2="1" y2="0"> + <stop stop-color="yellow" offset="0"/> + <stop stop-color="#f48" offset=".25"/> + <stop stop-color="green" offset=".5"/> + <stop stop-color="blue" offset=".1"/> + </linearGradient> + + <rect x="20" y="10" width="440" height="80" fill="url(#defs1)" stroke="#f48"/> + <rect x="20" y="110" width="440" height="80" fill="url(#defs2)"/> + <rect x="20" y="210" width="440" height="80" fill="url(#defs3)"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-grad-17-b-manual.svg b/testing/web-platform/tests/svg/import/pservers-grad-17-b-manual.svg new file mode 100644 index 000000000..209528935 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-grad-17-b-manual.svg @@ -0,0 +1,92 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AE" author="ED" status="accepted" + version="$Revision: 1.4 $" testname="$RCSfile: pservers-grad-17-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Gradients"> + <p> + This test has a gradient with gradientUnits='objectBoundingBox' which is a fade from black to white. + The gradient is used for the stroke of a line. Vertical and horizontal lines don't have a boundingbox, + since they are one-dimensional, even though the + stroke-width makes it look like they should have a boundingbox with non-zero width and height. + See the coordinate chapter, last paragraph of 7.11. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + [[ + Describe how to use the here. The instructions should specify any + steps requied to run the test or any manual operation that need + to be performed to run the test. + ]] + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The left rectangle has four 'line' elements rotated in different ways. The stroke for the lines have a green solid stroke fallback which + should be used if the gradient should be ignored. For this sub-test to pass there must be three lines with solid green stroke, and one line + (from bottom left to top right) with a gradient stroke, visible in the rectangle. + </p> + <p> + The right rectangle is the same as the left rectangle except that the stroke paintservers don't have a fallback specified. + For this sub-test to pass only the line from bottom left to top right must be visible in the rectangle, and it must have a gradient stroke. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-grad-17-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <linearGradient id="grad"> + <stop offset="0" stop-color="black"/> + <stop offset="1" stop-color="white"/> + </linearGradient> + </defs> + + <!-- sub-test 1: stroke with solid color fallback --> + <g transform="translate(50, 100) scale(0.3)"> + <line x1="0" y1="180" x2="480" y2="180" stroke="url(#grad) #0f0" stroke-width="20"/> + <line x1="0" y1="180" x2="480" y2="180" stroke="url(#grad) #0f0" stroke-width="20" transform="rotate(45 240 180)"/> + <line x1="0" y1="180" x2="480" y2="180" stroke="url(#grad) #0f0" stroke-width="20" transform="rotate(90 240 180)"/> + <line x1="410" y1="10" x2="70" y2="350" stroke="url(#grad) #0f0" stroke-width="20"/> + <rect x="0" y="-60" width="480" height="480" fill="none" stroke="black"/> + </g> + <text x="120" y="250" text-anchor="middle">With fallback</text> + + <!-- sub-test 2: stroke without a fallback --> + <g transform="translate(280,100) scale(0.3)"> + <line x1="0" y1="180" x2="480" y2="180" stroke="url(#grad)" stroke-width="20"/> + <line x1="0" y1="180" x2="480" y2="180" stroke="url(#grad)" stroke-width="20" transform="rotate(45 240 180)"/> + <line x1="0" y1="180" x2="480" y2="180" stroke="url(#grad)" stroke-width="20" transform="rotate(90 240 180)"/> + <line x1="410" y1="10" x2="70" y2="350" stroke="url(#grad)" stroke-width="20"/> + <rect x="0" y="-60" width="480" height="480" fill="none" stroke="black"/> + </g> + <text x="350" y="250" text-anchor="middle">Without fallback</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-grad-18-b-manual.svg b/testing/web-platform/tests/svg/import/pservers-grad-18-b-manual.svg new file mode 100644 index 000000000..3bb4411c0 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-grad-18-b-manual.svg @@ -0,0 +1,114 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CC" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: pservers-grad-18-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Gradients"> + <p> + This test shows rectangles filled with gradient. + Several gradients are defined, with two stops: + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + For the top-left rectangle's gradient: + The first stop defines a fully-opaque green color. + The second stop explicitly inherits (i.e. using the 'inherit' keyword) its stop-color. + </p> + <p> + For the top-right rectangle's gradient: + The first stop defines a fully-opaque green color. + The second stop defines a green stop-color but explicitly inherits (i.e. using the 'inherit' keyword) the stop-opacity. + </p> + <p> + For the bottom-left rectangle's gradient: + The first stop defines a fully-opaque green color. + The second stop does not specify the stop-color and the stop-opacity. + Since both properties are not inherited, the initial value should be used. + </p> + <p> + For the bottom-right rectangle's gradient: + The first stop defines a fully-opaque green color. + The second stop specifies the stop-color using the 'currentColor' keyword. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The result should be: + </p> + <p> + The top-left rectangle is filled with a gradient from green to pink since + the stop-color is inherited from the location of the gradient definition. + </p> + <p> + The top-right rectangle filled in green with a gradient opacity. + </p> + <p> + The lower-left rectangle filled with a gradient going from fully-opaque green to fully-opaque black. + </p> + <p> + The lower-right rectangle filled with a gradient going from fully-opaque green to fully-opaque yellow. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-grad-18-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g id="g0" stop-color="#f48" stop-opacity="0.5" color="yellow"> + <linearGradient id="MyGradient1" stop-color="inherit"> + <stop offset="0" stop-color="green" stop-opacity="1"/> + <stop offset="1" stop-color="inherit" stop-opacity="1"/> + </linearGradient> + <linearGradient id="MyGradient2" stop-opacity="inherit"> + <stop offset="0" stop-color="green" stop-opacity="1"/> + <stop offset="1" stop-color="green" stop-opacity="inherit"/> + </linearGradient> + <linearGradient id="MyGradient3"> + <stop offset="0" stop-color="green" stop-opacity="1"/> + <stop offset="1"/> + </linearGradient> + <linearGradient id="MyGradient4"> + <stop offset="0" stop-color="green" stop-opacity="1"/> + <stop offset="1" stop-color="currentColor" stop-opacity="1"/> + </linearGradient> + </g> + <g id="g1" stop-color="blue"> + <rect id="r1" fill="url(#MyGradient1)" width="100" height="100" x="50" y="50"/> + </g> + <g id="g2" stop-opacity="1"> + <rect id="r2" fill="url(#MyGradient2)" width="100" height="100" x="200" y="50"/> + </g> + <g id="g3" stop-opacity="1" stop-color="blue"> + <rect id="r3" fill="url(#MyGradient3)" width="100" height="100" x="50" y="200"/> + </g> + <g id="g4" color="blue"> + <rect id="r4" fill="url(#MyGradient4)" width="100" height="100" x="200" y="200"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-grad-20-b-manual.svg b/testing/web-platform/tests/svg/import/pservers-grad-20-b-manual.svg new file mode 100644 index 000000000..e1812a12c --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-grad-20-b-manual.svg @@ -0,0 +1,92 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AG" author="ED" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: pservers-grad-20-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/animate.html#InterfaceSVGAnimationElement"> + <p> + This test has a gradient with gradientUnits='objectBoundingBox' which is a fade from black to white. + The gradient is used for the stroke of a line. Vertical and horizontal lines don't have a boundingbox, since they are one-dimensional, even though the + stroke-width makes it look like they should have a boundingbox with non-zero width and height. + See the coordinate chapter, last paragraph of 7.11. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + The left rectangle has four 'line' elements rotated in different ways. The stroke for the lines have a green solid stroke fallback which + should be used if the gradient should be ignored. + + The right rectangle is the same as the left rectangle except that the stroke paintservers don't have a fallback specified. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if + </p> + <ul> + <li> + there are three lines with solid green stroke, and one line + (from bottom left to top right) with a gradient stroke, visible in the left rectangle. + </li> + <li>there is a line from bottom left to top right with a gradient stroke, visible in the right rectangle.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-grad-20-b.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <linearGradient id="grad"> + <stop offset="0" stop-color="black" /> + <stop offset="1" stop-color="white" /> + </linearGradient> + </defs> + + <!-- sub-test 1: stroke with solid color fallback --> + <g transform="translate(50, 100) scale(0.3)"> + <path d="M0 180L480 180" stroke="url(#grad) #0f0" stroke-width="20"/> + <path d="M0 180L480 180" stroke="url(#grad) #0f0" stroke-width="20" transform="rotate(45 240 180)"/> + <path d="M0 180L480 180" stroke="url(#grad) #0f0" stroke-width="20" transform="rotate(90 240 180)"/> + <path d="M410 10L70 350" stroke="url(#grad) #0f0" stroke-width="20"/> + <rect x="0" y="-60" width="480" height="480" fill="none" stroke="black"/> + </g> + <text x="120" y="250" text-anchor="middle">With fallback</text> + + <!-- sub-test 2: stroke without a fallback --> + <g transform="translate(280,100) scale(0.3)"> + <path d="M0 180L480 180" stroke="url(#grad)" stroke-width="20"/> + <path d="M0 180L480 180" stroke="url(#grad)" stroke-width="20" transform="rotate(45 240 180)"/> + <path d="M0 180L480 180" stroke="url(#grad)" stroke-width="20" transform="rotate(90 240 180)"/> + <path d="M410 10L70 350" stroke="url(#grad)" stroke-width="20"/> + <rect x="0" y="-60" width="480" height="480" fill="none" stroke="black"/> + </g> + <text x="350" y="250" text-anchor="middle">Without fallback</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-grad-21-b-manual.svg b/testing/web-platform/tests/svg/import/pservers-grad-21-b-manual.svg new file mode 100644 index 000000000..8024d520b --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-grad-21-b-manual.svg @@ -0,0 +1,146 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AG" author="ED" status="accepted" + version="$Revision: 1.4 $" testname="$RCSfile: pservers-grad-21-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Gradients"> + <p> + Test the inheritance of radial gradient attributes. The test has six ellipses with blue stroke, each filled + with two gradients. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if: + </p> + <ul> + <li>the gradient fills don't extend outside the blue ellipses</li> + <li>the gradient fills in the left column exactly match the corresponding reference gradient fills in the right column</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-grad-21-b.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <radialGradient id="grad1" cx="100%" r="20%"> + <stop offset="0" stop-color="black" /> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + <radialGradient id="grad2" xlink:href="#grad1" cx="0%"/> + <radialGradient id="grad3" cx="100%" r="20%" fx="0%"> + <stop offset="0" stop-color="black" /> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + <radialGradient id="grad4" xlink:href="#grad3" cx="0%"/> + <radialGradient id="grad5" cx="100%" r="20%" fx="25%"> + <stop offset="0" stop-color="black" /> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + <radialGradient id="grad6" xlink:href="#grad5" cx="0%"/> + + <radialGradient id="grad1-ref" cx="100%" r="20%"> + <stop offset="0" stop-color="black" /> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + <radialGradient id="grad2-ref" cx="0%" r="20%"> + <stop offset="0" stop-color="black" /> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + <radialGradient id="grad3-ref" cx="100%" r="20%" fx="0%"> + <stop offset="0" stop-color="black" /> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + <radialGradient id="grad4-ref" cx="0%" r="20%" fx="0%"> + <stop offset="0" stop-color="black" /> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + <radialGradient id="grad5-ref" cx="100%" r="20%" fx="25%"> + <stop offset="0" stop-color="black" /> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + <radialGradient id="grad6-ref" cx="0%" r="20%" fx="25%"> + <stop offset="0" stop-color="black" /> + <stop offset="1" stop-opacity="0"/> + </radialGradient> + </defs> + + <g transform="translate(100 60)"> + <!-- first line of tests --> + <rect fill="url(#grad1)" x="-60" width="120" height="90"/> + <rect fill="url(#grad2)" x="60" width="120" height="90"/> + <ellipse cx="60" cy="45" rx="24" ry="18" fill="none" stroke="blue"/> + + <!-- reference for first line --> + <g transform="translate(100 0)"> + <rect fill="url(#grad1-ref)" x="-60" width="120" height="90"/> + <rect fill="url(#grad2-ref)" x="60" width="120" height="90"/> + <ellipse cx="60" cy="45" rx="24" ry="18" fill="none" stroke="blue"/> + </g> + + <!-- second line of tests --> + <g transform="translate(0 50)"> + <rect fill="url(#grad3)" x="-60" width="120" height="90"/> + <rect fill="url(#grad4)" x="60" width="120" height="90"/> + <ellipse cx="60" cy="45" rx="24" ry="18" fill="none" stroke="blue"/> + </g> + + <!-- reference for second line --> + <g transform="translate(100 50)"> + <rect fill="url(#grad3-ref)" x="-60" width="120" height="90"/> + <rect fill="url(#grad4-ref)" x="60" width="120" height="90"/> + <ellipse cx="60" cy="45" rx="24" ry="18" fill="none" stroke="blue"/> + </g> + + <!-- third line of tests --> + <g transform="translate(0 100)"> + <rect fill="url(#grad5)" x="-60" width="120" height="90"/> + <rect fill="url(#grad6)" x="60" width="120" height="90"/> + <ellipse cx="60" cy="45" rx="24" ry="18" fill="none" stroke="blue"/> + </g> + + <!-- reference for third line --> + <g transform="translate(100 100)"> + <rect fill="url(#grad5-ref)" x="-60" width="120" height="90"/> + <rect fill="url(#grad6-ref)" x="60" width="120" height="90"/> + <ellipse cx="60" cy="45" rx="24" ry="18" fill="none" stroke="blue"/> + </g> + + <rect x="120" y="20" width="80" height="200" fill="none" stroke="green"/> + <text y="200" x="160" text-anchor="middle" font-size="12">Reference</text> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-grad-22-b-manual.svg b/testing/web-platform/tests/svg/import/pservers-grad-22-b-manual.svg new file mode 100644 index 000000000..b4289b606 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-grad-22-b-manual.svg @@ -0,0 +1,97 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="AG" status="accepted" + version="$Revision: 1.4 $" testname="$RCSfile: pservers-grad-22-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/master/pservers.html#Gradients"> + <p> + Tests that transforms affect the rendering of a gradient. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test passes if each of the two gradient-filled rectangles + towards the top of the test slide is identical to the one below it. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-grad-22-b.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <linearGradient id="g1" x1="0" y1="0" x2="400" y2="50" gradientUnits="userSpaceOnUse" > + <stop offset="0" stop-color="blue"/> + <stop offset="0.5" stop-color="yellow"/> + <stop offset="1.0" stop-color="blue"/> + </linearGradient> + + <linearGradient id="g2" x1="0" y1="0" x2="200" y2="12.5" gradientUnits="userSpaceOnUse"> + <stop offset="0" stop-color="blue"/> + <stop offset="0.5" stop-color="yellow"/> + <stop offset="1.0" stop-color="blue"/> + </linearGradient> + + <linearGradient id="g3" x1="0" y1="0" x2="400" y2="50" gradientUnits="userSpaceOnUse" gradientTransform="rotate(-37) scale(0.89 1)"> + <stop offset="0" stop-color="blue"/> + <stop offset="0.5" stop-color="yellow"/> + <stop offset="1.0" stop-color="blue"/> + </linearGradient> + + <linearGradient id="g4" x1="0" y1="0" x2="200" y2="12.5" gradientUnits="userSpaceOnUse" gradientTransform="rotate(-20)"> + <stop offset="0" stop-color="blue"/> + <stop offset="0.5" stop-color="yellow"/> + <stop offset="1.0" stop-color="blue"/> + </linearGradient> + </defs> + + <g transform="translate(20,50)"> + <g transform="scale(0.5,1)"> + <rect width="400" height="50" fill="url(#g1)" /> + </g> + </g> + + <g transform="translate(20,120)"> + <rect width="200" height="50" fill="url(#g2)" /> + </g> + + <g transform="translate(250,80)"> + <rect width="400" height="50" fill="url(#g3)" transform="scale(0.5,1)"/> + </g> + + <g transform="translate(250,150)"> + <rect width="200" height="50" fill="url(#g4)" /> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-grad-23-f-manual.svg b/testing/web-platform/tests/svg/import/pservers-grad-23-f-manual.svg new file mode 100644 index 000000000..3029214d7 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-grad-23-f-manual.svg @@ -0,0 +1,80 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="[reviewer]" author="Microsoft" status="created" version="$Revision: 1.3 $" testname="$RCSfile: pservers-grad-23-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/pservers.html#Gradients"> + <p> + <!--[[ + Properties do not inherit from elements referencing 'linearGradient' or 'radialGradient' elements. + ]]--> + </p> + <p> + <!--[[ + Specify a 'stop-color' attribute equal to 'red' on a 'g' element ancestor of a 'rect' element. Specify a 'linearGradient' with a single + 'stop' that has a 'stop-color' of 'inherit'. Reference the 'linearGradient' from the 'rect' element and verify that the 'rect' is not red. + Repeat the same process with a sibling 'rect' element referencing a 'radialGradient' element. + ]]--> + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required + </p> + <p> + <!--[[ + + ]]--> + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + <!--[[ + Test passes if there is no red visible on the page. + ]]--> + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-grad-23-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-size="18"> + <defs> + <linearGradient id="testLinear" stop-color="inherit"> + <stop offset="100%" stop-color="inherit" /> + </linearGradient> + <radialGradient id="testRadial" stop-color="inherit"> + <stop offset="100%" stop-color="inherit" /> + </radialGradient> + </defs> + <g stop-color="red"> + <rect x="30" y="30" width="100" height="100" fill="url(#testLinear)" stop-color="inherit" /> + <rect x="150" y="30" width="100" height="100" fill="url(#testRadial)" stop-color="inherit" /> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg>
\ No newline at end of file diff --git a/testing/web-platform/tests/svg/import/pservers-grad-24-f-manual.svg b/testing/web-platform/tests/svg/import/pservers-grad-24-f-manual.svg new file mode 100644 index 000000000..2aa02986a --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-grad-24-f-manual.svg @@ -0,0 +1,68 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="CM" author="Microsoft" status="reviewed" version="$Revision: 1.3 $" testname="$RCSfile: pservers-grad-24-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/pservers.html#Gradients"> + <p> + Test that the 'linearGradient' and 'radialGradient' elements are neither rendered directly nor via the 'use' element. + </p> + <p> + The test defines 'linearGradient' and 'radialGradient' elements with a red 'stop' and references them from a 'use' element. 'linearGradient' + and 'radialGradient' elements with a red 'stop' are also specified outside of a 'defs' tag as if they were regular graphical elements. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-grad-24-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <linearGradient id="testLinear"> + <stop offset="100%" stop-color="red" /> + </linearGradient> + <radialGradient id="testRadial"> + <stop offset="100%" stop-color="red" /> + </radialGradient> + </defs> + <text x="10" y="50">There should be no red.</text> + <use x="0" y="0" xlink:href="url(#testLinear)" /> + <use x="0" y="150" xlink:href="url(#testRadial)" /> + <linearGradient x1="0" x2="100" y1="150" y2="250"> + <stop offset="100%" stop-color="red" /> + </linearGradient> + <radialGradient cx="200" cy="300" r="50" fx="200" fy="300"> + <stop offset="100%" stop-color="red" /> + </radialGradient> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-grad-stops-01-f-manual.svg b/testing/web-platform/tests/svg/import/pservers-grad-stops-01-f-manual.svg new file mode 100644 index 000000000..d7d158135 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-grad-stops-01-f-manual.svg @@ -0,0 +1,70 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="CM" author="Microsoft" status="reviewed" version="$Revision: 1.3 $" testname="$RCSfile: pservers-grad-stops-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG/pservers.html#GradientStops"> + <p> + Test that gradient offset values less than zero are rounded up to zero and values more than one are rounded down to one. + </p> + <p> + The test defines four gradients, each with a single stop where the 'stop-color' is set to 'blue'. + The four gradients have 'offset' set to '-1', '-1%', '101%' and '2'. Four rectangles reference + the gradients. All of these should render as if they have plain blue fills. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test passed if there are four blue boxes on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-grad-stops-01-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <linearGradient id="gradient1"> + <stop offset="-1" stop-color="blue" /> + </linearGradient> + <linearGradient id="gradient2"> + <stop offset="-1%" stop-color="blue" /> + </linearGradient> + <linearGradient id="gradient3"> + <stop offset="2" stop-color="blue" /> + </linearGradient> + <linearGradient id="gradient4"> + <stop offset="101%" stop-color="blue" /> + </linearGradient> + </defs> + <rect fill="url(#gradient1)" stroke="black" stroke-width="5" x="10" y="10" width="100" height="100" /> + <rect fill="url(#gradient2)" stroke="black" stroke-width="5" x="120" y="10" width="100" height="100" /> + <rect fill="url(#gradient3)" stroke="black" stroke-width="5" x="10" y="120" width="100" height="100" /> + <rect fill="url(#gradient4)" stroke="black" stroke-width="5" x="120" y="120" width="100" height="100" /> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-pattern-01-b-manual.svg b/testing/web-platform/tests/svg/import/pservers-pattern-01-b-manual.svg new file mode 100644 index 000000000..2081855a4 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-pattern-01-b-manual.svg @@ -0,0 +1,108 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Haroon Sheikh" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: pservers-pattern-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Patterns"> + <p> + Test that the viewer has basic capability to handle patterns + on fills and stroke of objects and text. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> +Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + From top-down the appearance of objects is as follows. + </p> + <p> + The top rectangle should be filled with a pattern composed of a green + rectangle on top of yellow rectangle. A default stroke has been applied to the original + rectangle to see the boundary of the rectangle. + </p> + <p> + The next rectangle has no fill, but has a thick stroke on which the pattern is + applied. The pattern consists of 4 colored rectangles. + </p> + <p> + The next item is a text with a pattern on the fill. The pattern appears as + alternating rows of orange and green. + </p> + <p> + The last item is a text with a 2 user unit stroke on which a pattern is applied. + The pattern appears as alternating columns of maroon and blue. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-pattern-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ====================================================================== --> + <!-- Rectangle with a pattern fill ======== --> + <!-- ====================================================================== --> + <pattern patternUnits="userSpaceOnUse" id="pat1" x="10" y="10" width="20" height="20"> + <rect x="5" y="5" width="10" height="10" fill="yellow"/> + <rect x="10" y="10" width="10" height="10" fill="green"/> + </pattern> + <rect x="25" y="10" width="430" height="60" stroke="black" fill="url(#pat1)"/> + <text font-family="Arial" font-size="12" x="25" y="85">Pattern created using yellow and green rectangles applied to fill of rectangle</text> + <!-- ====================================================================== --> + <!-- Rectangle with a pattern on the stroke ======== --> + <!-- ====================================================================== --> + <pattern patternUnits="userSpaceOnUse" id="pat2" x="0" y="0" width="20" height="20"> + <rect x="0" y="0" width="10" height="10" fill="maroon"/> + <rect x="10" y="0" width="10" height="10" fill="green"/> + <rect x="0" y="10" width="10" height="10" fill="blue"/> + <rect x="10" y="10" width="10" height="10" fill="yellow"/> + </pattern> + <rect x="35" y="110" width="410" height="40" fill="none" stroke="url(#pat2)" stroke-width="20"/> + <text font-family="Arial" font-size="12" x="25" y="175">Pattern of 4 rectangles applied to a stroke of a rectangle.</text> + <!-- ====================================================================== --> + <!-- Pattern filled text ======== --> + <!-- ====================================================================== --> + <pattern patternUnits="userSpaceOnUse" id="pat3" x="0" y="0" width="10" height="20"> + <rect x="0" y="0" width="10" height="10" fill="orange"/> + <rect x="0" y="10" width="10" height="10" fill="green"/> + </pattern> + <text font-family="Arial" font-size="50" fill="url(#pat3)" x="25" y="220">Pattern on fill</text> + <text font-family="Arial" font-size="12" x="25" y="235">Pattern consists of orange and green rows</text> + <!-- ====================================================================== --> + <!-- Pattern on stroke of text ======== --> + <!-- ====================================================================== --> + <pattern patternUnits="userSpaceOnUse" id="pat4" x="0" y="0" width="20" height="10"> + <rect x="0" y="0" width="10" height="10" fill="maroon"/> + <rect x="10" y="0" width="10" height="10" fill="blue"/> + </pattern> + <text font-family="Arial" font-size="40" fill="none" stroke="url(#pat4)" stroke-width="2" x="25" y="275">Pattern on stroke</text> + <text font-family="Arial" font-size="12" x="25" y="290">Pattern consists of maroon and blue columns</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-pattern-02-f-manual.svg b/testing/web-platform/tests/svg/import/pservers-pattern-02-f-manual.svg new file mode 100644 index 000000000..d2e8655ac --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-pattern-02-f-manual.svg @@ -0,0 +1,61 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="ED" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: pservers-pattern-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#PatternElement"> + <p> + Test that the 'patternTransform' attribute has an effect on the 'pattern' element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the testframe is filled with a blue and white + diamond pattern. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-pattern-02-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <pattern id="pattern" viewBox="0 0 100 100" patternTransform="rotate(45)" height="0.1" width="0.1"> + <rect y="50" width="50" height="50" fill="blue"/> + <rect x="50" width="50" height="50" fill="blue"/> + </pattern> + </defs> + <rect fill="url(#pattern)" width="480" height="480"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-pattern-03-f-manual.svg b/testing/web-platform/tests/svg/import/pservers-pattern-03-f-manual.svg new file mode 100644 index 000000000..dbf9f4796 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-pattern-03-f-manual.svg @@ -0,0 +1,91 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="ED" status="created" + version="$Revision: 1.1 $" testname="$RCSfile: pservers-pattern-03-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Patterns"> + <p> + Test that empty patterns are not rendered, and that the fallback color is used instead. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there are 8 green rectangles visible, and no red. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-pattern-03-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <defs> + <pattern id="invisible1"> + <rect width="100%" height="100%" fill="red"/> + </pattern> + <pattern id="invisible2" patternUnits="objectBoundingBox" patternContentUnits="objectBoundingBox"> + <rect width="100%" height="100%" fill="red"/> + </pattern> + <pattern id="invisible3" width="0" height="0" patternUnits="objectBoundingBox" patternContentUnits="objectBoundingBox"> + <rect width="1" height="1" fill="red"/> + </pattern> + <pattern id="invisible4" width="0" patternUnits="objectBoundingBox" patternContentUnits="objectBoundingBox"> + <rect width="1" height="1" fill="red"/> + </pattern> + <pattern id="invisible5" width="0" height="0" patternUnits="userSpaceOnUse" patternContentUnits="objectBoundingBox"> + <rect width="1" height="1" fill="red"/> + </pattern> + <pattern id="invisible6" height="0" patternUnits="userSpaceOnUse" patternContentUnits="objectBoundingBox"> + <rect width="1" height="1" fill="red"/> + </pattern> + <pattern id="invisible7" height="0" patternUnits="userSpaceOnUse" patternContentUnits="userSpaceOnUse"> + <rect width="100%" height="100%" fill="red"/> + </pattern> + </defs> + + <g transform="translate(40 60)" stroke="black"> + <rect width="100" height="100" fill="url(#invisible1) lime"/> + <rect x="100" width="100" height="100" fill="url(#invisible2) lime"/> + <rect x="200" width="100" height="100" fill="url(#invisible3) lime"/> + <rect x="300" width="100" height="100" fill="url(#invisible4) lime"/> + + <rect y="100" width="100" height="100" fill="url(#invisible5) lime"/> + <rect x="100" y="100" width="100" height="100" fill="url(#invisible6) lime"/> + <rect x="200" y="100" width="100" height="100" fill="url(#invisible7) lime"/> + + <!-- note that this is on purpose testing a broken uri --> + <rect x="300" y="100" width="100" height="100" fill="url(#invisible8) lime"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.1 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-pattern-04-f-manual.svg b/testing/web-platform/tests/svg/import/pservers-pattern-04-f-manual.svg new file mode 100644 index 000000000..e24dd33d3 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-pattern-04-f-manual.svg @@ -0,0 +1,70 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="Microsoft" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: pservers-pattern-04-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Patterns"> + <p> + Inherited attributes from a referenced 'pattern' are not applied if they are already defined on the referencing 'pattern' element. + </p> + <p> + Define a pattern 'pattern1' with circles that have red fill. Inherit 'pattern1' into 'pattern2' and add circles at different 'y' + attribute and with 'fill' set to 'lime' on 'pattern2'. Reference 'pattern1' from a square using 'fill' attribute. Reference 'pattern2' + from a different square using 'fill' attribute. Position the second square directly over the first square. Verify that there is green visible. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there are four green circles visible on the page, and no red. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-pattern-04-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <pattern id="pattern1" patternUnits="userSpaceOnUse" x="0" y="0" width="100" height="100" viewBox="0 0 10 10" > + <circle cx="5" cy="5" r="1.9" fill="red" /> + </pattern> + <pattern id="pattern2" xlink:href="#pattern1" y="30"> + <circle cx="5" cy="2" r="2" fill="lime" /> + </pattern> + </defs> + <rect fill="url(#pattern1)" stroke="none" x="1" y="1" width="200" height="200" /> + <rect fill="url(#pattern2)" stroke="none" x="1" y="1" width="200" height="200" /> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-pattern-05-f-manual.svg b/testing/web-platform/tests/svg/import/pservers-pattern-05-f-manual.svg new file mode 100644 index 000000000..4fe22ab11 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-pattern-05-f-manual.svg @@ -0,0 +1,64 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="CM" author="Microsoft" status="reviewed" version="$Revision: 1.3 $" testname="$RCSfile: pservers-pattern-05-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG/pservers.html#Patterns"> + <p> + Test that a 'pattern' element can inherit attributes through multiple levels of + 'xlink:href' referencing. + </p> + <p> + The test defines a pattern 'pattern1' with some attributes that scale the contents. The attributes on + 'pattern1' are inherited into 'pattern2' and then inherited from 'pattern2' + into 'pattern3'. 'pattern3' has a green circle as its graphical content. + A 'rect' uses 'pattern3' as its fill, if the attributes are correctly inherited into + 'pattern3', then the green circle will occlude a red circle in the same position. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test passed if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-pattern-05-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <pattern id="Pattern1" patternUnits="userSpaceOnUse" width="100" height="100" viewBox="0 0 10 10" /> + <pattern id="Pattern2" xlink:href="#Pattern1" /> + <pattern id="Pattern3" xlink:href="#Pattern2"> + <circle cx="5" cy="5" r="2" fill="green"/> + </pattern> + </defs> + <circle cx="50" cy="50" r="20" fill="red" /> + <rect fill="url(#Pattern3)" width="100" height="100" /> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-pattern-06-f-manual.svg b/testing/web-platform/tests/svg/import/pservers-pattern-06-f-manual.svg new file mode 100644 index 000000000..721988449 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-pattern-06-f-manual.svg @@ -0,0 +1,65 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="[reviewer]" author="Microsoft" status="created" version="$Revision: 1.2 $" testname="$RCSfile: pservers-pattern-06-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG/pservers.html#Patterns"> + <p> + <!--[[ + The 'pattern' element is neither rendered directly nor via the 'use' element. + ]]--> + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + <!--[[ + Define a 'pattern' element with a red 'rect' and reference it from a 'use' element. Also specify one 'pattern' elements with a red 'rect' + outside of a 'defs' tag. Verify there is no red on the page. + ]]--> + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + <!--[[ + Test passes if there is no red visible on the page. + ]]--> + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-pattern-06-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <pattern id="testPattern" patternUnits="userSpaceOnUse" x="0" y="0" width="100" height="100" viewBox="0 0 10 10" > + <rect x="5" y="5" width="10" height="10" fill="red" /> + </pattern> + </defs> + <use x="100" y="100" xlink:href="url(#testPattern)" /> + <pattern patternUnits="userSpaceOnUse" x="10" y="10" width="20" height="20"> + <rect x="5" y="5" width="10" height="10" fill="red" /> + </pattern> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-pattern-07-f-manual.svg b/testing/web-platform/tests/svg/import/pservers-pattern-07-f-manual.svg new file mode 100644 index 000000000..8701df130 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-pattern-07-f-manual.svg @@ -0,0 +1,65 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="ED" status="reviewed" + version="$Revision: 1.2 $" testname="$RCSfile: pservers-pattern-07-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Patterns"> + <p> + Test that an invalid xlink:href on a 'pattern' element has no effect on the pattern. + The pattern dimensions and coordinate-system are defined completely on the pattern that has the invalid xlink:href, + to test that they're not overridden by the non-existant pattern that is referenced. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there are four green circles visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-pattern-07-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <pattern id="pattern1" patternUnits="userSpaceOnUse" x="0" y="0" width="100" height="100" viewBox="0 0 10 10"> + <circle cx="5" cy="5" r="1.7" fill="red" /> + </pattern> + <pattern id="pattern2" xlink:href="#invalidlink" patternUnits="userSpaceOnUse" x="0" y="0" width="100" height="100" viewBox="0 0 10 10"> + <circle cx="5" cy="5" r="2" fill="lime" /> + </pattern> + </defs> + <rect fill="url(#pattern1)" stroke="none" x="1" y="1" width="200" height="200" /> + <rect fill="url(#pattern2)" stroke="none" x="1" y="1" width="200" height="200" /> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-pattern-08-f-manual.svg b/testing/web-platform/tests/svg/import/pservers-pattern-08-f-manual.svg new file mode 100644 index 000000000..e15cb8458 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-pattern-08-f-manual.svg @@ -0,0 +1,66 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="ED" status="reviewed" + version="$Revision: 1.2 $" testname="$RCSfile: pservers-pattern-08-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Patterns"> + <p> + Test that an invalid xlink:href on a 'pattern' element has no effect on the pattern. + This test specifies only 'width' and 'height' on the pattern that is tested in order to catch + incorrectly overridden values from a non-existant pattern. The result is tested + with a reference pattern using slightly different syntax. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there are four green circles visible on the page, and no red. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-pattern-08-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <pattern id="pattern1" patternUnits="userSpaceOnUse" x="0" y="0" width="100" height="100" viewBox="0 0 10 10"> + <circle cx="5" cy="5" r="1.7" fill="red" /> + </pattern> + <pattern id="pattern2" xlink:href="#invalidlink" width="0.5" height="0.5"> + <circle cx="50" cy="50" r="20" fill="lime" /> + </pattern> + </defs> + <rect fill="url(#pattern1)" stroke="none" x="1" y="1" width="200" height="200" /> + <rect fill="url(#pattern2)" stroke="none" x="1" y="1" width="200" height="200" /> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/pservers-pattern-09-f-manual.svg b/testing/web-platform/tests/svg/import/pservers-pattern-09-f-manual.svg new file mode 100644 index 000000000..4d0ec1ae1 --- /dev/null +++ b/testing/web-platform/tests/svg/import/pservers-pattern-09-f-manual.svg @@ -0,0 +1,70 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="ED" status="created" + version="$Revision: 1.1 $" testname="$RCSfile: pservers-pattern-09-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/pservers.html#Patterns"> + <p> + Test that an invalid xlink:href on a 'pattern' element has no effect on the pattern, and that the + pattern isn't rendered since the default 'width' and 'height' is 0. + A subtest that explicitly specifies 'width' and 'height' as 0 is added as a reference. + Both of these cases should result in the fallback color being used. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there is a green rectangle visible on the page, and no red. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: pservers-pattern-09-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <pattern id="pattern1" patternUnits="userSpaceOnUse" x="0" y="0" width="100" height="100" viewBox="0 0 10 10"> + <circle cx="5" cy="5" r="1.7" fill="red" /> + </pattern> + <pattern id="pattern2" xlink:href="#invalidlink"> + <circle cx="50" cy="50" r="20" fill="red" /> + </pattern> + <pattern id="pattern3" patternUnits="userSpaceOnUse" x="0" y="0" width="0" height="0" viewBox="0 0 10 10"> + <circle cx="5" cy="5" r="1.7" fill="red" /> + </pattern> + </defs> + <rect fill="url(#pattern1)" stroke="none" x="1" y="1" width="200" height="200" /> + <rect fill="url(#pattern2) lime" stroke="none" x="1" y="1" width="200" height="200" /> + <rect fill="url(#pattern3) lime" stroke="none" x="201" y="1" width="200" height="200" /> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.1 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/render-elems-01-t-manual.svg b/testing/web-platform/tests/svg/import/render-elems-01-t-manual.svg new file mode 100644 index 000000000..ec391f88e --- /dev/null +++ b/testing/web-platform/tests/svg/import/render-elems-01-t-manual.svg @@ -0,0 +1,64 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: render-elems-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/render.html#Elements"> + <p> + Verifies that shapes can be filled. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> +Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + There is one pair of octagons. These are filled. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: render-elems-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ====================================================================== --> + <!-- First, fill shape with two different colors --> + <!-- ====================================================================== --> + <g transform="translate(30, 80)"> + <g fill="green"> + <path d="M60,0 l60,0 l60,60 l0,60 l-60,60 l-60,0 l-60,-60 l0,-60 z"/> + </g> + <g fill="black" transform="translate(200, 0)"> + <path d="M60,0 l60,0 l60,60 l0,60 l-60,60 l-60,0 l-60,-60 l0,-60 z"/> + </g> + <text x="130" y="-30" font-size="28">Shape fill</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/render-elems-02-t-manual.svg b/testing/web-platform/tests/svg/import/render-elems-02-t-manual.svg new file mode 100644 index 000000000..30646c64b --- /dev/null +++ b/testing/web-platform/tests/svg/import/render-elems-02-t-manual.svg @@ -0,0 +1,64 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: render-elems-02-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/render.html#Elements"> + <p> + Verifies that shapes can be stroked. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> +Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + There is one pair of octagons. These are stroked. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: render-elems-02-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ====================================================================== --> + <!-- Now, stroke shape with two different stroke width and color --> + <!-- ====================================================================== --> + <g transform="translate(30, 80)"> + <g fill="none" stroke="green" stroke-width="3"> + <path d="M60,0 l60,0 l60,60 l0,60 l-60,60 l-60,0 l-60,-60 l0,-60 z"/> + </g> + <g fill="none" stroke="black" stroke-width="9" transform="translate(200, 0)"> + <path d="M60,0 l60,0 l60,60 l0,60 l-60,60 l-60,0 l-60,-60 l0,-60 z"/> + </g> + <text x="110" y="-30" font-size="28">Shape stroke</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/render-elems-03-t-manual.svg b/testing/web-platform/tests/svg/import/render-elems-03-t-manual.svg new file mode 100644 index 000000000..b5a6b1a9f --- /dev/null +++ b/testing/web-platform/tests/svg/import/render-elems-03-t-manual.svg @@ -0,0 +1,63 @@ +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1 Tiny//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11-tiny.dtd" [ + <!ENTITY shape "<path d='M60,0 l60,0 l60,60 l0,60 l-60,60 l-60,0 l-60,-60 l0,-60 z'/>"> +]> +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: render-elems-03-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/render.html#Elements"> + <p> + Verifies that shapes can be filled, stroked and the order of filling and stroking. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> +Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + There is one pair of octagons. These are filled plus stroked. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: render-elems-03-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ====================================================================== --> + <!-- Now, fill and stroke. The fill should happen first --> + <!-- ====================================================================== --> + <g transform="translate(30, 80)"> + <g fill="yellow" stroke="green" stroke-width="8" >&shape;</g> + <g stroke="black" fill="blue" stroke-width="8" transform="translate(200, 0)">&shape;</g> + <text x="70" y="-30" font-size="28">Shape fill and stroke</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/render-elems-06-t-manual.svg b/testing/web-platform/tests/svg/import/render-elems-06-t-manual.svg new file mode 100644 index 000000000..ef2002b05 --- /dev/null +++ b/testing/web-platform/tests/svg/import/render-elems-06-t-manual.svg @@ -0,0 +1,74 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: render-elems-06-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/render.html#Elements"> + <p> + Verifies that text can be filled. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> +Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> +The + test shows two 'G' characters that are filled + (green to the left, and with navy to the right) and not stroked. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: render-elems-06-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs > + <font-face font-family="Blocky" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/Blocky.svg#Blocky"/> + </font-face-src> + </font-face> + <style type="text/css"> + @font-face { + font-family: BlockyWoff; + src: url(woffs/Blocky.woff) format("woff"); + </style> + </defs> + <!-- ====================================================================== --> + <!-- First, fill text with two different colors --> + <!-- ====================================================================== --> + <text x="180" y="40" font-size="30">Text fill</text> + <g font-size="300" font-family="Blocky, BlockyWoff"> + <text x="60" y="280" fill="green">G</text> + <text x="260" y="280" fill="navy">G</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/render-elems-07-t-manual.svg b/testing/web-platform/tests/svg/import/render-elems-07-t-manual.svg new file mode 100644 index 000000000..427e626ea --- /dev/null +++ b/testing/web-platform/tests/svg/import/render-elems-07-t-manual.svg @@ -0,0 +1,71 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: render-elems-07-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/render.html#Elements"> + <p> + Verifies that text can be stroked. The + + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> +Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test shows two characters that are stroked and not filled. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: render-elems-07-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <font-face font-family="Blocky" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/Blocky.svg#Blocky"/> + </font-face-src> + </font-face> + <style type="text/css"> + @font-face { + font-family: BlockyWoff; + src: url(woffs/Blocky.woff) format("woff"); + </style> + </defs> + <!-- ====================================================================== --> + <!-- Now, stroke text with two different stroke width and color --> + <!-- ====================================================================== --> + <text x="180" y="40" font-size="30">Text stroke</text> + <g font-size="300" font-family="Blocky, BlockyWoff"> + <text x="60" y="280" fill="none" stroke="green" stroke-width="12">G</text> + <text x="260" y="280" fill="none" stroke="navy" stroke-width="12">G</text> + </g> + <text id="revision" x="10" y="340" font-size="40" stroke="none" fill="black">$Revision: 1.9 $</text> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + </g> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/render-elems-08-t-manual.svg b/testing/web-platform/tests/svg/import/render-elems-08-t-manual.svg new file mode 100644 index 000000000..fb946e7f9 --- /dev/null +++ b/testing/web-platform/tests/svg/import/render-elems-08-t-manual.svg @@ -0,0 +1,73 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.10 $" testname="$RCSfile: render-elems-08-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/render.html#Elements"> + <p> + Verifies that text can be stroked. + + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> +Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test shows two 'G' characters that are both stroked and filled. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: render-elems-08-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <font-face font-family="Blocky" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/Blocky.svg#Blocky"/> + </font-face-src> + </font-face> + <style type="text/css"> + @font-face { + font-family: BlockyWoff; + src: url(woffs/Blocky.woff) format("woff"); + </style> + </defs> + <!-- ====================================================================== --> + <!-- Now, fill and stroke. The fill should happen first --> + <!-- ====================================================================== --> + <text x="120" y="40" font-size="30">Text fill and stroke</text> + <g font-size="300" font-family="Blocky, BlockyWoff"> + <text x="60" y="280" fill="#2f8" stroke="green" stroke-width="12">G</text> + <text x="260" y="280" fill="#e9a" stroke="navy" stroke-width="12">G</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.10 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/render-groups-01-b-manual.svg b/testing/web-platform/tests/svg/import/render-groups-01-b-manual.svg new file mode 100644 index 000000000..035f30c22 --- /dev/null +++ b/testing/web-platform/tests/svg/import/render-groups-01-b-manual.svg @@ -0,0 +1,109 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: render-groups-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/render.html#Grouping"> + <p> + Verifies implicit rendering order (paragraph 3.3) and grouping mechanism (paragraphs 3.4). + It also validates basic Shape, Image and text rendering. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> +Run the test. No interaction required. + </p> + <p> + The rendered image should match the reference image exactly. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + This test renders 3 elements: a text string "SVG", then + a shape, then an image. Because of their definition order and coordinates, the image + should be on top of the rectangle and the rectangle on top of the text. The + test validates that groups are conceptually rendered offscreen before being + rendered on the canvas. This is done by grouping the same overlapping objects and + rendering the group at half opacity. The background pattern (vertical stripes) should + show through all the group elements. However, none of the "SVG" text string should show through the + rectangle and none of the rectangle should show through the image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: render-groups-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <font horiz-adv-x="313"> + <!-- Converted from Larabie Anglepoise by Batik ttf2svg --> + <font-face font-family="s-larabie-anglepoise" units-per-em="1000" panose-1="0 0 4 0 0 0 0 0 0 0" ascent="703" descent="-300" alphabetic="0"/> + <missing-glyph horiz-adv-x="500" d="M63 0V700H438V0H63ZM125 63H375V638H125V63Z"/> + <glyph unicode="S" glyph-name="S" horiz-adv-x="385" d="M371 1H29V144H264Q264 151 264 166Q265 180 265 188Q265 212 249 212H132Q83 212 55 247Q29 279 29 329V566H335V422H136V375Q136 360 144 356Q148 355 168 355H279Q327 355 352 309Q371 273 371 221V1Z"/> + <glyph unicode="V" glyph-name="V" horiz-adv-x="351" d="M365 563L183 -33L0 563H101L183 296L270 563H365Z"/> + <glyph unicode="G" glyph-name="G" horiz-adv-x="367" d="M355 1H18V564H355V420H125V144H248V211H156V355H355V1Z"/> + <hkern g1="V" g2="G" k="-40"/> + </font> + <style type="text/css"> + @font-face { + font-family: anglepoise; + src: url(woffs/anglepoi.woff) format("woff"); + } + </style> + </defs> + <!-- ====================================================================== --> + <!-- 3 overlapping elements in a group with opacity --> + <!-- ====================================================================== --> + <g transform="scale(1.8, 1.8)"> + <!-- Background pattern --> + <rect x="20" y="10" width="230" height="155" fill="rgb(192, 192, 192)"/> + <line x1="40" y1="10" x2="40" y2="175" stroke="white" stroke-width="15"/> + <line x1="70" y1="10" x2="70" y2="175" stroke="white" stroke-width="15"/> + <line x1="100" y1="10" x2="100" y2="175" stroke="white" stroke-width="15"/> + <line x1="130" y1="10" x2="130" y2="175" stroke="white" stroke-width="15"/> + <line x1="160" y1="10" x2="160" y2="175" stroke="white" stroke-width="15"/> + <line x1="190" y1="10" x2="190" y2="175" stroke="white" stroke-width="15"/> + <line x1="220" y1="10" x2="220" y2="175" stroke="white" stroke-width="15"/> + <line x1="250" y1="10" x2="250" y2="175" stroke="white" stroke-width="15"/> + <rect x="20" y="10" width="230" height="155" fill="none" stroke="black"/> + <!-- The following group, as a whole, should be rendered with a .5 opacity --> + <!-- Conceptually, this means that the object is contains are first --> + <!-- rendered offscreen. Then, the offscreen is painted on the canvas with --> + <!-- half opacity. --> + <g opacity="0.5"> + <!-- The following text, rectangle and image are drawn, fully opaque, in --> + <!-- the order they are defined. Therefore, none of the 'A' under the --> + <!-- rectangle should show. Neither should any of the rectangle under --> + <!-- the image. --> + <text font-family="s-larabie-anglepoise, anglepoise" font-size="120" x="30" y="90">SVG</text> + <rect x="70" y="55" width="130" height="70" fill="rgb(130, 0, 50)"/> + <image x="162" y="75" width="80" height="80" xlink:href="../images/sign.png"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/render-groups-03-t-manual.svg b/testing/web-platform/tests/svg/import/render-groups-03-t-manual.svg new file mode 100644 index 000000000..92f5da0ca --- /dev/null +++ b/testing/web-platform/tests/svg/import/render-groups-03-t-manual.svg @@ -0,0 +1,100 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: render-groups-03-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/render.html#Grouping"> + <p> + Verifies implicit rendering order (paragraph 3.3) and grouping mechanism (paragraphs 3.4). + It also validates basic Shape, Image and text rendering. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> +Run the test. No interaction required. + </p> + <p> + The rendered image should match the reference image exactly. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + This test renders 3 elements: a text string "SVG", then + a shape, then an image. Because of their definition order and coordinates, the image + should be on top of the rectangle and the rectangle on top of the text. None + of the "SVG" text string should show through the + rectangle and none of the rectangle should show through the image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: render-groups-03-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <font horiz-adv-x="313"> + <!-- Converted from Larabie Anglepoise by Batik ttf2svg --> + <font-face font-family="s-larabie-anglepoise" units-per-em="1000" panose-1="0 0 4 0 0 0 0 0 0 0" ascent="703" descent="-300" alphabetic="0"/> + <missing-glyph horiz-adv-x="500" d="M63 0V700H438V0H63ZM125 63H375V638H125V63Z"/> + <glyph unicode="S" glyph-name="S" horiz-adv-x="385" d="M371 1H29V144H264Q264 151 264 166Q265 180 265 188Q265 212 249 212H132Q83 212 55 247Q29 279 29 329V566H335V422H136V375Q136 360 144 356Q148 355 168 355H279Q327 355 352 309Q371 273 371 221V1Z"/> + <glyph unicode="V" glyph-name="V" horiz-adv-x="351" d="M365 563L183 -33L0 563H101L183 296L270 563H365Z"/> + <glyph unicode="G" glyph-name="G" horiz-adv-x="367" d="M355 1H18V564H355V420H125V144H248V211H156V355H355V1Z"/> + <hkern g1="V" g2="G" k="-40"/> + </font> + <style type="text/css"> + @font-face { + font-family: anglepoise; + src: url(woffs/anglepoi.woff) format("woff"); + } + </style> + </defs> + <!-- ====================================================================== --> + <!-- 3 overlapping elements in a group with opacity --> + <!-- ====================================================================== --> + <g transform="scale(1.8, 1.8)"> + <!-- Background pattern --> + <rect x="20" y="10" width="230" height="155" fill="rgb(192, 192, 192)"/> + <line x1="40" y1="10" x2="40" y2="175" stroke="white" stroke-width="15"/> + <line x1="70" y1="10" x2="70" y2="175" stroke="white" stroke-width="15"/> + <line x1="100" y1="10" x2="100" y2="175" stroke="white" stroke-width="15"/> + <line x1="130" y1="10" x2="130" y2="175" stroke="white" stroke-width="15"/> + <line x1="160" y1="10" x2="160" y2="175" stroke="white" stroke-width="15"/> + <line x1="190" y1="10" x2="190" y2="175" stroke="white" stroke-width="15"/> + <line x1="220" y1="10" x2="220" y2="175" stroke="white" stroke-width="15"/> + <line x1="250" y1="10" x2="250" y2="175" stroke="white" stroke-width="15"/> + <rect x="20" y="10" width="230" height="155" fill="none" stroke="black"/> + <!-- The following text, rectangle and image are drawn, fully opaque, in --> + <!-- the order they are defined. Therefore, none of the 'A' under the --> + <!-- rectangle should show. Neither should any of the rectangle under --> + <!-- the image. --> + <text font-family="s-larabie-anglepoise, anglepoise" font-size="120" x="30" y="90">SVG</text> + <rect x="70" y="55" width="130" height="70" fill="rgb(130, 0, 50)"/> + <image x="162" y="75" width="80" height="80" xlink:href="../images/sign.png"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/script-handle-01-b-manual.svg b/testing/web-platform/tests/svg/import/script-handle-01-b-manual.svg new file mode 100644 index 000000000..b99bb864f --- /dev/null +++ b/testing/web-platform/tests/svg/import/script-handle-01-b-manual.svg @@ -0,0 +1,95 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: script-handle-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/script.html#EventHandling"> + <p> + Tests basic mouse event handler and DOM manipulation through + ECMAScript binding. + </p> + <p> + The test uses ECMAScript and initially displays a target with + a message asking the user to click on the target. Once the user + has done so, and if both event handling and DOM manipulation are + supported, then the target and initial text are hidden and a text + message indicating that the test was successful is displayed. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Load the test. Click on the blue square.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if, after clicking on the blue square, it and + the instruction text "Click on the blue square" is removed + and replaced with green text stating "Scripting Test Passed!".</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: script-handle-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- Displayed Title --> + <text x="140" y="20" fill="black"> + Event and DOM Access Test + </text> + + <!-- When the user clicks on the "target" group, the onMouseClick should --> + <!-- be invoked. That handler will hide the target and show a message --> + <!-- indicating that the test passed. --> + <g id="targetGroup"> + <g id="target" onclick="onMouseClick( evt )"> + <text x="70" y="150">Click on the blue square</text> + <rect x="60" y="160" width="20" height="20" fill="blue" stroke="none"/> + </g> + <g id="testPassed" visibility="hidden"> + <text x="70" y="170" fill="green" font-size="30" font-weight="bold">Scripting Test Passed!</text> + </g> + </g> + + <script type="text/ecmascript"><![CDATA[ + + function onMouseClick(evt) { + + // Get Document + var target = evt.target; + var doc = target.ownerDocument; + + // Make test result visible + var testPassed = doc.getElementById('testPassed'); + testPassed.setAttribute('visibility', 'visible'); + + // Make target invisible + var target = doc.getElementById('target'); + target.setAttribute('visibility', 'hidden'); + } + + ]]></script> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/script-handle-02-b-manual.svg b/testing/web-platform/tests/svg/import/script-handle-02-b-manual.svg new file mode 100644 index 000000000..b26e98ad0 --- /dev/null +++ b/testing/web-platform/tests/svg/import/script-handle-02-b-manual.svg @@ -0,0 +1,124 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="issue" + version="$Revision: 1.9 $" testname="$RCSfile: script-handle-02-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/script.html#EventHandling"> + <p> + <strong>Resolved to unapproved this test because elements being + focusable and activatable is underdefined in the spec. ACTION-2977</strong> + </p> + <p> + Tests basic mouse event handlers. + </p> + <p> + The test shows a target that can be used to generate the various + kinds of events supported in SVG. Below the + target, the list of events is shown with red markers next to each. + </p> + <p> + If the test passes, all the markers should have turned to green + after the events have been triggered on the target. If any event + has not triggered, its marker will remain red. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Load the test. Focus the gray circle, activate it, then move the focus away from the circle.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if, after following the operator script, the three rectangles are green.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: script-handle-02-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <!-- Displayed Title --> + <text x="100" y="40" fill="black" font-size="24"> + Mouse event handlers test. + </text> + + <!-- The test defines a target and defines all the handlers for the target --> + <!-- There are legends for each handler that are modified after the handler--> + <!-- has been invoked --> + + <g id="targetGroup" transform="translate(60, 140)"> + <text x="-40" y="-50" font-size="32">Target</text> + <text x="60" y="7" font-size="24">Use the target to trigger events</text> + <!-- The target has all the event handlers defined --> + <!-- Use this <g> instead --> + <g id="target" onfocusin="onEvent(evt, 'onfocusin')" onfocusout="onEvent(evt, 'onfocusout')" onactivate="onEvent(evt, 'onactivate')"> + + <circle cx="0" cy="0" r="30" fill="#cccccc" stroke="black"/> + <line x1="-30" y1="0" x2="30" y2="0"/> + <line x1="0" y1="-30" x2="0" y2="30"/> + </g> + </g> + <!-- targetGroup --> + + <g id="labels"> + <g id="mouseEvents" transform="translate(65, 190)"> + <g id="mouseEventsLabels"> + <text x="10" y="20" font-size="32">onfocusin</text> + <text x="10" y="50" font-size="32">onfocusout</text> + <text x="10" y="80" font-size="32">onactivate</text> + </g> + <g id="mouseEventsTestIndicators"> + <!-- onfocusin --> + <rect x="-15" y="2" width="20" height="20" fill="green"/> + <rect id="onfocusin" x="-15" y="2" width="20" height="20" fill="red"/> + + <!-- onfocusout --> + <rect x="-15" y="32" width="20" height="20" fill="green"/> + <rect id="onfocusout" x="-15" y="32" width="20" height="20" fill="red"/> + + <!-- onactivate --> + <rect x="-15" y="62" width="20" height="20" fill="green"/> + <rect id="onactivate" x="-15" y="62" width="20" height="20" fill="red"/> + + </g> + </g> + <!-- Mouse Events --> + </g> + + <script type="text/ecmascript"><![CDATA[ + + function onEvent(evt, indicatorId){ + // Get Document + var target = evt.target; + var doc = target.ownerDocument; + + // Mark test as passed + var testPassed = doc.getElementById(indicatorId); + testPassed.setAttribute('visibility', 'hidden'); + } + ]]></script> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/script-handle-03-b-manual.svg b/testing/web-platform/tests/svg/import/script-handle-03-b-manual.svg new file mode 100644 index 000000000..f2280fc0c --- /dev/null +++ b/testing/web-platform/tests/svg/import/script-handle-03-b-manual.svg @@ -0,0 +1,120 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: script-handle-03-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/script.html#EventHandling"> + <p> + Tests basic mouse event handlers. + </p> + <p> + The test shows a target that can be used to generate the various + kinds of mouse events supported in SVG. Below the + target, the list of events is shown with red markers next to each. + </p> + <p> + If the test passes, all the markers should have turned to green + after the events have been triggered on the target. If any event + has not triggered, its marker will remain red. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Load the test. Click on the gray circle.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if, after clicking the gray circle, the three rectangles are green.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: script-handle-03-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <!-- Displayed Title --> + <text x="100" y="40" fill="black" font-size="24"> + Mouse event handlers test. + </text> + + <!-- The test defines a target and defines all the handlers for the target --> + <!-- There are legends for each handler that are modified after the handler--> + <!-- has been invoked --> + + <g id="targetGroup" transform="translate(60, 140)"> + <text x="-40" y="-50" font-size="32">Target</text> + <text x="60" y="7" font-size="24">Use the target to trigger events</text> + <!-- The target has all the event handlers defined --> + <!-- Use this <g> instead --> + <g id="target" onmousedown="onEvent(evt, 'onmousedown')" onmouseup="onEvent(evt, 'onmouseup')" onclick="onEvent(evt, 'onclick')"> + + <circle cx="0" cy="0" r="30" fill="#cccccc" stroke="black"/> + <line x1="-30" y1="0" x2="30" y2="0"/> + <line x1="0" y1="-30" x2="0" y2="30"/> + </g> + </g> + <!-- targetGroup --> + + <g id="labels"> + <g id="mouseEvents" transform="translate(65, 190)"> + <g id="mouseEventsLabels"> + <text x="10" y="20" font-size="32">onmousedown</text> + <text x="10" y="50" font-size="32">onmouseup</text> + <text x="10" y="80" font-size="32">onclick</text> + </g> + <g id="mouseEventsTestIndicators"> + <!-- onmousedown --> + <rect x="-15" y="2" width="20" height="20" fill="green"/> + <rect id="onmousedown" x="-15" y="2" width="20" height="20" fill="red"/> + + <!-- onmouseup --> + <rect x="-15" y="32" width="20" height="20" fill="green"/> + <rect id="onmouseup" x="-15" y="32" width="20" height="20" fill="red"/> + + <!-- onclick --> + <rect x="-15" y="62" width="20" height="20" fill="green"/> + <rect id="onclick" x="-15" y="62" width="20" height="20" fill="red"/> + + </g> + </g> + <!-- Mouse Events --> + </g> + + <script type="text/ecmascript"><![CDATA[ + + function onEvent(evt, indicatorId){ + // Get Document + var target = evt.target; + var doc = target.ownerDocument; + + // Mark test as passed + var testPassed = doc.getElementById(indicatorId); + testPassed.setAttribute('visibility', 'hidden'); + } + ]]></script> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/script-handle-04-b-manual.svg b/testing/web-platform/tests/svg/import/script-handle-04-b-manual.svg new file mode 100644 index 000000000..2859a4dc6 --- /dev/null +++ b/testing/web-platform/tests/svg/import/script-handle-04-b-manual.svg @@ -0,0 +1,120 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: script-handle-04-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/script.html#EventHandling"> + <p> + Tests basic mouse event handlers. + </p> + <p> + The test shows a target that can be used to generate the various + kinds of mouse events supported in SVG. Below the + target, the list of events is shown with red markers next to each. + </p> + <p> + If the test passes, all the markers should have turned to green + after the events have been triggered on the target. If any event + has not triggered, its marker will remain red. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Load the test. Move the pointing device over the gray circle, and then away from it.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if, after moving the mouse away from the gray circle, all three rectangles are green.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: script-handle-04-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <!-- Displayed Title --> + <text x="100" y="40" fill="black" font-size="24"> + Mouse event handlers test. + </text> + + <!-- The test defines a target and defines all the handlers for the target --> + <!-- There are legends for each handler that are modified after the handler--> + <!-- has been invoked --> + + <g id="targetGroup" transform="translate(60, 140)"> + <text x="-40" y="-50" font-size="32">Target</text> + <text x="60" y="7" font-size="24">Use the target to trigger events</text> + <!-- The target has all the event handlers defined --> + <!-- Use this <g> instead --> + <g id="target" onmouseover="onEvent(evt, 'onmouseover')" onmousemove="onEvent(evt, 'onmousemove')" onmouseout="onEvent(evt, 'onmouseout')"> + + <circle cx="0" cy="0" r="30" fill="#cccccc" stroke="black"/> + <line x1="-30" y1="0" x2="30" y2="0"/> + <line x1="0" y1="-30" x2="0" y2="30"/> + </g> + </g> + <!-- targetGroup --> + + <g id="labels"> + <g id="mouseEvents" transform="translate(65, 190)"> + <g id="mouseEventsLabels"> + <text x="10" y="20" font-size="32">onmouseover</text> + <text x="10" y="50" font-size="32">onmousemove</text> + <text x="10" y="80" font-size="32">onmouseout</text> + </g> + <g id="mouseEventsTestIndicators"> + <!-- onmouseover --> + <rect x="-15" y="2" width="20" height="20" fill="green"/> + <rect id="onmouseover" x="-15" y="2" width="20" height="20" fill="red"/> + + <!-- onmousemove --> + <rect x="-15" y="32" width="20" height="20" fill="green"/> + <rect id="onmousemove" x="-15" y="32" width="20" height="20" fill="red"/> + + <!-- onmouseout --> + <rect x="-15" y="62" width="20" height="20" fill="green"/> + <rect id="onmouseout" x="-15" y="62" width="20" height="20" fill="red"/> + + </g> + </g> + <!-- Mouse Events --> + </g> + + <script type="text/ecmascript"><![CDATA[ + + function onEvent(evt, indicatorId){ + // Get Document + var target = evt.target; + var doc = target.ownerDocument; + + // Mark test as passed + var testPassed = doc.getElementById(indicatorId); + testPassed.setAttribute('visibility', 'hidden'); + } + ]]></script> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/script-specify-01-f-manual.svg b/testing/web-platform/tests/svg/import/script-specify-01-f-manual.svg new file mode 100644 index 000000000..a4ea29671 --- /dev/null +++ b/testing/web-platform/tests/svg/import/script-specify-01-f-manual.svg @@ -0,0 +1,67 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" contentScriptType="application/noSuchLanguage" + onload="document.getElementById('testPassed').setAttribute('visibility', 'hidden'); + document.getElementById('testFailed').setAttribute('visibility', 'visible');"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="CL" status="reviewed" + version="$Revision: 1.6 $" testname="$RCSfile: script-specify-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/script.html#ScriptingLanguage"> + <p> + Tests the assertion that "The ‘contentScriptType’ attribute on the ‘svg’ element specifies the default scripting language" by setting it to an unknown value and checking the script is not executed. + The test uses an unknown (bogus) script language, which looks exactly like ECMAScript. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Load the test.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if string "Good, script didn't run" is displayed. + It fails if the string "No! This is not ECMAScript!" is displayed. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: script-specify-01-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- Displayed Title --> + <text x="140" y="20" fill="black"> + contentScriptType Test + </text> + + <!-- The onload handler would only be run if the user agent implemented the + bogus scripting language MIME type specified in contentScriptType="". --> + <g font-size="24" font-weight="bold" transform="translate(240,170)" text-anchor="middle"> + <text id="testPassed" fill="green">Good, script didn't run.</text> + <text id="testFailed" fill="red" visibility="hidden">No! This is not ECMAScript!</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> + diff --git a/testing/web-platform/tests/svg/import/script-specify-02-f-manual.svg b/testing/web-platform/tests/svg/import/script-specify-02-f-manual.svg new file mode 100644 index 000000000..f575b7345 --- /dev/null +++ b/testing/web-platform/tests/svg/import/script-specify-02-f-manual.svg @@ -0,0 +1,69 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="CL" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: script-specify-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/script.html#ScriptingLanguage"> + <p> + Tests the assertion that "It is also possible to specify the scripting language for each individual ‘script’ element by specifying a ‘type’ on the ‘script’ element." by setting it to an unknown value and checking the script is not executed. + The test uses an unknown (bogus) script language, which looks exactly like ECMAScript. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Load the test.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if string "Good, script didn't run" is displayed. + It fails if the string "No! This is not ECMAScript!" is displayed. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: script-specify-02-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- Displayed Title --> + <text x="240" y="20" fill="black" text-anchor="middle"> + Test unknown type attribute value on script element + </text> + + <g font-size="24" font-weight="bold" transform="translate(240,170)" text-anchor="middle"> + <text id="testPassed" fill="green">Good, script didn't run.</text> + <text id="testFailed" fill="red" visibility="hidden">No! This is not ECMAScript!</text> + </g> + + <!-- The script should be run only if the user agent implemented the bogus language. --> + <script type="application/noSuchLanguage"><![CDATA[ + document.getElementById('testPassed').setAttribute('visibility', 'hidden'); + document.getElementById('testFailed').setAttribute('visibility', 'visible'); + ]]></script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> + diff --git a/testing/web-platform/tests/svg/import/shapes-circle-01-t-manual.svg b/testing/web-platform/tests/svg/import/shapes-circle-01-t-manual.svg new file mode 100644 index 000000000..9d8aa46bc --- /dev/null +++ b/testing/web-platform/tests/svg/import/shapes-circle-01-t-manual.svg @@ -0,0 +1,58 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Lofton Henderson" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: shapes-circle-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/shapes.html#CircleElement"> + <p> +Tests the circle element + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> +Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Six circles are displayed, with position, size, fill and stroke matching the reference image + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: shapes-circle-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <circle cx="100" cy="100" r="50" fill="none" stroke="black"/> + <circle cx="220" cy="100" r="35" fill="green" stroke="black"/> + <circle cx="340" cy="100" r="20" fill="black" stroke="lime" stroke-width="4"/> + <circle cx="100" cy="260" r="20" stroke="lime" fill="yellow" stroke-width="4"/> + <circle cx="220" cy="260" r="35" stroke="none" fill="blue"/> + <circle cx="340" cy="260" r="50" stroke="green" fill="none" stroke-width="10"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/shapes-circle-02-t-manual.svg b/testing/web-platform/tests/svg/import/shapes-circle-02-t-manual.svg new file mode 100644 index 000000000..f058462f8 --- /dev/null +++ b/testing/web-platform/tests/svg/import/shapes-circle-02-t-manual.svg @@ -0,0 +1,68 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="DJ" author="CN" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: shapes-circle-02-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/shapes.html#CircleElement"> + <p> + Default attributes test with circle. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if a group of four circles is displayed, arranged as shown in the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: shapes-circle-02-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g fill="green" stroke="#000000"> + <!-- Set cx and cy coordinate to default.--> + <circle r="50"/> + + <!-- Set cx coordinate to default.--> + <circle cy="100" r="50"/> + + <!-- Set cy coordinate to default.--> + <circle cx="100" r="50"/> + + <!-- Set r attribute to 0 (should not display a circle).--> + <circle cx="100" cy="100" r="0"/> + + <!-- Set all values to draw a circle --> + <circle cx="100" cy="100" r="50"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/shapes-ellipse-01-t-manual.svg b/testing/web-platform/tests/svg/import/shapes-ellipse-01-t-manual.svg new file mode 100644 index 000000000..9466f0653 --- /dev/null +++ b/testing/web-platform/tests/svg/import/shapes-ellipse-01-t-manual.svg @@ -0,0 +1,71 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Kelvin R" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: shapes-ellipse-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/shapes.html#EllipseElement"> + <p> + Test the ellipse element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> +Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Seven ellipses are displayed, with position, size, fill and stroke matching the reference image + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: shapes-ellipse-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ====================================================================== --> + <!-- First pair of ellipses. --> + <!-- ====================================================================== --> + <ellipse id="ellipse-01" fill="none" stroke="#000000" cx="50" cy="75" rx="30" ry="50"/> + <ellipse id="ellipse-02" fill="green" cx="160" cy="75" rx="30" ry="50"/> + <!-- ====================================================================== --> + <!-- Second pair of ellipses, should actually draw circles. --> + <!-- ====================================================================== --> + <ellipse id="ellipse-03" fill="none" stroke="#000000" cx="270" cy="80" rx="35" ry="35"/> + <ellipse id="ellipse-04" fill="green" cx="370" cy="80" rx="35" ry="35"/> + <!-- ====================================================================== --> + <!-- Third pair of ellipses. --> + <!-- ====================================================================== --> + <ellipse id="ellipse-05" fill="none" stroke="#0000FF" stroke-width="8" cx="50" cy="220" rx="30" ry="50"/> + <ellipse id="ellipse-06" fill="#00FF00" stroke="#0000FF" stroke-width="8" cx="160" cy="220" rx="30" ry="50"/> + <!-- ====================================================================== --> + <!-- Fourth pair of ellipses. --> + <!-- ====================================================================== --> + <ellipse id="ellipse-07" fill="#00FF00" stroke="#0000FF" stroke-width="8" cx="330" cy="220" rx="70" ry="40"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/shapes-ellipse-02-t-manual.svg b/testing/web-platform/tests/svg/import/shapes-ellipse-02-t-manual.svg new file mode 100644 index 000000000..dff0bf03d --- /dev/null +++ b/testing/web-platform/tests/svg/import/shapes-ellipse-02-t-manual.svg @@ -0,0 +1,62 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="DJ" author="CN" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: shapes-ellipse-02-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/shapes.html#EllipseElement"> + <p> + Defaults test with ellipse. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if one blue ellipse is shown completely within the test slide, + and a quarter ellipse is shown in the top-left corner of the test slide.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: shapes-ellipse-02-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g fill="blue" stroke="#000000"> + <!-- Set cx and cy coordinate to default.--> + <ellipse rx="100" ry="50"/> + + <!-- Set rx attribute to 0.--> + <ellipse cx="100" cy="150" rx="0" ry="50"/> + + <!-- Set ry attribute to 0.--> + <ellipse cx="200" cy="50" rx="100" ry="0"/> + + <!-- Set all values attribute to drawn an ellipse.--> + <ellipse cx="250" cy="250" rx="100" ry="50"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/shapes-ellipse-03-f-manual.svg b/testing/web-platform/tests/svg/import/shapes-ellipse-03-f-manual.svg new file mode 100644 index 000000000..21e7aec34 --- /dev/null +++ b/testing/web-platform/tests/svg/import/shapes-ellipse-03-f-manual.svg @@ -0,0 +1,72 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="Microsoft" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: shapes-ellipse-03-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/shapes.html#EllipseElement"> + <p> + The 'ellipse' element defines an ellipse which is axis-aligned with the current user coordinate system when it is not the initial user coordinate system. + </p> + <p> + The test shows an 'ellipse' element originating at (0,0) of the current user coordinate system, which has been altered via 'transform' from + the initial user coordinate system. Two perpendicular lines which also originate at (0,0) and advance along the x and y axes of + the current user coordinate system are shown. These lines overlap the top and left edges of the ellipse and verifies that the ellipse is + thus axis-aligned with its current user coordinate system. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if both ellipses are divided into four equal parts by two sets of crossing lines, and the rightmost ellipse and crossing lines are rotated together. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: shapes-ellipse-03-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <g transform="translate(150,150)"> + <line x1="0" y1="-100" x2="0" y2="100" stroke="black" /> + <line x1="-100" y1="0" x2="100" y2="0" stroke="black" /> + <ellipse cx="0" cy="0" rx="80" ry="50" fill="none" stroke="black" /> + </g> + + <g transform="translate(350,150) rotate(-30)"> + <line x1="0" y1="-100" x2="0" y2="100" stroke="black" /> + <line x1="-100" y1="0" x2="100" y2="0" stroke="black" /> + <ellipse cx="0" cy="0" rx="80" ry="50" fill="none" stroke="black" /> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> --> +</svg> diff --git a/testing/web-platform/tests/svg/import/shapes-grammar-01-f-manual.svg b/testing/web-platform/tests/svg/import/shapes-grammar-01-f-manual.svg new file mode 100644 index 000000000..50183a9e7 --- /dev/null +++ b/testing/web-platform/tests/svg/import/shapes-grammar-01-f-manual.svg @@ -0,0 +1,71 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CL" status="accepted" + version="$Revision: 1.2 $" testname="$RCSfile: shapes-grammar-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/shapes.html#PointsBNF"> + <p> +Check that negative second coordinate in a coordinate pair does not need separating wsp-comma. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> +The test is passed if each shape seems to have a double stroke, dark green and light green. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: shapes-grammar-01-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <g transform="translate(0,400)"> + <g stroke="#070" stroke-width="8"> + <polyline fill="#396" + points="270,-225 300,-245 320,-225 340,-245 280,-280 + 390,-280 420,-240 280,-185"/> + <polygon fill="#5F9" + points="179,-185,218,-203,228,-245,202,-279,159,-280,131,-247,139,-205"/> + </g> + <g stroke="#3C6" stroke-width="3" fill="none"> + <polyline + points="270-225 300-245 320-225 340-245 280-280 + 390-280 420-240 280-185"/> + <polygon + points="179-185,218-203,228-245,202-279,159-280,131-247,139-205"/> + </g> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/shapes-intro-01-t-manual.svg b/testing/web-platform/tests/svg/import/shapes-intro-01-t-manual.svg new file mode 100644 index 000000000..0060bf71f --- /dev/null +++ b/testing/web-platform/tests/svg/import/shapes-intro-01-t-manual.svg @@ -0,0 +1,108 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="SH" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: shapes-intro-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/shapes.html#Introduction"> + <p> + Tests the degenerate cases of the basic shapes. The shapes are positioned + within the black rectangles. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if the 11 rectangles are empty.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: shapes-intro-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ====================================================================== --> + <!-- Draw the boxes to contain the shapes and the text labels for the boxes --> + <!-- ====================================================================== --> + <g fill="none" stroke="#000000"> + <!-- rects --> + <rect x="50" y="50" width="35" height="60"/> + <rect x="50" y="155" width="35" height="60"/> + <rect x="130" y="50" width="35" height="60"/> + <rect x="130" y="155" width="35" height="60"/> + + <!-- circles --> + <rect x="210" y="50" width="60" height="60"/> + <rect x="210" y="155" width="60" height="60"/> + + <!-- ellipses --> + <rect x="315" y="50" width="35" height="60"/> + <rect x="315" y="155" width="35" height="60"/> + <rect x="394" y="50" width="35" height="60"/> + <rect x="394" y="155" width="35" height="60"/> + + <!-- line --> + <rect x="235" y="260" width="10" height="10"/> + </g> + + <g font-family="Arial" font-size="8"> + <text x="5" y="90">Stroked</text> + <text x="5" y="195">Unstroked</text> + <text x="50" y="135">Zero width rect</text> + <text x="130" y="135">Zero height rect</text> + <text x="210" y="135">Zero radius circle</text> + <text x="315" y="135">Zero x radius ellipse</text> + <text x="394" y="135">Zero y radius ellipse</text> + <text x="235" y="290">Zero length line</text> + </g> + <!-- ====================================================================== --> + <!-- Draw 4 rectangles, two with zero width, two with zero height --> + <!-- (stroked and unstroked) --> + <!-- ====================================================================== --> + <rect id="Zero-width-stroked-rect" fill="none" stroke="#000000" x="55" y="55" width="0" height="50"/> + <rect id="Zero-width-unstroked-rect" fill="#FF0000" stroke="none" x="55" y="160" width="0" height="50"/> + <rect id="Zero-height-stroked-rect" fill="#00FF00" stroke="#0000FF" x="135" y="55" width="25" height="0"/> + <rect id="Zero-height-rect" fill="#00FF00" stroke="none" x="135" y="160" width="25" height="0"/> + <!-- ====================================================================== --> + <!-- Draw two zero radius circles (stroked and unstroked) --> + <!-- ====================================================================== --> + <circle id="Zero-radius-stroked-circle" fill="none" stroke="#000000" cx="240" cy="80" r="0"/> + <circle id="Zero-radius-unstroked-circle" fill="#FF0000" stroke="none" cx="240" cy="185" r="0"/> + <!-- ====================================================================== --> + <!-- Draw 4 ellipses, two with a zero x radius, two with a zero y radius --> + <!-- (stroked and unstroked) --> + <!-- ====================================================================== --> + <ellipse id="Zero-x-radius-stroked-ellipse" fill="#00FF00" stroke="#0000FF" cx="332" cy="80" rx="0" ry="25"/> + <ellipse id="Zero-x-radius-unstroked-ellipse" fill="#00FF00" stroke="none" cx="332" cy="185" rx="0" ry="25"/> + <ellipse id="Zero-y-radius-stroked-ellipse" fill="none" stroke="#000000" cx="411" cy="80" rx="12" ry="0"/> + <ellipse id="Zero-y-radius-unstroked-ellipse" fill="#FF0000" stroke="none" cx="411" cy="185" rx="12" ry="0"/> + <!-- ====================================================================== --> + <!-- Draw a zero-length line --> + <!-- ====================================================================== --> + <line id="Zero-length-line" stroke="#0000FF" x1="240" y1="265" x2="240" y2="265"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/shapes-intro-02-f-manual.svg b/testing/web-platform/tests/svg/import/shapes-intro-02-f-manual.svg new file mode 100644 index 000000000..668ced413 --- /dev/null +++ b/testing/web-platform/tests/svg/import/shapes-intro-02-f-manual.svg @@ -0,0 +1,89 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="Microsoft" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: shapes-intro-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/shapes.html#Introduction"> + <p> + Test that basic shape elements are equivalent to a 'path' element that constructs the same shape. + </p> + <p> + For each basic shape, a 'path' reference element that is red is created. + A basic shape is then placed on top of the 'path' element. + For each basic shape there's also a reverse test that uses the shape as a reference for the 'path' element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: shapes-intro-02-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <path d="M35 25 L115 25 A 10 20 0 0 1 125 45 L 125 105 A 10 20 0 0 1 115 125 L 35 125 A 10 20 0 0 1 25 105 L 25 45 A 10 20 0 0 1 35 25" fill="red" /> + <rect x="25" y="25" rx="10" ry="20" width="100" height="100" fill="black" /> + <rect x="130" y="25" rx="10" ry="20" width="100" height="100" fill="red" /> + <path d="M140 25 L220 25 A 10 20 0 0 1 230 45 L 230 105 A 10 20 0 0 1 220 125 L 140 125 A 10 20 0 0 1 130 105 L 130 45 A 10 20 0 0 1 140 25" fill="black" /> + + <path d="M300 125 A50 50 0 1 0 299.9999 125" fill="red" /> + <circle cx="300" cy="75" r="50" fill="black" /> + <circle cx="401" cy="75" r="50" fill="red" /> + <path d="M401 125 A50 50 0 1 0 400.9999 125" fill="black" /> + + <path d="M60 305 A50 80 0 1 0 59.9999 305 Z" fill="red" /> + <ellipse cx="60" cy="225" rx="50" ry="80" fill="black" /> + <ellipse cx="161" cy="225" rx="50" ry="80" fill="red" /> + <path d="M161 305 A50 80 0 1 0 160.9999 305 Z" fill="black" /> + + <path d="M220 150 L270 200 L220 250 Z" fill="red" /> + <polygon points="220,150 270,200 220,250" fill="black" /> + <polygon points="270,150 320,200 270,250" fill="red" /> + <path d="M270 150 L320 200 L270 250 Z" fill="black" /> + + <path d="M350 250 L350 350 L400 350 L400 250 L450 250 L450 350" fill="none" stroke="red" stroke-width="10" /> + <polyline fill="none" stroke="black" stroke-width="10" points="350,250 350,350 400,350 400,250 450,250 450,350" /> + <polyline fill="none" stroke="red" stroke-width="10" points="350,135 350,235 400,235 400,135 450,135 450,235" /> + <path d="M350 135 L350 235 L400 235 L400 135 L450 135 L450 235" fill="none" stroke="black" stroke-width="10" /> + + <path d="M225 275 L325 275" stroke-width="10" stroke="red" /> + <line x1="225" y1="275" x2="325" y2="275" stroke-width="10" stroke="black" /> + <line x1="225" y1="325" x2="325" y2="325" stroke-width="10" stroke="red" /> + <path d="M225 325 L325 325" stroke-width="10" stroke="black" /> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> --> +</svg> diff --git a/testing/web-platform/tests/svg/import/shapes-line-01-t-manual.svg b/testing/web-platform/tests/svg/import/shapes-line-01-t-manual.svg new file mode 100644 index 000000000..ad6338be3 --- /dev/null +++ b/testing/web-platform/tests/svg/import/shapes-line-01-t-manual.svg @@ -0,0 +1,80 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Lofton Henderson" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: shapes-line-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/shapes.html#LineElement"> + <p> +Tests the line element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> +Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> +The test is passed if five diagonal lines are displayed on the top row. On the bottom row, a square wave pattern is displayed. The position, size, fill and stroke of the lines matches the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: shapes-line-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g id="diagonal-line-set"> + <line x1="37.5" y1="137" x2="112.5" y2="50" fill="none" stroke="black" stroke-width="1"/> + <line x1="112.5" y1="137" x2="187.5" y2="50" fill="none" stroke="yellow" stroke-width="5"/> + <line x1="187.5" y1="137" x2="262.5" y2="50" fill="none" stroke="green" stroke-width="7.5"/> + <line x1="262.5" y1="137" x2="337.5" y2="50" fill="none" stroke="blue" stroke-width="10"/> + <line x1="337.5" y1="137" x2="412.5" y2="50" fill="none" stroke="fuchsia" stroke-width="12.5"/> + </g> + <g id="middle-figure" stroke="black" stroke-width="1"> + <line x1="170" y1="200" x2="220" y2="200"/> + <line x1="220" y1="200" x2="220" y2="250"/> + <line x1="220" y1="250" x2="270" y2="250"/> + <line x1="270" y1="250" x2="270" y2="200"/> + <line x1="270" y1="200" x2="320" y2="200"/> + </g> + <g id="lower-left-figure" stroke="blue" stroke-width="10"> + <line x1="25" y1="200" x2="75" y2="200"/> + <line x1="75" y1="200" x2="75" y2="250"/> + <line x1="75" y1="250" x2="125" y2="250"/> + <line x1="125" y1="250" x2="125" y2="200"/> + <line x1="125" y1="200" x2="175" y2="200"/> + </g> + <g id="lower-right-figure" stroke-width="10"> + <line x1="370" y1="250" x2="420" y2="250" stroke="black"/> + <line x1="420" y1="200" x2="470" y2="200" stroke="fuchsia"/> + <line x1="320" y1="200" x2="370" y2="200" stroke="blue"/> + <line x1="370" y1="200" x2="370" y2="250" stroke="green"/> + <line x1="420" y1="250" x2="420" y2="200" stroke="orange"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/shapes-line-02-f-manual.svg b/testing/web-platform/tests/svg/import/shapes-line-02-f-manual.svg new file mode 100644 index 000000000..f6f2bbec5 --- /dev/null +++ b/testing/web-platform/tests/svg/import/shapes-line-02-f-manual.svg @@ -0,0 +1,57 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: shapes-line-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/shapes.html#LineElement"> + <p> + The 'fill' attribute has no effect on the 'line' element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: shapes-line-02-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <line x1="100" y1="100" x2="300" y2="100" stroke-width="10" stroke="black" fill="red" /> + <line x1="100" y1="100" x2="300" y2="100" stroke-width="10" stroke="black" fill="red" transform="rotate(15)"/> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg>
\ No newline at end of file diff --git a/testing/web-platform/tests/svg/import/shapes-polygon-01-t-manual.svg b/testing/web-platform/tests/svg/import/shapes-polygon-01-t-manual.svg new file mode 100644 index 000000000..9d4e76e31 --- /dev/null +++ b/testing/web-platform/tests/svg/import/shapes-polygon-01-t-manual.svg @@ -0,0 +1,76 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Kelvin R" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: shapes-polygon-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/shapes.html#PolygonElement"> + <p> + This test draws six different polygons excercising portions of the path attribute. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The six polygons drawn should match the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: shapes-polygon-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- Test case label. --> + <!-- ====================================================================== --> + <!-- First two polygons, convex and "regular". --> + <!-- ====================================================================== --> + <!-- Open, convex, "regular". --> + <polygon id="polygon-01" fill="none" stroke="#000000" points="59,45,95,63,108,105,82,139,39,140,11,107,19,65"/> + <!-- Closed, convex, "regular". --> + <polygon id="polygon-02" fill="blue" points="179,45,218,63,228,105,202,139,159,140,131,107,139,65,179,45"/> + <!-- ====================================================================== --> + <!-- Third polygon, concave and irregular. --> + <!-- ====================================================================== --> + <!-- Closed, convex, "irregular". --> + <polygon id="polygon-03" fill="blue" stroke="black" stroke-width="6" points="350,45 375,80 410,95 375,110 350,145 325,120 290,95 325,70,350,45"/> + <!-- ====================================================================== --> + <!-- Fourth and fifth polygons. --> + <!-- ====================================================================== --> + <!-- Closed, convex, "regular". --> + <polygon id="polygon-05" fill="none" stroke="#0000FF" stroke-width="8" points="59,185,98,203,108,245,82,279,39,280,11,247,19,205,59,185"/> + <!-- Open, convex, "regular". --> + <polygon id="polygon-06" fill="#00FF00" stroke="#0000FF" stroke-width="8" points="179,185,218,203,228,245,202,279,159,280,131,247,139,205"/> + <!-- ====================================================================== --> + <!-- Sixth polygons, irregular with both concave and convex angles. --> + <!-- ====================================================================== --> + <polygon id="polygon-07" fill="none" stroke="#00FF00" stroke-width="8" points="270,225 300,245 320,225 340,245 280,280 390,280 420,240 280,185"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/shapes-polygon-02-t-manual.svg b/testing/web-platform/tests/svg/import/shapes-polygon-02-t-manual.svg new file mode 100644 index 000000000..d0e4e7ad8 --- /dev/null +++ b/testing/web-platform/tests/svg/import/shapes-polygon-02-t-manual.svg @@ -0,0 +1,81 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AG" author="CL" status="accepted" + version="$Revision: 1.2 $" testname="$RCSfile: shapes-polygon-02-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/shapes.html#PolygonElement"> + <p> +Checks that polygons and the equivalent paths are indeed equivalent. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> +The test is passed if each shape seems to have a double stroke, dark green and light green. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: shapes-polygon-02-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <g stroke="#070" stroke-width="8"> + <polygon id="polygon-01" fill="none" + points="59,45,95,63,108,105,82,139,39,140,11,107,19,65"/> + <polygon id="polygon-02" fill="#592" + points="179,45,218,63,228,105,202,139,159,140,131,107,139,65,179,45"/> + <polygon id="polygon-03" fill="#3D8" + points="350,45 375,80 410,95 375,110 350,145 325,120 290,95 325,70,350,45"/> + <polygon id="polygon-05" fill="none" + points="59,185,98,203,108,245,82,279,39,280,11,247,19,205,59,185"/> + <polygon id="polygon-06" fill="#5F9" + points="179,185,218,203,228,245,202,279,159,280,131,247,139,205"/> + <polygon id="polygon-07" fill="none" + points="270,225 300,245 320,225 340,245 280,280 + 390,280 420,240 280,185"/> + </g> + <!-- now the equivalent paths--> + <g stroke="#3C6" stroke-width="3" fill="none"> + <path d="M59,45 L95,63,108,105,82,139,39,140,11,107,19,65z"/> + <path d="M179,45 L218,63,228,105,202,139,159,140,131,107,139,65,179,45z"/> + <path d="M350,45 L375,80 410,95 375,110 350,145 325,120 290,95 325,70,350,45z"/> + <path d="M59,185 L98,203,108,245,82,279,39,280,11,247,19,205,59,185z"/> + <path d="M179,185 L218,203,228,245,202,279,159,280,131,247,139,205z"/> + <path d="M270,225 L300,245 320,225 340,245 280,280 + 390,280 420,240 280,185z"/> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> +<!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +--> +</svg> diff --git a/testing/web-platform/tests/svg/import/shapes-polygon-03-t-manual.svg b/testing/web-platform/tests/svg/import/shapes-polygon-03-t-manual.svg new file mode 100644 index 000000000..76c1e4038 --- /dev/null +++ b/testing/web-platform/tests/svg/import/shapes-polygon-03-t-manual.svg @@ -0,0 +1,58 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="ED" author="Microsoft" status="accepted" version="$Revision: 1.1 $" testname="$RCSfile: shapes-polygon-03-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/shapes.html#PolygonElement"> + <p> + Test that 'polyline' and 'polygon' elements with an odd number of coordinates render up to the invalid coordinate. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if four green triangles are visible on the page, and no red. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: shapes-polygon-03-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <polyline fill="red" points="80,200 80,300 150,250 80,200 250" /> + <polyline fill="lime" points="80,200 80,300 150,250 80,200" /> + <polyline fill="red" points="180,200 180,300 250,250 180,200" /> + <polyline fill="lime" points="180,200 180,300 250,250 180,200 250" /> + <polygon fill="red" points="80,60 80,160 150,110 80" /> + <polygon fill="lime" points="80,60 80,160 150,110" /> + <polygon fill="red" points="180,60 180,160 250,110" /> + <polygon fill="lime" points="180,60 180,160 250,110 180" /> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.1 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/shapes-polyline-01-t-manual.svg b/testing/web-platform/tests/svg/import/shapes-polyline-01-t-manual.svg new file mode 100644 index 000000000..952f1e513 --- /dev/null +++ b/testing/web-platform/tests/svg/import/shapes-polyline-01-t-manual.svg @@ -0,0 +1,82 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author=" Lofton" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: shapes-polyline-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/shapes.html#PolylineElement"> + <p> +Tests the polyline element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> +Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if polylines are displayed whose position, size, fill and stroke matches the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: shapes-polyline-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- Test case label. --> + <!-- ====================================================================== --> + <!-- First two polylines. --> + <!-- ====================================================================== --> + <!-- Open sawtooth line. --> + <polyline id="polyline-01" fill="none" stroke="#000000" points="10,50,35,150,60,50,85,150,110,50,135,150"/> + <!-- text font-family="Arial" font-size="12" x="52" y="40">stroked</text--> + <!-- Closed pentagon shaped polyline (5 segments). --> + <polyline id="polyline-02" fill="none" stroke="blue" stroke-width="8" points="220,50,267,84,249,140,190,140,172,84,220,50"/> + <!--text font-family="Arial" font-size="12" x="202" y="40">stroked</text--> + <!-- ====================================================================== --> + <!-- Third polyline. --> + <!-- ====================================================================== --> + <!-- The sawtooth again, polylines can be filled. --> + <polyline id="polyline-03" fill="blue" stroke="#00FF00" stroke-width="4" points="310,50,335,150,360,50,385,150,410,50,435,150"/> + <!--text font-family="Arial" font-size="12" x="340" y="40">filled & stroked</text--> + <!-- ====================================================================== --> + <!-- Fourth and fifth polylines. --> + <!-- ====================================================================== --> + <!-- An unclosed "septagon" shaped polyline (7th segment omitted). --> + <polyline id="polyline-04" fill="none" stroke="green" stroke-width="8" points="59,185,98,203,108,245,82,279,39,280,11,247,19,205"/> + <!--text font-family="Arial" font-size="12" x="36" y="175">stroked</text--> + <!-- Same shape, filled, shows difference with 'polygon'. --> + <polyline id="polyline-05" fill="#00FF00" stroke="#0000FF" stroke-width="8" points="189,185,228,203,238,245,212,279,169,280,141,247,149,205"/> + <!--text font-family="Arial" font-size="12" x="148" y="175">filled & stroked</text--> + <!-- ====================================================================== --> + <!-- Sixth polylines, irregular with both concave and convex angles. --> + <!-- ====================================================================== --> + <polyline id="polyline-06" fill="#FF00FF" stroke="none" stroke-width="8" points="270,225 300,245 320,225 340,245 280,280 390,280 420,240 280,185"/> + <!--text font-family="Arial" font-size="12" x="330" y="175">filled</text--> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/shapes-polyline-02-t-manual.svg b/testing/web-platform/tests/svg/import/shapes-polyline-02-t-manual.svg new file mode 100644 index 000000000..7cc146ee7 --- /dev/null +++ b/testing/web-platform/tests/svg/import/shapes-polyline-02-t-manual.svg @@ -0,0 +1,81 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AG" author=" CL" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: shapes-polyline-02-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/shapes.html#PolylineElement"> + <p> +Checks that polylines and the equivalent paths are indeed equivalent. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> +The test is passed if each shape seems to have a double stroke, dark green and light green. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: shapes-polyline-02-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <g stroke="#070" stroke-width="8"> + <!-- Open sawtooth line. --> + <polyline id="polyline-01" fill="none" points="10,50,35,150,60,50,85,150,110,50,135,150"/> + <!-- Closed pentagon shaped polyline (5 segments). --> + <polyline id="polyline-02" fill="none" points="220,50,267,84,249,140,190,140,172,84,220,50"/> + <!-- The sawtooth again, polylines can be filled. --> + <polyline id="polyline-03" fill="#396" points="310,50,335,150,360,50,385,150,410,50,435,150"/> + <!-- An unclosed "septagon" shaped polyline (7th segment omitted). --> + <polyline id="polyline-04" fill="none" points="59,185,98,203,108,245,82,279,39,280,11,247,19,205"/> + <!-- Same shape, filled, shows difference with 'polygon'. --> + <polyline id="polyline-05" fill="#396" points="189,185,228,203,238,245,212,279,169,280,141,247,149,205"/> + <polyline id="polyline-06" fill="#396" + points="270,225 300,245 320,225 340,245 280,280 + 390,280 420,240 280,185"/> + </g> + + <!-- now the equivalent paths--> + <g stroke="#3C6" stroke-width="3" fill="none"> + <path d="M10,50 L35,150,60,50,85,150,110,50,135,150"/> + <path d="M220,50 L267,84,249,140,190,140,172,84,220,50"/> + <path d="M310,50 L335,150,360,50,385,150,410,50,435,150"/> + <path d="M59,185 L98,203,108,245,82,279,39,280,11,247,19,205"/> + <path d="M189,185 L228,203,238,245,212,279,169,280,141,247,149,205"/> + <path d="M270,225 L300,245 320,225 340,245 280,280 + 390,280 420,240 280,185"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> +<!-- +<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +--> +</svg> diff --git a/testing/web-platform/tests/svg/import/shapes-rect-01-t-manual.svg b/testing/web-platform/tests/svg/import/shapes-rect-01-t-manual.svg new file mode 100644 index 000000000..219a4764f --- /dev/null +++ b/testing/web-platform/tests/svg/import/shapes-rect-01-t-manual.svg @@ -0,0 +1,73 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Kelvin R" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: shapes-rect-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/shapes.html#RectElement"> + <p> + This is a simple test of the rect element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test passes if all four sets of two rectangles are drawn and + they match the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: shapes-rect-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- ====================================================================== --> + <!-- First of all draw two simple rectangles. One stroked , one filled. --> + <!-- ====================================================================== --> + <rect id="Simple-rect-no-fill" fill="none" stroke="#000000" x="30" y="46" width="50" height="80"/> + <rect id="Simple-rect-filled" fill="fuchsia" x="130" y="46" width="50" height="80"/> + <!-- ====================================================================== --> + <!-- Second set of rectangles this time with rounded corners. --> + <!-- ====================================================================== --> + <rect id="Simple-round-rect-no-fill" fill="none" stroke="#000000" x="250" y="46" width="50" height="80" rx="30"/> + <rect id="Simple-round-rect-filled" fill="fuchsia" x="350" y="46" width="50" height="80" rx="30"/> + <!-- ====================================================================== --> + <!-- Third set of rectangles. --> + <!-- ====================================================================== --> + <rect id="rect-03" fill="none" stroke="#0000FF" stroke-width="8" x="30" y="196" width="50" height="80"/> + <rect id="rect-04" fill="#00FF00" stroke="#0000FF" stroke-width="8" x="130" y="196" width="50" height="80"/> + <!-- ====================================================================== --> + <!-- Fourth set of rectangles. --> + <!-- ====================================================================== --> + <rect id="rect-05" fill="none" stroke="#0000FF" stroke-width="8" x="250" y="196" width="50" height="80" rx="30" ry="50"/> + <rect id="rect-06" fill="#00FF00" x="350" y="196" width="50" height="80" rx="30" ry="50"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/shapes-rect-02-t-manual.svg b/testing/web-platform/tests/svg/import/shapes-rect-02-t-manual.svg new file mode 100644 index 000000000..6c487d5f2 --- /dev/null +++ b/testing/web-platform/tests/svg/import/shapes-rect-02-t-manual.svg @@ -0,0 +1,71 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="DJ" author="CN" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: shapes-rect-02-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/shapes.html#RectElement"> + <p> + Test x, y, width, height, rx and ry default/lacuna values on a rect element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + There should be four green rectangles visible, two of them should have rounded corners. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: shapes-rect-02-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g fill="green" stroke="#000000"> + <!-- Set x coordinate to default. --> + <rect y="46" width="50" height="80"/> + + <!-- Set y coordinate to default. --> + <rect x="130" width="50" height="80"/> + + <!-- Set width to default. --> + <rect x="250" y="46" height="80" width="0"/> + + <!-- Set height to default. --> + <rect x="350" y="46" height="0" width="50"/> + + <!-- Set rx to default. --> + <rect x="30" y="196" width="50" height="80" ry="20"/> + + <!-- Set ry to default. --> + <rect x="130" y="196" width="50" height="80" rx="20"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/shapes-rect-03-t-manual.svg b/testing/web-platform/tests/svg/import/shapes-rect-03-t-manual.svg new file mode 100644 index 000000000..4e51412cc --- /dev/null +++ b/testing/web-platform/tests/svg/import/shapes-rect-03-t-manual.svg @@ -0,0 +1,139 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="ED" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: shapes-rect-03-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/shapes.html#RectElement"> + <p> + Tests rx and ry clamping and aliasing. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if: + </p> + <ul> + <li>There is no red visible</li> + <li>There is no green outside the black borders of each rectangle</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: shapes-rect-03-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <g transform="translate(0, 30)"> + <g fill="red"> + <g id="references"> + <rect x="100" width="20" height="100" rx="50" ry="20"/> + <rect x="130" width="20" height="100" rx="10" ry="20"/> + <rect x="160" width="20" height="100" rx="10" ry="20"/> + + <rect x="190" width="20" height="100" rx="10" ry="50"/> + <rect x="220" width="20" height="100" rx="10" ry="20"/> + <rect x="250" width="20" height="100" rx="10" ry="10"/> + + <rect x="280" width="20" height="100" rx="5" ry="5"/> + <rect x="310" width="20" height="100" rx="0" ry="0"/> + <rect x="340" width="20" height="100" rx="0" ry="0"/> + + <g transform="translate(45,0)"> + <rect x="10" y="120" width="100" height="20" rx="50" ry="10"/> + <rect x="10" y="150" width="100" height="20" rx="15" ry="10"/> + <rect x="10" y="180" width="100" height="20" rx="10" ry="10"/> + + <rect x="130" y="120" width="100" height="20" rx="50" ry="10"/> + <rect x="130" y="150" width="100" height="20" rx="20" ry="10"/> + <rect x="130" y="180" width="100" height="20" rx="10" ry="10"/> + + <rect x="250" y="120" width="100" height="20" rx="5" ry="5"/> + <rect x="250" y="150" width="100" height="20" rx="0" ry="0"/> + <rect x="250" y="180" width="100" height="20" rx="0" ry="0"/> + </g> + + <g transform="translate(100,100)"> + <rect x="10" y="120" width="50" height="20" rx="25" ry="10"/> + <rect x="80" y="120" width="20" height="50" rx="10" ry="25"/> + + <rect x="120" y="120" width="50" height="20" rx="25" ry="10"/> + + <rect stroke-width="0.5" width="20" height="30" rx="10" ry="15" transform="translate(-10 -15) scale(2) translate(10 15) translate(85 52.5)"/> + <rect x="230" y="120" width="20" height="30" rx="10" ry="25"/> + </g> + </g> + </g> + <g id="tests" fill="lime"> + <rect x="100" width="20" height="100" rx="50" ry="20"/> + <rect x="130" width="20" height="100" rx="15" ry="20"/> + <rect x="160" width="20" height="100" rx="10" ry="20"/> + + <rect x="190" width="20" height="100" rx="80"/> + <rect x="220" width="20" height="100" rx="20"/> + <rect x="250" width="20" height="100" rx="10"/> + + <rect x="280" width="20" height="100" rx="5"/> + <rect x="310" width="20" height="100" rx="0"/> + <rect x="340" width="20" height="100" rx="0" ry="0"/> + + <g transform="translate(45,0)"> + <rect x="10" y="120" width="100" height="20" rx="50" ry="20"/> + <rect x="10" y="150" width="100" height="20" rx="15" ry="20"/> + <rect x="10" y="180" width="100" height="20" rx="10" ry="20"/> + + <rect x="130" y="120" width="100" height="20" ry="50"/> + <rect x="130" y="150" width="100" height="20" ry="20"/> + <rect x="130" y="180" width="100" height="20" ry="10"/> + + <rect x="250" y="120" width="100" height="20" ry="5"/> + <rect x="250" y="150" width="100" height="20" ry="0"/> + <rect x="250" y="180" width="100" height="20" rx="0" ry="0"/> + </g> + + <g transform="translate(100,100)"> + <rect x="10" y="120" width="50" height="20" rx="50"/> + <rect x="80" y="120" width="20" height="50" ry="50"/> + + <rect x="120" y="120" width="50" height="20" rx="200" ry="200"/> + + <rect width="20" height="30" rx="50" transform="translate(-10 -15) scale(2) translate(10 15) translate(85 52.5)"/> + <rect x="230" y="120" width="20" height="30" ry="50"/> + </g> + </g> + + <use xlink:href="#references" fill="none" stroke="black"/> + + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.9 $</text> + </g> + <rect xml:id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/shapes-rect-04-f-manual.svg b/testing/web-platform/tests/svg/import/shapes-rect-04-f-manual.svg new file mode 100644 index 000000000..fdd830595 --- /dev/null +++ b/testing/web-platform/tests/svg/import/shapes-rect-04-f-manual.svg @@ -0,0 +1,66 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: shapes-rect-04-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/shapes.html#RectElement"> + <p> + 'Rect' elements with unspecified 'rx' and 'ry' attributes will use the specified 'rx' and 'ry' value if the other one is specified; if neither is specified, the 'rect' has square edges. + </p> + <p> + Creates one 'rect' element with an unspecified 'ry'. Places it over a red 'rect' element with both 'rx' and 'ry' specified. Repeat with unspecified 'rx'. Finally creates a 'rect' element that has neither 'rx' or + 'ry' specified. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if the two shapes on top are rounded rectangles, the shape below has square corners, and no red is visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: shapes-rect-04-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <rect x="25" y="25" width="200" height="100" rx="50" ry="50" fill="red" /> + <rect x="25" y="25" width="200" height="100" rx="50" fill="black" /> + + <rect x="275" y="25" width="200" height="100" rx="50" ry="50" fill="red" /> + <rect x="275" y="25" width="200" height="100" ry="50" fill="black" /> + + <rect x="150" y="135" width="200" height="100" fill="black" /> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg>
\ No newline at end of file diff --git a/testing/web-platform/tests/svg/import/shapes-rect-05-f-manual.svg b/testing/web-platform/tests/svg/import/shapes-rect-05-f-manual.svg new file mode 100644 index 000000000..85e82a228 --- /dev/null +++ b/testing/web-platform/tests/svg/import/shapes-rect-05-f-manual.svg @@ -0,0 +1,74 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: shapes-rect-05-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/shapes.html#RectElement"> + <p> + The 'rect' element defines a rect which is axis-aligned with the default user coordinate system when it is not the initial user coordinate system. + </p> + <p> + Draws a 'rect' element originating at (0,0) of the current user coordinate system, which has been altered via 'transform' from the + initial user coordinate system. Draws perpendicular lines which also originate at (0,0) and advance along the x and y axes of the + current user coordinate system. Verifies that the lines overlap the top and left edges of the rectangle and that the rectangle is + thus axis-aligned with its current user coordinate system. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if the top and left of the rectangle is black while the right and bottom are orange, and the right half of the diamond is orange and the left half is black. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: shapes-rect-05-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <g transform="translate(100,100)"> + <rect x="0" y="0" width="75" height="100" fill="none" stroke="orange" stroke-width="10" /> + <line x1="0" y1="0" x2="75" y2="0" stroke-width="10" stroke="black" stroke-linecap="square" /> + <line x1="0" y1="0" x2="0" y2="100" stroke-width="10" stroke="black" stroke-linecap="square" /> + </g> + + <g transform="translate(100,100) rotate(-30) skewX(20)"> + <rect x="100" y="100" width="100" height="100" fill="none" stroke="orange" stroke-width="5" /> + <line x1="100" y1="100" x2="100" y2="200" stroke-width="5" stroke="black" stroke-linecap="square" /> + <line x1="100" y1="100" x2="200" y2="100" stroke-width="5" stroke="black" stroke-linecap="square" /> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg>
\ No newline at end of file diff --git a/testing/web-platform/tests/svg/import/shapes-rect-06-f-manual.svg b/testing/web-platform/tests/svg/import/shapes-rect-06-f-manual.svg new file mode 100644 index 000000000..0f9d4ea53 --- /dev/null +++ b/testing/web-platform/tests/svg/import/shapes-rect-06-f-manual.svg @@ -0,0 +1,70 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: shapes-rect-06-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/shapes.html#RectElement"> + <p> + When 'rect' attributes 'rx' and 'ry' have a value greater than half of the width/height of the rectangle, they are treated as half the width/height of the rectangle. + </p> + <p> + The test creates one 'rect' element with 'rx' greater than 1/2 the 'rect' width. Underneath that element, it creates a red 'rect' element with + 'rx' set to 1/2 the width. Repeats with 'ry' attribute. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: shapes-rect-06-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <rect x="25" y="50" width="200" height="100" rx="100" ry="50" fill="red" /> + <rect x="25" y="50" width="200" height="100" rx="150" ry="50" fill="black" /> + <rect x="25" y="200" width="200" height="100" rx="150" ry="50" fill="red" /> + <rect x="25" y="200" width="200" height="100" rx="100" ry="50" fill="black" /> + + <rect x="275" y="50" width="200" height="100" ry="50" rx="100" fill="red" /> + <rect x="275" y="50" width="200" height="100" ry="75" rx="100" fill="black" /> + <rect x="275" y="200" width="200" height="100" ry="75" rx="100" fill="red" /> + <rect x="275" y="200" width="200" height="100" ry="50" rx="100" fill="black" /> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg>
\ No newline at end of file diff --git a/testing/web-platform/tests/svg/import/shapes-rect-07-f-manual.svg b/testing/web-platform/tests/svg/import/shapes-rect-07-f-manual.svg new file mode 100644 index 000000000..7dbe04644 --- /dev/null +++ b/testing/web-platform/tests/svg/import/shapes-rect-07-f-manual.svg @@ -0,0 +1,61 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" + version="$Revision: 1.2 $" testname="$RCSfile: shapes-rect-07-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/shapes.html#RectElement"> + <p> + Checks that unspecified 'ry' and 'rx' attributes are copied from each other before their values are clamped. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: shapes-rect-07-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <rect x="25" y="50" width="200" height="100" rx="100" fill="red" /> + <rect x="25" y="50" width="200" height="100" rx="100" ry="50" fill="black" /> + <rect x="25" y="200" width="200" height="100" rx="100" ry="50" fill="red" /> + <rect x="25" y="200" width="200" height="100" rx="100" fill="black" /> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg>
\ No newline at end of file diff --git a/testing/web-platform/tests/svg/import/struct-cond-01-t-manual.svg b/testing/web-platform/tests/svg/import/struct-cond-01-t-manual.svg new file mode 100644 index 000000000..5238f9fb7 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-cond-01-t-manual.svg @@ -0,0 +1,61 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWGh" author="Tim Thompson" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: struct-cond-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#ConditionalProcessing"> + <p> + This test evaluates a switch statement. + </p> + <p> + The test uses the 'rect' element, as well as basic fill (solid primary colors), + stroke (black 1-pixel lines), font-family (Arial) and font-size properties. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The result should be a green rectangle in the lower left quarter of the output window. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-cond-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <switch> + <rect fill="red" x="0" y="0" width="220" height="150" requiredExtensions="http://example.org/bogus"/> + <rect fill="green" x="0" y="150" width="220" height="150"/> + <rect fill="blue" x="240" y="0" width="220" height="150"/> + </switch> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-cond-02-t-manual.svg b/testing/web-platform/tests/svg/import/struct-cond-02-t-manual.svg new file mode 100644 index 000000000..6883e0a85 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-cond-02-t-manual.svg @@ -0,0 +1,585 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Chris Lilley" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: struct-cond-02-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#ConditionalProcessing"> + <p> + This tests ability to use the 'systemLanguage' as a test attribute within a + switch element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + To pass, either the name (in English) of the current system language, or + the names of the three languages (English, French and Japanese) of W3C + must appear. The second case will occur if either the user language is + not one of the (60 or so) languages present in the test, or if there is + no user language information available. + </p> + <p> + It is an error to display no output; the last child of switch has no test, so + it will always be taken unless a more suitable child has already evaluated to true. + </p> + <p> + In addition, the string "Why don't they just speak <language>" should appear + in the center of the graphic, translated into that language. It is not an error for + some or all of this string to display as 'missing character' glyphs, if no + suitable font is available - however, this is unlikely if the language is indeed + the users primary language. (It can easily occur during testing, however). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-cond-02-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g fill="black" stroke="none" font-size="24" font-weight="normal" font-family="Arial, Tahoma, Verdana, 'Arial Unicode MS', Code2000"> + <!-- a blank one +<text x="20" y="220" xml:lang=""> +<tspan font-weight="bold" > + ?</text> +<text x="230" y="150" xml:lang="en"></text> +--> + <!-- put sample here for testing --> + <switch> + <g systemLanguage="af"> + <text x="20" y="220" xml:lang="af" font-size="16">Waarom kan hulle nie net doodgewoon Afrikaans praat nie?</text> + <text x="230" y="150" xml:lang="en">Afrikaans</text> + </g> + <g systemLanguage="am"> + <text x="20" y="220" xml:lang="am" font-family="'GF Zemen Unicode',Code2000" font-size="28">ለምንድነው አማርኛ የማይናገሩት፧</text> + <text x="230" y="150" xml:lang="en">Amharic</text> + </g> + <g systemLanguage="ar"> + <!-- this is a tiny test so there is no text-anchor, thus rtl text is explicitly positioned --> + <text x="20" y="220" xml:lang="ar-SA" font-family=" Tahoma,'MS Farsi','Arial Unicode MS'" font-size="19">لماذا لا يتكلمون اللّغة العربية فحسب؟</text> + <text x="230" y="150" xml:lang="en">Arabic (SA)</text> + </g> + <g systemLanguage="bg"> + <text x="20" y="220" xml:lang="bg" font-size="18">Защо те просто не могат да говорят български ?</text> + <text x="230" y="150" xml:lang="en">Bulgarian</text> + </g> + <g systemLanguage="bn"> + <text x="20" y="220" xml:lang="bn" font-family="'Arial Unicode MS','UT Bengali Khulna'" font-size="28">ওরা েকন বাংলা বলেত পাের না ?</text> + <text x="230" y="150" xml:lang="en">Bengali</text> + </g> + <!-- +Tibetan needs complex layout: this will not work correctly though the font has the right glyphs: +<g systemLanguage="bo"> + <text x="20" y="220" xml:lang="bo" font-family="'Arial Unicode MS'" font-size="18"> + +ག་རེ་བྱས་ཁོ་རང་ཚོས་ བོད་ སྐད་ཆ་དེ་ག་རང་བཤད་ཀྱི་མ་རེད།</text> + <text x="230" y="150" xml:lang="en">Tibetan</text> + </g>--> + <g systemLanguage="ca"> + <text x="20" y="220" xml:lang="bg" font-size="20">Per què no poden simplement parlar en català ?</text> + <text x="230" y="150" xml:lang="en">Catalan</text> + </g> + <g systemLanguage="cs"> + <text x="20" y="220" xml:lang="cs">Proč prostě nemluví česky ?</text> + <text x="230" y="150" xml:lang="en">Czech</text> + </g> + <g systemLanguage="cy"> + <text x="20" y="220" xml:lang="cy" font-size="20">Pam dydyn nhw ddim yn siarad Cymraeg ?</text> + <text x="230" y="150" xml:lang="en">Welsh</text> + </g> + <g systemLanguage="da"> + <text x="20" y="220" xml:lang="da">Hvorfor kan de ikke bare tale dansk ?</text> + <text x="230" y="150" xml:lang="en">Danish</text> + </g> + <!-- need a generic german, too --> + <g systemLanguage="de-DE"> + <text x="20" y="220" xml:lang="de-DE" font-size="22">Warum sprechen sie nicht einfach Deutsch ?</text> + <text x="230" y="150" xml:lang="en">German (DE)</text> + </g> + <g systemLanguage="el"> + <text x="20" y="220" xml:lang="el-GR" font-size="22">Μα γιατί δεν μπορούν να μιλήσουν Ελληνικά ;</text> + <text x="230" y="150" xml:lang="en">Greek (modern, GR)</text> + </g> + <g systemLanguage="en"> + <text x="20" y="220" xml:lang="en-US">Why can't they just speak English ?</text> + <text x="230" y="150" xml:lang="en">English (US)</text> + </g> + <g systemLanguage="es"> + <text x="20" y="220" xml:lang="es-ES" font-size="18">¿Por qué no pueden simplemente hablar en castellano ?</text> + <text x="230" y="150" xml:lang="en">Spanish (ES)</text> + </g> + <g systemLanguage="eu"> + <text x="20" y="220" xml:lang="eu" font-size="21">Zergatik ezin dute Euzkeraz bakarrik hitzegin?</text> + <text x="230" y="150" xml:lang="en">Basque</text> + </g> + <g systemLanguage="fa"> + <text x="20" y="220" xml:lang="fa" font-family=" Tahoma,'MS Farsi','Arial Unicode MS'" font-size="22">خب، چرا فارسى صحبت نمى كنند؟</text> + <text x="230" y="150" xml:lang="en">Farsi</text> + </g> + <g systemLanguage="fi"> + <text x="20" y="220" xml:lang="fi" font-size="20">Miksi he eivät yksinkertaisesti puhu suomea ?</text> + <text x="230" y="150" xml:lang="en">Finnish</text> + </g> + <!-- put Canadian French before generic French --> + <g systemLanguage="fr"> + <text x="20" y="220" xml:lang="fr-fR" font-size="17">Pourquoi, tout simplement, ne parlent-ils pas en Français ?</text> + <text x="230" y="150" xml:lang="en">French (FR)</text> + </g> + <g systemLanguage="gd"> + <text x="20" y="220" xml:lang="gd" font-size="20">Carson nach eil iad a'bruidhinn na Gàidhlige ?</text> + <text x="230" y="150" xml:lang="en">Scots Gaelic</text> + </g> + <g systemLanguage="gu"> + <text x="20" y="220" xml:lang="gu" font-family="'Arial Unicode MS'" font-size="28">બદ્ધા લોકો ગુજરાતી કૅમ નથી બોલતા?</text> + <text x="230" y="150" xml:lang="en">Gujarti (IN)</text> + </g> + <g systemLanguage="he"> + <!-- he or iw, check --> + <text x="20" y="220" xml:lang="he" font-family="Tahoma,'Arial Unicode MS'" font-size="22">למה הם פשוט לא מדברים עברית ?</text> + <text x="230" y="150" xml:lang="en">Hebrew (modern)</text> + </g> + <g systemLanguage="hi"> + <text x="20" y="220" xml:lang="hi" font-family="Mangal,Code2000,'Arial Unicode MS'">यह लोग हिन्दी क्यों नहीं बोल सकते हैं ?</text> + <text x="230" y="150" xml:lang="en">Hindi</text> + </g> + <g systemLanguage="hr"> + <text x="20" y="220" xml:lang="hr">Zašto jednostavno ne govore hrvatski ?</text> + <text x="230" y="150" xml:lang="en">Croatian</text> + </g> + <g systemLanguage="hu"> + <text x="20" y="220" xml:lang="hu" font-size="22">Miért nem beszélnek egyszerűen magyarul ?</text> + <text x="230" y="150" xml:lang="en">Hungarian</text> + </g> + <g systemLanguage="hy"> + <text x="20" y="220" xml:lang="hy" font-family="Sylfaen,Code2000,'Arial Unicode MS'" font-size="22"> + Ինչու՞ նրանք չեն խոսում Հայերեն + </text> + <text x="230" y="150" xml:lang="en">Armenian</text> + </g> + <g systemLanguage="id"> + <text x="20" y="220" xml:lang="id" font-size="18">Mengapa mereka tidak bisa bicara bahasa Indonesia ?</text> + <text x="230" y="150" xml:lang="en">Indonesian</text> + </g> + <g systemLanguage="is"> + <text x="20" y="220" xml:lang="is" font-size="20">Hvers vegna geta þeir ekki réttlátur tala Íslenska ?</text> + <text x="230" y="150" xml:lang="en">Icelandic</text> + </g> + <g systemLanguage="it"> + <text x="20" y="220" xml:lang="it" font-size="18">Perchè non possono semplicemente parlare italiano ?</text> + <text x="230" y="150" xml:lang="en">Italian</text> + </g> + <g systemLanguage="iu"> + <!-- unable to distinguish North Baffin Island Inuktitut from + South/Central Baffin Island Inuktitut + because ISO 3166 codes do not offer any finer + resolution than 'Canadian' --> + <text x="20" y="220" xml:lang="iu" font-family="NunacomU,'Ballymun RO','Arial Unicode MS'" font-size="28">ᓱᒻᒪᓂᒃᑯᐊ ᐃᓄᒃᑎᑐ ᑐᐃᓐᓇᔭᙱᓚᑦ</text> + <text x="230" y="150" xml:lang="en">Inuktitut</text> + </g> + <g systemLanguage="ja-JP"> + <text x="20" y="220" xml:lang="ja-JP" font-family="'MS Gothic',ＭＳ ゴシック,'MS Mincho',ＭＳ 明朝,Code2000,'Arial Unicode MS',DFP-SMTWSong" font-size="22">なぜ、みんな日本語を話してくれないのか？</text> + <text x="230" y="150" xml:lang="en">Japanese (JP)</text> + </g> + <g systemLanguage="jw"> + <text x="20" y="220" xml:lang="jw" font-size="20">Kenapa kok ora nganggo basa Jawa wae?</text> + <text x="230" y="150" xml:lang="en">Javanese</text> + </g> + <g systemLanguage="ka"> + <text x="20" y="220" xml:lang="ka" font-family="Sylfaen,Code2000,'Arial Unicode MS'" font-size="20">რატომ არ ლაპარაკობენ ისინი ქართულად ?</text> + <text x="230" y="150" xml:lang="en">Georgian</text> + </g> + <g systemLanguage="kk"> + <text x="20" y="220" xml:lang="kk" font-family="'Arial Unicode MS',Code2000">Олар неге қазақ тiлiнде сойлемейдi?</text> + <text x="230" y="150" xml:lang="en">Kazakh</text> + </g> + <g systemLanguage="kn"> + <text x="20" y="220" xml:lang="kn" font-family="'Arial Unicode MS',Code2000" font-size="28">ಅವರು ಕನ್ನಡ ಮಾತನಾಡಬಹುದಲ್ಲಾ?</text> + <text x="230" y="150" xml:lang="en">Kannada</text> + </g> + <g systemLanguage="ko"> + <text x="20" y="220" xml:lang="ko" font-family="GulimChe,굴림체,Gulim,굴림,BatangChe,바탕체,Batang,바탕,Code2000,'Arial Unicode MS'" font-size="15">세계의 모든 사람들이 한국어 를 이해한다면 얼마나 좋을까?</text> + <text x="230" y="150" xml:lang="en">Korean</text> + </g> + <g systemLanguage="ky"> + <text x="20" y="220" xml:lang="ky" font-family="'Arial Unicode MS',Code2000">Емне үчүн алар кыргызча сүйлбйт?</text> + <text x="230" y="150" xml:lang="en">Kirghiz</text> + </g> + <g systemLanguage="lt"> + <text x="20" y="220" xml:lang="lt" font-size="28">Kodėl gi jie nekalba lietuviškai ?</text> + <text x="230" y="150" xml:lang="en">Lithuanian</text> + </g> + <g systemLanguage="mk"> + <text x="20" y="220" xml:lang="mk" font-size="20">Зошто тие едноставно не говорат македонски ?</text> + <text x="230" y="150" xml:lang="en">Macedonian</text> + </g> + <g systemLanguage="mr"> + <text x="20" y="220" xml:lang="mr" font-family="Mangal,Code2000,'Arial Unicode MS'" font-size="26">लोकांना मराठी का बोलता येत नाही?</text> + <text x="230" y="150" xml:lang="en">Marathi</text> + </g> + <g systemLanguage="nl"> + <text x="20" y="220" xml:lang="nl" font-size="21">Waarom spreken ze niet gewoon Nederlands ?</text> + <text x="230" y="150" xml:lang="en">Dutch</text> + </g> + <g systemLanguage="no"> + <text x="20" y="220" xml:lang="no" font-size="21">Hvorfor kan de ikke bare snakke norsk ?</text> + <text x="230" y="150" xml:lang="en">Norwegian</text> + </g> + <g systemLanguage="or"> + <text x="20" y="220" xml:lang="or" font-family="'Arial Unicode MS',Code2000" font-size="26">ସେମାନେ ଉଡିଯା ରେ କହିନ୍କି କହିବେ ନହିଁ?</text> + <text x="230" y="150" xml:lang="en">Oriya</text> + </g> + <g systemLanguage="pl"> + <text x="20" y="220" xml:lang="pl">Dlaczego oni nie mówią po polsku ?</text> + <text x="230" y="150" xml:lang="en">Polish</text> + </g> + <!-- test two specific types of Portugese, then a generic alternative --> + <g systemLanguage="pt-PT"> + <text x="20" y="220" xml:lang="pt-PT" font-size="18">Porque é que eles não falam simplesmente em Português ?</text> + <text x="230" y="150" xml:lang="en">Portugese (PT)</text> + </g> + <g systemLanguage="pt-BR"> + <text x="20" y="220" xml:lang="pt-BR" font-size="17">Porque é que eles não falam em Português (do Brasil) ?</text> + <text x="230" y="150" xml:lang="en">Portugese (BR)</text> + </g> + <g systemLanguage="pt"> + <text x="20" y="220" xml:lang="pt-PT" font-size="18">Porque é que eles não falam simplesmente em Português ?</text> + <text x="230" y="150" xml:lang="en">Portugese</text> + </g> + <g systemLanguage="ro"> + <text x="20" y="220" xml:lang="ro">De ce ei nu vorbesc moldoveneşte ?</text> + <text x="230" y="150" xml:lang="en">Romanian</text> + </g> + <g systemLanguage="ru"> + <text x="20" y="220" xml:lang="ru">Почему же они не говорят по-русски ?</text> + <text x="230" y="150" xml:lang="en">Russian</text> + </g> + <g systemLanguage="sa"> + <text x="20" y="220" xml:lang="sa" font-family="Mangal,Code2000,'Arial Unicode MS'" font-size="26">ते किं संस्कृतः माम वदन्ति ?</text> + <text x="230" y="150" xml:lang="en">Sanskrit</text> + </g> + <g systemLanguage="sr"> + <text x="20" y="220" xml:lang="sr">Zašto jednostavno ne govore srpski ?</text> + <text x="230" y="150" xml:lang="en">Serbian</text> + </g> + <g systemLanguage="si"> + <text x="20" y="220" xml:lang="si" font-family="'Andale Mono WT J'" font-size="26">අැයි ඔවුන්ට ඉංගරිස කතා ෛනබ ?</text> + <text x="230" y="150" xml:lang="en">Sinhalese</text> + <!-- Sinhalese needs somewhat complex layout (many paired special cases, see +http://www-texdev.mpce.mq.edu.au/l2h/indic/Sinhala/lreport/node1.html +so this 'chart' font is not entirely suitable--> + </g> + <g systemLanguage="sl"> + <text x="20" y="220" xml:lang="sl">Zakaj vendar ne govorijo slovensko ?</text> + <text x="230" y="150" xml:lang="en">Slovenian</text> + </g> + <g systemLanguage="sq"> + <text x="20" y="220" xml:lang="sq">Pse nuk duan të flasin vetëm shqip ?</text> + <text x="230" y="150" xml:lang="en">Albanian</text> + </g> + <g systemLanguage="sv"> + <text x="20" y="220" xml:lang="sv">Varför pratar dom inte bara svenska ?</text> + <text x="230" y="150" xml:lang="en">Swedish</text> + </g> + <g systemLanguage="ta"> + <text x="20" y="220" xml:lang="ta" font-family="Latha,'Arial Unicode MS'" font-size="20">அவர்கள் ஏன் தமிழில் பேசக்கூடாது ?</text> + <text x="230" y="150" xml:lang="en">Tamil</text> + </g> + <g systemLanguage="te"> + <text x="20" y="220" xml:lang="te" font-family="'Arial Unicode MS'"> + తెలుగు లో ఎందుకు మాట్లాడరు? + </text> + <text x="230" y="150" xml:lang="en">Telugu</text> + </g> + <g systemLanguage="tg"> + <text x="20" y="220" xml:lang="tg" font-size="20">Čaro onho ba zaboni točiki gap namezanand?</text> + <text x="230" y="150" xml:lang="en">Tajik</text> + </g> + <g systemLanguage="th"> + <text x="20" y="220" xml:lang="th" font-family="Tahoma,CordiaUPC,BrowalliaUPC,DilleniaUPC,EucrosiaUPC,FreesiaUPC,JasmineUPC, KodChiangUPC,LilyUPC,'Arial Unicode MS'" font-size="28">ทำไมเขาถึงไม่พูด ภาษาไทย </text> + <text x="230" y="150" xml:lang="en">Thai</text> + </g> + <g systemLanguage="tl"> + <text x="20" y="220" xml:lang="tl" font-size="19">Bakit hindi na lang sila magsalita ng Tagalog ?</text> + <text x="230" y="150" xml:lang="en">Tagalog (Filipino)</text> + </g> + <g systemLanguage="tr"> + <text x="20" y="220" xml:lang="tr">Neden Türkçe konuşamıyorlar?</text> + <text x="230" y="150" xml:lang="en">Turkish</text> + </g> + <g systemLanguage="tt"> + <text x="20" y="220" xml:lang="tt" font-family="'Arial Unicode MS',Code2000" font-size="22">Нишләп олар татарча сүләша алмыйлар?</text> + <text x="230" y="150" xml:lang="en">Tatar</text> + </g> + <g systemLanguage="uk"> + <text x="20" y="220" xml:lang="uk">Чому б їм не розмовляти українською ?</text> + <text x="230" y="150" xml:lang="en">Ukranian</text> + </g> + <g systemLanguage="ur-IN"> + <text x="20" y="220" xml:lang="ur-IN" font-family=" Tahoma,'MS Farsi','Arial Unicode MS'" font-size="22">ﻦﻴﻫ ﻰﺘﻠﻭﺒ ﻦﻴﻬﻨ ﻦﻭﻴﻜ ﻮﺪﺭﺃ بس ﻮﻩ ﻟﻮﮒ؟</text> + <text x="230" y="150" xml:lang="en">Urdu (IN)</text> + </g> + <g systemLanguage="ur-PK"> + <text x="20" y="220" xml:lang="ur-PK" font-family=" Tahoma,'MS Farsi','Arial Unicode MS'" font-size="19">ﻦﻴﻫ ﻰﺘﻠﻭﺒ ﻦﻴﻬﻨ ﻦﻭﻴﻜ ﻮﺪﺭﺃ بس ﻮﻩ ﻟﻮﮒ؟</text> + <text x="230" y="150" xml:lang="en">Urdu (PK)</text> + </g> + <!-- should have a generic Urdu here for when user preference is Urdu but neither Pakistan Urdu nor Indian Urdu --> + <g systemLanguage="uz"> + <text x="20" y="220" xml:lang="uz" font-size="22">Nega ular uzbek tilinda gapirmaidilar?</text> + <text x="230" y="150" xml:lang="en">Uzbek</text> + </g> + <g systemLanguage="vi"> + <text x="20" y="220" xml:lang="vi" font-family="Tahoma,Verdana,'Verdana Ref','Arial Unicode MS'" font-size="22">Tại sao họ không thể chỉ nói tiếng Việt ?</text> + <text x="230" y="150" xml:lang="en">Vietnamese</text> + </g> + <g systemLanguage="yi"> + <text x="20" y="220" xml:lang="yi" font-family="Tahoma,'Arial Unicode MS'" font-size="22">פֿאַרװאָס רעדט מען ניט פּשוט ייִדיש ?</text> + <text x="230" y="150" xml:lang="en">Yiddish</text> + </g> + <g systemLanguage="zh-CN"> + <text x="20" y="220" font-family="'MS Hei','MS Song',LiSu,隶书,Code2000,'Arial Unicode MS'" font-size="26" xml:lang="zh-CN">他们为什么不说中文 （中国） ？</text> + <text x="230" y="150" xml:lang="en">Chinese (CN)</text> + </g> + <g systemLanguage="zh-TW"> + <text x="20" y="220" xml:lang="zh-TW" font-family="MingLiU,細明體,PMingLiU,新細明體,DFP-SMTWSong,Code2000,'Arial Unicode MS'" font-size="26">他們爲什麽不說中文（台灣）？</text> + <text x="230" y="150" xml:lang="en">Chinese (TW)</text> + </g> + <g> + <!-- the default case, try three languages of W3C host institutions --> + <text x="90" y="100" fill="#700" font-size="14">You have no (matching) language preference set</text> + <text x="20" y="180" xml:lang="ja-JP" font-family="MS Gothic,ＭＳ ゴシック,MS Mincho,ＭＳ 明朝,Code2000,'Arial Unicode MS',DFP-SMTWSong" font-size="20">なぜ、みんな日本語を話してくれないのか？</text> + <text x="20" y="220" xml:lang="en-US">Why can't they just speak English ?</text> + <text x="20" y="260" xml:lang="fr-fR" font-size="16">Pourquoi, tout simplement, ne parlent-ils pas en Français ?</text> + </g> + </switch> + <!-- action item was to make a switch "for all ISO 639-1 language codes", + a large task not completed. But there is enough here to make a good test case, + including 19 of the top 20 langiuages by number of speakers (except Punjabi). + + Here is the full list (trailing * indicates language included in this test), + accurate as of October 22, 2002 from the registration authority: + http://lcweb.loc.gov/standards/iso639-2/langcodes.html + + aa Afar + ab Abkhazian + af Afrikaans * + am Amharic * + ar Arabic * + as Assamese + ae Avestan + ay Aymara + az Azerbaijani + + ba Bashkir + be Byelorussian + bg Bulgarian * + bh Bihari + bi Bislama + bn Bengali [Bangla] * + bo Tibetan * + br Breton + bs Bosnian + + ca Catalan * + ce Chechen + ch Chamorro + co Corsican + cs Czech * + cu Church Slavic + cv Chuvash + cy Welsh * + + da Danish * + de German * + dz Dzongkha [Bhutani] + + el Greek, Modern (1453-) * + en English, Modern * + eo Esperanto + es Spanish * + et Estonian + eu Basque * + + fa Persian (Farsi) * + fi Finnish * + fj Fijian + fo Faeroese + fr French, Modern * + fy Frisian + + ga Irish + gd Scots Gaelic * + gl Gallegan [Galician] + gn Guarani + gu Gujarati * + gv Manx + + ha Hausa + he Hebrew * + hi Hindi * + ho Hiri Motu + hr Croatian * + hu Hungarian * + hy Armenian * + hz Herero + + ia Interlingua + id Indonesian * + ie Interlingue + ik Inupiak + is Icelandic * + it Italian * + iu Inuktitut * + iw Hebrew * + + ja Japanese * + jw Javanese + + ka Georgian * + ki Kikuyu + kj Kuanyama + kk Kazakh * + kl Kalaallisut [Greenlandic] + km Khmer [Cambodian] + kn Kannada * + ko Korean * + ks Kashmiri + ku Kurdish + kv Komi + kw Cornish + ky Kirghiz * + + la Latin + ln Lingala + lo Lao [Laothian] + lt Lithuanian * + lv Latvian [Lettish] + + mg Malagasy + mh Marshall + mi Maori + mk Macedonian * + ml Malayalam + mn Mongolian + mo Moldavian + mr Marathi * + ms Malay + mt Maltese + my Burmese + + na Nauru + nb Norwegian Bokmal + nd Ndebele, North + ne Nepali + ng Ndonga + nl Dutch * + nn Norwegian Nynorsk + no Norwegian * + nr Ndebele, South + nv Navajo + ny Chichewa~@Nyanja + + oc Occitan (post 1500); Provencal + om Oromo [Afan] + or Oriya * + os Ossetian; Ossetic + + pa Panjabi + pi Pali + pl Polish * + ps Pushto [Pashto] + pt Portuguese * + + qu Quechua + + rm Rhaeto-Romance + rn Kirundi + ro Romanian * + ru Russian * + rw Kinyarwanda + + sa Sanskrit * + sc Sardinian + sd Sindhi + se Northern Sami + sg Sangro + sr Serbian * + si Sinhalese * + sk Slovak + sl Slovenian * + sm Samoan + sn Shona + so Somali + sq Albanian * + sr Serbian + ss Swati [Siswati] + st Sotho, Southern [Sesotho] + su Sundanese + sv Swedish * + sw Swahili + + ta Tamil * + te Tegulu * + tg Tajik * + th Thai * + ti Tigrinya + tk Turkmen + tl Tagalog * + tn Tswana [Setswana] + to Tonga + tr Turkish * + ts Tsonga + tt Tatar * + tw Twi + + ug Uighur + uk Ukrainian * + ur Urdu * + uz Uzbek * + + vi Vietnamese * + vo Volapuk + + wo Wolof + + xh Xhosa + + yi Yiddish * + yo Yoruba + + za Zhuang + zh Chinese * + zu Zulu + +note: http://msdn.microsoft.com/workshop/management/ISO639codes.htm is obselete and incorrect + +--> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-cond-03-t-manual.svg b/testing/web-platform/tests/svg/import/struct-cond-03-t-manual.svg new file mode 100644 index 000000000..93d54901d --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-cond-03-t-manual.svg @@ -0,0 +1,83 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: struct-cond-03-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#ConditionalProcessing"> + <p> + Tests the <switch> element with requiredFeatures. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + On the bottom half of the test, there is a first switch. + Because SVG Tiny does not support DOM, an SVG Tiny implementation + which does not support other SVG Profiles should show a green + rectangle. If the application supports the DOM, meaning that + it does more than just SVG Tiny, it should show a turquoise rectangle. + </p> + <p> + On the bottom half of the test, there is another switch. + The first child has a requiredFeatures set to + http://www.w3.org/TR/SVG11/feature#BasicText which all + SVG Tiny implementations should support. If the application + does, another green rectangle is displayed. Otherwise, + a red rectangle shows. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-cond-03-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <switch> + <g requiredFeatures="http://www.w3.org/TR/SVG11/feature#SVGDOM"> + <rect x="30" y="20" width="420" height="130" fill="rgb(32, 178, 170)"/> + <text x="240" y="100" font-size="20" text-anchor="middle">This viewer does more than SVG Tiny</text> + </g> + <g> + <rect x="30" y="20" width="420" height="130" fill="#0F0"/> + </g> + </switch> + + <switch transform="translate(0, 140)"> + <g requiredFeatures="http://www.w3.org/TR/SVG11/feature#BasicText"> + <rect x="30" y="20" width="420" height="130" fill="#0F0"/> + </g> + <g> + <rect x="30" y="20" width="420" height="130" fill="#F00"/> + <text x="240" y="100" font-size="20" text-anchor="middle">This is not an SVG Tiny Viewer</text> + </g> + </switch> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-cond-overview-02-f-manual.svg b/testing/web-platform/tests/svg/import/struct-cond-overview-02-f-manual.svg new file mode 100644 index 000000000..f3b14d221 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-cond-overview-02-f-manual.svg @@ -0,0 +1,65 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="CM" author="Microsoft" status="reviewed" version="$Revision: 1.4 $" testname="$RCSfile: struct-cond-overview-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/struct.html#ConditionalProcessingOverview"> + <p> + Test that 'use' instances of elements with failing conditional processing attributes are not rendered. + </p> + <p> + Six blue 'rect' elements are defined. For each conditional processing attribute, a black 'rect' element is defined with that particular conditional + processing attribute set to an arbitrary string that would cause the attribute's requirement test to fail. Each of the black 'rect' elements is + positioned so that it would completely cover the blue 'rect' if it were visible. A corresponding 'use' element is defined for each black 'rect' + and is positioned such that it would cover the remaining three blue 'rect' elements. The six blue 'rect' elements should be visible. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test passes if six blue boxes are visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-cond-overview-02-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-size="18"> + <rect width="100" height="100" fill="blue" /> + <rect width="100" height="100" id="testRequiredFeatures" requiredFeatures="INVALID_FEATURE_STRING" /> + <rect x="200" width="100" height="100" fill="blue" /> + <use x="200" xlink:href="#testRequiredFeatures" /> + <rect y="120" width="100" height="100" fill="blue" /> + <rect y="120" width="100" height="100" id="testRequiredExtensions" requiredExtensions="INVALID_EXTENSION_STRING" /> + <rect y="120" x="200" width="100" height="100" fill="blue" /> + <use x="200" xlink:href="#testRequiredExtensions" /> + <rect y="240" width="100" height="100" fill="blue" /> + <rect y="240" width="100" height="100" id="testSystemLanguage" systemLanguage="INVALID_LANGUAGE_STRING" /> + <rect y="240" x="200" width="100" height="100" fill="blue" /> + <use x="200" xlink:href="#testSystemLanguage" /> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-cond-overview-03-f-manual.svg b/testing/web-platform/tests/svg/import/struct-cond-overview-03-f-manual.svg new file mode 100644 index 000000000..03d76f187 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-cond-overview-03-f-manual.svg @@ -0,0 +1,61 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="CM" author="Microsoft" status="reviewed" version="$Revision: 1.6 $" testname="$RCSfile: struct-cond-overview-03-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/struct.html#ConditionalProcessingOverview"> + <p> + Test that conditional processing attributes set to an empty string are evaluated as false. + </p> + <p> + Three blue 'rect' elements are in the document. For each of the + conditional processing attributes, a black 'rect' element is + specified with a conditional processing attribute set to an empty string. + The black 'rect' is positioned so that it would completely cover the + blue 'rect' if it were visible. The three blue 'rect' + elements should be visible. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test passes if three blue boxes are visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-cond-overview-03-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-size="18"> + <rect width="100" height="100" fill="blue" /> + <rect width="100" height="100" requiredFeatures="" /> + <rect y="120" width="100" height="100" fill="blue" /> + <rect y="120" width="100" height="100" requiredExtensions="" /> + <rect y="240" width="100" height="100" fill="blue" /> + <rect y="240" width="100" height="100" systemLanguage="" /> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-cond-overview-04-f-manual.svg b/testing/web-platform/tests/svg/import/struct-cond-overview-04-f-manual.svg new file mode 100644 index 000000000..72da2a331 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-cond-overview-04-f-manual.svg @@ -0,0 +1,58 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="CM" author="Microsoft" status="reviewed" version="$Revision: 1.3 $" testname="$RCSfile: struct-cond-overview-04-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/struct.html#ConditionalProcessingOverview"> + <p> + Test that elements with conditional processing attributes that evaluate to true do not render if their parent contains conditional processing attributes that evaluate to false. + </p> + <p> + The test has a 'g' element with its 'requiredFeatures' attribute set to an arbitrary feature string that would cause the attribute's requirement test to fail. + A red 'rect' element is a child node of the 'g' element. The 'rect' element has the 'requiredFeatures' attribute set to a supported feature string. + 'http://www.w3.org/TR/SVG11/feature#ConditionalProcessing' was chosen as a valid feature string to reduce dependencies on other SVG features. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test passed if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-cond-overview-04-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <rect width="100" height="100" fill="green"/> + <g requiredFeatures="INVALID_FEATURE_STRING"> + <rect width="100" height="100" fill="red" requiredFeatures="http://www.w3.org/TR/SVG11/feature#ConditionalProcessing" /> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-cond-overview-05-f-manual.svg b/testing/web-platform/tests/svg/import/struct-cond-overview-05-f-manual.svg new file mode 100644 index 000000000..68f026cf6 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-cond-overview-05-f-manual.svg @@ -0,0 +1,70 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="[reviewer]" author="Microsoft" status="created" version="$Revision: 1.2 $" testname="$RCSfile: struct-cond-overview-05-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/struct.html#ConditionalProcessingOverview"> + <p> + Elements whose parent elements have failing conditional processing attributes are able to be referenced and rendered by 'use' elements. + </p> + <p> + Define three 'rect' elements that have a 'g' parent with either an invalid 'requiredFeature', 'requiredExtension', or 'systemLanguage'. + Then define three 'use' elements that reference the 'rect' elements. Verify that the 'use' elements render. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-cond-overview-05-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-size="18"> + <g requiredFeatures="INVALID_FEATURE_STRING"> + <rect width="100" height="100" id="testRequiredFeatures" /> + </g> + <rect x="200" width="100" height="100" fill="red" /> + <use x="200" xlink:href="#testRequiredFeatures" /> + <g requiredExtensions="INVALID_EXTENSION_STRING"> + <rect y="120" width="100" height="100" id="testRequiredExtensions" /> + </g> + <rect y="120" x="200" width="100" height="100" fill="red" /> + <use x="200" xlink:href="#testRequiredExtensions" /> + <g systemLanguage="INVALID_LANGUAGE_STRING"> + <rect y="240" width="100" height="100" id="testSystemLanguage" /> + </g> + <rect y="240" x="200" width="100" height="100" fill="red" /> + <use x="200" xlink:href="#testSystemLanguage" /> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-defs-01-t-manual.svg b/testing/web-platform/tests/svg/import/struct-defs-01-t-manual.svg new file mode 100644 index 000000000..d80888019 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-defs-01-t-manual.svg @@ -0,0 +1,66 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Tim Thompson" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: struct-defs-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#Head"> + <p> + Test to verify that the defs element is used as a container correctly. + </p> + <p> + In this test a fill is created which is solid green. The view should be a solid green rectangle + centered in the viewport 100 pixels from from left,top and right,bottom. Also, in the + defs sections there are rectangle defined, one to paint over the entire canvas with + a red fill and the other to obscure most of the green rectangle. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image, except for possible + variations in the labelling text (per CSS2 rules). + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + A green rectangle should be visible, and no red. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-defs-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs id="references"> + <rect id="rect11" x="0" y="0" width="480" height="360" color="#F00"/> + </defs> + <rect x="140" y="80" width="200" height="200" fill="#0F0"/> + <defs> + <rect x="160" y="100" width="160" height="160" fill="#F00"/> + </defs> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-dom-01-b-manual.svg b/testing/web-platform/tests/svg/import/struct-dom-01-b-manual.svg new file mode 100644 index 000000000..a7c379e76 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-dom-01-b-manual.svg @@ -0,0 +1,188 @@ +<svg version="1.1" baseProfile="basic" onload="domTest(evt)" id="svg-root"
+ width="100%" height="100%" viewBox="0 0 480 360"
+ xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+ <!--======================================================================-->
+ <!--= SVG 1.1 2nd Edition Test Case =-->
+ <!--======================================================================-->
+ <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =-->
+ <!--= Institute of Technology, European Research Consortium for =-->
+ <!--= Informatics and Mathematics (ERCIM), Keio University). =-->
+ <!--= All Rights Reserved. =-->
+ <!--= See http://www.w3.org/Consortium/Legal/. =-->
+ <!--======================================================================-->
+ <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/"
+ template-version="1.4" reviewer="SVGWG" author="VH" status="accepted"
+ version="$Revision: 1.8 $" testname="$RCSfile: struct-dom-01-b.svg,v $">
+ <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#DOMInterfaces">
+ <p>
+ Verify the basic capability to handle the SVG DOM API.
+ </p>
+ <p>
+ The test is composed of a top
+ level svg element with an 'onload' event handler and a rect element. Both
+ the svg and the rect elements have an identifier. The 'onload' handler
+ invokes SVG-specific DOM API methods which use these identifiers.
+ </p>
+ <p>
+ First, the handler gets the SVG element owner of the rect element and checks it has
+ the expected identifier. Then, the handler accesses the coordinates of the rect element
+ and uses them to build a 'shadow' rectangle under the existing one. Finally, the 'shadow'
+ rectangle is created using the SVGSVGElement's createSVGRect method.
+ </p>
+ </d:testDescription>
+ <d:operatorScript xmlns="http://www.w3.org/1999/xhtml">
+ <p>
+ Run the test. No interaction required.
+ </p>
+ </d:operatorScript>
+ <d:passCriteria xmlns="http://www.w3.org/1999/xhtml">
+ <p>The test passes if:</p>
+ <ul>
+ <li>The text "This document's root identifier is: svg-root" is shown.</li>
+ <li>A green rectangle with a black shadow is shown.</li>
+ </ul>
+ </d:passCriteria>
+ </d:SVGTestCase>
+ <title id="test-title">$RCSfile: struct-dom-01-b.svg,v $</title>
+ <defs>
+ <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F">
+ <font-face-src>
+ <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/>
+ </font-face-src>
+ </font-face>
+ </defs>
+ <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18">
+ <script type="text/ecmascript" xlink:href="../resources/testharness.js"></script>
+ <script type="text/ecmascript"><![CDATA[
+ function domTest(evt) {
+
+ var svg_ns = "http://www.w3.org/2000/svg";
+
+ // Get Document
+ var target = evt.target;
+ var doc = target.ownerDocument;
+
+ //
+ // Test that our rectangle is an SVGElement instance
+ //
+ var rect = doc.getElementById("rectId");
+ var rootSVG = rect.ownerSVGElement;
+ var rootId = rootSVG.getAttribute( "id" );
+
+ // Insert a new text element to the DOM tree using the id
+ var newText = doc.createElementNS(svg_ns, 'text');
+ newText.setAttribute('x', '50');
+ newText.setAttribute('y', '100');
+ var message = "This document's root identifier is: " + rootId;
+ var textContent = doc.createTextNode(message);
+ newText.appendChild(textContent);
+ rect.parentNode.appendChild(newText);
+
+ //
+ // Now, check that our rectangle is an instance of SVGRect by accessing
+ // specific methods in order to get its x, y, width and height attributes.
+ //
+ var x = rect.x.baseVal.value; // SVGRect -> SVGAnimatedLenght -> SVGLength -> long
+ var y = rect.y.baseVal.value;
+ var width = rect.width.baseVal.value;
+ var height = rect.height.baseVal.value;
+
+ //
+ // Now, build a new SVGRect through the SVGSVGElement interface.
+ //
+ var newRect = doc.createElementNS(svg_ns, 'rect');
+
+ //
+ // Set the x, y, width and height of this element
+ //
+ newRect.x.baseVal.value = x + 10;
+ newRect.y.baseVal.value = y + 10;
+ newRect.setAttribute("width", width);
+ newRect.setAttribute("height", height);
+
+ //
+ // Insert new element in DOM tree
+ //
+ rect.parentNode.insertBefore(newRect, rect);
+
+ //
+ // Check the pass criteria using the JS framework
+ //
+ test(function() {assert_equals(rootId, "svg-root")}, "Assert that the document's root identifier is 'svg-root'.");
+ test(function() {
+ assert_true(newRect instanceof SVGRectElement);
+ assert_equals(newRect.getAttribute('x'), String(x+10));
+ assert_equals(newRect.getAttribute('y'), String(y+10));
+ assert_equals(newRect.getAttribute('width'), String(width));
+ assert_equals(newRect.getAttribute('height'), String(height));
+ }, "Assert that 'newRect' is replica (ignoring fill) of 'rect' with different x and y.");
+ }
+
+ ]]></script>
+ <!--======================================================================-->
+ <!-- Since this test is examining the SVG DOM, it could use any language -->
+ <!-- binding. Here is the equivalent code for the Java binding -->
+ <!--
+
+ //
+ // Test that our rectangle is an SVGElement instance
+ //
+ SVGRectElement rect = (SVGRectElement) doc.getElementById("rectId");
+ SVGElement rootSVG = rect.getOwnerSVGElement();
+ String rootId = rootSVG.getId();
+
+ // Insert a new text element to the DOM tree using the id
+ Element newText = doc.createElement("text");
+ newText.setAttribute("x", "50");
+ newText.setAttribute("y", "100");
+ String message = "This document's root identifier is=" " + rootId"
+ Text textContent = doc.createTextNode(message);
+ newText.appendChild(textContent);
+ rect.getParentNode().appendChild(newText);
+
+ //
+ // Now, check that our rectangle is an instance of SVGRect by accessing
+ // specific methods in order to get its x, y, width and height attributes.
+ //
+ float x = rect.getX().getBaseVal().getValue();
+ float y = rect.getY().getBaseVal().getValue();
+ float width = rect.getWidth().getBaseVal().getValue();
+ float height = rect.getHeight().getBaseVal().getValue();
+
+ //
+ // Now, build a new SVGRect through the SVGSVGElement interface.
+ //
+ SVGRectElement newRect = (SVGRectElement) doc.createElement("rect");
+
+ //
+ // Set the x, y, width and height of this element
+ //
+ newRect.getX().getBaseVal().setValue(x + 10);
+ newRect.getY().getBaseVal().setValue(y + 10);
+ newRect.getWidth().getBaseVal().setValue(width);
+ newRect.getHeight().getBaseVal().setValue(height);
+
+ //
+ // Insert new element in DOM tree
+ //
+ alert(newRect)
+ rect.getParentNode().insertBefore(newRect, rect);
+
+-->
+ <!-- ===================================================================== -->
+ <!-- The following rectangle's is accessed in the 'domTest' ECMA Script -->
+ <!-- handler. -->
+ <!-- ===================================================================== -->
+ <rect id="rectId" x="40" y="150" width="50" height="50" fill="green"/>
+ </g>
+ <g font-family="SVGFreeSansASCII,sans-serif" font-size="32">
+ <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text>
+ </g>
+ <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/>
+ <!-- comment out this watermark once the test is approved -->
+ <!--<g id="draft-watermark">
+ <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/>
+ <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240"
+ text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text>
+ </g>-->
+</svg>
diff --git a/testing/web-platform/tests/svg/import/struct-dom-02-b-manual.svg b/testing/web-platform/tests/svg/import/struct-dom-02-b-manual.svg new file mode 100644 index 000000000..6ac422b43 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-dom-02-b-manual.svg @@ -0,0 +1,120 @@ +<svg version="1.1" baseProfile="basic" onload="domTest(evt)" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="Vincent Hardy" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: struct-dom-02-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#DOMInterfaces"> + <p> + Verify the basic capability to handle the hasFeature DOMImplementation method. + The DOMImplementation instance is retrieved from the Document instance. Then, + its hasFeature method is invoked on the various SVG feature strings. + </p> + <p> + The test displays the set of SVG feature strings and, next to them, a text + string that shows whether the feature is supported or not. + </p> + <p> + Note that this test uses the 'onload' event on the root svg element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image, except for the true and + false values which may differ depending on the implementation. + </p> + <p> + Note that the test passes whether or not the feature is supported (i.e., true or + false are valid). The test fails if no value (true or false) appears next to the feature string + value. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-dom-02-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <script type="text/ecmascript"><![CDATA[ + + var featureStrings = new Array(); + var length = 0; + featureStrings[length++] = "xml"; + featureStrings[length++] = "stylesheets"; + featureStrings[length++] = "views"; + featureStrings[length++] = "css2"; + featureStrings[length++] = "events"; + var svg_ns = "http://www.w3.org/2000/svg" + function domTest(evt) { + // Get Document + var target = evt.target; + var doc = target.ownerDocument; + + // Get DOMImplementation + var domImpl = doc.implementation; + + // + // Iterate through the feature strings + // + for(var i=0; i<featureStrings.length; i++){ + var supports = domImpl.hasFeature(featureStrings[i], '2.0'); + // + // if time, pretty up by putting xml to traveral in a left column and + // org.w3c.svg to org.w3c.dom.svg.all in a right column; add an extra + // parameter to addTextElemen t for x coord, and test if i < 9 + // + addTextElement(featureStrings[i], supports, doc, doc.getElementById("test-body-content"), (55 + 55*i)); + } + } + + function addTextElement(label, value, doc, svg, y){ + var newText = doc.createElementNS(svg_ns, 'text'); + newText.setAttribute('font-size', '30'); + newText.setAttribute('x', '10'); + newText.setAttribute('y', y); + var textValue = label; + var textContent = doc.createTextNode(textValue); + newText.appendChild(textContent); + svg.appendChild(newText); + + newText = doc.createElementNS(svg_ns, 'text'); + newText.setAttribute('font-size', '30'); + newText.setAttribute('x', '340'); + newText.setAttribute('y', y); + textValue = value; + textContent = doc.createTextNode(textValue); + newText.appendChild(textContent); + svg.appendChild(newText); + } + + ]]></script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-dom-03-b-manual.svg b/testing/web-platform/tests/svg/import/struct-dom-03-b-manual.svg new file mode 100644 index 000000000..657466d65 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-dom-03-b-manual.svg @@ -0,0 +1,120 @@ +<svg version="1.1" baseProfile="basic" onload="domTest(evt)" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="Vincent Hardy" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: struct-dom-03-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#DOMInterfaces"> + <p> + Verify the basic capability to handle the hasFeature DOMImplementation method. + The DOMImplementation instance is retrieved from the Document instance. Then, + its hasFeature method is invoked on the various SVG feature strings. + </p> + <p> + The test displays the set of SVG feature strings and, next to them, a text + string that shows whether the feature is supported or not. + </p> + <p> + Note that this test uses the 'onload' event on the root svg element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image, except for the true and + false values which may differ depending on the implementation. + </p> + <p> + Note that the test passes whether or not the feature is supported (i.e., true or + false are valid). The test fails if no value (true or false) appears next to the feature string + value. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-dom-03-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <script type="text/ecmascript"><![CDATA[ + + var featureStrings = new Array(); + var length = 0; + featureStrings[length++] = "uievents"; + featureStrings[length++] = "mouseevents"; + featureStrings[length++] = "mutationevents"; + featureStrings[length++] = "traversal"; + featureStrings[length++] = "org.w3c.svg"; + var svg_ns = "http://www.w3.org/2000/svg" + function domTest(evt) { + // Get Document + var target = evt.target; + var doc = target.ownerDocument; + + // Get DOMImplementation + var domImpl = doc.implementation; + + // + // Iterate through the feature strings + // + for(var i=0; i<featureStrings.length; i++){ + var supports = domImpl.hasFeature(featureStrings[i], '2.0'); + // + // if time, pretty up by putting xml to traveral in a left column and + // org.w3c.svg to org.w3c.dom.svg.all in a right column; add an extra + // parameter to addTextElement for x coord, and test if i < 9 + // + addTextElement(featureStrings[i], supports, doc, doc.getElementById("test-body-content"), (50 + 50*i)); + } + } + + function addTextElement(label, value, doc, svg, y){ + var newText = doc.createElementNS(svg_ns, 'text'); + newText.setAttribute('font-size', '30'); + newText.setAttribute('x', '10'); + newText.setAttribute('y', y); + var textValue = label; + var textContent = doc.createTextNode(textValue); + newText.appendChild(textContent); + svg.appendChild(newText); + + newText = doc.createElementNS(svg_ns, 'text'); + newText.setAttribute('font-size', '30'); + newText.setAttribute('x', '370'); + newText.setAttribute('y', y); + textValue = value; + textContent = doc.createTextNode(textValue); + newText.appendChild(textContent); + svg.appendChild(newText); + } + + ]]></script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-dom-04-b-manual.svg b/testing/web-platform/tests/svg/import/struct-dom-04-b-manual.svg new file mode 100644 index 000000000..afc0efeda --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-dom-04-b-manual.svg @@ -0,0 +1,139 @@ +<svg version="1.1" baseProfile="tiny" onload="domTest(evt)" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: struct-dom-04-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#DOMInterfaces"> + <p> + Verify the basic capability to handle the hasFeature DOMImplementation method. + The DOMImplementation instance is retrieved from the Document instance. Then, + its hasFeature method is invoked on the various SVG feature strings. + </p> + <p> + The test displays the set of SVG feature strings and, next to them, a text + string that shows whether the feature is supported or not. + </p> + <p> + Note that this test uses the 'onload' event on the root svg element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image, except for the true and + false values which may differ depending on the implementation. + </p> + <p> + Note that the test passes whether or not the feature is supported (i.e., true or + false are valid). The test fails if no value (true or false) appears next to the feature string + value. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-dom-04-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <script type="text/ecmascript"><![CDATA[ + + var featureStrings = new Array(); + var length = 0; + /* + featureStrings[length++] = "xml"; + featureStrings[length++] = "stylesheets"; + featureStrings[length++] = "views"; + featureStrings[length++] = "css2"; + featureStrings[length++] = "events"; + featureStrings[length++] = "uievents "; + featureStrings[length++] = "mouseevents"; + featureStrings[length++] = "mutationevents"; + featureStrings[length++] = "traversal"; + featureStrings[length++] = "org.w3c.svg"; + */ + featureStrings[length++] = "org.w3c.svg.lang"; + featureStrings[length++] = "org.w3c.svg.dynamic"; + featureStrings[length++] = "org.w3c.svg.static"; + featureStrings[length++] = "org.w3c.dom.svg"; + featureStrings[length++] = "org.w3c.svg"; + /* + featureStrings[length++] = "org.w3c.dom.svg.static"; + featureStrings[length++] = "org.w3c.dom.svg.animation"; + featureStrings[length++] = "org.w3c.dom.svg.dynamic"; + featureStrings[length++] = "org.w3c.svg.all"; + featureStrings[length++] = "org.w3c.dom.svg.all"; + */ + var svg_ns = "http://www.w3.org/2000/svg" + function domTest(evt) { + // Get Document + var target = evt.target; + var doc = target.ownerDocument; + + // Get DOMImplementation + var domImpl = doc.implementation; + + // + // Iterate through the feature strings + // + for(var i=0; i<featureStrings.length; i++){ + var supports = domImpl.hasFeature(featureStrings[i], '2.0'); + // + // if time, pretty up by putting xml to traveral in a left column and + // org.w3c.svg to org.w3c.dom.svg.all in a right column; add an extra + // parameter to addTextElemen t for x coord, and test if i < 9 + // + addTextElement(featureStrings[i], supports, doc, doc.getElementById("test-body-content"), (45 + 40*i)); + } + } + + function addTextElement(label, value, doc, svg, y){ + var newText = doc.createElementNS(svg_ns, 'text'); + newText.setAttribute('font-size', '30'); + newText.setAttribute('x', '5'); + newText.setAttribute('y', y); + var textValue = label; + var textContent = doc.createTextNode(textValue); + newText.appendChild(textContent); + svg.appendChild(newText); + + newText = doc.createElementNS(svg_ns, 'text'); + newText.setAttribute('font-size', '30'); + newText.setAttribute('x', '385'); + newText.setAttribute('y', y); + textValue = value; + textContent = doc.createTextNode(textValue); + newText.appendChild(textContent); + svg.appendChild(newText); + } + + ]]></script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-dom-05-b-manual.svg b/testing/web-platform/tests/svg/import/struct-dom-05-b-manual.svg new file mode 100644 index 000000000..4667a14ef --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-dom-05-b-manual.svg @@ -0,0 +1,137 @@ +<svg version="1.1" baseProfile="basic" onload="domTest(evt)" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: struct-dom-05-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#DOMInterfaces"> + <p> + Verify the basic capability to handle the hasFeature DOMImplementation method. + The DOMImplementation instance is retrieved from the Document instance. Then, + its hasFeature method is invoked on the various SVG feature strings. + </p> + <p> + The test displays the set of SVG feature strings and, next to them, a text + string that shows whether the feature is supported or not. + </p> + <p> + Note that this test uses the 'onload' event on the root svg element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image, except for the true and + false values which may differ depending on the implementation. + </p> + <p> + Note that the test passes whether or not the feature is supported (i.e., true or + false are valid). The test fails if no value (true or false) appears next to the feature string + value. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-dom-05-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <script type="text/ecmascript"><![CDATA[ + + var featureStrings = new Array(); + var length = 0; + /* + featureStrings[length++] = "xml"; + featureStrings[length++] = "stylesheets"; + featureStrings[length++] = "views"; + featureStrings[length++] = "css2"; + featureStrings[length++] = "events"; + featureStrings[length++] = "uievents "; + featureStrings[length++] = "mouseevents"; + featureStrings[length++] = "mutationevents"; + featureStrings[length++] = "traversal"; + featureStrings[length++] = "org.w3c.svg"; + featureStrings[length++] = "org.w3c.svg.lang"; + featureStrings[length++] = "org.w3c.svg.dynamic"; + featureStrings[length++] = "org.w3c.svg.static"; + featureStrings[length++] = "org.w3c.dom.svg"; + featureStrings[length++] = "org.w3c.svg"; + */ + featureStrings[length++] = "org.w3c.dom.svg.static"; + featureStrings[length++] = "org.w3c.dom.svg.animation"; + featureStrings[length++] = "org.w3c.dom.svg.dynamic"; + featureStrings[length++] = "org.w3c.dom.svg.all"; + featureStrings[length++] = "org.w3c.svg.all"; + var svg_ns = "http://www.w3.org/2000/svg" + function domTest(evt) { + // Get Document + var target = evt.target; + var doc = target.ownerDocument; + + // Get DOMImplementation + var domImpl = doc.implementation; + + // + // Iterate through the feature strings + // + for(var i=0; i<featureStrings.length; i++){ + var supports = domImpl.hasFeature(featureStrings[i], '2.0'); + // + // if time, pretty up by putting xml to traveral in a left column and + // org.w3c.svg to org.w3c.dom.svg.all in a right column; add an extra + // parameter to addTextElemen t for x coord, and test if i < 9 + // + addTextElement(featureStrings[i], supports, doc, doc.getElementById("test-body-content"), (45 + 40*i)); + } + } + + function addTextElement(label, value, doc, svg, y){ + var newText = doc.createElementNS(svg_ns, 'text'); + newText.setAttribute('font-size', '30'); + newText.setAttribute('x', '5'); + newText.setAttribute('y', y); + var textValue = label; + var textContent = doc.createTextNode(textValue); + newText.appendChild(textContent); + svg.appendChild(newText); + + newText = doc.createElementNS(svg_ns, 'text'); + newText.setAttribute('font-size', '30'); + newText.setAttribute('x', '385'); + newText.setAttribute('y', y); + textValue = value; + textContent = doc.createTextNode(textValue); + newText.appendChild(textContent); + svg.appendChild(newText); + } + + ]]></script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-dom-06-b-manual.svg b/testing/web-platform/tests/svg/import/struct-dom-06-b-manual.svg new file mode 100644 index 000000000..b9f51cee4 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-dom-06-b-manual.svg @@ -0,0 +1,101 @@ +<svg version="1.1" baseProfile="basic" onload="domTest(evt)" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Vincent Hardy" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: struct-dom-06-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#DOMInterfaces"> + <p> + Verify the basic capability to handle the DOM API. The test is composed of a top + level svg element with an onload event handler. This handler invokes core (i.e., non + SVG specific) DOM API methods to modify the document's content: it removes an element, + modifies an attribute and adds elements. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if the text "DOM API is supported" is shown, the text + "Removing DOM Elements is not supported" is not shown, and no red is + visible.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-dom-06-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <script type="text/ecmascript"><![CDATA[ + + function domTest(evt) { + // Get Document + var target = evt.target; + var doc = target.ownerDocument; + + // + // Test attribute modification + // + var attributeErrorRect = doc.getElementById('attributeErrorRect'); + attributeErrorRect.setAttribute('width', '0') + attributeErrorRect.setAttribute('height', '0'); + + // + // Test removing element from DOM tree + // + var elementErrorText = doc.getElementById('elementErrorText'); + var parent = elementErrorText.parentNode; + parent.removeChild(elementErrorText); + + // + // Test adding element to the DOM tree + // + var svg_ns = "http://www.w3.org/2000/svg" + var newText = doc.createElementNS(svg_ns, 'text'); + newText.setAttribute('x', '50'); + newText.setAttribute('y', '200'); + var textContent = doc.createTextNode('DOM API is supported'); + newText.appendChild(textContent); + parent.appendChild(newText); + } + + ]]></script> + <!-- ===================================================================== --> + <!-- The following rectangle's color is red. It is modified to zero size --> + <!-- in the 'domTest' ECMAScript handler. --> + <!-- ===================================================================== --> + <rect id="attributeErrorRect" width="450" height="450" fill="red"/> + <!-- ===================================================================== --> + <!-- The following text element is removed from the document in the --> + <!-- 'domTest' ECMAScript handler. --> + <!-- ===================================================================== --> + <text id="elementErrorText" x="50" y="200" font-family="Verdana" font-size="30" fill="black"> + Removing DOM Elements is not supported + </text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-dom-07-f-manual.svg b/testing/web-platform/tests/svg/import/struct-dom-07-f-manual.svg new file mode 100644 index 000000000..0c212849f --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-dom-07-f-manual.svg @@ -0,0 +1,90 @@ +<svg version="1.1" baseProfile="full" onload="init();" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AQ" author="ED" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: struct-dom-07-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#DOMInterfaces"> + <p> + The svg contains three use elements that each reference three rects from an svg element in the document. + Before the onload-script is run there should be 9 red rects visible. The script changes the fill of the rects to be green. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if 9 green rectangles are shown. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-dom-07-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <script><![CDATA[ + function init() + { + var use = document.getElementById("use-elm"); + var firstElementChild = use.instanceRoot.firstChild; + + // Get the <g> elements SVGElementInstance + while(firstElementChild.correspondingElement.nodeType != Node.ELEMENT_NODE) + firstElementChild = firstElementChild.nextSibling; + + // the childnodes of the g element shadowtree + var childNodes = firstElementChild.childNodes; + for(var i = 0; i < childNodes.length; i++) + { + var item = childNodes.item(i); + if(item.correspondingElement.nodeType == Node.ELEMENT_NODE) + { + item.correspondingElement.setAttribute("fill", "green"); + } + } + } + ]]></script> + <defs> + <svg xmlns:xlink="http://www.w3.org/1999/xlink" id="svg-sub-root" viewBox="0 0 450 450"> + <g id="drawRects" fill="red" stroke="black" stroke-width="5"> + <rect x="225" y="0" width="225" height="225"/> + <rect x="0" y="225" width="225" height="225"/> + <rect x="225" y="225" width="225" height="225"/> + </g> + </svg> + </defs> + + <g transform="translate(100,30)"> + <use id="use-elm" x="60" y="50" width="240" height="240" transform="translate(50,50) scale(0.4)" xlink:href="#svg-sub-root"/> + <use id="use-elm-2" x="60" y="50" width="240" height="240" transform="scale(0.4)" xlink:href="#svg-sub-root"/> + <use id="use-elm-3" width="450" height="450" transform="translate(124,120) scale(0.213333)" xlink:href="#drawRects"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="black"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-dom-08-f-manual.svg b/testing/web-platform/tests/svg/import/struct-dom-08-f-manual.svg new file mode 100644 index 000000000..fd248ce7a --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-dom-08-f-manual.svg @@ -0,0 +1,84 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="DAS" author="CM" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: struct-dom-08-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/[chapter]"> + <p> + This tests that SVGSVGElement.unsuspendRedraw() does not + throw an exception if the redraw suspend timeout has elapsed. + After loading the test, wait for one second. Some time + before the one second has elapsed, the rectangle should change + color to indicate the result of the test: black if the test + did not run, red if the test failed and green if the test + passed. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the rectangle is green one + second after the test is loaded. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-dom-08-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text x='10' y='50'>Test that unsuspendRedraw() doesn't throw</text> + <rect id='r' x='10' y='60' width='50' height='50'/> + + <script> + var id, svg = document.documentElement; + + function begin() { + id = svg.suspendRedraw(10); + window.setTimeout("end()", 1000); + } + + function end() { + try { + svg.unsuspendRedraw(id); + document.getElementById('r').setAttribute('fill', 'green'); + return; + } catch (e) { + } + document.getElementById('r').setAttribute('fill', 'red'); + } + + begin(); + </script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-dom-11-f-manual.svg b/testing/web-platform/tests/svg/import/struct-dom-11-f-manual.svg new file mode 100644 index 000000000..869f8c54e --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-dom-11-f-manual.svg @@ -0,0 +1,168 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CM" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: struct-dom-11-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#InterfaceSVGSVGElement"> + <p> + This tests that the getIntersectionList() and getEnclosureList() + methods return NodeLists that are not live. + </p> + <p> + After loading the test, two rectangles will be presented. The + upper rectangle indicates the result of testing whether + getIntersectionList() returns a non-live NodeList, while the + lower rectangle indicates so for getEnclosureList(). + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if both rectangles are green. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-dom-11-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text x='10' y='40' font-size='13'>Test getIntersectionList and getEnclosureList return value liveness</text> + + <rect id='r1' x='10' y='70' width='50' height='50' fill='black'/> + <text x='70' y='100'>getIntersectionList</text> + + <rect id='r2' x='10' y='130' width='50' height='50' fill='black'/> + <text x='70' y='160'>getEnclosureList</text> + + <g id="g1" visibility="hidden" pointer-events="painted"> + <circle id='c1' cx='305' cy='100' r='5'/> + <circle id='c2' cx='305' cy='150' r='5'/> + </g> + + <script><![CDATA[ + function userspace2viewport(elm, r) + { + var ctm = elm.getCTM(); + + var corners = []; + for(var i = 0; i < 4; i++) + corners.push(svg.createSVGPoint()); + + corners[0].x = r.x; + corners[0].y = r.y; + corners[1].x = r.x + r.width; + corners[1].y = r.y; + corners[2].x = r.x + r.width; + corners[2].y = r.y + r.height; + corners[3].x = r.x; + corners[3].y = r.y + r.height; + + for(var i = 0; i < 4; i++) + corners[i] = corners[i].matrixTransform(ctm); + + var min = svg.createSVGPoint(); + var max = svg.createSVGPoint(); + min.x = corners[0].x; + min.y = corners[0].y; + max.x = corners[0].x; + max.y = corners[0].y; + + for(var i = 1; i < 4; i++) + { + var x = corners[i].x; + var y = corners[i].y; + + if(x < min.x) + min.x = x; + else if(x > max.x) + max.x = x; + + if(y < min.y) + min.y = y; + else if(y > max.y) + max.y = y; + } + + var res = svg.createSVGRect(); + res.x = min.x; + res.y = min.y; + res.width = max.x - min.x; + res.height = max.y - min.y; + return res; + } + + var svg = document.documentElement, + c = document.getElementById('c'), + r1 = document.getElementById('r1'), + r2 = document.getElementById('r2'), + c1 = document.getElementById('c1'), + c2 = document.getElementById('c2'), + g1 = document.getElementById('g1'), + r = svg.createSVGRect(), + nl; + + try { + r.x = 300; + r.y = 95; + r.width = 5; + r.height = 5; + + r = userspace2viewport(g1, r); + + nl = svg.getIntersectionList(r, null); + if (nl && nl.length == 1) { + c1.parentNode.removeChild(c1); + r1.setAttribute('fill', nl.length == 1 ? 'lime' : 'red'); + } + } catch (e) { + } + + try { + r.x = 290; + r.y = 135; + r.width = 20; + r.height = 20; + + r = userspace2viewport(g1, r); + + nl = svg.getEnclosureList(r, null); + if (nl && nl.length == 1) { + c2.parentNode.removeChild(c2); + r2.setAttribute('fill', nl.length == 1 ? 'lime' : 'red'); + } + } catch (e) { + } + ]]></script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-dom-12-b-manual.svg b/testing/web-platform/tests/svg/import/struct-dom-12-b-manual.svg new file mode 100644 index 000000000..c5746ff3e --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-dom-12-b-manual.svg @@ -0,0 +1,94 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AN" author="AQ" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: struct-dom-12-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#DOMInterfaces"> + <p> + This test checks two properties from the SVGElementInstance interface, correspondingElement and correspondingUseElement + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Click the grey rectangle on the right side. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + For the test to pass, both lines starting with "Test for" must turn to green + when the grey rectangle on the right side is clicked, and the grey rectangle + must also turn green. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-dom-12-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <defs> + <rect id="reference" x="240" y="1" width="239" height="358"/> + <script type="text/ecmascript"><![CDATA[ + function test (event) { + + // get pointers to use and reference elements + var reference = document.getElementById('reference'); + var use = document.getElementById('use'); + + // initialize the pass count and colors + var pass = 0; + var colors = ['red', 'orange', 'green']; + + // event.target.correspondingUseElement test + if (event.target.correspondingUseElement === use) { + document.getElementById('assertion_1').setAttributeNS(null, 'fill', 'green'); + pass++; + } + + // event.target.correspondingElement test + if (event.target.correspondingElement === reference) { + document.getElementById('assertion_2').setAttributeNS(null, 'fill', 'green'); + pass++; + } + + // show the result + use.setAttributeNS(null, 'fill', colors[pass]); + } + + + ]]></script> + </defs> + + <use id="use" xlink:href="#reference" onclick="test(evt)" fill="grey"/> + + <text transform="translate(5,20)">Click on the grey rectangle to start</text> + <text id="assertion_1" fill="red" transform="translate(5,80)">Test for correspondingUseElement</text> + <text id="assertion_2" fill="red" transform="translate(5,110)">Test for correspondingElement</text> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-dom-13-f-manual.svg b/testing/web-platform/tests/svg/import/struct-dom-13-f-manual.svg new file mode 100644 index 000000000..028288e6a --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-dom-13-f-manual.svg @@ -0,0 +1,167 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" onload="test()"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="ED" status="empty" + version="$Revision: 1.4 $" testname="$RCSfile: struct-dom-13-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/[chapter]#[section]"> + <p> + Test for checkIntersection and getIntersectionList. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test passes if 17 green rectangles are displayed and if the legend indicates PASSED. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-dom-13-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <style type="text/css"> + .passed { fill: lime } + .failed { fill: red } + .result { font: 9px monospace; fill: black } + </style> + </defs> + + <g visibility="hidden"> + <circle id="c1" cx="40" cy="40" r="10" fill="blue" stroke="lime"/> + <circle id="c2" cx="10" cy="50" r="10" fill="red" stroke="lime"/> + <circle id="c3" cx="20" cy="20" r="20" fill="green" stroke="lime"/> + <line id="l1" x1="5" y1="5" x2="40" y2="20" stroke="black"/> + <line id="l2" x1="20" y1="20" x2="40" y2="30" stroke="red"/> + + <rect id="r1" x="10" y="10" width="50" height="50" fill="none" stroke="red"/> + + <circle id="c4" cx="80" cy="50" r="10" fill="yellow"/> + </g> + + <script><![CDATA[ + var ypos = 100; + + function verify(str, result) + { + var g = document.createElementNS("http://www.w3.org/2000/svg", "g"); + var r = document.createElementNS("http://www.w3.org/2000/svg", "rect"); + var t = document.createElementNS("http://www.w3.org/2000/svg", "text"); + t.textContent = str + ": " + (result ? "PASSED" : "FAILED"); + t.setAttribute("class", "result"); + t.setAttribute("x", "10"); + t.setAttribute("y", "7"); + r.setAttribute("y", "1"); + r.setAttribute("width", "5"); + r.setAttribute("height", "5"); + g.setAttribute("class", result ? "passed" : "failed"); + g.appendChild(r); + g.appendChild(t); + g.setAttribute("transform", "translate(280 " + ypos + ")"); + ypos += 10; + document.getElementById("test-body-content").appendChild(g); + } + + function test() + { + var root = document.documentElement; //document.getElementById("test-root"); + var rect = root.createSVGRect(); + rect.x = 10; + rect.y = 10; + rect.width = 50; + rect.height = 50; + + var tests = { "c1" : true, "c2" : true, "c3" : true, "l1" : true, "l2" : true, "r1" : true, "c4" : false }; + + verify("checkIntersection", root.checkIntersection); + + if(root.checkIntersection) + { + for(var test in tests) + { + try + { + var elm = document.getElementById(test); + var result = root.checkIntersection(elm, rect); + + verify(test, result == tests[test]); + } + catch(e) + { + verify(test, false); + } + } + } + + verify("getIntersectionList", root.getIntersectionList); + + if(root.getIntersectionList) + { + var expected = [ "c1", "c2", "c3", "l1", "l2", "r1" ]; + try + { + var list = root.getIntersectionList(rect, null); + verify("call", true); + } + catch(e) + { + verify("call", false); + } + + try + { + verify("length", expected.length == list.length); + } + catch(e) + { + verify("length", false); + } + + for(var i = 0; i < expected.length; i++) + { + var elm = document.getElementById(expected[i]); + try + { + verify("has " + expected[i], elm === list.item(i)) + } + catch(e) + { + verify("has " + expected[i], false); + } + } + } + } + + ]]></script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-dom-14-f-manual.svg b/testing/web-platform/tests/svg/import/struct-dom-14-f-manual.svg new file mode 100644 index 000000000..1f0bb8625 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-dom-14-f-manual.svg @@ -0,0 +1,112 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" onload="runTest()"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="ED" status="accepted" + version="$Revision: 1.4 $" testname="$RCSfile: struct-dom-14-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#InterfaceSVGElementInstance"> + <p> + Test SVGElementInstance.childNodes. + </p> + <p> + The test has an optional subtest that indicates whether SVGElementInstance.firstChild and + SVGElementInstance.childNodes.item(0) are strictly equal. The status of this subtest is + displayed by a circle in the middle of the testframe, it will be yellow if the objects are + not strictly equal, and green if they are. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there is a green rect visible, + and there is a yellow or dark green circle in the middle. + If there's any red visible the test has failed. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-dom-14-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <defs> + <g id="defsg1"> + <circle id="defscircle3" cx="80" cy="180" r="25"/> + <circle id="defscircle4" cx="1000" cy="180" r="25"/> + <use xlink:href="#defscircle4" transform="translate(-600, 0)"/> + </g> + <script> + <![CDATA[ + function runTest() + { + try + { + var use = document.getElementById("use1"); + var instanceroot = use.instanceRoot; + + if (instanceroot.firstChild.correspondingElement !== instanceroot.childNodes.item(0).correspondingElement) + throw("failed"); + if (instanceroot.firstChild.nextSibling.correspondingElement !== instanceroot.childNodes.item(1).correspondingElement) + throw("failed"); + if (instanceroot.lastChild.correspondingElement !== instanceroot.childNodes.item(instanceroot.childNodes.length-1).correspondingElement) + throw("failed"); + + // indicate test passed + document.getElementById("status").setAttribute("fill", "lime"); + + // This is an optional part of the test, which indicates whether SVGElementInstance(List) follows the normal DOM NodeList conventions and + // whether the returned objects are actually the same objects as those that the SVGElementInstance traversal attributes return. + if (instanceroot.firstChild !== instanceroot.childNodes.item(0)) + throw("failed"); + if (instanceroot.firstChild.nextSibling !== instanceroot.childNodes.item(1)) + throw("failed"); + if (instanceroot.lastChild !== instanceroot.childNodes.item(instanceroot.childNodes.length-1)) + throw("failed"); + + // indicate status of the optional part of the test + document.getElementById("optional").setAttribute("fill", "green"); + } + catch(e) + { + } + } + ]]> + </script> + </defs> + + <use id="use1" xlink:href="#defsg1"/> + + <rect id="status" width="100%" height="100%" fill="red"/> + <circle id="optional" cx="50%" cy="50%" r="10%" fill="yellow"/> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-dom-15-f-manual.svg b/testing/web-platform/tests/svg/import/struct-dom-15-f-manual.svg new file mode 100644 index 000000000..b5329b690 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-dom-15-f-manual.svg @@ -0,0 +1,139 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" onload="runTest()"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="ED" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: struct-dom-15-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#InterfaceSVGElementInstance"> + <p> + Test SVGElementInstance and EventTarget.dispatchEvent. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there are three green circles visible, and no red. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-dom-15-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <defs> + <circle id="defscircle1" cx="240" cy="180" r="25" onclick="verifyDefs1(evt)" fill="red"/> + <circle id="defscircle2" cx="240" cy="180" r="25" onclick="verifyDefs2(evt)" fill="red"/> + + <script><![CDATA[ + function verifyDefs1(e) + { + var dc = document.getElementById("defscircle1"); + if (e.target === e.currentTarget && // Assertion: the target and currentTarget are the same + e.target === dc) // Assertion: the target is the 'circle' element since we dispatched the event directly to it, not to an SVGElementInstance + { + dc.setAttribute("fill", "lime"); + } + } + + // checks that event.target and event.currentTarget point to an SVGElementInstance (the instanceRoot) + function verifyDefs2(e) + { + var instance = document.getElementById("use2").instanceRoot; + if (e.target === e.currentTarget && // Assertion: the target and currentTarget are the same + e.target === instance) // Assertion: the target is SVGElementInstance corresponding to the 'circle' element with id="defscircle2", since we dispatched the event to that instance + { + instance.correspondingElement.setAttribute("fill", "lime"); + } + } + + function verify(e) + { + var c = document.getElementById("circle"); + if (e.target === e.currentTarget && // Assertion: the target and currentTarget are the same + e.target === c) // Assertion: the target is the 'circle' element since we dispatched the event directly to it + { + c.setAttribute("fill", "lime"); + } + } + + function dispatchMouseClick(target) + { + var mouseevent = document.createEvent("MouseEvents"); + mouseevent.initMouseEvent("click", + true, // canbubble + true, // cancellable + document.defaultView, // the AbstractView + 1, // mouseclick count + 0, // screen x coordinate + 0, // screen y coordinate + 0, // client x coordinate + 0, // client y coordinate + false, // ctrlKey + false, // altKey + false, // shiftKey + false, // metaKey + 0, // mousebutton + null); // related target + target.dispatchEvent(mouseevent); + } + + function runTest() + { + // test simple circle inside <defs> + try { + var defsCircle = document.getElementById("defscircle1"); + dispatchMouseClick(defsCircle); + } catch(e) {} + + // test SVGElementInstance + try { + var elementInstance2 = document.getElementById("use2").instanceRoot; + dispatchMouseClick(elementInstance2); + } catch(e) {} + + // test simple circle outside of <defs> + try { + var circle = document.getElementById("circle"); + dispatchMouseClick(circle); + } catch(e) {} + } + ]]></script> + </defs> + + <circle id="circle" cx="240" cy="180" r="25" onclick="verify(evt)" fill="red"/> + + <use id="use1" xlink:href="#defscircle1" transform="translate(80,0)"/> + <use id="use2" xlink:href="#defscircle2" transform="translate(-80,0)"/> + <use id="use3" xlink:href="#defsg1"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-dom-16-f-manual.svg b/testing/web-platform/tests/svg/import/struct-dom-16-f-manual.svg new file mode 100644 index 000000000..7747c72f0 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-dom-16-f-manual.svg @@ -0,0 +1,128 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="[reviewer]" author="Microsoft" status="created" version="$Revision: 1.5 $" testname="$RCSfile: struct-dom-16-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/struct.html#InterfaceSVGSVGElement"> + <p> + The 'SVGSVGElement' interface allows for creation of references to various primitive SVG interface types with explicitly defined default values. + </p> + <p> + A reference to an 'SVGSVGElement' is obtained through an 'svg' element in the page's markup. Each of the 'CreateSVG*' methods is called from this + reference and initial values are verified. A counter is used to determine whether all conditions are satisfied. The word 'fail' in red via an SVG + 'text' element is used to indicate failure and the word 'pass' in black is used to indicate passing. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-dom-16-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-size="18"> + <svg id="testSVG" /> + <text id="failText" x="350" y="350" font-size="50" fill="red">FAIL</text> + <text id="passText" x="350" y="300" font-size="50" display="none">PASS</text> + <script type="text/javascript"> + <![CDATA[ + try + { + var passCount = 0; + var testSVG = document.getElementById("testSVG"); + + var testSVGNumber = testSVG.createSVGNumber(); + if (0 == testSVGNumber.value) + { + passCount++; + } + + var testSVGLength = testSVG.createSVGLength(); + if (0 == testSVGLength.value) + { + passCount++; + } + + var testSVGAngle = testSVG.createSVGAngle(); + if (0 == testSVGAngle.value) + { + passCount++; + } + + var testSVGPoint = testSVG.createSVGPoint(); + if (0 == testSVGPoint.x && 0 == testSVGPoint.y) + { + passCount++; + } + + var testSVGMatrix = testSVG.createSVGMatrix(); + if (1 == testSVGMatrix.a && 0 == testSVGMatrix.b && 0 == testSVGMatrix.c && 1 == testSVGMatrix.d && 0 == testSVGMatrix.e && 0 == testSVGMatrix.f) + { + passCount++; + } + + var testSVGRect = testSVG.createSVGRect(); + if (0 == testSVGRect.x && 0 == testSVGRect.y && 0 == testSVGRect.width && 0 == testSVGRect.height) + { + passCount++; + } + + var testSVGTransform = testSVG.createSVGTransform(); + if (1 == testSVGTransform.type && 0 == testSVGTransform.angle && 1 == testSVGTransform.matrix.a && 0 == testSVGTransform.matrix.b && 0 == testSVGTransform.matrix.c && 1 == testSVGTransform.matrix.d && 0 == testSVGTransform.matrix.e && 0 == testSVGTransform.matrix.f) + { + passCount++; + } + + var testSVGTransformFromMatrix = testSVG.createSVGTransformFromMatrix(testSVGMatrix); + if (1 == testSVGTransformFromMatrix.type && 0 == testSVGTransformFromMatrix.angle && 1 == testSVGTransformFromMatrix.matrix.a && 0 == testSVGTransformFromMatrix.matrix.b && 0 == testSVGTransformFromMatrix.matrix.c && 1 == testSVGTransformFromMatrix.matrix.d && 0 == testSVGTransformFromMatrix.matrix.e && 0 == testSVGTransformFromMatrix.matrix.f) + { + passCount++; + } + + if (8 == passCount) + { + document.getElementById("failText").setAttribute("display", "none"); + document.getElementById("passText").setAttribute("display", "inline"); + } + } + catch(ex) + { + alert("ERROR: " + ex.message); + + } + ]]> + + </script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-dom-17-f-manual.svg b/testing/web-platform/tests/svg/import/struct-dom-17-f-manual.svg new file mode 100644 index 000000000..26121e794 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-dom-17-f-manual.svg @@ -0,0 +1,104 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="CM" author="Microsoft" status="reviewed" version="$Revision: 1.3 $" testname="$RCSfile: struct-dom-17-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/struct.html#InterfaceSVGSVGElement"> + <p> + Tests that the 'getElementById' method for the 'SVGSVGElement' interface is scoped. + </p> + <p> + Two subtrees of 'svg' elements are used, each with 'rect' elements as children. A reference to the first 'svg' element is obtained via the + 'document' element's 'getElementById' method. This reference is used to verify the presence of 'getElementId'. Next, 'getElementById' on + the 'SVGSVGElement' reference is used to locate its child element. Then, 'getElementById' attempts to get an element in a neighboring subtree. + Finally, an element at the sibling level is attempted to be accessed via 'getElementById'. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-dom-17-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <svg id="svgTree1"> + <rect id="subElem1" /> + </svg> + <svg id="svgTree2"> + <rect id="subElem2" /> + </svg> + <rect id="siblingElem1" /> + <g transform="translate(320,350)" font-size="50"> + <text id="failText" fill="red">FAIL</text> + <text id="passText" fill="green" display="none">PASS</text> + </g> + <script type="text/javascript"><![CDATA[ + try + { + var passedCount = 0; + var svgTree1 = document.getElementById("svgTree1"); + + // Test support for "getElementById" on svgTree1 + var subElem1 = svgTree1.getElementById("subElem1"); + if (null != subElem1) + { + passedCount++; + } + + if ("subElem1" == subElem1.id) + { + passedCount++; + } + + // Test that "getElementById" on svgTree1 can't access children in other subtrees + if (null == svgTree1.getElementById("subElem2")) + { + passedCount++; + } + + // Test that "getElementById" on svgTree1 can't access elements that are not its children + if (null == svgTree1.getElementById("siblingElem1")) + { + passedCount++; + } + + if (4 == passedCount) + { + document.getElementById("failText").setAttribute("display", "none"); + document.getElementById("passText").setAttribute("display", "inline"); + } + } + catch(ex) + { + // alert('ERROR: ' + ex.message); + }]]> + </script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-dom-18-f-manual.svg b/testing/web-platform/tests/svg/import/struct-dom-18-f-manual.svg new file mode 100644 index 000000000..27977a221 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-dom-18-f-manual.svg @@ -0,0 +1,147 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="[reviewer]" author="Microsoft" status="created" version="$Revision: 1.4 $" testname="$RCSfile: struct-dom-18-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/struct.html#InterfaceSVGSVGElement"> + <p> + <!--[[ + The 'SVGSVGElement' supports 'getIntersectionList' and 'getEnclosureList' with all renderable elements. + ]]--> + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + <!--[[ + Markup for an instance of each renderable SVG element is placed in an 'svg' element. The 'getIntersectionList' and 'getEnclosureList' + methods are called from a reference to the parent 'svg' element. For 'getIntersectionList', an 'SVGRect' is used with 'x', 'y', 'width', + and 'height' attributes set to intersect each of the renderable elements. For 'getEnclosureList', the same 'SVGRect' is modified to + completely enclose all of the renderable elements. For both 'getIntersectionList' and 'getEnclosureList', the returned 'NodeList' element + is iterated through and each element is verified through their respective 'id' attributes. For the 'use' element, the 'correspondingUseElement' + attribute must be used because an 'SVGElementInstance' reference is obtained via 'getEnclosureList' and 'getIntersectionList'. + ]]--> + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + <!--[[ + Test passes if there is no red visible on the page. + ]]--> + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-dom-18-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <svg id="testSVG"> + <circle cx="96" cy="96" r="48" id="testCircle" /> + <ellipse cx="96" cy="96" rx="48" ry="48" id="testEllipse" /> + <line x1="10" y1="10" x2="10" y2="100" stroke="black" id="testLine" /> + <path d="M0 10 H 100" stroke-width="5" stroke="black" fill="none" id="testPath" /> + <polyline points="0,0 120,100 120,120" stroke="black" fill="black" id="testPolyline" /> + <polygon points="0,0 100,100" stroke="black" fill="black" id="testPolygon" /> + <rect width="96" height="96" id="testRect" /> + <use xlink:href="#testRect" id="testUse" /> + <image xlink:href="../images/black10x10.png" width="100" height="100" id="testImage" /> + <text x="100" y="100" fill="black" id="testText">Filler text</text> + </svg> + <text id="failText" x="350" y="350" font-size="50" fill="red">FAIL</text> + <script type="text/javascript"><![CDATA[ + try + { + var passedCount = 0; + var expectedIDList = ["testCircle", "testEllipse", "testLine", "testPath", "testPolyline", "testPolygon", "testRect", "testUse", "testImage", "testText"]; + var testSVG = document.getElementById("testSVG"); + var rectElem = testSVG.createSVGRect(); + + rectElem.x = 10; + rectElem.y = 0; + rectElem.width = 130; + rectElem.height = 98; + + var intersectionList = testSVG.getIntersectionList(rectElem, null); + + if (null != intersectionList && expectedIDList.length == intersectionList.length) + { + passedCount++; + } + + for (var i = 0; i < intersectionList.length; i++) + { + var curIntersection = intersectionList[i]; + var curExpectedId = expectedIDList[i]; + + if (curExpectedId == curIntersection.id) + { + passedCount++; + } + // Special case for "use" and SVGElementInstance + else if (null != curIntersection.correspondingUseElement && curExpectedId == curIntersection.correspondingUseElement.id) + { + passedCount++; + } + } + + rectElem.x = 0; + rectElem.y = 0; + rectElem.width = 200; + rectElem.height = 200; + + var enclosureList = testSVG.getEnclosureList(rectElem, null); + + if (null != enclosureList && expectedIDList.length == enclosureList.length) + { + passedCount++; + } + + for (var i = 0; i < enclosureList.length; i++) + { + var curEnclosure = enclosureList[i]; + var curExpectedId = expectedIDList[i]; + + if (curExpectedId == curEnclosure.id) + { + passedCount++; + } + // Special case for "use" and SVGElementInstance + else if (null != curEnclosure.correspondingUseElement && curExpectedId == curEnclosure.correspondingUseElement.id) + { + passedCount++; + } + } + + if (22 == passedCount) + { + document.getElementById("failText").setAttribute("display", "none"); + } + } + catch(ex) + { + // alert('ERROR: ' + ex.message); + }]]> + </script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-dom-19-f-manual.svg b/testing/web-platform/tests/svg/import/struct-dom-19-f-manual.svg new file mode 100644 index 000000000..839a202ef --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-dom-19-f-manual.svg @@ -0,0 +1,92 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="CM" author="Microsoft" status="reviewed" version="$Revision: 1.3 $" testname="$RCSfile: struct-dom-19-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/struct.html#InterfaceSVGElementInstanceList"> + <p> + Test that the 'SVGElementInstanceList' element's 'length' attribute correctly reflects the implied element hierarchy on recursive 'use' instances. + </p> + <p> + The test has a 'use' element referencing a 'g' element with another 'use' element referencing the 'use' element. The 'instanceRoot' of the + most indirect 'use' element is used to access the corresponding 'SVGElementInstance'. The test passes if the 'childNodes' attribute's 'length' + attribute for the most indirect 'SVGElementInstance' has a value of '1' and the 'childNodes' attribute's 'length' attribute for the most direct + 'SVGElementInstance' has a value of '0'. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-dom-19-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <rect id="testElem" /> + <use xlink:href="#testElem" id="testUse1" /> + <use xlink:href="#testUse1" id="testUse2" /> + <g transform="translate(100,100)" font-size="80"> + <text id="failText" fill="red">FAIL</text> + <text id="passText" fill="green" display="none">PASS</text> + </g> + <script type="text/javascript"><![CDATA[ + try + { + var passedCount = 0; + var testInstanceRoot1 = document.getElementById("testUse1").instanceRoot; + var testInstanceRoot2 = document.getElementById("testUse2").instanceRoot; + + if (0 == testInstanceRoot1.childNodes.length) + { + passedCount++; + } + + if (1 == testInstanceRoot2.childNodes.length) + { + passedCount++; + } + + if (2 == passedCount) + { + document.getElementById("failText").setAttribute("display", "none"); + document.getElementById("passText").setAttribute("display", "inline"); + } + } + catch(ex) + { + + //alert('ERROR: ' + ex.message); + + }]]> + </script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-dom-20-f-manual.svg b/testing/web-platform/tests/svg/import/struct-dom-20-f-manual.svg new file mode 100644 index 000000000..09018aea5 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-dom-20-f-manual.svg @@ -0,0 +1,139 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" onload="runTest()"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="ED" status="created" + version="$Revision: 1.2 $" testname="$RCSfile: struct-dom-20-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#InterfaceSVGElementInstance"> + <p> + Test SVGElementInstance and EventTarget.dispatchEvent. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there are two green circles visible, and no red. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-dom-20-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <defs> + <g id="defsg1" onclick="verifyDefs3(evt)"> + <circle id="defscircle3" cx="80" cy="180" r="25" fill="red"/> + <use id="defsuse1" xlink:href="#defscircle4" transform="translate(-600, 0)" onclick="verifyDefs4(evt)"/> + </g> + <circle id="defscircle4" cx="1000" cy="180" r="25" fill="red"/> + + <script><![CDATA[ + function verifyDefs3(e) + { + var instance = document.getElementById("use3").instanceRoot; + var dc3instance = instance.firstChild.nextSibling; + if (e.target != e.currentTarget && // Assertion: the target and currentTarget are different since the event bubbled + e.target === dc3instance && // Assertion: the event was dispatched to the correct EventTarget + e.currentTarget === instance) // Assertion: the event bubbled up to the SVGElementInstance corresponding to the element with id="defsg1" + { + dc3instance.correspondingElement.setAttribute("fill", "lime"); + } + } + + function verifyDefs4(e) + { + var useElement = document.getElementById("use3"); + var nestedUseInstance = useElement.instanceRoot.childNodes.item(3); + var instanceNestedCircle = nestedUseInstance.childNodes.item(0); + if (e.target != e.currentTarget && // Assertion: the target and currentTarget are different since the event bubbled + e.target === instanceNestedCircle && // Assertion: the event was dispatched to the correct EventTarget + e.currentTarget === nestedUseInstance && // Assertion: the event bubbled up to the SVGElementInstance corresponding to the element with id="defsuse1" + instanceNestedCircle.parentNode === nestedUseInstance && // Assertion: the parentNode is the SVGElementInstance of the 'use' that referenced the circle + instanceNestedCircle.correspondingUseElement === useElement) // Assertion: When 'use' elements are nested then the correspondingUseElement is the outermost 'use' + { + document.getElementById("defscircle4").setAttribute("fill", "lime"); + } + } + + function verify(e) + { + var c = document.getElementById("circle"); + if (e.target === e.currentTarget && // Assertion: the target and currentTarget are the same + e.target === c) // Assertion: the target is the 'circle' element since we dispatched the event directly to it + { + c.setAttribute("fill", "lime"); + } + } + + function dispatchMouseClick(target) + { + var mouseevent = document.createEvent("MouseEvents"); + mouseevent.initMouseEvent("click", + true, // canbubble + true, // cancellable + document.defaultView, // the AbstractView + 1, // mouseclick count + 0, // screen x coordinate + 0, // screen y coordinate + 0, // client x coordinate + 0, // client y coordinate + false, // ctrlKey + false, // altKey + false, // shiftKey + false, // metaKey + 0, // mousebutton + null); // related target + target.dispatchEvent(mouseevent); + } + + function runTest() + { + // test bubbling click + try { + var instanceCircle = document.getElementById("use3").instanceRoot.firstChild.nextSibling; + dispatchMouseClick(instanceCircle); + } catch(e) {} + + // test nested use with bubbling click + try { + var nestedUseInstance = document.getElementById("use3").instanceRoot.childNodes.item(3); + var instanceNestedCircle = nestedUseInstance.childNodes.item(0); + dispatchMouseClick(instanceNestedCircle); + } catch(e) {} + } + ]]></script> + </defs> + + <use id="use3" xlink:href="#defsg1"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-frag-01-t-manual.svg b/testing/web-platform/tests/svg/import/struct-frag-01-t-manual.svg new file mode 100644 index 000000000..6fe9bcc33 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-frag-01-t-manual.svg @@ -0,0 +1,49 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Tim Thompson" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: struct-frag-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#NewDocument"> + <p> + This is an empty SVG document. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Nothing should be rendered by the User Agent. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-frag-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + </g> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-frag-02-t-manual.svg b/testing/web-platform/tests/svg/import/struct-frag-02-t-manual.svg new file mode 100644 index 000000000..c52f89469 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-frag-02-t-manual.svg @@ -0,0 +1,68 @@ +<svg version="1.1" baseProfile="tiny" preserveAspectRatio="none" id="svg-root" + width="100%" height="100%" viewBox="100 100 100 100" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: struct-frag-02-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#NewDocument"> + <p> + This test validates the use of the preserveAspectRatio attribute on the + root svg element in an SVG Tiny document. In this document, preserveAspectRatio + is set to none and the width and height of the document set to 100%. + </p> + <p> + The document's viewBox is defined to be 100 by 100 with an origin + in (100, 100). The content is made of 2 red squares and 2 + orange circles. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Because preserveAspectRatio is set to 'none', the content should + appear distorted (if the aspect ratio is not 1): squares show as rectangles and circles show as + ellipses. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-frag-02-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <rect x="100" y="100" width="50" height="50" fill="rgb(220, 20, 60)"/> + <rect x="150" y="150" width="50" height="50" fill="rgb(220, 20, 60)"/> + + <circle cx="125" cy="175" r="25" fill="rgb(255, 215, 0)"/> + <circle cx="175" cy="125" r="25" fill="rgb(255, 215, 0)"/> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="100" y="100" width="100" height="100" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-frag-03-t-manual.svg b/testing/web-platform/tests/svg/import/struct-frag-03-t-manual.svg new file mode 100644 index 000000000..9d73f8b1e --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-frag-03-t-manual.svg @@ -0,0 +1,66 @@ +<svg version="1.1" baseProfile="tiny" preserveAspectRatio="xMidYMid meet" id="svg-root" + width="100%" height="100%" viewBox="100 100 100 100" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: struct-frag-03-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#NewDocument"> + <p> + This test validates the use of the preserveAspectRatio attribute on the + root svg element in an SVG Tiny document. In this document, preserveAspectRatio + is set to 'xMidYMid meet' and the width and height of the document set to 100%. + </p> + <p> + The document's viewBox is defined to be 100 by 100 with an origin + in (100, 100). The content is made of 2 red squares and 2 + orange circles. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Because preserveAspectRatio is set to 'xMidYMid meet', the content should + appear centered within the viewport: squares show as squares (and not + rectangles) and circles show as circles (and not ellipses). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-frag-03-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <rect x="100" y="100" width="50" height="50" fill="rgb(220, 20, 60)"/> + <rect x="150" y="150" width="50" height="50" fill="rgb(220, 20, 60)"/> + + <circle cx="125" cy="175" r="25" fill="rgb(255, 215, 0)"/> + <circle cx="175" cy="125" r="25" fill="rgb(255, 215, 0)"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="100" y="100" width="100" height="100" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-frag-04-t-manual.svg b/testing/web-platform/tests/svg/import/struct-frag-04-t-manual.svg new file mode 100644 index 000000000..bd2fdc7e9 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-frag-04-t-manual.svg @@ -0,0 +1,64 @@ +<svg version="1.1" baseProfile="tiny" preserveAspectRatio="xMidYMid meet" id="svg-root" + width="100%" height="100%" x="1000" y="1000" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: struct-frag-04-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#NewDocument"> + <p> + This test validates the operation of the svg element when there is no + viewbox. + </p> + <p> + The document has x/y attributes set to (1000, 1000). Because + x/y are ignored on the root svg element, the x/y origin should have no + effect on the drawing. + </p> + <p> + The document contains squares and circles between the + (100,100) and (200, 200) coordinates. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required. If the test is run outside of the harness, the operator may resize the viewport.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The rendered picture should match the reference image. Changing the viewport + size should have no effect on the placement or scale of the document's content.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-frag-04-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <rect x="100" y="100" width="50" height="50" fill="rgb(220, 20, 60)"/> + <rect x="150" y="150" width="50" height="50" fill="rgb(220, 20, 60)"/> + + <circle cx="125" cy="175" r="25" fill="rgb(255, 215, 0)"/> + <circle cx="175" cy="125" r="25" fill="rgb(255, 215, 0)"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-frag-05-t-manual.svg b/testing/web-platform/tests/svg/import/struct-frag-05-t-manual.svg new file mode 100644 index 000000000..a7d2e9430 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-frag-05-t-manual.svg @@ -0,0 +1,86 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="CL" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: struct-frag-05-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#NewDocument"> + <p> + This tests that XML Namespaces are correctly implemented, in that the tuple + of local name and namespace URI, rather than the prefix, is important. + </p> + <p> + The first subtest is a + group where the namespace prefix s is bound to the SVG namespace and an s:circle is drawn + in pale yellow. The same group declares the default namespace to be a non-SVG namespace; the + blue circle element in that namespace must not be drawn. + </p> + <p> + The second subtest puts the namespace declarations on the elements themselves. The + prefix toto is bound to the SVG namespace and the XLink namespace is made the default namespace. + Thus, the blue <toto:a href="uri">Valid</toto:a> is a valid link and must be traversable. Select this link, + then go back to the test. + </p> + <p> + The third subtest has no prefix on the element name 'a' and uses the usual xlink: prefix on the href + attribute. However, both the default namespace and the namespace bound to the xlink prefix are + dummy namespaces. Not only should the link not be traversable, it must not even display at all. + If the text 'Invalid' is displayed, the test fails. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test and click on the "Valid" link.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if the following conditions are met:</p> + <ul> + <li>A yellow circle is shown.</li> + <li>A blue circle is not shown.</li> + <li>The text "Valid" is shown in blue.</li> + <li>The text "Invalid" is not shown.</li> + <li>Clicking "Valid" navigates to the "TOC & index of linking tests" document, linkingToc-t.svg.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-frag-05-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-family="Arial,sans-serif"> + <s:g xmlns="http://www.example.org/notsvg" xmlns:s="http://www.w3.org/2000/svg"> + <s:circle cx="240" cy="180" r="130" fill="#FF6"/> + <circle cx="240" cy="180" r="150" fill="#369"/> + </s:g> + <text x="240" y="100" text-anchor="middle" font-size="40" fill="#369"> + <a xmlns:toto="http://www.w3.org/2000/svg" xmlns:dahut="http://www.w3.org/1999/xlink" dahut:href="../images/linkingToc-t.svg">Valid</a> + </text> + <text x="240" y="250" text-anchor="middle" font-size="40" fill="#C33"> + <a xmlns="http://example.org/notsvg" xmlns:xlink="http://example.org/notxlink" xlink:href="../images/linkingToc-t.svg">Invalid</a> + </text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-frag-06-t-manual.svg b/testing/web-platform/tests/svg/import/struct-frag-06-t-manual.svg new file mode 100644 index 000000000..8f22f0d03 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-frag-06-t-manual.svg @@ -0,0 +1,82 @@ +<svg version="1.1" baseProfile="tiny" zoomAndPan="magnify" preserveAspectRatio="xMidYMid meet" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="VH" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: struct-frag-06-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#NewDocument"> + <p> + This test adds testing of some basic XML features SVG User Agents + should support. + </p> + <p> + First, the test checks support for the default entities amp, lt, gt, apos + and quot. This is what the first line shows in gray. + </p> + <p> + Second, the test checks support for hexadecimal and decimal character + entities, as shown in the second line, again in gray + </p> + <p> + Finally, the last line shows usage of an entity defined in the + document's internal DTD subset. The same geometry (a path) is + reused twice, once filled in gray and ones stroked in gray. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if the following conditions are met:</p> + <ul> + <li>The text string <span style="background: #ffa; border: 1px solid gray; padding: 0 2px">&, <, >, ', "</span> is shown in gray.</li> + <li>The text string <span style="background: #ffa; border: 1px solid gray; padding: 0 2px">A hexadecimal (&#x41)= A</span> is shown in gray.</li> + <li>The text string <span style="background: #ffa; border: 1px solid gray; padding: 0 2px">A decimal (&#65)= A</span> is shown in gray.</li> + <li>Two octagons are shown: one gray filled, and one gray stroked & unfilled.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-frag-06-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x="30" y="30">Default entities: amp, lt, gt, apos, quot: </text> + <text x="90" y="60" fill="gray">&, <, >, ', "</text> + <text x="30" y="100">Character references:</text> + <text x="90" y="130" fill="gray"> A hexadecimal (&#x41)= A</text> + <text x="90" y="160" fill="gray"> A decimal (&#65)= A</text> + <text x="30" y="200">Entity references:</text> + <text x="105" y="228" text-anchor="middle">gray</text> + <g transform="translate(90, 235) scale(0.2)" fill="gray"> + <path d="M60,0 l60,0 l60,60 l0,60 l-60,60 l-60,0 l-60,-60 l0,-60 z"/> + </g> + <text x="205" y="228" text-anchor="middle">outlined</text> + <g transform="translate(190, 235) scale(0.2)" fill="none" stroke="gray" stroke-width="5"> + <path d="M60,0 l60,0 l60,60 l0,60 l-60,60 l-60,0 l-60,-60 l0,-60 z"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-group-01-t-manual.svg b/testing/web-platform/tests/svg/import/struct-group-01-t-manual.svg new file mode 100644 index 000000000..3326f1d8c --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-group-01-t-manual.svg @@ -0,0 +1,77 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Tim Thompson" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: struct-group-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#Groups"> + <p> + The test checks to see that graphics elements (g) can be nested and that the like attributes can be passed to the children. + All the g elements for this test are in the g element whose id=allGs. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test uses the 'rect' element, as well as basic fill (solid primary colors), + stroke (black 1-pixel lines), font-family and font-size properties. + </p> + <p> + The two blue rectangles and the yellow are in the g labeled rects. + The blue rectangles inherit a fill color the green rect has a fill specified and it should not be overwritten. + The two yellow rectangles should inherit the fill color and the transform attribute, they should be + yellow and rotated at -20 degrees. These two rectangles are in g "yellowNrotate", that g is nested + inside g "gratuitiousG". The black rectangle in the upper right, has no attributes inherited from its parent. + The focus is nesting of g elements and passing on of attributes. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image, except for possible + variations in the labelling text (per CSS2 rules). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-group-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g id="rects" fill="blue"> + <rect x="0" y="0" width="240" height="180"/> + <rect x="60" y="45" width="120" height="90" fill="green"/> + <rect x="240" y="180" width="240" height="180"/> + </g> + <g id="singleG"> + <rect x="240" y="0" width="240" height="180" fill="black"/> + </g> + <g id="gratuitiousG"> + <g id="yellowNrotate" fill="yellow" transform="rotate(-20)"> + <rect x="0" y="224" width="40" height="40"/> + <rect x="0" y="280" width="40" height="40"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-group-02-b-manual.svg b/testing/web-platform/tests/svg/import/struct-group-02-b-manual.svg new file mode 100644 index 000000000..bbc2a59af --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-group-02-b-manual.svg @@ -0,0 +1,78 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Tim Thompson" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: struct-group-02-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#Groups"> + <p> + The purpose of this test is to check the nesting of SVG elements. + </p> + <p> + The test uses the 'rect' element, as well as basic fill (solid primary colors), + stroke (black 1-pixel lines), font-family and font-size properties. + </p> + <p> + There are 4 svg elements in the test. + The first defines the outer square at 480x360. + The second whose id is lowerRight defines a green rectangle which is 1/4 of the outer svg element. + The third svg whose id is upperLeft defines a region that is the upper 1/4 of the outer svg, + it is filled with a blue rectangle. It has a child svg element that defines an area + half again the size of its parent but sharing the same center point, it is filled with a yellow rectangle. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if: + </p> + <ul> + <li>There is a green rectangle covering 1/4 of the testframe area positioned in the lower right corner.</li> + <li>There is a blue rectangle covering 1/4 of the testframe area positioned in the upper left corner.</li> + <li>There is a yellow rectangle centered inside the blue rectangle, covering half of the area of the blue rectangle.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-group-02-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <svg xmlns:xlink="http://www.w3.org/1999/xlink" id="lowerRight" x="240" y="180" width="240" height="180"> + <rect x="0" y="0" width="240" height="180" fill="lime"/> + </svg> + <svg xmlns:xlink="http://www.w3.org/1999/xlink" id="upperRight" x="0" y="0" width="240" height="180"> + <rect fill="blue" x="0" y="0" width="240" height="180"/> + <svg xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" baseProfile="basic" id="childArea" x="60" y="45" width="120" height="90"> + <rect fill="yellow" x="0" y="0" width="120" height="90"/> + </svg> + </svg> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-group-03-t-manual.svg b/testing/web-platform/tests/svg/import/struct-group-03-t-manual.svg new file mode 100644 index 000000000..975e707da --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-group-03-t-manual.svg @@ -0,0 +1,285 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: struct-group-03-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#Groups"> + <p> + This test validates that properties are inherited (or not, depending on + their defintion), from a group to its children. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + [[ + Describe how to use the here. The instructions should specify any + steps requied to run the test or any manual operation that need + to be performed to run the test. + ]] + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The two rows displayed in this test should be identical. In the top row, + each property is set to the value 'inherit'. In the bottom row, which is + the reference, each property is set to the value that should be inherited + in the top row. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-group-03-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g id="grid" transform="translate(70, 150) rotate(-90)" fill="none" stroke="black"> + <defs> + <rect id="propertyCell" x="-5" y="-14" width="110" height="22"/> + <rect id="sampleCell" x="-5" y="-14" width="50" height="22"/> + </defs> + + <use xlink:href="#propertyCell"/> + <use xlink:href="#propertyCell" y="22"/> + <use xlink:href="#propertyCell" y="44"/> + <use xlink:href="#propertyCell" y="66"/> + <use xlink:href="#propertyCell" y="88"/> + <use xlink:href="#propertyCell" y="110"/> + <use xlink:href="#propertyCell" y="132"/> + <use xlink:href="#propertyCell" y="154"/> + <use xlink:href="#propertyCell" y="176"/> + <use xlink:href="#propertyCell" y="198"/> + <use xlink:href="#propertyCell" y="220"/> + <use xlink:href="#propertyCell" y="242"/> + <use xlink:href="#propertyCell" y="264"/> + <use xlink:href="#propertyCell" y="286"/> + <use xlink:href="#propertyCell" y="308"/> + <use xlink:href="#propertyCell" y="330"/> + <use xlink:href="#propertyCell" y="352"/> + + <g transform="translate(-50, 0)"> + <use xlink:href="#sampleCell"/> + <use xlink:href="#sampleCell" y="22"/> + <use xlink:href="#sampleCell" y="44"/> + <use xlink:href="#sampleCell" y="66"/> + <use xlink:href="#sampleCell" y="88"/> + <use xlink:href="#sampleCell" y="110"/> + <use xlink:href="#sampleCell" y="132"/> + <use xlink:href="#sampleCell" y="154"/> + <use xlink:href="#sampleCell" y="176"/> + <use xlink:href="#sampleCell" y="198"/> + <use xlink:href="#sampleCell" y="220"/> + <use xlink:href="#sampleCell" y="242"/> + <use xlink:href="#sampleCell" y="264"/> + <use xlink:href="#sampleCell" y="286"/> + <use xlink:href="#sampleCell" y="308"/> + <use xlink:href="#sampleCell" y="330"/> + <use xlink:href="#sampleCell" y="352"/> + </g> + + <g transform="translate(-100, 0)"> + <use xlink:href="#sampleCell"/> + <use xlink:href="#sampleCell" y="22"/> + <use xlink:href="#sampleCell" y="44"/> + <use xlink:href="#sampleCell" y="66"/> + <use xlink:href="#sampleCell" y="88"/> + <use xlink:href="#sampleCell" y="110"/> + <use xlink:href="#sampleCell" y="132"/> + <use xlink:href="#sampleCell" y="154"/> + <use xlink:href="#sampleCell" y="176"/> + <use xlink:href="#sampleCell" y="198"/> + <use xlink:href="#sampleCell" y="220"/> + <use xlink:href="#sampleCell" y="242"/> + <use xlink:href="#sampleCell" y="264"/> + <use xlink:href="#sampleCell" y="286"/> + <use xlink:href="#sampleCell" y="308"/> + <use xlink:href="#sampleCell" y="330"/> + <use xlink:href="#sampleCell" y="352"/> + </g> + </g> + <g id="properties" transform="translate(70, 150) rotate(-90)"> + <text>color</text> + <text y="22">display</text> + <text y="44">fill</text> + <text y="66">fill-rule</text> + <text y="88">stroke</text> + <text y="110">stroke-dasharray</text> + <text y="132">stroke-dashoffset</text> + <text y="154">stroke-linecap</text> + <text y="176">stroke-linejoin</text> + <text y="198">stroke-miterlimit</text> + <text y="220">stroke-width</text> + <text y="242">visibility</text> + <text y="264">font-family</text> + <text y="286">font-size</text> + <text y="308">font-style</text> + <text y="330">font-weight</text> + <text y="352">text-anchor</text> + </g> + + <g id="inheritGroup" transform="translate(56, 155)"> + + <g color="#0F0"> + <rect x="3" y="10" width="16" height="32" fill="currentColor"/> + </g> + + <g display="none" transform="translate(22, 0)"> + <rect x="3" y="10" width="16" height="32" display="inherit"/> + </g> + + <g fill="#0F0" transform="translate(44, 0)"> + <rect x="3" y="10" width="16" height="32" fill="inherit"/> + </g> + + <g fill-rule="evenodd" transform="translate(66, 0)"> + <polygon points="10.5,0 21,21 0,7 21,7 0,21" fill-rule="inherit" fill="#0F0" transform="translate(3, 15) scale(0.7)"/> + </g> + + <g stroke="#0F0" transform="translate(88, 0)"> + <rect x="3" y="10" width="16" height="32" stroke="inherit" fill="none"/> + </g> + + <g stroke-dasharray="2,2,5,5" transform="translate(110, 0)"> + <line x1="11" y1="5" x2="11" y2="40" stroke="#0F0" stroke-dasharray="inherit" stroke-width="2"/> + </g> + + <g stroke-dashoffset="4" transform="translate(132, 0)"> + <line x1="11" y1="5" x2="11" y2="40" stroke="#0F0" stroke-dashoffset="inherit" stroke-dasharray="2,2,5,5" stroke-width="2"/> + </g> + + <g stroke-linecap="round" transform="translate(154, 0)"> + <line x1="11" y1="10" x2="11" y2="40" stroke="#0F0" stroke-linecap="inherit" stroke-width="10"/> + </g> + + <g stroke-linejoin="round" transform="translate(176, 0)"> + <polyline points="3,40 11,10 19,40" stroke="#0F0" stroke-linejoin="inherit" stroke-width="5" fill="none"/> + </g> + + <g stroke-miterlimit="1" transform="translate(198, 0)"> + <polyline points="3,40 11,10 19,40" stroke="#0F0" stroke-miterlimit="inherit" stroke-width="5" fill="none"/> + </g> + + <g stroke-width="5" transform="translate(220, 0)"> + <line x1="11" y1="10" x2="11" y2="40" stroke="#0F0" stroke-width="inherit"/> + </g> + + <g visibility="hidden" transform="translate(242, 0)"> + <line x1="11" y1="10" x2="11" y2="40" stroke="#0F0" visibility="inherit"/> + </g> + + <g font-family="serif" transform="translate(264, 0)"> + <text x="11" y="30" font-size="20" text-anchor="middle" font-family="inherit">A</text> + </g> + + <g font-size="10" transform="translate(286, 0)"> + <text x="11" y="30" font-size="inherit" text-anchor="middle" font-family="serif">A</text> + </g> + + <g font-style="italic" transform="translate(308, 0)"> + <text x="11" y="30" font-style="inherit" text-anchor="middle" font-size="20" font-family="serif">A</text> + </g> + + <g font-weight="bold" transform="translate(330, 0)"> + <text x="11" y="30" font-weight="inherit" text-anchor="middle" font-family="serif" font-size="20">A</text> + </g> + + <g text-anchor="middle" transform="translate(352, 0)"> + <text x="11" y="30" text-anchor="inherit" font-family="serif" font-size="20">A</text> + </g> + </g> + + <g id="referenceGroup" transform="translate(56, 205)"> + + <g> + <rect x="3" y="10" width="16" height="32" fill="#0F0"/> + </g> + + <g transform="translate(22, 0)"> + <rect x="3" y="10" width="16" height="32" display="none"/> + </g> + + <g transform="translate(44, 0)"> + <rect x="3" y="10" width="16" height="32" fill="#0F0"/> + </g> + + <g transform="translate(66, 0)"> + <polygon points="10.5,0 21,21 0,7 21,7 0,21" fill-rule="evenodd" fill="#0F0" transform="translate(3, 15) scale(0.7)"/> + </g> + + <g transform="translate(88, 0)"> + <rect x="3" y="10" width="16" height="32" stroke="#0F0" fill="none"/> + </g> + + <g stroke-dasharray="2,2,5,5" transform="translate(110, 0)"> + <line x1="11" y1="5" x2="11" y2="40" stroke="#0F0" stroke-dasharray="inherit" stroke-width="2"/> + </g> + + <g transform="translate(132, 0)"> + <line x1="11" y1="5" x2="11" y2="40" stroke="#0F0" stroke-dashoffset="4" stroke-dasharray="2,2,5,5" stroke-width="2"/> + </g> + + <g transform="translate(154, 0)"> + <line x1="11" y1="10" x2="11" y2="40" stroke="#0F0" stroke-linecap="round" stroke-width="10"/> + </g> + + <g transform="translate(176, 0)"> + <polyline points="3,40 11,10 19,40" stroke="#0F0" stroke-linejoin="round" stroke-width="5" fill="none"/> + </g> + + <g transform="translate(198, 0)"> + <polyline points="3,40 11,10 19,40" stroke="#0F0" stroke-miterlimit="1" stroke-width="5" fill="none"/> + </g> + + <g transform="translate(220, 0)"> + <line x1="11" y1="10" x2="11" y2="40" stroke="#0F0" stroke-width="5"/> + </g> + + <g transform="translate(242, 0)"> + <line x1="11" y1="10" x2="11" y2="40" stroke="#0F0" visibility="hidden"/> + </g> + + <g transform="translate(264, 0)"> + <text x="11" y="30" font-size="20" text-anchor="middle" font-family="serif">A</text> + </g> + + <g transform="translate(286, 0)"> + <text x="11" y="30" font-size="10" text-anchor="middle" font-family="serif">A</text> + </g> + + <g transform="translate(308, 0)"> + <text x="11" y="30" font-style="italic" text-anchor="middle" font-size="20" font-family="serif">A</text> + </g> + + <g transform="translate(330, 0)"> + <text x="11" y="30" font-weight="bold" text-anchor="middle" font-family="serif" font-size="20">A</text> + </g> + + <g transform="translate(352, 0)"> + <text x="11" y="30" text-anchor="middle" font-family="serif" font-size="20">A</text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-image-01-t-manual.svg b/testing/web-platform/tests/svg/import/struct-image-01-t-manual.svg new file mode 100644 index 000000000..441e62f8a --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-image-01-t-manual.svg @@ -0,0 +1,59 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Tim Thompson" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: struct-image-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#ImageElement"> + <p> + The image test case checks to see if the required raster image formats are supported. + </p> + <p> + The upper right has an JPEG image, the lower right has a PNG image. They are + the same image. + Those positions are relative to the upper left of the entire canvas. + If any of the components are missing, then an image format is not being + properly supported. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if two identical images are shown.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-image-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <image id="image1JPEG" x="240" y="0" width="240" height="150" xlink:href="../images/struct-image-01.jpg"/> + <image id="image1PNG" x="240" y="150" width="240" height="150" xlink:href="../images/struct-image-01.png"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-image-02-b-manual.svg b/testing/web-platform/tests/svg/import/struct-image-02-b-manual.svg new file mode 100644 index 000000000..403fdefbd --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-image-02-b-manual.svg @@ -0,0 +1,91 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Tim Thompson" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: struct-image-02-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#ImageElement"> + <p> + To test the 9 structure elements and their relationships. + </p> + <p> + S1 tests the defs element and the rendering of an image via the use element. + S2 tests the defs element and the use element by creating an svg element + that contains a blue rectangle. S3 tests the nesting of an SVG element, a + separate graphics element is defined, its coords relative to the svg element. + S4 tests a switch statement, if there is not a green rectangle showing in + S4 there is probably a problem processing a switch. + </p> + <p> + The test uses the 'rect' element, as well as basic fill (solid primary colors), + stroke (black 1-pixel lines), font-family and font-size properties. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the upper left rectangle shows an image, + the upper right a blue rectangle, the lower left a cyan rectangle + and the lower right a green rectangle. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-image-02-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <image id="image1" x="0" y="0" width="240" height="150" xlink:href="../images/struct-image-02.jpg"/> + <svg xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" baseProfile="basic" id="svg01" x="240" y="0" width="240" height="225"> + <rect width="100%" height="100%" fill="blue"/> + </svg> + </defs> + <g id="square1"> + <use x="0" y="0" width="240" height="150" xlink:href="#image1"/> + </g> + <g id="square2"> + <use xlink:href="#svg01"/> + </g> + <svg xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" baseProfile="basic" id="square3" x="0" y="150" width="240" height="150"> + <g> + <rect fill="aqua" x="0" y="0" width="240" height="150"/> + </g> + </svg> + <g id="square4"> + <switch> + <rect fill="red" x="240" y="150" width="240" height="150" requiredFeatures="http://www.w3.org/TR/SVG11/feature#ConditionalProcessing" systemLanguage=""/> + <rect fill="blue" x="240" y="150" width="240" height="150" requiredFeatures="http://www.w3.org/TR/SVG11/feature#ConditionalProcessing" systemLanguage=""/> + <rect fill="green" x="240" y="150" width="240" height="150" requiredFeatures="http://www.w3.org/TR/SVG11/feature#ConditionalProcessing"/> + <rect fill="yellow" x="240" y="150" width="240" height="150" requiredFeatures="http://www.w3.org/TR/SVG11/feature#ConditionalProcessing" systemLanguage=""/> + </switch> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-image-03-t-manual.svg b/testing/web-platform/tests/svg/import/struct-image-03-t-manual.svg new file mode 100644 index 000000000..88487322b --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-image-03-t-manual.svg @@ -0,0 +1,66 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Chris Lilley" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: struct-image-03-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#ImageElement"> + <p> + This test verifies the support for gamma correction of displayed PNG + images. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Several different images are displayed one above the other; + if gamma correction is correctly performed based on the values in + the gAMA chunk in the PNG file, the resulting displayed values are + the same in all of the files (except for rounding error, which gives + some artefacts at the right side of the lowest two images due to the + very high levels of gamma correction needed for this test) + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-image-03-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <rect x="23" y="13" width="434" height="224" stroke="none" fill="black" /> + <image x="25" y="15" width="430" height="48" xlink:href="../images/gam030.png"/> + <image x="25" y="43" width="430" height="48" xlink:href="../images/gam045.png"/> + <image x="25" y="91" width="430" height="48" xlink:href="../images/gam056.png"/> + <image x="25" y="139" width="430" height="48" xlink:href="../images/gam100.png"/> + <image x="25" y="187" width="430" height="48" xlink:href="../images/gam200.png"/> + <text x="25" y="285" font-size="40">Gamma correction</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-image-04-t-manual.svg b/testing/web-platform/tests/svg/import/struct-image-04-t-manual.svg new file mode 100644 index 000000000..6b4edff3d --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-image-04-t-manual.svg @@ -0,0 +1,60 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Tim Thompson" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: struct-image-04-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#ImageElement"> + <p> + The image test case checks to see if the basic image formats allowed in + are supported using the data: URI schema and base64 encoding. + </p> + <p> + The upper right has an JPG image the lower right has a PNG image. They are + the same image. + Those positions are relative to the upper left of the entire canvas. + If any of the components are missing, then an image format is not being + properly supported. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if two identical images are shown.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-image-04-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <image id="image1JPEG" x="240" y="0" width="240" height="150" xlink:href="data:image/jpg;base64,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"/> + <image id="image1PNG" x="240" y="150" width="240" height="150" xlink:href="data:image/png;base64,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"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-image-05-b-manual.svg b/testing/web-platform/tests/svg/import/struct-image-05-b-manual.svg new file mode 100644 index 000000000..f171ff2c9 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-image-05-b-manual.svg @@ -0,0 +1,57 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Ola Andersson" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: struct-image-05-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#ImageElement"> + <p> + The image test case checks to see if the svg image format are supported. + </p> + <p> + The test uses the 'rect' element, as well as basic fill (solid primary colors), + stroke (black 1-pixel lines), font-family and font-size properties. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image showing two rectangles, one blue and one yellow. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-image-05-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <image id="imageSVG" x="0" y="0" width="240" height="150" xlink:href="../images/rects.svg"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-image-06-t-manual.svg b/testing/web-platform/tests/svg/import/struct-image-06-t-manual.svg new file mode 100644 index 000000000..3322da230 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-image-06-t-manual.svg @@ -0,0 +1,104 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: struct-image-06-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#ImageElement"> + <p> + Check that all the preserveAspectRatio values are supported + for the <image> element. In particular, check that + values which are not supported on the svg element's + preserveAspectRatio are supported for <image>. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test shows four smiley images: the leftmost one is the reference, + and the three on the right are the three sub-tests. The test is passed + if the following conditions are met: + </p> + <ul> + <li>The image in the first sub-test is shown within the blue rectangle, + its aspect ratio preserved and with white bars between the blue rectangle + and the left and right edges of the image.</li> + <li>The image in the second sub-test is shown within the blue rectangle, + its aspect ratio preserved and with white bars between the blue rectangle + and the top and bottom edges of the image.</li> + <li>The image in the third sub-test is shown stretched, having the same + size as the blue rectangle shown on the left of the test slide underneath + the text "Viewport 2".</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-image-06-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-size="9"> + <desc>Example PreserveAspectRatio - demonstrate available options</desc> + <text x="10" y="30">SVG to fit</text> + <g transform="translate(20,40)"> + <image xlink:href="../images/smiley.png" width="50" height="50"/> + </g> + <text x="10" y="110">Viewport 1</text> + <g transform="translate(10,120)"> + <rect x=".5" y=".5" width="49" height="29" fill="none" stroke="blue"/> + </g> + <text x="10" y="180">Viewport 2</text> + <g transform="translate(20,190)"> + <rect x=".5" y=".5" width="29" height="59" fill="none" stroke="blue"/> + </g> + <g id="meet-group-1" transform="translate(100, 50)"> + <text x="0" y="-20">---------- meet ----------</text> + <g transform="translate(30,0)"> + <text y="-5">xMid*</text> + <rect x=".5" y=".5" width="49" height="29" fill="none" stroke="blue"/> + <image xlink:href="../images/smiley.png" preserveAspectRatio="xMidYMid meet" width="50" height="30"/> + </g> + </g> + <g id="meet-group-2" transform="translate(230, 50)"> + <text x="0" y="-20">---------- meet ----------</text> + <g transform="translate(30, 0)"> + <text y="-5">*YMid</text> + <rect x=".5" y=".5" width="29" height="59" fill="none" stroke="blue"/> + <image xlink:href="../images/smiley.png" preserveAspectRatio="xMidYMid meet" width="30" height="60"/> + </g> + </g> + <g id="meet-group-3" transform="translate(350, 50)"> + <text x="0" y="-20">---------- meet ----------</text> + <g transform="translate(30, 0)"> + <text y="-5">*none</text> + <rect x=".5" y=".5" width="29" height="59" fill="none" stroke="blue"/> + <image xlink:href="../images/smiley.png" preserveAspectRatio="none" width="30" height="60"/> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-image-07-t-manual.svg b/testing/web-platform/tests/svg/import/struct-image-07-t-manual.svg new file mode 100644 index 000000000..e8ad6299c --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-image-07-t-manual.svg @@ -0,0 +1,75 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: struct-image-07-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#ImageElement"> + <p> + This test validates that xml:base is properly handled on the + <image> element. + </p> + <p> + It shows the same image three times, with different xml:base and + xlink:href values. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test is passed if three smiley face images are shown.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-image-07-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="translate(10,0)"> + <!-- Default, base is the document URI --> + <g transform="translate(40, 100)"> + <text x="50" y="-30" text-anchor="middle" font-size="24">no</text> + <text x="50" text-anchor="middle" font-size="24">xml:base</text> + <image xlink:href="../images/smiley.png" x="0" y="20" width="100" height="100"/> + </g> + + <!-- xml:base on image --> + <g transform="translate(180, 100)"> + <text x="50" y="-30" text-anchor="middle" font-size="24">xml:base</text> + <text x="50" text-anchor="middle" font-size="24">on image</text> + <image xml:base="../images/" xlink:href="smiley.png" x="0" y="20" width="100" height="100"/> + </g> + + <!-- xml:base on group --> + <g transform="translate(320, 100)" xml:base="../images/"> + <text x="50" y="-30" text-anchor="middle" font-size="24">xml:base</text> + <text x="50" text-anchor="middle" font-size="24">on parent</text> + <image xlink:href="smiley.png" x="0" y="20" width="100" height="100"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-image-08-t-manual.svg b/testing/web-platform/tests/svg/import/struct-image-08-t-manual.svg new file mode 100644 index 000000000..b712be813 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-image-08-t-manual.svg @@ -0,0 +1,58 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CL" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: struct-image-08-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#ImageElement"> + <p> + Tests PNG images with alpha. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The result should be identical to the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-image-08-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <rect x="0" y="50" width="160" height="170" fill="#000"/> + <rect x="160" y="50" width="160" height="170" fill="#920"/> + <rect x="320" y="50" width="160" height="170" fill="#029"/> + <image xlink:href="../images/rgbalpha.png" x="0" y="60" width="162" height="150"/> + <image xlink:href="../images/rgbalpha.png" x="160" y="60" width="162" height="150"/> + <image xlink:href="../images/rgbalpha.png" x="320" y="60" width="162" height="150"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-image-09-t-manual.svg b/testing/web-platform/tests/svg/import/struct-image-09-t-manual.svg new file mode 100644 index 000000000..f854040d1 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-image-09-t-manual.svg @@ -0,0 +1,57 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CL" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: struct-image-09-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#ImageElement"> + <p> + Tests PNG images with pallete ransparency (tRNS chunk). + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The result should be identical to the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-image-09-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <rect x="150" y="50" width="162" height="162" fill="#af4"/> + <rect x="310" y="50" width="162" height="162" fill="#fa6"/> + <image xlink:href="../images/stefan_252_tRNS_opti.png" x="10" y="60" width="162" height="150"/> + <image xlink:href="../images/stefan_252_tRNS_opti.png" x="160" y="60" width="162" height="150"/> + <image xlink:href="../images/stefan_252_tRNS_opti.png" x="320" y="60" width="162" height="150"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-image-10-t-manual.svg b/testing/web-platform/tests/svg/import/struct-image-10-t-manual.svg new file mode 100644 index 000000000..bf9b3a021 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-image-10-t-manual.svg @@ -0,0 +1,58 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CL" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: struct-image-10-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#ImageElement"> + <p> + Tests PNG greyscale images with alpha. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The result should be identical to the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-image-10-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <rect x="0" y="50" width="160" height="170" fill="#000"/> + <rect x="160" y="50" width="160" height="170" fill="#920"/> + <rect x="320" y="50" width="160" height="170" fill="#029"/> + <image xlink:href="../images/galpha.png" x="0" y="60" width="162" height="150"/> + <image xlink:href="../images/galpha.png" x="160" y="60" width="162" height="150"/> + <image xlink:href="../images/galpha.png" x="320" y="60" width="162" height="150"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-image-11-b-manual.svg b/testing/web-platform/tests/svg/import/struct-image-11-b-manual.svg new file mode 100644 index 000000000..4b7e3d6ba --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-image-11-b-manual.svg @@ -0,0 +1,67 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="ED" status="reviewed" + version="$Revision: 1.7 $" testname="$RCSfile: struct-image-11-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#ImageElement"> + <p> + Test interactivity in an svg image referenced by an 'image' element. + </p> + <p> + This test requires support for CSS2 and referencing SVG and PNG images via the 'image' element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Click each of the three rectangles in the center of the testframe once. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if all three rectangles are green after being clicked once each. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-image-11-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <script type="application/ecmascript"> + function makeGreen(evt, expectedId) + { + if (evt.target.id == expectedId) + { + evt.target.href.baseVal = "../images/green1x1.png"; + } + } + </script> + <image id="imageSVG1" x="180" y="50" width="120" height="120" xlink:href="../images/struct-image-11-b-1.svg" onclick="makeGreen(evt, 'imageSVG1')"/> + <image id="imageSVG2" x="60" y="170" width="120" height="120" xlink:href="../images/struct-image-11-b-2.svg" onclick="makeGreen(evt, 'imageSVG2')"/> + <image id="imageSVG3" x="300" y="170" width="120" height="120" xlink:href="../images/blue1x1.png" onclick="makeGreen(evt, 'imageSVG3')"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-image-12-b-manual.svg b/testing/web-platform/tests/svg/import/struct-image-12-b-manual.svg new file mode 100644 index 000000000..7e89072d9 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-image-12-b-manual.svg @@ -0,0 +1,71 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="ED" status="empty" + version="$Revision: 1.4 $" testname="$RCSfile: struct-image-12-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#ImageElement"> + <p> + [[Describe which section and what specific assertion is being tested + by the test. If the test has a number of sub tests, multiple + "testComponent" elements can be specified within the "testDescription" + element.]] + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + [[Describe the pass criteria of the test here. The pass criteria is what + should be displayed when the test is run.]] + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-image-12-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <svg xmlns:xlink="http://www.w3.org/1999/xlink" id="svg-root-circle" viewBox="0 0 450 450" width="450" height="450"> + <circle cx="225" cy="225" r="200" fill="blue" fill-opacity="0.2"/> + </svg> + </defs> + + <!-- The following image leads to a cycle, what should be displayed here? --> + <image id="imageSVG" x="60" y="50" width="240" height="240" xlink:href="../images/struct-image-12-b-cycle.svg"/> + + <!-- The following image should not be shown because it leads to a cycle --> + <image id="imageSVG" x="60" y="50" width="240" height="240" xlink:href="struct-image-12-b.svg"/> + + <!-- The following image should not be shown because image elements can't reference elements in an svg file --> + <image id="imageSVG" x="60" y="50" width="240" height="240" xlink:href="#svg-root-circle"/> + + <rect x="300" y="170" width="120" height="120" fill="blue"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-image-13-f-manual.svg b/testing/web-platform/tests/svg/import/struct-image-13-f-manual.svg new file mode 100644 index 000000000..880907a05 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-image-13-f-manual.svg @@ -0,0 +1,124 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CL" status="accepted" + version="$Revision: 1.2 $" testname="$RCSfile: struct-image-13-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/[chapter]#[section]"> + <p> + Tests that different PNG image types are correctly handled. These images are non-interlaced. + </p> + <p> + This test uses the + <a href="http://www.schaik.com/pngsuite/">PNG Group test suite</a> + created by Willem van Schaik. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if all the small PNG icons are displayed as in the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-image-13-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <!-- something to show transparency --> + <rect x="16" y="32" width="320" height="8" fill="#3C3"/> + <rect x="16" y="48" width="320" height="8" fill="#9F9"/> + + <!-- 1 bit black and white --> + <image xlink:href="../images/PngSuite/basn0g01.png" x="16" y="32" width="32" height="32"/> + + <!-- 2 bit greyscale --> + <image xlink:href="../images/PngSuite/basn0g02.png" x="64" y="32" width="32" height="32"/> + + <!-- 4 bit greyscale --> + <image xlink:href="../images/PngSuite/basn0g04.png" x="112" y="32" width="32" height="32"/> + + <!-- 8 bit greyscale --> + <image xlink:href="../images/PngSuite/basn0g08.png" x="160" y="32" width="32" height="32"/> + + <!-- 16 bit greyscale --> + <image xlink:href="../images/PngSuite/basn0g16.png" x="208" y="32" width="32" height="32"/> + + <!-- 8 bit greyscale plus alpha --> + <image xlink:href="../images/PngSuite/basn4a08.png" x="256" y="32" width="32" height="32"/> + + <!-- 16 bit greyscale plus alpha --> + <image xlink:href="../images/PngSuite/basn4a16.png" x="304" y="32" width="32" height="32"/> + + <text x="16" y="100" font-size="16" fill="#3C3">Greyscale, various bit depths, two with alpha</text> + + <!-- something to show transparency --> + <rect x="16" y="132" width="368" height="8" fill="#9F9"/> + <rect x="16" y="148" width="368" height="8" fill="#3C3"/> + + <!-- 8 bits RGB --> + <image xlink:href="../images/PngSuite/basn2c08.png" x="16" y="132" width="32" height="32"/> + + <!-- 16 bits RGB --> + <image xlink:href="../images/PngSuite/basn2c16.png" x="64" y="132" width="32" height="32"/> + + <!-- 1 bit indexed --> + <image xlink:href="../images/PngSuite/basn3p01.png" x="112" y="132" width="32" height="32"/> + + <!-- 2 bit indexed --> + <image xlink:href="../images/PngSuite/basn3p02.png" x="160" y="132" width="32" height="32"/> + + <!-- 4 bit indexed --> + <image xlink:href="../images/PngSuite/basn3p04.png" x="208" y="132" width="32" height="32"/> + + <!-- 8 bit indexed --> + <image xlink:href="../images/PngSuite/basn3p08.png" x="256" y="132" width="32" height="32"/> + + <!-- 8 bits RGB plus alpha --> + <image xlink:href="../images/PngSuite/basn6a08.png" x="304" y="132" width="32" height="32"/> + + <!-- 16 bits RGB plus alpha --> + <image xlink:href="../images/PngSuite/basn6a16.png" x="352" y="132" width="32" height="32"/> + + <text x="16" y="200" font-size="16" fill="#3C3">Truecolor and indexed, various bit depths, two with alpha</text> + + <text x="16" y="260" font-size="24" fill="#3C3">Non-interlaced images</text> + + <!-- + <image xlink:href="../images/PngSuite/" x="" y="" width="32" height="32"/> + --> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-image-14-f-manual.svg b/testing/web-platform/tests/svg/import/struct-image-14-f-manual.svg new file mode 100644 index 000000000..f6531648d --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-image-14-f-manual.svg @@ -0,0 +1,124 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CL" status="accepted" + version="$Revision: 1.2 $" testname="$RCSfile: struct-image-14-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/[chapter]#[section]"> + <p> + Tests that different PNG image types are correctly handled. These images are interlaced. + </p> + <p> + This test uses the + <a href="http://www.schaik.com/pngsuite/">PNG Group test suite</a> + created by Willem van Schaik. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if all the small PNG icons are displayed as in the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-image-14-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <!-- something to show transparency --> + <rect x="16" y="32" width="320" height="8" fill="#3C3"/> + <rect x="16" y="48" width="320" height="8" fill="#9F9"/> + + <!-- 1 bit black and white --> + <image xlink:href="../images/PngSuite/basi0g01.png" x="16" y="32" width="32" height="32"/> + + <!-- 2 bit greyscale --> + <image xlink:href="../images/PngSuite/basi0g02.png" x="64" y="32" width="32" height="32"/> + + <!-- 4 bit greyscale --> + <image xlink:href="../images/PngSuite/basi0g04.png" x="112" y="32" width="32" height="32"/> + + <!-- 8 bit greyscale --> + <image xlink:href="../images/PngSuite/basi0g08.png" x="160" y="32" width="32" height="32"/> + + <!-- 16 bit greyscale --> + <image xlink:href="../images/PngSuite/basi0g16.png" x="208" y="32" width="32" height="32"/> + + <!-- 8 bit greyscale plus alpha --> + <image xlink:href="../images/PngSuite/basi4a08.png" x="256" y="32" width="32" height="32"/> + + <!-- 16 bit greyscale plus alpha --> + <image xlink:href="../images/PngSuite/basi4a16.png" x="304" y="32" width="32" height="32"/> + + <text x="16" y="100" font-size="16" fill="#3C3">Greyscale, various bit depths, two with alpha</text> + + <!-- something to show transparency --> + <rect x="16" y="132" width="368" height="8" fill="#9F9"/> + <rect x="16" y="148" width="368" height="8" fill="#3C3"/> + + <!-- 8 bits RGB --> + <image xlink:href="../images/PngSuite/basi2c08.png" x="16" y="132" width="32" height="32"/> + + <!-- 16 bits RGB --> + <image xlink:href="../images/PngSuite/basi2c16.png" x="64" y="132" width="32" height="32"/> + + <!-- 1 bit indexed --> + <image xlink:href="../images/PngSuite/basi3p01.png" x="112" y="132" width="32" height="32"/> + + <!-- 2 bit indexed --> + <image xlink:href="../images/PngSuite/basi3p02.png" x="160" y="132" width="32" height="32"/> + + <!-- 4 bit indexed --> + <image xlink:href="../images/PngSuite/basi3p04.png" x="208" y="132" width="32" height="32"/> + + <!-- 8 bit indexed --> + <image xlink:href="../images/PngSuite/basi3p08.png" x="256" y="132" width="32" height="32"/> + + <!-- 8 bits RGB plus alpha --> + <image xlink:href="../images/PngSuite/basi6a08.png" x="304" y="132" width="32" height="32"/> + + <!-- 16 bits RGB plus alpha --> + <image xlink:href="../images/PngSuite/basi6a16.png" x="352" y="132" width="32" height="32"/> + + <text x="16" y="200" font-size="16" fill="#3C3">Truecolor and indexed, various bit depths, two with alpha</text> + + <text x="16" y="260" font-size="24" fill="#3C3">Interlaced images</text> + + <!-- + <image xlink:href="../images/PngSuite/" x="" y="" width="32" height="32"/> + --> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-image-15-f-manual.svg b/testing/web-platform/tests/svg/import/struct-image-15-f-manual.svg new file mode 100644 index 000000000..6b406cf73 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-image-15-f-manual.svg @@ -0,0 +1,138 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CL" status="accepted" + version="$Revision: 1.2 $" testname="$RCSfile: struct-image-15-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/[chapter]#[section]"> + <p> + The first row tests that alpha PNG images are correctly displayed as part of an SVG image, + ignoring the background colour in the image which is only used to display the + PNG image stand-alone. + </p> + <p>The second row tests indexed PNG transparency (tRNs), again checking that + the background color is ignored when displayed as part of an SVG image. + </p> + <p> + This test uses the + <a href="http://www.schaik.com/pngsuite/">PNG Group test suite</a> + created by Willem van Schaik. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if all the small PNG icons are displayed as in the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-image-15-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <!-- something to show transparency --> + <rect x="16" y="32" width="368" height="8" fill="#3C3"/> + <rect x="16" y="48" width="368" height="8" fill="#9F9"/> + + <!-- 8 bit grayscale, alpha, no background chunk, interlaced --> + <image xlink:href="../images/PngSuite/bgai4a08.png" x="16" y="32" width="32" height="32"/> + + <!-- 16 bit grayscale, alpha, no background chunk, interlaced --> + <image xlink:href="../images/PngSuite/bgai4a16.png" x="64" y="32" width="32" height="32"/> + + <!-- 8 bits rgb color, alpha, no background chunk --> + <image xlink:href="../images/PngSuite/bgan6a08.png" x="112" y="32" width="32" height="32"/> + + <!-- 16 bits rgb color, alpha, no background chunk --> + <image xlink:href="../images/PngSuite/bgan6a16.png" x="160" y="32" width="32" height="32"/> + + <!-- 8 bit grayscale, alpha, black background chunk --> + <image xlink:href="../images/PngSuite/bgbn4a08.png" x="208" y="32" width="32" height="32"/> + + <!-- 16 bit grayscale, alpha, gray background chunk --> + <image xlink:href="../images/PngSuite/bggn4a16.png" x="256" y="32" width="32" height="32"/> + + <!-- 8 bits rgb color, alpha, white background chunk --> + <image xlink:href="../images/PngSuite/bgwn6a08.png" x="304" y="32" width="32" height="32"/> + + <!-- 16 bits rgb color, alpha, yellow background chunk --> + <image xlink:href="../images/PngSuite/bgyn6a16.png" x="352" y="32" width="32" height="32"/> + + <text x="16" y="100" font-size="16" fill="#3C3">Background color, with alpha</text> + + <!-- something to show transparency --> + <rect x="16" y="132" width="464" height="8" fill="#9F9"/> + <rect x="16" y="148" width="464" height="8" fill="#3C3"/> + + <!-- transparent, black background chunk --> + <image xlink:href="../images/PngSuite/tbbn1g04.png" x="16" y="132" width="32" height="32"/> + + <!-- transparent, blue background chunk --> + <image xlink:href="../images/PngSuite/tbbn2c16.png" x="64" y="132" width="32" height="32"/> + + <!-- transparent, black background chunk --> + <image xlink:href="../images/PngSuite/tbbn3p08.png" x="112" y="132" width="32" height="32"/> + + <!-- transparent, green background chunk --> + <image xlink:href="../images/PngSuite/tbgn2c16.png" x="160" y="132" width="32" height="32"/> + + <!-- transparent, light-gray background chunk --> + <image xlink:href="../images/PngSuite/tbgn3p08.png" x="208" y="132" width="32" height="32"/> + + <!-- transparent, red background chunk --> + <image xlink:href="../images/PngSuite/tbrn2c08.png" x="256" y="132" width="32" height="32"/> + + <!-- transparent, white background chunk --> + <image xlink:href="../images/PngSuite/tbwn1g16.png" x="304" y="132" width="32" height="32"/> + + <!-- transparent, white background chunk --> + <image xlink:href="../images/PngSuite/tbwn3p08.png" x="352" y="132" width="32" height="32"/> + + <!-- transparent, yellow background chunk --> + <image xlink:href="../images/PngSuite/tbyn3p08.png" x="400" y="132" width="32" height="32"/> + + <!-- transparent, but no background chunk --> + <image xlink:href="../images/PngSuite/tp1n3p08.png" x="448" y="132" width="32" height="32"/> + + <text x="16" y="200" font-size="16" fill="#3C3">Background color, with transparency</text> + + <text x="16" y="260" font-size="24" fill="#3C3">Handling bKGd and tRNs</text> + + <!-- + <image xlink:href="../images/PngSuite/" x="" y="" width="32" height="32"/> + --> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-image-16-f-manual.svg b/testing/web-platform/tests/svg/import/struct-image-16-f-manual.svg new file mode 100644 index 000000000..ba01ef355 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-image-16-f-manual.svg @@ -0,0 +1,57 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="ED" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: struct-image-16-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#ImageElement"> + <p> + Test that the 'image' element loads the same resources as when it's standalone. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there's a green rectangle visible, and no red. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-image-16-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <rect width="100%" height="100%" fill="red"/> + <image xlink:href="../images/level1.svg" width="100%" height="100%"/> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-image-17-b-manual.svg b/testing/web-platform/tests/svg/import/struct-image-17-b-manual.svg new file mode 100644 index 000000000..1d78cf3ab --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-image-17-b-manual.svg @@ -0,0 +1,52 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="CM" status="created" + version="$Revision: 1.2 $" testname="$RCSfile: struct-image-17-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#ImageElement"> + <p>Verifies that SVG images referenced from an <code><image></code> element + do not have any scripting or animation run.</p> + <p>The referenced SVG image has a green rectangle. If either animation or + script runs, it will turn the rectangle red.</p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The rendered picture should match the reference image.</p> + <p>If the rectangle is red, the test has failed.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-image-17-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x="10" y="24" font-size="16" >Test that SVG images in <image> are not scripted or animated</text> + <image xlink:href="../images/struct-image-17-b-1.svg" x="10" y="50" width="100" height="100"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-image-18-f-manual.svg b/testing/web-platform/tests/svg/import/struct-image-18-f-manual.svg new file mode 100644 index 000000000..2e5f99c85 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-image-18-f-manual.svg @@ -0,0 +1,62 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="ED" status="created" + version="$Revision: 1.2 $" testname="$RCSfile: struct-image-18-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#ImageElement"> + <p> + Test referencing an svg from an 'image' element, where the referenced + svg has no viewBox and a larger width and height than the 'image' + element viewport. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if a green quarter circle with black stroke is displayed, and no red. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-image-18-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="scale(4) translate(-10 -20)"> + <path d="M55 75A 20 20 0 0 1 75 55l0 20" fill="red"/> + <image xlink:href="../images/50x50greencircle.svg" width="25" height="25" x="50" y="50"/> + <path d="M55 75A 20 20 0 0 1 75 55l0 20Z" fill="none" stroke="black" /> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-image-19-f-manual.svg b/testing/web-platform/tests/svg/import/struct-image-19-f-manual.svg new file mode 100644 index 000000000..9a52ccd24 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-image-19-f-manual.svg @@ -0,0 +1,67 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="ED" status="created" + version="$Revision: 1.1 $" testname="$RCSfile: struct-image-19-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#ImageElement"> + <p> + Test referencing an svg from an 'image' element, where the referenced + svg has a viewBox and a larger width and height than the 'image' + element viewport. + </p> + <p> + The same image resource is reference twice, and will scale to fit the + viewport that is established by the 'image' element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if two green circles are displayed, and no red. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-image-19-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="scale(4) translate(-25 -25)"> + <circle cx="62.5" cy="62.5" r="10" fill="red"/> + <circle cx="100" cy="75" r="20" fill="red"/> + <image xlink:href="../images/50x50-viewbox-greencircle.svg" width="25" height="25" x="50" y="50"/> + <image xlink:href="../images/50x50-viewbox-greencircle.svg" width="50" height="50" x="75" y="50"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.1 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-svg-01-f-manual.svg b/testing/web-platform/tests/svg/import/struct-svg-01-f-manual.svg new file mode 100644 index 000000000..efa06ed2d --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-svg-01-f-manual.svg @@ -0,0 +1,123 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" + version="$Revision: 1.4 $" testname="$RCSfile: struct-svg-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#SVGElement"> + <p> + The default values for 'width' and 'height' are '100%' and 'x' and 'y' are '0' for the 'svg' element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Empty 'svg' element is referenced via 'getElementById()'. From that reference, 'width', 'height', 'x', and 'y' are evaluated + via 'baseVal.valueAsString'. A failure of one or more tests is indicated by the word 'FAIL' in red text. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-svg-01-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <svg id="testSVG" /> + + <text x="20" y="40">Initial value of the 'svg' tag's 'width' attribute: </text> + <text x="20" y="60" id="widthResult" /> + + <text x="20" y="100">Initial value of the 'svg' tag's 'height' attribute: </text> + <text x="20" y="120" id="heightResult" /> + + <text x="20" y="160">Initial value of the 'svg' tag's 'x' attribute: </text> + <text x="20" y="180" id="xResult" /> + + <text x="20" y="220">Initial value of the 'svg' tag's 'y' attribute: </text> + <text x="20" y="240" id="yResult" /> + + <text id="failText" x="350" y="350" font-size="50" fill="red">FAIL</text> + + <script type="text/javascript"><![CDATA[ + try + { + var testSVG = document.getElementById("testSVG"); + var pass = true; + + var initialWidth = testSVG.width.baseVal.valueAsString; + document.getElementById("widthResult").appendChild(document.createTextNode(initialWidth)); + + if("100%" != initialWidth) + { + pass = false; + } + + var initialHeight = testSVG.height.baseVal.valueAsString; + document.getElementById("heightResult").appendChild(document.createTextNode(initialHeight)); + + if("100%" != initialHeight) + { + pass = false; + } + + var initialX = testSVG.x.baseVal.valueAsString; + document.getElementById("xResult").appendChild(document.createTextNode(initialX )); + + if("0" != initialX ) + { + pass = false; + } + + var initialY = testSVG.y.baseVal.valueAsString; + document.getElementById("yResult").appendChild(document.createTextNode(initialY)); + + if("0" != initialY ) + { + pass = false; + } + + if(pass) + { + document.getElementById("failText").setAttribute("display", "none"); + } + } + catch(ex) + { + //alert('ERROR: ' + ex.message); + }]]> + </script> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg> + diff --git a/testing/web-platform/tests/svg/import/struct-svg-02-f-manual.svg b/testing/web-platform/tests/svg/import/struct-svg-02-f-manual.svg new file mode 100644 index 000000000..5fff676a3 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-svg-02-f-manual.svg @@ -0,0 +1,143 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="ED" status="reviewed" + version="$Revision: 1.5 $" testname="$RCSfile: struct-svg-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#SVGElement"> + <p> + Testing various interactions on the width attribute on an svg element. + The width attribute defaults to "100%" if it's not specified. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the testframe is filled with green, and there's no red. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-svg-02-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <script type="text/ecmascript" xlink:href="../resources/testharness.js"/> + + <!-- The testroot is here only to get a predictable 480x360 viewport --> + <svg id="testroot" width="480" height="360"> + <svg id="testSVG1" /> + <svg id="testSVG2" /> + <svg id="subSVG" width="300" height="175"/> + </svg> + + <g id="testoutput"/> + + <!-- Cover the whole testframe with a simple visual result --> + <rect id="status" width="100%" height="100%" fill="none"/> + + <script type="text/javascript"><![CDATA[ + var passes = 0; + var ypos = 50; + + function verify(str, result) + { + var g = document.createElementNS("http://www.w3.org/2000/svg", "g"); + var r = document.createElementNS("http://www.w3.org/2000/svg", "rect"); + var t = document.createElementNS("http://www.w3.org/2000/svg", "text"); + var tc = document.createTextNode(str); + t.appendChild(tc); + t.setAttribute("class", "result"); + t.setAttribute("font-family", "monospace"); + t.setAttribute("font-size", "9px"); + t.setAttribute("fill", "black"); + t.setAttribute("x", "10"); + t.setAttribute("y", "7"); + r.setAttribute("y", "1"); + r.setAttribute("width", "5"); + r.setAttribute("height", "5"); + g.setAttribute("class", result ? "passed" : "failed"); + g.setAttribute("fill", result ? "lime" : "red"); + g.appendChild(r); + g.appendChild(t); + g.setAttribute("transform", "translate(10 " + ypos + ")"); + ypos += 10; + document.getElementById("testoutput").appendChild(g); + + if (result) + passes++; + } + + try + { + var testSVG = document.getElementById("testSVG1"); + var subSVG = document.getElementById("subSVG"); + var status = document.getElementById("status"); + + var base = testSVG.width.baseVal; + + verify("value: " + base.value, base.value == 480); + test(function() {assert_equals(base.value, 480)}, "Assert that the width baseVal is 100% computed to user units."); + + verify("valueInSpecifiedUnits: " + base.valueInSpecifiedUnits, base.valueInSpecifiedUnits == 100); + test(function() {assert_equals(base.value, 100)}, "Assert that the default width baseVal is 100."); + + // set the value in user units and then read it back + base.value = 240; + verify("value: " + base.value, base.value == 240); + test(function() {assert_equals(base.value, 240)}, "Assert that the width baseVal is 240 after setting it."); + verify("valueInSpecifiedUnits: " + base.valueInSpecifiedUnits, base.valueInSpecifiedUnits == 50); + test(function() {assert_equals(base.valueInSpecifiedUnits, 50)}, "Assert that the value in specified units is now 50."); + + // move the svg to be child of another viewport and read values again + subSVG.appendChild(testSVG); + verify("value: " + base.value, base.value == 150); + test(function() {assert_equals(base.value, 150)}, "Assert that the value changes to 150 after being moved to a new viewport."); + verify("valueInSpecifiedUnits: " + base.valueInSpecifiedUnits, base.valueInSpecifiedUnits == 50); + test(function() {assert_equals(base.valueInSpecifiedUnits, 50)}, "Assert that the value in specified units is still 50 after being moved to a new viewport."); + + // move an svg that hasn't been modified to another viewport and read values + testSVG = document.getElementById("testSVG2"); + subSVG.appendChild(testSVG); + base = testSVG.width.baseVal; + verify("value: " + base.value, base.value == 300); + test(function() {assert_equals(base.value, 300)}, "Assert that the width baseVal is 300 user units after being moved to a new viewport."); + } + catch(ex) + { + } + + status.setAttribute("fill", passes == 7 ? "lime" : "red"); + test(function() {assert_equals(passes,7)}, "Assert that all subtests passed."); + ]]></script> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-svg-03-f-manual.svg b/testing/web-platform/tests/svg/import/struct-svg-03-f-manual.svg new file mode 100644 index 000000000..0b03bb426 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-svg-03-f-manual.svg @@ -0,0 +1,68 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="ED" status="created" + version="$Revision: 1.1 $" testname="$RCSfile: struct-svg-03-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#ImageElement"> + <p> + Test nested svg elements. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Passed if there are two green rectangles visible, and no red. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-svg-03-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <rect x="0.5" y="0.5" width="99" height="99" fill="red"/> + <svg width="100" height="100" viewBox="0 0 50 50"> + <rect width="50" height="50" fill="lime"/> + </svg> + + <g transform="translate(120 0)"> + <rect x="0.5" y="0.5" width="99" height="99" fill="red"/> + <svg width="100" height="100" viewBox="0 0 50 50"> + <svg width="50" height="50" viewBox="0 0 200 200"> + <rect width="200" height="200" fill="lime"/> + </svg> + </svg> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.1 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-symbol-01-b-manual.svg b/testing/web-platform/tests/svg/import/struct-symbol-01-b-manual.svg new file mode 100644 index 000000000..402a0c737 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-symbol-01-b-manual.svg @@ -0,0 +1,89 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Tim Thompson" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: struct-symbol-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#SymbolElement"> + <p> + The purpose of the symbol test case is to create some symbols and then + have them rendered when instantiated by the use element. + </p> + <p> + This file contains 3 symbol definitions. Only two are ever rendered. + There is a viewport defined to be 0,0,1000,1000 on the svg element. + Each symbol has is own viewport of the same dimensions. The symbols are + scaled when they are instantiated by the use element, The first set + of symbols is 4 squares, blue and yellow in color they should appear + in the lower right of the view arranged in a checkerboard fashion. + The second symbol to be used is an image which should appear in the + upper left of the view area. The symbol that is not used and should + not be rendered is a large black rectangle. If the symbols don't + appear, there is something askew with the use statement, if they + appear but either overlap each other or in some way aren't in the + correct positions they have not honored either their viewport or + were not scaled when placed by the use element in the area defined by + it. If everything is black then perhaps a symbol was rendered that + should not have been. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if:</p> + <ul> + <li>An image is shown in the top left corner of the document.</li> + <li>A blue and yellow checkerboard pattern is shown in the bottom right corner of the document.</li> + <li>The background of the document is not filled with red.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-symbol-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <symbol id="imageRef1" viewBox="0 0 1000 1000" preserveAspectRatio="none"> + <image id="image1" x="0" y="0" width="1000" height="1000" xlink:href="../images/struct-symbol-01.png"/> + </symbol> + <symbol id="largeRect"> + <rect x="0" y="0" width="1000" height="1000" fill="red"/> + </symbol> + <symbol id="drawRects" viewBox="0 0 1000 1000" preserveAspectRatio="none"> + <rect x="0" y="0" width="500" height="500" fill="yellow"/> + <rect x="500" y="0" width="500" height="500" fill="blue"/> + <rect x="0" y="500" width="500" height="500" fill="blue"/> + <rect x="500" y="500" width="500" height="500" fill="yellow"/> + </symbol> + <g id="useNdraw"> + <use id="upperLeft" x="0" y="0" width="240" height="150" xlink:href="#imageRef1"/> + <use id="lowerRight" x="240" y="150" width="240" height="150" xlink:href="#drawRects"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-use-01-t-manual.svg b/testing/web-platform/tests/svg/import/struct-use-01-t-manual.svg new file mode 100644 index 000000000..031723038 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-use-01-t-manual.svg @@ -0,0 +1,112 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: struct-use-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#UseElement"> + <p> + The purpose of this test is to validate proper handling of + the use element. In particular, the test checks the proper inheritance + of properties through the shadow tree (rather than through the document + tree). + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test should display various elements in different shades of green. + If an element is not displayed in green, but in red fill and/or yellow + stroke, then it is in error. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-use-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <font-face font-family="FreeSerif" unicode-range="U+0020-U+00FF"> + <font-face-src> + <font-face-uri xlink:href="../resources/FreeSerifBoldItalic.svg#FreeSerifBoldItalic"/> + </font-face-src> + </font-face> + <g fill="red" stroke="yellow" stroke-width="3"> + <rect id="usedRect" width="20" height="20"/> + <circle id="usedCircle" cx="10" cy="10" r="10"/> + <ellipse id="usedEllipse" cx="10" cy="10" rx="10" ry="10"/> + <line id="usedLine" x1="0" y1="10" x2="20" y2="10"/> + <path id="usedPath" d="M 0 0 L 20 0 L 20 20 L 0 20 Z"/> + <polygon id="usedPolygon" points="0,0 20,0 20,20 0,20 0 0"/> + <polyline id="usedPolyline" points="0,0 20,0 20,20"/> + <g id="usedG"> + <rect width="10" height="20"/> + <rect x="10" width="10" height="20" fill="rgb(0,128,0)"/> + </g> + <use id="usedUse" xlink:href="#usedRect"/> + <image id="usedImage" xlink:href="../images/20x20.png" width="20" height="20"/> + <text id="usedText">Text</text> + </g> + </defs> + + + <g> + <g id="labels" transform="translate(130, 40)" font-size="20" text-anchor="end"> + <text><rect></text> + <text y="30"><circle></text> + <text y="60"><ellipse></text> + <text y="90"><line></text> + <text y="120"><polyline></text> + <text y="150"><polygon></text> + <text y="180"><path></text> + <text y="210"><image></text> + <text y="240"><text></text> + </g> + <g id="labelsColumn2" transform="translate(310, 40)" font-size="20" text-anchor="end"> + <text><g></text> + <text y="30"><use></text> + </g> + </g> + <g transform="translate(150, 25)"> + <use xlink:href="#usedRect" fill="#0F0"/> + <use y="30" xlink:href="#usedCircle" fill="#0F0"/> + <use y="60" xlink:href="#usedEllipse" fill="#0F0"/> + <use y="90" xlink:href="#usedLine" stroke="#0F0" stroke-width="2"/> + <use y="120" xlink:href="#usedPolyline" stroke="#0F0" stroke-width="2" fill="none"/> + <use y="150" xlink:href="#usedPolygon" fill="#0F0"/> + <use y="180" xlink:href="#usedPath" fill="#0F0"/> + <use y="210" xlink:href="#usedImage" fill="#FF0"/> + <use y="260" xlink:href="#usedText" fill="#0F0" font-weight="bold" font-size="25" font-style="italic" font-family="FreeSerif,serif"/> + <use x="180" y="0" xlink:href="#usedG" fill="#0F0"/> + <use x="180" y="30" xlink:href="#usedUse" fill="#0c0"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-use-03-t-manual.svg b/testing/web-platform/tests/svg/import/struct-use-03-t-manual.svg new file mode 100644 index 000000000..00c6dc9de --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-use-03-t-manual.svg @@ -0,0 +1,76 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CN" author="VH" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: struct-use-03-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#UseElement"> + <p> + The purpose of this test is to validate proper handling of + the x/y attributes on the use element. + </p> + <p> + The test shows a <use> element displayed on the right. + On the left, a group built as described in section + 5.6 of the SVG 1.1 specification validates that the + <use element is properly processed. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there are two identical diamond shapes visible. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-use-03-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <rect id="usedRect" width="100" height="100" fill="cyan" stroke="blue" stroke-width="20"/> + </defs> + + <text x="120" y="60" text-anchor="middle">Reference</text> + + <text x="360" y="60" text-anchor="middle"><use></text> + + <!-- This group is constructed as described in section 5.6 of the --> + <!-- SVG 1.1 Specification. --> + <g id="reference" transform="rotate(45,120,170) translate(70,120)"> + <rect width="100" height="100" fill="cyan" stroke="blue" stroke-width="20"/> + </g> + + <g transform="translate(240, 0)"> + <use xlink:href="#usedRect" x="70" y="120" transform="rotate(45,120,170)"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-use-04-b-manual.svg b/testing/web-platform/tests/svg/import/struct-use-04-b-manual.svg new file mode 100644 index 000000000..32fe4a67e --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-use-04-b-manual.svg @@ -0,0 +1,65 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="BB" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: struct-use-04-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#UseElement"> + <p> + The intent of the file is to determine if the UA supports references to external SVG fragments. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + See referenced image. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + To pass this test, the UA agent must display a total of 8 graphical + primitives (2 rectangles, 2 circles, 2 ellipses and 2 triangles). + For each pair of objects, one is a semi-transparent duplicate + copy at the other displayed at an offset position.. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-use-04-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g id="ExtContent"> + <use xlink:href="../images/svgRef4.svg#alpha"/> + <use xlink:href="../images/svgRef4.svg#beta"/> + <use xlink:href="../images/svgRef4.svg#gamma"/> + <use xlink:href="../images/svgRef4.svg#delta"/> + + <use xlink:href="../images/svgRef4.svg#testContent" x="-5" y="5" fill-opacity="0.5"/> + </g> + + <text font-size="20" x="240" y="30" text-anchor="middle">External references on <use></text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-use-05-b-manual.svg b/testing/web-platform/tests/svg/import/struct-use-05-b-manual.svg new file mode 100644 index 000000000..804a0613b --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-use-05-b-manual.svg @@ -0,0 +1,88 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="BB" status="accepted" + version="$Revision: 1.4 $" testname="$RCSfile: struct-use-05-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#UseElement"> + <p> + This file is intented to test the computed values in external references. + Both files (referencing and referenced) define similar colors/gradients via 'color', 'linearGradient' and 'radialGradient'. + The ids of those definitions are the same but the actual appearance are different. These definitions are used to test the + property inheritance feature of SVG. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + [[ + Describe how to use the here. The instructions should specify any + steps requied to run the test or any manual operation that need + to be performed to run the test. + ]] + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The top left rectangle should be filled with the blue linear gradient since the 'use' has a specified value + defined in the 'defs' section. The top right rectangle is forestgreen since the 'use' has a computed value. + The bottom left rectangle is also forestgreen since the fill is not inherited from the referenced element's original parent. + The bottom right rectangle is filled with the orange radial gradient since the computed value is given by the CSS cascade. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-use-05-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g color="forestgreen"> + <defs> + <linearGradient id="linearGrad1" gradientUnits="objectBoundingBox" y1="0" x1="0" y2="1" x2="1"> + <stop offset="000%" stop-color="royalblue"/> + <stop offset="033%" stop-color="white"/> + <stop offset="050%" stop-color="darkblue"/> + <stop offset="066%" stop-color="white"/> + <stop offset="100%" stop-color="royalblue"/> + </linearGradient> + + <radialGradient id="radialGrad1" gradientUnits="objectBoundingBox" cx="0.5" cy="0.5" r="0.5" fx="0.15" fy="0.15"> + <stop offset="000%" stop-color="royalblue"/> + <stop offset="033%" stop-color="white"/> + <stop offset="050%" stop-color="darkblue"/> + <stop offset="066%" stop-color="white"/> + <stop offset="100%" stop-color="royalblue"/> + </radialGradient> + </defs> + + <use xlink:href="../images/svgRef1.svg#rect1" fill="url(#linearGrad1)"/> + <use xlink:href="../images/svgRef1.svg#rect2" fill="currentColor"/> + <use xlink:href="../images/svgRef1.svg#rect3"/> + <use xlink:href="../images/svgRef1.svg#rect4"/> + + <text font-size="24" x="240" y="35" text-anchor="middle">External references and computed values</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-use-06-b-manual.svg b/testing/web-platform/tests/svg/import/struct-use-06-b-manual.svg new file mode 100644 index 000000000..958eabc6e --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-use-06-b-manual.svg @@ -0,0 +1,64 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="ED" status="created" + version="$Revision: 1.5 $" testname="$RCSfile: struct-use-06-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#UseElement"> + <p> + Test onlick handlers in externally referenced content. + + There are two 'use' elements, each of them is referencing an external file showing a rectangle. + + The rect elements in the external file have onclick attributes, and the handler will attempt to change the fill of the + referenced rect element to red. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Click each of the two green rectangles once. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the two rectangles remain green when clicked, and there is no red visible. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-use-06-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <!-- if external use isn't implemented, show red rects --> + <rect x="40.5" y="120" width="119" height="119" fill="red"/> + <rect x="180.5" y="120" width="119" height="119" fill="red"/> + + <use id="use-elm1" x="40" y="120" width="122" height="122" xlink:href="../images/struct-use-06-b-1.svg#rect1"/> + <use id="use-elm2" x="180" y="120" width="122" height="122" xlink:href="../images/struct-use-06-b-1.svg#svg-root"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-use-07-b-manual.svg b/testing/web-platform/tests/svg/import/struct-use-07-b-manual.svg new file mode 100644 index 000000000..eb1018a22 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-use-07-b-manual.svg @@ -0,0 +1,77 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="ED" status="reviewed" + version="$Revision: 1.7 $" testname="$RCSfile: struct-use-07-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#UseElement"> + <p> + This tests interactivity and event handlers on use elements. It also tests + that the <code>SVGElementInstance.correspondingElement</code> property and the + <code>CSSStyleDeclaration.setProperty()</code> method defined in + DOM Level 2 Style. By testing different ways of setting the fill on a rectangle + it verifies that the result is consistent, and that CSS properly overrides + the specified values. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + You should at first see a pyramid of four pink rects. + Click each of the pink rects once. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + If the useragent doesn't support CSS, this test does not apply. + </p> + <p> + The test has passed if when clicking each of the rects the clicked rect turns blue - + note that only the clicked rect must turn blue, if any other rect turns blue too then the test has failed. + </p> + <p> + The reference image shows the final state, what the result should be after all rects have been clicked. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-use-07-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <svg xmlns:xlink="http://www.w3.org/1999/xlink" id="svg-sub-root" viewBox="0 0 450 450" width="450" height="450"> + <g id="drawRects"> + <rect x="225" y="0" width="220" height="220" style="fill:magenta" onclick="evt.currentTarget.correspondingElement.style.fill='blue';"/> + <rect x="0" y="225" width="220" height="220" style="fill:#f0f" onclick="evt.currentTarget.correspondingElement.style.setProperty('fill','blue',null);"/> + <rect x="225" y="225" width="220" height="220" fill="#f0f" onclick="evt.currentTarget.correspondingElement.style.setProperty('fill','blue',null);"/> + </g> + </svg> + </defs> + + <use id="use-elm" x="60" y="50" width="240" height="240" xlink:href="#svg-sub-root"/> + <rect x="300" y="170" width="118" height="118" fill="magenta" onclick="evt.target.setAttribute('fill','blue')"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-use-08-b-manual.svg b/testing/web-platform/tests/svg/import/struct-use-08-b-manual.svg new file mode 100644 index 000000000..affccccfc --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-use-08-b-manual.svg @@ -0,0 +1,71 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="ED" status="empty" + version="$Revision: 1.5 $" testname="$RCSfile: struct-use-08-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#UseElement"> + <p> + [[Describe which section and what specific assertion is being tested + by the test. If the test has a number of sub tests, multiple + "testComponent" elements can be specified within the "testDescription" + element.]] + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + [[Describe how to use the here. The instructions should specify any + steps requied to run the test or any manual operation that need + to be performed to run the test.]] + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + [[Describe the pass criteria of the test here. The pass criteria is what + should be displayed when the test is run.]] + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-use-08-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g transform="translate(60,50)"> + <use id="use-elm-1" width="120" height="120" xlink:href="../images/struct-use-08-b-cycles.svg#svg-root"/> + <rect width="120" height="120" fill="none" stroke="black"/> + <text x="60" y="140" text-anchor="middle" font-size="14">'use' referencing 'svg' element</text> + </g> + + <g transform="translate(300,50)"> + <use id="use-elm-2" width="120" height="120" xlink:href="../images/struct-use-08-b-cycles.svg#image"/> + <rect width="120" height="120" fill="none" stroke="black"/> + <text x="60" y="140" text-anchor="middle" font-size="14">'use' referencing 'image' element</text> + </g> + + <text x="240" y="260" text-anchor="middle" fill="green">This text should be visible.</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-use-09-b-manual.svg b/testing/web-platform/tests/svg/import/struct-use-09-b-manual.svg new file mode 100644 index 000000000..756ecf1be --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-use-09-b-manual.svg @@ -0,0 +1,74 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="AN" status="reviewed" + version="$Revision: 1.5 $" testname="$RCSfile: struct-use-09-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#UseElement"> + <p> + This tests the use element inside a symbol definition. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + For the test to pass, 5 nested rectangles with different coloured strokes + (black, yellow, orange, purple and blue) must be rendered. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-use-09-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- put all of the actual test here --> + <defs> + <symbol id="rect1" overflow="visible"> + <rect x="-50" y="-50" width="100" height="100" fill="none" stroke="slateblue" stroke-width="5"/> + </symbol> + <symbol id="rect2" overflow="visible"> + <use xlink:href="#rect1"/> + <rect x="-60" y="-60" width="120" height="120" fill="none" stroke="purple" stroke-width="5"/> + </symbol> + <symbol id="rect3" overflow="visible"> + <use xlink:href="#rect2"/> + <rect x="-70" y="-70" width="140" height="140" fill="none" stroke="orange" stroke-width="5"/> + </symbol> + <symbol id="rect4" overflow="visible"> + <use xlink:href="#rect3"/> + <rect x="-80" y="-80" width="160" height="160" fill="none" stroke="gold" stroke-width="5"/> + </symbol> + <symbol id="rects" overflow="visible"> + <use xlink:href="#rect4"/> + <rect x="-90" y="-90" width="180" height="180" fill="none" stroke="black" stroke-width="5"/> + </symbol> + </defs> + <use x="240" y="180" xlink:href="#rects"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-use-10-f-manual.svg b/testing/web-platform/tests/svg/import/struct-use-10-f-manual.svg new file mode 100644 index 000000000..ebadc034b --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-use-10-f-manual.svg @@ -0,0 +1,130 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="DOH" author="ED" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: struct-use-10-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#UseElement"> + <p> + Properties are inherited according to the 'use' element rules, CSS selectors only apply to the original elements + and not the (conceptually) cloned DOM tree. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if the three rectangles have green fill and a thick darkgreen stroke. If any red shows the test has failed. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-use-10-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <style type="text/css"> + + /* low specificity */ + defs > rect { + fill:red; + } + + /* applies because of higher specificity */ + .testclass1 { + fill:green; + } + + /* does not apply because selectors don't apply to the (conceptually) cloned subtree */ + #testid1 .testclass1 { + fill: red; + } + + /* does not apply because of case sensitivity of class value */ + g .testClass1 { + fill:red; + } + + /* does not apply because of lower specificity */ + #g1 .testclass2 + { + fill: red + } + + /* does not apply to the used rect, because there is no inheritance from the original tree into the used subtree */ + g#g1 { + visibility: hidden + } + + /* applies because of higher specificity */ + #testid2 { + stroke:darkgreen; + } + + /* no effect for the used rect, can be referenced anyway into the used subtree */ + g#g2 { + display: none; + } + + /* applies directly to the original (referenced) rect element */ + .testclass3 > rect { + fill: green; + stroke:darkgreen; + } + + /* does not apply to the used rect, because there is no direct access with selectors into the used subtree */ + #testid3 rect { + stroke:red; + } + #testid3 rect#testrect3 { + fill:red; + } + </style> + + <defs> + <rect id="testrect1" class="testclass1" width="100" height="100"/> + <g id="g1" style="fill:red"> + <rect id="testrect2" class="testclass2" width="100" height="100" style="fill:green"/> + </g> + <g id="g2" class="class testclass3 g"> + <rect id="testrect3" width="100" height="100" stroke="red"/> + </g> + </defs> + + <text x="50%" y="3em" style="text-anchor:middle; fill:black">CSS selectors and use element</text> + + <circle class="indicator" cx="240" cy="150" r="25" fill="red"/> + <circle class="indicator" cx="390" cy="150" r="25" fill="red"/> + + <use id="testid1" xlink:href="#testrect1" x="40" y="100" style="stroke:darkgreen" stroke-width="10"/> + <use id="testid2" xlink:href="#testrect2" x="190" y="100" stroke="red" stroke-width="10"/> + <use id="testid3" xlink:href="#testrect3" x="340" y="100" style="stroke:red" stroke-width="10"/> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-use-11-f-manual.svg b/testing/web-platform/tests/svg/import/struct-use-11-f-manual.svg new file mode 100644 index 000000000..56afadd45 --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-use-11-f-manual.svg @@ -0,0 +1,151 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: struct-use-11-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#UseElement"> + <p> + CSS selectors that apply to an element referenced via 'use' also apply to the 'use' instance. + </p> + <p> + A 'style' block contains all CSS rules. Various CSS selectors are applied to 'circle' elements. A unique 'class' selector is + used for all cases to ensure that the selectors don't interfere with each other. For each 'circle', there is a corresponding + 'use' instance. For structure-related rules, a 'g' tag is used. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if twelve blue circles and no black circles are visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-use-11-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <style type="text/css"><![CDATA[ + #testId.test1 + { + fill: blue; + } + *.test2 + { + fill: blue; + } + circle.test3 + { + fill: blue; + } + .descendant circle.test4 + { + fill: blue; + } + .child > circle.test5 + { + fill: blue; + } + .test6:first-child + { + fill: blue; + } + .sibling + circle.test7 + { + fill: blue; + } + circle[cx].test8 + { + fill: blue; + } + circle[cx="50"].test9 + { + fill: blue; + } + circle[foo~="warning1"].test10 + { + fill: blue; + } + circle[lang|="en"].test11 + { + fill: blue; + } + .test12 { + fill: blue + } + .twochildren:first-child + { + fill: black; + }]]> + </style> + <defs> + <circle cx="50" cy="50" r="48" id="testId" class="test1" /> + <circle cx="50" cy="50" r="48" id="testClass" class="test2" /> + <circle cx="50" cy="50" r="48" id="testType" class="test3" /> + <g class="descendant"> + <circle cx="50" cy="50" r="48" id="testDescendant" class="test4" /> + </g> + <g class="child"> + <circle cx="50" cy="50" r="48" id="testChild" class="test5" /> + </g> + <g> + <circle cx="50" cy="50" r="48" id="testFirstChild" class="test6" /> + </g> + <g class="sibling"></g> + <circle cx="50" cy="50" r="48" id="testSibling" class="test7" /> + <circle cx="50" cy="50" r="48" id="testAttribute" class="test8" /> + <circle cx="50" cy="50" r="48" id="testAttributeWithValue" class="test9" /> + <circle cx="50" cy="50" r="48" id="testAttributeWithSpaceSeparatedValueList" class="test10" foo="warning1 warning2" /> + <circle cx="50" cy="50" r="48" id="testAttributeWithHyphenSeparatedValueList" class="test11" lang="en-us" /> + <g class="twochildren"> + <circle cx="50" cy="50" r="48" id="notFirstChild" display="none" /> + <circle cx="50" cy="50" r="48" id="testFirstChild2" class="test12" /> + </g> + </defs> + <use xlink:href="#testId" x="0" y="0" /> + <use xlink:href="#testClass" x="96" y="0" /> + <use xlink:href="#testType" x="192" y="0" /> + <use xlink:href="#testDescendant" x="288" y="0" /> + <use xlink:href="#testChild" x="0" y="100" /> + <use xlink:href="#testFirstChild" x="96" y="100" /> + <use xlink:href="#testSibling" x="192" y="100" /> + <use xlink:href="#testAttribute" x="288" y="100" /> + <use xlink:href="#testAttributeWithValue" x="0" y="200" /> + <use xlink:href="#testAttributeWithSpaceSeparatedValueList" x="96" y="200" /> + <use xlink:href="#testAttributeWithHyphenSeparatedValueList" x="192" y="200" /> + <use xlink:href="#testFirstChild2" x="288" y="200" /> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg>
\ No newline at end of file diff --git a/testing/web-platform/tests/svg/import/struct-use-12-f-manual.svg b/testing/web-platform/tests/svg/import/struct-use-12-f-manual.svg new file mode 100644 index 000000000..01660ccde --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-use-12-f-manual.svg @@ -0,0 +1,104 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: struct-use-12-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/struct.html#UseElement"> + <p> + Tests that recursive 'use' instances do not block rendering. + </p> + <p> + Various scenarios that directly and indirectly create circular references via the 'use' tag. A 'g' element is used when + structural elements are necessary. None of the 'use' scenarios render anything. 'useLongCycle' tests a chain of recursive + 'use' instances that eventually cycles back to the first element. In 'useNested' 'use' elements are nested, with the child + referring to the parent. In 'useNestedGroup' a 'use' instance references a parent 'g' element. In 'useIndirectNestedGroup' + a 'use' instance indirectly references its own parent 'g'. In 'useMultipleIndirectNestedGroup', two 'use' instances + reference their parent 'g' elements, and additional 'use' instances refer to these self-referencing 'use' elements. A green + 'rect' is used to verify that rendering was processed up to that point. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is green visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-use-12-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <use xlink:href="#useShortCycle2" x="20" y="20" id="useShortCycle1" /> + <use xlink:href="#useShortCycle1" x="20" y="20" id="useShortCycle2" /> + <use xlink:href="#useLongCycle40" x="20" y="20" id="useLongCycle1" /> + <use xlink:href="#useLongCycle1" x="20" y="20" id="useLongCycle2" /> + <use xlink:href="#useLongCycle2" x="20" y="20" id="useLongCycle3" /> + <use xlink:href="#useLongCycle3" x="20" y="20" id="useLongCycle4" /> + <use xlink:href="#useLongCycle4" x="20" y="20" id="useLongCycle5" /> + <use xlink:href="#useLongCycle5" x="20" y="20" id="useLongCycle6" /> + <use xlink:href="#useLongCycle6" x="20" y="20" id="useLongCycle7" /> + <use xlink:href="#useLongCycle7" x="20" y="20" id="useLongCycle8" /> + <use xlink:href="#useLongCycle8" x="20" y="20" id="useLongCycle9" /> + <use xlink:href="#useLongCycle9" x="20" y="20" id="useLongCycle10" /> + <use xlink:href="#useLongCycle10" x="20" y="20" id="useLongCycle11" /> + <use xlink:href="#useLongCycle1" x="20" y="20" id="useLongCycle12" /> + <use id="useNested1" xlink:href="#useNested2"> + <use id="useNested2" xlink:href="#useNested1" /> + </use> + <g id="useNestedGroup1" xlink:href="#useNestedGroup2"> + <use id="useNestedGroup2" xlink:href="#useNestedGroup1" /> + </g> + <g id="useIndirectNestedGroup1"> + <use xlink:href="#useIndirectNestedGroupElem2" id="useIndirectNestedGroupElem1" /> + </g> + <use xlink:href="#useIndirectNestedGroup1" id="useIndirectNestedGroupElem2" /> + <g id="useMultipleIndirectNestedGroup1"> + <g id="useMultipleIndirectNestedGroup2"> + <use xlink:href="#useMultipleIndirectNestedGroupElement2" id="useMultipleIndirectNestedGroupElement1" /> + </g> + <use xlink:href="#useMultipleIndirectNestedGroupElement3" id="useMultipleIndirectNestedGroupElement4" /> + </g> + <use xlink:href="#useMultipleIndirectNestedGroup1" id="useMultipleIndirectNestedGroupElement2" /> + <use xlink:href="#useMultipleIndirectNestedGroup2" id="useMultipleIndirectNestedGroupElement3" /> + <use xlink:href="#useMultipleIndirectNestedGroupElement1" id="useMultipleIndirectNestedGroupElement4" /> + <use xlink:href="#useMultipleIndirectNestedGroupElement2" /> + <use xlink:href="#useMultipleIndirectNestedGroupElement3" /> + + <!-- if we get here, the above circular usr references did not block rendering --> + <rect width="96" height="96" fill="green" /> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg>
\ No newline at end of file diff --git a/testing/web-platform/tests/svg/import/struct-use-13-f-manual.svg b/testing/web-platform/tests/svg/import/struct-use-13-f-manual.svg new file mode 100644 index 000000000..3117a3a2f --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-use-13-f-manual.svg @@ -0,0 +1,77 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="ED" author="Microsoft" status="accepted" version="$Revision: 1.3 $" testname="$RCSfile: struct-use-13-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/struct.html#UseElement"> + <p> + Test that 'use' elements are synchronized at run time with the elements they reference. + </p> + <p> + This test verifies visual synchronization during run time between 'use' instances and the elements they reference. A 'g' element containing + two 'rect' elements is referenced via 'use'. One 'rect' is red and the other has no fill specified. DOM synchronization is verified visually + by removing the red 'rect'. Presentation attribute synchronization is verified visually by setting the other rect's 'fill' attribute to 'lime'. + The 'g' that is referenced is inside of a 'defs' tag so only the 'use' instance is visible. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there is a green square visible on the page, and no red. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-use-13-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <g id="testG"> + <rect width="96" height="96" id="testRect1"/> + <rect x="96" width="96" height="96" fill="red" id="testRect2"/> + </g> + </defs> + <use xlink:href="#testG"/> + <script> + try + { + var testG = document.getElementById("testG"); + var testRect1 = document.getElementById("testRect1"); + var testRect2 = document.getElementById("testRect2"); + + testRect1.setAttribute("fill", "lime"); + testG.removeChild(testRect2); + } + catch(ex) + { + //alert('ERROR: ' + ex.message); + } + </script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-use-14-f-manual.svg b/testing/web-platform/tests/svg/import/struct-use-14-f-manual.svg new file mode 100644 index 000000000..597de799f --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-use-14-f-manual.svg @@ -0,0 +1,74 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="CM" author="Microsoft" status="reviewed" version="$Revision: 1.3 $" testname="$RCSfile: struct-use-14-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/struct.html#UseElement"> + <p> + Test that the 'use' element's 'xlink:href' attribute referencing dynamically set 'id' attributes is supported. + </p> + <p> + The test defines a 'use' element with its 'xlink:href' attribute set to 'pass' which is an invalid element id. A green 'rect' element has its 'id' + attribute set to 'pass' via 'setAttribute'. The referenced 'rect' is a child of a 'defs' element so that it does not render, and it is wrapped with a 'g' + element in order to obtain a DOM reference to it. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there is a green square visible on the page, and no red. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-use-14-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <g id="test"> + <rect width="100" height="100" fill="green" /> + </g> + </defs> + <rect width="100" height="100" fill="red"/> + <use xlink:href="#pass" /> + <script type="text/javascript"><![CDATA[ + try + { + var test = document.getElementById("test"); + var rect = test.firstChild.nextSibling; + + rect.setAttribute("id", "pass"); + } + catch(ex) + { + alert("ERROR: " + ex.message); + }]]> + </script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/struct-use-15-f-manual.svg b/testing/web-platform/tests/svg/import/struct-use-15-f-manual.svg new file mode 100644 index 000000000..90a79d7df --- /dev/null +++ b/testing/web-platform/tests/svg/import/struct-use-15-f-manual.svg @@ -0,0 +1,78 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="CM" author="Microsoft" status="reviewed" version="$Revision: 1.3 $" testname="$RCSfile: struct-use-15-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/struct.html#UseElement"> + <p> + Test that recursive 'use' elements are synchronized at run time with the originally referenced element. + </p> + <p> + Inside of a 'defs' element, a 'g' element containing two 'rect' elements is referenced via 'use'. Outside of the 'defs', a 'use' element references + the other 'use' element. One 'rect' is orange and the other has no fill specified. DOM synchronization is verified visually by removing the orange 'rect'. + Presentation attribute synchronization is verified visually by setting the other rect's 'fill' attribute to 'blue'. All elements are inside of a 'defs' + element except for the recursive 'use' element to ensure that it is the only element rendered. Verify that blue is visible and orange is not visible. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there is a green square visible on the page, and no red. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: struct-use-15-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <g id="testG"> + <rect width="96" height="96" id="testRect1" /> + <rect x="96" width="96" height="96" fill="red" id="testRect2" /> + </g> + <use xlink:href="#testG" id="testUse1" /> + </defs> + <use xlink:href="#testUse1" /> + <script type="text/javascript"><![CDATA[ + try + { + var testG = document.getElementById("testG"); + var testRect1 = document.getElementById("testRect1"); + var testRect2 = document.getElementById("testRect2"); + + testRect1.setAttribute("fill", "green"); + testG.removeChild(testRect2); + } + catch(ex) + { + alert("ERROR: " + ex.message); + }]]> + </script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/styling-class-01-f-manual.svg b/testing/web-platform/tests/svg/import/styling-class-01-f-manual.svg new file mode 100644 index 000000000..0eed402f7 --- /dev/null +++ b/testing/web-platform/tests/svg/import/styling-class-01-f-manual.svg @@ -0,0 +1,75 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: styling-class-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/styling.html#ClassAttribute"> + <p> + The 'class' attribute assigns one or more class names to an element, and shared class names among several element instances are supported. + </p> + <p> + Assigns a class to two elements and specify a 'fill: blue' style rule on the class. On one of the elements, also specify a + second class with a specified 'stroke: orange' style rule. Verify the 'fill' and 'stroke' styles applied appropriately. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there are two blue rectangles on the page, and the lower right one has an orange border. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: styling-class-01-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <style type="text/css"><![CDATA[ + .testClass + { + fill: blue; + } + .testClass2 + { + stroke: orange; + }]]> + </style> + <g> + <rect x="10" y="10" width="200" height="100" class="testClass" /> + <rect x="215" y="125" width="200" height="100" class="testClass testClass2" stroke-width="10px" /> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg>
\ No newline at end of file diff --git a/testing/web-platform/tests/svg/import/styling-css-01-b-manual.svg b/testing/web-platform/tests/svg/import/styling-css-01-b-manual.svg new file mode 100644 index 000000000..c1e629e20 --- /dev/null +++ b/testing/web-platform/tests/svg/import/styling-css-01-b-manual.svg @@ -0,0 +1,90 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Chris lilley" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: styling-css-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/styling.html#StylingWithCSS"> + <p> + Test element and class selectors. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> +Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> +The test is passed if all six shapes have a green fill. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: styling-css-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <defs> + <style type="text/css"> + rect { fill: green } + .warning { fill: green } + .bar {fill: green} + </style> + </defs> + </defs> + <!-- ====================================================================== --> + <!-- Element (GI) selectors =============================================== --> + <!-- ====================================================================== --> + + <text style="font-size:12px;" x="40" y="36"> + element selectors: + </text> + + <circle cx="160" cy="100" r="30" fill="green"/> + <g style="fill: red"> + <rect x="220" y="80" width="60" height="40"/> + </g> + <polygon points="300,100, 320,120, 340,110, 360,120, 390,90, 340,70" fill="green"/> + + <!-- ====================================================================== --> + <!-- class selectors =============================================== --> + <!-- ====================================================================== --> + <g transform="translate(0, 150)"> + + <text style="font-size:12px;" x="40" y="36"> + class selectors: + </text> + + <g style="fill: red"> + <circle class="warning" cx="160" cy="100" r="30"/> + <rect x="220" y="80" width="60" height="40"/> + <polygon class="foo bar baz" points="300,100, 320,120, 340,110, 360,120, 390,90, 340,70"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" style="fill: none;stroke:#000" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/styling-css-02-b-manual.svg b/testing/web-platform/tests/svg/import/styling-css-02-b-manual.svg new file mode 100644 index 000000000..87b5fbaa9 --- /dev/null +++ b/testing/web-platform/tests/svg/import/styling-css-02-b-manual.svg @@ -0,0 +1,85 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Chris lilley" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: styling-css-02-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/styling.html#StylingWithCSS"> + <p> + Test ID and attribute selectors + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if all six shapes have a green fill. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: styling-css-02-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <style type="text/css"> + #one, #two { fill: green } + [transform="scale(2)"] { fill: green } + #x [points] { fill: green } + </style> + </defs> + <!-- ====================================================================== --> + <!-- ID selectors selectors ============================================== --> + <!-- ====================================================================== --> + <text style="font-size:12px;" x="40" y="36"> + id selectors: + </text> + <g style="fill: green"> + <circle cx="160" cy="100" r="30"/> + <polygon points="300,100, 320,120, 340,110, 360,120, 390,90, 340,70"/> + </g> + <g style="fill: red"> + <rect id="one" x="220" y="80" width="60" height="40"/> + </g> + <!-- ====================================================================== --> + <!-- attribute selectors ================================================= --> + <!-- ====================================================================== --> + <g transform="translate(0, 150)"> + <text style="font-size:12px;" x="40" y="36"> + attribute selectors: + </text> + + <g style="fill: red" id="x"> + <circle transform="scale(2)" cx="80" cy="50" r="15"/> + <rect id="two" x="220" y="80" width="60" height="40"/> + <polygon points="300,100, 320,120, 340,110, 360,120, 390,90, 340,70"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/styling-css-03-b-manual.svg b/testing/web-platform/tests/svg/import/styling-css-03-b-manual.svg new file mode 100644 index 000000000..7a830bd9b --- /dev/null +++ b/testing/web-platform/tests/svg/import/styling-css-03-b-manual.svg @@ -0,0 +1,106 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Chris lilley" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: styling-css-03-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/styling.html#StylingWithCSS"> + <p> + Test ancestor, child and sibling selectors. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if all six shapes have a green fill. + </p> + </d:passCriteria> + <!-- + In the upper test, the selector 'immediate child' selects all elements of class + 'thischild' which are immediate children of the elements of class 'mummy'. The + rectangle and the polygon are of class'thischild' but the polygon is not an immediate + child so must not be selected. The rectangle must be green, the circle and polygon + must be green. + In the lower test, the 'adjacent sibling' selector matches elements of + class 'secundus' which are adjacent to a previous sibling of class 'primus'; + this makes the rectangle in the second test green. The first-child pseudoclass matches + circles which are the first child of elements of class 'mummy' and if correctly + selected this circle will be filled green. (The circle in the upper test is not + the first child). + --> + </d:SVGTestCase> + <title id="test-title">$RCSfile: styling-css-03-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <defs> + <style type="text/css"> + .mummy {fill: green } /* least specific */ + .mummy rect { fill: red} /* more specific, make rect red */ + .mummy > .thischild { fill: green } /* even more specific, rect green */ + .child {fill: red} + .gap > .thischild { fill: green} + .daddy {fill: red } + .daddy > .tertius {fill: green} /* bottom poly green */ + .primus + .secundus { fill: green } /* bottom rect green */ + .daddy :first-child { fill: green} /* bottom circle green */ + </style> + </defs> + + <text style="font-family:SVGFreeSansASCII;font-size:12px;" x="40" y="36"> + ancestor selectors and child selectors: + </text> + + <g class="mummy"> + <rect class="thischild" x="220" y="80" width="60" height="40"/> + <circle cx="160" cy="100" r="30"/> + <g class="child"> + <g class="generation gap"> + <polygon class="thischild" points="300,100, 320,120, 340,110, 360,120, 390,90, 340,70"/> + </g> + </g> + </g> + + <g transform="translate(0, 150)"> + <text style="font-family:SVGFreeSansASCII;font-size:12px;" x="40" y="36"> + ancestor, immediate-sibling and first-child selectors: + </text> + + <g class="daddy"> + <circle class="primus" cx="160" cy="100" r="30"/> + <rect class="secundus" x="220" y="80" width="60" height="40"/> + <polygon class="tertius" points="300,100, 320,120, 340,110, 360,120, 390,90, 340,70"/> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/styling-css-04-f-manual.svg b/testing/web-platform/tests/svg/import/styling-css-04-f-manual.svg new file mode 100644 index 000000000..90025a2ba --- /dev/null +++ b/testing/web-platform/tests/svg/import/styling-css-04-f-manual.svg @@ -0,0 +1,157 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="BB" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: styling-css-04-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/styling.html#StylingWithCSS"> + <p> + This purpose of the file is to test some of the CSS2 selector syntax. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + A UA supporting CSS selectors should render an image identical to the referenced image. + </p> + + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if a grid of 6x3 squares is shown, the colors in each column + are the same and are those of the reference image (blue, green, orange, gold, purple and silver) + </p> + <p> + For a full analysis of this test, please see + <a href="http://www.w3.org/Graphics/SVG/Test/styling-css-04-f/blow-by-blow.html" target="css"> + this explanation. + </a> + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: styling-css-04-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g fill="white"> + <text x="240" y="35" font-size="20" text-anchor="middle">CSS selector test</text> + <defs> + <style type="text/css"> + * {stroke:red; stroke-width:1;} /* 0 */ + text {stroke:none; fill:black;} /* 1 */ + rect {stroke:black; stroke-dasharray:none;} /* 1 */ + #test-frame {fill:none} /* 100 */ + g#alpha {fill:blue} /* 101 */ + a#alpha {fill:red} /* 101 */ + #alpha * rect {fill:green} /* 101 */ + #alpha-2 > rect {fill:orange} /* 101 */ + #beta rect {fill:gold} /* 101 */ + g#gamma * g * * rect {fill:silver} /* 103 */ + g#gamma * * rect {fill:purple} /* 102 */ + [stroke-width="1.0001"] {fill:blue} /* 10 */ + g#delta rect[stroke-width="1.0002"] {fill:green} /* 112 */ + g#delta > rect[stroke-width="1.0003"] {fill:orange} /* 102 */ + #delta + g > * {fill:gold} /* 101 */ + g#delta + g > rect + rect {fill:purple} /* 104 */ + #delta + g#epsilon * rect:first-child {fill:silver} /* 202 */ + #zeta [cursor] {fill:blue} /* 110 */ + g#zeta [cursor="help"] {fill:green} /* 111 */ + g#zeta [rx~="3E"] {fill:orange} /* 111 */ + g#epsilon + g [stroke-dasharray|="3.1415926"] {fill:gold} /* 112 */ + g#epsilon + g > rect.hello {fill:purple} /* 113 */ + g#eta rect:first-child {fill:silver} /* 102 */ + </style> + </defs> + <g id="alpha"> + <rect x="30" y="70" width="67.5" height="67.5" id="A1"/> + <g id="alpha-1"> + <rect x="100" y="70" width="67.5" height="67.5" id="B1" /> + </g> + <g id="alpha-2"> + <rect x="170" y="70" width="67.5" height="67.5" id="C1"/> + </g> + </g> + <g id="beta"> + <g> + <g> + <g> + <g> + <g> + <rect x="240" y="70" width="67.5" height="67.5" id="D1"/> + </g> + </g> + </g> + </g> + </g> + </g> + <g id="gamma"> + <g> + <g> + <rect x="310" y="70" width="67.5" height="67.5" id="E1"/> + <g> + <g> + <rect x="380" y="70" width="67.5" height="67.5" id="F1"/> + </g> + </g> + </g> + </g> + </g> + <g id="delta"> + <rect x="30" y="140" width="67.5" height="67.5" stroke-width="1.0001" id="A2"/> + <rect x="100" y="140" width="67.5" height="67.5" stroke-width="1.0002" id="B2"/> + <rect x="170" y="140" width="67.5" height="67.5" stroke-width="1.0003" id="C2"/> + </g> + <g id="epsilon"> + <rect x="240" y="140" width="67.5" height="67.5" id="D2"/> + <rect x="310" y="140" width="67.5" height="67.5" id="E2"/> + <g> + <rect x="380" y="140" width="67.5" height="67.5" id="F2"/> + </g> + </g> + <g id="zeta"> + <rect x="30" y="210" width="67.5" height="67.5" cursor="default" id="A3"/> + <rect x="100" y="210" width="67.5" height="67.5" cursor="help" id="B3"/> + <rect x="170" y="210" width="67.5" height="67.5" stroke-dasharray="5, 3.14" id="C3" style="fill:orange"/> + <rect x="240" y="210" width="67.5" height="67.5" rx="3E-6" stroke-dasharray="3.1415926,8" id="D3" style="fill:gold"/> + <rect x="310" y="210" width="67.5" height="67.5" class="hello" id="E3"/> + </g> + <g id="eta"> + <rect x="380" y="210" width="67.5" height="67.5" id="F3"/> + </g> + <g id="labels" font-size="16" font-family="Arial, Helvetica, sans-serif"> + <text x="64" y="60" text-anchor="middle">A</text> + <text x="133" y="60" text-anchor="middle">B</text> + <text x="200" y="60" text-anchor="middle">C</text> + <text x="270" y="60" text-anchor="middle">D</text> + <text x="340" y="60" text-anchor="middle">E</text> + <text x="410" y="60" text-anchor="middle">F</text> + <text x="20" y="113" text-anchor="middle">1</text> + <text x="20" y="183" text-anchor="middle">2</text> + <text x="20" y="253" text-anchor="middle">3</text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/styling-css-05-b-manual.svg b/testing/web-platform/tests/svg/import/styling-css-05-b-manual.svg new file mode 100644 index 000000000..5fa1e7011 --- /dev/null +++ b/testing/web-platform/tests/svg/import/styling-css-05-b-manual.svg @@ -0,0 +1,74 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CL" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: styling-css-05-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/styling.html#StylingWithCSS"> + <p> + Tests the language selectors, :lang(c). + </p> + <p> + Note that a less specific language (such as fr) also matches a more specific + language (such as fr-CA) but a more specific language (such as en-GB) does not match a less specific language (such as en). + Also note that language tags,and thus language selectors are case-insensitive. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The phrase "Good morning!" should be in green. The phrase "Bon avant-midi!" + should be in blue; in addition, the "avant-midi" should be italic because its Canadian French. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: styling-css-05-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans-ISO-8859-1.svg#iso_8859_1"/> + </font-face-src> + </font-face> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F" font-style="oblique"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSansOblique-Lat1.svg#FreeSansOblique"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <style type="text/css"> + :lang(en) { fill: green} + :lang(fr) { fill: blue } + :lang(fr-ca) {font-style: italic} + </style> + <g text-anchor="middle" font-size="30"> + <text x="240" y="100" xml:lang="en">Good morning!</text> + <text x="240" y="200" xml:lang="fr"> + Bon <tspan xml:lang="fr-CA">avant-midi</tspan>! + </text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/styling-css-06-b-manual.svg b/testing/web-platform/tests/svg/import/styling-css-06-b-manual.svg new file mode 100644 index 000000000..a3151451e --- /dev/null +++ b/testing/web-platform/tests/svg/import/styling-css-06-b-manual.svg @@ -0,0 +1,198 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CL" status="accepted" + version="$Revision: 1.4 $" testname="$RCSfile: styling-css-06-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/styling.html#StylingWithCSS"> + <p> + Tests the dynamic pseudoclasses :link, :visited, :active, :hover and :focus. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + For the test to work, you must have previously visited ../linkingToc-t.svg which you can do by + traversing the "Visited" link, then going back to this test file. + </p> + <p> + The links marked "Visited" and "Hover me" should now be purple, + while the "Unvisited" link is blue. + </p> + <p> + Note: If you do not have a pointing device, or if it provides pick but not hover + (eg a stylus on a PDA) skip the hover portion of the test and mark this part as + passed: Hover the pointing device over the "Hover me" and then, over the "And me, too!". + As each of the two text strings text is hovered, it should turn a dark orange color + while the other string should be whatever color it was before being hovered. + </p> + <p> + Note: If the device you are using does not support text selection, e.g. a mobile phone, + you may skip this part of the test and consider this part passed.:Finally, select + some of the "Select me" text. SVG states that text selection causes an element to receive focus. + There is a style rule :focus { fill: rgb( 0, 255, 127); stroke: rgb( 0, 255, 127); stroke-width:3px } + which applies, although since it has specificity + 010 while the following rule text:active {text-decoration: underline; fill: red } + has a higher specificity of 011, the fill is in fact red while the stroke is still green. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Because this is a dynamic test , a single static image cannot fully capture all the + states. The reference image simulates the state during the third subtest. Visited and + unvisited links have the appropriate blue and purple colors. The color and presentation + of the selected text are user-agent dependent, but the unselected part of the "Select me" + text must be red and underlined with a green stroke. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: styling-css-06-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <style type="text/css"> + svg:hover {fill: none} + text {fill: black} + :link {fill: #33F} + :visited {fill: rgb(138, 43, 226)} + text:active {text-decoration: underline; fill: red } + :hover {fill: rgb(255, 140, 0) } + rect:hover {fill: none } + text#revision:hover {fill: black} + :focus { fill: rgb( 0, 255, 127); stroke: rgb( 0, 255, 127); stroke-width:1.5px } + </style> + <defs> + <font horiz-adv-x="481"> + <font-face font-family="FreeSansSVG" units-per-em="1000" panose-1="2 11 5 4 2 2 2 2 2 4" ascent="800" descent="-200" alphabetic="0"/> + <missing-glyph horiz-adv-x="432" d="M33 0V666H366V0H33ZM66 33H333V633H66V33Z"/> + <glyph unicode=" " glyph-name="space" horiz-adv-x="278"/> + <glyph unicode="!" glyph-name="exclam" horiz-adv-x="278" d="M208 729V391L186 168H147L125 391V729H208ZM208 104V0H124V104H208Z"/> + <glyph unicode=""" glyph-name="quotedbl" horiz-adv-x="355" d="M52 709H145V598L118 464H79L52 598V709ZM212 709H305V598L278 464H239L212 598V709Z"/> + <glyph unicode="#" glyph-name="numbersign" horiz-adv-x="556" d="M485 697L449 501H542V433H436L405 259H510V191H393L354 -20H278L316 191H192L153 -20H77L115 191H14V259H128L159 433H51V501H172L208 697H284L248 501H373L408 697H485ZM360 433H236L204 259H329L360 433Z"/> + <glyph unicode="$" glyph-name="dollar" horiz-adv-x="556" d="M243 770H302V716Q427 707 474 615Q496 574 496 520V519H417Q416 596 359 630Q339 641 315 645L302 646V397Q402 366 431 350L433 349Q517 301 518 196V195Q518 91 450 30L426 12Q377 -17 302 -23V-126H243V-23Q89 -13 46 104Q30 150 33 208H112Q119 134 133 110L137 103Q172 55 243 46V318Q150 346 117 370Q46 421 46 515V516Q46 662 186 704Q212 712 243 716V770ZM243 405V645Q147 632 130 556L127 526Q127 436 243 405ZM302 309V46Q363 53 394 83Q436 123 436 182V183Q436 244 389 274Q360 292 302 309Z"/> + <glyph unicode="%" glyph-name="percent" horiz-adv-x="889" d="M199 685Q283 685 334 619H335Q370 573 370 513V512Q370 433 307 382Q260 343 200 343Q119 343 67 406Q29 453 29 513V514Q29 595 92 647Q139 685 199 685ZM199 615Q145 615 115 569H114Q98 544 98 515V514Q98 461 143 430Q169 413 200 413Q254 413 284 458Q301 483 301 512V513Q301 570 253 600Q229 615 199 615ZM609 709H675L280 -20H214L609 709ZM688 322Q773 322 824 256Q859 210 859 151V150Q859 71 796 20Q749 -19 689 -19Q608 -19 556 44Q518 91 518 151V152Q518 233 582 284Q629 322 688 322ZM688 252Q634 252 604 207Q587 182 587 153V152Q587 97 634 67H635V66Q636 66 636 66Q636 65 637 65Q661 51 689 51Q743 51 773 96Q790 120 790 149V150Q790 207 742 237V237L741 238Q724 248 704 251Q700 251 695 252Q693 252 690 252H688Z"/> + <glyph unicode="&" glyph-name="ampersand" horiz-adv-x="667" d="M493 334H573Q573 240 515 151L637 0H528L466 78Q417 30 389 13Q333 -23 257 -23Q141 -23 85 59Q52 108 52 175V176Q52 257 104 310Q140 346 214 389Q144 477 135 525V525Q135 527 135 530Q134 532 134 535L133 552Q133 628 197 675Q244 709 304 709Q394 709 440 643V642Q467 604 467 553V552Q467 483 412 434Q383 409 330 379L329 378L462 215Q495 272 493 334ZM285 431Q366 482 381 519Q388 534 388 553V554Q388 606 343 629Q324 639 301 639Q241 639 221 589Q215 573 215 554V553Q215 520 240 485L241 484V484L242 483L243 482V482L285 431ZM418 137L258 337Q164 277 144 227Q136 207 136 184V183Q136 118 190 80Q225 55 267 55Q334 55 402 120Q409 127 416 135Q417 135 417 136L418 137Z"/> + <glyph unicode="'" glyph-name="quotesingle" horiz-adv-x="191" d="M48 709H142V598L115 464H75L48 598V709Z"/> + <glyph unicode="(" glyph-name="parenleft" horiz-adv-x="333" d="M236 729H291Q167 529 155 300L154 259Q154 26 276 -187Q283 -200 291 -212H236Q123 -64 86 128Q73 196 73 258V259Q73 438 166 617Q197 678 236 729Z"/> + <glyph unicode=")" glyph-name="parenright" horiz-adv-x="333" d="M93 -212H38Q162 -12 174 217Q175 258 175 258Q175 491 53 704L38 729H93Q206 581 243 389Q256 321 256 259V258Q256 79 163 -100Q132 -161 93 -212Z"/> + <glyph unicode="*" glyph-name="asterisk" horiz-adv-x="389" d="M160 729H223L218 617L324 655L343 596L235 566L305 477L254 441L192 534L129 441L79 477L148 566L40 596L59 655L165 617L160 729Z"/> + <glyph unicode="+" glyph-name="plus" horiz-adv-x="584" d="M534 267V197H327V-10H257V197H50V267H257V474H327V267H534Z"/> + <glyph unicode="," glyph-name="comma" horiz-adv-x="278" d="M87 104H192V-16Q192 -147 87 -147V-109Q130 -107 140 -76Q147 -58 147 -19V-18V0H87V104Z"/> + <glyph unicode="-" glyph-name="hyphen" horiz-adv-x="333" d="M284 312V240H46V312H284Z"/> + <glyph unicode="." glyph-name="period" horiz-adv-x="278" d="M191 104V0H87V104H191Z"/> + <glyph unicode="/" glyph-name="slash" horiz-adv-x="278" d="M229 729H284L47 -20H-8L229 729Z"/> + <glyph unicode="0" glyph-name="zero" horiz-adv-x="556" d="M275 709Q378 709 436 634Q437 632 438 631Q507 537 507 338V337Q507 66 369 -3Q327 -23 275 -23Q99 -23 56 193Q43 258 43 342V343Q43 538 112 631Q166 702 261 709Q268 709 275 709ZM275 631Q133 631 133 344Q133 344 133 344V342Q133 50 273 50Q391 50 412 242Q417 287 417 344V345Q417 631 275 631Z"/> + <glyph unicode="1" glyph-name="one" horiz-adv-x="556" d="M259 505H102V568Q204 581 234 604H235Q245 611 252 621Q271 645 289 709H347V0H259V505Z"/> + <glyph unicode="2" glyph-name="two" horiz-adv-x="556" d="M506 87V0H34Q41 128 91 195Q133 250 233 307L325 359Q420 413 421 498V499Q421 571 361 610Q326 632 282 632H281Q206 632 166 575Q163 571 161 566L159 563Q142 531 138 463H50Q53 563 88 617Q148 709 284 709Q383 709 445 653Q511 594 511 502V501Q511 369 361 287L261 233Q170 180 146 131Q137 111 133 87H506Z"/> + <glyph unicode="3" glyph-name="three" horiz-adv-x="556" d="M221 325V400Q305 401 338 415Q394 438 395 509V511Q395 596 325 623Q301 632 270 632Q192 632 157 579L156 578L151 569Q136 540 135 480H47Q51 690 237 708L269 709Q408 709 460 616Q485 573 485 515V514Q485 406 386 367Q479 335 499 259Q506 233 506 199V198Q506 75 412 15Q352 -23 266 -23Q118 -23 64 79L63 80Q37 128 32 206H120Q128 74 233 58Q250 55 269 55Q373 55 405 134Q416 161 416 196V197Q416 326 269 326L232 325H221Z"/> + <glyph unicode="4" glyph-name="four" horiz-adv-x="556" d="M327 170H28V263L350 709H415V249H520V170H415V0H327V170ZM327 249V559L105 249H327Z"/> + <glyph unicode="5" glyph-name="five" horiz-adv-x="556" d="M476 709V622H181L153 424Q212 467 284 467Q404 467 468 380Q513 319 513 232V231Q513 102 426 30Q362 -23 270 -23Q159 -23 94 44L78 62Q51 95 35 172V174H123Q154 55 268 55Q369 55 407 136Q423 171 423 218V219Q423 328 347 370Q313 389 268 389Q204 389 159 346L138 323H57L110 709H476Z"/> + <glyph unicode="6" glyph-name="six" horiz-adv-x="556" d="M498 524H410Q392 611 321 628Q307 631 291 631Q180 631 146 487Q133 433 133 362Q191 441 296 441Q407 441 469 358Q513 299 513 217V216Q513 97 431 29Q369 -23 281 -23Q162 -23 103 65Q45 153 43 312Q43 317 43 322V323Q43 508 107 608Q163 692 263 707Q280 709 297 709Q412 709 467 616Q490 577 498 525V524ZM285 363Q200 363 160 297Q138 262 138 215V214Q138 128 199 82Q235 55 282 55Q358 55 398 118Q423 157 423 208V209Q423 311 352 348Q323 363 285 363Z"/> + <glyph unicode="7" glyph-name="seven" horiz-adv-x="556" d="M520 709V635Q318 367 252 96Q240 49 232 0H138Q188 218 281 389Q336 490 429 622H46V709H520Z"/> + <glyph unicode="8" glyph-name="eight" horiz-adv-x="556" d="M391 373Q512 315 513 197V196Q513 84 427 23Q364 -23 275 -23Q151 -23 84 59Q37 116 37 196V197Q37 315 158 373Q86 418 70 466Q62 488 62 519V520Q62 619 143 672Q198 709 275 709Q391 709 450 633Q488 586 488 521V520Q488 452 443 411Q443 410 442 410Q423 392 391 373ZM275 631Q195 631 165 573L164 572V572Q152 549 152 520V519Q152 449 213 421Q240 408 274 408H275Q355 408 385 465Q386 465 386 466Q398 488 398 516V517V518Q398 593 333 620Q308 631 275 631ZM275 334Q186 334 147 270Q127 238 127 196V195Q127 113 193 75Q227 55 273 55Q364 55 403 120Q423 152 423 194V195Q423 277 356 315Q321 334 275 334Z"/> + <glyph unicode="9" glyph-name="nine" horiz-adv-x="556" d="M53 162H141Q159 75 230 58Q244 55 260 55Q371 55 405 199Q418 253 418 324Q354 247 262 245H256Q144 245 82 328Q38 387 38 469V470Q38 589 120 657Q182 709 270 709Q389 709 449 621Q507 533 509 374Q509 369 509 364V363Q509 178 444 78Q391 -3 294 -20L254 -23Q139 -23 84 70Q61 110 53 162ZM269 632Q193 632 153 568L152 567Q128 529 128 478V477Q128 375 199 338Q228 323 266 323Q349 323 390 388Q413 424 413 471V472Q413 559 352 605Q315 632 269 632Z"/> + <glyph unicode=":" glyph-name="colon" horiz-adv-x="278" d="M214 104V0H110V104H214ZM214 524V420H110V524H214Z"/> + <glyph unicode=";" glyph-name="semicolon" horiz-adv-x="278" d="M215 524V420H111V524H215ZM110 104H215V-16Q215 -147 110 -147V-109Q153 -107 163 -76Q170 -58 170 -19V-18V0H110V104Z"/> + <glyph unicode="<" glyph-name="less" horiz-adv-x="584" d="M45 198V267L534 474V395L140 234L534 70V-9L45 198Z"/> + <glyph unicode="=" glyph-name="equal" horiz-adv-x="584" d="M534 353V283H50V353H534ZM534 181V111H50V181H534Z"/> + <glyph unicode=">" glyph-name="greater" horiz-adv-x="584" d="M539 267V198L50 -9V70L444 231L50 395V474L539 267Z"/> + <glyph unicode="?" glyph-name="question" horiz-adv-x="556" d="M330 199H240V254Q240 304 268 341Q285 363 320 396L322 397L344 417Q418 483 419 547Q419 547 419 547Q419 547 419 548V549Q419 619 358 649H357Q328 663 291 663Q209 663 179 605Q162 571 162 508V507H77Q77 718 257 739L296 741Q422 741 478 658L479 657V657V656Q509 611 509 550V549Q509 479 458 420Q439 397 409 370Q346 312 336 285Q330 270 330 247V246V199ZM330 104V0H240V104H330Z"/> + <glyph unicode="@" glyph-name="at" horiz-adv-x="1015" d="M665 501H748L658 221Q646 187 646 172V171Q646 144 675 131H676Q685 127 696 127Q760 127 813 199Q864 270 864 356V357Q864 477 767 566Q668 658 528 664H512Q365 664 252 562L221 531Q119 418 119 274V273Q119 132 224 35Q332 -65 493 -65H494Q573 -65 687 -33L715 -100Q603 -142 489 -142Q309 -142 178 -35Q56 65 37 212Q34 258 34 258Q34 412 129 542Q141 558 154 573Q155 574 156 575Q157 576 158 577Q172 593 188 608L192 612Q300 710 451 735Q488 741 525 741Q691 741 814 640Q930 546 948 411Q951 390 951 370V369Q951 248 867 149Q866 147 865 146Q789 57 679 57Q583 57 569 134Q503 62 428 62H427Q345 62 298 131Q264 179 264 244V245Q264 354 343 438Q420 521 519 522H521Q604 522 642 436L643 435L665 501ZM515 458Q449 458 399 387Q354 324 354 245V244Q354 177 401 143H402Q425 126 452 126H453Q511 126 555 191Q588 239 604 323L609 362Q612 417 566 444Q543 458 515 458Z"/> + <glyph unicode="A" glyph-name="A" horiz-adv-x="667" d="M474 219H193L116 0H17L277 729H397L653 0H549L474 219ZM448 297L336 629L216 297H448Z"/> + <glyph unicode="B" glyph-name="B" horiz-adv-x="667" d="M79 0V729H375Q478 729 533 678Q591 627 591 545V544Q591 432 490 385Q595 344 616 264Q622 244 623 221Q623 215 623 209V208Q623 120 567 61Q511 0 409 0H408H79ZM172 415H352Q424 415 458 441Q498 471 498 530V531Q498 590 458 621Q424 647 352 647H172V415ZM172 82H399Q463 82 495 116L496 117Q530 152 530 206V207Q530 262 496 298Q464 333 399 333H172V82Z"/> + <glyph unicode="C" glyph-name="C" horiz-adv-x="722" d="M662 503H567Q552 578 514 613Q467 657 377 659H370Q242 659 181 544Q141 469 141 358V357Q141 187 236 108Q295 59 378 59Q487 59 538 136Q544 144 548 153Q570 195 581 266H677Q644 -23 377 -23Q236 -23 154 62Q48 171 48 355V356Q48 539 150 650Q232 741 380 741H381Q619 741 662 503Z"/> + <glyph unicode="D" glyph-name="D" horiz-adv-x="722" d="M89 0V729H370Q533 729 612 597Q613 596 613 595Q667 504 667 366V365Q667 156 551 61Q478 0 370 0H89ZM182 82H354Q528 82 565 263Q574 308 574 363V364Q574 610 406 642Q381 647 354 647H182V82Z"/> + <glyph unicode="E" glyph-name="E" horiz-adv-x="667" d="M183 332V82H613V0H90V729H595V647H183V414H580V332H183Z"/> + <glyph unicode="F" glyph-name="F" horiz-adv-x="611" d="M183 332V0H90V729H579V647H183V414H531V332H183Z"/> + <glyph unicode="G" glyph-name="G" horiz-adv-x="778" d="M709 385V-4H650L627 93Q523 -23 379 -23H378Q225 -23 131 91Q44 195 44 356V357Q44 533 146 643Q160 658 176 671Q261 741 393 741H394Q573 741 654 623Q687 574 699 508H604Q583 606 488 642Q446 659 393 659Q261 659 190 555Q137 477 137 363V362Q137 236 198 152L214 133Q280 61 392 59Q395 59 398 59Q512 59 578 139Q627 199 627 282V283V303H405V385H709Z"/> + <glyph unicode="H" glyph-name="H" horiz-adv-x="722" d="M551 332H177V0H83V729H176V414H551V729H644V0H551V332Z"/> + <glyph unicode="I" glyph-name="I" horiz-adv-x="278" d="M194 729V0H100V729H194Z"/> + <glyph unicode="J" glyph-name="J" horiz-adv-x="500" d="M333 729H426V182Q426 58 336 5Q287 -23 220 -23Q96 -23 44 63Q17 108 17 169V170V234H112V187Q112 76 193 58L221 55Q279 55 309 98L310 100Q333 134 333 215V216V729Z"/> + <glyph unicode="K" glyph-name="K" horiz-adv-x="667" d="M172 255V0H79V729H172V360L535 729H655L358 432L658 0H548L291 374L172 255Z"/> + <glyph unicode="L" glyph-name="L" horiz-adv-x="556" d="M173 729V82H533V0H80V729H173Z"/> + <glyph unicode="M" glyph-name="M" horiz-adv-x="833" d="M468 0H370L163 611V0H75V729H204L420 94L632 729H761V0H673V611L468 0Z"/> + <glyph unicode="N" glyph-name="N" horiz-adv-x="722" d="M646 729V0H541L164 591V0H76V729H177L558 133V729H646Z"/> + <glyph unicode="O" glyph-name="O" horiz-adv-x="778" d="M389 741Q563 741 660 618L661 617Q662 616 663 615Q723 536 738 422Q742 389 742 354V353Q742 205 660 100Q640 74 616 54Q525 -23 390 -23Q223 -23 125 94Q38 198 38 358V359Q38 543 149 650Q244 741 389 741ZM389 659Q259 659 187 557Q131 478 131 360V359Q131 201 226 118Q293 59 390 59Q519 59 591 159Q649 237 649 354V355Q649 520 551 603Q485 659 389 659Z"/> + <glyph unicode="P" glyph-name="P" horiz-adv-x="667" d="M184 309V0H91V729H392Q553 729 600 611Q617 570 617 516V515Q617 418 554 361Q496 309 414 309H413H184ZM184 391H378Q480 391 510 465Q520 488 520 518V519Q520 609 441 637Q441 637 440 637Q413 647 378 647H184V391Z"/> + <glyph unicode="Q" glyph-name="Q" horiz-adv-x="778" d="M733 -1L686 -59L581 28Q495 -23 390 -23Q223 -23 125 94Q38 198 38 358V359Q38 543 149 650Q245 741 390 741Q556 741 654 625Q742 522 742 362V361Q742 189 639 76L733 -1ZM481 205L570 132Q649 221 649 359V360Q649 517 555 600Q487 659 390 659Q259 659 187 557Q131 478 131 360V359Q131 200 226 117Q293 59 389 59Q449 59 509 87L435 149L481 205Z"/> + <glyph unicode="R" glyph-name="R" horiz-adv-x="722" d="M186 314V0H93V729H429Q599 729 640 609Q651 576 651 535V534Q651 436 579 385Q560 372 536 360Q598 333 617 293Q634 256 635 170Q637 74 654 47Q663 34 679 23V0H566Q545 48 545 118V119L546 184Q546 293 466 310Q448 314 426 314H186ZM186 396H411Q532 396 550 482Q554 499 554 520V521Q554 587 516 619Q484 647 411 647H186V396Z"/> + <glyph unicode="S" glyph-name="S" horiz-adv-x="667" d="M596 515H508Q507 626 398 655Q366 663 326 663Q222 663 181 601V601Q163 574 163 541V540Q163 484 217 456Q242 443 283 432L466 383Q586 350 614 253Q621 228 621 201V200Q621 116 563 53L541 33Q468 -23 336 -23Q167 -23 91 81Q49 138 48 232H136Q135 167 174 120Q225 59 342 59Q431 59 476 90Q520 121 527 176L528 191Q528 267 418 302Q407 306 395 309H394L213 357Q71 394 70 525V527Q70 651 174 707Q238 741 329 741Q505 741 568 630Q596 581 596 515Z"/> + <glyph unicode="T" glyph-name="T" horiz-adv-x="611" d="M354 647V0H261V647H21V729H593V647H354Z"/> + <glyph unicode="U" glyph-name="U" horiz-adv-x="722" d="M552 729H645V217Q645 87 541 22Q469 -23 364 -23Q199 -23 126 78Q86 135 85 215Q85 217 85 217V729H178V217Q178 138 231 97Q284 59 364 59Q487 59 532 138Q551 171 552 215Q552 215 552 216V217V729Z"/> + <glyph unicode="V" glyph-name="V" horiz-adv-x="667" d="M392 0H292L30 729H130L344 112L546 729H645L392 0Z"/> + <glyph unicode="W" glyph-name="W" horiz-adv-x="944" d="M744 0H642L474 599L311 0H209L22 729H126L263 137L425 729H525L691 137L825 729H929L744 0Z"/> + <glyph unicode="X" glyph-name="X" horiz-adv-x="667" d="M391 374L649 0H534L335 304L135 0H22L280 374L38 729H151L338 443L526 729H637L391 374Z"/> + <glyph unicode="Y" glyph-name="Y" horiz-adv-x="667" d="M387 286V0H294V286L13 729H128L342 374L550 729H661L387 286Z"/> + <glyph unicode="Z" glyph-name="Z" horiz-adv-x="611" d="M581 729V645L145 82H583V0H28V82L466 647H56V729H581Z"/> + <glyph unicode="[" glyph-name="bracketleft" horiz-adv-x="278" d="M250 729V657H147V-140H250V-212H64V729H250Z"/> + <glyph unicode="\" glyph-name="backslash" horiz-adv-x="278" d="M47 729L284 -20H229L-8 729H47Z"/> + <glyph unicode="]" glyph-name="bracketright" horiz-adv-x="278" d="M23 -212V-140H126V657H23V729H209V-212H23Z"/> + <glyph unicode="^" glyph-name="asciicircum" horiz-adv-x="469" d="M197 709H270L425 329H356L234 629L113 329H44L197 709Z"/> + <glyph unicode="_" glyph-name="underscore" horiz-adv-x="556" d="M578 -126V-176H-22V-126H578Z"/> + <glyph unicode="`" glyph-name="grave" horiz-adv-x="333" d="M135 740L231 592H171L22 740H135Z"/> + <glyph unicode="a" glyph-name="a" horiz-adv-x="556" d="M535 49V-14Q500 -23 478 -23Q407 -23 394 40Q393 47 392 54Q309 -22 218 -23H214Q104 -23 61 52Q42 86 42 131V132Q42 234 134 272Q170 287 264 299L302 304Q375 313 386 342V343V344L389 362V384Q389 448 308 460Q291 462 272 462Q169 462 152 387Q150 378 149 369H65Q68 441 101 478Q156 539 275 539Q451 539 470 423Q472 411 472 397V396V88Q472 47 517 47L535 49ZM389 165V259Q357 244 275 233Q266 232 255 230Q149 215 133 161L129 135V134Q129 69 196 54Q212 50 232 50Q304 50 356 97Q388 126 389 161Q389 162 389 162V162V163V163V165Z"/> + <glyph unicode="b" glyph-name="b" horiz-adv-x="556" d="M54 729H137V453Q194 539 299 539Q427 539 486 431Q523 363 523 265V264Q523 103 432 26Q375 -23 295 -23Q188 -23 129 67V0H54V729ZM283 461Q200 461 161 377Q137 328 137 259V258Q137 133 206 81Q239 55 283 55Q367 55 409 134Q436 185 436 254V255Q436 382 364 435Q331 460 288 461Q285 461 283 461Z"/> + <glyph unicode="c" glyph-name="c" horiz-adv-x="500" d="M471 348H387Q374 445 290 460Q282 461 272 462H263Q169 462 134 362Q118 316 118 254V253Q118 116 197 71Q226 54 265 54Q372 54 393 180H477Q466 43 362 -3Q319 -23 263 -23Q134 -23 72 82Q31 151 31 252V253Q31 413 123 490Q182 539 264 539Q370 539 428 471L436 461Q465 418 471 348Z"/> + <glyph unicode="d" glyph-name="d" horiz-adv-x="556" d="M495 729V0H421V69Q363 -14 277 -22Q266 -23 254 -23Q124 -23 64 89Q26 159 26 261Q26 261 26 262V263Q26 417 115 492Q172 539 251 539Q359 539 412 458V729H495ZM265 461Q180 461 139 379Q119 341 114 290Q113 275 113 259V258Q113 136 183 82Q219 55 266 55Q348 55 387 136Q412 186 412 255V256Q412 387 340 438Q307 461 265 461Z"/> + <glyph unicode="e" glyph-name="e" horiz-adv-x="556" d="M513 234H127Q128 162 155 122Q198 54 281 54Q383 54 418 159H502Q480 38 376 -5Q332 -23 278 -23Q142 -23 79 87Q40 155 40 253V255Q40 413 134 490Q194 539 280 539Q395 539 460 457Q480 432 492 401Q513 347 513 235V234ZM129 302H423L424 308Q424 388 365 433Q327 462 279 462Q194 462 153 387Q133 351 129 302Z"/> + <glyph unicode="f" glyph-name="f" horiz-adv-x="278" d="M258 524V456H171V0H88V456H18V524H88V613Q88 701 162 725Q184 732 211 732Q234 732 258 727V658L229 659Q172 659 171 608V606V524H258Z"/> + <glyph unicode="g" glyph-name="g" horiz-adv-x="556" d="M412 524H489V86Q489 -68 448 -132Q441 -142 434 -151Q386 -211 277 -217Q266 -218 255 -218Q117 -218 67 -130Q50 -99 46 -60H131Q137 -99 162 -119L163 -120Q199 -148 258 -148Q339 -148 374 -99Q404 -58 404 43V44V71Q345 -11 272 -21Q261 -23 248 -23Q247 -23 245 -23Q162 -23 101 41Q98 44 95 47Q29 123 29 252V253Q29 404 112 483Q170 539 252 539Q350 539 412 448V524ZM261 462Q173 462 136 372Q116 325 116 259V258Q116 119 194 72Q223 54 262 54Q351 54 386 146Q404 192 404 254V255Q404 405 322 448Q295 462 261 462Z"/> + <glyph unicode="h" glyph-name="h" horiz-adv-x="556" d="M70 729H153V452Q207 522 273 535Q294 539 321 539Q431 539 470 465Q486 435 486 397V396V0H403V363Q403 418 369 442Q337 466 295 466Q211 466 174 389Q153 347 153 290V289V0H70V729Z"/> + <glyph unicode="i" glyph-name="i" horiz-adv-x="222" d="M150 524V0H67V524H150ZM150 729V624H66V729H150Z"/> + <glyph unicode="j" glyph-name="j" horiz-adv-x="222" d="M70 524H153V-109Q153 -212 25 -218H10L-18 -215V-144L2 -145Q54 -145 65 -113Q70 -99 70 -77V-76V524ZM153 729V624H70V729H153Z"/> + <glyph unicode="k" glyph-name="k" horiz-adv-x="500" d="M141 729V302L363 524H470L288 343L502 0H399L222 284L141 204V0H58V729H141Z"/> + <glyph unicode="l" glyph-name="l" horiz-adv-x="222" d="M152 729V0H68V729H152Z"/> + <glyph unicode="m" glyph-name="m" horiz-adv-x="833" d="M70 524H147V450Q201 526 275 537Q284 538 295 539H308Q397 539 440 474Q445 467 449 459Q503 524 566 535Q574 537 583 538H584Q596 539 610 539Q732 539 757 441Q762 419 762 394V393V0H678V361Q678 442 615 461Q599 466 581 466Q520 466 483 412Q458 376 458 330V329V0H374V361Q374 448 303 463L277 466Q215 466 178 410Q154 375 154 330V329V0H70V524Z"/> + <glyph unicode="n" glyph-name="n" horiz-adv-x="556" d="M70 524H147V436Q201 521 277 535Q297 539 321 539Q425 539 467 470Q486 439 487 398V396V0H404V363Q404 432 346 457Q324 466 296 466Q212 466 175 389Q154 347 154 290V289V0H70V524Z"/> + <glyph unicode="o" glyph-name="o" horiz-adv-x="556" d="M272 539Q424 539 481 410Q510 345 510 255V254Q510 87 408 16Q352 -23 273 -23Q129 -23 69 96Q36 162 36 257V258Q36 432 141 502Q196 539 272 539ZM273 462Q180 462 142 370Q123 323 123 259V258Q123 121 201 73Q232 54 273 54Q363 54 402 142Q423 189 423 254V255Q423 400 341 446Q311 462 273 462Z"/> + <glyph unicode="p" glyph-name="p" horiz-adv-x="556" d="M54 -218V524H131V445Q190 539 298 539Q425 539 485 428Q523 357 523 254V253Q523 99 434 24Q395 -9 343 -19Q322 -23 299 -23Q202 -23 139 54L138 55V-218H54ZM284 461Q201 461 162 377Q138 328 138 259V258Q138 133 207 81Q240 55 284 55Q368 55 409 134Q436 185 436 254V255Q436 382 365 435Q330 461 284 461Z"/> + <glyph unicode="q" glyph-name="q" horiz-adv-x="556" d="M495 -218H412V60Q355 -23 250 -23Q122 -23 63 85Q26 153 26 251V252Q26 413 117 490Q174 539 254 539Q361 539 421 454V524H495V-218ZM266 461Q182 461 140 380Q113 330 113 259V258Q113 136 183 82Q219 55 266 55Q348 55 388 136Q412 186 412 254V255Q412 386 341 437Q308 461 266 461Z"/> + <glyph unicode="r" glyph-name="r" horiz-adv-x="333" d="M69 524H146V429Q204 522 262 536Q275 539 289 539L321 536V451Q249 450 218 429Q215 427 212 425Q153 382 153 273V272V0H69V524Z"/> + <glyph unicode="s" glyph-name="s" horiz-adv-x="500" d="M438 378H350Q347 462 245 462Q163 462 140 413Q134 400 134 384V383Q134 338 200 316L231 308L311 289Q429 261 452 191Q459 170 459 144V143Q459 47 369 3Q317 -23 243 -23Q49 -23 35 139L34 156H122Q128 109 146 89Q179 54 250 54Q334 54 362 101Q372 116 372 135V136Q372 182 318 201Q309 204 299 207H298L291 209L213 228Q94 257 63 308Q54 324 50 345L47 379Q47 472 131 514Q180 539 248 539Q393 539 428 438Q438 411 438 378Z"/> + <glyph unicode="t" glyph-name="t" horiz-adv-x="278" d="M254 524V456H168V97Q168 59 190 53L214 50Q239 50 254 54V-16Q215 -23 186 -23Q97 -23 86 44Q85 60 85 60V456H14V524H85V668H168V524H254Z"/> + <glyph unicode="u" glyph-name="u" horiz-adv-x="556" d="M482 0H407V73Q351 -6 277 -19Q257 -23 232 -23Q125 -23 84 47Q65 78 65 119V120V524H148V153Q148 83 207 59Q228 50 255 50H256Q341 50 379 128Q399 170 399 226V227V524H482V0Z"/> + <glyph unicode="v" glyph-name="v" horiz-adv-x="500" d="M285 0H194L10 524H104L244 99L392 524H486L285 0Z"/> + <glyph unicode="w" glyph-name="w" horiz-adv-x="722" d="M554 0H459L353 411L252 0H158L6 524H98L205 116L305 524H407L510 116L614 524H708L554 0Z"/> + <glyph unicode="x" glyph-name="x" horiz-adv-x="500" d="M292 271L473 0H376L245 201L112 0H17L202 267L27 524H122L248 334L374 524H468L292 271Z"/> + <glyph unicode="y" glyph-name="y" horiz-adv-x="500" d="M388 524H478L245 -110Q223 -167 188 -193Q154 -218 110 -218Q79 -218 54 -205V-130Q81 -136 98 -136Q143 -136 161 -96Q163 -91 165 -85L197 -2L20 524H109L243 116L388 524Z"/> + <glyph unicode="z" glyph-name="z" horiz-adv-x="500" d="M443 524V450L132 73H457V0H31V75L344 451H52V524H443Z"/> + </font> + </defs> + <g font-size="30" font-family="FreeSansSVG"> + <text x="50" y="70" id="act"> + <a xlink:href="../images/linkingToc-t.svg">Visited</a> + </text> + <text x="250" y="70"> + <a xlink:href="http://example.com/not-there">Unvisited</a> + </text> + <text x="50" y="140"> + <a xlink:href="../images/linkingToc-t.svg">Hover me</a> + </text> + <text x="250" y="140">And me, too!</text> + <text font-size="60" x="80" y="250" id="sel">Select me</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/styling-css-07-f-manual.svg b/testing/web-platform/tests/svg/import/styling-css-07-f-manual.svg new file mode 100644 index 000000000..f036f6dab --- /dev/null +++ b/testing/web-platform/tests/svg/import/styling-css-07-f-manual.svg @@ -0,0 +1,62 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="Microsoft" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: styling-css-07-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/styling.html#StylingWithCSS"> + <p> + Tests that inline CSS styling (style attributes) is supported. + </p> + <p> + Specifies an inline 'visibility: hidden' style rule on a red element and verifies there is no red on the page. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if a green rectangle is visible, and there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: styling-css-07-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <rect x="10" y="10" height="100" width="200" fill="green" /> + <rect x="10" y="10" height="100" width="200" style="visibility: hidden;" fill="red" /> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg>
\ No newline at end of file diff --git a/testing/web-platform/tests/svg/import/styling-css-08-f-manual.svg b/testing/web-platform/tests/svg/import/styling-css-08-f-manual.svg new file mode 100644 index 000000000..8f18acdab --- /dev/null +++ b/testing/web-platform/tests/svg/import/styling-css-08-f-manual.svg @@ -0,0 +1,116 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="Microsoft" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: styling-css-08-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/styling.html#StylingWithCSS"> + <p> + Test that CSS styling via the 'style' element is supported. + </p> + <p> + For each of a representative sampling of selectors, specify a 'visibility: hidden' style rule and add a corresponding red + element to the markup. A reference in green is shown for each shape. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there is no red visible on the page and there are seven green shapes visible. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: styling-css-08-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <style type="text/css"><![CDATA[ + path + { + visibility: hidden; + } + g svg circle + { + visibility: hidden; + } + g > ellipse + { + visibility: hidden; + } + ellipse + circle + { + visibility: hidden; + } + [id=testAttributeSelector] + { + visibility: hidden; + } + #testIdSelector + { + visibility: hidden; + } + #testPseudoClassSelector:first-child + { + visibility: hidden; + } + .reference { visibility: visible !important } + ]]> + </style> + + <path class="reference" d="M 50 125 L 150 125 L 100 75 z" fill="lime" visibility="hidden"/> + <path id="testTypeSelector" d="M 50 125 L 150 125 L 100 75 z" fill="red" /> + <g> + <svg width="200" height="200"> + <circle class="reference" cx="50" cy="175" r="25" fill="lime" visibility="hidden"/> + <circle id="testDescendantSelector" cx="50" cy="175" r="25" fill="red" /> + </svg> + </g> + <g id="testParentContainer"> + <ellipse class="reference" cx="160" cy="200" rx="25" ry="45" fill="lime" visibility="hidden"/> + <circle class="reference" cx="100" cy="300" r="40" fill="lime" visibility="hidden"/> + <ellipse id="testChildSelector" cx="160" cy="200" rx="25" ry="45" fill="red" /> + <circle id="testAdjacentSiblingSelector" cx="100" cy="300" r="40" fill="red" /> + </g> + <circle class="reference" cx="300" cy="80" r="35" fill="lime" visibility="hidden"/> + <circle id="testAttributeSelector" cx="300" cy="80" r="35" fill="red" /> + + <circle class="reference" cx="400" cy="140" r="50" fill="lime" visibility="hidden"/> + <circle id="testIdSelector" cx="400" cy="140" r="50" fill="red" /> + + <rect class="reference" x="270" y="240" width="150" height="80" fill="lime" visibility="hidden"/> + <g> + <rect id="testPseudoClassSelector" x="270" y="240" width="150" height="80" fill="red" /> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> --> +</svg> diff --git a/testing/web-platform/tests/svg/import/styling-css-09-f-manual.svg b/testing/web-platform/tests/svg/import/styling-css-09-f-manual.svg new file mode 100644 index 000000000..f4be4a175 --- /dev/null +++ b/testing/web-platform/tests/svg/import/styling-css-09-f-manual.svg @@ -0,0 +1,82 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="Microsoft" status="reviewed" + version="$Revision: 1.5 $" testname="$RCSfile: styling-css-09-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/styling.html#StylingWithCSS"> + <p> + Tests that CSS styling from an external style sheet is supported. + </p> + <p> + For each of a representative sampling of selectors, a 'visibility: hidden' style rule is specified + to match a corresponding element in the markup. Identically shaped and sized elements (but which are not + applicable to any of the style selectors) are placed beneath them and should be visible + if the style sheet was applied correctly. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test passes if there are seven blue shapes on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: styling-css-09-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-size="18"> + <style type="text/css"><![CDATA[ + @import url("../images/selector-types-visibility-hidden.css");]]> + </style> + <path class="reference" d="M 50 125 L 150 125 L 100 75 z" fill="blue" visibility="hidden"/> + <path id="testTypeSelector" d="M 50 125 L 150 125 L 100 75 z" fill="red" /> + <g> + <svg width="200" height="200"> + <circle class="reference" cx="50" cy="175" r="25" fill="blue" visibility="hidden"/> + <circle id="testDescendantSelector" cx="50" cy="175" r="25" fill="red" /> + </svg> + </g> + <g id="testParentContainer"> + <ellipse class="reference" cx="160" cy="200" rx="25" ry="45" fill="blue" visibility="hidden"/> + <circle class="reference" cx="100" cy="300" r="40" fill="blue" visibility="hidden"/> + <ellipse id="testChildSelector" cx="160" cy="200" rx="25" ry="45" fill="red" /> + <circle id="testAdjacentSiblingSelector" cx="100" cy="300" r="40" fill="red" /> + </g> + <circle class="reference" cx="300" cy="80" r="35" fill="blue" visibility="hidden"/> + <circle id="testAttributeSelector" cx="300" cy="80" r="35" fill="red" /> + <circle class="reference" cx="400" cy="140" r="50" fill="blue" visibility="hidden"/> + <circle id="testIdSelector" cx="400" cy="140" r="50" fill="red" /> + <rect class="reference" x="270" y="240" width="150" height="80" fill="blue" visibility="hidden"/> + <g> + <rect id="testPseudoClassSelector" x="270" y="240" width="150" height="80" fill="red" /> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/styling-css-10-f-manual.svg b/testing/web-platform/tests/svg/import/styling-css-10-f-manual.svg new file mode 100644 index 000000000..66884a228 --- /dev/null +++ b/testing/web-platform/tests/svg/import/styling-css-10-f-manual.svg @@ -0,0 +1,76 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="CL" status="reviewed" + version="$Revision: 1.3 $" testname="$RCSfile: styling-css-10-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG/styling.html#CaseSensitivity"> + <p> + Checks that stylesheets (style attributes, style elements, +external style sheets) are case-insensitive, unlike presentational attributes. </p> + +<p>Subtest a checks that the invalid attribute +FiLl is ignored. Subtest b checks that the style attribute is +applied, the values being case-insensitive. Subtests c and d check +the same for style elements and imported external style sheets. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + If any red shows, the test fails. If four orange circles are shown, + the test passes and the user agent supports CSS style sheets. If + the top two circles are orange while the bottom two are blue, and the user agent does + not claim to support CSS style sheets, the test also passes. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: styling-css-10-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <g fill="orange"> + <circle id="a" FiLl="red" cx="140" cy="100" r="50"/> + </g> + <circle id="b" fill="red" style="FiLl: oRaNgE" cx="340" cy="100" r="50"/> + <circle id="c" fill="blue" cx="140" cy="220" r="50"/> + <circle id="d" fill="blue" cx="340" cy="220" r="50"/> + + <style type="text/css"> + @import url("../images/case-insensitivity.css"); + #c {fill: red } + #c {FiLl: oRaNgE } + </style> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/styling-elem-01-b-manual.svg b/testing/web-platform/tests/svg/import/styling-elem-01-b-manual.svg new file mode 100644 index 000000000..718b231cb --- /dev/null +++ b/testing/web-platform/tests/svg/import/styling-elem-01-b-manual.svg @@ -0,0 +1,75 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="CL" author="CM" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: styling-elem-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/styling.html#StyleElement"> + <p> + This tests that the 'type' attribute on a 'style' element is + honored. + </p> + <p> + Once the test is loaded, two rectangles are presented, + the upper indicating the result of a sub-test that checks + whether the 'type' attribute on a 'style' element correctly + defaults to "text/css", and the lower indicating the result + of a sub-test that checks whether a bogus value for 'type' + does not cause the 'style' element contents to be interpreted + as CSS. Each rectangle is green if the sub-test is passed + or red if it failed. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if both rectangles are green. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: styling-elem-01-b.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text x='10' y='30'>Test that <style type=""> is honored</text> + + <rect id='r1' x='10' y='50' width='50' height='50' fill='red'/> + <rect id='r2' x='10' y='110' width='50' height='50' fill='green'/> + <text x='70' y='78'>No type="" attribute</text> + <text x='70' y='138'>Rubbish type="" attribute</text> + + <style>#r1 { fill: green }</style> + <style type='text/some-unknown-styling-language'>#r2 { fill: red }</style> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/styling-inherit-01-b-manual.svg b/testing/web-platform/tests/svg/import/styling-inherit-01-b-manual.svg new file mode 100644 index 000000000..1e49a4b38 --- /dev/null +++ b/testing/web-platform/tests/svg/import/styling-inherit-01-b-manual.svg @@ -0,0 +1,83 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Chris Lilley" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: styling-inherit-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/styling.html#Inheritance"> + <p> + Verify property inheritance as required by 6.15 "Property + inheritance". Since all implementations are required to do this, only + presentation attributes are used. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> +Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + At the center right, there is an ellipse. The fill color is not + specified on that element but on its parent. The ellipse should be filled a solid yellow + </p> + <p> + At the top left, an oval shape is formed from a rectangle + with a radial gradient. The color of the middle stop uses the keyword 'inherit' + and thus takes its parent's value of green, giving a yellow, green, white gradient. + </p> + <p> + At the bottom left, an oval shape is formed from a rectangle + with a radial gradient. The color of the middle stop uses the value 'currentColor' + and thus takes the value its parent's color property, a dark red, + giving a yellow, dark red, white gradient. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: styling-inherit-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g fill="yellow"> + <g stroke="#555"> + <ellipse rx="90" ry="60" cx="330" cy="140"/> + </g> + </g> + <radialGradient id="ygw" stop-color="green"> + <stop offset="0%" stop-color="yellow"/> + <stop offset="50%" stop-color="inherit"/> + <stop offset="100%" stop-color="white"/> + </radialGradient> + <rect width="180" height="120" x="40" y="20" stroke="none" fill="url(#ygw)"/> + <radialGradient id="yrw" color="#700"> + <stop offset="0%" stop-color="yellow"/> + <stop offset="50%" stop-color="currentColor"/> + <stop offset="100%" stop-color="white"/> + </radialGradient> + <rect width="180" height="120" x="40" y="160" stroke="none" fill="url(#yrw)"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/styling-pres-01-t-manual.svg b/testing/web-platform/tests/svg/import/styling-pres-01-t-manual.svg new file mode 100644 index 000000000..72ee060e0 --- /dev/null +++ b/testing/web-platform/tests/svg/import/styling-pres-01-t-manual.svg @@ -0,0 +1,61 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Chris Lilley" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: styling-pres-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/styling.html#UsingPresentationAttributes"> + <p> + Tests that !important in a presentation attribute is an unsupported value + </p> + <p> + A fill attribute is set to red with !important. This is an unsupported attribute value, + consequently the fill attribute should be the lacuna value, which is black. Therefore, to pass, the rectangle should be filled with black. + </p> + <p>A lime green border is also drawn, to check that rendering continues after the element with the unsupported value.</p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rectangle should be filled with black, with a lime green border. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: styling-pres-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <circle r="80" cx="240" cy="150" fill="blue" /> + <rect width="200" height="160" x="140" y="70" fill="red !important" /> + <rect width="200" height="160" x="140" y="70" fill="none" stroke="lime" stroke-width="4" /> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/styling-pres-02-f-manual.svg b/testing/web-platform/tests/svg/import/styling-pres-02-f-manual.svg new file mode 100644 index 000000000..3e116fd10 --- /dev/null +++ b/testing/web-platform/tests/svg/import/styling-pres-02-f-manual.svg @@ -0,0 +1,216 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="CL" author="CM" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: styling-pres-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/styling.html#UsingPresentationAttributes"> + <p> + This tests that a presentation attribute that is not relevant + to a given element which is otherwise stylable is correctly stored + in the property collection for that element. In particular, + it tests the following presentation attributes: + </p> + <ul> + <li>fill on image</li> + <li>stop-opacity on tspan</li> + <li>font-size on rect</li> + <li>font-style on circle</li> + <li>stop-color on text</li> + <li>font-variant on ellipse</li> + <li>letter-spacing on polyline</li> + <li>flood-color on tref</li> + <li>flood-opacity on textPath</li> + <li>color-interpolation-filters on altGlyph</li> + <li>display on linearGradient</li> + <li>fill-rule on stop</li> + <li>visibility on radialGradient</li> + <li>lighting-color on clipPath</li> + </ul> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test comprises 14 sub-tests, each with a rectangle that indicates + whether a given presentation attribute of the 14 listed in the test + description affects the style of the element on which it is specified. A rectangle + is black if the sub-test did not run, red if the sub-test failed and + green if the sub-test succeeded. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if all 14 rectangles are green. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: styling-pres-02-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x='10' y='20'>Testing inapplicable presentation attributes</text> + + <g visibility='hidden'> + <path id="path" d="M0,0"/> + <image id='image' xlink:href='../images/20x20.png' width='10' height='10' fill='rgb(0, 0, 255)'/> + <rect id='rect' width='10' height='10' font-size='123px'/> + <circle id='circle' r='10' font-style='italic'/> + <ellipse id='ellipse' rx='10' ry='5' font-variant='small-caps'/> + <polyline id='polyline' points='0,0 10,10' letter-spacing='20px'/> + <text id='text' stop-color='rgb(0, 255, 0)'>a<tspan id='tspan' stop-opacity='0.5'>b</tspan><tref id='tref' xlink:href='#tspan' flood-color='rgb(255, 0, 0)'/><textPath id='textPath' xlink:href='#path' flood-opacity='0.25'/><altGlyph id='altGlyph' glyphRef='blah' color-interpolation-filters='auto'>c</altGlyph></text> + <linearGradient id='linearGradient' display='block'><stop id='stop' offset='0' fill-rule='evenodd'/></linearGradient> + <radialGradient id='radialGradient' visibility='hidden'><stop offset='0'/></radialGradient> + <clipPath id='clipPath' lighting-color='rgb(255, 255, 255)'/> + </g> + + <g font-size='14'> + <rect id='r1' x='10' y='25' width='20' height='20'/> + <text x='40' y='40'>fill on image</text> + + <rect id='r2' x='10' y='55' width='20' height='20'/> + <text x='40' y='70'>stop-opacity on tspan</text> + + <rect id='r3' x='10' y='85' width='20' height='20'/> + <text x='40' y='100'>font-size on rect</text> + + <rect id='r4' x='10' y='115' width='20' height='20'/> + <text x='40' y='130'>font-style on circle</text> + + <rect id='r5' x='10' y='145' width='20' height='20'/> + <text x='40' y='160'>stop-color on text</text> + + <rect id='r6' x='10' y='175' width='20' height='20'/> + <text x='40' y='190'>font-variant on ellipse</text> + + <rect id='r7' x='10' y='205' width='20' height='20'/> + <text x='40' y='220'>letter-spacing on polyline</text> + + <rect id='r11' x='250' y='25' width='20' height='20'/> + <text x='280' y='40'>flood-color on tref</text> + + <rect id='r12' x='250' y='55' width='20' height='20'/> + <text x='280' y='70'>flood-opacity on textPath</text> + + <rect id='r13' x='250' y='85' width='20' height='20'/> + <text x='280' y='100'>clr-intp-filters on altGlyph</text> + + <rect id='r14' x='250' y='115' width='20' height='20'/> + <text x='280' y='130'>display on linearGradient</text> + + <rect id='r15' x='250' y='145' width='20' height='20'/> + <text x='280' y='160'>fill-rule on stop</text> + + <rect id='r16' x='250' y='175' width='20' height='20'/> + <text x='280' y='190'>visibility on radialGradient</text> + + <rect id='r17' x='250' y='205' width='20' height='20'/> + <text x='280' y='220'>lighting-color on clipPath</text> + </g> + + <script><![CDATA[ + function $(x) { return document.getElementById(x) } + function decimalToHex(d) { + var hex = Number(d).toString(16); + while (hex.length < 2) { + hex = "0" + hex; + } + return hex; + } + + function checkSVGColor(e, p, r, g, b) { + var v; + try { + var cssstyledecl = document.defaultView.getComputedStyle(e,null); + var v = cssstyledecl.getPropertyValue(p); + var longhex = "#" + decimalToHex(r) + decimalToHex(g) + decimalToHex(b); + return v == "rgb(" + r + ", " + g + ", " + b + ")" || + v == "rgba(" + r + ", " + g + ", " + b + ", 1)" || + v == longhex || + v == longhex.toUpperCase(); + } catch (ex) { + } + return false; + } + + function checkFloat(e, p, f) { + var v; + try { + var cssstyledecl = document.defaultView.getComputedStyle(e,null); + v = cssstyledecl.getPropertyValue(p); + return parseFloat(v) == f; + } catch (ex) { + } + return false; + } + + function checkPx(e, p, f) { + var v; + try { + var cssstyledecl = document.defaultView.getComputedStyle(e,null); + v = cssstyledecl.getPropertyValue(p); + return v == f; + } catch (ex) { + } + return false; + } + + function checkIdent(e, p, i) { + var v; + i = i.toLowerCase(); + try { + var cssstyledecl = document.defaultView.getComputedStyle(e,null); + v = cssstyledecl.getPropertyValue(p); + return v.toLowerCase() == i; + } catch (ex) { + } + return false; + } + + function report(n, b) { + $('r' + n).setAttribute('fill', b ? 'green' : 'red'); + } + + report(1, checkSVGColor($('image'), 'fill', 0, 0, 255)); + report(2, checkFloat($('tspan'), 'stop-opacity', 0.5)); + report(3, checkPx($('rect'), 'font-size', '123px')); + report(4, checkIdent($('circle'), 'font-style', 'italic')); + report(5, checkSVGColor($('text'), 'stop-color', 0, 255, 0)); + report(6, checkIdent($('ellipse'), 'font-variant', 'small-caps')); + report(7, checkPx($('polyline'), 'letter-spacing', '20px')); + + report(11, checkSVGColor($('tref'), 'flood-color', 255, 0, 0)); + report(12, checkFloat($('textPath'), 'flood-opacity', 0.25)); + report(13, checkIdent($('altGlyph'), 'color-interpolation-filters', 'auto')); + report(14, checkIdent($('linearGradient'), 'display', 'block')); + report(15, checkIdent($('stop'), 'fill-rule', 'evenodd')); + report(16, checkIdent($('radialGradient'), 'visibility', 'hidden')); + report(17, checkSVGColor($('clipPath'), 'lighting-color', 255, 255, 255)); + ]]></script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> + --> +</svg> diff --git a/testing/web-platform/tests/svg/import/styling-pres-03-f-manual.svg b/testing/web-platform/tests/svg/import/styling-pres-03-f-manual.svg new file mode 100644 index 000000000..a803a8814 --- /dev/null +++ b/testing/web-platform/tests/svg/import/styling-pres-03-f-manual.svg @@ -0,0 +1,57 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="Microsoft" status="reviewed" + version="$Revision: 1.3 $" testname="$RCSfile: styling-pres-03-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/styling.html#UsingPresentationAttributes"> + <p> + Presentation attributes have lower priority than internal CSS style rules. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Specify an inline 'fill: none' style rule on an element with 'fill=red' presentation attribute and verify there is no red + on the page. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: styling-pres-03-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <rect x="10" y="10" height="100" width="200" style="fill: green;" fill="red" /> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/styling-pres-04-f-manual.svg b/testing/web-platform/tests/svg/import/styling-pres-04-f-manual.svg new file mode 100644 index 000000000..8ef604d0b --- /dev/null +++ b/testing/web-platform/tests/svg/import/styling-pres-04-f-manual.svg @@ -0,0 +1,102 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="Microsoft" status="reviewed" + version="$Revision: 1.2 $" testname="$RCSfile: styling-pres-04-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/styling.html#UsingPresentationAttributes"> + <p> + Presentation attributes have lower priority than other CSS style rules specified in an internal style sheet. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + For each of a representative sampling of selectors, specify a 'fill: green' style rule for it, and add a corresponding + element with 'fill=red' presentation attribute to the markup. Verify there is no red on the page. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: styling-pres-04-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <style type="text/css"><![CDATA[ + path + { + fill: green; + } + g svg circle + { + fill: green; + } + g > ellipse + { + fill: green; + } + ellipse + circle + { + fill: green; + } + [id=testAttributeSelector] + { + fill: green; + } + #testIdSelector + { + fill: green; + } + #testPseudoClassSelector:first-child + { + fill: green; + }]]> + </style> + + <path id="testTypeSelector" d="M 50 125 L 150 125 L 100 75 z" fill="red" /> + <g> + <svg> + <circle id="testDescendantSelector" cx="50" cy="175" r="25" fill="red" /> + </svg> + </g> + <g id="testParentContainer"> + <ellipse id="testChildSelector" cx="160" cy="200" rx="25" ry="45" fill="red" /> + <circle id="testAdjacentSiblingSelector" cx="100" cy="300" r="40" fill="red" /> + </g> + <circle id="testAttributeSelector" cx="300" cy="80" r="35" fill="red" /> + <circle id="testIdSelector" cx="400" cy="140" r="50" fill="red" /> + <g> + <rect id="testPseudoClassSelector" x="270" y="240" width="150" height="80" fill="red" /> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/styling-pres-05-f-manual.svg b/testing/web-platform/tests/svg/import/styling-pres-05-f-manual.svg new file mode 100644 index 000000000..38e1c42cb --- /dev/null +++ b/testing/web-platform/tests/svg/import/styling-pres-05-f-manual.svg @@ -0,0 +1,75 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="Microsoft" status="reviewed" + version="$Revision: 1.2 $" testname="$RCSfile: styling-pres-05-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/styling.html#UsingPresentationAttributes"> + <p> + Presentation attributes have lower priority than other CSS style rules specified in an external style sheet. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + For each of a representative sampling of selectors, specify a 'fill: green' style rule for it, and add a corresponding + element with 'fill=red' presentation attribute to the markup. Verify there is no red on the page. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: styling-pres-05-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <style type="text/css"><![CDATA[ + @import url("../images/selector-types-fill-green.css");]]> + </style> + + <path id="testTypeSelector" d="M 50 125 L 150 125 L 100 75 z" fill="red" /> + <g> + <svg> + <circle id="testDescendantSelector" cx="50" cy="175" r="25" fill="red" /> + </svg> + </g> + <g id="testParentContainer"> + <ellipse id="testChildSelector" cx="160" cy="200" rx="25" ry="45" fill="red" /> + <circle id="testAdjacentSiblingSelector" cx="100" cy="300" r="40" fill="red" /> + </g> + <circle id="testAttributeSelector" cx="300" cy="80" r="35" fill="red" /> + <circle id="testIdSelector" cx="400" cy="140" r="50" fill="red" /> + <g> + <rect id="testPseudoClassSelector" x="270" y="240" width="150" height="80" fill="red" /> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/svgdom-over-01-f-manual.svg b/testing/web-platform/tests/svg/import/svgdom-over-01-f-manual.svg new file mode 100644 index 000000000..bf03243ed --- /dev/null +++ b/testing/web-platform/tests/svg/import/svgdom-over-01-f-manual.svg @@ -0,0 +1,202 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="ED" status="reviewed" + version="$Revision: 1.9 $" testname="$RCSfile: svgdom-over-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/svgdom.html#SVGDOMOverview"> + <p> + This tests how unspecified attributes affect the return values from the + SVG DOM methods related to attributes. + </p> + <p> + After loading the test, you should see a list of red or green rectangles followed by some text describing each subtest. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if there is a line of text saying "Test status: PASSED", and there is a green rectangle to the left of that text. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: svgdom-over-01-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <rect id="r" width="1" height="1"/> + <stop id="s"/> + <feConvolveMatrix id="c"/> + <image id="i" xlink:href="http://example.org/image.jpg" width="1" height="1"/> + <radialGradient id="g"/> + <text id="t"/> + <text id="tt">sometext</text> + <marker id="m"/> + <svg id="v"/> + <filter id="f"/> + <polygon id="p"/> + </defs> + + <script><![CDATA[ + var ypos = 50; + var r = document.getElementById("r"); + var s = document.getElementById("s"); + var c = document.getElementById("c"); + var i = document.getElementById("i"); + var g = document.getElementById("g"); + var t = document.getElementById("t"); + var tt = document.getElementById("tt"); + var m = document.getElementById("m"); + var v = document.getElementById("v"); + var f = document.getElementById("f"); + var p = document.getElementById("p"); + + i.removeAttributeNS("http://www.w3.org/1999/xlink", "href"); + + function Subtest(str, code) + { + this.str = str; + this.code = code ? code : str; + } + + Subtest.prototype.getStr = function() + { + return this.str; + } + + Subtest.prototype.getCode = function() + { + return this.code; + } + + function verify(str, result) + { + var g = document.createElementNS("http://www.w3.org/2000/svg", "g"); + var r = document.createElementNS("http://www.w3.org/2000/svg", "rect"); + var t = document.createElementNS("http://www.w3.org/2000/svg", "text"); + t.appendChild(document.createTextNode(str + ": " + (result ? "PASSED" : "FAILED"))); + t.setAttribute("class", "result"); + t.setAttribute("font-size", "9px"); + t.setAttribute("fill", "black"); + t.setAttribute("x", "10"); + t.setAttribute("y", "7"); + r.setAttribute("y", "1"); + r.setAttribute("width", "5"); + r.setAttribute("height", "5"); + g.setAttribute("fill", result ? "lime" : "red"); + g.appendChild(r); + g.appendChild(t); + g.setAttribute("transform", "translate(10 " + ypos + ")"); + ypos += 10; + document.getElementById("test-body-content").appendChild(g); + if(result) + passes++; + } + + var passes = 0; + var tests = [ + // test SVGLength + new Subtest("r.x.baseVal.value == 0"), + new Subtest("r.x.baseVal.unitType == 1 (SVG_LENGTHTYPE_NUMBER)", "r.x.baseVal.unitType == 1"), + new Subtest("v.width.baseVal.valueInSpecifiedUnits == 100"), + new Subtest("v.width.baseVal.unitType == 2 (SVG_LENGTHTYPE_PERCENTAGE)", "v.width.baseVal.unitType == 2"), + new Subtest("tt.textLength.baseVal.value == tt.getComputedTextLength()"), + + // test SVGAnimatedNumber + new Subtest("s.offset.baseVal == 0"), + + // test SVGAnimatedBoolean + new Subtest("c.preserveAlpha.baseVal == false"), + + // test SVGAnimatedString / DOMString + new Subtest("c.className.baseVal == \"\""), + new Subtest("i.href.baseVal == \"\""), + + // test SVGStringList + new Subtest("i.requiredFeatures.numberOfItems == 0"), + + // SVGAnimatedNumberList + new Subtest("c.kernelMatrix.baseVal.numberOfItems == 0"), + + // SVGAnimatedLengthList + new Subtest("t.x.baseVal.numberOfItems == 0"), + + // SVGAnimatedPointsList / SVGPointList + new Subtest("p.points.numberOfItems == 0"), + + // SVGAnimatedEnumeration + new Subtest("g.gradientUnits.baseVal == 2 (SVG_UNIT_TYPE_OBJECTBOUNDINGBOX)", "g.gradientUnits.baseVal == 2"), + + // SVGAnimatedInteger + new Subtest("f.filterResX.baseVal == 0"), + + // SVGAnimatedAngle + new Subtest("m.orientAngle.baseVal.value == 0"), + new Subtest("m.orientAngle.baseVal.unitType == 1 (SVG_ANGLETYPE_UNSPECIFIED)", "m.orientAngle.baseVal.unitType == 1"), + + // SVGAnimatedRect / SVGRect + new Subtest("v.viewBox.baseVal.[x,y,width,height] == 0", + "v.viewBox.baseVal.x == 0 && v.viewBox.baseVal.y == 0 && v.viewBox.baseVal.width == 0 && v.viewBox.baseVal.height == 0"), + + // SVGAnimatedTransformList + new Subtest("t.transform.baseVal.numberOfItems == 0"), + + // SVGAnimatedPreserveAspectRatio / SVGPreserveAspectRatio + new Subtest("v.preserveAspectRatio.baseVal.align == 6 (SVG_PRESERVEASPECTRATIO_XMIDYMID)", "v.preserveAspectRatio.baseVal.align == 6"), + new Subtest("v.preserveAspectRatio.baseVal.meetOrSlice == 1 (SVG_MEETORSLICE_MEET)", "v.preserveAspectRatio.baseVal.meetOrSlice == 1"), + + // SVGZoomAndPan + new Subtest("v.zoomAndPan == 2 (SVG_ZOOMANDPAN_MAGNIFY)", "v.zoomAndPan == 2") + ]; + + try { + for (var k = 0; k < tests.length; k++) + { + try + { + verify(tests[k].getStr(), eval(tests[k].getCode())); + } + catch(e) + { + verify(tests[k].getStr(), false); + } + } + } + finally + { + verify("Test status", tests.length == passes); + } + ]]></script> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-align-01-b-manual.svg b/testing/web-platform/tests/svg/import/text-align-01-b-manual.svg new file mode 100644 index 000000000..d6d6eb5a8 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-align-01-b-manual.svg @@ -0,0 +1,80 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: text-align-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#AlignmentProperties"> + <p> + Test 'text-anchor' property (horizontal). + </p> + <p> + The three lines test the three values for property 'text-anchor': start, middle and end. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The lines in pink, 'text-anchor:none' and 'text-anchor:start', should both start from the same horizontal position (indicated by the black circle on each line) and extend to the right. + The green line, 'text-anchor:middle', should be centered horizontally around the black circle. + The blue line, 'text-anchor:end', should be aligned such that the end of the text meets the black circle. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-align-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-size="34" x="5" y="40">Test 'text-anchor' (horizontal)</text> + <g id="text-anchor" font-size="14"> + <g transform="translate(230,130)"> + <line stroke="black" x2="50"/> + <circle r="3"/> + <text font-size="30" fill="fuchsia">text-anchor:none</text> + </g> + <g transform="translate(230,180)"> + <line stroke="black" x2="50"/> + <circle r="3"/> + <text font-size="30" text-anchor="start" fill="fuchsia">text-anchor:start</text> + </g> + <g transform="translate(230,230)"> + <line stroke="black" x1="-25" x2="25"/> + <circle r="3"/> + <text font-size="30" text-anchor="middle" fill="green">text-anchor:middle</text> + </g> + <g transform="translate(230,280)"> + <line stroke="black" x1="-50" x2="0"/> + <circle r="3"/> + <text font-size="30" text-anchor="end" fill="blue">text-anchor:end</text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-align-02-b-manual.svg b/testing/web-platform/tests/svg/import/text-align-02-b-manual.svg new file mode 100644 index 000000000..d172d84c2 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-align-02-b-manual.svg @@ -0,0 +1,71 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: text-align-02-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#AlignmentProperties"> + <p> + Test the 'baseline-shift' property (horizontal). + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + This three lines test property 'baseline-shift'. + The first line tests 'baseline-shift:7' (i.e., a length for 'baseline-shift'). + The pink text should be shifted upwards by an amount approximately half of the height of the text. + The second line tests 'baseline-shift:-70%' (i.e., a percentage for 'baseline-shift'). + The pink text should shift downward by about the height of the text. + The third line tests the three keywords 'sub', 'super' and 'normal'. + The string "sub" should be shifted downwards, the string "super" shifted upwards, + and the string "te" (in blue) aligned with the remainder of the text in the line. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-align-02-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-size="34" x="5" y="40">Test 'baseline-shift' (horizontal)</text> + <g id="baseline-shift" font-size="30" transform="translate(15,120)"> + <text y="0"> + Normal<tspan baseline-shift="7" fill="fuchsia">baseline-shift:7</tspan>text + </text> + <text y="70"> + Normal<tspan baseline-shift="-70%" fill="fuchsia">baseline-shift:-70%</tspan>text + </text> + <text y="140"> + Normal<tspan baseline-shift="sub" fill="fuchsia">sub</tspan><tspan baseline-shift="super" fill="green">super</tspan><tspan baseline-shift="baseline" fill="blue">te</tspan>xt + </text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-align-03-b-manual.svg b/testing/web-platform/tests/svg/import/text-align-03-b-manual.svg new file mode 100644 index 000000000..19bbf7c58 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-align-03-b-manual.svg @@ -0,0 +1,82 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Lofton Henderson" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: text-align-03-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#AlignmentProperties"> + <p> + Test for viewer capibility to handle the basics of the 'textAnchor' + alignment property for 'text' and related elements. + </p> + <p> + This test verify that + the interpreter correctly handles and applies the text-anchor + properties when present on "chunks", which are comprised of tspan elements + with absolute positioning, within the containing 'text' element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if + </p> + <ul> + <li> + The text "Begin with "end"," ends just to the left of the vertical pink + line. + </li> + <li> + The text "switch to "middle" in a tspan," is split by the vertical pink + line roughly through the second 'd' in the world "middle". + </li> + <li> + The text "and "start" ends it." begins just to the right of the + vertical pink line. + </li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-align-03-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x="5" y="40" font-size="40" fill="black">Test of 'text-anchor'</text> + + <!-- Test cases --> + <line x1="225" y1="75" x2="225" y2="225" stroke="fuchsia"/> + <g font-size="30" fill="blue"> + <text x="225" y="110" text-anchor="end"> + Begin with "end",<tspan x="225" y="160" xml:space="preserve" text-anchor="middle"> switch to "middle" in a tspan, </tspan><tspan x="225" y="210" text-anchor="start">and "start" ends it.</tspan> + </text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-align-04-b-manual.svg b/testing/web-platform/tests/svg/import/text-align-04-b-manual.svg new file mode 100644 index 000000000..812bbc274 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-align-04-b-manual.svg @@ -0,0 +1,106 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Lofton Henderson" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: text-align-04-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#AlignmentProperties"> + <p> + Test for viewer capibility to handle the basics of the 'text-anchor' + alignment property for 'text' and related elements. + </p> + <p> + The second group from the top contains sub-tests to verify that the + interpreter handles text-anchor when the text is comprised of other + text related elements, 'tspan', 'tref', and 'textPath'. + The text-anchor property is present on the containing 'text' element + in these cases, not on the contained child elements. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if: + </p> + <ul> + <li> + The text "start text pink tspan" begins just to the right of the + vertical pink line. + </li> + <li> + The text "middle text bold tspan" is split by the vertical pink line + between the words "text" and "bold". + </li> + <li> + The text "end text tref" ends just to the left of the vertical pink + line. + </li> + <li> + The text "end text on path" ends just to the left of the vertical pink + line. + </li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-align-04-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F" font-weight="700"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSansBold.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x="5" y="40" font-size="36" fill="black">Test of 'text-anchor'</text> + <defs> + <text id="tref-internal-reference">end text tref</text> + <path id="myPath" d="M -5 260 220 260"/> + </defs> + + <text x="20" y="80" font-size="30" fill="black">Tspan, tref, toap</text> + <!-- Test cases --> + <line x1="220" y1="120" x2="220" y2="260" stroke="fuchsia"/> + <g font-size="16" fill="blue"> + <text x="220" y="140" text-anchor="start"> + start text <tspan xml:space="preserve" fill="fuchsia"> pink tspan</tspan> + </text> + <text x="220" y="180" text-anchor="middle"> + middle text <tspan font-weight="bold" xml:space="preserve"> bold tspan</tspan> + </text> + <text x="220" y="220" text-anchor="end"> + <tref xlink:href="#tref-internal-reference"/> + </text> + <text text-anchor="end"> + <textPath text-anchor="end" startOffset="100%" xlink:href="#myPath">Text-anchor: end text on path</textPath> + </text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-align-05-b-manual.svg b/testing/web-platform/tests/svg/import/text-align-05-b-manual.svg new file mode 100644 index 000000000..c6fd9bc57 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-align-05-b-manual.svg @@ -0,0 +1,87 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: text-align-05-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#AlignmentProperties"> + <p> + Test 'text-anchor' property (vertical). + </p> + <p> + This tests the three values for property 'text-anchor': start, middle and end. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if three vertical lines of text are displayed with + each line containing a single black dot. + </p> + <lu> + <li> + The first vertical line of text containing the black dot at the top of + the text. + </li> + <li> + The second vertical line of text containing the black dot in the + middle of the text. + </li> + <li> + The third vertical line of text containing the black dot at the bottom + of the text. + </li> + </lu> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-align-05-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-size="40" x="5" y="40">Test 'text-anchor' (vertical)</text> + <g writing-mode="tb" glyph-orientation-vertical="0"> + <g id="text-anchor" font-family="Arial" font-size="30" transform="translate(160,150)"> + <g transform="translate(0,0)"> + <circle r="3"/> + <text text-anchor="start" fill="fuchsia">start</text> + </g> + <g transform="translate(50,0)"> + <circle r="3"/> + <text text-anchor="middle" fill="green">middle</text> + </g> + <g transform="translate(100,0)"> + <circle r="3"/> + <text text-anchor="end" fill="blue">end</text> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-align-06-b-manual.svg b/testing/web-platform/tests/svg/import/text-align-06-b-manual.svg new file mode 100644 index 000000000..62f97463c --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-align-06-b-manual.svg @@ -0,0 +1,99 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: text-align-06-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#AlignmentProperties"> + <p> + Tests various ways that the 'baseline-shift' property (vertical) can be + altered. + </p> + <p> + The first sub test sets the 'baseline-shift' to an absolute unit. The + second sub test sets the 'baseline-shift' to a percentage. The third sub + test sets the 'baseline-shift' to "sub". The fourth sub test sets the + 'baseline-shift' to "super". + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if four lines of vertical text are rendered. + </p> + <ul> + <li> + The first vertical line should contain the text "te7xt" with the "7" + part being slightly offset to the right of the rest of the letters + in the text. + </li> + <li> + The second vertical line should contain the text "te-70%xt" with the + "-70%" part of the text being offset to the left of the rest of the + letters in the text. + </li> + <li> + The third vertical line should contain the text "tesubxt" with the + "sub" part of the text being slightly offset to left of the rest of + the letters in the text. + </li> + <li> + The fourth verical line should contain the text "tesuperxt" with the + "super" part of the text being offset to the right of the rest of the + letters in the text. + </li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-align-06-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-size="36" x="0" y="40">Test 'baseline-shift' (vertic.)</text> + + <g writing-mode="tb" glyph-orientation-vertical="0"> + <g id="baseline-shift" font-family="Arial" font-size="24" transform="translate(90,60)"> + <text x="0"> + te<tspan baseline-shift="7" fill="fuchsia">7</tspan>xt + </text> + <text x="80"> + te<tspan baseline-shift="-70%" fill="fuchsia">-70%</tspan>xt + </text> + <text x="180"> + te<tspan baseline-shift="sub" fill="fuchsia">sub</tspan><tspan baseline-shift="baseline" fill="blue">x</tspan>t + </text> + <text x="260"> + te<tspan baseline-shift="super" fill="green">super</tspan><tspan baseline-shift="baseline" fill="blue">x</tspan>t + </text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-align-07-t-manual.svg b/testing/web-platform/tests/svg/import/text-align-07-t-manual.svg new file mode 100644 index 000000000..34121ebca --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-align-07-t-manual.svg @@ -0,0 +1,87 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AG" author="CN" status="issue" + version="$Revision: 1.9 $" testname="$RCSfile: text-align-07-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#AlignmentProperties"> + <p>ISSUE - http://www.w3.org/2011/02/27-svg-irc#T22-20-51</p> + <p> + Test horizontal baselines across script and font size changes. + </p> + <p> + Original test authored by Rodney Hardy at CISRA and modified by + Anthony Grasso. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The dominant baseline should be alphabetic, so the 'a' will be sitting + on the blue line, the Japanese character '犜' will be on the ideographic baseline + and 'ण' is a Devangari character and will use the hanging baseline. The + smaller versions of the characters should be aligned to the same baselines. + So the 'a's on the blue line, the Japanese characters slightly below the line + and the Devangari characters should be hanging from the hanging baseline. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-align-07-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-family="'Arial Unicode MS',Georgia,'Times New Roman',Times,'MS Mincho',serif" font-size="30"> + <!-- + The dominant baseline should be alphabetic, so the 'ab' will be sitting on the + blue line, the japanese glyphs will be on the ideographic baseline and 'ण' + is a devangari character and will use the hanging baseline. The smaller versions + of the characters should be aligned to the same baselines. So 'ab' on the alphabetic + base line, the ideographic chars slightly below the line and the devangari should be + hanging from the hanging baseline. + --> + <text x="50" y="100" font-size="50"> + a犜ण<tspan font-size="25">a犜ण</tspan><tspan font-size="10">a犜ण</tspan> + </text> + <line x1="50" y1="70" x2="400" y2="70" stroke-width="1" stroke="green"/> + <text x="320" y="80" font-size="10" fill="green"> + hanging base line + </text> + <line x1="50" y1="100" x2="400" y2="100" stroke-width="1" stroke="blue"/> + <text x="310" y="110" font-size="10" fill="blue"> + alphabetic base line + </text> + <line x1="50" y1="103" x2="250" y2="103" stroke-width="1" stroke="fuchsia"/> + <text x="155" y="113" font-size="10" fill="fuchsia"> + ideographic base line + </text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-align-08-b-manual.svg b/testing/web-platform/tests/svg/import/text-align-08-b-manual.svg new file mode 100644 index 000000000..9541f574d --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-align-08-b-manual.svg @@ -0,0 +1,91 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="CN" status="issue" + version="$Revision: 1.10 $" testname="$RCSfile: text-align-08-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#AlignmentProperties"> + <p>ISSUE - http://www.w3.org/2011/02/27-svg-irc#T22-20-51</p> + <p> + Test horizontal baselines across script and font size changes. It uses an SVG Font, where + the Latin letter "a" is a rectangle, the Japanese letter "犜" is an upward-pointing triangle, + and the Devanagari letter "ण" is a downward-pointing triangle. + </p> + <p> + Original test authored by Rodney Hardy at CISRA. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The dominant baseline should be alphabetic, so the 'a' will be sitting on the alphabetic (blue) line, + the Japanese glyph (upward pointing triangle) will be aligned on the ideographic (pink) baseline + and 'ण' is a Devangari character (downward pointing triangle) and will use the hanging baseline (green). + The smaller versions of the characters should be aligned to the same baselines as the respective larger + characters, so all like shapes align to the same baseline. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-align-08-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <font-face font-family="SVGBase"> + <font-face-src> + <font-face-uri xlink:href="../resources/Baselines/Tribase.svg#Tribase"/> + </font-face-src> + </font-face> + </defs> + <style type="text/css"> + @font-face { + font-family: Tribase ; + src: url(woffs/Tribase.woff) format("woff"); + } + </style> + <g font-family="SVGBase, Tribase"> + <!-- + The dominant baseline should be alphabetic, so the 'ab' will be sitting on the + blue line, the japanese glyphs will be on the ideographic baseline and 'ण' + is a devangari character and will use the hanging baseline. The smaller versions + of the characters should be aligned to the same baselines. So 'a' on the blue + line, the ideographic chars slightly below the line and the devangari should be + hanging from the hanging baseline. + --> + <text x="50" y="200" font-size="120"> + a犜ण<tspan font-size="75">a犜ण</tspan><tspan font-size="30">a犜ण</tspan> + </text> + <line x1="50" y1="200" x2="433" y2="200" stroke-width="1" stroke="blue"/> + <line x1="50" y1="230" x2="433" y2="230" stroke-width="1" stroke="fuchsia"/> + <line x1="50" y1="95" x2="433" y2="95" stroke-width="1" stroke="green"/> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.10 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-altglyph-01-b-manual.svg b/testing/web-platform/tests/svg/import/text-altglyph-01-b-manual.svg new file mode 100644 index 000000000..db208cea5 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-altglyph-01-b-manual.svg @@ -0,0 +1,128 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: text-altglyph-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#AlternateGlyphs"> + <p> + Test 'altGlyph' facilities and many-to-many chars to glyphs. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + <p> + This test requires some support for SVG fonts. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Three text strings show: the word "HAPPY" in pink, the word "SAD" in green + and the word "SASSY" in blue. + </p> + <p> + The "HAPPY" and "SAD" strings test the 'altGlyph' facility and + the ability to map multiple glyphs to a single character. + All characters except the "D" are bracketed by 'altGlyph' elements + to use two different glyphs to render each character. + For "HAPPY", the horizontal stroke through the center of the characters + is a smile stroke. + For "SAD", the horizontal stroke through the center of the characters + is a frown stroke. + </p> + <p> + The "SASSY" string tests a single glyph representing multiple characters + (a ligature). The SVG font in the test case contains an "SS" ligature + so that the "SS" in "SASSY" is rendered with a single glyph, where + the two parts of the "SS" are connected. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-altglyph-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g stroke-miterlimit="4"> + <text font-family="Arial" font-size="40" x="5" y="50">Test 'altGlyph' facilities</text> + <text font-family="Arial" font-size="30" x="5" y="90">and many-to-many chars to glyphs</text> + <defs> + <font id="Font1" horiz-adv-x="5"> + <font-face font-family="HappySad" font-weight="bold" font-style="normal" units-per-em="8" cap-height="8" x-height="4" ascent="8" descent="2" alphabetic="0" mathematical="4" ideographic="-2" hanging="8"/> + <missing-glyph d="M1,3h2v2h-2z"/> + <glyph id="A1" d="M0,0 L2,8 L4,0 M0,4 C1,3 3,3 4,4"/> + <glyph id="H1" d="M0,0 V8 M4,0 V8 M0,4 C1,3 3,3 4,4"/> + <glyph id="P1" d="M0,0 V8 H2 C3,8 4,7 4,6 V4 M0,4 C1,3 3,3 4,4"/> + <glyph id="S1" d="M0,4 V6 C0,7 1,8 2,8 C3,8 4,7 4,6 M4,4 V2 C4,1 3,0 2,0 C1,0 0,1 0,2 M0,4 C1,3 3,3 4,4"/> + <glyph id="Y1" d="M0,8 V4 M4,8 V4 M2,4 V0 M0,4 C1,3 3,3 4,4"/> + <glyph id="A2" d="M0,0 L2,8 L4,0 M0,4 C1,5 3,5 4,4"/> + <glyph id="H2" d="M0,0 V8 M4,0 V8 M0,4 C1,5 3,5 4,4"/> + <glyph id="P2" d="M0,0 V8 H2 C3,8 4,7 4,6 V4 M0,4 C1,5 3,5 4,4"/> + <glyph id="S2" d="M0,4 V6 C0,7 1,8 2,8 C3,8 4,7 4,6 M4,4 V2 C4,1 3,0 2,0 C1,0 0,1 0,2 M0,4 C1,5 3,5 4,4"/> + <glyph id="Y2" d="M0,8 V4 M4,8 V4 M2,4 V0 M0,4 C1,5 3,5 4,4"/> + <glyph id="SS" unicode="SS" horiz-adv-x="6" d="M0,4 V6 C0,7 0,8 1,8 C2,8 2,7 2,6 M2,4 V2 C2,1 2,0 1,0 C0,0 0,1 0,2 M3,4 V6 C3,7 3,8 4,8 C5,8 5,7 5,6 M5,4 V2 C5,1 5,0 4,0 C3,0 3,1 3,2 M0,4 H5"/> + <glyph id="A" unicode="A" d="M0,0 L2,8 L4,0 M0,4 H4"/> + <glyph id="D" unicode="D" d="M0,0 V8 C3,8 4,7 4,4 C4,1 3,0 0,0z"/> + <glyph id="S" unicode="S" d="M0,4 V6 C0,7 1,8 2,8 C3,8 4,7 4,6 M4,4 V2 C4,1 3,0 2,0 C1,0 0,1 0,2 M0,4 H4"/> + <glyph id="Y" unicode="Y" d="M0,8 V4 M4,8 V4 M2,4 V0 M0,4 H4"/> + </font> + <altGlyphDef id="Afrown"> + <glyphRef xlink:href="#A2"/> + </altGlyphDef> + <altGlyphDef id="Asmile"> + <glyphRef xlink:href="#A1"/> + </altGlyphDef> + <altGlyphDef id="Hsmile"> + <glyphRef xlink:href="#H1"/> + </altGlyphDef> + <altGlyphDef id="Psmile"> + <glyphRef xlink:href="#P1"/> + </altGlyphDef> + <altGlyphDef id="Sfrown"> + <glyphRef xlink:href="#S2"/> + </altGlyphDef> + <altGlyphDef id="Ysmile"> + <glyphRef xlink:href="#Y1"/> + </altGlyphDef> + </defs> + <g font-family="HappySad" font-size="60" fill="none" stroke-width="5"> + <text x="140" y="190" stroke="fuchsia"> +<altGlyph xlink:href="#Hsmile">H</altGlyph> +<altGlyph xlink:href="#Asmile">A</altGlyph> +<altGlyph xlink:href="#Psmile">P</altGlyph> +<altGlyph xlink:href="#Psmile">P</altGlyph> +<altGlyph xlink:href="#Ysmile">Y</altGlyph> + </text> + <text x="50" y="270" stroke="green"> + <altGlyph xlink:href="#Sfrown">S</altGlyph><altGlyph xlink:href="#Afrown">A</altGlyph>D + </text> + <text x="280" y="270" stroke="blue">SASSY</text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-altglyph-02-b-manual.svg b/testing/web-platform/tests/svg/import/text-altglyph-02-b-manual.svg new file mode 100644 index 000000000..d12e917e4 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-altglyph-02-b-manual.svg @@ -0,0 +1,344 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AG" author="CM" status="accepted" + version="$Revision: 1.10 $" testname="$RCSfile: text-altglyph-02-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#AlternateGlyphs"> + <p> + Test glyph selection using altGlyphDef and altGlyphItem elements. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + <p> + Support for SVG Fonts is required for this test, and the last two text + strings are used to give a quick visual indication this is indeed + supported. + </p> + <p> + The test shows 24 different text strings with different combinations + of altGlyphItem element count and validity inside the altGlyphDef + elements, and number of characters in the altGlyph elements. The + glyphs are from a sans serif font, except those selected by + altGlyph, which are from a boldface serif font. The text + in the "Actual" columns should appear as shown in the corresponding + "Expected" column text. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if each pair of (actual,expected) text strings + render identically.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-altglyph-02-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <font horiz-adv-x="1038"> + <font-face font-family="EmbeddedSans" units-per-em="2048" panose-1="2 11 6 3 3 8 4 2 2 4" ascent="1901" descent="-483" alphabetic="0"/> + <missing-glyph horiz-adv-x="1229" d="M102 -362V1444H1126V-362H102ZM217 -248H1012V1329H217V-248Z"/> + <glyph unicode="A" glyph-name="A" horiz-adv-x="1401" d="M700 1294L426 551H975L700 1294ZM586 1493H815L1384 0H1174L1038 383H365L229 0H16L586 1493Z"/> + <glyph unicode="E" glyph-name="E" horiz-adv-x="1294" d="M201 1493H1145V1323H403V881H1114V711H403V170H1163V0H201V1493Z"/> + <glyph id="vs-a" unicode="a" glyph-name="a" horiz-adv-x="1255" d="M702 563Q479 563 393 512T307 338Q307 240 371 183T547 125Q700 125 792 233T885 522V563H702ZM1069 639V0H885V170Q822 68 728 20T498 -29Q326 -29 225 67T123 326Q123 515 249 611T627 707H885V725Q885 852 802 921T567 991Q471 991 380 968T205 899V1069Q306 1108 401 1127T586 1147Q829 1147 949 1021T1069 639Z"/> + <glyph id="vs-b" unicode="b" glyph-name="b" horiz-adv-x="1300" d="M997 559Q997 762 914 877T684 993Q538 993 455 878T371 559Q371 356 454 241T684 125Q830 125 913 240T997 559ZM371 950Q429 1050 517 1098T729 1147Q933 1147 1060 985T1188 559Q1188 295 1061 133T729 -29Q606 -29 518 19T371 168V0H186V1556H371V950Z"/> + <glyph id="vs-c" unicode="c" glyph-name="c" horiz-adv-x="1126" d="M999 1077V905Q921 948 843 969T684 991Q505 991 406 878T307 559Q307 354 406 241T684 127Q764 127 842 148T999 213V43Q922 7 840 -11T664 -29Q411 -29 262 130T113 559Q113 833 263 990T676 1147Q761 1147 842 1130T999 1077Z"/> + <glyph id="vs-d" unicode="d" glyph-name="d" horiz-adv-x="1300" d="M930 950V1556H1114V0H930V168Q872 68 784 20T571 -29Q368 -29 241 133T113 559Q113 823 240 985T571 1147Q695 1147 783 1099T930 950ZM303 559Q303 356 386 241T616 125Q762 125 846 240T930 559Q930 762 846 877T616 993Q470 993 387 878T303 559Z"/> + <glyph id="vs-e" unicode="e" glyph-name="e" horiz-adv-x="1260" d="M1151 606V516H305Q317 326 419 227T705 127Q811 127 910 153T1108 231V57Q1009 15 905 -7T694 -29Q426 -29 270 127T113 549Q113 824 261 985T662 1147Q888 1147 1019 1002T1151 606ZM967 660Q965 811 883 901T664 991Q510 991 418 904T311 659L967 660Z"/> + <glyph unicode="l" glyph-name="l" horiz-adv-x="569" d="M193 1556H377V0H193V1556Z"/> + <glyph unicode="p" glyph-name="p" horiz-adv-x="1300" d="M371 168V-426H186V1120H371V950Q429 1050 517 1098T729 1147Q933 1147 1060 985T1188 559Q1188 295 1061 133T729 -29Q606 -29 518 19T371 168ZM997 559Q997 762 914 877T684 993Q538 993 455 878T371 559Q371 356 454 241T684 125Q830 125 913 240T997 559Z"/> + <glyph unicode="t" glyph-name="t" horiz-adv-x="803" d="M375 1438V1120H754V977H375V369Q375 232 412 193T565 154H754V0H565Q352 0 271 79T190 369V977H55V1120H190V1438H375Z"/> + <glyph unicode="u" glyph-name="u" horiz-adv-x="1298" d="M174 442V1120H358V449Q358 290 420 211T606 131Q755 131 841 226T928 485V1120H1112V0H928V172Q861 70 773 21T567 -29Q374 -29 274 91T174 442Z"/> + <glyph unicode="x" glyph-name="x" horiz-adv-x="1212" d="M1124 1120L719 575L1145 0H928L602 440L276 0H59L494 586L96 1120H313L610 721L907 1120H1124Z"/> + </font> + + <font horiz-adv-x="1159"> + <font-face font-family="EmbeddedSerifBold" units-per-em="2048" panose-1="2 6 8 3 5 6 5 2 2 4" ascent="1923" descent="-483" alphabetic="0"/> + <missing-glyph horiz-adv-x="1229" d="M102 -362V1444H1126V-362H102ZM217 -248H1012V1329H217V-248Z"/> + <glyph id="vsb-a" unicode="a" glyph-name="a" horiz-adv-x="1327" d="M1128 653V121H1280V0H774V135Q704 51 618 11T422 -29Q259 -29 172 58T84 309Q84 488 209 577T588 666H774V729Q774 858 713 919T524 981Q418 981 361 938T279 795H166V1024Q261 1058 363 1075T578 1092Q863 1092 995 986T1128 653ZM774 334V547H641Q542 547 489 493T436 338Q436 237 474 187T592 137Q674 137 724 191T774 334Z"/> + <glyph id="vsb-b" unicode="b" glyph-name="b" horiz-adv-x="1432" d="M199 121V1436H47V1556H553V928Q598 1011 674 1051T862 1092Q1089 1092 1219 943T1350 532Q1350 271 1220 121T862 -29Q750 -29 674 11T553 135V0H47V121H199ZM553 479Q553 293 600 210T754 127Q863 127 907 215T952 532Q952 761 908 848T754 936Q648 936 601 853T553 584V479Z"/> + <glyph id="vsb-c" unicode="c" glyph-name="c" horiz-adv-x="1247" d="M1155 332Q1117 150 1000 61T680 -29Q396 -29 240 118T84 532Q84 796 238 944T666 1092Q777 1092 890 1071T1120 1008V713H1008Q992 848 929 913T752 979Q604 979 542 879T479 532Q479 291 540 188T739 84Q846 84 910 148T989 332H1155Z"/> + <glyph id="vsb-d" unicode="d" glyph-name="d" horiz-adv-x="1432" d="M879 479V584Q879 770 831 853T678 936Q568 936 524 849T479 532Q479 303 524 215T678 127Q783 127 831 210T879 479ZM1233 121H1384V0H879V135Q834 52 758 12T569 -29Q343 -29 214 121T84 532Q84 794 213 943T569 1092Q681 1092 757 1052T879 928V1436H727V1556H1233V121Z"/> + <glyph id="vsb-e" unicode="e" glyph-name="e" horiz-adv-x="1303" d="M821 600Q821 810 782 894T649 979Q558 979 519 896T479 618V600H821ZM1210 481H479V473Q479 267 541 176T741 84Q856 84 927 145T1018 322H1184Q1141 141 1013 56T655 -29Q379 -29 232 116T84 532Q84 796 235 944T655 1092Q919 1092 1060 937T1210 481Z"/> + </font> + + <!-- One valid 1-glyph altGlyphItem --> + <altGlyphDef id="agd-a-1"> + <altGlyphItem> + <glyphRef xlink:href="#vsb-a"/> + </altGlyphItem> + </altGlyphDef> + + <!-- One valid 1-glyph and one invalid 1-glyph altGlyphItem --> + <altGlyphDef id="agd-a-2"> + <altGlyphItem> + <glyphRef xlink:href="#vsb-a"/> + </altGlyphItem> + <altGlyphItem> + <glyphRef xlink:href="#bad-link"/> + </altGlyphItem> + </altGlyphDef> + + <!-- One invalid 1-glyph and one valid 1-glyph altGlyphItem --> + <altGlyphDef id="agd-a-3"> + <altGlyphItem> + <glyphRef xlink:href="#bad-link"/> + </altGlyphItem> + <altGlyphItem> + <glyphRef xlink:href="#vsb-a"/> + </altGlyphItem> + </altGlyphDef> + + <!-- One invalid 1-glyph altGlyphItem --> + <altGlyphDef id="agd-a-4"> + <altGlyphItem> + <glyphRef xlink:href="#bad-link"/> + </altGlyphItem> + </altGlyphDef> + + <!-- One valid 2-glyph altGlyphItem --> + <altGlyphDef id="agd-bc-1"> + <altGlyphItem> + <glyphRef xlink:href="#vsb-b"/> + <glyphRef xlink:href="#vsb-c"/> + </altGlyphItem> + </altGlyphDef> + + <!-- One valid 2-glyph and one invalid 1-glyph altGlyphItem --> + <altGlyphDef id="agd-bc-2"> + <altGlyphItem> + <glyphRef xlink:href="#vsb-b"/> + <glyphRef xlink:href="#vsb-c"/> + </altGlyphItem> + <altGlyphItem> + <glyphRef xlink:href="#bad-link"/> + </altGlyphItem> + </altGlyphDef> + + <!-- One invalid 1-glyph and one valid 2-glyph altGlyphItem --> + <altGlyphDef id="agd-bc-3"> + <altGlyphItem> + <glyphRef xlink:href="#bad-link"/> + </altGlyphItem> + <altGlyphItem> + <glyphRef xlink:href="#vsb-b"/> + <glyphRef xlink:href="#vsb-c"/> + </altGlyphItem> + </altGlyphDef> + + <!-- One invalid 2-glyph and one valid 2-glyph altGlyphItem --> + <altGlyphDef id="agd-bc-4"> + <altGlyphItem> + <glyphRef xlink:href="#vsb-b"/> + <glyphRef xlink:href="#bad-link"/> + </altGlyphItem> + <altGlyphItem> + <glyphRef xlink:href="#vsb-b"/> + <glyphRef xlink:href="#vsb-c"/> + </altGlyphItem> + </altGlyphDef> + + <!-- One valid 2-glyph and one invalid 2-glyph altGlyphItem --> + <altGlyphDef id="agd-bc-5"> + <altGlyphItem> + <glyphRef xlink:href="#vsb-b"/> + <glyphRef xlink:href="#vsb-c"/> + </altGlyphItem> + <altGlyphItem> + <glyphRef xlink:href="#vsb-b"/> + <glyphRef xlink:href="#bad-link"/> + </altGlyphItem> + </altGlyphDef> + + <!-- One invalid 2-glyph altGlyphItem --> + <altGlyphDef id="agd-bc-6"> + <altGlyphItem> + <glyphRef xlink:href="#vsb-b"/> + <glyphRef xlink:href="#bad-link"/> + </altGlyphItem> + </altGlyphDef> + + <g font-family="EmbeddedSans" transform="translate(0,20)"> + <g font-size="13" fill="blue"> + <text x="25" y="20">Actual</text> + <text x="115" y="20">Expected</text> + <text x="250" y="20">Actual</text> + <text x="340" y="20">Expected</text> + </g> + <path stroke="blue" stroke-width="1" d="M 25,22 L 225,22 M 250,22 L 440,22"/> + + <g font-size="14"> + <!-- === "Actual" column 1 ======================================== --> + + <!-- altGlyphDefs have one glyph, altGlyph has one character --> + <text x="25" y="40"> + <altGlyph xlink:href="#agd-a-1">a</altGlyph>bcde + </text> + <text x="25" y="58"> + <altGlyph xlink:href="#agd-a-2">a</altGlyph>bcde + </text> + <text x="25" y="76"> + <altGlyph xlink:href="#agd-a-3">a</altGlyph>bcde + </text> + <text x="25" y="94"> + <altGlyph xlink:href="#agd-a-4">a</altGlyph>bcde + </text> + + <!-- altGlyphDefs have two glyphs, altGlyph has two characters --> + <text x="25" y="112"> + a<altGlyph xlink:href="#agd-bc-1">bc</altGlyph>de + </text> + <text x="25" y="130"> + a<altGlyph xlink:href="#agd-bc-2">bc</altGlyph>de + </text> + <text x="25" y="148"> + a<altGlyph xlink:href="#agd-bc-3">bc</altGlyph>de + </text> + <text x="25" y="166"> + a<altGlyph xlink:href="#agd-bc-4">bc</altGlyph>de + </text> + <text x="25" y="184"> + a<altGlyph xlink:href="#agd-bc-5">bc</altGlyph>de + </text> + <text x="25" y="202"> + a<altGlyph xlink:href="#agd-bc-6">bc</altGlyph>de + </text> + + <!-- === "Actual" column 2 ======================================== --> + + <!-- altGlyphDefs have two glyphs, altGlyph has one character --> + <text x="250" y="40"> + a<altGlyph xlink:href="#agd-bc-1">b</altGlyph>de + </text> + <text x="250" y="58"> + a<altGlyph xlink:href="#agd-bc-2">b</altGlyph>de + </text> + <text x="250" y="76"> + a<altGlyph xlink:href="#agd-bc-3">b</altGlyph>de + </text> + <text x="250" y="94"> + a<altGlyph xlink:href="#agd-bc-4">b</altGlyph>de + </text> + <text x="250" y="112"> + a<altGlyph xlink:href="#agd-bc-5">b</altGlyph>de + </text> + <text x="250" y="130"> + a<altGlyph xlink:href="#agd-bc-6">b</altGlyph>de + </text> + + <!-- altGlyphDefs have one glyph, altGlyph has two characters --> + <text x="250" y="148"> + <altGlyph xlink:href="#agd-a-1">ab</altGlyph>cde + </text> + <text x="250" y="166"> + <altGlyph xlink:href="#agd-a-2">ab</altGlyph>cde + </text> + <text x="250" y="184"> + <altGlyph xlink:href="#agd-a-3">ab</altGlyph>cde + </text> + <text x="250" y="202"> + <altGlyph xlink:href="#agd-a-4">ab</altGlyph>cde + </text> + + <!-- Test for SVG font support --> + <g font-size="16"> + <text x="250" y="238">a</text> + <text x="250" y="256" font-family="EmbeddedSerifBold">b</text> + </g> + + <!-- === "Expected" column 1 ====================================== --> + + <text x="115" y="40"> + <tspan font-family="EmbeddedSerifBold">a</tspan>bcde + </text> + <text x="115" y="58"> + <tspan font-family="EmbeddedSerifBold">a</tspan>bcde + </text> + <text x="115" y="76"> + <tspan font-family="EmbeddedSerifBold">a</tspan>bcde + </text> + <text x="115" y="94">abcde</text> + + <text x="115" y="112"> + a<tspan font-family="EmbeddedSerifBold">bc</tspan>de + </text> + <text x="115" y="130"> + a<tspan font-family="EmbeddedSerifBold">bc</tspan>de + </text> + <text x="115" y="148"> + a<tspan font-family="EmbeddedSerifBold">bc</tspan>de + </text> + <text x="115" y="166"> + a<tspan font-family="EmbeddedSerifBold">bc</tspan>de + </text> + <text x="115" y="184"> + a<tspan font-family="EmbeddedSerifBold">bc</tspan>de + </text> + <text x="115" y="202">abcde</text> + + <!-- === "Expected" column 2 ====================================== --> + + <text x="340" y="40"> + a<tspan font-family="EmbeddedSerifBold">bc</tspan>de + </text> + <text x="340" y="58"> + a<tspan font-family="EmbeddedSerifBold">bc</tspan>de + </text> + <text x="340" y="76"> + a<tspan font-family="EmbeddedSerifBold">bc</tspan>de + </text> + <text x="340" y="94"> + a<tspan font-family="EmbeddedSerifBold">bc</tspan>de + </text> + <text x="340" y="112"> + a<tspan font-family="EmbeddedSerifBold">bc</tspan>de + </text> + <text x="340" y="130">abde</text> + + <text x="340" y="148"> + <tspan font-family="EmbeddedSerifBold">a</tspan>cde + </text> + <text x="340" y="166"> + <tspan font-family="EmbeddedSerifBold">a</tspan>cde + </text> + <text x="340" y="182"> + <tspan font-family="EmbeddedSerifBold">a</tspan>cde + </text> + <text x="340" y="202">abcde</text> + + <g transform="translate(340, 238) scale(1, -1) scale(0.0078125)"> + <path d="M702 563Q479 563 393 512T307 338Q307 240 371 183T547 125Q700 125 792 233T885 522V563H702ZM1069 639V0H885V170Q822 68 728 20T498 -29Q326 -29 225 67T123 326Q123 515 249 611T627 707H885V725Q885 852 802 921T567 991Q471 991 380 968T205 899V1069Q306 1108 401 1127T586 1147Q829 1147 949 1021T1069 639Z"/> + </g> + <g transform="translate(340, 256) scale(1, -1) scale(0.0078125)"> + <path d="M199 121V1436H47V1556H553V928Q598 1011 674 1051T862 1092Q1089 1092 1219 943T1350 532Q1350 271 1220 121T862 -29Q750 -29 674 11T553 135V0H47V121H199ZM553 479Q553 293 600 210T754 127Q863 127 907 215T952 532Q952 761 908 848T754 936Q648 936 601 853T553 584V479Z"/> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.10 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> --> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-altglyph-03-b-manual.svg b/testing/web-platform/tests/svg/import/text-altglyph-03-b-manual.svg new file mode 100644 index 000000000..4327c9f80 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-altglyph-03-b-manual.svg @@ -0,0 +1,373 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="" author="CM" status="created" + version="$Revision: 1.2 $" testname="$RCSfile: text-altglyph-03-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#AlternateGlyphs"> + <p> + Test glyph selection using altGlyphDef and altGlyphItem elements. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <!-- XXX --> + <p><strong>This test was copied from text-altglyph-02-b.svg revision 1.9, which had some subtests + involving 'altGlyph' elements with no character data removed. All of the subtests + that are common with text-altglyph-02-b.svg can be removed from this test.</strong></p> + <p> + Run the test. No interaction required. + </p> + <p> + Support for SVG Fonts is required for this test, and the last two text + strings are used to give a quick visual indication this is indeed + supported. + </p> + <p> + The test shows 24 different text strings with different combinations + of altGlyphItem element count and validity inside the altGlyphDef + elements, and number of characters in the altGlyph elements. The + glyphs are from a sans serif font, except those selected by + altGlyph, which are from a boldface serif font. The text + in the "Actual" columns should appear as shown in the corresponding + "Expected" column text. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test passes if each pair of (actual,expected) text strings + render identically.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-altglyph-03-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <font horiz-adv-x="1038"> + <font-face font-family="EmbeddedSans" units-per-em="2048" panose-1="2 11 6 3 3 8 4 2 2 4" ascent="1901" descent="-483" alphabetic="0"/> + <missing-glyph horiz-adv-x="1229" d="M102 -362V1444H1126V-362H102ZM217 -248H1012V1329H217V-248Z"/> + <glyph unicode="A" glyph-name="A" horiz-adv-x="1401" d="M700 1294L426 551H975L700 1294ZM586 1493H815L1384 0H1174L1038 383H365L229 0H16L586 1493Z"/> + <glyph unicode="E" glyph-name="E" horiz-adv-x="1294" d="M201 1493H1145V1323H403V881H1114V711H403V170H1163V0H201V1493Z"/> + <glyph id="vs-a" unicode="a" glyph-name="a" horiz-adv-x="1255" d="M702 563Q479 563 393 512T307 338Q307 240 371 183T547 125Q700 125 792 233T885 522V563H702ZM1069 639V0H885V170Q822 68 728 20T498 -29Q326 -29 225 67T123 326Q123 515 249 611T627 707H885V725Q885 852 802 921T567 991Q471 991 380 968T205 899V1069Q306 1108 401 1127T586 1147Q829 1147 949 1021T1069 639Z"/> + <glyph id="vs-b" unicode="b" glyph-name="b" horiz-adv-x="1300" d="M997 559Q997 762 914 877T684 993Q538 993 455 878T371 559Q371 356 454 241T684 125Q830 125 913 240T997 559ZM371 950Q429 1050 517 1098T729 1147Q933 1147 1060 985T1188 559Q1188 295 1061 133T729 -29Q606 -29 518 19T371 168V0H186V1556H371V950Z"/> + <glyph id="vs-c" unicode="c" glyph-name="c" horiz-adv-x="1126" d="M999 1077V905Q921 948 843 969T684 991Q505 991 406 878T307 559Q307 354 406 241T684 127Q764 127 842 148T999 213V43Q922 7 840 -11T664 -29Q411 -29 262 130T113 559Q113 833 263 990T676 1147Q761 1147 842 1130T999 1077Z"/> + <glyph id="vs-d" unicode="d" glyph-name="d" horiz-adv-x="1300" d="M930 950V1556H1114V0H930V168Q872 68 784 20T571 -29Q368 -29 241 133T113 559Q113 823 240 985T571 1147Q695 1147 783 1099T930 950ZM303 559Q303 356 386 241T616 125Q762 125 846 240T930 559Q930 762 846 877T616 993Q470 993 387 878T303 559Z"/> + <glyph id="vs-e" unicode="e" glyph-name="e" horiz-adv-x="1260" d="M1151 606V516H305Q317 326 419 227T705 127Q811 127 910 153T1108 231V57Q1009 15 905 -7T694 -29Q426 -29 270 127T113 549Q113 824 261 985T662 1147Q888 1147 1019 1002T1151 606ZM967 660Q965 811 883 901T664 991Q510 991 418 904T311 659L967 660Z"/> + <glyph unicode="l" glyph-name="l" horiz-adv-x="569" d="M193 1556H377V0H193V1556Z"/> + <glyph unicode="p" glyph-name="p" horiz-adv-x="1300" d="M371 168V-426H186V1120H371V950Q429 1050 517 1098T729 1147Q933 1147 1060 985T1188 559Q1188 295 1061 133T729 -29Q606 -29 518 19T371 168ZM997 559Q997 762 914 877T684 993Q538 993 455 878T371 559Q371 356 454 241T684 125Q830 125 913 240T997 559Z"/> + <glyph unicode="t" glyph-name="t" horiz-adv-x="803" d="M375 1438V1120H754V977H375V369Q375 232 412 193T565 154H754V0H565Q352 0 271 79T190 369V977H55V1120H190V1438H375Z"/> + <glyph unicode="u" glyph-name="u" horiz-adv-x="1298" d="M174 442V1120H358V449Q358 290 420 211T606 131Q755 131 841 226T928 485V1120H1112V0H928V172Q861 70 773 21T567 -29Q374 -29 274 91T174 442Z"/> + <glyph unicode="x" glyph-name="x" horiz-adv-x="1212" d="M1124 1120L719 575L1145 0H928L602 440L276 0H59L494 586L96 1120H313L610 721L907 1120H1124Z"/> + </font> + + <font horiz-adv-x="1159"> + <font-face font-family="EmbeddedSerifBold" units-per-em="2048" panose-1="2 6 8 3 5 6 5 2 2 4" ascent="1923" descent="-483" alphabetic="0"/> + <missing-glyph horiz-adv-x="1229" d="M102 -362V1444H1126V-362H102ZM217 -248H1012V1329H217V-248Z"/> + <glyph id="vsb-a" unicode="a" glyph-name="a" horiz-adv-x="1327" d="M1128 653V121H1280V0H774V135Q704 51 618 11T422 -29Q259 -29 172 58T84 309Q84 488 209 577T588 666H774V729Q774 858 713 919T524 981Q418 981 361 938T279 795H166V1024Q261 1058 363 1075T578 1092Q863 1092 995 986T1128 653ZM774 334V547H641Q542 547 489 493T436 338Q436 237 474 187T592 137Q674 137 724 191T774 334Z"/> + <glyph id="vsb-b" unicode="b" glyph-name="b" horiz-adv-x="1432" d="M199 121V1436H47V1556H553V928Q598 1011 674 1051T862 1092Q1089 1092 1219 943T1350 532Q1350 271 1220 121T862 -29Q750 -29 674 11T553 135V0H47V121H199ZM553 479Q553 293 600 210T754 127Q863 127 907 215T952 532Q952 761 908 848T754 936Q648 936 601 853T553 584V479Z"/> + <glyph id="vsb-c" unicode="c" glyph-name="c" horiz-adv-x="1247" d="M1155 332Q1117 150 1000 61T680 -29Q396 -29 240 118T84 532Q84 796 238 944T666 1092Q777 1092 890 1071T1120 1008V713H1008Q992 848 929 913T752 979Q604 979 542 879T479 532Q479 291 540 188T739 84Q846 84 910 148T989 332H1155Z"/> + <glyph id="vsb-d" unicode="d" glyph-name="d" horiz-adv-x="1432" d="M879 479V584Q879 770 831 853T678 936Q568 936 524 849T479 532Q479 303 524 215T678 127Q783 127 831 210T879 479ZM1233 121H1384V0H879V135Q834 52 758 12T569 -29Q343 -29 214 121T84 532Q84 794 213 943T569 1092Q681 1092 757 1052T879 928V1436H727V1556H1233V121Z"/> + <glyph id="vsb-e" unicode="e" glyph-name="e" horiz-adv-x="1303" d="M821 600Q821 810 782 894T649 979Q558 979 519 896T479 618V600H821ZM1210 481H479V473Q479 267 541 176T741 84Q856 84 927 145T1018 322H1184Q1141 141 1013 56T655 -29Q379 -29 232 116T84 532Q84 796 235 944T655 1092Q919 1092 1060 937T1210 481Z"/> + </font> + + <!-- One valid 1-glyph altGlyphItem --> + <altGlyphDef id="agd-a-1"> + <altGlyphItem> + <glyphRef xlink:href="#vsb-a"/> + </altGlyphItem> + </altGlyphDef> + + <!-- One valid 1-glyph and one invalid 1-glyph altGlyphItem --> + <altGlyphDef id="agd-a-2"> + <altGlyphItem> + <glyphRef xlink:href="#vsb-a"/> + </altGlyphItem> + <altGlyphItem> + <glyphRef xlink:href="#bad-link"/> + </altGlyphItem> + </altGlyphDef> + + <!-- One invalid 1-glyph and one valid 1-glyph altGlyphItem --> + <altGlyphDef id="agd-a-3"> + <altGlyphItem> + <glyphRef xlink:href="#bad-link"/> + </altGlyphItem> + <altGlyphItem> + <glyphRef xlink:href="#vsb-a"/> + </altGlyphItem> + </altGlyphDef> + + <!-- One invalid 1-glyph altGlyphItem --> + <altGlyphDef id="agd-a-4"> + <altGlyphItem> + <glyphRef xlink:href="#bad-link"/> + </altGlyphItem> + </altGlyphDef> + + <!-- One valid 2-glyph altGlyphItem --> + <altGlyphDef id="agd-bc-1"> + <altGlyphItem> + <glyphRef xlink:href="#vsb-b"/> + <glyphRef xlink:href="#vsb-c"/> + </altGlyphItem> + </altGlyphDef> + + <!-- One valid 2-glyph and one invalid 1-glyph altGlyphItem --> + <altGlyphDef id="agd-bc-2"> + <altGlyphItem> + <glyphRef xlink:href="#vsb-b"/> + <glyphRef xlink:href="#vsb-c"/> + </altGlyphItem> + <altGlyphItem> + <glyphRef xlink:href="#bad-link"/> + </altGlyphItem> + </altGlyphDef> + + <!-- One invalid 1-glyph and one valid 2-glyph altGlyphItem --> + <altGlyphDef id="agd-bc-3"> + <altGlyphItem> + <glyphRef xlink:href="#bad-link"/> + </altGlyphItem> + <altGlyphItem> + <glyphRef xlink:href="#vsb-b"/> + <glyphRef xlink:href="#vsb-c"/> + </altGlyphItem> + </altGlyphDef> + + <!-- One invalid 2-glyph and one valid 2-glyph altGlyphItem --> + <altGlyphDef id="agd-bc-4"> + <altGlyphItem> + <glyphRef xlink:href="#vsb-b"/> + <glyphRef xlink:href="#bad-link"/> + </altGlyphItem> + <altGlyphItem> + <glyphRef xlink:href="#vsb-b"/> + <glyphRef xlink:href="#vsb-c"/> + </altGlyphItem> + </altGlyphDef> + + <!-- One valid 2-glyph and one invalid 2-glyph altGlyphItem --> + <altGlyphDef id="agd-bc-5"> + <altGlyphItem> + <glyphRef xlink:href="#vsb-b"/> + <glyphRef xlink:href="#vsb-c"/> + </altGlyphItem> + <altGlyphItem> + <glyphRef xlink:href="#vsb-b"/> + <glyphRef xlink:href="#bad-link"/> + </altGlyphItem> + </altGlyphDef> + + <!-- One invalid 2-glyph altGlyphItem --> + <altGlyphDef id="agd-bc-6"> + <altGlyphItem> + <glyphRef xlink:href="#vsb-b"/> + <glyphRef xlink:href="#bad-link"/> + </altGlyphItem> + </altGlyphDef> + + <g font-family="EmbeddedSans" transform="translate(0,20)"> + <g font-size="13" fill="blue"> + <text x="25" y="20">Actual</text> + <text x="115" y="20">Expected</text> + <text x="250" y="20">Actual</text> + <text x="340" y="20">Expected</text> + </g> + <path stroke="blue" stroke-width="1" d="M 25,22 L 225,22 M 250,22 L 440,22"/> + + <g font-size="14"> + <!-- === "Actual" column 1 ======================================== --> + + <!-- altGlyphDefs have one glyph, altGlyph has one character --> + <text x="25" y="40"> + <altGlyph xlink:href="#agd-a-1">a</altGlyph>bcde + </text> + <text x="25" y="58"> + <altGlyph xlink:href="#agd-a-2">a</altGlyph>bcde + </text> + <text x="25" y="76"> + <altGlyph xlink:href="#agd-a-3">a</altGlyph>bcde + </text> + <text x="25" y="94"> + <altGlyph xlink:href="#agd-a-4">a</altGlyph>bcde + </text> + + <!-- altGlyphDefs have two glyphs, altGlyph has two characters --> + <text x="25" y="112"> + a<altGlyph xlink:href="#agd-bc-1">bc</altGlyph>de + </text> + <text x="25" y="130"> + a<altGlyph xlink:href="#agd-bc-2">bc</altGlyph>de + </text> + <text x="25" y="148"> + a<altGlyph xlink:href="#agd-bc-3">bc</altGlyph>de + </text> + <text x="25" y="166"> + a<altGlyph xlink:href="#agd-bc-4">bc</altGlyph>de + </text> + <text x="25" y="184"> + a<altGlyph xlink:href="#agd-bc-5">bc</altGlyph>de + </text> + <text x="25" y="202"> + a<altGlyph xlink:href="#agd-bc-6">bc</altGlyph>de + </text> + + <!-- altGlyphDefs have one glyph, altGlyph has no characters --> + <text x="25" y="220"> + <altGlyph xlink:href="#agd-a-1"/>bcde + </text> + <text x="25" y="238"> + <altGlyph xlink:href="#agd-a-2"/>bcde + </text> + <text x="25" y="256"> + <altGlyph xlink:href="#agd-a-3"/>bcde + </text> + <text x="25" y="274"> + <altGlyph xlink:href="#agd-a-4"/>bcde + </text> + + <!-- === "Actual" column 2 ======================================== --> + + <!-- altGlyphDefs have two glyphs, altGlyph has one character --> + <text x="250" y="40"> + a<altGlyph xlink:href="#agd-bc-1">b</altGlyph>de + </text> + <text x="250" y="58"> + a<altGlyph xlink:href="#agd-bc-2">b</altGlyph>de + </text> + <text x="250" y="76"> + a<altGlyph xlink:href="#agd-bc-3">b</altGlyph>de + </text> + <text x="250" y="94"> + a<altGlyph xlink:href="#agd-bc-4">b</altGlyph>de + </text> + <text x="250" y="112"> + a<altGlyph xlink:href="#agd-bc-5">b</altGlyph>de + </text> + <text x="250" y="130"> + a<altGlyph xlink:href="#agd-bc-6">b</altGlyph>de + </text> + + <!-- altGlyphDefs have one glyph, altGlyph has two characters --> + <text x="250" y="148"> + <altGlyph xlink:href="#agd-a-1">ab</altGlyph>cde + </text> + <text x="250" y="166"> + <altGlyph xlink:href="#agd-a-2">ab</altGlyph>cde + </text> + <text x="250" y="184"> + <altGlyph xlink:href="#agd-a-3">ab</altGlyph>cde + </text> + <text x="250" y="202"> + <altGlyph xlink:href="#agd-a-4">ab</altGlyph>cde + </text> + + <!-- Test for SVG font support --> + <g font-size="16"> + <text x="250" y="238">a</text> + <text x="250" y="256" font-family="EmbeddedSerifBold">b</text> + </g> + + <!-- === "Expected" column 1 ====================================== --> + + <text x="115" y="40"> + <tspan font-family="EmbeddedSerifBold">a</tspan>bcde + </text> + <text x="115" y="58"> + <tspan font-family="EmbeddedSerifBold">a</tspan>bcde + </text> + <text x="115" y="76"> + <tspan font-family="EmbeddedSerifBold">a</tspan>bcde + </text> + <text x="115" y="94">abcde</text> + + <text x="115" y="112"> + a<tspan font-family="EmbeddedSerifBold">bc</tspan>de + </text> + <text x="115" y="130"> + a<tspan font-family="EmbeddedSerifBold">bc</tspan>de + </text> + <text x="115" y="148"> + a<tspan font-family="EmbeddedSerifBold">bc</tspan>de + </text> + <text x="115" y="166"> + a<tspan font-family="EmbeddedSerifBold">bc</tspan>de + </text> + <text x="115" y="184"> + a<tspan font-family="EmbeddedSerifBold">bc</tspan>de + </text> + <text x="115" y="202">abcde</text> + + <text x="115" y="220"> + <tspan font-family="EmbeddedSerifBold">a</tspan>bcde + </text> + <text x="115" y="238"> + <tspan font-family="EmbeddedSerifBold">a</tspan>bcde + </text> + <text x="115" y="256"> + <tspan font-family="EmbeddedSerifBold">a</tspan>bcde + </text> + <text x="115" y="274">bcde</text> + + <!-- === "Expected" column 2 ====================================== --> + + <text x="340" y="40"> + a<tspan font-family="EmbeddedSerifBold">bc</tspan>de + </text> + <text x="340" y="58"> + a<tspan font-family="EmbeddedSerifBold">bc</tspan>de + </text> + <text x="340" y="76"> + a<tspan font-family="EmbeddedSerifBold">bc</tspan>de + </text> + <text x="340" y="94"> + a<tspan font-family="EmbeddedSerifBold">bc</tspan>de + </text> + <text x="340" y="112"> + a<tspan font-family="EmbeddedSerifBold">bc</tspan>de + </text> + <text x="340" y="130">abde</text> + + <text x="340" y="148"> + <tspan font-family="EmbeddedSerifBold">a</tspan>cde + </text> + <text x="340" y="166"> + <tspan font-family="EmbeddedSerifBold">a</tspan>cde + </text> + <text x="340" y="182"> + <tspan font-family="EmbeddedSerifBold">a</tspan>cde + </text> + <text x="340" y="202">abcde</text> + + <g transform="translate(340, 238) scale(1, -1) scale(0.0078125)"> + <path d="M702 563Q479 563 393 512T307 338Q307 240 371 183T547 125Q700 125 792 233T885 522V563H702ZM1069 639V0H885V170Q822 68 728 20T498 -29Q326 -29 225 67T123 326Q123 515 249 611T627 707H885V725Q885 852 802 921T567 991Q471 991 380 968T205 899V1069Q306 1108 401 1127T586 1147Q829 1147 949 1021T1069 639Z"/> + </g> + <g transform="translate(340, 256) scale(1, -1) scale(0.0078125)"> + <path d="M199 121V1436H47V1556H553V928Q598 1011 674 1051T862 1092Q1089 1092 1219 943T1350 532Q1350 271 1220 121T862 -29Q750 -29 674 11T553 135V0H47V121H199ZM553 479Q553 293 600 210T754 127Q863 127 907 215T952 532Q952 761 908 848T754 936Q648 936 601 853T553 584V479Z"/> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-bidi-01-t-manual.svg b/testing/web-platform/tests/svg/import/text-bidi-01-t-manual.svg new file mode 100644 index 000000000..aff70f3c6 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-bidi-01-t-manual.svg @@ -0,0 +1,59 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="ED" status="created" + version="$Revision: 1.1 $" testname="$RCSfile: text-bidi-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#RelationshipWithBiDirectionality"> + <p> + Test directional type, ltr context, arabic. + Assertion: In a left-to-right context, without markup, styling or special characters, a sequence of Arabic characters and spaces will progress from right to left. + </p> + <p class='prerequisites'>You will need a font that allows you to distinguish Arabic characters.</p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if the characters follow the same order. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-bidi-01-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x="240" y="120" text-anchor="middle">مفتاح معايير الويب</text> + <image id="reference" xlink:href="../images/inline2.png" width="200" height="30" transform="translate(120 180)"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.1 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-deco-01-b-manual.svg b/testing/web-platform/tests/svg/import/text-deco-01-b-manual.svg new file mode 100644 index 000000000..609162a97 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-deco-01-b-manual.svg @@ -0,0 +1,82 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: text-deco-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#TextDecorationProperties"> + <p> + Test the 'text-decoration' property. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p>The test has passed if:</p> + <ul> + <li> + The first line of text has no decoration. + </li> + <li> + The second line of text has a line through it. + </li> + <li> + The third line of text is underlined. + </li> + <li> + The fourth line of text has a blue underline with a green stroke under + all characters, except the word "different" which has a yellow underline + with a green stroke. + </li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-deco-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-size="24" fill="blue" stroke="green" stroke-width=".5"> + <text x="25" y="65">Normal text</text> + <text x="25" y="135" text-decoration="line-through">Text with line-through</text> + <text x="25" y="205" text-decoration="underline">Underlined text</text> + <!-- START OF PATCH CODE, which is commented out + <text x="25" y="345" text-decoration="underline" xml:space="preserve">One word has different underlining</text> + <rect x="25" y="275" width="1000" height="70" stroke="none" fill="white" /> +END OF PATCH CODE, which is commented out --> + <text x="25" y="275" text-decoration="underline"> + <tspan>One</tspan> + <tspan fill="yellow" stroke="#F0F">word</tspan> + <tspan fill="yellow" stroke="#000">has</tspan> + <tspan fill="yellow" stroke="#080" text-decoration="underline">different</tspan> + <tspan fill="yellow" stroke="#00F">underlining</tspan> + </text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-dom-01-f-manual.svg b/testing/web-platform/tests/svg/import/text-dom-01-f-manual.svg new file mode 100644 index 000000000..ed54dc550 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-dom-01-f-manual.svg @@ -0,0 +1,230 @@ +<svg version="1.1" baseProfile="full" onload="testSVGTextContentElement()" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="AN" status="created" + version="$Revision: 1.4 $" testname="$RCSfile: text-dom-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#DOMInterfaces"> + <p> + This tests the methods and properties of the SVGTextContentElement interface on the text element with the id 'testText' + and the content 'This is a test of the interface SVGTextContentElement'. The word 'is' has two glyphs with different + rotation values defined with a <tspan/> element. There are 12 subtests testing the 9 methods and 2 properties. + Note that the numeric results of some methods may vary. The additional instructions state where the result may vary + and where it should have an exact value. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + [[ + Describe how to use the here. The instructions should specify any + steps requied to run the test or any manual operation that need + to be performed to run the test. + ]] + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The first subtest is testing the method .getCharNumAtPosition(svgPt), where svgPt has an x value of 240 and y value of 25. + The result of this subtest must be "30". + </p> + <p> + The second subtest is testing the method .getComputedTextLength(). The rounded result may vary in the implementations but should be around 364. + A red line below the testText is visually indicating the result of the method .getComputedTextLength() and must look like a red underline + with a length that spans the whole text length from 'T' to '.'. + </p> + <p> + The third subtest is testing the method .getEndPositionOfChar() at the 11th character ('e'). + The rounded result may vary in the implementations but should be around 131 for the 'x' value and must be 30 for the 'y' value. + Additionally, a red vertical line is indicating the end position of the character 'e'. Its lower 'y' value must be at 30 + and the 'x' values must match the end position of the 11th character 'e'. + </p> + <p> + The fourth subtest is testing the method .getExtentOfChar() at the 11th character ('e'). + The rounded result may vary in the implementations but should be around '123,16,8,17' for the 'x,y,width,height' values. + A lightblue rectangle below the character 'e' must fully enclose the 11th glyph. + </p> + <p> + The fifth subtest is testing the method .getNumberOfChars(). The result must be 54. + </p> + <p> + The sixth subtest is testing the method .getRotationOfChar() for the fifth character. The result must be 45. + Additionally, a lightblue rectangle below the text indicates the extent of the fifth glyph 'i'. + It must fully enclose the diagonally rotated fifth glyph 'i'. + </p> + <p> + The seventh subtest is testing the method .getStartPositionOfChar() at the 11th character ('e'). + The rounded result may vary in the implementations but should be around 123 for the 'x' value and must be 30 for the 'y' value. + Additionally, a red vertical line is indicating the start position of the character 'e'. Its lower 'y' value must be at 30 + and the 'x' values must match the end position of the 11th character 'e'. + </p> + <p> + The eighth subtest is testing the method .getSubStringLength(), starting at character 22 and including the 9 following characters. + The result may vary in the implementations but should be around 58. Additionally, a green (lime) line visually indicates + the result of the method. The word 'interface' must be fully underlined with the green line. + </p> + <p> + The ninth subtest is testing the method .selectSubString(). After loading the file, the word "the" must be selected. + </p> + <p> + The tenth subtest is testing the property .textLength. The rounded result of .textLength.baseVal.value may vary in + the implementations but should be around 364. + It must match the value calculated in the second subtest (.getComputedTextLength()). + </p> + <p> + The eleventh subtest is again testing the property .textLength. The rounded result of .textLength.animVal.value may vary in + the implementations but should be around 364. + It must match the value calculated in the second subtest (.getComputedTextLength()). + </p> + <p> + The twelfth subtest is again testing the property .lengthAdjust. The results of .lengthAdjust.baseVal and + .lengthAdjust.animVal must be 1 and 1. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-dom-01-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <script type="text/ecmascript"><![CDATA[ + function testSVGTextContentElement() { + var svgNS = "http://www.w3.org/2000/svg"; + var tContentEl = document.getElementById("testText"); + var textGroup = document.getElementById("textGroup"); + var svgPt = document.documentElement.createSVGPoint(); + svgPt.x = 240; + svgPt.y = 25; + + //1: testing .getCharNumAtPosition() + var charNumresult = tContentEl.getCharNumAtPosition(svgPt); + document.getElementById("text1").firstChild.data = ".getCharNumAtPosition() result: "+charNumresult; + + //2: testing .getCharNumAtPosition() + var compTextLength = tContentEl.getComputedTextLength(); + document.getElementById("text2").firstChild.data = ".getComputedTextLength() result: "+Math.round(compTextLength); + var baseLine = document.createElementNS(svgNS,"line"); + baseLine.setAttributeNS(null,"stroke","red"); + baseLine.setAttributeNS(null,"x1",(240 - compTextLength * 0.5)); + baseLine.setAttributeNS(null,"x2",(240 + compTextLength * 0.5)); + baseLine.setAttributeNS(null,"y1",30); + baseLine.setAttributeNS(null,"y2",30); + textGroup.insertBefore(baseLine,tContentEl); + + //3: testing .getEndPositionOfChar(), end of character + var endPosChar = tContentEl.getEndPositionOfChar(11); + document.getElementById("text3").firstChild.data = ".getEndPositionOfChar(11) result ('e'): "+Math.round(endPosChar.x)+","+Math.round(endPosChar.y); + var endPosLine = document.createElementNS(svgNS,"line"); + endPosLine.setAttributeNS(null,"stroke","red"); + endPosLine.setAttributeNS(null,"x1",endPosChar.x); + endPosLine.setAttributeNS(null,"x2",endPosChar.x); + endPosLine.setAttributeNS(null,"y1",endPosChar.y); + endPosLine.setAttributeNS(null,"y2",endPosChar.y-15); + textGroup.insertBefore(endPosLine,tContentEl); + + //4: testing getExtentOfChar + var charExtent = tContentEl.getExtentOfChar(11); + document.getElementById("text4").firstChild.data = ".getExtentOfChar(11) result ('e'): "+Math.round(charExtent.x)+","+Math.round(charExtent.y)+","+Math.round(charExtent.width)+","+Math.round(charExtent.height); + var extentRect = document.createElementNS(svgNS,"rect"); + extentRect.setAttributeNS(null,"fill","lightblue"); + extentRect.setAttributeNS(null,"x",charExtent.x); + extentRect.setAttributeNS(null,"y",charExtent.y); + extentRect.setAttributeNS(null,"width",charExtent.width); + extentRect.setAttributeNS(null,"height",charExtent.height); + textGroup.insertBefore(extentRect,baseLine); + + //5: testing getNumberOfChars + var numChars = tContentEl.getNumberOfChars(); + document.getElementById("text5").firstChild.data = ".getNumberOfChars() result: "+numChars; + + //6: testing getRotationOfChar + var charRot = tContentEl.getRotationOfChar(5); + document.getElementById("text6").firstChild.data = ".getRotationOfChar(5) result: "+charRot; + var rotCharExtent = tContentEl.getExtentOfChar(5); + var rotExtentRect = document.createElementNS(svgNS,"rect"); + rotExtentRect.setAttributeNS(null,"fill","lightblue"); + rotExtentRect.setAttributeNS(null,"x",rotCharExtent.x); + rotExtentRect.setAttributeNS(null,"y",rotCharExtent.y); + rotExtentRect.setAttributeNS(null,"width",rotCharExtent.width); + rotExtentRect.setAttributeNS(null,"height",rotCharExtent.height); + textGroup.insertBefore(rotExtentRect,baseLine); + + //7: testing .getStartPositionOfChar(), end of character + var startPosChar = tContentEl.getStartPositionOfChar(11); + document.getElementById("text7").firstChild.data = ".getStartPositionOfChar(11) result ('e'): "+Math.round(startPosChar.x)+","+Math.round(startPosChar.y); + var startPosLine = document.createElementNS(svgNS,"line"); + startPosLine.setAttributeNS(null,"stroke","red"); + startPosLine.setAttributeNS(null,"x1",startPosChar.x); + startPosLine.setAttributeNS(null,"x2",startPosChar.x); + startPosLine.setAttributeNS(null,"y1",startPosChar.y); + startPosLine.setAttributeNS(null,"y2",startPosChar.y-15); + textGroup.insertBefore(startPosLine,tContentEl); + + //8: testing .getSubStringLength() + var startPosInterface = tContentEl.getStartPositionOfChar(22); + var subStrLength = tContentEl.getSubStringLength(22,9); + document.getElementById("text8").firstChild.data = ".getSubStringLength(22,9) result ('interface'): "+Math.round(subStrLength); + var subStrLine = document.createElementNS(svgNS,"line"); + subStrLine.setAttributeNS(null,"stroke","lime"); + subStrLine.setAttributeNS(null,"x1",startPosInterface.x); + subStrLine.setAttributeNS(null,"x2",(startPosInterface.x+subStrLength)); + subStrLine.setAttributeNS(null,"y1",startPosInterface.y); + subStrLine.setAttributeNS(null,"y2",startPosInterface.y); + textGroup.insertBefore(subStrLine,tContentEl); + + //9: testing .selectSubString() + tContentEl.selectSubString(18,3); + + //10: testing textLength.baseVal.value + var tlbaseval = tContentEl.textLength.baseVal.value; + document.getElementById("text10").firstChild.data = ".textLength.baseVal.value result: "+Math.round(tlbaseval); + + //11: testing textLength.baseVal.value + var tlanimval = tContentEl.textLength.animVal.value; + document.getElementById("text11").firstChild.data = ".textLength.animVal.value result: "+Math.round(tlanimval); + + //12: testing lengthAdjust baseVal and animVal + document.getElementById("text12").firstChild.data = ".lengthAdjust.baseVal and .lengthAdjust.animVal result: "+tContentEl.lengthAdjust.baseVal+","+tContentEl.lengthAdjust.animVal;; + } + ]]></script> + <g id="textGroup" font-family="Arial" font-size="15"> + <text x="240" y="30" text-anchor="middle" id="testText"> + This <tspan rotate="45,90">is</tspan> a test of the interface SVGTextContentElement. + </text> + <text id="text1" x="30" y="60">.getCharNumAtPosition() result: </text> + <text id="text2" x="30" y="80">.getComputedTextLength() result: </text> + <text id="text3" x="30" y="100">.getEndPositionOfChar(11) result ('e'): </text> + <text id="text4" x="30" y="120">.getExtentOfChar(11) result ('e'): </text> + <text id="text5" x="30" y="140">.getNumberOfChars() result: </text> + <text id="text6" x="30" y="160">.getRotationOfChar(5) result: </text> + <text id="text7" x="30" y="180">.getStartPositionOfChar(11) result: </text> + <text id="text8" x="30" y="200">.getSubStringLength(22,9) result ('interface'): </text> + <text id="text9" x="30" y="220">.selectSubString(18,3) result: the word 'the' should be selected</text> + <text id="text10" x="30" y="240">.textLength.baseVal.value result:</text> + <text id="text11" x="30" y="260">.textLength.animVal.value result:</text> + <text id="text12" x="30" y="280">.lengthAdjust.baseVal and .lengthAdjust.animVal result:</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-dom-02-f-manual.svg b/testing/web-platform/tests/svg/import/text-dom-02-f-manual.svg new file mode 100644 index 000000000..bcbbe1063 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-dom-02-f-manual.svg @@ -0,0 +1,131 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="CL" author="CM" status="accepted" + version="$Revision: 1.10 $" testname="$RCSfile: text-dom-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#InterfaceSVGTextContentElement"> + <p> + This tests that methods on the SVGTextContentElement interface + that take an index to a character or a number of characters + actually interpret these as indexes to or numbers of UTF-16 code + units. To test this, a character from outside the Basic Multilingual Plane + (U+10000; LINEAR B SYLLABLE B008) is used in a text string. + This character is stored in UTF-16 as a surrogate pair. + </p> + <p> + The test consists of two sub-tests, which test those methods + on the SVGTextContentElement interface which do not rely on rendering. The result + of each sub-test is shown as a small rectangle: black + indicates that the sub-test did not run, red indicates that + the sub-test failed and green indicates that the sub-test + succeeded. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if both rectangles are green. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-dom-02-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x='10' y='30' font-size='13'>Test that SVGTextContentElement methods work on UTF-16 code units</text> + <text x='10' y='60' font-size='11'>Methods independent of layout</text> + <font-face font-family='SPlaneOne'> + <font-face-src> + <font-face-uri xlink:href="../resources/Plane1/PlaneOne.svg#SPlaneOne"/> + </font-face-src> + </font-face> + <style type="text/css"> + @font-face { + font-family: PlaneOne; + src: url(woffs/PlaneOne.woff) format("woff"); + } + </style> + + <text id='t' x='50' y='50' visibility='hidden' font-family='PlaneOne, SPlaneOne, serif' font-size='10' rotate='10 20 30'>a𐀀b</text> + + <rect id='r1' x='10' y='140' width='30' height='30'/> + <text x='50' y='160'>getNumberOfChars</text> + + <rect id='r2' x='10' y='180' width='30' height='30'/> + <text x='50' y='200'>getSubStringLength</text> + + <script><![CDATA[ + function $(x) { return document.getElementById(x) } + function eq(a, b) { + if (a.length != b.length) return false; + for (var i = 0; i < a.length; i++) if (a[i] != b[i]) return false; + return true; + } + function p(x, y) { + var p = document.documentElement.createSVGPoint(); + p.x = x; + p.y = y; + return p; + } + + var t = $('t'); + var x, b; + + b = false; + try { + b = t.getNumberOfChars() == 4; + } catch (e) { + } + $('r1').setAttribute('fill', b ? 'green' : 'red'); + + b = false; + try { + x = [ + t.getSubStringLength(0, 1), + t.getSubStringLength(0, 2), + t.getSubStringLength(0, 3), + t.getSubStringLength(0, 4), + t.getSubStringLength(1, 1), + t.getSubStringLength(1, 2), + t.getSubStringLength(1, 3), + t.getSubStringLength(2, 1), + t.getSubStringLength(2, 2), + t.getSubStringLength(3, 1), + ]; + b = eq(x, [1, 3, 3, 7, 2, 2, 6, 2, 6, 4]); + } catch (e) { + } + $('r2').setAttribute('fill', b ? 'green' : 'red'); + + ]]></script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.10 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-dom-03-f-manual.svg b/testing/web-platform/tests/svg/import/text-dom-03-f-manual.svg new file mode 100644 index 000000000..325bca68c --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-dom-03-f-manual.svg @@ -0,0 +1,130 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="DAS" author="CM" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: text-dom-03-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#InterfaceSVGTextContentElement"> + <p> + This tests that SVGTextContentElement.getSubStringLength() + handles out-of-range charnum and nchars parameter values correctly. + </p> + <p> + The test consists of 5 sub-tests, which test the different + combinations of values passed to SVGTextContentElement.getSubStringLength(). + The result of each sub-test is shown as a small rectangle: black + indicates that the sub-test did not run, red indicates that + the sub-test failed and green indicates that the sub-test + succeeded. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. The test relies on support for SVG Fonts. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if all 5 rectangles are green. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-dom-03-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x='10' y='30' font-size='13'>Test that getSubStringLength() handles out-of-range arguments</text> + + <font horiz-adv-x='1000'> + <font-face font-family='TestFont'/> + <glyph unicode='a' horiz-adv-x='100' d='M0,0 h80 v1000 h-80 z'/> + <glyph unicode='𐀀' horiz-adv-x='200' d='M0,0 h180 v1000 h-180 z'/> + <glyph unicode='b' horiz-adv-x='400' d='M0,0 h380 v1000 h-380 z'/> + </font> + + <text id='t' x='50' y='50' visibility='hidden' font-family='TestFont' font-size='10'>ababa</text> + + <rect id='r1' x='10' y='40' width='30' height='30'/> + <text x='50' y='60'>charnum < 0</text> + + <rect id='r2' x='10' y='80' width='30' height='30'/> + <text x='50' y='100'>nchars < 0</text> + + <rect id='r3' x='10' y='120' width='30' height='30'/> + <text x='50' y='140'>charnum = 0, nchars = length</text> + + <rect id='r4' x='10' y='160' width='30' height='30'/> + <text x='50' y='180'>charnum = 0, nchars = length + 10</text> + + <rect id='r5' x='10' y='200' width='30' height='30'/> + <text x='50' y='220'>charnum = 1, nchars = -1</text> + + <script><![CDATA[ + function $(x) { return document.getElementById(x) } + + var b, t = $('t'); + + b = false; + try { + t.getSubStringLength(-1, 1); + } catch (e) { + b = e.code == 1; // DOMException.INDEX_SIZE_ERR + } + $('r1').setAttribute('fill', b ? 'green' : 'red'); + + b = false; + try { + t.getSubStringLength(1, -1); + } catch (e) { + b = e.code == 1; // DOMException.INDEX_SIZE_ERR + } + $('r2').setAttribute('fill', b ? 'green' : 'red'); + + b = false; + try { + b = t.getSubStringLength(0, 5) == 11; + } catch (e) { + } + $('r3').setAttribute('fill', b ? 'green' : 'red'); + + b = false; + try { + b = t.getSubStringLength(0, 15) == 11; + } catch (e) { + } + $('r4').setAttribute('fill', b ? 'green' : 'red'); + + b = false; + try { + t.getSubStringLength(1, -1); + } catch (e) { + b = e.code == 1; // DOMException.INDEX_SIZE_ERR + } + $('r5').setAttribute('fill', b ? 'green' : 'red'); + ]]></script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-dom-04-f-manual.svg b/testing/web-platform/tests/svg/import/text-dom-04-f-manual.svg new file mode 100644 index 000000000..67d395093 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-dom-04-f-manual.svg @@ -0,0 +1,157 @@ +<svg id="svg-root" width="100%" height="100%" onload="test()" xmlns="http://www.w3.org/2000/svg" + viewBox="0 0 480 360" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AG" author="ED" status="reviewed" + version="$Revision: 1.4 $" testname="$RCSfile: text-dom-04-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#InterfaceSVGTextContentElement"> + <p> + This tests the SVGTextContentElement.getSubStringLength method. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + To pass the test there should be no red visible. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-dom-04-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <font horiz-adv-x="4000" id="mini"> + <font-face font-family="simplesvgfont" units-per-em="4000" ascent="800" descent="-200" alphabetic="0"/> + <missing-glyph horiz-adv-x="10000" d="M0 0 4000 0"/> + <glyph unicode="a" glyph-name="a" horiz-adv-x="4100" d="M0 4000l2000 -4000l2000 4000Z"/> + <glyph unicode="b" glyph-name="b" horiz-adv-x="2000" d="M0 0l2000 0000l0 2000l-2000 0Z"/> + <glyph unicode="cb" d="M0 0l2000 2000l-2000 2000Z" horiz-adv-x="800"/> + <glyph unicode="c" glyph-name="c" horiz-adv-x="1900" d="M0 0L2000 2000l-2000 0L2000 0Z"/> + <glyph unicode="𝍒" glyph-name="compliance" d="M1000,0 h1000 v-1000 h-1000 z" horiz-adv-x="2100"/> + <hkern u1="c" u2="a" k="500"/> + </font> + </defs> + + <script type="text/ecmascript"><![CDATA[ + function test() + { + var t = document.getElementById("t"); + var r = document.getElementById("r"); + var res = document.getElementById("res"); + var isPassed = true; + + // string: abca𝍒cb + // indices: 0123 4 5 67 + + var tests = new Array("getSubStringLength(0,1)", "4100", // 'a' + "getSubStringLength(0,2)", "6100", // 'ab' + "getSubStringLength(0,3)", "7500", // 'abc' + "getSubStringLength(0,4)", "11600", // 'abca' + "getSubStringLength(0,5)", "13700", // 'abca' and high surrogate of 1D352 + "getSubStringLength(0,6)", "13700", // 'abca𝍒' + "getSubStringLength(0,7)", "14500", // 'abca𝍒' and half of ligature 'cb' + "getSubStringLength(0,8)", "14500", // 'abca�' + "getSubStringLength(0,9)", "14500", // 'abca�' + "getSubStringLength(3,1)", "4100", // 'a' + "getSubStringLength(1,1)", "2000", // 'b' + "getSubStringLength(4,1)", "2100", // high surrogate of 1D352 + "getSubStringLength(4,2)", "2100", // '𝍒' + "getSubStringLength(5,1)", "2100", // low surrogate of 1D352 + "getSubStringLength(6,1)", "800", // first half of ligature 'cb' + "getSubStringLength(6,2)", "800", // ligature 'cb' + "getSubStringLength(7,1)", "800", // second half of ligature 'cb' + "getSubStringLength(8,1)", "INDEX_SIZE_ERR", + "getSubStringLength(9,0)", "INDEX_SIZE_ERR", + "getSubStringLength(-1,1)", "INDEX_SIZE_ERR", + "getSubStringLength(-57,0)", "INDEX_SIZE_ERR", + "getSubStringLength(0,-52)", "INDEX_SIZE_ERR", + "getSubStringLength(-1,-5)", "INDEX_SIZE_ERR", + "getSubStringLength(7,0)", "0", // second half of ligature 'cb' + "getSubStringLength(5,0)", "0", // high surrogate of 1D352 + "getSubStringLength(4,0)", "0" // low surrogate of 1D352 + ); + + try + { + for(var i = 0; i < tests.length; i=i+2) + { + try + { + val = eval("t."+tests[i]); + } + catch(e) + { + if(e.code == DOMException.INDEX_SIZE_ERR) + { + val = "INDEX_SIZE_ERR" + } + else + { + val = e; + } + } + + if(val != tests[i+1]) + { + throw "Failed " + tests[i] + " got " + val + " but expected " + tests[i+1]; + } + } + } + catch(f) + { + isPassed = false; + res.textContent = f; + } + + if(isPassed) + { + r.setAttribute("fill", "none"); + } + } + ]]></script> + + <g transform="scale(0.02 0.02) translate(4000 2000)"> + <g id="reference" fill="red"> + <path d="M0 4000l2000 -4000l2000 4000Z" transform="scale(1 -1) translate(0 -8000)"/> + <path d="M0 0l2000 0000l0 2000l-2000 0Z" transform="translate(4100 6000)"/> + <path d="M0 0L2000 2000l-2000 0L2000 0Z" transform="translate(6100 6000)"/> + <path d="M0 4000l2000 -4000l2000 4000Z" transform="scale(1 -1) translate(7500 -8000)"/> + <path d="M1000,0 h1000 v-1000 h-1000 z" transform="scale(1 -1) translate(11600 -8000)"/> + <path d="M0 0l2000 2000l-2000 2000Z" transform="scale(1 -1) translate(13700 -8000)"/> + </g> + + <text id="t" font-family="simplesvgfont" font-size="4000" y="2em" fill="lime">abca𝍒cb</text> + <rect id="r" x="5000" y="10%" width="2000" height="2000" fill="red"/> + <text id="res" x="50%" text-anchor="middle" font-family="sans-serif" font-size="200" y="80%"></text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-dom-05-f-manual.svg b/testing/web-platform/tests/svg/import/text-dom-05-f-manual.svg new file mode 100644 index 000000000..017d9ffe9 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-dom-05-f-manual.svg @@ -0,0 +1,181 @@ +<svg version="1.1" baseProfile="full" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="CL" author="CM" status="reviewed" + version="$Revision: 1.6 $" testname="$RCSfile: text-dom-05-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#InterfaceSVGTextContentElement"> + <p> + This tests that methods on the SVGTextContentElement interface + that take an index to a character or a number of characters + actually interpret these as indexes to or numbers of UTF-16 code + units. To test this, a character from outside the Basic Multilingual Plane + (U+10000; LINEAR B SYLLABLE B008) is used in a text string. + This character is stored in UTF-16 as a surrogate pair. + </p> + <p> + The test consists of 5 sub-tests, which test the methods + methods on the SVGTextContentElement interface. The result + of each sub-test is shown as a small rectangle: black + indicates that the sub-test did not run, red indicates that + the sub-test failed and green indicates that the sub-test + succeeded. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + <p> + The test relies on support for WebFonts - either SVG Fonts, or WOFF, or OpenType. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if all 5 rectangles are green. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-dom-05-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x='10' y='30' font-size='13'>Test that SVGTextContentElement methods work on UTF-16 code units</text> + <text x='10' y='60' font-size='11'>Methods that rely on layout</text> + <font-face font-family='SPlaneOne'> + <font-face-src> + <font-face-uri xlink:href="../resources/Plane1/PlaneOne.svg#SPlaneOne"/> + </font-face-src> + </font-face> + <style type="text/css"> + @font-face { + font-family: PlaneOne; + src: url(woffs/PlaneOne.woff) format("woff"); + } + </style> + + <text id='t' x='50' y='50' visibility='hidden' font-family='PlaneOne, SPlaneOne' font-size='10' rotate='10 20 30'>a𐀀b</text> + + <rect id='r3' x='10' y='120' width='30' height='30'/> + <text x='50' y='140'>getStartPositionOfChar</text> + + <rect id='r4' x='10' y='160' width='30' height='30'/> + <text x='50' y='180'>getEndPositionOfChar</text> + + <rect id='r5' x='10' y='200' width='30' height='30'/> + <text x='50' y='220'>getExtentOfChar</text> + + <rect id='r6' x='10' y='240' width='30' height='30'/> + <text x='50' y='260'>getRotationOfChar</text> + + <rect id='r7' x='10' y='280' width='30' height='30'/> + <text x='50' y='300'>getCharNumAtPosition</text> + + <script><![CDATA[ + function $(x) { return document.getElementById(x) } + function eq(a, b) { + if (a.length != b.length) return false; + for (var i = 0; i < a.length; i++) if (a[i] != b[i]) return false; + return true; + } + function p(x, y) { + var p = document.documentElement.createSVGPoint(); + p.x = x; + p.y = y; + return p; + } + + var t = $('t'); + var x, b; + + b = false; + try { + x = [ + t.getStartPositionOfChar(0).x, + t.getStartPositionOfChar(1).x, + t.getStartPositionOfChar(2).x, + t.getStartPositionOfChar(3).x + ]; + b = eq(x, [50, 51, 51, 53]); + } catch (e) { + } + $('r3').setAttribute('fill', b ? 'green' : 'red'); + + b = false; + try { + x = [ + t.getEndPositionOfChar(0).x, + t.getEndPositionOfChar(1).x, + t.getEndPositionOfChar(2).x, + t.getEndPositionOfChar(3).x + ]; + b = x[0] < x[1] && x[1] == x[2] && x[2] < x[3]; + } catch (e) { + } + $('r4').setAttribute('fill', b ? 'green' : 'red'); + + b = false; + try { + x = [ + t.getExtentOfChar(0).width, + t.getExtentOfChar(1).width, + t.getExtentOfChar(2).width, + t.getExtentOfChar(3).width + ]; + b = eq(x, [1, 2, 2, 4]); + } catch (e) { + } + $('r5').setAttribute('fill', b ? 'green' : 'red'); + + b = false; + try { + x = [ + t.getRotationOfChar(0), + t.getRotationOfChar(1), + t.getRotationOfChar(2), + t.getRotationOfChar(3) + ]; + b = eq(x, [10, 20, 20, 30]); + } catch (e) { + } + $('r6').setAttribute('fill', b ? 'green' : 'red'); + + b = false; + try { + x = [ + t.getCharNumAtPosition(p(50.5, 49)), + t.getCharNumAtPosition(p(51.5, 49)), // within first half of the glyph represented by the two surrogates + t.getCharNumAtPosition(p(52.5, 49)), // within second half of the glyph represented by the two surrogates + t.getCharNumAtPosition(p(53.5, 49)) + ]; + b = eq(x, [0, 1, 2, 3]); + } catch (e) { + } + $('r7').setAttribute('fill', b ? 'green' : 'red'); + ]]></script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-fonts-01-t-manual.svg b/testing/web-platform/tests/svg/import/text-fonts-01-t-manual.svg new file mode 100644 index 000000000..30cc2fbd6 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-fonts-01-t-manual.svg @@ -0,0 +1,87 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Chris Lilley" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: text-fonts-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#FontPropertiesUsedBySVG"> + <p> + Purpose of test is to determine if the font family is being + correctly selected. The top two lines of text test serif fonts; + the top line in maroon tests the generic font family 'serif' + and the second line in black tests a selection of commonly + available named serif fonts. The next two lines of text test + sans-serif fonts; + the top line in maroon tests the generic font family 'sans-serif' + and the second line in black tests a selection of commonly + available named sans serif fonts. The following two lines + of text test monospaced fonts; + the top line in maroon tests the generic font family 'monospaced' + and the second line in black tests a selection of commonly + available named monospaced fonts. The lowercase 'i' and uppercase'W' + should be the same width,for monospaced fonts. + </p> + <p> + The seventh line of text, in green, tests for + three non-existent fonts (nonsense names). There is no fallback + generic font specified. The text must be displayed anyway. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The first six lines contain two Japanese characters (画像) + at the end of the line. Both of these characters must be displayed, + although it is compliant to display them with the 'missing glyph' + if no suitable font containing Japanese characters can be found. + Most but not all fonts have a visible missing glyph character. + If the selected font has a visible missing glyph character, it should appear + wherever the corresponding glyph is not available. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-fonts-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-weight="normal" font-size="24" stroke="none"> + <text font-family="Georgia, 'Minion Web', 'Times New Roman', Times, 'MS PMincho', Heisei-Mincho, serif " x="20" y="80">A serifed face 画像</text> + <text font-family="Arial, 'Arial Unicode', 'Myriad Web', Geneva, 'Lucida Sans Unicode', 'MS PGothic', Osaka, sans-serif " x="20" y="160">A sans-serif face 画像</text> + <text font-family="'Lucida Console', 'Courier New', Courier, Monaco, 'MS Gothic', Osaka-Mono, monospace" x="20" y="240">A mono (iW) face 画像</text> + <g id="generic" fill="maroon"> + <text font-family="serif" x="40" y="50">A serifed face 画像</text> + <text font-family="sans-serif " x="40" y="130">A sans-serif face 画像</text> + <text font-family="monospace " x="40" y="210">A mono (iW) face 画像</text> + </g> + <text fill="green" font-family="'No such font at all', 'another fictitious one', sillynamewithoutspaces" x="40" y="290">This must be displayed</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-fonts-02-t-manual.svg b/testing/web-platform/tests/svg/import/text-fonts-02-t-manual.svg new file mode 100644 index 000000000..ba2947149 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-fonts-02-t-manual.svg @@ -0,0 +1,92 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Chris lilley" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: text-fonts-02-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#FontPropertiesUsedBySVG"> + <p> + Purpose of test is to determine if the font weight is being + correctly rendered. A number of font families are specified. The + numerical weight values (100 to 900) should show the lighter weights + on the lower numbers and the heavier weights on the larger numbers. + Heavier is defined to mean 'no lighter'. + </p> + <p> + If only one font weight is available, they should all display at the + same weight. The transition from black to green figures shows the + correct light to bold transition for the common case where two + weights are available. If three or more weights are available, see + the CSS2 specification for how these are allocated to the nine + weight numbers. + </p> + <p> + The absolute keywords 'normal' and bold' are tested + by the first two lines on the right hand side of the test, + the third line of text tests the to 'bolder' + relative keyword and the fourth tests the + 'lighter' relative keyword. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The numerical weight values (100 to 900) should show the lighter weights on the + lower numbers and the heavier weights on the larger numbers. Heavier is defined + to mean 'no lighter'. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-fonts-02-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-family="Georgia,'Times New Roman',Times,'MS Mincho',serif" font-size="30"> + <text font-weight="100" x="360" y="50">100</text> + <text font-weight="200" x="360" y="85">200</text> + <text font-weight="300" x="360" y="120">300</text> + <text font-weight="400" x="360" y="155">400</text> + <text font-weight="500" x="360" y="190">500</text> + <text fill="green" font-weight="600" x="360" y="225">600</text> + <text fill="green" font-weight="700" x="360" y="260">700</text> + <text fill="green" font-weight="800" x="360" y="295">800</text> + <text fill="green" font-weight="900" x="360" y="330">900</text> + <text font-weight="bold" x="60" y="80">This is bold</text> + <text font-weight="normal" x="60" y="130">This is normal</text> + <g font-weight="normal" fill="blue"> + <text font-weight="bolder" x="60" y="180">Blue is bolder</text> + </g> + <g font-weight="bold" fill="blue"> + <text font-weight="lighter" x="60" y="230">Blue is lighter</text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-fonts-03-t-manual.svg b/testing/web-platform/tests/svg/import/text-fonts-03-t-manual.svg new file mode 100644 index 000000000..05a0fc69b --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-fonts-03-t-manual.svg @@ -0,0 +1,85 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="MI" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: text-fonts-03-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#FontPropertiesUsedBySVG"> + <p> + Testing font-family attribute. + Two SVG fonts are defined. Various text elements are then + used with varying values for the font-family attribute. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The first two text elements should display in their respective fonts, + the last two should be displayed using the system font since the + value specified for font-family is either invalid or not specified. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-fonts-03-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-size="18"> + <!-- Deliberately leave off font-family from the template #test-body-content + element, since we want the default font. --> + <defs> + <font> + <font-face font-family="SVGHaettenschweiler"/> + <glyph unicode="A" horiz-adv-x="440" d="M440 0l-160 0 -20 180 -80 0 -20 -180 -160 0 120 700 200 0 120 -700zm-200 280l-20 220 -20 -220 40 0z"/> + <glyph unicode="B" horiz-adv-x="378" d="M20 0l0 700 180 0c40,0 80,0 100,-20 40,-20 60,-60 60,-100l0 -100c0,-60 -40,-80 -100,-100 80,-20 100,-60 100,-100l0 -140c0,-40 -20,-80 -40,-100 -40,-20 -60,-40 -100,-40l-200 0zm200 460l0 120c0,20 -20,20 -40,20l0 -180c20,0 40,0 40,40zm0 -340l0 180c0,20 -20,40 -40,40l0 -260c20,0 40,20 40,40z"/> + <glyph unicode="C" horiz-adv-x="370" d="M360 460l-140 0 0 140c0,0 -20,20 -20,20 -20,0 -20,-20 -20,-20l0 -500c0,0 0,0 20,0 0,0 20,0 20,0l0 180 140 0 0 -180c0,-20 -20,-60 -60,-80 -20,-20 -60,-20 -100,-20 -120,0 -180,40 -180,120l0 460c0,80 60,120 180,120 100,0 160,-40 160,-120l0 -120z"/> + </font> + <font> + <font-face font-family="SVGCharlesworth"/> + <glyph unicode="A" horiz-adv-x="712" d="M-60 0l0 20c0,0 20,0 40,0 40,0 40,0 60,20 0,0 20,20 40,80 20,60 40,120 80,200 20,80 40,160 80,220 20,60 40,120 40,120 0,20 -20,20 -80,20l0 20c20,0 80,0 140,0 100,0 140,0 160,0l0 -20c-40,0 -80,0 -80,-20 20,-60 60,-140 80,-220 40,-100 80,-180 100,-260 40,-80 60,-140 60,-140 0,0 20,-20 40,-20 40,0 60,0 60,0l0 -20c0,0 -60,0 -180,0 -20,0 -40,0 -80,0 -40,0 -60,0 -80,0l0 20c20,0 60,0 80,0 20,0 20,20 20,20 0,0 -20,60 -40,140 -40,80 -40,120 -60,140 -60,0 -140,0 -220,0 -20,-20 -20,-40 -20,-80 -20,-40 -40,-80 -40,-120 -20,-60 -20,-80 -20,-80 20,-20 60,-20 80,-20l20 -20c-40,0 -80,0 -140,0 -80,0 -120,0 -140,0zm260 360c40,0 80,0 120,0 60,0 100,0 100,0 0,0 0,0 -20,40 0,20 -20,60 -40,100 0,40 -20,80 -20,100 -20,20 -20,40 -20,60l0 0c-20,-40 -40,-80 -60,-160 -40,-80 -60,-120 -60,-140z"/> + <glyph unicode="B" horiz-adv-x="684" d="M160 660c-20,20 -40,20 -100,20l-20 20c20,0 60,0 120,0 80,0 140,0 180,0 60,0 100,0 160,-20 40,-20 60,-60 60,-100 0,-40 -20,-100 -60,-120 -20,-40 -60,-60 -100,-80l0 0c40,0 60,-20 100,-40 20,0 40,-20 60,-40 20,-20 20,-40 40,-60 0,-20 0,-40 0,-60 0,-40 0,-60 -20,-100 -20,-20 -40,-40 -80,-60 -20,-20 -60,-20 -100,-20 -20,0 -40,0 -80,0 -60,0 -100,0 -160,0 -20,0 -60,0 -120,0l20 20c0,0 20,0 40,0 40,0 40,0 60,20 0,0 0,20 0,80 0,80 0,160 0,240 0,80 0,140 0,200 0,60 0,100 0,100zm120 -620c20,0 60,-20 80,-20 20,0 60,0 80,20 20,0 20,20 40,40 20,20 20,40 20,60 0,40 -20,80 -40,100 -20,40 -40,60 -80,80 -40,20 -60,20 -100,20 0,-20 0,-40 0,-80 0,-40 0,-80 0,-120 0,-40 0,-80 0,-100zm0 340c40,0 80,0 100,20 20,20 40,40 60,60 0,20 0,60 0,80 0,20 0,40 0,60 -20,20 -40,40 -60,60 -20,20 -40,20 -60,20 -20,0 -40,0 -40,0 0,0 0,-20 0,-40 0,-20 0,-60 0,-140 0,-60 0,-100 0,-120z"/> + <glyph unicode="C" horiz-adv-x="808" d="M740 480l-20 0c0,20 0,60 0,80 -20,20 -20,40 -40,60 -40,20 -60,20 -100,40 -40,20 -60,20 -100,20 -20,0 -20,0 -40,0 -40,0 -100,-20 -120,-40 -40,-20 -60,-40 -80,-80 -20,-20 -40,-40 -60,-80 0,-20 0,-60 0,-80 0,-60 0,-120 20,-160 20,-40 60,-80 100,-120 20,-20 80,-40 120,-60 40,-20 100,-40 140,-40 80,20 160,40 220,60l0 -40c-40,-20 -80,-40 -140,-40 -40,-20 -100,-20 -140,-20 -80,0 -140,20 -200,40 -80,20 -120,60 -180,100 -40,60 -60,120 -60,200 0,0 0,20 0,20 0,60 0,100 20,140 20,40 60,80 100,120 20,40 80,60 140,80 60,20 120,40 200,40 60,0 120,-20 200,-20 0,0 0,0 0,20 20,40 20,40 20,60l20 0c0,-20 0,-60 0,-140 -20,-100 -20,-140 -20,-160z"/> + </font> + </defs> + + <text x="15" y="60" font-family="SVGFreeSansASCII,sans-serif" font-size="18">font-family = "Haettenschweiler"</text> + <text x="340" y="60" font-family="SVGHaettenschweiler" font-size="35">ABC</text> + + <text x="15" y="110" font-family="SVGFreeSansASCII,sans-serif" font-size="18">font-family = "Charlesworth"</text> + <text x="340" y="110" font-family="SVGCharlesworth" font-size="35">ABC</text> + + <text x="15" y="160" font-family="SVGFreeSansASCII,sans-serif" font-size="18">font-family = "Invalid Name"</text> + <text x="340" y="160" font-family="InvalidFontFamily" font-size="35">ABC</text> + + <text x="15" y="210" font-family="SVGFreeSansASCII,sans-serif" font-size="18">font-family = not specified</text> + <text x="340" y="210" font-size="35">ABC</text> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-fonts-04-t-manual.svg b/testing/web-platform/tests/svg/import/text-fonts-04-t-manual.svg new file mode 100644 index 000000000..e371d71d4 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-fonts-04-t-manual.svg @@ -0,0 +1,76 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="MI" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: text-fonts-04-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#FontPropertiesUsedBySVG"> + <p> + Testing font-family attribute. + Various text elements are + used with varying values for the font-family attribute. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The first two text elements should display in their respective fonts, + <span style="font-family: Haettenschweiler">Haettenschweiler</span> and + <span style="font-family: Charlesworth">Charlesworth</span>, + if they are installed on the target system. Otherwise, simply + displaying the text in some fallback font is enough to pass the test. + The last two should be displayed using a fallback font since the + value specified for font-family is either invalid or not specified. + Failing to display the text means the test is not passed. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-fonts-04-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-size="18"> + <!-- Deliberately leave off font-family from the template #test-body-content + element, since we want the default font. --> + + <text x="15" y="60" font-family="SVGFreeSansASCII,sans-serif" font-size="18">font-family = "Haettenschweiler"</text> + <text x="340" y="60" font-family="Haettenschweiler" font-size="35">ABC</text> + + <text x="15" y="110" font-family="SVGFreeSansASCII,sans-serif" font-size="18">font-family = "Charlesworth"</text> + <text x="340" y="110" font-family="Charlesworth" font-size="35">ABC</text> + + <text x="15" y="160" font-family="SVGFreeSansASCII,sans-serif" font-size="18">font-family = "Invalid Name"</text> + <text x="340" y="160" font-family="InvalidFontFamily" font-size="35">ABC</text> + + <text x="15" y="210" font-family="SVGFreeSansASCII,sans-serif" font-size="18">font-family = not specified</text> + <text x="340" y="210" font-size="35">ABC</text> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-fonts-05-f-manual.svg b/testing/web-platform/tests/svg/import/text-fonts-05-f-manual.svg new file mode 100644 index 000000000..b615e8036 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-fonts-05-f-manual.svg @@ -0,0 +1,57 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="[reviewer]" author="Microsoft" status="created" version="$Revision: 1.4 $" testname="$RCSfile: text-fonts-05-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/text.html#FontPropertiesUsedBySVG"> + <p> + Test that the 'line-height' property has no effect on text layout. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if the three blue instances of 'Filler Text' all have the same vertical position on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-fonts-05-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-size="18"> + <text x="100" y="100" fill="blue" font-size="25"> + <tspan x="50">FillerText</tspan> + <tspan x="160" line-height="100">FillerText</tspan> + <tspan x="270" line-height="200">FillerText</tspan> + </text> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-fonts-202-t-manual.svg b/testing/web-platform/tests/svg/import/text-fonts-202-t-manual.svg new file mode 100644 index 000000000..a26092a97 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-fonts-202-t-manual.svg @@ -0,0 +1,100 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="DS" owner="CL" status="accepted" + version="$Revision: 1.4 $" testname="$RCSfile: text-fonts-202-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#FontPropertiesUsedBySVG"> + <p> + This tests the 'font-weight' property when multiple weights are available. A + font family with six weights is specified, with a fallback to 'serif'. + </p> + <p> + If only one font weight is available, they should all display at the same weight. + The transition from black to green figures shows the correct light to bold transition + for the common case where two weights are available. If three or more weights are + available, see the CSS2 specification for how these are allocated to the nine weight + numbers. The specified font has six weights. + </p> + <p> + The absolute keywords 'normal' and bold' are tested by the first two lines on the + right hand side of the test, the third line of text tests the to 'bolder' relative + keyword and the fourth tests the 'lighter' relative keyword. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + If the platform supports installable opentype fonts, please download and install + <a href="http://justanotherfoundry.com/zalamander">Zalamander Caps</a> + by Tim Ahrens of <a href="http://justanotherfoundry.com/">Just Another Foundry</a>. + Then, view this test. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The numerical weight values (100 to 900) should show the lighter weights on the + lower numbers and the heavier weights on the larger numbers. Heavier is defined + to mean 'no lighter'. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-fonts-202-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <g font-family="'ZalamanderCaps', serif" font-size="30"> + <text font-weight="100" x="360" y="50">100</text> + <text font-weight="200" x="360" y="85">200</text> + <text font-weight="300" x="360" y="120">300</text> + <text font-weight="400" x="360" y="155">400</text> + <text font-weight="500" x="360" y="190">500</text> + <text fill="green" font-weight="600" x="360" y="225">600</text> + <text fill="green" font-weight="700" x="360" y="260">700</text> + <text fill="green" font-weight="800" x="360" y="295">800</text> + <text fill="green" font-weight="900" x="360" y="330">900</text> + <text font-weight="bold" x="60" y="80">This is bold</text> + <text font-weight="normal" x="60" y="130">This is normal</text> + <g font-weight="normal" fill="blue"> + <text font-weight="bolder" x="60" y="180">Blue is bolder</text> + </g> + <g font-weight="bold" fill="blue"> + <text font-weight="lighter" x="60" y="230">Blue is lighter</text> + </g> + <g font-size="14"> + <text x="30" y="270">ZalamanderCaps is an OpenType font</text> + <text x="30" y="290">by Tim Ahrens of Just Another Foundry</text> + </g> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> +<!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-fonts-203-t-manual.svg b/testing/web-platform/tests/svg/import/text-fonts-203-t-manual.svg new file mode 100644 index 000000000..0f8d37624 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-fonts-203-t-manual.svg @@ -0,0 +1,147 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AG" owner="CL" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: text-fonts-203-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#FontPropertiesUsedBySVG"> + <p> + This tests the 'font-weight' property when multiple weights are available. A + font family with five weights is specified, with a fallback to 'serif'. + </p> + <p> + The specified font family has five weights - 300, 400, 600, 700 and 800. + See the CSS3 Font specification + for how these are allocated to the nine weight numbers. + </p> + <p> + The absolute keywords 'normal' and bold' are tested by the first two lines on the + right hand side of the test, the third line of text tests the to 'bolder' relative + keyword and the fourth tests the 'lighter' relative keyword. + </p> + <p>The fonts are SVG fonts convertted, with the author's explicit permission, + from <a href="http://justanotherfoundry.com/Zalamander/index.htm">Zalamander Caps</a> + by Tim Ahrens of <a href="http://justanotherfoundry.com/">Just Another Foundry</a>. + An ASCII subset has been generated for this test. The font names have been + obfuscated, to deter + user agent sniffing for keywords like "Ultrabold". All weights in this generated + family are multiples of 100 and greater or equal to 300.</p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The numerical weight values (100 to 900) should show the lighter weights on the + lower numbers and the heavier weights on the larger numbers. Heavier is defined + to mean 'no lighter'. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-fonts-203-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <font-face + font-family="ZC" + unicode-range="U+0-7F" + font-weight="300" + font-variant="small-caps"> + <font-face-src> + <font-face-uri xlink:href="../resources/ZCL.svg#ZCL"/> + </font-face-src> + </font-face> + <font-face + font-family="ZC" + unicode-range="U+0-7F" + font-weight="400" + font-variant="small-caps"> + <font-face-src> + <font-face-uri xlink:href="../resources/ZCR.svg#ZCR"/> + </font-face-src> + </font-face> + <font-face + font-family="ZC" + unicode-range="U+0-7F" + font-weight="600" + font-variant="small-caps"> + <font-face-src> + <font-face-uri xlink:href="../resources/ZCSB.svg#ZCSB"/> + </font-face-src> + </font-face> + <font-face + font-family="ZC" + unicode-range="U+0-7F" + font-weight="700" + font-variant="small-caps"> + <font-face-src> + <font-face-uri xlink:href="../resources/ZCB.svg#ZCB"/> + </font-face-src> + </font-face> + <font-face + font-family="ZC" + unicode-range="U+0-7F" + font-weight="800" + font-variant="small-caps"> + <font-face-src> + <font-face-uri xlink:href="../resources/ZCXB.svg#ZCXB"/> + </font-face-src> + </font-face> + </defs> + + <g font-family="'ZC', serif" font-size="30" font-variant="small-caps"> + <text font-weight="100" x="360" y="50">100</text> + <text font-weight="200" x="360" y="85">200</text> + <text font-weight="300" x="360" y="120">300</text> + <text font-weight="400" x="360" y="155">400</text> + <text font-weight="500" x="360" y="190">500</text> + <text fill="green" font-weight="600" x="360" y="225">600</text> + <text fill="green" font-weight="700" x="360" y="260">700</text> + <text fill="green" font-weight="800" x="360" y="295">800</text> + <text fill="green" font-weight="900" x="360" y="330">900</text> + <text font-weight="bold" x="60" y="80">This is bold</text> + <text font-weight="normal" x="60" y="130">This is normal</text> + <g font-weight="normal" fill="blue"> + <text font-weight="bolder" x="60" y="180">Blue is bolder</text> + </g> + <g font-weight="bold" fill="blue"> + <text font-weight="lighter" x="60" y="230">Blue is lighter</text> + </g> + <g font-size="14"> + <text x="30" y="270">ZalamanderCaps is an OpenType font</text> + <text x="30" y="290">by Tim Ahrens of Just Another Foundry</text> + </g> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-fonts-204-t-manual.svg b/testing/web-platform/tests/svg/import/text-fonts-204-t-manual.svg new file mode 100644 index 000000000..31f464a11 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-fonts-204-t-manual.svg @@ -0,0 +1,138 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="" owner="CL" status="created" + version="$Revision: 1.1 $" testname="$RCSfile: text-fonts-204-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#FontPropertiesUsedBySVG"> + <p> + This tests the 'font-weight' property when multiple weights are available. A + font family with five weights is specified, with a fallback to 'serif'. + </p> + <p> + The specified font family has five weights - 300, 400, 600, 700 and 800. + See the CSS3 Font specification + for how these are allocated to the nine weight numbers. + </p> + <p> + The absolute keywords 'normal' and bold' are tested by the first two lines on the + right hand side of the test, the third line of text tests the to 'bolder' relative + keyword and the fourth tests the 'lighter' relative keyword. + </p> + <p>The fonts are WOFF fonts convertted, with the author's explicit permission, + from <a href="http://justanotherfoundry.com/zalamander">Zalamander Caps</a> + by Tim Ahrens of <a href="http://justanotherfoundry.com/">Just Another Foundry</a>. + The font names have been obfuscated, to deter + user agent sniffing for keywords like "Ultrabold". All weights in this generated + family are multiples of 100 and greater or equal to 300.</p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The numerical weight values (100 to 900) should show the lighter weights on the + lower numbers and the heavier weights on the larger numbers. Heavier is defined + to mean 'no lighter'. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-fonts-204-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <style type="text/css"> + @font-face { + font-family: ZC; + unicode-range: U+0-7F; + font-variant: small-caps; + font-weight: 300; + src: url(woffs/ZCL.woff) format("woff") + } + @font-face { + font-family: ZC; + unicode-range: U+0-7F; + font-variant: small-caps; + font-weight: 400; + src: url(woffs/ZCR.woff) format("woff") + } + @font-face { + font-family: ZC; + unicode-range: U+0-7F; + font-variant: small-caps; + font-weight: 600; + src: url(woffs/ZCSB.woff) format("woff") + } + @font-face { + font-family: ZC; + unicode-range: U+0-7F; + font-variant: small-caps; + font-weight: 700; + src: url(woffs/ZCB.woff) format("woff") + } + @font-face { + font-family: ZC; + unicode-range: U+0-7F; + font-variant: small-caps; + font-weight: 800; + src: url(woffs/ZCXB.woff) format("woff") + } + </style> + </defs> + + <g font-family="'ZC', serif" font-size="30" font-variant="small-caps"> + <text font-weight="100" x="360" y="50">100</text> + <text font-weight="200" x="360" y="85">200</text> + <text font-weight="300" x="360" y="120">300</text> + <text font-weight="400" x="360" y="155">400</text> + <text font-weight="500" x="360" y="190">500</text> + <text fill="green" font-weight="600" x="360" y="225">600</text> + <text fill="green" font-weight="700" x="360" y="260">700</text> + <text fill="green" font-weight="800" x="360" y="295">800</text> + <text fill="green" font-weight="900" x="360" y="330">900</text> + <text font-weight="bold" x="60" y="80">This is bold</text> + <text font-weight="normal" x="60" y="130">This is normal</text> + <g font-weight="normal" fill="blue"> + <text font-weight="bolder" x="60" y="180">Blue is bolder</text> + </g> + <g font-weight="bold" fill="blue"> + <text font-weight="lighter" x="60" y="230">Blue is lighter</text> + </g> + <g font-size="14"> + <text x="30" y="270">ZalamanderCaps is an OpenType font</text> + <text x="30" y="290">by Tim Ahrens of Just Another Foundry</text> + </g> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.1 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-intro-01-t-manual.svg b/testing/web-platform/tests/svg/import/text-intro-01-t-manual.svg new file mode 100644 index 000000000..6d28e0c5c --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-intro-01-t-manual.svg @@ -0,0 +1,95 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: text-intro-01-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#Introduction"> + <p> + Test left-to-right aspect of internationalized text. + </p> + <p> + Various text strings in various languages appear. The main + purpose of the test is to verify that the correct characters + appear and that they appear in the correct order and orientation, even + though the first choice font does not have the right glyphs. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Correct rendering requires that each character is rendered. It may be rendered + with the 'missing glyph' if no + glyphs are found in the fonts listed in the content, or in any fallback font + that is available. The first choice font + is a special SVG font that only contains the 'missing glyph'. Missing glyph from + other fonts may conformantly be used, however. + </p> + <p> + The test is passed if the lines of text appear as follows: + </p> + <ul> + <li>Polish: Mogę jeść szkło, i mi ...</li> + <li>Russian: Я могу есть стекло, ...</li> + <li>Greek: Μπορώ να φάω ...</li> + <li>Hebrew: אני יכול לאכול זכוכית ...</li> + <li>Yiddish: איך קען עסן גלאָז און ...</li> + <li>Chinese:我能吞下玻璃而不伤身体。</li> + <li>Japanese: 私はガラスを食べます。</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-intro-01-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <font id="Missy" horiz-adv-x="5"> + <font-face font-family="MissingInAction" font-weight="normal" font-style="normal" units-per-em="8" cap-height="8" x-height="4" ascent="8" descent="2" alphabetic="0" mathematical="4" ideographic="-2" hanging="8"/> + <missing-glyph d="M1,3h2v2h-2z"/> + </font> + </defs> + <text font-size="40" fill="blue" x="5" y="40">Test left-to-right text.</text> + <g font-size="17" font-family="MissingInAction, Georgia, 'Arial Hebrew', 'Arial Unicode MS', 'LucidaSansUnicode','MS-Gothic'"> + <text x="10" y="75">Polish: Mogę jeść szkło, i mi ...</text> + <text x="10" y="110">Russian: Я могу есть стекло, ...</text> + <text x="10" y="145" font-size="17">Greek: Μπορώ να φάω ...</text> + <text x="10" y="180">Hebrew: אני יכול לאכול זכוכית ... </text> + <text x="10" y="215">Yiddish: איך קען עסן גלאָז און ...</text> + </g> + <g font-size="17" font-family="MissingInAction, 'MS Song', SimHei,'LucidaSansUnicode', 'Arial Unicode MS'"> + <text x="10" y="250">Chinese:我能吞下玻璃而不伤身体。</text> + </g> + <g font-size="17" font-family="MissingInAction, 'MS-Gothic','LucidaSansUnicode', 'Arial Unicode MS'"> + <text x="10" y="285" font-size="17">Japanese: 私はガラスを食べます。</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-intro-02-b-manual.svg b/testing/web-platform/tests/svg/import/text-intro-02-b-manual.svg new file mode 100644 index 000000000..1b36814be --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-intro-02-b-manual.svg @@ -0,0 +1,81 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.10 $" testname="$RCSfile: text-intro-02-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#Introduction"> + <p> + Test various aspects of internationalized text, including + left-to-right, right-to-left, and the + following properties: 'writing-mode', + 'direction' and 'unicode-bidi'. + </p> + <p> + Various text strings in various languages appear. Ttest of bidi algorithms and support of 'unicode-bidi' and + 'direction' properties. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + This test requires installation of a system font that supports + the various international characters used in this test case. A + suitable font should be used by the SVG renderer if none of the + specified font families are available (or if they are available but do + not have the required glyphs). + </p> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the correct characters + appear and they appear in the correct order and orientation. + Ensure that the three lines with Hebrew are ordered + correctly, as shown in the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-intro-02-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-size="17" fill="blue" x="10" y="40">unicode-bidi="bidi-override" direction="ltr".</text> + <g font-size="18" font-family="'Arial Unicode MS', 'LucidaSansUnicode','MS-Gothic'"> + <text x="10" y="80" unicode-bidi="bidi-override" direction="ltr">Text "אני יכול לאכול זכוכית וזה לא מזיק לי" is in Hebrew</text> + </g> + <text font-size="17" fill="blue" x="10" y="140">unicode-bidi="bidi-override" direction="rtl".</text> + <g font-size="18" font-family="'Arial Unicode MS', 'LucidaSansUnicode','MS-Gothic'"> + <text x="10" y="180" unicode-bidi="bidi-override" direction="rtl" text-anchor="end">Text "אני יכול לאכול זכוכית וזה לא מזיק לי" is in Hebrew</text> + </g> + <text font-size="17" fill="blue" x="10" y="240">unicode-bidi="normal" direction="rtl".</text> + <g font-size="18" font-family="'Arial Unicode MS', 'LucidaSansUnicode','MS-Gothic'"> + <text x="10" y="280" unicode-bidi="normal" direction="rtl" text-anchor="end">Text "אני יכול לאכול זכוכית וזה לא מזיק לי" is in Hebrew</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.10 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-intro-03-b-manual.svg b/testing/web-platform/tests/svg/import/text-intro-03-b-manual.svg new file mode 100644 index 000000000..8b20a6511 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-intro-03-b-manual.svg @@ -0,0 +1,84 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: text-intro-03-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#Introduction"> + <p> + Test top-to-bottom internationalized text and the + following properties: 'writing-mode', + 'glyph-orientation-vertical', 'glyph-orientation-horizontal'. + </p> + <p> + Various text strings in various languages appear. The main + purpose of the test is to verify that the correct characters + appear and that they appear in the correct order and orientation. + Ensure that the two lines of + vertical Japanese text have the proper orientation + (test of 'glyph-orientation-vertical' property). + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + This test requires installation of a system font that supports + the various international characters used in this test case. A + suitable font should be used by the SVG renderer if none of the + specified font families are available (or if they are available but do + not have the required glyphs). To + minimize system dependencies, a future version of this test + might include all necessary glyphs as an SVG font. + </p> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if first line of text has the english text "Text" and + "in Chinese" rotated 270 degrees and the Chinese text displayed top to + bottom. The second line of text has the english text "Japanese:" rotated + 270 degrees and the Japanese text displayed top to bottom. The third + line of text has the letters in the english text "Japanese:" displayed + vertically and the Japanese text displayed top to bottom. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-intro-03-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-size="14" font-family="'Arial Unicode MS', 'LucidaSansUnicode','MS-Gothic'" writing-mode="tb"> + <text x="70" y="10">Text "我能吞下玻璃而不伤身体。" in Chinese</text> + <text x="230" y="10" font-size="13">Japanese: 私はガラスを食べられます。それは私を傷つけません。</text> + <text x="370" y="13" glyph-orientation-vertical="0" font-size="10">Japanese: 私はガラスを食べられます。それは私を傷つけません。</text> + <text x="120" y="80" font-size="32">xt "我能吞</text> + <text x="280" y="80" font-size="36">se: 私は</text> + <text x="420" y="80" glyph-orientation-vertical="0" font-size="32">se: 私は</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-intro-04-t-manual.svg b/testing/web-platform/tests/svg/import/text-intro-04-t-manual.svg new file mode 100644 index 000000000..565808ba6 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-intro-04-t-manual.svg @@ -0,0 +1,75 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: text-intro-04-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#Introduction"> + <p> + Test basic aspect of internationalized text. + </p> + <p> + Various text strings in various languages appear. The main + purpose of the test is to verify that the correct characters + appear and that they appear in the correct order and orientation. + </p> + <p> + A future version of this test + might include all necessary glyphs as an SVG font. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Correct rendering requires that each character is rendered. It is not required that a given character + be rendered with any particular font; just that it is rendered. + It may be rendered with the 'missing glyph' if no + glyphs are found in the fonts listed in the content, or in any fallback font that is available. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-intro-04-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-family="Arial" font-size="16" fill="blue" x="10" y="20">Test horizontal text.</text> + <g font-size="17" font-family="'Arial Hebrew', 'Arial Unicode MS', 'LucidaSansUnicode','MS-Gothic'"> + <text x="10" y="60">Polish: Mogę jeść szkło, i mi nie szkodzi.</text> + <text x="10" y="90">Russian: Я могу есть стекло, это мне не вредит.</text> + <text x="10" y="120" font-size="15">Greek: Μπορώ να φάω σπασμένα γυαλιά χωρίς να πάθω τίποτα.</text> + <!-- Greek and japanese smaller just to make it fit on the line --> + <text x="10" y="150">Text "אני יכול לאכול זכוכית וזה לא מזיק לי" is in Hebrew</text> + <text x="10" y="180">Yiddish: איך קען עסן גלאָז און עס טוט מיר נישט װײ.</text> + <text x="10" y="210">Chinese:我能吞下玻璃而不伤身体。</text> + <text x="10" y="240" font-size="15">Japanese: 私はガラスを食べられます。それは私を傷つけません。</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-intro-05-t-manual.svg b/testing/web-platform/tests/svg/import/text-intro-05-t-manual.svg new file mode 100644 index 000000000..9f23827cf --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-intro-05-t-manual.svg @@ -0,0 +1,67 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CL" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: text-intro-05-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#Introduction"> + <p> + Tests Arabic text using various platform fonts. If these fonts are not available, + a fallback font should be used that has Arabic glyphs. If such a font is not available, + the 'missing glyph' (typically an open rectangle) should be displayed. It is an error + to display the wrong Arabic glyphs, for example to display all isolate forms. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The text should be positioned such that the begining of the start of the + Arabic text is at very right of the test and runs towards the left of + the test border. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-intro-05-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18" direction="rtl"> + <text x="460" y="80" text-anchor="start" xml:lang="ar" font-size="30" font-family="Andalus">لماذا لا يتكلمون اللّغة العربية فحسب؟</text> + <!-- andalus font comes with Windows 2000 and XP --> + <text x="460" y="160" text-anchor="start" xml:lang="ar" font-size="36" font-family="'Diwani Letter'">لماذا لا يتكلمون اللّغة العربية فحسب؟</text> + <!-- Diwani fonts come with Microsoft Arabic fonts extension for Office XP +http://www.microsoft.com/downloads/details.aspx?FamilyID=A83C0E03-8913-47A3-ACB7-8AC357627620&displaylang=AR --> + <text x="460" y="240" text-anchor="start" xml:lang="ar" font-size="30" font-family="'Nafees Naskh'">لماذا لا يتكلمون اللّغة العربية فحسب؟</text> + <!-- Nafees Nastaleeq and Nafees Naskh are freely available from + the Center for Research in Urdu Language Processing (CRULP http://www.crulp.org ) + at the National University of Computer and Emerging Sciences, Pakistan + ( http://www.nu.edu.pk ) --> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-intro-06-t-manual.svg b/testing/web-platform/tests/svg/import/text-intro-06-t-manual.svg new file mode 100644 index 000000000..0e5ac1f92 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-intro-06-t-manual.svg @@ -0,0 +1,96 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AG" author="CL" status="accepted" + version="$Revision: 1.10 $" testname="$RCSfile: text-intro-06-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#Introduction"> + <p> + This test ensures that mandatory ligatures in Arabic are displayed. + This test uses WOFF fonts for rendering, with platform fonts for fallback. + </p> + <p> + There are two subtests. The first + requires an isolate lam-alef ligature and the second requires + a right-joining lam-alef ligature. + </p> + <p> + The first subtest has the word for 'tools', آلات + 0622: آ ARABIC LETTER ALEF WITH MADDA ABOVE + 0644: ل ARABIC LETTER LAM + 0627: ا ARABIC LETTER ALEF + 062A: ت ARABIC LETTER TEH + </p> + <p> + The second subtest has the word for 'three', ثلاثة + 062B: ث ARABIC LETTER THEH + 0644: ل ARABIC LETTER LAM + 0627: ا ARABIC LETTER ALEF + 062B: ث ARABIC LETTER THEH + 0629: ة ARABIC LETTER TEH MARBUTA + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if subtests are displayed as following: + </p> + <ul> + <li>The first subtest has the word for 'tools', آلات</li> + <li>The second subtest has the word for 'three', ثلاثة</li> + </ul> + <p>In the first subtest, there must be an isolate lam-alef ligature + and in the second subtest there must be a right-joining lam-alef + ligature, (so that them, lam and alef are all connected), as in the reference image. + </p> + <p>The precise glyph shapes will depend on which font was used for rendering, + and do not affect the pass criteria. Only the presence of the + mandatory ligatures is tested here.</p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-intro-06-t.svg,v $</title> + <style type="text/css"> + @font-face { + font-family: Scheherezade; + src: url(woffs/ScheherazadeRegOT.woff) format("woff") + } + </style> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-family="Kayrawan, Scheherezade, Andalus, Diwani Letter, serif" font-size="60" direction="rtl"> + <path d="M10,120 L470,120" stroke="#BBB" /> + <path d="M10,240 L470,240" stroke="#BBB" /> + <text text-anchor="middle" x="240" y="120" font-size="140" xml:lang="ar" fill="#700">آلات</text> + <text text-anchor="middle" x="240" y="240" font-size="140" xml:lang="ar" fill="#700">ثلاثة</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.10 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-intro-07-t-manual.svg b/testing/web-platform/tests/svg/import/text-intro-07-t-manual.svg new file mode 100644 index 000000000..f474aa99f --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-intro-07-t-manual.svg @@ -0,0 +1,65 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AG" author="CL" status="accepted" + version="$Revision: 1.2 $" testname="$RCSfile: text-intro-07-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#CharactersAndGlyphs"> + <p>This test ensures that mandatory ligatures in Arabic are displayed.</p> + <p> + There are two subtests. The first requires an isolate lam-alef ligature + and the second requires a right-joining lam-alef ligature. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p>Run the test. No interaction required.</p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if subtests are displayed as following: + </p> + <ul> + <li>The first subtest has the word for 'tools', آلات</li> + <li>The second subtest has the word for 'three', ثلاثة</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-intro-07-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <g font-family="Andalus,Diwani Letter,serif"> + <path d="M10,120 L470,120" stroke="#BBB" /> + <path d="M10,240 L470,240" stroke="#BBB" /> + <text text-anchor="middle" x="240" y="120" font-size="140" xml:lang="ar" fill="#700">آلات</text> + <text text-anchor="middle" x="240" y="240" font-size="140" xml:lang="ar" fill="#700">ثلاثة</text> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg>
\ No newline at end of file diff --git a/testing/web-platform/tests/svg/import/text-intro-09-b-manual.svg b/testing/web-platform/tests/svg/import/text-intro-09-b-manual.svg new file mode 100644 index 000000000..1a39e383c --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-intro-09-b-manual.svg @@ -0,0 +1,88 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: text-intro-09-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#Introduction"> + <p> + Test various aspects of internationalized text, including + left-to-right, right-to-left, and the + following properties: 'writing-mode', + 'direction' and 'unicode-bidi'. + </p> + <p> + Various text strings in various languages appear. Test of bidi algorithms and support of 'unicode-bidi' and + 'direction' properties. Uses Webfonts. + </p> + <p> + This test uses Webfonts; both SVG and WOFF fonts are provided. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. Make sure scripting is enabled. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the correct characters + appear and they appear in the correct order and orientation. + Ensure that the three lines with Hebrew are ordered + correctly, as shown in the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-intro-09-b.svg,v $</title> + <defs> + <style type="text/css"> + @font-face { + font-family: Ezra SIL SR; + src: url(woffs/EzraSILSR.woff) format("woff"); + } + </style> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + <font-face font-family="SVGHebrew" unicode-range="U+000D-FEFF"> + <font-face-src> + <font-face-uri xlink:href="../resources/Heb.svg#SVGHebrew"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-size="17" fill="blue" x="10" y="40">unicode-bidi="bidi-override" direction="ltr".</text> + <g font-size="18" font-family="SVGHebrew, 'Ezra SIL SR', serif"> + <text x="10" y="80" unicode-bidi="bidi-override" direction="ltr">Text "אני יכול לאכול זכוכית וזה לא מזיק לי" is in Hebrew</text> + </g> + <text font-size="17" fill="blue" x="10" y="140">unicode-bidi="bidi-override" direction="rtl".</text> + <g font-size="18" font-family="SVGHebrew, 'Ezra SIL SR', serif"> + <text x="10" y="180" unicode-bidi="bidi-override" direction="rtl" text-anchor="end">Text "אני יכול לאכול זכוכית וזה לא מזיק לי" is in Hebrew</text> + </g> + <text font-size="17" fill="blue" x="10" y="240">unicode-bidi="normal" direction="rtl".</text> + <g font-size="18" font-family="SVGHebrew, 'Ezra SIL SR', serif"> + <text x="10" y="280" unicode-bidi="normal" direction="rtl" text-anchor="end">Text "אני יכול לאכול זכוכית וזה לא מזיק לי" is in Hebrew</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-intro-10-f-manual.svg b/testing/web-platform/tests/svg/import/text-intro-10-f-manual.svg new file mode 100644 index 000000000..db0b0fb46 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-intro-10-f-manual.svg @@ -0,0 +1,70 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="" author="CL" status="created" + version="$Revision: 1.2 $" testname="$RCSfile: text-intro-10-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#Introduction"> + <p> + Tests Arabic text using various platform fonts. If these fonts are not available, + a fallback font should be used that has Arabic glyphs. If such a font is not available, + the 'missing glyph' (typically an open rectangle) should be displayed. It is an error + to display the wrong Arabic glyphs, for example to display all isolate forms. + </p> + <p>This test uses writing-mode and direction to set the text as right-to-left.</p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The text should be positioned such that the begining of the start of the + Arabic text is at very right of the test and runs towards the left of + the test border. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-intro-10-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g writing-mode="rl" direction="rtl"> + <text x="460" y="80" text-anchor="start" xml:lang="ar" font-size="30" font-family="Andalus">لماذا لا يتكلمون اللّغة العربية فحسب؟</text> + <!-- andalus font comes with Windows 2000 and XP --> + <text x="460" y="160" text-anchor="start" xml:lang="ar" font-size="36" font-family="'Diwani Letter'">لماذا لا يتكلمون اللّغة العربية فحسب؟</text> + <!-- Diwani fonts come with Microsoft Arabic fonts extension for Office XP +http://www.microsoft.com/downloads/details.aspx?FamilyID=A83C0E03-8913-47A3-ACB7-8AC357627620&displaylang=AR --> + <text x="460" y="240" text-anchor="start" xml:lang="ar" font-size="30" font-family="'Nafees Naskh'">لماذا لا يتكلمون اللّغة العربية فحسب؟</text> + <!-- Nafees Nastaleeq and Nafees Naskh are freely available from + the Center for Research in Urdu Language Processing (CRULP http://www.crulp.org ) + at the National University of Computer and Emerging Sciences, Pakistan + ( http://www.nu.edu.pk ) --> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-intro-11-t-manual.svg b/testing/web-platform/tests/svg/import/text-intro-11-t-manual.svg new file mode 100644 index 000000000..d754b7e3e --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-intro-11-t-manual.svg @@ -0,0 +1,94 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AG" author="CL" status="created" + version="$Revision: 1.2 $" testname="$RCSfile: text-intro-11-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#Introduction"> + <!-- derived from svg1.1 text-intro-06-t --> + <p> + This test ensures that mandatory ligatures in Arabic are displayed. + Three values for text-anchor are also tested; + middle, + start and + end. + This test uses platform fonts for rendering. + </p> + <p> + There are two subtests. The first + requires an isolate lam-alef ligature and the second requires + a right-joining lam-alef ligature. + </p> + <p> + The first subtest has the word for 'tools', آلات + 0622: آ ARABIC LETTER ALEF WITH MADDA ABOVE + 0644: ل ARABIC LETTER LAM + 0627: ا ARABIC LETTER ALEF + 062A: ت ARABIC LETTER TEH + </p> + <p> + The second subtest has the word for 'three', ثلاثة + 062B: ث ARABIC LETTER THEH + 0644: ل ARABIC LETTER LAM + 0627: ا ARABIC LETTER ALEF + 062B: ث ARABIC LETTER THEH + 0629: ة ARABIC LETTER TEH MARBUTA + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the blue glyphs آ and ث touch the first vertical + line. The second vertical line falls in middle of the brown glyphs + inbetween آلا and ت and inbetween ثلا and ثة. The black glyphs ت and ة + touch the last vertical line. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-intro-11-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-family="Andalus,Diwani Letter,serif" font-size="60"> + <path d="M120,10 L120,280" stroke="#BBB"/> + <path d="M240,10 L240,280" stroke="#BBB"/> + <path d="M360,10 L360,280" stroke="#BBB"/> + <path d="M10,120 L470,120" stroke="#BBB"/> + <path d="M10,240 L470,240" stroke="#BBB"/> + <text text-anchor="middle" x="240" y="120" xml:lang="ar" fill="#700">آلات</text> + <text text-anchor="start" x="360" y="120" xml:lang="ar">آلات</text> + <text text-anchor="end" x="120" y="120" xml:lang="ar" fill="#009">آلات</text> + <text text-anchor="middle" x="240" y="240" xml:lang="ar" fill="#700">ثلاثة</text> + <text text-anchor="start" x="360" y="240" xml:lang="ar">ثلاثة</text> + <text text-anchor="end" x="120" y="240" xml:lang="ar" fill="#009">ثلاثة</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-intro-12-t-manual.svg b/testing/web-platform/tests/svg/import/text-intro-12-t-manual.svg new file mode 100644 index 000000000..0d0902f82 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-intro-12-t-manual.svg @@ -0,0 +1,93 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="" author="CL" status="created" + version="$Revision: 1.3 $" testname="$RCSfile: text-intro-12-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#Introduction"> + <p> + This test ensures that mandatory ligatures in Arabic are displayed. + This test uses downloaded WOFF fonts for rendering. + </p> + <p> + There are two subtests. The first + requires an isolate lam-alef ligature and the second requires + a right-joining lam-alef ligature. + </p> + <p> + The first subtest has the word for 'tools', آلات + 0622: آ ARABIC LETTER ALEF WITH MADDA ABOVE + 0644: ل ARABIC LETTER LAM + 0627: ا ARABIC LETTER ALEF + 062A: ت ARABIC LETTER TEH + </p> + <p> + The second subtest has the word for 'three', ثلاثة + 062B: ث ARABIC LETTER THEH + 0644: ل ARABIC LETTER LAM + 0627: ا ARABIC LETTER ALEF + 062B: ث ARABIC LETTER THEH + 0629: ة ARABIC LETTER TEH MARBUTA + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if subtests are displayed as following: + </p> + <ul> + <li>The first subtest has the word for 'tools', آلات</li> + <li>The second subtest has the word for 'three', ثلاثة</li> + </ul> + <p>In the first subtest, there must be an isolate lam-alef ligature + and in the second subtest there must be a right-joining lam-alef + ligature, as in the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-intro-12-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <style type="text/css"> + @font-face { + font-family: Scheherazade; + src: url(woffs/ScheherazadeRegOT.woff) format("woff"); + } + </style> + <g font-family="Scheherazade,serif" font-size="60" direction="rtl"> + <path d="M10,120 L470,120" stroke="#BBB" /> + <path d="M10,240 L470,240" stroke="#BBB" /> + <text text-anchor="middle" x="240" y="120" font-size="140" xml:lang="ar" fill="#700">آلات</text> + <text text-anchor="middle" x="240" y="240" font-size="140" xml:lang="ar" fill="#700">ثلاثة</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-path-01-b-manual.svg b/testing/web-platform/tests/svg/import/text-path-01-b-manual.svg new file mode 100644 index 000000000..a803ec17b --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-path-01-b-manual.svg @@ -0,0 +1,87 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AG" author="Shenxue Zhou" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: text-path-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#TextOnAPath"> + <p> + Test textPath element in combination with the tspan element. Properties + of the text on a path are changed using the tspan element. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. Make sure scripting is enabled. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + For this test to pass the rendered output must match the reference + image. The letters "Te" in first "Text on a path" sentence must be + colored pink and offset from the path in the y direction. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-path-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <path id="Path1" fill="none" stroke="blue" d="M199 89.3 C206.6 66.6 235.8 13.2 270 30.3 286.6 38.6 298.9 59.4 310 73.3 321.7 87.9 338.6 99 356 103.3 387.3 111.1 396.6 90.4 418 74.3"/> + <path id="Path2" fill="none" stroke="blue" d="M33.5 145.8 C41 123 70.3 69.7 104.5 86.8 121 95 133 116 144.5 129.8 156.2 144.4 173 155.5 190.5 159.8 221.8 167.6 231 146.9 252.5 130.8"/> + <path id="Path3" fill="none" stroke="blue" stroke-width="4" d="M113 233 L413 233 "/> + </defs> + <g id="text-on-path-01"> + <use xlink:href="#Path1" fill="none" stroke="blue"/> + <text font-size="36" font-family="Georgia" fill="black"> + <textPath xlink:href="#Path1">Text on a path</textPath> + </text> + </g> + <g id="text-on-path-02"> + <!-- using tspan to change text color and position --> + <use xlink:href="#Path2" fill="none" stroke="blue"/> + <text font-size="36" font-family="Georgia" fill="black"> + <textPath xlink:href="#Path2"> + <tspan dy="-12" fill="fuchsia">Te</tspan><tspan dy="12">x</tspan>t on a path + </textPath> + </text> + <rect x="17" y="169" width="274" height="41" fill="none" stroke="black"/> + <text x="19" y="185" font-size="20" font-family="Arial">'tspan' subelement inside </text> + <text x="19" y="207" font-size="20" font-family="Arial">the 'textPath' element.</text> + </g> + <g id="text-on-path-03"> + <use xlink:href="#Path3" fill="none" stroke="blue" stroke-width="4"/> + <text font-size="24" font-family="Arial" fill="black"> + <textPath xlink:href="#Path3" startOffset="33%">The Text on path</textPath> + </text> + <rect x="118" y="250" width="260" height="41" fill="none" stroke="black"/> + <text x="120" y="267" font-size="20" font-family="Arial">'startOffset' attribute of the</text> + <text x="120" y="287" font-size="20" font-family="Arial">'textPath' element.</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-path-02-b-manual.svg b/testing/web-platform/tests/svg/import/text-path-02-b-manual.svg new file mode 100644 index 000000000..3513226c2 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-path-02-b-manual.svg @@ -0,0 +1,101 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AG" author="ED" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: text-path-02-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html"> + <p> + This tests the <a>'textPath/startOffset'</a> with both negative and positive values, and + compares it to the case where a <a>'tspan/dx'</a> attribute is used with the same values. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. Make sure scripting is enabled. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + You should see four paths with text following each path. + The top two paths should show the text "Negative offset", and the bottom two paths should show the text + "Positive offset". + </p> + <p> + The test has passed if: + </p> + <ul> + <li>the top two paths show the text "Negative offset"</li> + <li>the bottom two paths show the text "Positive offset"</li> + <li>the text on the bottom two paths starts a bit along the path</li> + <li>the text on the top two paths starts close to where the path starts (the first character is allowed to be slightly off the path)</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-path-02-b.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII, FreeSansWoff, sans-serif" font-size="18"> + <defs> + <style type="text/css"> + @font-face { + font-family: FreeSansWoff; + src: url(woffs/FreeSans.woff) format("woff"); + } + </style> + <path id="Path1" fill="none" stroke="blue" d="M199 89.3 C206.6 66.6 235.8 13.2 270 30.3 286.6 38.6 298.9 59.4 310 73.3 321.7 87.9 338.6 99 356 103.3 387.3 111.1 396.6 90.4 418 74.3"/> + <path id="Path2" fill="none" stroke="blue" d="M33.5 145.8 C41 123 70.3 69.7 104.5 86.8 121 95 133 116 144.5 129.8 156.2 144.4 173 155.5 190.5 159.8 221.8 167.6 231 146.9 252.5 130.8"/> + </defs> + <g id="text-on-path-01"> + <use xlink:href="#Path1" fill="none" stroke="blue" /> + <text font-size="36" fill="black" > + <textPath xlink:href="#Path1"><tspan dx="-240">Positive offset Negative offset</tspan></textPath> + </text> + </g> + <g id="text-on-path-02"> + <use xlink:href="#Path2" fill="none" stroke="blue" /> + <text font-size="36" fill="black" > + <textPath xlink:href="#Path2" startOffset="-240">Positive offset Negative offset</textPath> + </text> + </g> + <g transform="translate(0 150)"> + <g id="text-on-path-03"> + <use xlink:href="#Path1" fill="none" stroke="blue" /> + <text font-size="36" fill="black" > + <textPath xlink:href="#Path1"><tspan dx="60">Positive offset Negative offset</tspan></textPath> + </text> + </g> + <g id="text-on-path-04"> + <use xlink:href="#Path2" fill="none" stroke="blue" /> + <text font-size="36" fill="black" > + <textPath xlink:href="#Path2" startOffset="60">Positive offset Negative offset</textPath> + </text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-spacing-01-b-manual.svg b/testing/web-platform/tests/svg/import/text-spacing-01-b-manual.svg new file mode 100644 index 000000000..e90dfcab7 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-spacing-01-b-manual.svg @@ -0,0 +1,79 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 80 60" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: text-spacing-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#SpacingProperties"> + <p> + Test properties 'letter-spacing' and 'word-spacing' + </p> + <p> + The first three lines test property 'letter-spacing', with + values 0, -1 and .3em respectively. + </p> + <p> + The next three lines test property 'word-spacing', with + values 0, -3 and 3em respectively. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + This test is passed if: + </p> + <ul> + <li> + The first three lines of text have the letters in the word + "letter-spacing" spaced according to the values 0, -1 and 0.3em + respectively. + </li> + <li> + The last three lines of text have the words in the sentence + "Two Words" spaced according to the values 0, -3 and 3em respectively. + </li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-spacing-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-family="Arial" font-size="8"> + <text x="3" y="8"> letter-spacing:0 </text> + <text x="3" y="16" letter-spacing="-1">letter-spacing:-1</text> + <text x="3" y="24" letter-spacing=".3">letter-spacing:.3</text> + <text x="3" y="33">ws:0 - Two Words</text> + <text x="3" y="41" word-spacing="-3">ws:-3 - Two Words</text> + <text x="3" y="49" word-spacing="3">ws:3 - Two Words</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="6"> + <text id="revision" x="10" y="57" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="78" height="58" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-text-01-b-manual.svg b/testing/web-platform/tests/svg/import/text-text-01-b-manual.svg new file mode 100644 index 000000000..19eccf766 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-text-01-b-manual.svg @@ -0,0 +1,208 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 160 120" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Lofton Henderson" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: text-text-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#TextElement"> + <p> + Test viewer capibility to handle basic use of 'textLength' + and 'lengthAdjust' attributes. + </p> + <p> + There are four pairs of sub-tests. Each pair of sub-tests consists + of the same two strings: "Line to Stretch" on the left, and "this is + a line to squeeze" on the right. + </p> + <p> + The first (topmost) pair contains no occurrences of the textLength and + lengthAdjust attributes in the 'text' elements. + The pink reference line under each of the top + two strings indicates the approximate length of the strings. Since + the lengths are not constrained by the 'textLength' attribute, small + variations of the lengths are permissible. + </p> + <p> + The remaining three pairs each applies 'textLength' attributes to the + strings. In the leftmost sub-test of each pair, the 'textLength' value + will cause a stretching of the string of approximately 25% over the + "normal" length. In the rightmost sub-test of each pair, the 'textLength' value + will cause a squeezing of the string of approximately 20% under the + "normal" length for the string. + </p> + <p> + In each of the sub-tests with an application of 'textLength', the + pink reference lines indicate the exact extent of the rendered text. + The rendered text should fit snugly just within the ticks at the end of + the pink lines. + </p> + <p> + The second pair from the top contains 'textLength' but no 'lengthAdjust' + attributes. In this case, the effect should be as if the value "spacing" + were specified. Only the inter-character advancement and inter-word spacing + should change. The aspect ratio of the glyphs should be unaffected. The + reference image illustrates one valid way to achieve this, by a + uniform increase or decrease of inter-character advancement. + </p> + <p> + The third pair from the top explicitly sets 'lengthAdjust' value + to "spacing". Therefore it should be rendered identically to the second pair. + </p> + <p> + The fourth (bottommost) sub-test pair explicitly sets 'lengthAdjust' value + to "spacingAndGlyphs". The advancements between characters and words, as well as + the glyph aspect ratios should be affected. + The reference image illustrates one valid way to achieve + this, by a uniform expansion or compression of the string as a whole. + This effect is equivalent to application of a "scale(xfactor, 1.0)" transformation + to the 'text' elements. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The rendered picture should match the reference image, except as noted in the Test Description. + In particular, the 'textLength' constraint must be satisfied precisely, + and the basic rules associated with the "spacing" and "spacingAndGlyphs" values + of 'lengthAdjust' must be met, but the precise algorithm for meeting all + of the required contraints is otherwise unspecified. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-text-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x="14" y="10" font-size="10" fill="black">Basic test of 'textLength' </text> + <text x="10" y="20" font-size="10" fill="black">and 'lengthAdjust' attributes.</text> + <!-- Test cases 1&2: all defaults --> + <g id="test-1-2"> + <!-- The text lines --> + <g font-size="8" fill="blue"> + <text x="3" y="30">Line to Stretch</text> + <text x="75" y="30">this is a line to squeeze</text> + </g> + <!-- Length reference lines --> + <!-- (half ticks here only, as these lengths can validly vary slightly) --> + <g stroke="fuchsia"> + <line x1="2" y1="32" x2="56" y2="32"/> + <!-- <line x1="39" y1="70" x2="39" y2="84" /> --> + <line x1="2" y1="32" x2="2" y2="36"/> + <!-- <line x1="145" y1="70" x2="145" y2="84" /> --> + <line x1="56" y1="32" x2="56" y2="36"/> + <line x1="74" y1="32" x2="158" y2="32"/> + <!-- <line x1="244" y1="70" x2="244" y2="84" /> --> + <line x1="74" y1="32" x2="74" y2="36"/> + <!-- <line x1="412" y1="70" x2="412" y2="84" /> --> + <line x1="158" y1="32" x2="158" y2="36"/> + </g> + <!-- Labels --> + <g font-size="6" fill="black"> + <text x="6" y="38">textLength: default</text> + <text x="6" y="44">lengthAdjust: default</text> + <text x="76" y="38">textLength: default</text> + <text x="76" y="44">lengthAdjust: default</text> + </g> + </g> + <!-- Test cases 3&4: define textLength, default lengthAdjust--> + <g id="test-3-4" transform="translate(0,22)"> + <!-- The text lines --> + <g font-size="8" fill="blue"> + <text x="3" y="30" textLength="65">Line to Stretch</text> + <text x="75" y="30" textLength="65">this is a line to squeeze</text> + </g> + <!-- Length reference lines --> + <g stroke="fuchsia"> + <line x1="2" y1="32" x2="69" y2="32"/> + <line x1="2" y1="32" x2="2" y2="36"/> + <line x1="69" y1="32" x2="69" y2="36"/> + <line x1="74" y1="32" x2="141" y2="32"/> + <line x1="74" y1="32" x2="74" y2="36"/> + <line x1="141" y1="32" x2="141" y2="36"/> + </g> + <!-- Labels --> + <g font-size="6" fill="black"> + <text x="6" y="38">textLength: 25% longer</text> + <text x="6" y="44">lengthAdjust: default</text> + <text x="76" y="38">textLength: 15% shorter</text> + <text x="76" y="44">lengthAdjust: default</text> + </g> + </g> + <!-- Test cases 5&6: define textLength, lengthAdjust=spacing --> + <g id="test-5-6" transform="translate(0,44)"> + <!-- The text lines --> + <g font-size="8" fill="blue"> + <text x="3" y="30" textLength="65" lengthAdjust="spacing">Line to Stretch</text> + <text x="75" y="30" textLength="65" lengthAdjust="spacing">this is a line to squeeze</text> + </g> + <!-- Length reference lines --> + <g stroke="fuchsia"> + <line x1="2" y1="32" x2="69" y2="32"/> + <line x1="2" y1="32" x2="2" y2="36"/> + <line x1="69" y1="32" x2="69" y2="36"/> + <line x1="74" y1="32" x2="141" y2="32"/> + <line x1="74" y1="32" x2="74" y2="36"/> + <line x1="141" y1="32" x2="141" y2="36"/> + </g> + <!-- Labels --> + <g font-size="6" fill="black"> + <text x="3" y="38">textLength: 25% longer</text> + <text x="3" y="44">lengthAdjust: spacing</text> + <text x="76" y="38">textLength: 15% shorter</text> + <text x="76" y="44">lengthAdjust: spacing</text> + </g> + </g> + <!-- Test cases 7&8: define textLength, lengthAdjust=spacingAndGlyphs --> + <g id="test-7-8" transform="translate(0,66)"> + <!-- The text lines --> + <g font-size="8" fill="blue"> + <text x="3" y="30" textLength="65" lengthAdjust="spacingAndGlyphs">Line to Stretch</text> + <text x="75" y="30" textLength="65" lengthAdjust="spacingAndGlyphs">this is a line to squeeze</text> + </g> + <!-- Length reference lines --> + <g stroke="fuchsia"> + <line x1="2" y1="32" x2="69" y2="32"/> + <line x1="2" y1="32" x2="2" y2="36"/> + <line x1="69" y1="32" x2="69" y2="36"/> + <line x1="74" y1="32" x2="141" y2="32"/> + <line x1="74" y1="32" x2="74" y2="36"/> + <line x1="141" y1="32" x2="141" y2="36"/> + </g> + <!-- Labels --> + <g font-size="6" fill="black"> + <text x="6" y="38">textLength: 25% longer</text> + <text x="6" y="44">lengthAdjust: sAG</text> + <text x="76" y="38">textLength: 20% shorter</text> + <text x="76" y="44">lengthAdjust: sAG</text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="8"> + <text id="revision" x="10" y="117" stroke="none" fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="158" height="118" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-text-03-b-manual.svg b/testing/web-platform/tests/svg/import/text-text-03-b-manual.svg new file mode 100644 index 000000000..5f8617b7c --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-text-03-b-manual.svg @@ -0,0 +1,94 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Shenxue Zhou" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: text-text-03-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#TextElement"> + <p> + Test text element, tspan element and various text decorations + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if: + </p> + <ul> + <li>the word "Plain" is displayed using a blue serif font</li> + <li>the word "Italic" is displayed using a blue italic serif font</li> + <li>the word "Bold" is displayed using a blue serif bold font</li> + <li>the words "Line through" are displayed with a line through, using a pink serif font</li> + <li>the word "Underline" is displayed underlined using a blue serif font</li> + <li>the words "Bold, italic and underlined" are displayed underlined using a bold italic serif font</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-text-03-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + <font-face font-family="FreeSerif" unicode-range="U+0-7F" font-weight="400"> + <font-face-src> + <font-face-uri xlink:href="../resources/FreeSerif.svg#FreeSerif"/> + </font-face-src> + </font-face> + <font-face font-family="FreeSerif" unicode-range="U+0-7F" font-weight="700"> + <font-face-src> + <font-face-uri xlink:href="../resources/FreeSerifBold.svg#FreeSerifBold"/> + </font-face-src> + </font-face> + <font-face font-family="FreeSerif" unicode-range="U+0-7F" font-weight="400" font-style="italic"> + <font-face-src> + <font-face-uri xlink:href="../resources/FreeSerifItalic.svg#FreeSerifItalic"/> + </font-face-src> + </font-face> + <font-face font-family="FreeSerif" unicode-range="U+0-7F" font-weight="700" font-style="italic"> + <font-face-src> + <font-face-uri xlink:href="../resources/FreeSerifBoldItalic.svg#FreeSerifBoldItalic"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="FreeSerif, serif" font-size="18"> + <text x="19" y="61" font-size="32" fill="blue">Plain</text> + <text x="142" y="61" font-size="32" font-style="italic" fill="blue">Italic</text> + <text x="257" y="60" font-size="32" font-weight="bold" fill="blue">Bold</text> + <text x="224" y="110" font-size="32" fill="blue" text-decoration="underline">Underline</text> + <text x="39" y="147" font-size="32" fill="fuchsia" text-decoration="line-through">Line through</text> + <text x="1" y="200" font-size="32" font-style="italic" font-weight="bold" fill="black" text-decoration="underline">Bold, italic and underlined</text> + <g> + <rect x="50" y="225" width="380" height="64" fill="none" stroke="black" stroke-width="2"/> + <g font-family="SVGFreeSansASCII,sans-serif"> + <text x="55" y="245" font-size="24" fill="black">Each line of text which flows in a </text> + <text x="55" y="265" font-size="24" fill="black">rectangular box has to be broken</text> + <text x="55" y="285" font-size="24" fill="black">into separated lines.</text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-text-04-t-manual.svg b/testing/web-platform/tests/svg/import/text-text-04-t-manual.svg new file mode 100644 index 000000000..aeeb716f2 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-text-04-t-manual.svg @@ -0,0 +1,226 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AE" author="VH" status="accepted" + version="$Revision: 1.12 $" testname="$RCSfile: text-text-04-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#TextElement"> + <p> + The purpose of this test is to validate proper handling of + the text element's x and y attributes. + In the various samples, a orange marker shows the text's (0,0) + coordinate. The blue markers show the current text positions. + These are either defined by absolute x/y positioning or they + are computed from the embeded font's glyphs advances. + </p> + <p> + The first text sample shows a reference piece of text. + </p> + <p> + The second text sample (x all) shows a piece of text where + all the glyphs are positioned along the x axis. + </p> + <p> + The third text sample (x more) is a text element where there + are more x values than characters (5 values for 4 characters). + The last x value should be ignored and the result should + be the same as the third sample. + </p> + <p> + The fourth text sample (x fewer) is a text element where there + are fewer x values than characters (3 values for 4 characters). + The last character should not be positioned but laid out normally, + following its previous character sibling. + </p> + <p> + The fifth (y all), sixth (y more) and seventh (y fewer) text sample + parallel the second, + third and fourth test, but for the y attribute values. + </p> + <p> + The samples in the right column show combinations of x/y + value sets. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + In all the above tests, blue markers represent the expected glyph + positions. The orange markers are showing positions where no glyph + should appear. The glyphs are black squares of increasing sizes. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-text-04-t.svg,v $</title> + <style type="text/css"> + @font-face { + font-family: embeded; + src: url(woffs/embeded-text-text-04.woff) format("woff"); + } + </style> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + <font id="embeded" horiz-adv-x="224"> + <font-face font-family="embeded" units-per-em="1000" ascent="1000" descent="-250" alphabetic="0"/> + <missing-glyph horiz-adv-x="800" d="M50 0V800H750V0H50ZM700 50V750H100V50H700Z"/> + <glyph unicode="1" glyph-name="gl_1" horiz-adv-x="750" d="M 0 0 L 250 0 L 250 250 L 0 250 Z"/> + <glyph unicode="2" glyph-name="gl_2" horiz-adv-x="750" d="M 0 0 L 500 0 L 500 500 L 0 500 Z"/> + <glyph unicode="3" glyph-name="gl_3" horiz-adv-x="750" d="M 0 0 L 750 0 L 750 750 L 0 750 Z"/> + <glyph unicode="4" glyph-name="gl_4" horiz-adv-x="750" d="M 0 0 L 1000 0 L 1000 1000 L 0 1000 Z"/> + </font> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g font-size="16"> + <g id="reference" transform="translate(130, 40)"> + <text text-anchor="end" x="-30">Reference</text> + <g> + <use xlink:href="#marker" x="0" fill="#8888FF"/> + <use xlink:href="#marker" x="15" fill="#8888FF"/> + <use xlink:href="#marker" x="30" fill="#8888FF"/> + <use xlink:href="#marker" x="45" fill="#8888FF"/> + <text id="ref" font-family="embeded" font-size="20">1234</text> + </g> + </g> + <defs> + <rect id="marker" x="-4" y="-4" width="8" height="8"/> + </defs> + <g id="xAll" transform="translate(130, 80)"> + <text text-anchor="end" x="-30">x all</text> + <use xlink:href="#marker" x="0" fill="orange"/> + <use xlink:href="#marker" x="20" fill="#8888FF"/> + <use xlink:href="#marker" x="40" fill="#8888FF"/> + <use xlink:href="#marker" x="60" fill="#8888FF"/> + <use xlink:href="#marker" x="80" fill="#8888FF"/> + <text font-family="embeded" font-size="20" x="20 40 60 80">1234</text> + </g> + + <g id="xMore" transform="translate(130, 120)"> + <text text-anchor="end" x="-30">x more</text> + <use xlink:href="#marker" x="0" fill="orange"/> + <use xlink:href="#marker" x="20" fill="#8888FF"/> + <use xlink:href="#marker" x="40" fill="#8888FF"/> + <use xlink:href="#marker" x="60" fill="#8888FF"/> + <use xlink:href="#marker" x="80" fill="#8888FF"/> + <use xlink:href="#marker" x="100" fill="orange"/> + <text font-family="embeded" font-size="20" x="20 40 60 80 100">1234</text> + </g> + + <g id="xFewer" transform="translate(130, 160)"> + <text text-anchor="end" x="-30">x fewer</text> + <use xlink:href="#marker" x="0" fill="orange"/> + <use xlink:href="#marker" x="20" fill="#8888FF"/> + <use xlink:href="#marker" x="40" fill="#8888FF"/> + <use xlink:href="#marker" x="60" fill="#8888FF"/> + <use xlink:href="#marker" x="75" fill="#8888FF"/> + <text font-family="embeded" font-size="20" x="20 40 60">1234</text> + </g> + + <g id="yAll" transform="translate(130, 200)"> + <text text-anchor="end" x="-30">y all</text> + <use xlink:href="#marker" x="0" y="-10" fill="#8888FF"/> + <use xlink:href="#marker" x="15" y="-5" fill="#8888FF"/> + <use xlink:href="#marker" x="30" y="5" fill="#8888FF"/> + <use xlink:href="#marker" x="45" y="10" fill="#8888FF"/> + <text font-family="embeded" font-size="20" y="-10 -5 5 10">1234</text> + </g> + + <g id="yMore" transform="translate(130, 250)"> + <text text-anchor="end" x="-30">y more</text> + <use xlink:href="#marker" x="0" y="-10" fill="#8888FF"/> + <use xlink:href="#marker" x="15" y="-5" fill="#8888FF"/> + <use xlink:href="#marker" x="30" y="5" fill="#8888FF"/> + <use xlink:href="#marker" x="45" y="10" fill="#8888FF"/> + <text font-family="embeded" font-size="20" y="-10 -5 5 10 20">1234</text> + </g> + + <g id="yFewer" transform="translate(130, 300)"> + <text text-anchor="end" x="-30">y fewer</text> + <use xlink:href="#marker" x="0" y="-10" fill="#8888FF"/> + <use xlink:href="#marker" x="15" y="-5" fill="#8888FF"/> + <use xlink:href="#marker" x="30" y="5" fill="#8888FF"/> + <use xlink:href="#marker" x="45" y="5" fill="#8888FF"/> + <text font-family="embeded" font-size="20" y="-10 -5 5">1234</text> + </g> + + <g transform="translate(220, 0)"> + <g id="xyAll" transform="translate(130, 80)"> + <text text-anchor="end" x="-30">x/y all</text> + <use xlink:href="#marker" x="0" fill="orange"/> + <use xlink:href="#marker" x="20" y="-10" fill="#8888FF"/> + <use xlink:href="#marker" x="40" y="-5" fill="#8888FF"/> + <use xlink:href="#marker" x="60" y="5" fill="#8888FF"/> + <use xlink:href="#marker" x="80" y="10" fill="#8888FF"/> + <text font-family="embeded" font-size="20" x="20 40 60 80" y="-10 -5 5 10">1234</text> + </g> + + <g id="xyMore" transform="translate(130, 120)"> + <text text-anchor="end" x="-30">x/y more</text> + <use xlink:href="#marker" x="0" fill="orange"/> + <use xlink:href="#marker" x="20" y="-10" fill="#8888FF"/> + <use xlink:href="#marker" x="40" y="-5" fill="#8888FF"/> + <use xlink:href="#marker" x="60" y="5" fill="#8888FF"/> + <use xlink:href="#marker" x="80" y="10" fill="#8888FF"/> + <use xlink:href="#marker" x="100" y="20" fill="orange"/> + <text font-family="embeded" font-size="20" x="20 40 60 80 100" y="-10 -5 5 10 20">1234</text> + </g> + + <g id="xyFewer" transform="translate(130, 160)"> + <text text-anchor="end" x="-30">x/y fewer</text> + <use xlink:href="#marker" x="0" fill="orange"/> + <use xlink:href="#marker" x="20" y="-10" fill="#8888FF"/> + <use xlink:href="#marker" x="40" y="-5" fill="#8888FF"/> + <use xlink:href="#marker" x="60" y="5" fill="#8888FF"/> + <use xlink:href="#marker" x="75" y="5" fill="#8888FF"/> + <text font-family="embeded" font-size="20" x="20 40 60" y="-10 -5 5">1234</text> + </g> + + <g id="xAllyFewer" transform="translate(130, 200)"> + <text text-anchor="end" x="-30">x all y fewer</text> + <use xlink:href="#marker" x="0" fill="orange"/> + <use xlink:href="#marker" x="20" y="-10" fill="#8888FF"/> + <use xlink:href="#marker" x="40" y="-5" fill="#8888FF"/> + <use xlink:href="#marker" x="60" y="5" fill="#8888FF"/> + <use xlink:href="#marker" x="80" y="5" fill="#8888FF"/> + <text font-family="embeded" font-size="20" x="20 40 60 80" y="-10 -5 5">1234</text> + </g> + + <g id="xFewerYall" transform="translate(130, 240)"> + <text text-anchor="end" x="-30">x fewer y all</text> + <use xlink:href="#marker" x="0" fill="orange"/> + <use xlink:href="#marker" x="20" y="-10" fill="#8888FF"/> + <use xlink:href="#marker" x="40" y="-5" fill="#8888FF"/> + <use xlink:href="#marker" x="60" y="5" fill="#8888FF"/> + <use xlink:href="#marker" x="77.52" y="10" fill="#8888FF"/> + <text font-family="embeded" font-size="20" x="20 40 60" y="-10 -5 5 10">1234</text> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.12 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-text-05-t-manual.svg b/testing/web-platform/tests/svg/import/text-text-05-t-manual.svg new file mode 100644 index 000000000..82affeaca --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-text-05-t-manual.svg @@ -0,0 +1,174 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="VH" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: text-text-05-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#TextElement"> + <p> + The purpose of this test is to validate the interaction of text-anchor + and x/y glyph positioning. + </p> + <p> + Each row shows a different combination of x/y values: 1, more than characters, + fewer than characters. This tests the anchor value: start. + </p> + <p> + The blue markers show the various x/y absolute positions around which text + chunks should be anchored. The glyphs are black squares of increasing sizes. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Rendered output must match the reference image for the test to pass. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-text-05-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <style type="text/css"> + @font-face { + font-family: embeded; + src: url(woffs/embeded-text-text-05.woff) format("woff"); + } + </style> + <g font-size="16"> + <defs> + <font id="embeded" horiz-adv-x="224"> + <font-face font-family="embeded" units-per-em="1000" panose-1="0 0 0 0 0 0 0 0 0 0" ascent="917" descent="-250" alphabetic="0"/> + <missing-glyph horiz-adv-x="800" d="M50 0V800H750V0H50ZM700 50V750H100V50H700Z"/> + <glyph unicode="1" glyph-name="gl_1" horiz-adv-x="1500" d="M 0 0 L 250 0 L 250 250 L 0 250 Z"/> + <glyph unicode="2" glyph-name="gl_2" horiz-adv-x="1500" d="M 0 0 L 500 0 L 500 500 L 0 500 Z"/> + <glyph unicode="3" glyph-name="gl_3" horiz-adv-x="1500" d="M 0 0 L 750 0 L 750 750 L 0 750 Z"/> + <glyph unicode="4" glyph-name="gl_4" horiz-adv-x="1500" d="M 0 0 L 1000 0 L 1000 1000 L 0 1000 Z"/> + </font> + + </defs> + + <defs> + <g id="marker"> + <line y2="-15" stroke="fuchsia"/> + <rect x="-4" y="-4" width="8" height="8"/> + </g> + </defs> + + <g id="legend" transform="translate(10, 40)"> + <text y="30">1.x 1.y</text> + <text y="60">4.x 1.y</text> + <text y="90">2.x 1.y</text> + <text y="120">1.x 4.y</text> + <text y="150">4.x 4.y</text> + <text y="180">2.x 4.y</text> + <text y="210">1.x 2.y</text> + <text y="240">4.x 2.y</text> + <text y="270">2.x 2.y</text> + </g> + + <g id="anchorStart" text-anchor="start" transform="translate(150, 40)"> + <text y="-17" text-anchor="middle">text-anchor</text> + <text y="-3" text-anchor="middle">start</text> + <line x1="0" y1="10" x2="0" y2="290" stroke="fuchsia"/> + + <g id="textContent"> + <!-- 1.x 1.y --> + <use y="30" xlink:href="#marker" fill="#8888ff"/> + <text x="0" y="30" font-family="embeded" font-size="10">1234</text> + + <!-- 4.x 1.y : four text chunks --> + <use x="10" y="60" xlink:href="#marker" fill="#8888ff"/> + <use x="20" y="60" xlink:href="#marker" fill="#8888ff"/> + <use x="30" y="60" xlink:href="#marker" fill="#8888ff"/> + <use x="40" y="60" xlink:href="#marker" fill="#8888ff"/> + <text x="10 20 30 40" y="60" font-family="embeded" font-size="10">1234</text> + + <!-- 2.x 1.y : two text chunks --> + <use x="10" y="90" xlink:href="#marker" fill="#8888ff"/> + <use x="60" y="90" xlink:href="#marker" fill="#8888ff"/> + <text x="10 60" y="90" font-family="embeded" font-size="10">1234</text> + + <!-- 1.x 4.y : four text chunks --> + <g transform="translate(0, 120)"> + <use x="0" y="-10" xlink:href="#marker" fill="#8888ff"/> + <use x="15" y="-5" xlink:href="#marker" fill="#8888ff"/> + <use x="30" y="5" xlink:href="#marker" fill="#8888ff"/> + <use x="45" y="10" xlink:href="#marker" fill="#8888ff"/> + <text x="0" y="-10 -5 5 10" font-family="embeded" font-size="10">1234</text> + </g> + + <!-- 4.x 4.y : four text chunks --> + <g transform="translate(0, 150)"> + <use x="10" y="-10" xlink:href="#marker" fill="#8888ff"/> + <use x="20" y="-5" xlink:href="#marker" fill="#8888ff"/> + <use x="30" y="5" xlink:href="#marker" fill="#8888ff"/> + <use x="40" y="10" xlink:href="#marker" fill="#8888ff"/> + <text x="10 20 30 40" y="-10 -5 5 10" font-family="embeded" font-size="10">1234</text> + </g> + + <!-- 2.x 4.y : four text chunks --> + <g transform="translate(0, 180)"> + <use x="10" y="-10" xlink:href="#marker" fill="#8888ff"/> + <use x="20" y="-5" xlink:href="#marker" fill="#8888ff"/> + <use x="35" y="5" xlink:href="#marker" fill="#8888ff"/> + <use x="50" y="10" xlink:href="#marker" fill="#8888ff"/> + <text x="10 20" y="-10 -5 5 10" font-family="embeded" font-size="10">1234</text> + </g> + + <!-- 1.x 2.y : two text chunks --> + <g transform="translate(0, 210)"> + <use x="0" y="-10" xlink:href="#marker" fill="#8888ff"/> + <use x="15" y="5" xlink:href="#marker" fill="#8888ff"/> + <text x="0" y="-10 5" font-family="embeded" font-size="10">1234</text> + </g> + + <!-- 4.x 2.y : four text chunks --> + <g transform="translate(0, 240)"> + <use x="10" y="-10" xlink:href="#marker" fill="#8888ff"/> + <use x="20" y="-5" xlink:href="#marker" fill="#8888ff"/> + <use x="30" y="-5" xlink:href="#marker" fill="#8888ff"/> + <use x="40" y="-5" xlink:href="#marker" fill="#8888ff"/> + <text x="10 20 30 40" y="-10 -5" font-family="embeded" font-size="10">1234</text> + </g> + + <!-- 2.x 2.y : two text chunks --> + <g transform="translate(0, 270)"> + <use x="10" y="-10" xlink:href="#marker" fill="#8888ff"/> + <use x="60" y="-5" xlink:href="#marker" fill="#8888ff"/> + <text x="10 60" y="-10 -5" font-family="embeded" font-size="10">1234</text> + </g> + + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-text-06-t-manual.svg b/testing/web-platform/tests/svg/import/text-text-06-t-manual.svg new file mode 100644 index 000000000..abefbc57c --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-text-06-t-manual.svg @@ -0,0 +1,152 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AE" author="VH" status="accepted" + version="$Revision: 1.9 $" testname="$RCSfile: text-text-06-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#TextElement"> + <p> + The purpose of this test is to validate the interaction of x/y + glyph positioning and ligatures. + </p> + <p> + The first line shows an example where there is a ligature (fi) which + should be accounted for before breaking into text chunks (see specification + section 10.5, additional x/y/dx/dy processing rules, bullet discussing + ligatures). In this first line, the ligatures cause the x position 180 + (shown in orange), to be ignored. As a result, a glyph should be shown over + each pale blue square markers. The glyphs are black squares of increasing sizes + except for the initial ligature which has the form of two small black triangles + joined at their tops. The ligature should show on the first pale blue + marker position. + </p> + <p> + The second line shows the same test but using multiple y positions. + </p> + <p> + The third line shows the same test but using multiple x and y + positions. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if: + </p> + <ul> + <li> + The bottom left hand corners of the first row of black squares are + equal distance apart along the x axis and are centered inside the blue + squares. + </li> + <li> + The bottom left hand corners of the first row of black squares are + equal distance apart along the x and y axis and are centered inside + the blue squares. + </li> + <li> + The bottom left hand corners of the first row of black squares are + same distance apart in the x axis as the first row of squares and are + same distance apart in the y axis as the second row of squares. + </li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-text-06-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <style type="text/css"> + @font-face { + font-family: embeded; + src: url(woffs/embeded-text-text-06.woff) format("woff"); + } + </style> + <g font-size="10"> + <defs> + <font id="embeded" horiz-adv-x="224"> + <font-face font-family="embeded" units-per-em="1000" panose-1="0 0 0 0 0 0 0 0 0 0" ascent="917" descent="-250" alphabetic="0"/> + <missing-glyph horiz-adv-x="800" d="M50 0V800H750V0H50ZM700 50V750H100V50H700Z"/> + <glyph unicode="1" glyph-name="gl_1" horiz-adv-x="1500" d="M 0 0 L 250 0 L 250 250 L 0 250 Z"/> + <glyph unicode="2" glyph-name="gl_2" horiz-adv-x="1500" d="M 0 0 L 500 0 L 500 500 L 0 500 Z"/> + <glyph unicode="3" glyph-name="gl_3" horiz-adv-x="1500" d="M 0 0 L 750 0 L 750 750 L 0 750 Z"/> + <glyph unicode="4" glyph-name="gl_4" horiz-adv-x="1500" d="M 0 0 L 1000 0 L 1000 1000 L 0 1000 Z"/> + <glyph unicode="fi" glyph-name="fi" horiz-adv-x="1500" d="M 0 0 L 500 0 L 0 700 L 500 700 Z"/> + </font> + </defs> + + <defs> + <g id="marker"> + <line y2="-15" stroke="orange"/> + <rect x="-4" y="-4" width="8" height="8"/> + </g> + </defs> + + <g transform="translate(20, 30)"> + <g id="legend" transform="translate(10, 40)" font-size="12"> + <text>x positioning</text> + <text y="40">y positioning</text> + <text y="140">x/y positioning</text> + </g> + + <g transform="translate(100, 40)"> + <use xlink:href="#marker" x="10" fill="#8888ff"/> + <use xlink:href="#marker" x="180" fill="orange"/> + <use xlink:href="#marker" x="40" fill="#8888ff"/> + <use xlink:href="#marker" x="70" fill="#8888ff"/> + <use xlink:href="#marker" x="100" fill="#8888ff"/> + <use xlink:href="#marker" x="130" fill="#8888ff"/> + <text x="10 180 40 70 100 130" y="0" font-family="embeded">fi1234</text> + </g> + + <g transform="translate(100, 80)"> + <use xlink:href="#marker" y="-10" fill="#8888ff"/> + <use xlink:href="#marker" x="15" y="50" fill="orange"/> + <use xlink:href="#marker" x="15" y="0" fill="#8888ff"/> + <use xlink:href="#marker" x="30" y="10" fill="#8888ff"/> + <use xlink:href="#marker" x="45" y="20" fill="#8888ff"/> + <use xlink:href="#marker" x="60" y="30" fill="#8888ff"/> + <text y="-10 50 0 10 20 30" x="0" font-family="embeded">fi1234</text> + </g> + + <g transform="translate(100, 180)"> + <use xlink:href="#marker" x="10" y="-10" fill="#8888ff"/> + <use xlink:href="#marker" x="180" y="50" fill="orange"/> + <use xlink:href="#marker" x="40" y="0" fill="#8888ff"/> + <use xlink:href="#marker" x="70" y="10" fill="#8888ff"/> + <use xlink:href="#marker" x="100" y="20" fill="#8888ff"/> + <use xlink:href="#marker" x="130" y="30" fill="#8888ff"/> + <text x="10 180 40 70 100 130" y="-10 50 0 10 20 30" font-family="embeded">fi1234</text> + </g> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.9 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-text-07-t-manual.svg b/testing/web-platform/tests/svg/import/text-text-07-t-manual.svg new file mode 100644 index 000000000..a4ff44578 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-text-07-t-manual.svg @@ -0,0 +1,79 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AE" author="MI" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: text-text-07-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#TextElement"> + <p> + Tests multiple x, y, rotate, with various combinations. Since an + array of values is given, each glyph must use the value from the + corresponding character in the list. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if: + </p> + <ul> + <li> + Each letter in the word "ROTATE" is rotated 10 + degrees more than the previous letter, with the first letter being + rotated at 0 degrees. + </li> + <li> + Each letter in the word "Multi XY" (including the white space) is + shifted in the x and y by 20 pixels more (in user space) than the + previous letter, with the first letter beginning at coordinate + 240, 60. + </li> + <li> + Each letter in the word "Both Together" (including the space) is + rotated and shifted. Each of the rotated letters is rotated -10 + degrees more than the previous letter, with the first letter being + rotated a 0 degrees. Each of the shifted letters is shifted by 20 + pixels more than the previous letter in the x direction and -10 pixels + more than the previous letter in the y direction, with the first + letter beginning at the coordinate 10, 300. + </li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-text-07-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x="240 260 280 300 320 340 360" y="60 80 100 120 140 160 180 200" font-size="35">Multi X Y</text> + <text x="10" y="60" rotate="0 10 20 30 40 50 60" font-size="35">ROTATE</text> + <text x="10 30 50 70 90 110 130 150 170 190 210 230 250" y="300 290 280 270 260 250 240 230 220 210 200 190 180" rotate="0 -10 -20 -30 -40 -50 -60 -70 -80 -90 -100 -110 -120" font-size="35">Both Together</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-text-08-b-manual.svg b/testing/web-platform/tests/svg/import/text-text-08-b-manual.svg new file mode 100644 index 000000000..b3938c1d3 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-text-08-b-manual.svg @@ -0,0 +1,64 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="DJ" author="SH" status="accepted" + version="$Revision" testname="$RCSfile: text-text-08-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#TextElement"> + <p> + The three opacity properties (fill-opacity, + stroke-opacity, and opacity) of 'text' elements are + covered in this test. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if: + </p> + <ul> + <li>The text "Normal Text" has a pink stroke with no opacity and a blue fill with no opacity.</li> + <li>The text "Fill Opacity" has a pink stroke with no opacity and a blue fill with 50% opacity.</li> + <li>The text "Stroke Opacity" has a pink stroke with 50% opacity and a blue fill with no opacity.</li> + <li>The text "Opacity" has a pink stroke and a blue fill both with 50% opacity.</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-text-08-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x="19" y="60" font-size="64" font-family="Verdana" fill="blue" stroke="fuchsia" stroke-width="2">Normal Text</text> + <text x="19" y="120" font-size="64" font-family="Verdana" fill="blue" stroke="fuchsia" stroke-width="2" fill-opacity="0.50">Fill opacity</text> + <text x="19" y="180" font-size="64" font-family="Verdana" fill="blue" stroke="fuchsia" stroke-width="2" stroke-opacity="0.50">Stroke opacity</text> + <text x="19" y="240" font-size="64" font-family="Verdana" fill="blue" stroke="fuchsia" stroke-width="2" opacity="0.50">Opacity</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-text-09-t-manual.svg b/testing/web-platform/tests/svg/import/text-text-09-t-manual.svg new file mode 100644 index 000000000..41b5ee1db --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-text-09-t-manual.svg @@ -0,0 +1,83 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="AE" author="CL" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: text-text-09-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#TextElement"> + <p> + Tests multiple x, y, rotate, with various combinations. Since an + array of values is given, each glyph must use the value from the + corresponding character in the list. In this test, there are less values + in the array than there are characters. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if: + </p> + <ul> + <li> + In the word "ROTATE", each of the letters "ROTA" is rotated 10 + degrees more than the previous letter, with the first letter being + rotated at 0 degrees. The letters "TE" have the same 30 degree rotation. + </li> + <li> + The first 5 letters in the word "MultiXY" are shifted in the x and y + by 20 pixels more (in user space) than the previous letter, with the + first letter beginning at coordinate 240, 60. The letters 'X' and 'Y' + will have the same y coordinate as the letter 'i' in "Multi". + </li> + <li> + The first 10 letters (including the space) in the word "Both Together" + are rotated and shifted. Each of the rotated letters is rotated -10 + degrees more than the previous letter, with the first letter being + rotated a 0 degrees. Subsequent letters after the first 10 rotated at + -90 degrees. Each of the shifted letters is shifted by 20 pixels more + than the previous letter in the x direction and -10 pixels more than + the previous letter in the y direction, with the first letter + beginning at the coordinate 10, 300. Subsequent letters after the + first 10 will have the same y coordinate as the letter 't' is + "Together". + </li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-text-09-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text x="240 260 280 300" y="60 80 100 120 140" font-size="35">Multi X Y</text> + <text x="10" y="60" rotate="0 10 20 30" font-size="35">ROTATE</text> + <text x="10 30 50 70 90 110 130 150" y="300 290 280 270 260 250 240 230" rotate="0 -10 -20 -30 -40 -50 -60 -70 -80 -90" font-size="35">Both Together</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-text-10-t-manual.svg b/testing/web-platform/tests/svg/import/text-text-10-t-manual.svg new file mode 100644 index 000000000..57b0e1b9b --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-text-10-t-manual.svg @@ -0,0 +1,76 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="ED" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: text-text-10-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#TextElement"> + <p> + Test rendering of text rotated by a transform attribute. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if the image shows text rotated by various different angles, the result should closely match the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-text-10-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text transform="rotate(90) translate(120 -100)" text-anchor="middle">Rotated 90 degrees</text> + <text transform="rotate(-90) translate(-120 140)" text-anchor="middle">Rotated -90 degrees</text> + <text transform="rotate(180) translate(-120 -250)" text-anchor="middle">Rotated 180 degrees</text> + <text transform="rotate(360) translate(120 230)" text-anchor="middle">Unrotated text</text> + <text transform="translate(250 180) rotate(85 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(75 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(65 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(55 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(45 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(35 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(25 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(15 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(5 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(-5 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(-15 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(-25 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(-35 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(-45 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(-55 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(-65 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(-75 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(-85 0 0)">Rotated by 10 degrees</text> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-text-11-t-manual.svg b/testing/web-platform/tests/svg/import/text-text-11-t-manual.svg new file mode 100644 index 000000000..0316cbd75 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-text-11-t-manual.svg @@ -0,0 +1,81 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="ED" status="accepted" + version="$Revision: 1.3 $" testname="$RCSfile: text-text-11-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#TextElement"> + <p> + Test rendering of text rotated by a transform attribute, same as the text-text-10-t test but not using an SVGFont. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if the image shows text rotated by various different angles, the result should closely match the reference image, but note that the font is allowed + be different from the font used in the reference image. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-text-11-t.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <!-- Note that picking a platform font (sans-serif) is one of the main purposes of this test --> + <g font-family="sans-serif"> + <text transform="rotate(90) translate(120 -100)" text-anchor="middle">Rotated 90 degrees</text> + <text transform="rotate(-90) translate(-120 140)" text-anchor="middle">Rotated -90 degrees</text> + <text transform="rotate(180) translate(-120 -250)" text-anchor="middle">Rotated 180 degrees</text> + <text transform="rotate(360) translate(120 230)" text-anchor="middle">Unrotated text</text> + <text transform="translate(250 180) rotate(85 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(75 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(65 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(55 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(45 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(35 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(25 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(15 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(5 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(-5 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(-15 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(-25 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(-35 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(-45 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(-55 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(-65 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(-75 0 0)">Rotated by 10 degrees</text> + <text transform="translate(250 180) rotate(-85 0 0)">Rotated by 10 degrees</text> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.3 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-text-12-t-manual.svg b/testing/web-platform/tests/svg/import/text-text-12-t-manual.svg new file mode 100644 index 000000000..0fb521c4b --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-text-12-t-manual.svg @@ -0,0 +1,186 @@ +<svg version="1.1" baseProfile="tiny" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="VH" status="issue" + version="$Revision: 1.1 $" testname="$RCSfile: text-text-12-t.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#TextElement"> + <p>ISSUE: the glyphs don't cover the entire em-cell, and the spec doesn't require visual alignment - text adjustments are based on advances</p> + <p> + The purpose of this test is to validate the interaction of text-anchor + and x/y glyph positioning. + </p> + <p> + Each row shows a different combination of x/y values: 1, more than characters, + fewer than characters. Each column shows different anchor values: middle + and end. + </p> + <p> + The blue markers show the various x/y absolute positions around which text + chunks should be anchored. The glyphs are black squares of increasing sizes. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Rendered output must match the reference image for the test to pass. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-text-12-t.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <style type="text/css"> + @font-face { + font-family: embeded; + src: url(woffs/embeded-text-text-05.woff) format("woff"); + } + </style> + <g font-size="16"> + <defs> + <font id="embeded" horiz-adv-x="224"> + <font-face font-family="embeded" units-per-em="1000" panose-1="0 0 0 0 0 0 0 0 0 0" ascent="917" descent="-250" alphabetic="0"/> + <missing-glyph horiz-adv-x="800" d="M50 0V800H750V0H50ZM700 50V750H100V50H700Z"/> + <glyph unicode="1" glyph-name="gl_1" horiz-adv-x="1500" d="M 0 0 L 250 0 L 250 250 L 0 250 Z"/> + <glyph unicode="2" glyph-name="gl_2" horiz-adv-x="1500" d="M 0 0 L 500 0 L 500 500 L 0 500 Z"/> + <glyph unicode="3" glyph-name="gl_3" horiz-adv-x="1500" d="M 0 0 L 750 0 L 750 750 L 0 750 Z"/> + <glyph unicode="4" glyph-name="gl_4" horiz-adv-x="1500" d="M 0 0 L 1000 0 L 1000 1000 L 0 1000 Z"/> + </font> + + </defs> + + <defs> + <g id="marker"> + <line y2="-15" stroke="fuchsia"/> + <rect x="-4" y="-4" width="8" height="8"/> + </g> + </defs> + + <g id="legend" transform="translate(10, 40)"> + <text y="30">1.x 1.y</text> + <text y="60">4.x 1.y</text> + <text y="90">2.x 1.y</text> + <text y="120">1.x 4.y</text> + <text y="150">4.x 4.y</text> + <text y="180">2.x 4.y</text> + <text y="210">1.x 2.y</text> + <text y="240">4.x 2.y</text> + <text y="270">2.x 2.y</text> + </g> + + <defs> + <g id="textContent"> + <!-- 1.x 1.y --> + <use y="30" xlink:href="#marker" fill="#8888ff"/> + <text x="0" y="30" font-family="embeded" font-size="10">1234</text> + + <!-- 4.x 1.y : four text chunks --> + <use x="10" y="60" xlink:href="#marker" fill="#8888ff"/> + <use x="20" y="60" xlink:href="#marker" fill="#8888ff"/> + <use x="30" y="60" xlink:href="#marker" fill="#8888ff"/> + <use x="40" y="60" xlink:href="#marker" fill="#8888ff"/> + <text x="10 20 30 40" y="60" font-family="embeded" font-size="10">1234</text> + + <!-- 2.x 1.y : two text chunks --> + <use x="10" y="90" xlink:href="#marker" fill="#8888ff"/> + <use x="60" y="90" xlink:href="#marker" fill="#8888ff"/> + <text x="10 60" y="90" font-family="embeded" font-size="10">1234</text> + + <!-- 1.x 4.y : four text chunks --> + <g transform="translate(0, 120)"> + <use x="0" y="-10" xlink:href="#marker" fill="#8888ff"/> + <use x="15" y="-5" xlink:href="#marker" fill="#8888ff"/> + <use x="30" y="5" xlink:href="#marker" fill="#8888ff"/> + <use x="45" y="10" xlink:href="#marker" fill="#8888ff"/> + <text x="0" y="-10 -5 5 10" font-family="embeded" font-size="10">1234</text> + </g> + + <!-- 4.x 4.y : four text chunks --> + <g transform="translate(0, 150)"> + <use x="10" y="-10" xlink:href="#marker" fill="#8888ff"/> + <use x="20" y="-5" xlink:href="#marker" fill="#8888ff"/> + <use x="30" y="5" xlink:href="#marker" fill="#8888ff"/> + <use x="40" y="10" xlink:href="#marker" fill="#8888ff"/> + <text x="10 20 30 40" y="-10 -5 5 10" font-family="embeded" font-size="10">1234</text> + </g> + + <!-- 2.x 4.y : four text chunks --> + <g transform="translate(0, 180)"> + <use x="10" y="-10" xlink:href="#marker" fill="#8888ff"/> + <use x="20" y="-5" xlink:href="#marker" fill="#8888ff"/> + <use x="35" y="5" xlink:href="#marker" fill="#8888ff"/> + <use x="50" y="10" xlink:href="#marker" fill="#8888ff"/> + <text x="10 20" y="-10 -5 5 10" font-family="embeded" font-size="10">1234</text> + </g> + + <!-- 1.x 2.y : two text chunks --> + <g transform="translate(0, 210)"> + <use x="0" y="-10" xlink:href="#marker" fill="#8888ff"/> + <use x="15" y="5" xlink:href="#marker" fill="#8888ff"/> + <text x="0" y="-10 5" font-family="embeded" font-size="10">1234</text> + </g> + + <!-- 4.x 2.y : four text chunks --> + <g transform="translate(0, 240)"> + <use x="10" y="-10" xlink:href="#marker" fill="#8888ff"/> + <use x="20" y="-5" xlink:href="#marker" fill="#8888ff"/> + <use x="30" y="-5" xlink:href="#marker" fill="#8888ff"/> + <use x="40" y="-5" xlink:href="#marker" fill="#8888ff"/> + <text x="10 20 30 40" y="-10 -5" font-family="embeded" font-size="10">1234</text> + </g> + + <!-- 2.x 2.y : two text chunks --> + <g transform="translate(0, 270)"> + <use x="10" y="-10" xlink:href="#marker" fill="#8888ff"/> + <use x="60" y="-5" xlink:href="#marker" fill="#8888ff"/> + <text x="10 60" y="-10 -5" font-family="embeded" font-size="10">1234</text> + </g> + </g> + </defs> + + <g id="anchorMiddle" text-anchor="middle" transform="translate(250, 40)"> + <text y="-17" text-anchor="middle">text-anchor</text> + <text y="-3" text-anchor="middle">middle</text> + <line x1="0" y1="10" x2="0" y2="290" stroke="fuchsia"/> + <use xlink:href="#textContent"/> + </g> + + <g id="anchorEnd" text-anchor="end" transform="translate(350, 40)"> + <text y="-17" text-anchor="middle">text-anchor</text> + <text y="-3" text-anchor="middle">end</text> + <line x1="0" y1="10" x2="0" y2="290" stroke="fuchsia"/> + <use xlink:href="#textContent"/> + </g> + + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.1 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-tref-01-b-manual.svg b/testing/web-platform/tests/svg/import/text-tref-01-b-manual.svg new file mode 100644 index 000000000..10a53a0fd --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-tref-01-b-manual.svg @@ -0,0 +1,73 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Lofton Henderson" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: text-tref-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#TRefElement"> + <p> + Test viewer capability to handle a basic 'tref' element + which points to a text string in an external file. + </p> + <p> + The test case consists of a single sub-test. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The box in the middle of the frame should + contain green "Simple external referenced text.", + which is obtained by a 'tref' element reference to a 'text' element in a 'defs' + section of another file (text-extTref-BE-18-targ.svg). + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-tref-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- Test case label --> + <text x="75" y="25" font-size="12" fill="blue">Test 'tref' element with an external referenced string.</text> + <!-- External tref reference, to another file --> + <text x="75" y="200" font-size="18" fill="green"> + <tref xlink:href="../images/text-extTref-BE-18-targ.svg#tref-external-reference"/> + </text> + <rect x="73" y="183" width="260" height="22" fill="none" stroke="black"/> + <text x="73" y="217" font-size="12" fill="black">'tref' to a string in another file</text> + <!-- Patch code --> + <!-- + <text x="75" y="200" font-size="18" fill="green" > + Simple external referenced text. + </text> +--> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-tref-02-b-manual.svg b/testing/web-platform/tests/svg/import/text-tref-02-b-manual.svg new file mode 100644 index 000000000..7773c95e1 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-tref-02-b-manual.svg @@ -0,0 +1,79 @@ +<!DOCTYPE svg [ +<!ATTLIST bar id ID #REQUIRED> +]> +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CL" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: text-tref-02-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#TRefElement"> + <p> + Test viewer capability to handle 'tref' elements + which point to text strings outside the current SVG document fragment. + </p> + <p> + The test case consists of two sub-tests; one results in the word "Hello" and the second, the word "World". + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the phrase "Hello World" is displayed, in green. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-tref-02-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- Test case label --> + <text x="75" y="25" font-family="SVGFreeSansASCII,sans-serif" font-size="12" fill="blue">Test 'tref' element pointing outside the SVG document fragment.</text> + + <text x="75" y="200" font-size="36" font-family="SVGFreeSansASCII,sans-serif" fill="green"> + <tref xlink:href="#hello"/> + <tref xlink:href="#world"/> + </text> +<!-- now make a new SVG document fragment, and hide it from being rendered --> +<defs> + <foreignObject> + <svg> + <text id="hello">Hello</text> + </svg> + </foreignObject> +</defs> +<!-- and another way to make a separate document fragment --> +<foo xmlns="http://example.org/foo"> + <bar id="world">World</bar> +</foo> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-tref-03-b-manual.svg b/testing/web-platform/tests/svg/import/text-tref-03-b-manual.svg new file mode 100644 index 000000000..ba05e5d53 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-tref-03-b-manual.svg @@ -0,0 +1,71 @@ +<!DOCTYPE svg [ +<!ATTLIST bar id ID #REQUIRED> +]> +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="Chris Lilley" status="accepted" + version="$Revision: 1.4 $" testname="$RCSfile: text-tref-03-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#TRefElement"> + <p> + Test viewer capability to handle 'tref' elements + which point to elements that have children. The flattened text content is to be used. + </p> + <p> + The test case consists of one sub-test; it results in the word "Flattened" being displayed. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if the phrase "Flattened" is displayed, all in green and at the same font size. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-tref-03-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <!-- Test case label --> + <text x="75" y="25" font-family="SVGFreeSansASCII,sans-serif" font-size="12" fill="blue">Test 'tref' element uses flattened textContent.</text> + + <text x="75" y="200" font-size="36" font-family="SVGFreeSansASCII,sans-serif" fill="green"> + <tref xlink:href="#hello"/> + </text> +<!-- now make a new SVG document fragment, and hide it from being rendered --> +<defs> + <text id="hello">F<tspan fill="blue">l</tspan><tspan fill="red" font-size="100">a</tspan><tspan fill="yellow">t<tspan fill="lime">t</tspan></tspan><tspan fill="orange" dx="50">e</tspan><tspan fill="purple">n</tspan><tspan fill="red">e</tspan><tspan fill="black">d</tspan></text> +</defs> + + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-tselect-01-b-manual.svg b/testing/web-platform/tests/svg/import/text-tselect-01-b-manual.svg new file mode 100644 index 000000000..b3a3cb0e4 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-tselect-01-b-manual.svg @@ -0,0 +1,74 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Jon Ferraiolo" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: text-tselect-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#TextSelection"> + <p> + Test text selection. + </p> + <p> + Run the test. Make a text selection in the upper block of text, and verify that text selection is possible and that the selection does not extend across multiple lines. Now make a text selection in the lower block of text, verifying that the selection <em>does</em> extend over multiple lines. + +Thus, it should + be possible to start text selection at the start of the "However" + and drag through the end of "same time." and the all four lines + should be selected. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + For basic viewers conformant acion is as described above if there + is a text selection mechanism. Since text selection is optional + on a basic device if text selection is not implemented then this + test is a pass, move on to the next test. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-tselect-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text font-size="16" x="10" y="20">Test single line and multiline text selection.</text> + <g font-size="16"> + <text x="25" y="65">Here is a stand-alone 'text' element.</text> + <text x="25" y="90">Here is a second 'text' element just below.</text> + <text x="25" y="115">Because these are four separate 'text' elements,</text> + <text x="25" y="140">text selection should not go across lines here.</text> + <text> + <tspan x="25" y="190">However, these lines of text are achieved by using</tspan> + <tspan x="25" y="215">one 'tspan' per line, all contained within the same</tspan> + <tspan x="25" y="240">'text' element, so you should be able to select all</tspan> + <tspan x="25" y="265">four lines at the same time.</tspan> + </text> + </g> + <text id="revision" x="10" y="340" font-size="40" stroke="none" fill="black">$Revision: 1.8 $</text> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + </g> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-tselect-02-f-manual.svg b/testing/web-platform/tests/svg/import/text-tselect-02-f-manual.svg new file mode 100644 index 000000000..12be0f93f --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-tselect-02-f-manual.svg @@ -0,0 +1,146 @@ +<svg version="1.1" baseProfile="full" onload="doSelection(0,0);" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="ED" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: text-tselect-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#TextSelection"> + <p> + This test demonstrates text selection of bidirectional text. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The initial result should be that the first 9 characters in logical order + starting from logical position 0 are selected. + </p> + <p> + Visually the selection is discontigous and these substrings must be selected (listed in visual order): + </p> + <p> + "abc" + </p> + <p> + the space between "c" and "ו" + </p> + <p> + "1" + </p> + <p> + the space between "3" and "ג" + </p> + <p> + "אבג" + </p> + <p> + If only the substrings listed above were selected then the test has passed. + </p> + <p> + A user agent that allows selecting text in logical order would have generated the same selection + as in this testcase if the user started the selection on the character "a" and ended it on the + character "1". + + A user agent that allows selecting text in visual order would not have a discontigous selection + if the user started the selection on the character "a" and ended it on the character "1". The copied + text would be discontigous instead in this case. + + Note that the SVG DOM method requires logical order text selection, so for both types of user agents + this testcase must look the same. + </p> + <p> + The testcase also shows what happens when the selection is modified via DOM (click the buttons below + the bidi-text). Compliant viewers must throw an exception when the first parameter handed + to SVGTextContentElement.selectSubString is out-of-range. + That means the variable 'startIndex' must always be in the range 0 <= startIndex <= 18. + It can be noted that the parameter 'numChars' is not restricted in this way. + </p> + <p> + Note that the color of the text selection is UA dependent and not defined in the SVG specification. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-tselect-02-f.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <script> + var startIndex = 0; + var numChars = 9; + + function doSelection(indexDelta, numCharsDelta) + { + try + { + document.getElementById('text').selectSubString(startIndex+indexDelta, numChars+numCharsDelta); + } + catch(e) + { + if(e.code == DOMException.INDEX_SIZE_ERR) + { + // If there was an error, re-select the last range + document.getElementById('text').selectSubString(startIndex, numChars); + return; + } + } + + startIndex += indexDelta; + numChars += numCharsDelta; + + document.getElementById('info').firstChild.data = "StartIndex: " + startIndex + ". NumChars: " + numChars; + } + </script> + </defs> + + <g transform="translate(0,60)"> + <text id="info" font-size="16" x="10" y="70">StartIndex: 0 NumChars: 0</text> + + <text id="text" font-size="48" y="128" x="10"> + abc אבג 123 דהו def + </text> + + <g id="buttons"> + <rect x="10" y="160" width="100" height="20" fill="blue" onclick="doSelection(1,0);"/> + <text x="60" y="175" text-anchor="middle" font-size="16" fill="white" pointer-events="none">startIndex++</text> + + <rect x="120" y="160" width="100" height="20" fill="blue" onclick="doSelection(-1,0);"/> + <text x="170" y="175" text-anchor="middle" font-size="16" fill="white" pointer-events="none">startIndex--</text> + + <rect x="230" y="160" width="100" height="20" fill="blue" onclick="doSelection(0,1);"/> + <text x="280" y="175" text-anchor="middle" font-size="16" fill="white" pointer-events="none">numChars++</text> + + <rect x="340" y="160" width="100" height="20" fill="blue" onclick="doSelection(0,-1);"/> + <text x="390" y="175" text-anchor="middle" font-size="16" fill="white" pointer-events="none">numChars--</text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-tselect-03-f-manual.svg b/testing/web-platform/tests/svg/import/text-tselect-03-f-manual.svg new file mode 100644 index 000000000..9d051088a --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-tselect-03-f-manual.svg @@ -0,0 +1,157 @@ +<svg version="1.1" baseProfile="full" onload="doSelection(0,0);" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="ED" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: text-tselect-03-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#TextSelection"> + <p> + This test demonstrates text selection of bidirectional text. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The initial result should be that the first 9 characters in logical order + starting from logical position 0 are selected. + </p> + <p> + Visually the selection is discontigous and these substrings must be selected (listed in visual order): + </p> + <p> + "abc" + </p> + <p> + the space between "c" and "ו" + </p> + <p> + "1" + </p> + <p> + the space between "3" and "ג" + </p> + <p> + "אבג" + </p> + <p> + If only the substrings listed above were selected then the test has passed. + </p> + <p> + A user agent that allows selecting text in logical order would have generated the same selection + as in this testcase if the user started the selection on the character "a" and ended it on the + character "1". + + A user agent that allows selecting text in visual order would not have a discontigous selection + if the user started the selection on the character "a" and ended it on the character "1". The copied + text would be discontigous instead in this case. + + Note that the SVG DOM method requires logical order text selection, so for both types of user agents + this testcase must look the same. + </p> + <p> + The testcase also shows what happens when the selection is modified via DOM (click the buttons below + the bidi-text). Compliant viewers must throw an exception when the first parameter handed + to SVGTextContentElement.selectSubString is out-of-range. + That means the variable 'startIndex' must always be in the range 0 <= startIndex <= 18. + It can be noted that the parameter 'numChars' is not restricted in this way. + </p> + <p> + Note that the color of the text selection is UA dependent and not defined in the SVG specification. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-tselect-03-f.svg,v $</title> + <defs> + <style type="text/css"> + @font-face { + font-family: Ezra SIL SR; + src: url(woffs/EzraSILSR.woff) format("woff"); + } + </style> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + <font-face font-family="SVGHebrew" unicode-range="U+000D-FEFF"> + <font-face-src> + <font-face-uri xlink:href="../resources/Heb.svg#SVGHebrew"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <script> + var startIndex = 0; + var numChars = 9; + + function doSelection(indexDelta, numCharsDelta) + { + try + { + document.getElementById('text').selectSubString(startIndex+indexDelta, numChars+numCharsDelta); + } + catch(e) + { + if(e.code == DOMException.INDEX_SIZE_ERR) + { + // If there was an error, re-select the last range + document.getElementById('text').selectSubString(startIndex, numChars); + return; + } + } + + startIndex += indexDelta; + numChars += numCharsDelta; + + document.getElementById('info').firstChild.data = "StartIndex: " + startIndex + ". NumChars: " + numChars; + } + </script> + </defs> + + <g transform="translate(0,60)"> + <text id="info" font-size="16" x="10" y="70">StartIndex: 0 NumChars: 0</text> + + <text id="text" font-size="48" y="128" x="10" font-family="SVGHebrew, 'Ezra SIL SR', serif"> + abc אבג 123 דהו def + </text> + + <g id="buttons"> + <rect x="10" y="160" width="100" height="20" fill="blue" onclick="doSelection(1,0);"/> + <text x="60" y="175" text-anchor="middle" font-size="14" fill="white" pointer-events="none">startIndex++</text> + + <rect x="120" y="160" width="100" height="20" fill="blue" onclick="doSelection(-1,0);"/> + <text x="170" y="175" text-anchor="middle" font-size="14" fill="white" pointer-events="none">startIndex--</text> + + <rect x="230" y="160" width="100" height="20" fill="blue" onclick="doSelection(0,1);"/> + <text x="280" y="175" text-anchor="middle" font-size="14" fill="white" pointer-events="none">numChars++</text> + + <rect x="340" y="160" width="100" height="20" fill="blue" onclick="doSelection(0,-1);"/> + <text x="390" y="175" text-anchor="middle" font-size="14" fill="white" pointer-events="none">numChars--</text> + </g> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-tspan-01-b-manual.svg b/testing/web-platform/tests/svg/import/text-tspan-01-b-manual.svg new file mode 100644 index 000000000..5d10f95d6 --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-tspan-01-b-manual.svg @@ -0,0 +1,113 @@ +<svg version="1.1" baseProfile="basic" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="SVGWG" author="Lofton Henderson" status="accepted" + version="$Revision: 1.10 $" testname="$RCSfile: text-tspan-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#TSpanElement"> + <p> + Test tspan element styling and relative position adjustments. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if: + </p> + <ul> + <li>"You are not a banana" is displayed with the word "not" in bold green, with the rest of the sentence in normal blue.</li> + <li>"But you are a peach!" is displayed with the word "are" in bold green raised above the baseline, and "a peach!" lowered below the baseline.</li> + <li>"Cute and fuzzy" is displayed like there was spaces between each character, and "fuzzy" is displayed on a line below "Cute and".</li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-tspan-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <font-face font-family="FreeSerif" unicode-range="U+0-7F" font-weight="400"> + <font-face-src> + <font-face-uri xlink:href="../resources/FreeSerif.svg#FreeSerif"/> + </font-face-src> + </font-face> + <font-face font-family="FreeSerif" unicode-range="U+0-7F" font-weight="700"> + <font-face-src> + <font-face-uri xlink:href="../resources/FreeSerifBold.svg#FreeSerifBold"/> + </font-face-src> + </font-face> + <font-face font-family="FreeSerif" unicode-range="U+0-7F" font-weight="400" font-style="italic"> + <font-face-src> + <font-face-uri xlink:href="../resources/FreeSerifItalic.svg#FreeSerifItalic"/> + </font-face-src> + </font-face> + <font-face font-family="FreeSerif" unicode-range="U+0-7F" font-weight="700" font-style="italic"> + <font-face-src> + <font-face-uri xlink:href="../resources/FreeSerifBoldItalic.svg#FreeSerifBoldItalic"/> + </font-face-src> + </font-face> + </defs> + <text x="25" y="20" font-size="16">Basics of tspan: changing visual properties and positioning.</text> + <!-- From example tspan01 - using tspan to change visual attributes --> + <g id="tspan01" font-size="16" font-family="FreeSerif, serif"> + <text x="74" y="63.75" fill="blue"> + You are<tspan font-weight="bold" fill="green"> not </tspan>a banana. + </text> + <rect x="47.5" y="74.25" width="310.5" height="53.5" fill="none" stroke="#000000"/> + <text x="65.25" y="90.75" font-size="16">Text: "You are not a banana."</text> + <text x="65.25" y="108" font-size="16">'tspan' changes visual attributes of "not",</text> + <text x="65.25" y="125.25" font-size="16">to green, bold.</text> + </g> + <!-- From example tspan02 - using tspan's dx and dy attributes + for incremental positioning adjustments --> + <g id="tspan02" font-size="16" font-family="FreeSerif, serif"> + <text x="257.5" y="153.75" fill="blue"> + But you<tspan dx="2em" dy="-10.75" font-weight="bold" fill="green">are</tspan><tspan dy="25.5" xml:space="preserve"> a peach!</tspan> + </text> + <rect x="225" y="179" width="245.5" height="53.5" fill="none" stroke="#000000"/> + <text x="238" y="195" font-size="16">Text: "But you are a peach!"</text> + <text x="238" y="212.25" font-size="16">Using dx,dy, 'tspan' raises "are",</text> + <text x="238" y="229.5" font-size="16">'tspan' lowers "a peach!"</text> + </g> + <!-- Example tspan03 - using tspan's x and y attributes + for multiline text and precise glyph positioning --> + <g id="tspan03" fill="#000000" font-size="16" font-family="FreeSerif, serif"> + <text fill="rgb(255,164,0)"> + <tspan x="35 53.75 72.5 91.25 110.5 128.75 147.5 166.25" y="200">Cute and </tspan> + <tspan x="63.13 81.88 100.63 119.38 138.13" y="230.5">fuzzy.</tspan> + </text> + <rect x="17.5" y="244.75" width="335.5" height="53.5" fill="none" stroke="#000000"/> + <text x="25.25" y="258" font-size="16">Text: "Cute and fuzzy."</text> + <text x="25.25" y="275.25" font-size="16">'tspan' char-by-char placement of "Cute and",</text> + <text x="25.25" y="292.5" font-size="16">'tspan' char-by-char "fuzzy", below it.</text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.10 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/text-tspan-02-b-manual.svg b/testing/web-platform/tests/svg/import/text-tspan-02-b-manual.svg new file mode 100644 index 000000000..735b41e9c --- /dev/null +++ b/testing/web-platform/tests/svg/import/text-tspan-02-b-manual.svg @@ -0,0 +1,177 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CL" author="AG" status="accepted" + version="$Revision: 1.11 $" testname="$RCSfile: text-tspan-02-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/text.html#TSpanElementRotateAttribute"> + <p> + Tests the rotate attribute in the tspan element. + </p> + <ul> + <li> + Tests the case where more characters than rotate values are + supplied. In this case the last rotate value should propogate to + subsequent characters in the element and child tspan elements that + do not contain a rotate value. + </li> + <li> + Tests the case where more values than characters are supplied. In + this case each character should be rotated by the designated value + remaining unused values propogate to any child tspan elements that + do not contain a rotate value. + </li> + <li> + Tests the case where an ansestor of a tspan element specifies a + rotate value but the tspan itself doesn't. In this case the tspan + should use the current rotate value specified by the ansestor + element. + </li> + <li> + Tests the case where a tspan or text element specifies a rotate + value and contains a text string that is broken due to nested child + tspan. In this case characters after the child tspan element must + be rotated by the current rotate value. + </li> + </ul> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + For this test to pass the text "Not all characters in the text have a + specified rotation" must be displayed in green without any red showing. + If any red shows the test is a fail. + </p> + <p> + Rotation values: + </p> + <ul> + <li> + The characters in the text "Not" must be rotated by 5,15 and 25 + degrees respectively. + </li> + <li> + The first 3 characters in the text "all characters" must be -10,-20 + and -30 degrees respectively. Subsequent characters in the text must + be each rotated by -40 degrees. + </li> + <li> + All the characters in the text "text have a" must be rotated by -40 + degrees. + </li> + <li> + The characters in the text "in the" must be rotated by 70,60,50,40,30 + and 20 degrees respectively. Note: the space in the text consumes a + rotate value. + </li> + <li> + All the characters in the text "specified" must be rotated by -10 + degrees. + </li> + <li> + All the characters in the text "rotation" must be rotated by 55 + degrees. + </li> + </ul> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: text-tspan-02-b.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text font-size="35" fill="red" x="20" y="120" rotate="5,15,25,35,-10,-20,-30,-40,-40,-40,-40,-40,-40,-40,-40,-40,-40,-40,-40,70,60,50,40,30,20,-40,-40,-40,-40,-40,-40,-40,-40,-40,-40,-40,-40,55,-10,-10,-10,-10,-10,-10,-10,-10,-10,55,55,55,55,55,55,55,55,55"> + Not all characters in the + <tspan x="20" y="180">text have a specified rotation</tspan> + </text> + + + <text font-size="35" fill="green" x="20" y="120" rotate="5,15,25,35,45,55" stroke="green" stroke-width="0.5"> + Not + + <tspan id="child1" rotate="-10,-20,-30,-40"> + all characters + + <tspan id="child2" rotate="70,60,50,40,30,20,10"> + in + + <tspan id="child3"> + the + </tspan> + </tspan> + + <tspan x="20" y="180" id="child4"> + text + </tspan> + + have a + </tspan> + + <tspan id="child5" rotate="-10"> + specified + </tspan> + + rotation + </text> + + <text id="rotation_values" font-size="8" xml:space="preserve"> + <tspan x="30" y="135"> +5 15 25 + </tspan> + <tspan x="80" y="130"> +-10 -20 -30 + </tspan> + <tspan x="125" y="130"> + -40 -40 -40 -40 -40 -40 -40 -40 -40 -40 + </tspan> + <tspan x="295" y="145"> +70 60 + </tspan> + <tspan x="340" y="140"> +40 30 20 + </tspan> + <tspan x="15" y="190"> +-40 -40 -40 -40 -40 -40 -40 -40 -40 + </tspan> + <tspan x="190" y="200"> + -10 -10 -10 -10 -10 -10 -10 -10 + </tspan> + <tspan x="275" y="190"> +-10 + </tspan> + <tspan x="340" y="210"> + 55 55 55 55 55 55 55 55 + </tspan> + </text> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.11 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/types-basic-01-f-manual.svg b/testing/web-platform/tests/svg/import/types-basic-01-f-manual.svg new file mode 100644 index 000000000..2be4195b8 --- /dev/null +++ b/testing/web-platform/tests/svg/import/types-basic-01-f-manual.svg @@ -0,0 +1,75 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="ED" author="CL" status="accepted" + version="$Revision: 1.5 $" testname="$RCSfile: types-basic-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/types.html#BasicDataTypes"> + <p> + Tests scientific notation in attribute values; in particular, that numbers + of the form .n with a leading decimal point, are supported + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if all the coloured rectangles are of the same height + and line up with each other and + with the grey marker lines. If any red is visible, the test fails. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: types-basic-01-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <polyline points="20,75 380,75" stroke="#999" stroke-width="1"/> + <polyline points="20,125 380,125" stroke="#999" stroke-width="1"/> + + <rect width="300" height="50" x="50" y="75" fill="red"/> + + <polyline points="50,100 150,100" stroke-width="50" stroke="#6F3"/> + <polyline points="150,100 250,100" stroke-width="5e1" stroke="#6C6"/> + <polyline points="250,100 350,100" stroke-width=".5e2" stroke="#39F"/> + + + <text x="50" y="200" font-size="20">Different forms of the <number> type</text> + + <g text-anchor="middle" fill="#555"> + <text x="100" y="110" font-size="20">50</text> + <text x="200" y="110" font-size="20" >5e1</text> + <text x="300" y="110" font-size="20">.5e2</text> + </g> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/types-basic-02-f-manual.svg b/testing/web-platform/tests/svg/import/types-basic-02-f-manual.svg new file mode 100644 index 000000000..53fb16367 --- /dev/null +++ b/testing/web-platform/tests/svg/import/types-basic-02-f-manual.svg @@ -0,0 +1,84 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="ED" status="created" + version="$Revision: 1.1 $" testname="$RCSfile: types-basic-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/types.html#BasicDataTypes"> + <p> + Tests units and no units on <length> in CSS on a property defined in the SVG specification. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test is passed if there are six circles with the same thick green stroke visible, and no red. + If the SVG user agent doesn't support CSS styling then this test does not apply. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: types-basic-02-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <style> + #swNoUnit { stroke-width: 20 } + #swUnit { stroke-width: 20px } + #swUpperCaseUnit { stroke-width: 20PX } + </style> + + <g id="references" fill="none" stroke="red" stroke-width="19"> + <circle r="40" transform="translate(100 100)"/> + <circle r="40" transform="translate(240 100)"/> + <circle r="40" transform="translate(380 100)"/> + + <circle r="40" transform="translate(100 240)"/> + <circle r="40" transform="translate(240 240)"/> + <circle r="40" transform="translate(380 240)"/> + </g> + + <!-- "For length values in SVG-specific properties and their corresponding presentation attributes, the length unit identifier is optional." --> + <circle r="40" id="swNoUnit" fill="none" stroke="lime" transform="translate(100 100)"/> + <circle r="40" id="swUnit" fill="none" stroke="lime" transform="translate(240 100)"/> + <circle r="40" id="swPresAttr" fill="none" stroke="lime" stroke-width="20" transform="translate(380 100)"/> + + <!-- "In presentation attributes for all properties, whether defined in this specification or in CSS2, the length identifier, if specified, must be in lower case." --> + <g stroke-width="20"> + <circle r="40" id="swUpperCaseUnitPresAttr" stroke-width="10PX" fill="none" stroke="lime" transform="translate(100 240)"/> + </g> + + <!-- Test that units are case-insensitive when specified in CSS --> + <circle r="40" id="swUpperCaseUnit" fill="none" stroke="lime" transform="translate(240 240)"/> + <circle r="40" id="swUpperCaseUnitInline" style="stroke-width:20PX" fill="none" stroke="lime" transform="translate(380 240)"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.1 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/types-dom-01-b-manual.svg b/testing/web-platform/tests/svg/import/types-dom-01-b-manual.svg new file mode 100644 index 000000000..60093ac54 --- /dev/null +++ b/testing/web-platform/tests/svg/import/types-dom-01-b-manual.svg @@ -0,0 +1,107 @@ +<svg version="1.1" baseProfile="tiny" onload="testSVGLocatable()" id="svg-root" + width="100%" height="100%" viewBox="0 0 480 360" + xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2009 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="AE,ED" author="AN" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: types-dom-01-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/types.html#BasicDOMInterfaces"> + <p> + This test checks all the methods and properties of the SVGLocatable interface. + Note the use of nested svg elements and testing against different elements in the hierarchy. + Note that the values of .getScreenCTM() and .getCTM() can only be tested correctly if they are + in the html-based test or the width and height of the root element is explicitly set to 480x360. + The methods .getScreenCTM() and .getCTM() are tested from the rotated text element, the method .getBBox(), + .getTransformToElement() is tested between the rotated text and its parent group, the method .getBBox() and + the properties .farthestViewportElement and .nearestViewportElement are tested on the blue circle. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. Make sure scripting is enabled. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + For the test to pass, the values generated by script must match the values provided in the png image. The correct values are: + </p> + <p> + .getScreenCTM() for id "rotText": 0.42,0.42,-0.42,0.42,70.00,-60.00 + </p> + <p> + .getCTM() for id "rotText": 0.42,0.42,-0.42,0.42,70.00,-60.00 + </p> + <p> + .getTransformToElement() between id "rotText" and id "parentGroup": 0.42,0.42,-0.42,0.42,0.00,0.00 + </p> + <p> + .getBBox() for 'blueCircle': .x=-50,.y=-50,.width=100,.height=100 + </p> + <p> + .farthestViewportElement of blueCircle=svg-root + </p> + <p> + .nearestViewportElement of blueCircle=nestedSVG + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: types-dom-01-b.svg,v $</title> + <defs> + <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <script type="text/ecmascript"> + function testSVGLocatable() { + var rotText = document.getElementById("rotatedText"); + var blueCircle = document.getElementById("blueCircle") + var matr = rotText.getScreenCTM(); + document.getElementById("result1").firstChild.nodeValue = ".getScreenCTM(): " + matr.a.toFixed(2) + "," + matr.b.toFixed(2) + "," + matr.c.toFixed(2) + "," + matr.d.toFixed(2) + "," + matr.e.toFixed(2) + "," + matr.f.toFixed(2); + var matr = rotText.getCTM(); + document.getElementById("result2").firstChild.nodeValue = ".getCTM(): " + matr.a.toFixed(2) + "," + matr.b.toFixed(2) + "," + matr.c.toFixed(2) + "," + matr.d.toFixed(2) + "," + matr.e.toFixed(2) + "," + matr.f.toFixed(2); + var matr = rotText.getTransformToElement(document.getElementById("parentGroup")); + document.getElementById("result3").firstChild.nodeValue = ".getTransformToElement(): " + matr.a.toFixed(2) + "," + matr.b.toFixed(2) + "," + matr.c.toFixed(2) + "," + matr.d.toFixed(2) + "," + matr.e.toFixed(2) + "," + matr.f.toFixed(2); + var bbox = blueCircle.getBBox(); + document.getElementById("result4").firstChild.nodeValue = ".getBBox() for 'blueCircle': .x="+bbox.x+",.y="+bbox.y+",.width="+bbox.width+",.height="+bbox.height; + document.getElementById("result5").firstChild.nodeValue = ".farthestViewportElement of blueCircle="+blueCircle.farthestViewportElement.getAttributeNS(null,"id"); + document.getElementById("result6").firstChild.nodeValue = ".nearestViewportElement of blueCircle="+blueCircle.nearestViewportElement.getAttributeNS(null,"id"); + } + </script> + <g font-size="12"> + <g id="parentGroup" transform="translate(70,-60)"> + <text id="rotatedText" transform="scale(0.6),rotate(45)" font-size="20" x="30" y="150">Rotated Text for testing SVGLocatable</text> + <text id="otherText" transform="scale(0.7)" font-size="20" x="100" y="130">Some other text with id 'otherText'</text> + <svg id="nestedSVG" x="200" y="100" width="110" height="110" viewBox="-55 -55 110 110"> + <circle id="blueCircle" cx="0" cy="0" r="50" fill="blue"/> + </svg> + </g> + <text id="result1" x="10" y="200"> </text> + <text id="result2" x="10" y="220"> </text> + <text id="result3" x="10" y="240"> </text> + <text id="result4" x="10" y="260"> </text> + <text id="result5" x="10" y="280"> </text> + <text id="result6" x="10" y="300"> </text> + </g> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <!--<g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/types-dom-02-f-manual.svg b/testing/web-platform/tests/svg/import/types-dom-02-f-manual.svg new file mode 100644 index 000000000..cac86de2d --- /dev/null +++ b/testing/web-platform/tests/svg/import/types-dom-02-f-manual.svg @@ -0,0 +1,156 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="CL" author="CM" status="accepted" + version="$Revision: 1.8 $" testname="$RCSfile: types-dom-02-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/types.html#BasicDOMInterfaces"> + <p> + This tests that the animVal properties that are objects + are always distinct from their corresponding baseVal properties. + This is tested for interfaces SVGAnimatedNumberList, SVGAnimatedLength, + SVGAnimatedLengthList, SVGAnimatedAngle, SVGAnimatedRect, + SVGAnimatedTransformList and SVGAnimatedPreserveAspectRatio. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Once loaded, the test shows 7 rectangles + representing seven sub-tests reflecting + the result of checking that an animVal object is + not the same object as its corresponding baseVal object. + Each rectangle will be either black to indicate that + the sub-test wasn't run, red to indicate that the + sub-test failed, and green to indicate that the + sub-test passed. + </p> + <p> + The test is passed if all 7 rectangles are green. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: types-dom-02-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text x='210' y='55' text-anchor='end'>animVal != baseVal:</text> + + <g font-size='14' transform='translate(500)rotate(90)'> + <rect id='r1b' x='40' y='60' width='20' height='20'/> + <text x='70' y='75'>SVGAnimatedNumberList</text> + <rect id='r2b' x='40' y='90' width='20' height='20'/> + <text x='70' y='105'>SVGAnimatedLength</text> + <rect id='r3b' x='40' y='120' width='20' height='20'/> + <text x='70' y='135'>SVGAnimatedLengthList</text> + <rect id='r4b' x='40' y='150' width='20' height='20'/> + <text x='70' y='165'>SVGAnimatedAngle</text> + <rect id='r5b' x='40' y='180' width='20' height='20'/> + <text x='70' y='195'>SVGAnimatedRect</text> + <rect id='r6b' x='40' y='210' width='20' height='20'/> + <text x='70' y='225'>SVGAnimatedTransformList</text> + <rect id='r7b' x='40' y='240' width='20' height='20'/> + <text x='70' y='255'>SVGAnimatedPreserveAspectRatio</text> + </g> + + <g display='none'> + <text id='text' rotate='0 20 40'>abc</text> + <circle id='circle' r='50'/> + <marker id='marker' orient='1.5708rad'/> + <svg id='svg' viewBox='10 20 30 40'/> + </g> + + <script><![CDATA[ + function $(id) { return document.getElementById(id); } + + var text = $('text'), + circle = $('circle'), + marker = $('marker'), + svg = $('svg'); + + function expect_value(id, fn, value) { + try { + if (fn() === value) { + $(id).setAttribute('fill', 'green'); + return; + } + } catch (e) { + } + $(id).setAttribute('fill', 'red'); + } + + // SVGAnimatedNumberList: rotate on text + expect_value + ('r1b', + function() { return text.rotate.animVal != text.rotate.baseVal; }, + true); + + // SVGAnimatedLength: r on circle + expect_value + ('r2b', + function() { return circle.r.animVal != text.rotate.baseVal; }, + true); + + // SVGAnimatedLengthList: x on text + expect_value + ('r3b', + function() { return text.x.animVal != text.x.baseVal; }, + true); + + // SVGAnimatedAngle: orient on marker + expect_value + ('r4b', + function() { return marker.orientAngle.animVal != marker.orientAngle.baseVal; }, + true); + + // SVGAnimatedRect: viewBox on svg + expect_value + ('r5b', + function() { return svg.viewBox.animVal != svg.viewBox.baseVal; }, + true); + + // SVGAnimatedTransformList: transform on circle + expect_value + ('r6b', + function() { return circle.transform.animVal != circle.transform.baseVal; }, + true); + + // SVGAnimatedPreserveAspectRatio: preserveAspectRatio on svg + expect_value + ('r7b', + function() { return svg.preserveAspectRatio.animVal != svg.preserveAspectRatio.baseVal; }, + true); + ]]></script> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.8 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/types-dom-03-b-manual.svg b/testing/web-platform/tests/svg/import/types-dom-03-b-manual.svg new file mode 100644 index 000000000..b9228250f --- /dev/null +++ b/testing/web-platform/tests/svg/import/types-dom-03-b-manual.svg @@ -0,0 +1,84 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="ED" author="CM" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: types-dom-03-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/#__svg__SVGLocatable__getBBox"> + <p> + Test that bounding box geometry can be obtained + before the SVGLoad event is dispatched. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Load the test. A rectangle will be shown indicating + the result of the test. It will be black if test + did not run, red if the test failed and green if + the test passed. + </p> + <p> + The test is passed if the rectangle is green. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: types-dom-03-b.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text x='10' y='30'>Test that getBBox() works before SVGLoad</text> + + <rect id='r' x='10' y='40' width='50' height='50'/> + <text id='t' visibility='hidden' x='1000' y='1000'>Abc</text> + + <script><![CDATA[ + function $(x) { return document.getElementById(x); } + + var t = $('t'), + r = $('r'), + b1, b2, pass = false; + + try { + b1 = t.getBBox(); + b2 = r.getBBox(); + if (b1.x > 0 && b1.y > 0 && b1.width > 0 && b1.height > 0 + && b2.x == 10 && b2.y == 40 && b2.width == 50 && b2.height == 50) { + pass = true; + } + } catch (e) { + } + r.setAttribute('fill', pass ? 'green' : 'red'); + ]]></script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/types-dom-04-b-manual.svg b/testing/web-platform/tests/svg/import/types-dom-04-b-manual.svg new file mode 100644 index 000000000..37df62551 --- /dev/null +++ b/testing/web-platform/tests/svg/import/types-dom-04-b-manual.svg @@ -0,0 +1,250 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="ED" author="CM" status="accepted" + version="$Revision: 1.7 $" testname="$RCSfile: types-dom-04-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/svgdom.html#SVGDOMOverview"> + <p> + This tests that SVG DOM objects that correspond to attributes + are live. + This is tested for interfaces + SVGAnimatedNumberList, SVGAnimatedLength, + SVGAnimatedLengthList, SVGAnimatedAngle, SVGAnimatedRect, + SVGAnimatedTransformList, SVGAnimatedPreserveAspectRatio, + SVGAnimatedBoolean, SVGAnimatedString, SVGAnimatedEnumeration, + SVGAnimatedInteger and SVGAnimatedNumber. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Once loaded, the test shows 12 rectangles, one for + each sub-test. Each sub-test is checking that + an SVG DOM object of a particular interface is live. + The rectangle indicates the result of running the + sub-test: black to indicate that it wasn't run, + red to indicate that it failed, and green to indicate + that it passed. + </p> + <p> + The test is passed if all 12 rectangles are green. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: types-dom-04-b.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text x='10' y='30'>Testing liveness of SVG DOM objects</text> + + <g font-size='14' transform='translate(500)rotate(90)'> + <rect id='r1' x='40' y='60' width='20' height='20'/> + <text x='70' y='75'>SVGAnimatedNumberList</text> + <rect id='r2' x='40' y='90' width='20' height='20'/> + <text x='70' y='105'>SVGAnimatedLength</text> + <rect id='r3' x='40' y='120' width='20' height='20'/> + <text x='70' y='135'>SVGAnimatedLengthList</text> + <rect id='r4' x='40' y='150' width='20' height='20'/> + <text x='70' y='165'>SVGAnimatedAngle</text> + <rect id='r5' x='40' y='180' width='20' height='20'/> + <text x='70' y='195'>SVGAnimatedRect</text> + <rect id='r6' x='40' y='210' width='20' height='20'/> + <text x='70' y='225'>SVGAnimatedTransformList</text> + <rect id='r7' x='40' y='240' width='20' height='20'/> + <text x='70' y='255'>SVGAnimatedPreserveAspectRatio</text> + <rect id='r8' x='40' y='270' width='20' height='20'/> + <text x='70' y='285'>SVGAnimatedBoolean</text> + <rect id='r9' x='40' y='300' width='20' height='20'/> + <text x='70' y='315'>SVGAnimatedString</text> + <rect id='r10' x='40' y='330' width='20' height='20'/> + <text x='70' y='345'>SVGAnimatedEnumeration</text> + <rect id='r11' x='40' y='360' width='20' height='20'/> + <text x='70' y='375'>SVGAnimatedInteger</text> + <rect id='r12' x='40' y='390' width='20' height='20'/> + <text x='70' y='405'>SVGAnimatedNumber</text> + </g> + + <g display='none'> + <text id='text' rotate='0 20 40' x='10 20' lengthAdjust='spacing'>abc</text> + <circle id='circle' r='50' transform='scale(1) scale(2)' class='one'/> + <marker id='marker' orient='30'/> + <svg id='svg' viewBox='10 20 30 40' preserveAspectRatio='none' externalResourcesRequired='false'/> + <filter> + <feTurbulence id='feTurbulence' baseFrequency='2 3' numOctaves='2'/> + </filter> + </g> + + <script><![CDATA[ + function $(id) { return document.getElementById(id); } + + var text = $('text'), + circle = $('circle'), + marker = $('marker'), + svg = $('svg'), + feTurbulence = $('feTurbulence'); + + function expect_exception(id, fn, code) { + try { + fn(); + } catch (e) { + if (e.code == code) { + $(id).setAttribute('fill', 'green'); + return; + } + } + $(id).setAttribute('fill', 'red'); + } + + function expect_value(id, fn, value) { + try { + if (fn() === value) { + $(id).setAttribute('fill', 'green'); + return; + } + } catch (e) { + } + $(id).setAttribute('fill', 'red'); + } + + // SVGAnimatedNumberList: rotate on text + expect_value + ('r1', + function() { + return text.rotate.baseVal.numberOfItems == 3 + && (text.setAttribute('rotate', '0 20'), text.rotate.baseVal.numberOfItems == 2); + }, + true); + + // SVGAnimatedLength: r on circle + expect_value + ('r2', + function() { + return circle.r.baseVal.value == 50 + && (circle.setAttribute('r', '100'), circle.r.baseVal.value == 100); + }, + true); + + // SVGAnimatedLengthList: x on text + expect_value + ('r3', + function() { + return text.x.baseVal.numberOfItems == 2 + && (text.setAttribute('x', '10'), text.x.baseVal.numberOfItems == 1); + }, + true); + + // SVGAnimatedAngle: orient on marker + expect_value + ('r4', + function() { + return marker.orientAngle.baseVal.value == 30 + && (marker.setAttribute('orient', '60'), marker.orientAngle.baseVal.value == 60); + }, + true); + + // SVGAnimatedRect: viewBox on svg + expect_value + ('r5', + function() { + return svg.viewBox.baseVal.x == 10 + && (svg.setAttribute('viewBox', '20 30 40 50'), svg.viewBox.baseVal.x == 20); + }, + true); + + // SVGAnimatedTransformList: transform on circle + expect_value + ('r6', + function() { + return circle.transform.baseVal.numberOfItems == 2 + && (circle.setAttribute('transform', 'scale(1)'), circle.transform.baseVal.numberOfItems == 1); + }, + true); + + // SVGAnimatedPreserveAspectRatio: preserveAspectRatio on svg + expect_value + ('r7', + function() { + return svg.preserveAspectRatio.baseVal.align == 1 /* none */ + && (svg.setAttribute('preserveAspectRatio', 'xMidYMid'), svg.preserveAspectRatio.baseVal.align == 6); + }, + true); + + // SVGAnimatedBoolean: externalResourcesRequired on svg + expect_value + ('r8', + function() { + return !svg.externalResourcesRequired.baseVal + && (svg.setAttribute('externalResourcesRequired', 'true'), svg.externalResourcesRequired.baseVal); + }, + true); + + // SVGAnimatedString: class on circle + expect_value + ('r9', + function() { + return circle.className.baseVal == 'one' + && (circle.setAttribute('class', 'two'), circle.className.baseVal == 'two'); + }, + true); + + // SVGAnimatedEnumeration: lengthAdjust on text + expect_value + ('r10', + function() { + return text.lengthAdjust.baseVal == 1 /* spacing*/ + && (text.setAttribute('lengthAdjust', 'spacingAndGlyphs'), text.lengthAdjust.baseVal == 2); + }, + true); + + // SVGAnimatedInteger: numOctaves on feTurbulence + expect_value + ('r11', + function() { + return feTurbulence.numOctaves.baseVal == 2 + && (feTurbulence.setAttribute('numOctaves', '1'), feTurbulence.numOctaves.baseVal == 1); + }, + true); + + // SVGAnimatedNumber: baseFrequency on feTurbulence + expect_value + ('r12', + function() { + return feTurbulence.baseFrequencyY.baseVal == 3 + && (feTurbulence.setAttribute('baseFrequency', '4 5'), feTurbulence.baseFrequencyY.baseVal == 5); + }, + true); + ]]></script> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.7 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/types-dom-05-b-manual.svg b/testing/web-platform/tests/svg/import/types-dom-05-b-manual.svg new file mode 100644 index 000000000..52ca38323 --- /dev/null +++ b/testing/web-platform/tests/svg/import/types-dom-05-b-manual.svg @@ -0,0 +1,127 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="ED" author="CM" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: types-dom-05-b.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/types.html#BasicDOMInterfaces"> + <p> + This tests that assigning a valid length or angle string to + valueAsString on an SVGLength or SVGAngle will affect that object's + unitType, and that assigning an invalid string will throw + a DOMException with code SYNTAX_ERR. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Once the test is loaded, four rectangles are presented, indicating + the result of passing a valid or invalid string to an + SVGLength or SVGAngle object, as indicated. Each rectangle + will be black if the sub-test did not run, red if it + failed or green if it passed. + </p> + <p> + The test is passed if all four rectangles are green. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: types-dom-05-b.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text x='10' y='30'>Test side effects of assigning to valueAsString</text> + + <rect id='r1' x='10' y='40' width='30' height='30'/> + <rect id='r2' x='10' y='80' width='30' height='30'/> + <rect id='r3' x='10' y='120' width='30' height='30'/> + <rect id='r4' x='10' y='160' width='30' height='30'/> + <g font-size='15'> + <text x='50' y='60'>Valid string on SVGLength</text> + <text x='50' y='100'>Invalid string on SVGLength</text> + <text x='50' y='140'>Valid string on SVGAngle</text> + <text x='50' y='180'>Invalid string on SVGAngle</text> + </g> + + <circle id='c' r='1em' display='none'/> + <marker id='m' orient='20rad' display='none'/> + <script> + var b, + c = document.getElementById('c'); + m = document.getElementById('m'); + + b = false; + try { + if (c.r.baseVal.unitType != 3) { /* SVGLength.SVG_LENGTHTYPE_EMS */ + throw 1; + } + c.r.baseVal.valueAsString = '2px'; + if (c.r.baseVal.unitType == 5) { /* SVGLength.SVG_LENGTHTYPE_PX */ + b = true; + } + } catch (e) { + } + document.getElementById('r1').setAttribute('fill', b ? 'green' : 'red'); + + b = false; + try { + c.r.baseVal.valueAsString = 'rubbish'; + } catch (e) { + b = e.code == 12; // SYNTAX_ERR + } + document.getElementById('r2').setAttribute('fill', b ? 'green' : 'red'); + + b = false; + try { + if (m.orientAngle.baseVal.unitType != 3) { /* SVGAngle.SVG_ANGLETYPE_RAD */ + throw 1; + } + m.orientAngle.baseVal.valueAsString = '2grad'; + if (m.orientAngle.baseVal.unitType == 4) { /* SVGAngle.SVG_ANGLETYPE_GRAD */ + b = true; + } + } catch (e) { + } + document.getElementById('r3').setAttribute('fill', b ? 'green' : 'red'); + + b = false; + try { + m.orientAngle.baseVal.valueAsString = 'rubbish'; + } catch (e) { + b = e.code == 12; // SYNTAX_ERR + } + document.getElementById('r4').setAttribute('fill', b ? 'green' : 'red'); + </script> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/types-dom-06-f-manual.svg b/testing/web-platform/tests/svg/import/types-dom-06-f-manual.svg new file mode 100644 index 000000000..09ed98f78 --- /dev/null +++ b/testing/web-platform/tests/svg/import/types-dom-06-f-manual.svg @@ -0,0 +1,130 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" onload="runtest()"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="CM" author="ED" status="accepted" + version="$Revision: 1.6 $" testname="$RCSfile: types-dom-06-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/types.html#InterfaceSVGStringList"> + <p> + This tests parts of the SVGStringList interface. Particularly it tests that + strings that are taken from one SVGStringList and then inserted into another + SVGStringList duplicates the value instead of removing the value from the + first list when it's inserted into the second list. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + The test has passed if there are three green rectangles visible and no red. Red is an indication that the test failed. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: types-dom-06-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <defs> + <script type="application/ecmascript"> + function runtest() + { + try { + var r1 = document.getElementById("r1"); + var r2 = document.getElementById("r2"); + var r3 = document.getElementById("r3"); + var i0 = r1.requiredFeatures.getItem(0); + var i1 = r1.requiredFeatures.getItem(1); + + if(i0 != "http://www.w3.org/TR/SVG11/feature#Shape") + { + r1.removeAttribute("requiredFeatures"); + return; + } + if(i1 != "this.is.a.bogus.feature.string") + { + r1.removeAttribute("requiredFeatures"); + return; + } + if(r1.requiredFeatures.numberOfItems != 2) + { + r1.removeAttribute("requiredFeatures"); + return; + } + r2.requiredFeatures.appendItem(i1); + if(r1.requiredFeatures.numberOfItems != 2) + { + r1.removeAttribute("requiredFeatures"); + return; + } + if(r2.requiredFeatures.numberOfItems != 1) + { + r1.removeAttribute("requiredFeatures"); + return; + } + r3.requiredFeatures.insertItemBefore(i0,0); + if(r3.requiredFeatures.numberOfItems != 2) + { + r3.setAttribute("fill", "red"); + return; + } + if(r1.requiredFeatures.numberOfItems != 2) + { + r1.removeAttribute("requiredFeatures"); + return; + } + } + catch(e) + { + var f = document.getElementById("fail"); + f.setAttribute("fill", "red"); + } + } + </script> + </defs> + + <text x="50%" y="70" text-anchor="middle">SVGStringList DOM</text> + + <!-- background images --> + <g> + <rect width="100" height="100" fill="lime" transform="translate(80 100)"/> + <rect width="100" height="100" fill="lime" transform="translate(190 100)"/> + <rect width="100" height="100" fill="red" transform="translate(300 100)"/> + </g> + + <!-- tests --> + <rect id="r1" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Shape this.is.a.bogus.feature.string" width="100" height="100" fill="red" transform="translate(100 100)"/> + <rect id="r2" width="100" height="100" fill="red" transform="translate(190 100)"/> + <rect id="r3" width="100" height="100" fill="lime" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Shape" transform="translate(300 100)"/> + + <rect id="fail" width="100%" height="100%" fill="none"/> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.6 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/types-dom-07-f-manual.svg b/testing/web-platform/tests/svg/import/types-dom-07-f-manual.svg new file mode 100644 index 000000000..6abf6cabb --- /dev/null +++ b/testing/web-platform/tests/svg/import/types-dom-07-f-manual.svg @@ -0,0 +1,156 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.3" reviewer="CL" author="CM" status="accepted" + version="$Revision: 1.2 $" testname="$RCSfile: types-dom-07-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/types.html#BasicDOMInterfaces"> + <p> + This tests that the contents of an animVal object are read only. + This is tested for interfaces SVGAnimatedNumberList, SVGAnimatedLength, + SVGAnimatedLengthList, SVGAnimatedAngle, SVGAnimatedRect, + SVGAnimatedTransformList and SVGAnimatedPreserveAspectRatio. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Once loaded, the test shows 7 rectangles + representing seven sub-tests reflecting the result + of checking that an animVal object's contents is read + only. + Each rectangle will be either black to indicate that + the sub-test wasn't run, red to indicate that the + sub-test failed, and green to indicate that the + sub-test passed. + </p> + <p> + The test is passed if all 7 rectangles are green. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: types-dom-07-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + + <text x='210' y='55' text-anchor='end'>animVal is read only:</text> + + <g font-size='14' transform='translate(500)rotate(90)'> + <rect id='r1a' x='40' y='60' width='20' height='20'/> + <text x='70' y='75'>SVGAnimatedNumberList</text> + <rect id='r2a' x='40' y='90' width='20' height='20'/> + <text x='70' y='105'>SVGAnimatedLength</text> + <rect id='r3a' x='40' y='120' width='20' height='20'/> + <text x='70' y='135'>SVGAnimatedLengthList</text> + <rect id='r4a' x='40' y='150' width='20' height='20'/> + <text x='70' y='165'>SVGAnimatedAngle</text> + <rect id='r5a' x='40' y='180' width='20' height='20'/> + <text x='70' y='195'>SVGAnimatedRect</text> + <rect id='r6a' x='40' y='210' width='20' height='20'/> + <text x='70' y='225'>SVGAnimatedTransformList</text> + <rect id='r7a' x='40' y='240' width='20' height='20'/> + <text x='70' y='255'>SVGAnimatedPreserveAspectRatio</text> + </g> + + <g display='none'> + <text id='text' rotate='0 20 40'>abc</text> + <circle id='circle' r='50'/> + <marker id='marker' orient='1.5708rad'/> + <svg id='svg' viewBox='10 20 30 40'/> + </g> + + <script><![CDATA[ + function $(id) { return document.getElementById(id); } + + var text = $('text'), + circle = $('circle'), + marker = $('marker'), + svg = $('svg'); + + function expect_exception(id, fn, code) { + try { + fn(); + } catch (e) { + if (e.code == code) { + $(id).setAttribute('fill', 'green'); + return; + } + } + $(id).setAttribute('fill', 'red'); + } + + // SVGAnimatedNumberList: rotate on text + expect_exception + ('r1a', + function() { text.rotate.animVal.clear(); }, + 7 /* DOMException.NO_MODIFICATION_ALLOWED_ERR */); + + // SVGAnimatedLength: r on circle + expect_exception + ('r2a', + function() { circle.r.animVal.value = 123; }, + 7 /* DOMException.NO_MODIFICATION_ALLOWED_ERR */); + + // SVGAnimatedLengthList: x on text + expect_exception + ('r3a', + function() { text.x.animVal.clear(); }, + 7 /* DOMException.NO_MODIFICATION_ALLOWED_ERR */); + + // SVGAnimatedAngle: orient on marker + expect_exception + ('r4a', + function() { marker.orientAngle.animVal.value = 123; }, + 7 /* DOMException.NO_MODIFICATION_ALLOWED_ERR */); + + // SVGAnimatedRect: viewBox on svg + expect_exception + ('r5a', + function() { svg.viewBox.animVal.x = 123; }, + 7 /* DOMException.NO_MODIFICATION_ALLOWED_ERR */); + + // SVGAnimatedTransformList: transform on circle + expect_exception + ('r6a', + function() { circle.transform.animVal.clear(); }, + 7 /* DOMException.NO_MODIFICATION_ALLOWED_ERR */); + + // SVGAnimatedPreserveAspectRatio: preserveAspectRatio on svg + expect_exception + ('r7a', + function() { svg.preserveAspectRatio.animVal.align = 1; }, + 7 /* DOMException.NO_MODIFICATION_ALLOWED_ERR */); + ]]></script> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.2 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --><!-- + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g>--> +</svg> diff --git a/testing/web-platform/tests/svg/import/types-dom-08-f-manual.svg b/testing/web-platform/tests/svg/import/types-dom-08-f-manual.svg new file mode 100644 index 000000000..b2d1eaf62 --- /dev/null +++ b/testing/web-platform/tests/svg/import/types-dom-08-f-manual.svg @@ -0,0 +1,189 @@ +<svg id="svg-root" width="100%" height="100%" + viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" + template-version="1.4" reviewer="[reviewer]" author="ED" status="created" + version="$Revision: 1.1 $" testname="$RCSfile: types-dom-08-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/types.html#InterfaceSVGLocatable"> + <p> + This test draws a few basic shapes and checks for correct values from getBBox(). + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + To pass, each returned bounding box must be correct (indicated by printing the values in green), and when this happens the text in the rect with blue stroke changes from 'failed' to 'passed'. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: types-dom-08-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <defs> + <rect id="myRect" x="0" y="0" width="60" height="40"/> + </defs> + + <g id="body"> + <g id="wrap" transform="translate(300,100)"> + <g id="group1" transform="translate(10, 20)" fill="#ff0"> + <rect id="rect1" transform="scale(2)" x="10" y="10" width="50" height="50"/> + <rect id="rect2" x="10" y="10" width="100" height="100"/> + <g id="group2" transform="translate(10, 20)"> + <rect id="rect3" x="0" y="10" width="150" height="50"/> + <circle id="circle1" cx="20" cy="20" r="100" /> + </g> + </g> + <rect id="rect4" x="10" y="10" width="400" height="0"/> + <use id="myUse" xlink:href="#myRect" x="-30" y="-20" fill="#ff0"/> + <g id="emptyG"/> + <line id="thickLine" stroke-width="10" x2="100" y2="0" stroke="#ff0"/> + </g> + + <circle id="circle2" cx="20" cy="20" r="100" /> + + <text x="240" y="40" text-anchor="middle" >SVGLocatable.getBBox() - basic test</text> + + <rect x="330" y="315" width="130" height="40" stroke="blue" fill="none"/> + <g fill="black"> + <text id="TestStatus" x="333" y="350" font-size="40">failed</text> + </g> + </g> + + <script><![CDATA[ + var svg_ns = "http://www.w3.org/2000/svg"; + var xlink_ns = "http://www.w3.org/1999/xlink"; + + var count=0; + var topsvg = document.documentElement; + var startY = 80; + var rowHeight = 12; + var fontSize = "10"; + var isPassed = true; + + function drawString( text, color ) + { + node_to_insert=document.createElementNS(svg_ns,"text"); + node_to_insert.setAttributeNS(null,"font-size",fontSize); + var xVal = 5; + node_to_insert.setAttributeNS(null,"x", xVal.toString()); + var yVal = startY + count++ * rowHeight; + node_to_insert.setAttributeNS(null, "y", yVal.toString()); + node_to_insert.setAttributeNS(null, "fill", color ); + node_to_insert.appendChild(document.createTextNode(text)); + document.getElementById( "test-body-content" ).appendChild(node_to_insert); + + } + + function verifyBBox( bbox, x, y, width, height, epsilon ) + { + if + ( + ( Math.abs(bbox.x - x ) < epsilon ) && + ( Math.abs(bbox.y - y ) < epsilon ) && + ( Math.abs(bbox.width - width ) < epsilon ) && + ( Math.abs(bbox.height - height ) < epsilon ) + ) + { + return "green"; + } + else + { + isPassed = false; + drawString( "Results do not match expected values ( " + x + ", " + y + ", " + width + ", " + height + " )", "red" ); + return "red"; + } + } + + function displayGetBBox( ) + { + drawString( "getBBox()", "black" ); + var bbox = document.getElementById( "group1" ).getBBox( ); + drawString( "[group1] " + bbox.x + " " + bbox.y + " " + bbox.width + " " + bbox.height, verifyBBox( bbox, -70, -60, 230, 200, 1 / 65535 ) ); + + bbox = document.getElementById( "rect1" ).getBBox( ); + drawString( "[rect1] " + bbox.x + " " + bbox.y + " " + bbox.width + " " + bbox.height, verifyBBox( bbox, 10, 10, 50, 50, 1 / 65535 )); + + bbox = document.getElementById( "rect2" ).getBBox( ); + drawString( "[rect2] " + bbox.x + " " + bbox.y + " " + bbox.width + " " + bbox.height , verifyBBox( bbox, 10, 10, 100, 100, 1 / 65535 )); + + bbox = document.getElementById( "group2" ).getBBox( ); + drawString( "[group2] " + bbox.x + " " + bbox.y + " " + bbox.width + " " + bbox.height, verifyBBox( bbox, -80, -80, 230, 200, 1 / 65535 )); + + bbox = document.getElementById( "rect3" ).getBBox( ); + drawString( "[rect3] " + bbox.x + " " + bbox.y + " " + bbox.width + " " + bbox.height , verifyBBox( bbox, 0, 10, 150, 50, 1 / 65535 )); + + bbox = document.getElementById( "circle1" ).getBBox( ); + drawString( "[circle1] " + bbox.x + " " + bbox.y + " " + bbox.width + " " + bbox.height , verifyBBox( bbox, -80, -80, 200, 200, 1 / 65535 )); + + bbox = document.getElementById( "rect4" ).getBBox( ); + drawString( "[rect4] " + bbox.x + " " + bbox.y + " " + bbox.width + " " + bbox.height, verifyBBox( bbox, 10, 10, 400, 0, 1 / 65535 )); + + bbox = document.getElementById( "myUse" ).getBBox( ); + drawString( "[myUse] " + bbox.x + " " + bbox.y + " " + bbox.width + " " + bbox.height , verifyBBox( bbox, -30, -20, 60, 40, 1 / 65535 )); + + bbox = document.getElementById( "thickLine" ).getBBox( ); + drawString( "[thickLine] " + bbox.x + " " + bbox.y + " " + bbox.width + " " + bbox.height , verifyBBox( bbox, 0, 0, 100, 0, 1 / 65535 )); + + } + + displayGetBBox(); + + // remove from tree, get bbox + drawString( "node removed from tree, should still have bounding box", "black" ); + circle = document.getElementById( "circle2" ); + document.getElementById( "body" ).removeChild(circle); + bbox = circle.getBBox( ); + drawString( "[circle2]: " + bbox.x + " " + bbox.y + " " + bbox.width + " " + bbox.height , verifyBBox( bbox, -80, -80, 200, 200, 1 / 65535 )); + + var emptyG = document.getElementById( "emptyG" ); + bbox = emptyG.getBBox( ); + if ( bbox == null ) + { + drawString( "[emptyG]: null" , "green"); + } + else + { + isPassed = false; + drawString( "Results do not match expected values (null)" , "red"); + } + + + if( isPassed ) + { + var status = document.getElementById("TestStatus"); + status.firstChild.nodeValue = "passed" ; + status.setAttribute( "fill", "green"); + } + ]]></script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.1 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/types-dom-svgfittoviewbox-01-f-manual.svg b/testing/web-platform/tests/svg/import/types-dom-svgfittoviewbox-01-f-manual.svg new file mode 100644 index 000000000..e78792502 --- /dev/null +++ b/testing/web-platform/tests/svg/import/types-dom-svgfittoviewbox-01-f-manual.svg @@ -0,0 +1,88 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= SVG 1.1 2nd Edition Test Case =--> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="[reviewer]" author="Microsoft" status="created" version="$Revision: 1.5 $" testname="$RCSfile: types-dom-svgfittoviewbox-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/types.html#InterfaceSVGFitToViewBox"> + <p> + Retrieving the 'viewBox' and 'preserveAspectRatio' attributes of the 'SVGFitToViewBox' interface is supported. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Run the test. No interaction required. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: types-dom-svgfittoviewbox-01-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-size="18"> + <svg id="testSvg" viewBox="0 0 300 200" preserveAspectRatio="xMinYMin slice" /> + <text id="failText" x="100" y="100" font-size="80" fill="red">FAIL</text> + <text id="passText" x="350" y="300" font-size="50" display="none">PASS</text> + <script type="text/javascript"> + <![CDATA[ + + try + { + var testElement = document.getElementById("testSvg"); + var viewBox = testElement.viewBox.baseVal; + var preserveAspectRatioAlign = testElement.preserveAspectRatio.baseVal.align; + var passingTests = 0; + + if ((0 == viewBox.x) && (0 == viewBox.y) && (300 == viewBox.width) && (200 == viewBox.height)) + { + passingTests++; + } + + if (SVGPreserveAspectRatio.SVG_PRESERVEASPECTRATIO_XMINYMIN == preserveAspectRatioAlign && SVGPreserveAspectRatio.SVG_MEETORSLICE_SLICE == testElement.preserveAspectRatio.baseVal.meetOrSlice) + { + passingTests++; + } + + if (2 == passingTests) + { + document.getElementById("failText").setAttribute("display", "none"); + document.getElementById("passText").setAttribute("display", "inline"); + } + } + catch(ex) + { + alert("ERROR: " + ex.message); + + } + ]]> + + </script> + + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/types-dom-svglengthlist-01-f-manual.svg b/testing/web-platform/tests/svg/import/types-dom-svglengthlist-01-f-manual.svg new file mode 100644 index 000000000..615cc649e --- /dev/null +++ b/testing/web-platform/tests/svg/import/types-dom-svglengthlist-01-f-manual.svg @@ -0,0 +1,114 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="CM" author="Microsoft" status="reviewed" version="$Revision: 1.4 $" testname="$RCSfile: types-dom-svglengthlist-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/types.html#InterfaceSVGLengthList"> + <p> + The 'getItem', 'replaceItem', and 'removeItem' operations of the 'SVGLengthList' interface raise the 'INDEX_SIZE_ERR' exception when the specified + index number is greater than the number of items in the list. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Retrieve a 'SVGLengthList' object by getting the 'baseVal' attribute from the 'x' object of a 'SVGTextElement'. Attempt to call 'getItem', + 'replaceItem', and 'removeItem' with an index larger than the number of items in the list. For each of these operations, verify there was an + exception of type 'INDEX_SIZE_ERR' thrown. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: types-dom-svglengthlist-01-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text id="test" /> + <g transform="translate(96, 96)" font-size="100"> + <text id="failText" fill="red">FAIL</text> + <text id="passText" fill="green" display="none">PASS</text> + </g> + <script type="text/javascript"><![CDATA[ + try + { + var testElement = document.getElementById("test"); + var svgList = testElement.x.baseVal; + var passingTests = 0; + + try + { + svgList.getItem(5); + } + catch (ex) + { + if (DOMException.INDEX_SIZE_ERR == ex.code) + { + passingTests++; + } + } + + try + { + var svgElement = testElement.ownerSVGElement; + var svgLength = svgElement.createSVGLength(); + svgLength.valueAsString = "100px"; + svgList.replaceItem(svgLength, 5); + } + catch (ex) + { + if (DOMException.INDEX_SIZE_ERR == ex.code) + { + passingTests++; + } + } + + try + { + svgList.removeItem(5); + } + catch (ex) + { + if (DOMException.INDEX_SIZE_ERR == ex.code) + { + passingTests++; + } + } + + if (3 == passingTests) + { + document.getElementById("failText").setAttribute("display", "none"); + document.getElementById("passText").setAttribute("display", "inline"); + } + } + catch(ex) + { + alert("ERROR: " + ex.message); + }]]> + </script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/types-dom-svgnumberlist-01-f-manual.svg b/testing/web-platform/tests/svg/import/types-dom-svgnumberlist-01-f-manual.svg new file mode 100644 index 000000000..96e230cfe --- /dev/null +++ b/testing/web-platform/tests/svg/import/types-dom-svgnumberlist-01-f-manual.svg @@ -0,0 +1,114 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="CM" author="Microsoft" status="reviewed" version="$Revision: 1.5 $" testname="$RCSfile: types-dom-svgnumberlist-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/types.html#InterfaceSVGNumberList"> + <p> + The 'getItem', 'replaceItem', and 'removeItem' operations of the 'SVGNumberList' interface raise the 'INDEX_SIZE_ERR' exception when the specified + index number is greater than the number of items in the list. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Retrieve a 'SVGNumberList' object by getting the 'baseVal' attribute from the 'rotate' object of a 'SVGTextElement'. Attempt to call 'getItem', + 'replaceItem', and 'removeItem' with an index larger than the number of items in the list. For each of these operations, verify there was an + exception of type 'INDEX_SIZE_ERR' thrown. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: types-dom-svgnumberlist-01-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <text id="test" /> + <g transform="translate(96, 96)" font-size="100"> + <text id="failText" fill="red">FAIL</text> + <text id="passText" fill="green" display="none">PASS</text> + </g> + <script type="text/javascript"><![CDATA[ + try + { + var testElement = document.getElementById("test"); + var svgList = testElement.rotate.baseVal; + var passingTests = 0; + + try + { + svgList.getItem(5); + } + catch (ex) + { + if (DOMException.INDEX_SIZE_ERR == ex.code) + { + passingTests++; + } + } + + try + { + var svgElement = testElement.ownerSVGElement; + var svgNumber = svgElement.createSVGNumber(); + svgNumber.value = 100; + svgList.replaceItem(svgNumber, 5); + } + catch (ex) + { + if (DOMException.INDEX_SIZE_ERR == ex.code) + { + passingTests++; + } + } + + try + { + svgList.removeItem(5); + } + catch (ex) + { + if (DOMException.INDEX_SIZE_ERR == ex.code) + { + passingTests++; + } + } + + if (3 == passingTests) + { + document.getElementById("failText").setAttribute("display", "none"); + document.getElementById("passText").setAttribute("display", "inline"); + } + } + catch(ex) + { + alert("ERROR: " + ex.message); + }]]> + </script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/types-dom-svgstringlist-01-f-manual.svg b/testing/web-platform/tests/svg/import/types-dom-svgstringlist-01-f-manual.svg new file mode 100644 index 000000000..17a457c2c --- /dev/null +++ b/testing/web-platform/tests/svg/import/types-dom-svgstringlist-01-f-manual.svg @@ -0,0 +1,112 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="CM" author="Microsoft" status="reviewed" version="$Revision: 1.4 $" testname="$RCSfile: types-dom-svgstringlist-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/types.html#InterfaceSVGStringList"> + <p> + The 'getItem', 'replaceItem', and 'removeItem' operations of the 'SVGStringList' interface raise the 'INDEX_SIZE_ERR' exception when the specified index number + is greater than the number of items in the list. + </p> + </d:testDescription> + <d:operatorScript xmlns="http://www.w3.org/1999/xhtml"> + <p> + Retrieve a 'SVGStringList' object by getting the 'requiredExtensions' attribute from a 'SVGSVGElement'. Attempt to call 'getItem', 'replaceItem', + and 'removeItem' with an index larger than the number of items in the list. For each of these operations, verify there was an exception of type 'INDEX_SIZE_ERR' thrown. + </p> + </d:operatorScript> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: types-dom-svgstringlist-01-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <svg id="test" /> + <g transform="translate(96, 96)" font-size="100"> + <text id="failText" fill="red">FAIL</text> + <text id="passText" fill="green" display="none">PASS</text> + </g> + <script type="text/javascript"><![CDATA[ + try + { + var testElement = document.getElementById("test"); + var svgList = testElement.requiredExtensions; + var passingTests = 0; + + try + { + svgList.getItem(5); + } + catch (ex) + { + if (DOMException.INDEX_SIZE_ERR == ex.code) + { + passingTests++; + } + } + + try + { + svgList.replaceItem("fakeValue", 5); + } + catch (ex) + { + if (DOMException.INDEX_SIZE_ERR == ex.code) + { + passingTests++; + } + } + + try + { + svgList.removeItem(5); + } + catch (ex) + { + if (DOMException.INDEX_SIZE_ERR == ex.code) + { + passingTests++; + } + } + + if (3 == passingTests) + { + document.getElementById("failText").setAttribute("display", "none"); + document.getElementById("passText").setAttribute("display", "inline"); + } + } + catch(ex) + { + + alert("ERROR: " + ex.message); + + }]]> + </script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.4 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/types-dom-svgtransformable-01-f-manual.svg b/testing/web-platform/tests/svg/import/types-dom-svgtransformable-01-f-manual.svg new file mode 100644 index 000000000..15aa68601 --- /dev/null +++ b/testing/web-platform/tests/svg/import/types-dom-svgtransformable-01-f-manual.svg @@ -0,0 +1,82 @@ +<svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <!--======================================================================--> + <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> + <!--= Institute of Technology, European Research Consortium for =--> + <!--= Informatics and Mathematics (ERCIM), Keio University). =--> + <!--= All Rights Reserved. =--> + <!--= See http://www.w3.org/Consortium/Legal/. =--> + <!--======================================================================--> + <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" template-version="1.4" reviewer="CM" author="Microsoft" status="reviewed" version="$Revision: 1.5 $" testname="$RCSfile: types-dom-svgtransformable-01-f.svg,v $"> + <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://dev.w3.org/SVG/profiles/1.1F2/publish/types.html#InterfaceSVGTransformable"> + <p> + Retrieving and setting the 'transform' attribute of the 'SVGTransformable' interface is supported. + </p> + </d:testDescription> + <d:passCriteria xmlns="http://www.w3.org/1999/xhtml"> + <p> + Test passes if there is no red visible on the page. + </p> + </d:passCriteria> + </d:SVGTestCase> + <title id="test-title">$RCSfile: types-dom-svgtransformable-01-f.svg,v $</title> + <defs> + <font-face + font-family="SVGFreeSansASCII" + unicode-range="U+0-7F"> + <font-face-src> + <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> + </font-face-src> + </font-face> + </defs> + <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> + <g id="test" transform="translate(10)" /> + <g transform="translate(100, 100)" font-size="80"> + <text id="failText" fill="red">FAIL</text> + <text id="passText" fill="green" display="none">PASS</text> + </g> + <script type="text/javascript"><![CDATA[ + try + { + var testElement = document.getElementById("test"); + var passingTests = 0; + + if (SVGTransform.SVG_TRANSFORM_TRANSLATE == testElement.transform.baseVal.getItem(0).type) + { + passingTests++; + } + + var svgElement = testElement.ownerSVGElement; + var svgTransform = svgElement.createSVGTransform(); + svgTransform.setRotate(45, 0, 0); + testElement.transform.baseVal.clear(); + testElement.transform.baseVal.appendItem(svgTransform); + + if (SVGTransform.SVG_TRANSFORM_ROTATE == testElement.transform.baseVal.getItem(0).type) + { + passingTests++; + } + + if (2 == passingTests) + { + document.getElementById("failText").setAttribute("display", "none"); + document.getElementById("passText").setAttribute("display", "inline"); + } + } + catch(ex) + { + alert('ERROR: ' + ex.message); + }]]> + </script> + </g> + <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> + <text id="revision" x="10" y="340" stroke="none" + fill="black">$Revision: 1.5 $</text> + </g> + <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> + <!-- comment out this watermark once the test is approved --> + <g id="draft-watermark"> + <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> + <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" + text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/import/woffs/Blocky.woff b/testing/web-platform/tests/svg/import/woffs/Blocky.woff Binary files differnew file mode 100755 index 000000000..1d7e05f28 --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/Blocky.woff diff --git a/testing/web-platform/tests/svg/import/woffs/EzraSILSR.woff b/testing/web-platform/tests/svg/import/woffs/EzraSILSR.woff Binary files differnew file mode 100755 index 000000000..1bae45f6a --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/EzraSILSR.woff diff --git a/testing/web-platform/tests/svg/import/woffs/FreeMono.woff b/testing/web-platform/tests/svg/import/woffs/FreeMono.woff Binary files differnew file mode 100755 index 000000000..1e64a3825 --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/FreeMono.woff diff --git a/testing/web-platform/tests/svg/import/woffs/FreeMonoBold.woff b/testing/web-platform/tests/svg/import/woffs/FreeMonoBold.woff Binary files differnew file mode 100755 index 000000000..4aa6ae54c --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/FreeMonoBold.woff diff --git a/testing/web-platform/tests/svg/import/woffs/FreeMonoBoldOblique.woff b/testing/web-platform/tests/svg/import/woffs/FreeMonoBoldOblique.woff Binary files differnew file mode 100755 index 000000000..7d21de02e --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/FreeMonoBoldOblique.woff diff --git a/testing/web-platform/tests/svg/import/woffs/FreeMonoOblique.woff b/testing/web-platform/tests/svg/import/woffs/FreeMonoOblique.woff Binary files differnew file mode 100755 index 000000000..a67b1cc07 --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/FreeMonoOblique.woff diff --git a/testing/web-platform/tests/svg/import/woffs/FreeSans.woff b/testing/web-platform/tests/svg/import/woffs/FreeSans.woff Binary files differnew file mode 100755 index 000000000..54e5d5914 --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/FreeSans.woff diff --git a/testing/web-platform/tests/svg/import/woffs/FreeSansASCII.woff b/testing/web-platform/tests/svg/import/woffs/FreeSansASCII.woff Binary files differnew file mode 100755 index 000000000..98c356e0d --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/FreeSansASCII.woff diff --git a/testing/web-platform/tests/svg/import/woffs/FreeSansBold.woff b/testing/web-platform/tests/svg/import/woffs/FreeSansBold.woff Binary files differnew file mode 100755 index 000000000..2baf73dcd --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/FreeSansBold.woff diff --git a/testing/web-platform/tests/svg/import/woffs/FreeSansBoldOblique.woff b/testing/web-platform/tests/svg/import/woffs/FreeSansBoldOblique.woff Binary files differnew file mode 100755 index 000000000..588b3dff6 --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/FreeSansBoldOblique.woff diff --git a/testing/web-platform/tests/svg/import/woffs/FreeSansOblique.woff b/testing/web-platform/tests/svg/import/woffs/FreeSansOblique.woff Binary files differnew file mode 100755 index 000000000..b522f2db9 --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/FreeSansOblique.woff diff --git a/testing/web-platform/tests/svg/import/woffs/FreeSerif.woff b/testing/web-platform/tests/svg/import/woffs/FreeSerif.woff Binary files differnew file mode 100755 index 000000000..280e95d66 --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/FreeSerif.woff diff --git a/testing/web-platform/tests/svg/import/woffs/FreeSerifBold.woff b/testing/web-platform/tests/svg/import/woffs/FreeSerifBold.woff Binary files differnew file mode 100755 index 000000000..f0ed36bc9 --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/FreeSerifBold.woff diff --git a/testing/web-platform/tests/svg/import/woffs/FreeSerifBoldItalic.woff b/testing/web-platform/tests/svg/import/woffs/FreeSerifBoldItalic.woff Binary files differnew file mode 100755 index 000000000..e8479dc8a --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/FreeSerifBoldItalic.woff diff --git a/testing/web-platform/tests/svg/import/woffs/FreeSerifItalic.woff b/testing/web-platform/tests/svg/import/woffs/FreeSerifItalic.woff Binary files differnew file mode 100755 index 000000000..2c2dd906c --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/FreeSerifItalic.woff diff --git a/testing/web-platform/tests/svg/import/woffs/PlaneOne.woff b/testing/web-platform/tests/svg/import/woffs/PlaneOne.woff Binary files differnew file mode 100755 index 000000000..6982ef7ac --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/PlaneOne.woff diff --git a/testing/web-platform/tests/svg/import/woffs/ScheherazadeRegOT.woff b/testing/web-platform/tests/svg/import/woffs/ScheherazadeRegOT.woff Binary files differnew file mode 100755 index 000000000..97e6b1f9f --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/ScheherazadeRegOT.woff diff --git a/testing/web-platform/tests/svg/import/woffs/Tribase.woff b/testing/web-platform/tests/svg/import/woffs/Tribase.woff Binary files differnew file mode 100755 index 000000000..ce5074cdc --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/Tribase.woff diff --git a/testing/web-platform/tests/svg/import/woffs/ZCB.woff b/testing/web-platform/tests/svg/import/woffs/ZCB.woff Binary files differnew file mode 100755 index 000000000..62a622c83 --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/ZCB.woff diff --git a/testing/web-platform/tests/svg/import/woffs/ZCL.woff b/testing/web-platform/tests/svg/import/woffs/ZCL.woff Binary files differnew file mode 100755 index 000000000..6a878d882 --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/ZCL.woff diff --git a/testing/web-platform/tests/svg/import/woffs/ZCR.woff b/testing/web-platform/tests/svg/import/woffs/ZCR.woff Binary files differnew file mode 100755 index 000000000..73f945693 --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/ZCR.woff diff --git a/testing/web-platform/tests/svg/import/woffs/ZCSB.woff b/testing/web-platform/tests/svg/import/woffs/ZCSB.woff Binary files differnew file mode 100755 index 000000000..7ffbe5b85 --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/ZCSB.woff diff --git a/testing/web-platform/tests/svg/import/woffs/ZCXB.woff b/testing/web-platform/tests/svg/import/woffs/ZCXB.woff Binary files differnew file mode 100755 index 000000000..00c80c9d3 --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/ZCXB.woff diff --git a/testing/web-platform/tests/svg/import/woffs/ZCXL.woff b/testing/web-platform/tests/svg/import/woffs/ZCXL.woff Binary files differnew file mode 100755 index 000000000..05b0fbf69 --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/ZCXL.woff diff --git a/testing/web-platform/tests/svg/import/woffs/anglepoi.woff b/testing/web-platform/tests/svg/import/woffs/anglepoi.woff Binary files differnew file mode 100755 index 000000000..07dd6d03e --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/anglepoi.woff diff --git a/testing/web-platform/tests/svg/import/woffs/embeded-text-text-04.woff b/testing/web-platform/tests/svg/import/woffs/embeded-text-text-04.woff Binary files differnew file mode 100755 index 000000000..288fdf805 --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/embeded-text-text-04.woff diff --git a/testing/web-platform/tests/svg/import/woffs/embeded-text-text-05.woff b/testing/web-platform/tests/svg/import/woffs/embeded-text-text-05.woff Binary files differnew file mode 100755 index 000000000..ebeb05ec7 --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/embeded-text-text-05.woff diff --git a/testing/web-platform/tests/svg/import/woffs/embeded-text-text-06.woff b/testing/web-platform/tests/svg/import/woffs/embeded-text-text-06.woff Binary files differnew file mode 100755 index 000000000..d3095c0e1 --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/embeded-text-text-06.woff diff --git a/testing/web-platform/tests/svg/import/woffs/embeded.woff b/testing/web-platform/tests/svg/import/woffs/embeded.woff Binary files differnew file mode 100755 index 000000000..288fdf805 --- /dev/null +++ b/testing/web-platform/tests/svg/import/woffs/embeded.woff diff --git a/testing/web-platform/tests/svg/interfaces.html b/testing/web-platform/tests/svg/interfaces.html new file mode 100644 index 000000000..3fb951baa --- /dev/null +++ b/testing/web-platform/tests/svg/interfaces.html @@ -0,0 +1,1565 @@ +<!doctype html> +<title>SVG interface tests</title> +<div id=log></div> +<script src=/resources/testharness.js></script> +<script src=/resources/testharnessreport.js></script> +<script src=/resources/WebIDLParser.js></script> +<script src=/resources/idlharness.js></script> +<script type=text/plain id=untested_idl> +interface EventTarget {}; +interface Node : EventTarget {}; +interface Document : Node {}; +interface ProcessingInstruction : Node {}; +interface Element : Node {}; +interface HTMLElement : Element {}; +[PrimaryGlobal] interface Window {}; + +// Just need to know that DOMStringMap exists; its details are tested elsewhere. +interface DOMStringMap { }; + +[TreatNonObjectAsNull] +callback EventHandlerNonNull = any (Event event); +typedef EventHandlerNonNull? EventHandler; + +[TreatNonObjectAsNull] +callback OnErrorEventHandlerNonNull = any ((Event or DOMString) event, optional DOMString source, optional unsigned long lineno, optional unsigned long column, optional any error); +typedef OnErrorEventHandlerNonNull? OnErrorEventHandler; + +[TreatNonObjectAsNull] +callback OnBeforeUnloadEventHandlerNonNull = DOMString? (Event event); +typedef OnBeforeUnloadEventHandlerNonNull? OnBeforeUnloadEventHandler; + +[NoInterfaceObject] +interface GlobalEventHandlers { + attribute EventHandler onabort; + attribute EventHandler onautocomplete; + attribute EventHandler onautocompleteerror; + attribute EventHandler onblur; + attribute EventHandler oncancel; + attribute EventHandler oncanplay; + attribute EventHandler oncanplaythrough; + attribute EventHandler onchange; + attribute EventHandler onclick; + attribute EventHandler onclose; + attribute EventHandler oncontextmenu; + attribute EventHandler oncuechange; + attribute EventHandler ondblclick; + attribute EventHandler ondrag; + attribute EventHandler ondragend; + attribute EventHandler ondragenter; + attribute EventHandler ondragexit; + attribute EventHandler ondragleave; + attribute EventHandler ondragover; + attribute EventHandler ondragstart; + attribute EventHandler ondrop; + attribute EventHandler ondurationchange; + attribute EventHandler onemptied; + attribute EventHandler onended; + attribute OnErrorEventHandler onerror; + attribute EventHandler onfocus; + attribute EventHandler oninput; + attribute EventHandler oninvalid; + attribute EventHandler onkeydown; + attribute EventHandler onkeypress; + attribute EventHandler onkeyup; + attribute EventHandler onload; + attribute EventHandler onloadeddata; + attribute EventHandler onloadedmetadata; + attribute EventHandler onloadstart; + attribute EventHandler onmousedown; + [LenientThis] attribute EventHandler onmouseenter; + [LenientThis] attribute EventHandler onmouseleave; + attribute EventHandler onmousemove; + attribute EventHandler onmouseout; + attribute EventHandler onmouseover; + attribute EventHandler onmouseup; + attribute EventHandler onwheel; + attribute EventHandler onpause; + attribute EventHandler onplay; + attribute EventHandler onplaying; + attribute EventHandler onprogress; + attribute EventHandler onratechange; + attribute EventHandler onreset; + attribute EventHandler onresize; + attribute EventHandler onscroll; + attribute EventHandler onseeked; + attribute EventHandler onseeking; + attribute EventHandler onselect; + attribute EventHandler onshow; + attribute EventHandler onsort; + attribute EventHandler onstalled; + attribute EventHandler onsubmit; + attribute EventHandler onsuspend; + attribute EventHandler ontimeupdate; + attribute EventHandler ontoggle; + attribute EventHandler onvolumechange; + attribute EventHandler onwaiting; +}; + +[NoInterfaceObject] +interface WindowEventHandlers { + attribute EventHandler onafterprint; + attribute EventHandler onbeforeprint; + attribute OnBeforeUnloadEventHandler onbeforeunload; + attribute EventHandler onhashchange; + attribute EventHandler onlanguagechange; + attribute EventHandler onmessage; + attribute EventHandler onoffline; + attribute EventHandler ononline; + attribute EventHandler onpagehide; + attribute EventHandler onpageshow; + attribute EventHandler onpopstate; + attribute EventHandler onrejectionhandled; + attribute EventHandler onstorage; + attribute EventHandler onunhandledrejection; + attribute EventHandler onunload; +}; + +[NoInterfaceObject]interface LinkStyle { + readonly attribute StyleSheet? sheet; +}; + + +[Constructor(optional unrestricted double x = 0, optional unrestricted double y = 0, + optional unrestricted double z = 0, optional unrestricted double w = 1), + Exposed=(Window,Worker)] +interface DOMPointReadOnly { + [NewObject] static DOMPointReadOnly fromPoint(optional DOMPointInit point); + + readonly attribute unrestricted double x; + readonly attribute unrestricted double y; + readonly attribute unrestricted double z; + readonly attribute unrestricted double w; + + DOMPoint matrixTransform(optional DOMMatrixInit matrix); +}; + +[Constructor(optional unrestricted double x = 0, optional unrestricted double y = 0, + optional unrestricted double z = 0, optional unrestricted double w = 1), + Exposed=(Window,Worker)] +interface DOMPoint : DOMPointReadOnly { + [NewObject] static DOMPoint fromPoint(optional DOMPointInit other); + + inherit attribute unrestricted double x; + inherit attribute unrestricted double y; + inherit attribute unrestricted double z; + inherit attribute unrestricted double w; +}; + +dictionary DOMPointInit { + unrestricted double x = 0; + unrestricted double y = 0; + unrestricted double z = 0; + unrestricted double w = 1; +}; + +[Constructor(optional unrestricted double x = 0, optional unrestricted double y = 0, + optional unrestricted double width = 0, optional unrestricted double height = 0), + Exposed=(Window,Worker)] +interface DOMRectReadOnly { + [NewObject] static DOMRectReadOnly fromRect(optional DOMRectInit other); + + readonly attribute unrestricted double x; + readonly attribute unrestricted double y; + readonly attribute unrestricted double width; + readonly attribute unrestricted double height; + readonly attribute unrestricted double top; + readonly attribute unrestricted double right; + readonly attribute unrestricted double bottom; + readonly attribute unrestricted double left; +}; + +[Constructor(optional unrestricted double x = 0, optional unrestricted double y = 0, + optional unrestricted double width = 0, optional unrestricted double height = 0), + Exposed=(Window,Worker)] +interface DOMRect : DOMRectReadOnly { + [NewObject] static DOMRect fromRect(optional DOMRectInit other); + + inherit attribute unrestricted double x; + inherit attribute unrestricted double y; + inherit attribute unrestricted double width; + inherit attribute unrestricted double height; +}; + +dictionary DOMRectInit { + unrestricted double x = 0; + unrestricted double y = 0; + unrestricted double width = 0; + unrestricted double height = 0; +}; + +[Constructor(sequence<unrestricted double> numberSequence), + Exposed=(Window,Worker)] +interface DOMMatrixReadOnly { + [NewObject] static DOMMatrixReadOnly fromMatrix(optional DOMMatrixInit other); + [NewObject] static DOMMatrixReadOnly fromString(DOMString transformList); + [NewObject] static DOMMatrixReadOnly fromFloat32Array(Float32Array array32); + [NewObject] static DOMMatrixReadOnly fromFloat64Array(Float64Array array64); + + // These attributes are simple aliases for certain elements of the 4x4 matrix + readonly attribute unrestricted double a; + readonly attribute unrestricted double b; + readonly attribute unrestricted double c; + readonly attribute unrestricted double d; + readonly attribute unrestricted double e; + readonly attribute unrestricted double f; + + readonly attribute unrestricted double m11; + readonly attribute unrestricted double m12; + readonly attribute unrestricted double m13; + readonly attribute unrestricted double m14; + readonly attribute unrestricted double m21; + readonly attribute unrestricted double m22; + readonly attribute unrestricted double m23; + readonly attribute unrestricted double m24; + readonly attribute unrestricted double m31; + readonly attribute unrestricted double m32; + readonly attribute unrestricted double m33; + readonly attribute unrestricted double m34; + readonly attribute unrestricted double m41; + readonly attribute unrestricted double m42; + readonly attribute unrestricted double m43; + readonly attribute unrestricted double m44; + + readonly attribute boolean is2D; + readonly attribute boolean isIdentity; + + // Immutable transform methods + DOMMatrix translate(unrestricted double tx, + unrestricted double ty, + optional unrestricted double tz = 0); + DOMMatrix scale(unrestricted double scale, + optional unrestricted double originX = 0, + optional unrestricted double originY = 0); + DOMMatrix scale3d(unrestricted double scale, + optional unrestricted double originX = 0, + optional unrestricted double originY = 0, + optional unrestricted double originZ = 0); + DOMMatrix scaleNonUniform(unrestricted double scaleX, + optional unrestricted double scaleY = 1, + optional unrestricted double scaleZ = 1, + optional unrestricted double originX = 0, + optional unrestricted double originY = 0, + optional unrestricted double originZ = 0); + DOMMatrix rotate(unrestricted double angle, + optional unrestricted double originX = 0, + optional unrestricted double originY = 0); + DOMMatrix rotateFromVector(unrestricted double x, + unrestricted double y); + DOMMatrix rotateAxisAngle(unrestricted double x, + unrestricted double y, + unrestricted double z, + unrestricted double angle); + DOMMatrix skewX(unrestricted double sx); + DOMMatrix skewY(unrestricted double sy); + DOMMatrix multiply(optional DOMMatrixInit other); + DOMMatrix flipX(); + DOMMatrix flipY(); + DOMMatrix inverse(); + + DOMPoint transformPoint(optional DOMPointInit point); + Float32Array toFloat32Array(); + Float64Array toFloat64Array(); + stringifier; +}; + +[Constructor(sequence<unrestricted double> numberSequence), + Exposed=(Window,Worker)] +interface DOMMatrix : DOMMatrixReadOnly { + [NewObject] static DOMMatrix fromMatrix(optional DOMMatrixInit other); + [NewObject] static DOMMatrix fromString(DOMString transformList); + [NewObject] static DOMMatrix fromFloat32Array(Float32Array array32); + [NewObject] static DOMMatrix fromFloat64Array(Float64Array array64); + + // These attributes are simple aliases for certain elements of the 4x4 matrix + inherit attribute unrestricted double a; + inherit attribute unrestricted double b; + inherit attribute unrestricted double c; + inherit attribute unrestricted double d; + inherit attribute unrestricted double e; + inherit attribute unrestricted double f; + + inherit attribute unrestricted double m11; + inherit attribute unrestricted double m12; + inherit attribute unrestricted double m13; + inherit attribute unrestricted double m14; + inherit attribute unrestricted double m21; + inherit attribute unrestricted double m22; + inherit attribute unrestricted double m23; + inherit attribute unrestricted double m24; + inherit attribute unrestricted double m31; + inherit attribute unrestricted double m32; + inherit attribute unrestricted double m33; + inherit attribute unrestricted double m34; + inherit attribute unrestricted double m41; + inherit attribute unrestricted double m42; + inherit attribute unrestricted double m43; + inherit attribute unrestricted double m44; + + // Mutable transform methods + DOMMatrix multiplySelf(optional DOMMatrixInit other); + DOMMatrix preMultiplySelf(optional DOMMatrixInit other); + DOMMatrix translateSelf(unrestricted double tx, + unrestricted double ty, + optional unrestricted double tz = 0); + DOMMatrix scaleSelf(unrestricted double scale, + optional unrestricted double originX = 0, + optional unrestricted double originY = 0); + DOMMatrix scale3dSelf(unrestricted double scale, + optional unrestricted double originX = 0, + optional unrestricted double originY = 0, + optional unrestricted double originZ = 0); + DOMMatrix scaleNonUniformSelf(unrestricted double scaleX, + optional unrestricted double scaleY = 1, + optional unrestricted double scaleZ = 1, + optional unrestricted double originX = 0, + optional unrestricted double originY = 0, + optional unrestricted double originZ = 0); + DOMMatrix rotateSelf(unrestricted double angle, + optional unrestricted double originX = 0, + optional unrestricted double originY = 0); + DOMMatrix rotateFromVectorSelf(unrestricted double x, + unrestricted double y); + DOMMatrix rotateAxisAngleSelf(unrestricted double x, + unrestricted double y, + unrestricted double z, + unrestricted double angle); + DOMMatrix skewXSelf(unrestricted double sx); + DOMMatrix skewYSelf(unrestricted double sy); + DOMMatrix invertSelf(); + + DOMMatrix setMatrixValue(DOMString transformList); +}; + +dictionary DOMMatrixInit { + unrestricted double a; + unrestricted double b; + unrestricted double c; + unrestricted double d; + unrestricted double e; + unrestricted double f; + unrestricted double m11; + unrestricted double m12; + unrestricted double m13 = 0; + unrestricted double m14 = 0; + unrestricted double m21; + unrestricted double m22; + unrestricted double m23 = 0; + unrestricted double m24 = 0; + unrestricted double m31 = 0; + unrestricted double m32 = 0; + unrestricted double m33 = 1; + unrestricted double m34 = 0; + unrestricted double m41; + unrestricted double m42; + unrestricted double m43 = 0; + unrestricted double m44 = 1; + boolean is2D; +}; +</script> +<script type=text/plain id=idl> +interface SVGElement : Element { + + [SameObject] readonly attribute SVGAnimatedString className; + [SameObject] readonly attribute DOMStringMap dataset; + + readonly attribute SVGSVGElement? ownerSVGElement; + readonly attribute SVGElement? viewportElement; + + attribute long tabIndex; + void focus(); + void blur(); +}; + +SVGElement implements GlobalEventHandlers; + +dictionary SVGBoundingBoxOptions { + boolean fill = true; + boolean stroke = false; + boolean markers = false; + boolean clipped = false; +}; + +interface SVGGraphicsElement : SVGElement { + [SameObject] readonly attribute SVGAnimatedTransformList transform; + + DOMRect getBBox(optional SVGBoundingBoxOptions options); + DOMMatrix? getCTM(); + DOMMatrix? getScreenCTM(); +}; + +SVGGraphicsElement implements SVGTests; + +interface SVGGeometryElement : SVGGraphicsElement { + boolean isPointInFill(DOMPoint point); + boolean isPointInStroke(DOMPoint point); +}; + +interface SVGNumber { + attribute float value; +}; + +interface SVGLength { + + // Length Unit Types + const unsigned short SVG_LENGTHTYPE_UNKNOWN = 0; + const unsigned short SVG_LENGTHTYPE_NUMBER = 1; + const unsigned short SVG_LENGTHTYPE_PERCENTAGE = 2; + const unsigned short SVG_LENGTHTYPE_EMS = 3; + const unsigned short SVG_LENGTHTYPE_EXS = 4; + const unsigned short SVG_LENGTHTYPE_PX = 5; + const unsigned short SVG_LENGTHTYPE_CM = 6; + const unsigned short SVG_LENGTHTYPE_MM = 7; + const unsigned short SVG_LENGTHTYPE_IN = 8; + const unsigned short SVG_LENGTHTYPE_PT = 9; + const unsigned short SVG_LENGTHTYPE_PC = 10; + + readonly attribute unsigned short unitType; + attribute float value; + attribute float valueInSpecifiedUnits; + attribute DOMString valueAsString; + + void newValueSpecifiedUnits(unsigned short unitType, float valueInSpecifiedUnits); + void convertToSpecifiedUnits(unsigned short unitType); +}; + +interface SVGAngle { + + // Angle Unit Types + const unsigned short SVG_ANGLETYPE_UNKNOWN = 0; + const unsigned short SVG_ANGLETYPE_UNSPECIFIED = 1; + const unsigned short SVG_ANGLETYPE_DEG = 2; + const unsigned short SVG_ANGLETYPE_RAD = 3; + const unsigned short SVG_ANGLETYPE_GRAD = 4; + + readonly attribute unsigned short unitType; + attribute float value; + attribute float valueInSpecifiedUnits; + attribute DOMString valueAsString; + + void newValueSpecifiedUnits(unsigned short unitType, float valueInSpecifiedUnits); + void convertToSpecifiedUnits(unsigned short unitType); +}; + +interface SVGNumberList { + + readonly attribute unsigned long length; + readonly attribute unsigned long numberOfItems; + + void clear(); + SVGNumber initialize(SVGNumber newItem); + getter SVGNumber getItem(unsigned long index); + SVGNumber insertItemBefore(SVGNumber newItem, unsigned long index); + SVGNumber replaceItem(SVGNumber newItem, unsigned long index); + SVGNumber removeItem(unsigned long index); + SVGNumber appendItem(SVGNumber newItem); + setter void (unsigned long index, SVGNumber newItem); +}; + +interface SVGLengthList { + + readonly attribute unsigned long length; + readonly attribute unsigned long numberOfItems; + + void clear(); + SVGLength initialize(SVGLength newItem); + getter SVGLength getItem(unsigned long index); + SVGLength insertItemBefore(SVGLength newItem, unsigned long index); + SVGLength replaceItem(SVGLength newItem, unsigned long index); + SVGLength removeItem(unsigned long index); + SVGLength appendItem(SVGLength newItem); + setter void (unsigned long index, SVGLength newItem); +}; + +interface SVGAnimatedBoolean { + attribute boolean baseVal; + readonly attribute boolean animVal; +}; + +interface SVGAnimatedEnumeration { + attribute unsigned short baseVal; + readonly attribute unsigned short animVal; +}; + +interface SVGAnimatedInteger { + attribute long baseVal; + readonly attribute long animVal; +}; + +interface SVGAnimatedNumber { + attribute float baseVal; + readonly attribute float animVal; +}; + +interface SVGAnimatedLength { + [SameObject] readonly attribute SVGLength baseVal; + [SameObject] readonly attribute SVGLength animVal; +}; + +interface SVGAnimatedAngle { + [SameObject] readonly attribute SVGAngle baseVal; + [SameObject] readonly attribute SVGAngle animVal; +}; + +interface SVGAnimatedString { + attribute DOMString baseVal; + readonly attribute DOMString animVal; +}; + +interface SVGAnimatedRect { + [SameObject] readonly attribute DOMRect baseVal; + [SameObject] readonly attribute DOMRectReadOnly animVal; +}; + +interface SVGAnimatedNumberList { + [SameObject] readonly attribute SVGNumberList baseVal; + [SameObject] readonly attribute SVGNumberList animVal; +}; + +interface SVGAnimatedLengthList { + [SameObject] readonly attribute SVGLengthList baseVal; + [SameObject] readonly attribute SVGLengthList animVal; +}; + +interface SVGStringList { + + readonly attribute unsigned long length; + readonly attribute unsigned long numberOfItems; + + void clear(); + DOMString initialize(DOMString newItem); + getter DOMString getItem(unsigned long index); + DOMString insertItemBefore(DOMString newItem, unsigned long index); + DOMString replaceItem(DOMString newItem, unsigned long index); + DOMString removeItem(unsigned long index); + DOMString appendItem(DOMString newItem); + setter void (unsigned long index, DOMString newItem); +}; + +[NoInterfaceObject] +interface SVGUnitTypes { + // Unit Types + const unsigned short SVG_UNIT_TYPE_UNKNOWN = 0; + const unsigned short SVG_UNIT_TYPE_USERSPACEONUSE = 1; + const unsigned short SVG_UNIT_TYPE_OBJECTBOUNDINGBOX = 2; +}; + +[NoInterfaceObject] +interface SVGTests { + [SameObject] readonly attribute SVGStringList requiredExtensions; + [SameObject] readonly attribute SVGStringList systemLanguage; +}; + +[NoInterfaceObject] +interface SVGFitToViewBox { + [SameObject] readonly attribute SVGAnimatedRect viewBox; + [SameObject] readonly attribute SVGAnimatedPreserveAspectRatio preserveAspectRatio; +}; + +[NoInterfaceObject] +interface SVGZoomAndPan { + + // Zoom and Pan Types + const unsigned short SVG_ZOOMANDPAN_UNKNOWN = 0; + const unsigned short SVG_ZOOMANDPAN_DISABLE = 1; + const unsigned short SVG_ZOOMANDPAN_MAGNIFY = 2; + + attribute unsigned short zoomAndPan; +}; + +[NoInterfaceObject] +interface SVGURIReference { + [SameObject] readonly attribute SVGAnimatedString href; +}; + +partial interface Document { + readonly attribute SVGSVGElement? rootElement; +}; + +interface SVGSVGElement : SVGGraphicsElement { + + [SameObject] readonly attribute SVGAnimatedLength x; + [SameObject] readonly attribute SVGAnimatedLength y; + [SameObject] readonly attribute SVGAnimatedLength width; + [SameObject] readonly attribute SVGAnimatedLength height; + + attribute float currentScale; + [SameObject] readonly attribute DOMPointReadOnly currentTranslate; + + NodeList getIntersectionList(DOMRectReadOnly rect, SVGElement? referenceElement); + NodeList getEnclosureList(DOMRectReadOnly rect, SVGElement? referenceElement); + boolean checkIntersection(SVGElement element, DOMRectReadOnly rect); + boolean checkEnclosure(SVGElement element, DOMRectReadOnly rect); + + void deselectAll(); + + SVGNumber createSVGNumber(); + SVGLength createSVGLength(); + SVGAngle createSVGAngle(); + DOMPoint createSVGPoint(); + DOMMatrix createSVGMatrix(); + DOMRect createSVGRect(); + SVGTransform createSVGTransform(); + SVGTransform createSVGTransformFromMatrix(DOMMatrixReadOnly matrix); + + // Deprecated methods that have no effect when called, + // but which are kept for compatibility reasons. + unsigned long suspendRedraw(unsigned long maxWaitMilliseconds); + void unsuspendRedraw(unsigned long suspendHandleID); + void unsuspendRedrawAll(); + void forceRedraw(); +}; + +SVGSVGElement implements SVGFitToViewBox; +SVGSVGElement implements SVGZoomAndPan; +SVGSVGElement implements WindowEventHandlers; + +interface SVGGElement : SVGGraphicsElement { +}; + +interface SVGUnknownElement : SVGGraphicsElement { +}; + +interface SVGDefsElement : SVGGraphicsElement { +}; + +interface SVGDescElement : SVGElement { +}; + +interface SVGMetadataElement : SVGElement { +}; + +interface SVGTitleElement : SVGElement { +}; + +interface SVGSymbolElement : SVGElement { +}; + +SVGSymbolElement implements SVGFitToViewBox; + +interface SVGUseElement : SVGGraphicsElement { + [SameObject] readonly attribute SVGAnimatedLength x; + [SameObject] readonly attribute SVGAnimatedLength y; + [SameObject] readonly attribute SVGAnimatedLength width; + [SameObject] readonly attribute SVGAnimatedLength height; +}; + +SVGUseElement implements SVGURIReference; + +interface SVGSwitchElement : SVGGraphicsElement { +}; + +[NoInterfaceObject] +interface GetSVGDocument { + Document getSVGDocument(); +}; + +interface SVGStyleElement : SVGElement { + attribute DOMString type; + attribute DOMString media; + attribute DOMString title; +}; + +SVGStyleElement implements LinkStyle; + +interface SVGTransform { + + // Transform Types + const unsigned short SVG_TRANSFORM_UNKNOWN = 0; + const unsigned short SVG_TRANSFORM_MATRIX = 1; + const unsigned short SVG_TRANSFORM_TRANSLATE = 2; + const unsigned short SVG_TRANSFORM_SCALE = 3; + const unsigned short SVG_TRANSFORM_ROTATE = 4; + const unsigned short SVG_TRANSFORM_SKEWX = 5; + const unsigned short SVG_TRANSFORM_SKEWY = 6; + + readonly attribute unsigned short type; + [SameObject] readonly attribute DOMMatrix matrix; + readonly attribute float angle; + + void setMatrix(DOMMatrixReadOnly matrix); + void setTranslate(float tx, float ty); + void setScale(float sx, float sy); + void setRotate(float angle, float cx, float cy); + void setSkewX(float angle); + void setSkewY(float angle); +}; + +interface SVGTransformList { + + readonly attribute unsigned long length; + readonly attribute unsigned long numberOfItems; + + void clear(); + SVGTransform initialize(SVGTransform newItem); + getter SVGTransform getItem(unsigned long index); + SVGTransform insertItemBefore(SVGTransform newItem, unsigned long index); + SVGTransform replaceItem(SVGTransform newItem, unsigned long index); + SVGTransform removeItem(unsigned long index); + SVGTransform appendItem(SVGTransform newItem); + setter void (unsigned long index, SVGTransform newItem); + + // Additional methods not common to other list interfaces. + SVGTransform createSVGTransformFromMatrix(DOMMatrixReadOnly matrix); + SVGTransform? consolidate(); +}; + +interface SVGAnimatedTransformList { + [SameObject] readonly attribute SVGTransformList baseVal; + [SameObject] readonly attribute SVGTransformList animVal; +}; + +interface SVGPreserveAspectRatio { + + // Alignment Types + const unsigned short SVG_PRESERVEASPECTRATIO_UNKNOWN = 0; + const unsigned short SVG_PRESERVEASPECTRATIO_NONE = 1; + const unsigned short SVG_PRESERVEASPECTRATIO_XMINYMIN = 2; + const unsigned short SVG_PRESERVEASPECTRATIO_XMIDYMIN = 3; + const unsigned short SVG_PRESERVEASPECTRATIO_XMAXYMIN = 4; + const unsigned short SVG_PRESERVEASPECTRATIO_XMINYMID = 5; + const unsigned short SVG_PRESERVEASPECTRATIO_XMIDYMID = 6; + const unsigned short SVG_PRESERVEASPECTRATIO_XMAXYMID = 7; + const unsigned short SVG_PRESERVEASPECTRATIO_XMINYMAX = 8; + const unsigned short SVG_PRESERVEASPECTRATIO_XMIDYMAX = 9; + const unsigned short SVG_PRESERVEASPECTRATIO_XMAXYMAX = 10; + + // Meet-or-slice Types + const unsigned short SVG_MEETORSLICE_UNKNOWN = 0; + const unsigned short SVG_MEETORSLICE_MEET = 1; + const unsigned short SVG_MEETORSLICE_SLICE = 2; + + attribute unsigned short align; + attribute unsigned short meetOrSlice; +}; + +interface SVGAnimatedPreserveAspectRatio { + [SameObject] readonly attribute SVGPreserveAspectRatio baseVal; + [SameObject] readonly attribute SVGPreserveAspectRatio animVal; +}; + +interface SVGPathElement : SVGGeometryElement { + + [SameObject] readonly attribute SVGAnimatedNumber pathLength; + + float getTotalLength(); + DOMPoint getPointAtLength(float distance); +}; + +interface SVGRectElement : SVGGeometryElement { + [SameObject] readonly attribute SVGAnimatedLength x; + [SameObject] readonly attribute SVGAnimatedLength y; + [SameObject] readonly attribute SVGAnimatedLength width; + [SameObject] readonly attribute SVGAnimatedLength height; + [SameObject] readonly attribute SVGAnimatedLength rx; + [SameObject] readonly attribute SVGAnimatedLength ry; +}; + +interface SVGCircleElement : SVGGeometryElement { + [SameObject] readonly attribute SVGAnimatedLength cx; + [SameObject] readonly attribute SVGAnimatedLength cy; + [SameObject] readonly attribute SVGAnimatedLength r; +}; + +interface SVGEllipseElement : SVGGeometryElement { + [SameObject] readonly attribute SVGAnimatedLength cx; + [SameObject] readonly attribute SVGAnimatedLength cy; + [SameObject] readonly attribute SVGAnimatedLength rx; + [SameObject] readonly attribute SVGAnimatedLength ry; +}; + +interface SVGLineElement : SVGGeometryElement { + [SameObject] readonly attribute SVGAnimatedLength x1; + [SameObject] readonly attribute SVGAnimatedLength y1; + [SameObject] readonly attribute SVGAnimatedLength x2; + [SameObject] readonly attribute SVGAnimatedLength y2; +}; + +[NoInterfaceObject] +interface SVGAnimatedPoints { + [SameObject] readonly attribute SVGPointList points; + [SameObject] readonly attribute SVGPointList animatedPoints; +}; + +interface SVGPointList { + + readonly attribute unsigned long length; + readonly attribute unsigned long numberOfItems; + + void clear(); + DOMPoint initialize(DOMPoint newItem); + getter DOMPoint getItem(unsigned long index); + DOMPoint insertItemBefore(DOMPoint newItem, unsigned long index); + DOMPoint replaceItem(DOMPoint newItem, unsigned long index); + DOMPoint removeItem(unsigned long index); + DOMPoint appendItem(DOMPoint newItem); + setter void (unsigned long index, DOMPoint newItem); +}; + +interface SVGPolylineElement : SVGGeometryElement { +}; + +SVGPolylineElement implements SVGAnimatedPoints; + +interface SVGPolygonElement : SVGGeometryElement { +}; + +SVGPolygonElement implements SVGAnimatedPoints; + +interface SVGTextContentElement : SVGGraphicsElement { + + // lengthAdjust Types + const unsigned short LENGTHADJUST_UNKNOWN = 0; + const unsigned short LENGTHADJUST_SPACING = 1; + const unsigned short LENGTHADJUST_SPACINGANDGLYPHS = 2; + + [SameObject] readonly attribute SVGAnimatedLength textLength; + [SameObject] readonly attribute SVGAnimatedEnumeration lengthAdjust; + + long getNumberOfChars(); + float getComputedTextLength(); + float getSubStringLength(unsigned long charnum, unsigned long nchars); + DOMPoint getStartPositionOfChar(unsigned long charnum); + DOMPoint getEndPositionOfChar(unsigned long charnum); + DOMRect getExtentOfChar(unsigned long charnum); + float getRotationOfChar(unsigned long charnum); + long getCharNumAtPosition(DOMPoint point); + void selectSubString(unsigned long charnum, unsigned long nchars); +}; + +interface SVGTextPositioningElement : SVGTextContentElement { + [SameObject] readonly attribute SVGAnimatedLengthList x; + [SameObject] readonly attribute SVGAnimatedLengthList y; + [SameObject] readonly attribute SVGAnimatedLengthList dx; + [SameObject] readonly attribute SVGAnimatedLengthList dy; + [SameObject] readonly attribute SVGAnimatedNumberList rotate; +}; + +interface SVGTextElement : SVGTextPositioningElement { +}; + +interface SVGTSpanElement : SVGTextPositioningElement { +}; + +interface SVGTextPathElement : SVGTextContentElement { + + // textPath Method Types + const unsigned short TEXTPATH_METHODTYPE_UNKNOWN = 0; + const unsigned short TEXTPATH_METHODTYPE_ALIGN = 1; + const unsigned short TEXTPATH_METHODTYPE_STRETCH = 2; + + // textPath Spacing Types + const unsigned short TEXTPATH_SPACINGTYPE_UNKNOWN = 0; + const unsigned short TEXTPATH_SPACINGTYPE_AUTO = 1; + const unsigned short TEXTPATH_SPACINGTYPE_EXACT = 2; + + [SameObject] readonly attribute SVGAnimatedLength startOffset; + [SameObject] readonly attribute SVGAnimatedEnumeration method; + [SameObject] readonly attribute SVGAnimatedEnumeration spacing; +}; + +SVGTextPathElement implements SVGURIReference; + +interface SVGImageElement : SVGGraphicsElement { + [SameObject] readonly attribute SVGAnimatedLength x; + [SameObject] readonly attribute SVGAnimatedLength y; + [SameObject] readonly attribute SVGAnimatedLength width; + [SameObject] readonly attribute SVGAnimatedLength height; + [SameObject] readonly attribute SVGAnimatedPreserveAspectRatio preserveAspectRatio; + attribute DOMString crossOrigin; +}; + +SVGImageElement implements SVGURIReference; + +interface SVGForeignObjectElement : SVGGraphicsElement { + [SameObject] readonly attribute SVGAnimatedLength x; + [SameObject] readonly attribute SVGAnimatedLength y; + [SameObject] readonly attribute SVGAnimatedLength width; + [SameObject] readonly attribute SVGAnimatedLength height; +}; + +interface SVGMarkerElement : SVGElement { + + // Marker Unit Types + const unsigned short SVG_MARKERUNITS_UNKNOWN = 0; + const unsigned short SVG_MARKERUNITS_USERSPACEONUSE = 1; + const unsigned short SVG_MARKERUNITS_STROKEWIDTH = 2; + + // Marker Orientation Types + const unsigned short SVG_MARKER_ORIENT_UNKNOWN = 0; + const unsigned short SVG_MARKER_ORIENT_AUTO = 1; + const unsigned short SVG_MARKER_ORIENT_ANGLE = 2; + + [SameObject] readonly attribute SVGAnimatedLength refX; + [SameObject] readonly attribute SVGAnimatedLength refY; + [SameObject] readonly attribute SVGAnimatedEnumeration markerUnits; + [SameObject] readonly attribute SVGAnimatedLength markerWidth; + [SameObject] readonly attribute SVGAnimatedLength markerHeight; + [SameObject] readonly attribute SVGAnimatedEnumeration orientType; + [SameObject] readonly attribute SVGAnimatedAngle orientAngle; + attribute DOMString orient; + + void setOrientToAuto(); + void setOrientToAngle(SVGAngle angle); +}; + +SVGMarkerElement implements SVGFitToViewBox; + +interface SVGSolidcolorElement : SVGElement { +}; + +interface SVGGradientElement : SVGElement { + + // Spread Method Types + const unsigned short SVG_SPREADMETHOD_UNKNOWN = 0; + const unsigned short SVG_SPREADMETHOD_PAD = 1; + const unsigned short SVG_SPREADMETHOD_REFLECT = 2; + const unsigned short SVG_SPREADMETHOD_REPEAT = 3; + + [SameObject] readonly attribute SVGAnimatedEnumeration gradientUnits; + [SameObject] readonly attribute SVGAnimatedTransformList gradientTransform; + [SameObject] readonly attribute SVGAnimatedEnumeration spreadMethod; +}; + +SVGGradientElement implements SVGURIReference; +SVGGradientElement implements SVGUnitTypes; + +interface SVGLinearGradientElement : SVGGradientElement { + [SameObject] readonly attribute SVGAnimatedLength x1; + [SameObject] readonly attribute SVGAnimatedLength y1; + [SameObject] readonly attribute SVGAnimatedLength x2; + [SameObject] readonly attribute SVGAnimatedLength y2; +}; + +interface SVGRadialGradientElement : SVGGradientElement { + [SameObject] readonly attribute SVGAnimatedLength cx; + [SameObject] readonly attribute SVGAnimatedLength cy; + [SameObject] readonly attribute SVGAnimatedLength r; + [SameObject] readonly attribute SVGAnimatedLength fx; + [SameObject] readonly attribute SVGAnimatedLength fy; + [SameObject] readonly attribute SVGAnimatedLength fr; +}; + +interface SVGMeshElement : SVGGradientElement { +}; + +interface SVGMeshrowElement : SVGElement { +}; + +interface SVGMeshpatchElement : SVGElement { +}; + +interface SVGStopElement : SVGElement { + [SameObject] readonly attribute SVGAnimatedNumber offset; +}; + +interface SVGPatternElement : SVGElement { + [SameObject] readonly attribute SVGAnimatedEnumeration patternUnits; + [SameObject] readonly attribute SVGAnimatedEnumeration patternContentUnits; + [SameObject] readonly attribute SVGAnimatedTransformList patternTransform; + [SameObject] readonly attribute SVGAnimatedLength x; + [SameObject] readonly attribute SVGAnimatedLength y; + [SameObject] readonly attribute SVGAnimatedLength width; + [SameObject] readonly attribute SVGAnimatedLength height; +}; + +SVGPatternElement implements SVGFitToViewBox; +SVGPatternElement implements SVGURIReference; +SVGPatternElement implements SVGUnitTypes; + +interface SVGHatchElement : SVGElement { +}; + +interface SVGHatchpathElement : SVGElement { +}; + +interface SVGCursorElement : SVGElement { + [SameObject] readonly attribute SVGAnimatedLength x; + [SameObject] readonly attribute SVGAnimatedLength y; +}; + +SVGCursorElement implements SVGURIReference; + +interface SVGScriptElement : SVGElement { + attribute DOMString type; + attribute DOMString crossOrigin; +}; + +SVGScriptElement implements SVGURIReference; + +interface SVGZoomEvent : UIEvent { + [SameObject] readonly attribute DOMRectReadOnly zoomRectScreen; + readonly attribute float previousScale; + [SameObject] readonly attribute DOMPointReadOnly previousTranslate; + readonly attribute float newScale; + [SameObject] readonly attribute DOMPointReadOnly newTranslate; +}; + +interface SVGAElement : SVGGraphicsElement { + [SameObject] readonly attribute SVGAnimatedString target; +}; + +SVGAElement implements SVGURIReference; + +interface SVGViewElement : SVGElement {}; + +SVGViewElement implements SVGFitToViewBox; +SVGViewElement implements SVGZoomAndPan; + +interface SVGFilterElement : SVGElement { + readonly attribute SVGAnimatedEnumeration filterUnits; + readonly attribute SVGAnimatedEnumeration primitiveUnits; + readonly attribute SVGAnimatedLength x; + readonly attribute SVGAnimatedLength y; + readonly attribute SVGAnimatedLength width; + readonly attribute SVGAnimatedLength height; +}; + +SVGFilterElement implements SVGURIReference; +SVGFilterElement implements SVGUnitTypes; + +[NoInterfaceObject] +interface SVGFilterPrimitiveStandardAttributes { + readonly attribute SVGAnimatedLength x; + readonly attribute SVGAnimatedLength y; + readonly attribute SVGAnimatedLength width; + readonly attribute SVGAnimatedLength height; + readonly attribute SVGAnimatedString result; +}; + +interface SVGFEBlendElement : SVGElement { + + // Blend Mode Types + const unsigned short SVG_FEBLEND_MODE_UNKNOWN = 0; + const unsigned short SVG_FEBLEND_MODE_NORMAL = 1; + const unsigned short SVG_FEBLEND_MODE_MULTIPLY = 2; + const unsigned short SVG_FEBLEND_MODE_SCREEN = 3; + const unsigned short SVG_FEBLEND_MODE_DARKEN = 4; + const unsigned short SVG_FEBLEND_MODE_LIGHTEN = 5; + + readonly attribute SVGAnimatedString in1; + readonly attribute SVGAnimatedString in2; + readonly attribute SVGAnimatedEnumeration mode; +}; + +SVGFEBlendElement implements SVGFilterPrimitiveStandardAttributes; + +interface SVGFEColorMatrixElement : SVGElement { + + // Color Matrix Types + const unsigned short SVG_FECOLORMATRIX_TYPE_UNKNOWN = 0; + const unsigned short SVG_FECOLORMATRIX_TYPE_MATRIX = 1; + const unsigned short SVG_FECOLORMATRIX_TYPE_SATURATE = 2; + const unsigned short SVG_FECOLORMATRIX_TYPE_HUEROTATE = 3; + const unsigned short SVG_FECOLORMATRIX_TYPE_LUMINANCETOALPHA = 4; + + readonly attribute SVGAnimatedString in1; + readonly attribute SVGAnimatedEnumeration type; + readonly attribute SVGAnimatedNumberList values; +}; + +SVGFEColorMatrixElement implements SVGFilterPrimitiveStandardAttributes; + +interface SVGFEComponentTransferElement : SVGElement { + readonly attribute SVGAnimatedString in1; +}; + +SVGFEComponentTransferElement implements SVGFilterPrimitiveStandardAttributes; + +interface SVGComponentTransferFunctionElement : SVGElement { + + // Component Transfer Types + const unsigned short SVG_FECOMPONENTTRANSFER_TYPE_UNKNOWN = 0; + const unsigned short SVG_FECOMPONENTTRANSFER_TYPE_IDENTITY = 1; + const unsigned short SVG_FECOMPONENTTRANSFER_TYPE_TABLE = 2; + const unsigned short SVG_FECOMPONENTTRANSFER_TYPE_DISCRETE = 3; + const unsigned short SVG_FECOMPONENTTRANSFER_TYPE_LINEAR = 4; + const unsigned short SVG_FECOMPONENTTRANSFER_TYPE_GAMMA = 5; + + readonly attribute SVGAnimatedEnumeration type; + readonly attribute SVGAnimatedNumberList tableValues; + readonly attribute SVGAnimatedNumber slope; + readonly attribute SVGAnimatedNumber intercept; + readonly attribute SVGAnimatedNumber amplitude; + readonly attribute SVGAnimatedNumber exponent; + readonly attribute SVGAnimatedNumber offset; +}; + +interface SVGFEFuncRElement : SVGComponentTransferFunctionElement { +}; + +interface SVGFEFuncGElement : SVGComponentTransferFunctionElement { +}; + +interface SVGFEFuncBElement : SVGComponentTransferFunctionElement { +}; + +interface SVGFEFuncAElement : SVGComponentTransferFunctionElement { +}; + +interface SVGFECompositeElement : SVGElement { + + // Composite Operators + const unsigned short SVG_FECOMPOSITE_OPERATOR_UNKNOWN = 0; + const unsigned short SVG_FECOMPOSITE_OPERATOR_OVER = 1; + const unsigned short SVG_FECOMPOSITE_OPERATOR_IN = 2; + const unsigned short SVG_FECOMPOSITE_OPERATOR_OUT = 3; + const unsigned short SVG_FECOMPOSITE_OPERATOR_ATOP = 4; + const unsigned short SVG_FECOMPOSITE_OPERATOR_XOR = 5; + const unsigned short SVG_FECOMPOSITE_OPERATOR_ARITHMETIC = 6; + + readonly attribute SVGAnimatedString in1; + readonly attribute SVGAnimatedString in2; + readonly attribute SVGAnimatedEnumeration operator; + readonly attribute SVGAnimatedNumber k1; + readonly attribute SVGAnimatedNumber k2; + readonly attribute SVGAnimatedNumber k3; + readonly attribute SVGAnimatedNumber k4; +}; + +SVGFECompositeElement implements SVGFilterPrimitiveStandardAttributes; + +interface SVGFEConvolveMatrixElement : SVGElement { + + // Edge Mode Values + const unsigned short SVG_EDGEMODE_UNKNOWN = 0; + const unsigned short SVG_EDGEMODE_DUPLICATE = 1; + const unsigned short SVG_EDGEMODE_WRAP = 2; + const unsigned short SVG_EDGEMODE_NONE = 3; + + readonly attribute SVGAnimatedString in1; + readonly attribute SVGAnimatedInteger orderX; + readonly attribute SVGAnimatedInteger orderY; + readonly attribute SVGAnimatedNumberList kernelMatrix; + readonly attribute SVGAnimatedNumber divisor; + readonly attribute SVGAnimatedNumber bias; + readonly attribute SVGAnimatedInteger targetX; + readonly attribute SVGAnimatedInteger targetY; + readonly attribute SVGAnimatedEnumeration edgeMode; + readonly attribute SVGAnimatedNumber kernelUnitLengthX; + readonly attribute SVGAnimatedNumber kernelUnitLengthY; +}; + +SVGFEConvolveMatrixElement implements SVGFilterPrimitiveStandardAttributes; + +interface SVGFEDiffuseLightingElement : SVGElement { + readonly attribute SVGAnimatedString in1; + readonly attribute SVGAnimatedNumber surfaceScale; + readonly attribute SVGAnimatedNumber diffuseConstant; + readonly attribute SVGAnimatedNumber kernelUnitLengthX; + readonly attribute SVGAnimatedNumber kernelUnitLengthY; +}; + +SVGFEDiffuseLightingElement implements SVGFilterPrimitiveStandardAttributes; + +interface SVGFEDistantLightElement : SVGElement { + readonly attribute SVGAnimatedNumber azimuth; + readonly attribute SVGAnimatedNumber elevation; +}; + +interface SVGFEPointLightElement : SVGElement { + readonly attribute SVGAnimatedNumber x; + readonly attribute SVGAnimatedNumber y; + readonly attribute SVGAnimatedNumber z; +}; + +interface SVGFESpotLightElement : SVGElement { + readonly attribute SVGAnimatedNumber x; + readonly attribute SVGAnimatedNumber y; + readonly attribute SVGAnimatedNumber z; + readonly attribute SVGAnimatedNumber pointsAtX; + readonly attribute SVGAnimatedNumber pointsAtY; + readonly attribute SVGAnimatedNumber pointsAtZ; + readonly attribute SVGAnimatedNumber specularExponent; + readonly attribute SVGAnimatedNumber limitingConeAngle; +}; + +interface SVGFEDisplacementMapElement : SVGElement { + + // Channel Selectors + const unsigned short SVG_CHANNEL_UNKNOWN = 0; + const unsigned short SVG_CHANNEL_R = 1; + const unsigned short SVG_CHANNEL_G = 2; + const unsigned short SVG_CHANNEL_B = 3; + const unsigned short SVG_CHANNEL_A = 4; + + readonly attribute SVGAnimatedString in1; + readonly attribute SVGAnimatedString in2; + readonly attribute SVGAnimatedNumber scale; + readonly attribute SVGAnimatedEnumeration xChannelSelector; + readonly attribute SVGAnimatedEnumeration yChannelSelector; +}; + +SVGFEDisplacementMapElement implements SVGFilterPrimitiveStandardAttributes; + +interface SVGFEDropShadowElement : SVGElement { + readonly attribute SVGAnimatedString in1; + readonly attribute SVGAnimatedNumber dx; + readonly attribute SVGAnimatedNumber dy; + readonly attribute SVGAnimatedNumber stdDeviationX; + readonly attribute SVGAnimatedNumber stdDeviationY; + + void setStdDeviation(float stdDeviationX, float stdDeviationY); +}; + +SVGFEDropShadowElement implements SVGFilterPrimitiveStandardAttributes; + +interface SVGFEFloodElement : SVGElement { +}; + +SVGFEFloodElement implements SVGFilterPrimitiveStandardAttributes; + +interface SVGFEGaussianBlurElement : SVGElement { + + // Edge Mode Values + const unsigned short SVG_EDGEMODE_UNKNOWN = 0; + const unsigned short SVG_EDGEMODE_DUPLICATE = 1; + const unsigned short SVG_EDGEMODE_WRAP = 2; + const unsigned short SVG_EDGEMODE_NONE = 3; + + readonly attribute SVGAnimatedString in1; + readonly attribute SVGAnimatedNumber stdDeviationX; + readonly attribute SVGAnimatedNumber stdDeviationY; + readonly attribute SVGAnimatedEnumeration edgeMode; + + void setStdDeviation(float stdDeviationX, float stdDeviationY); +}; + +SVGFEGaussianBlurElement implements SVGFilterPrimitiveStandardAttributes; + +interface SVGFEImageElement : SVGElement { + readonly attribute SVGAnimatedPreserveAspectRatio preserveAspectRatio; + readonly attribute SVGAnimatedString crossOrigin; +}; + +SVGFEImageElement implements SVGFilterPrimitiveStandardAttributes; +SVGFEImageElement implements SVGURIReference; + +interface SVGFEMergeElement : SVGElement { +}; + +SVGFEMergeElement implements SVGFilterPrimitiveStandardAttributes; + +interface SVGFEMergeNodeElement : SVGElement { + readonly attribute SVGAnimatedString in1; +}; + +interface SVGFEMorphologyElement : SVGElement { + + // Morphology Operators + const unsigned short SVG_MORPHOLOGY_OPERATOR_UNKNOWN = 0; + const unsigned short SVG_MORPHOLOGY_OPERATOR_ERODE = 1; + const unsigned short SVG_MORPHOLOGY_OPERATOR_DILATE = 2; + + readonly attribute SVGAnimatedString in1; + readonly attribute SVGAnimatedEnumeration operator; + readonly attribute SVGAnimatedNumber radiusX; + readonly attribute SVGAnimatedNumber radiusY; +}; + +SVGFEMorphologyElement implements SVGFilterPrimitiveStandardAttributes; + +interface SVGFEOffsetElement : SVGElement { + readonly attribute SVGAnimatedString in1; + readonly attribute SVGAnimatedNumber dx; + readonly attribute SVGAnimatedNumber dy; +}; + +SVGFEOffsetElement implements SVGFilterPrimitiveStandardAttributes; + +interface SVGFESpecularLightingElement : SVGElement { + readonly attribute SVGAnimatedString in1; + readonly attribute SVGAnimatedNumber surfaceScale; + readonly attribute SVGAnimatedNumber specularConstant; + readonly attribute SVGAnimatedNumber specularExponent; + readonly attribute SVGAnimatedNumber kernelUnitLengthX; + readonly attribute SVGAnimatedNumber kernelUnitLengthY; +}; + +SVGFESpecularLightingElement implements SVGFilterPrimitiveStandardAttributes; + +interface SVGFETileElement : SVGElement { + readonly attribute SVGAnimatedString in1; +}; + +SVGFETileElement implements SVGFilterPrimitiveStandardAttributes; + +interface SVGFETurbulenceElement : SVGElement { + + // Turbulence Types + const unsigned short SVG_TURBULENCE_TYPE_UNKNOWN = 0; + const unsigned short SVG_TURBULENCE_TYPE_FRACTALNOISE = 1; + const unsigned short SVG_TURBULENCE_TYPE_TURBULENCE = 2; + + // Stitch Options + const unsigned short SVG_STITCHTYPE_UNKNOWN = 0; + const unsigned short SVG_STITCHTYPE_STITCH = 1; + const unsigned short SVG_STITCHTYPE_NOSTITCH = 2; + + readonly attribute SVGAnimatedNumber baseFrequencyX; + readonly attribute SVGAnimatedNumber baseFrequencyY; + readonly attribute SVGAnimatedInteger numOctaves; + readonly attribute SVGAnimatedNumber seed; + readonly attribute SVGAnimatedEnumeration stitchTiles; + readonly attribute SVGAnimatedEnumeration type; +}; + +SVGFETurbulenceElement implements SVGFilterPrimitiveStandardAttributes; +</script> +<script> +var svg = document.createElementNS("http://www.w3.org/2000/svg", "svg"); +var g = document.createElementNS("http://www.w3.org/2000/svg", "g"); +var defs = document.createElementNS("http://www.w3.org/2000/svg", "defs"); +var Desc = document.createElementNS("http://www.w3.org/2000/svg", "desc"); +var title = document.createElementNS("http://www.w3.org/2000/svg", "title"); +var symbol = document.createElementNS("http://www.w3.org/2000/svg", "symbol"); +var use = document.createElementNS("http://www.w3.org/2000/svg", "use"); +var image = document.createElementNS("http://www.w3.org/2000/svg", "image"); +var Switch = document.createElementNS("http://www.w3.org/2000/svg", "switch"); +var style = document.createElementNS("http://www.w3.org/2000/svg", "style"); +var path = document.createElementNS("http://www.w3.org/2000/svg", "path"); +var rect = document.createElementNS("http://www.w3.org/2000/svg", "rect"); +var circle = document.createElementNS("http://www.w3.org/2000/svg", "circle"); +var ellipse = document.createElementNS("http://www.w3.org/2000/svg", "ellipse"); +var line = document.createElementNS("http://www.w3.org/2000/svg", "line"); +var polyline = document.createElementNS("http://www.w3.org/2000/svg", "polyline"); +var polygon = document.createElementNS("http://www.w3.org/2000/svg", "polygon"); +var textContent = document.createElementNS("http://www.w3.org/2000/svg", + "textContent"); +var text = document.createElementNS("http://www.w3.org/2000/svg", "text"); +var tspan = document.createElementNS("http://www.w3.org/2000/svg", "tspan"); +var tref = document.createElementNS("http://www.w3.org/2000/svg", "tref"); +var textPath = document.createElementNS("http://www.w3.org/2000/svg", "textPath"); +var altGlyph = document.createElementNS("http://www.w3.org/2000/svg", "altGlyph"); +var altGlyphDef = document.createElementNS("http://www.w3.org/2000/svg", + "altGlyphDef"); +var altGlyphItem = document.createElementNS("http://www.w3.org/2000/svg", + "altGlyphItem"); +var glyphRef = document.createElementNS("http://www.w3.org/2000/svg", + "glyphRef"); +var marker = document.createElementNS("http://www.w3.org/2000/svg", "marker"); +var colorProfile = document.createElementNS("http://www.w3.org/2000/svg", + "color-profile"); +var linearGradient = document.createElementNS("http://www.w3.org/2000/svg", + "linearGradient"); +var radialGradient = document.createElementNS("http://www.w3.org/2000/svg", + "radialGradient"); +var meshGradient = document.createElementNS("http://www.w3.org/2000/svg", + "meshGradient"); +var stop = document.createElementNS("http://www.w3.org/2000/svg", "stop"); +var pattern = document.createElementNS("http://www.w3.org/2000/svg", "pattern"); +var clipPath = document.createElementNS("http://www.w3.org/2000/svg", "clipPath"); +var mask = document.createElementNS("http://www.w3.org/2000/svg", "mask"); +var cursor = document.createElementNS("http://www.w3.org/2000/svg", "cursor"); +var a = document.createElementNS("http://www.w3.org/2000/svg", "a"); +var view = document.createElementNS("http://www.w3.org/2000/svg", "view"); +var script = document.createElementNS("http://www.w3.org/2000/svg", "script"); +var animate = document.createElementNS("http://www.w3.org/2000/svg", "animate"); +var set = document.createElementNS("http://www.w3.org/2000/svg", "set"); +var animateMotion = document.createElementNS("http://www.w3.org/2000/svg", + "animateMotion"); +var mPath = document.createElementNS("http://www.w3.org/2000/svg", "mPath"); +var animateColor = document.createElementNS("http://www.w3.org/2000/svg", + "animateColor"); +var animateColor = document.createElementNS("http://www.w3.org/2000/svg", + "animateColor"); +var animateTransform = document.createElementNS("http://www.w3.org/2000/svg", + "animateTransform"); +var font = document.createElementNS("http://www.w3.org/2000/svg", "font"); +var glyph = document.createElementNS("http://www.w3.org/2000/svg", "glyph"); +var missingglyph = document.createElementNS("http://www.w3.org/2000/svg", + "missing-glyph"); +var khern = document.createElementNS("http://www.w3.org/2000/svg", "hkern"); +var vkern = document.createElementNS("http://www.w3.org/2000/svg", "vkern"); +var fontface = document.createElementNS("http://www.w3.org/2000/svg", "font-face"); +var fontfacesrc = document.createElementNS("http://www.w3.org/2000/svg", + "font-face-src"); +var fontfaceuri = document.createElementNS("http://www.w3.org/2000/svg", + "font-face-uri"); +var fontfaceformat = document.createElementNS("http://www.w3.org/2000/svg", + "font-face-format"); +var fontfacename = document.createElementNS("http://www.w3.org/2000/svg", + "font-face-name"); +var metadata = document.createElementNS("http://www.w3.org/2000/svg", + "metadata"); +var foreignObject = document.createElementNS("http://www.w3.org/2000/svg", + "foreignObject"); +var filter = document.createElementNS("http://www.w3.org/2000/svg", "filter"); +var feBlend = document.createElementNS("http://www.w3.org/2000/svg", "feBlend"); +var feColorMatrix = document.createElementNS("http://www.w3.org/2000/svg", + "feColorMatrix"); +var feComponentTransfer = document.createElementNS("http://www.w3.org/2000/svg", + "feComponentTransfer"); +var feFuncR = document.createElementNS("http://www.w3.org/2000/svg", "feFuncR"); +var feFuncG = document.createElementNS("http://www.w3.org/2000/svg", "feFuncG"); +var feFuncB = document.createElementNS("http://www.w3.org/2000/svg", "feFuncB"); +var feFuncA = document.createElementNS("http://www.w3.org/2000/svg", "feFuncA"); +var feComposite = document.createElementNS("http://www.w3.org/2000/svg", + "feComposite"); +var feConvolveMatrix = document.createElementNS("http://www.w3.org/2000/svg", + "feConvolveMatrix"); +var feDiffuseLighting = document.createElementNS("http://www.w3.org/2000/svg", + "feDiffuseLighting"); +var fePointLight = document.createElementNS("http://www.w3.org/2000/svg", + "fePointLight"); +var feSpotLight = document.createElementNS("http://www.w3.org/2000/svg", + "feSpotLight"); +var feDisplacementMap = document.createElementNS("http://www.w3.org/2000/svg", + "feDisplacementMap"); +var feDropShadow = document.createElementNS("http://www.w3.org/2000/svg", + "feDropShadow"); +var feFlood = document.createElementNS("http://www.w3.org/2000/svg", "feFlood"); +var feGaussianBlur = document.createElementNS("http://www.w3.org/2000/svg", + "feGaussianBlur"); +var feDisplacementMap = document.createElementNS("http://www.w3.org/2000/svg", + "feDisplacementMap"); +var feDropShadow = document.createElementNS("http://www.w3.org/2000/svg", + "feDropShadow"); +var feImage = document.createElementNS("http://www.w3.org/2000/svg", "feImage"); +var feMerge = document.createElementNS("http://www.w3.org/2000/svg", "feMerge"); +var feMergeNode = document.createElementNS("http://www.w3.org/2000/svg", + "feMergeNode"); +var feMorphology = document.createElementNS("http://www.w3.org/2000/svg", + "feMorphology"); +var feSpecularLighting = document.createElementNS("http://www.w3.org/2000/svg", + "feSpecularLighting"); +var feTile = document.createElementNS("http://www.w3.org/2000/svg", + "feTile"); +var feTurbulence = document.createElementNS("http://www.w3.org/2000/svg", + "feTurbulence"); + + +var idlArray = new IdlArray(); +var idls = document.getElementById("idl").textContent; +var untestedIdls = document.getElementById("untested_idl").textContent; +idlArray.add_untested_idls(untestedIdls); +idlArray.add_idls(idls); +idlArray.add_objects({ + SVGAnimatedBoolean: ['feConvolveMatrix.preserveAlpha'], + SVGAnimatedString: ['a.target'], + SVGStringList: ['a.requiredFeatures'], + SVGAnimatedEnumeration: ['text.lengthAdjust'], + SVGAnimatedInteger: ['feConvolveMatrix.orderX'], + SVGNumber: ['svg.createSVGNumber()'], + SVGAnimatedNumber: ['stop.offset'], + SVGNumberList: ['text.rotate.baseVal'], + SVGAnimatedNumberList: ['text.rotate'], + SVGLength: ['svg.createSVGLength()'], + SVGAnimatedLength: ['svg.x'], + SVGAnimatedLengthList: ['text.x'], + SVGAngle: ['svg.createSVGAngle()'], + SVGAnimatedAngle: ['marker.orientAngle'], + SVGRect: ['svg.createSVGRect()'], + SVGAnimatedRect: ['svg.viewBox'], + SVGSVGElement: ['svg'], + SVGGElement: ['g'], + SVGDefsElement: ['defs'], + SVGDescElement: ['Desc'], + SVGTitleElement: ['title'], + SVGSymbolElement: ['symbol'], + SVGUseElement: ['use'], + SVGImageElement: ['image'], + SVGSwitchElement: ['Switch'], + SVGStyleElement: ['style'], + SVGPoint: ['svg.createSVGPoint()'], + SVGPointList: ['polygon.points'], + SVGMatrix: ['svg.createSVGMatrix()'], + SVGTransform: ['svg.createSVGTransform()'], + SVGTransformList: ['pattern.patternTransform.baseVal'], + SVGAnimatedTransformList: ['pattern.patternTransform'], + SVGPreserveAspectRatio: ['image.preserveAspectRatio.baseVal'], + SVGAnimatedPreserveAspectRatio: ['image.preserveAspectRatio'], + SVGPathSegClosePath: ['path.createSVGPathSegClosePath()'], + SVGPathSegMovetoAbs: ['path.createSVGPathSegMovetoAbs(0,0)'], + SVGPathSegMovetoRel: ['path.createSVGPathSegMovetoRel(0,0)'], + SVGPathSegLinetoAbs: ['path.createSVGPathSegLinetoAbs(0,0)'], + SVGPathSegLinetoRel: ['path.createSVGPathSegLinetoRel(0,0)'], + SVGPathSegCurvetoCubicAbs: ['path.createSVGPathSegCurvetoCubicAbs(0,0,0,0,0,0)'], + SVGPathSegCurvetoCubicRel: ['path.createSVGPathSegCurvetoCubicRel(0,0,0,0,0,0)'], + SVGPathSegCurvetoQuadraticAbs: ['path.createSVGPathSegCurvetoQuadraticAbs(0,0,0,0)'], + SVGPathSegCurvetoQuadraticRel: ['path.createSVGPathSegCurvetoQuadraticRel(0,0,0,0)'], + SVGPathSegArcAbs: ['path.createSVGPathSegArcAbs(0,0,0,0,0,true,true)'], + SVGPathSegArcRel: ['path.createSVGPathSegArcRel(0,0,0,0,0,true,true)'], + SVGPathSegLinetoHorizontalAbs: ['path.createSVGPathSegLinetoHorizontalAbs(0)'], + SVGPathSegLinetoHorizontalRel: ['path.createSVGPathSegLinetoHorizontalRel(0)'], + SVGPathSegLinetoVerticalAbs: ['path.createSVGPathSegLinetoVerticalAbs(0)'], + SVGPathSegLinetoVerticalRel: ['path.createSVGPathSegLinetoVerticalRel(0)'], + SVGPathSegCurvetoCubicSmoothAbs: ['path.createSVGPathSegCurvetoCubicSmoothAbs(0,0,0,0)'], + SVGPathSegCurvetoCubicSmoothRel: ['path.createSVGPathSegCurvetoCubicSmoothRel(0,0,0,0)'], + SVGPathSegCurvetoQuadraticSmoothAbs: ['path.createSVGPathSegCurvetoQuadraticSmoothAbs(0,0)'], + SVGPathSegCurvetoQuadraticSmoothRel: ['path.createSVGPathSegCurvetoQuadraticSmoothRel(0,0)'], + SVGPathSegList: ['path.pathSegList'], + SVGPathElement: ['path'], + SVGRectElement: ['rect'], + SVGCircleElement: ['circle'], + SVGEllipseElement: ['ellipse'], + SVGLineElement: ['line'], + SVGPolylineElement: ['polyline'], + SVGPolygonElement: ['polygon'], + SVGTextContentElement: ['textContent'], + SVGTextElement: ['text'], + SVGTSpanElement: ['tspan'], + SVGTRefElement: ['tref'], + SVGTextPathElement: ['textPath'], + SVGAltGlyphElement: ['altGlyph'], + SVGAltGlyphDefElement: ['altGlyphDef'], + SVGAltGlyphItemElement: ['altGlyphItem'], + SVGGlyphRefElement: ['glyphRef'], + SVGMarkerElement: ['marker'], + SVGColorProfileElement: ['colorProfile'], + SVGLinearGradientElement: ['linearGradient'], + SVGRadialGradientElement: ['radialGradient'], + SVGMeshGradientElement: ['meshGradient'], + SVGStopElement: ['stop'], + SVGPatternElement: ['pattern'], + SVGClipPathElement: ['clipPath'], + SVGMaskElement: ['mask'], + SVGCursorElement: ['cursor'], + SVGAElement: ['a'], + SVGViewElement: ['view'], + SVGScriptElement: ['script'], + SVGAnimateElement: ['animate'], + SVGSetElement: ['set'], + SVGAnimateMotionElement: ['animateMotion'], + SVGMPathElement: ['mPath'], + SVGAnimateColorElement: ['animateColor'], + SVGAnimateTransformElement: ['animateTransform'], + SVGFontElement: ['font'], + SVGGlyphElement: ['glyph'], + SVGMissingGlyphElement: ['missingglyph'], + SVGHKernElement: ['hkern'], + SVGVKernElement: ['vkern'], + SVGFontFaceElement: ['fontface'], + SVGFontFaceSrcElement: ['fontfacesrc'], + SVGFontFaceUriElement: ['fontfaceuri'], + SVGFontFaceFormatElement: ['fontfaceformat'], + SVGMetadataElement: ['metadata'], + SVGForeignObjectElement: ['foreignObject'], + SVGFilterElement: ['filter'], + SVGFEBlendElement: ['feBlend'], + SVGFEColorMatrixElement: ['feColorMatrix'], + SVGFEComponentTransferElement: ['feComponentTransfer'], + SVGFEFuncRElement: ['feFuncR'], + SVGFEFuncGElement: ['feFuncG'], + SVGFEFuncBElement: ['feFuncB'], + SVGFEFuncAElement: ['feFuncA'], + SVGFECompositeElement: ['feComposite'], + SVGFEConvolveMatrixElement: ['feConvolveMatrix'], + SVGFEDiffuseLightingElement: ['feDiffuseLighting'], + SVGFEPointLightElement: ['fePointLight'], + SVGFESpotLightElement: ['feSpotLight'], + SVGFEDisplacementMapElement: ['feDisplacementMap'], + SVGFEDropShadowElement: ['feDropShadow'], + SVGFEFloodElement: ['feFlood'], + SVGFEGaussianBlurElement: ['feGaussianBlur'], + SVGFEImageElement: ['feImage'], + SVGFEMergeElement: ['feMerge'], + SVGFEMergeNodeElement: ['feMergeNode'], + SVGFEMorphologyElement: ['feMorphology'], + SVGFESpecularLightingElement: ['feSpecularLighting'], + SVGFETileElement: ['feTile'], + SVGFETurbulenceElement: ['feTurbulence'] +}); +idlArray.test(); +</script> + diff --git a/testing/web-platform/tests/svg/linking/reftests/href-a-element-attr-change.html b/testing/web-platform/tests/svg/linking/reftests/href-a-element-attr-change.html new file mode 100644 index 000000000..ceb0f1880 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-a-element-attr-change.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html class="retest-wait"> +<meta charset="utf-8"> +<title>href - a element</title> +<meta name="assert" + content="The a element should keep its link status after removing href if there is still xlink:href"> +<link rel="match" href="href-a-element-ref.html"> +<style> +a:link rect { + fill: lime; +} +</style> +<body> + <svg width="100" height="100" viewBox="0 0 100 100" + xmlns:xlink="http://www.w3.org/1999/xlink" onload="loaded();"> + <a id="link" href="abc.html" xlink:href="def.html"> + <rect width="100%" height="100%" fill="red"/> + </a> + </svg> +</body> +<script> + function loaded() { + document.getElementById('link').removeAttribute('href'); + requestAnimationFrame(function() { + document.documentElement.classList.remove("reftest-wait"); + }); + } +</script> +</html> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-a-element-ref.html b/testing/web-platform/tests/svg/linking/reftests/href-a-element-ref.html new file mode 100644 index 000000000..0c67c98b0 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-a-element-ref.html @@ -0,0 +1,8 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - a element reference</title> +<body> + <svg width="100" height="100" viewBox="0 0 100 100"> + <rect width="100%" height="100%" fill="lime"/> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-feImage-element-ref.html b/testing/web-platform/tests/svg/linking/reftests/href-feImage-element-ref.html new file mode 100644 index 000000000..cb3758dfa --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-feImage-element-ref.html @@ -0,0 +1,15 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - feImage element reference</title> +<body> + <svg width="300" height="300" viewBox="0 0 300 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <filter id="Fitted" primitiveUnits="objectBoundingBox"> + <feImage xlink:href="/images/rgrg-256x256.png" + x="0" y="0" width="100%" height="100%" + preserveAspectRatio="none"/> + </filter> + <rect x="20" y="25" width="100" height="110" filter="url(#Fitted)"/> + <rect x="20" y="25" width="100" height="110" fill="none" stroke="green"/> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-feImage-element.html b/testing/web-platform/tests/svg/linking/reftests/href-feImage-element.html new file mode 100644 index 000000000..efdbe63a1 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-feImage-element.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - feImage element</title> +<meta name="assert" content="The feImage element should accept href"> +<link rel="match" href="href-feImage-element-ref.html"> +<body> + <svg width="300" height="300" viewBox="0 0 300 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <filter id="Fitted" primitiveUnits="objectBoundingBox"> + <feImage href="/images/rgrg-256x256.png" + xlink:href="/images/grgr-256x256.png" + x="0" y="0" width="100%" height="100%" + preserveAspectRatio="none"/> + </filter> + <rect x="20" y="25" width="100" height="110" filter="url(#Fitted)"/> + <rect x="20" y="25" width="100" height="110" fill="none" stroke="green"/> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-filter-element-ref.html b/testing/web-platform/tests/svg/linking/reftests/href-filter-element-ref.html new file mode 100644 index 000000000..9b009e31d --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-filter-element-ref.html @@ -0,0 +1,12 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - filter element reference</title> +<body> + <svg width="300" height="300" viewBox="0 0 300 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <filter id="blurMe"> + <feGaussianBlur in="SourceGraphic" stdDeviation="5" /> + </filter> + <circle cx="60" cy="60" r="50" fill="green" filter="url(#blurMe)" /> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-filter-element.html b/testing/web-platform/tests/svg/linking/reftests/href-filter-element.html new file mode 100644 index 000000000..3f718d0c5 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-filter-element.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - filter element</title> +<meta name="assert" content="The filter element should accept href"> +<link rel="match" href="href-filter-element-ref.html"> +<body> + <svg width="300" height="300" viewBox="0 0 300 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <filter id="blurMe"> + <feGaussianBlur in="SourceGraphic" stdDeviation="5" /> + </filter> + <filter id="dropShadow"> + <feGaussianBlur in="SourceAlpha" stdDeviation="3" /> + <feOffset dx="2" dy="4" /> + <feMerge> + <feMergeNode /> + <feMergeNode in="SourceGraphic" /> + </feMerge> + </filter> + <filter id="Copied" href="#blurMe" xlink:href="#dropShadow"> + </filter> + <circle cx="60" cy="60" r="50" fill="green" filter="url(#Copied)"/> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-gradient-element-ref.html b/testing/web-platform/tests/svg/linking/reftests/href-gradient-element-ref.html new file mode 100644 index 000000000..279be683d --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-gradient-element-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - gradient element reference</title> +<body> + <svg width="300" height="300" viewBox="0 0 300 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <linearGradient id="MyGradient"> + <stop offset="5%" stop-color="green"/> + <stop offset="95%" stop-color="gold"/> + </linearGradient> + <rect fill="url(#MyGradient)" stroke="black" x="0" y="0" + width="100" height="100"/> + + <radialGradient id="MyRadialGradient"> + <stop offset="0%" stop-color="red"/> + <stop offset="100%" stop-color="blue"/> + </radialGradient> + <rect x="110" y="0" rx="15" ry="15" width="100" height="100" + fill="url(#MyRadialGradient)"/> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-gradient-element.html b/testing/web-platform/tests/svg/linking/reftests/href-gradient-element.html new file mode 100644 index 000000000..2442b6f3d --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-gradient-element.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - gradient element</title> +<meta name="assert" content="The gradient element should accept href"> +<link rel="match" href="href-gradient-element-ref.html"> +<body> + <svg width="300" height="300" viewBox="0 0 300 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <linearGradient id="MyGradient"> + <stop offset="5%" stop-color="green"/> + <stop offset="95%" stop-color="gold"/> + </linearGradient> + <linearGradient id="MyGradient2"> + <stop offset="5%" stop-color="red"/> + <stop offset="95%" stop-color="blue"/> + </linearGradient> + <linearGradient id="CopiedGradient" href="#MyGradient" + xlink:href="#MyGradient2"> + </linearGradient> + <rect fill="url(#CopiedGradient)" stroke="black" x="0" y="0" + width="100" height="100"/> + + <radialGradient id="MyRadialGradient"> + <stop offset="0%" stop-color="red"/> + <stop offset="100%" stop-color="blue"/> + </radialGradient> + <radialGradient id="CopiedRadialGradient" href="#MyRadialGradient"/> + <rect x="110" y="0" rx="15" ry="15" width="100" height="100" + fill="url(#CopiedRadialGradient)"/> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-image-element-ref.html b/testing/web-platform/tests/svg/linking/reftests/href-image-element-ref.html new file mode 100644 index 000000000..c51906fde --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-image-element-ref.html @@ -0,0 +1,9 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - image element reference</title> +<body> + <svg width="300" height="300" viewBox="0 0 300 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <image xlink:href="/images/green.png" width="100px" height="100px"/> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-image-element.html b/testing/web-platform/tests/svg/linking/reftests/href-image-element.html new file mode 100644 index 000000000..779e33f62 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-image-element.html @@ -0,0 +1,12 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - image element</title> +<meta name="assert" content="The image should accept href"> +<link rel="match" href="href-image-element-ref.html"> +<body> + <svg width="300" height="300" viewBox="0 0 300 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <image href="/images/green.png" xlink:href="/images/red.png" + width="100px" height="100px"/> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-pattern-element-ref.html b/testing/web-platform/tests/svg/linking/reftests/href-pattern-element-ref.html new file mode 100644 index 000000000..bd8770c97 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-pattern-element-ref.html @@ -0,0 +1,14 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - pattern element reference</title> +<body> + <svg width="300" height="300" viewBox="0 0 300 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <pattern id="Pattern" x="0" y="0" width=".25" height=".25"> + <rect x="0" y="0" width="25" height="25" fill="skyblue"/> + <circle cx="25" cy="25" r="20" fill="green" fill-opacity="0.5"/> + </pattern> + <rect fill="url(#Pattern)" stroke="black" x="0" y="0" + width="200" height="200"/> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-pattern-element.html b/testing/web-platform/tests/svg/linking/reftests/href-pattern-element.html new file mode 100644 index 000000000..89aa24315 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-pattern-element.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - pattern element</title> +<meta name="assert" content="The pattern element should accept href"> +<link rel="match" href="href-pattern-element-ref.html"> +<body> + <svg width="300" height="300" viewBox="0 0 300 300"> + <pattern id="Pattern" x="0" y="0" width=".25" height=".25"> + <rect x="0" y="0" width="25" height="25" fill="skyblue"/> + <circle cx="25" cy="25" r="20" fill="green" fill-opacity="0.5"/> + </pattern> + <pattern id="Pattern2" x="0" y="0" width=".25" height=".25"> + <rect x="0" y="0" width="25" height="25" fill="skyblue"/> + <circle cx="25" cy="25" r="20" fill="red" fill-opacity="0.5"/> + </pattern> + <pattern id="CopiedPattern" href="#Pattern" xlink:href="#Pattern2"> + </pattern> + <rect fill="url(#CopiedPattern)" stroke="black" x="0" y="0" + width="200" height="200"/> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-textPath-element-ref.html b/testing/web-platform/tests/svg/linking/reftests/href-textPath-element-ref.html new file mode 100644 index 000000000..4e1fd3531 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-textPath-element-ref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - textPath element reference</title> +<body> + <svg width="100%" height="100%" viewBox="0 0 1000 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <defs> + <path id="MyPath" + d="M 100 200 + C 200 100 300 0 400 100 + C 500 200 600 300 700 200 + C 800 100 900 100 900 100" /> + </defs> + <text font-family="Verdana" font-size="40"> + <textPath xlink:href="#MyPath"> + We go up, then we go down, then up again + </textPath> + </text> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-textPath-element.html b/testing/web-platform/tests/svg/linking/reftests/href-textPath-element.html new file mode 100644 index 000000000..b31e92224 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-textPath-element.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - textPath element</title> +<meta name="assert" content="The textPath element should accept href"> +<link rel="match" href="href-textPath-element-ref.html"> +<body> + <svg width="100%" height="100%" viewBox="0 0 1000 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <defs> + <path id="MyPath" + d="M 100 200 + C 200 100 300 0 400 100 + C 500 200 600 300 700 200 + C 800 100 900 100 900 100" /> + <path id="MyPath2" d="M 100 100 L 900 100" /> + </defs> + <text font-family="Verdana" font-size="40"> + <textPath href="#MyPath" xlink:href="#MyPath2"> + We go up, then we go down, then up again + </textPath> + </text> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-use-element-ref.html b/testing/web-platform/tests/svg/linking/reftests/href-use-element-ref.html new file mode 100644 index 000000000..93577b764 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-use-element-ref.html @@ -0,0 +1,12 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - use element reference</title> +<body> + <svg style="display: none"> + <rect id='refRect' style="fill: red" width="100" height="100" /> + </svg> + <svg width="300" height="300" viewBox="0 0 300 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <use xlink:href="#refRect"/> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-use-element.html b/testing/web-platform/tests/svg/linking/reftests/href-use-element.html new file mode 100644 index 000000000..e6b37f29e --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-use-element.html @@ -0,0 +1,15 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - use element</title> +<meta name="assert" content="The use element should accept href"> +<link rel="match" href="href-use-element-ref.html"> +<body> + <svg style="display: none"> + <circle id="refCircle" style="fill: orange" cx="50px" cy="50px" r="50px" /> + <rect id='refRect' style="fill: red" width="100" height="100" /> + </svg> + <svg width="300" height="300" viewBox="0 0 300 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <use href="#refRect" xlink:href="#refCircle"/> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/scripted/href-animate-element.html b/testing/web-platform/tests/svg/linking/scripted/href-animate-element.html new file mode 100644 index 000000000..f0b99209a --- /dev/null +++ b/testing/web-platform/tests/svg/linking/scripted/href-animate-element.html @@ -0,0 +1,138 @@ +<!DOCTYPE html> +<meta charset=utf-8> +<title>Href - animate element tests</title> +<script src='/resources/testharness.js'></script> +<script src='/resources/testharnessreport.js'></script> +<script src='testcommon.js'></script> +<body> +<div id='log'></div> +<svg id='svg' width='100' height='100' viewBox='0 0 100 100'></svg> +<script> +'use strict'; + +promise_test(function(t) { + var svg = document.getElementById('svg'); + var rect1 = createSVGElement(t, 'rect', svg, + { 'width': '10px', + 'height': '10px', + 'id': 'rect1' }); + var rect2 = createSVGElement(t, 'rect', svg, + { 'width': '10px', + 'height': '10px', + 'id': 'rect2' }); + var animate = createSVGElement(t, 'animate', svg, + { 'attributeName': 'x', + 'from': '0', + 'to': '100', + 'dur': '10s' }); + animate.setAttribute('href', '#rect1'); + animate.setAttributeNS(XLINKNS, 'xlink:href', '#rect2'); + assert_equals(animate.targetElement, rect1); + + return waitEvent(animate, 'begin').then(function() { + svg.pauseAnimations(); + svg.setCurrentTime(5); + assert_equals(rect1.x.animVal.value, 50); + assert_equals(rect2.x.animVal.value, 0); + }); +}, 'Test for animate element when setting both href and xlink:href'); + +promise_test(function(t) { + var svg = document.getElementById('svg'); + var rect1 = createSVGElement(t, 'rect', svg, + { 'width': '10px', + 'height': '10px', + 'id': 'rect1' }); + var rect2 = createSVGElement(t, 'rect', svg, + { 'width': '10px', + 'height': '10px', + 'id': 'rect2' }); + var transform = createSVGElement(t, 'animateTransform', svg, + { 'attributeName': 'transform', + 'type': 'translate', + 'from': '0', + 'to': '100', + 'dur': '10s' }); + + transform.setAttribute('href', '#rect1'); + transform.setAttributeNS(XLINKNS, 'xlink:href', '#rect2'); + assert_equals(transform.targetElement, rect1); + + return waitEvent(transform, 'begin').then(function() { + svg.pauseAnimations(); + svg.setCurrentTime(5); + assert_equals(rect1.getCTM().e, 50); + assert_equals(rect2.getCTM().e, 0); + }); +}, 'Test for animateTransform element when setting both href and xlink:href'); + +promise_test(function(t) { + var svg = document.getElementById('svg'); + var circle1 = createSVGElement(t, 'circle', svg, + { 'cx': '50', + 'cy': '50', + 'r': '40', + 'id': 'circle1' }); + var circle2 = createSVGElement(t, 'circle', svg, + { 'cx': '50', + 'cy': '50', + 'r': '40', + 'id': 'circle2' }); + var animate = createSVGElement(t, 'animate', svg, + { 'attributeName': 'cx', + 'from': '50', + 'to': '150', + 'dur': '10s' }); + animate.setAttribute('href', '#circle1'); + animate.setAttributeNS(XLINKNS, 'xlink:href', '#circle2'); + assert_equals(animate.targetElement, circle1); + + return waitEvent(animate, 'begin').then(function() { + svg.pauseAnimations(); + svg.setCurrentTime(5); + assert_equals(circle1.cx.animVal.value, 100); + assert_equals(circle2.cx.animVal.value, 50); + + animate.removeAttribute('href'); + assert_equals(animate.targetElement, circle2); + assert_equals(circle1.cx.animVal.value, 50); + assert_equals(circle2.cx.animVal.value, 100); + }); +}, 'Test for animate element when removing href but we still have xlink:href'); + +promise_test(function(t) { + var svg = document.getElementById('svg'); + var circle1 = createSVGElement(t, 'circle', svg, + { 'cx': '50', + 'cy': '50', + 'r': '40', + 'id': 'circle1' }); + var circle2 = createSVGElement(t, 'circle', svg, + { 'cx': '50', + 'cy': '50', + 'r': '40', + 'id': 'circle2' }); + var animate = createSVGElement(t, 'animate', svg, + { 'attributeName': 'cx', + 'from': '50', + 'to': '150', + 'dur': '10s' }); + animate.setAttribute('href', '#circle1'); + animate.setAttributeNS(XLINKNS, 'xlink:href', '#circle2'); + assert_equals(animate.targetElement, circle1); + + return waitEvent(animate, 'begin').then(function() { + svg.pauseAnimations(); + svg.setCurrentTime(5); + assert_equals(circle1.cx.animVal.value, 100); + assert_equals(circle2.cx.animVal.value, 50); + + animate.removeAttributeNS(XLINKNS, 'href'); + assert_equals(animate.targetElement, circle1); + assert_equals(circle1.cx.animVal.value, 100); + assert_equals(circle2.cx.animVal.value, 50); + }); +}, 'Test for animate element when removing xlink:href but we still have href'); + +</script> +</body> diff --git a/testing/web-platform/tests/svg/linking/scripted/href-mpath-element.html b/testing/web-platform/tests/svg/linking/scripted/href-mpath-element.html new file mode 100644 index 000000000..8fb9f0f1a --- /dev/null +++ b/testing/web-platform/tests/svg/linking/scripted/href-mpath-element.html @@ -0,0 +1,103 @@ +<!DOCTYPE html> +<meta charset=utf-8> +<title>Href - mpath element tests</title> +<script src='/resources/testharness.js'></script> +<script src='/resources/testharnessreport.js'></script> +<script src='testcommon.js'></script> +<body> +<div id='log'></div> +<svg id='svg' width='100' height='100' viewBox='0 0 100 100'></svg> +<script> +'use strict'; + +promise_test(function(t) { + var svg = document.getElementById('svg'); + var path1 = createSVGElement(t, 'path', svg, + { 'id': 'MyPath1', 'd': 'M 0,0 L 100,0' }); + var path2 = createSVGElement(t, 'path', svg, + { 'id': 'MyPath2', 'd': 'M 0,0 L 0,100' }); + var rect = createSVGElement(t, 'rect', svg, + { 'width': '10px', 'height': '10px' }); + var animateMotion = createSVGElement(t, 'animateMotion', rect, + { 'dur': '10s' }); + var mpath = createSVGElement(t, 'mpath', animateMotion); + mpath.setAttribute('href', '#MyPath1'); + mpath.setAttributeNS(XLINKNS, 'xlink:href', '#MyPath2'); + assert_equals(mpath.href.baseVal, '#MyPath1'); + + return waitEvent(animateMotion, 'begin').then(function() { + svg.pauseAnimations(); + svg.setCurrentTime(1); + var ctm = rect.getCTM(); + assert_equals(ctm.e, 10); + assert_equals(ctm.f, 0); + + svg.setCurrentTime(5); + ctm = rect.getCTM(); + assert_equals(ctm.e, 50); + assert_equals(ctm.f, 0); + }); +}, 'Test for mpath when setting both href and xlink:href'); + +promise_test(function(t) { + var svg = document.getElementById('svg'); + var path1 = createSVGElement(t, 'path', svg, + { 'id': 'MyPath1', 'd': 'M 0,0 L 100,0' }); + var path2 = createSVGElement(t, 'path', svg, + { 'id': 'MyPath2', 'd': 'M 0,0 L 0,100' }); + var rect = createSVGElement(t, 'rect', svg, + { 'width': '10px', 'height': '10px' }); + var animateMotion = createSVGElement(t, 'animateMotion', rect, + { 'dur': '10s' }); + var mpath = createSVGElement(t, 'mpath', animateMotion); + mpath.setAttribute('href', '#MyPath1'); + mpath.setAttributeNS(XLINKNS, 'xlink:href', '#MyPath2'); + + return waitEvent(animateMotion, 'begin').then(function() { + svg.pauseAnimations(); + svg.setCurrentTime(5); + var ctm = rect.getCTM(); + assert_equals(ctm.e, 50); + assert_equals(ctm.f, 0); + + mpath.removeAttribute('href'); + assert_equals(mpath.href.baseVal, '#MyPath2'); + + ctm = rect.getCTM(); + assert_equals(ctm.e, 0); + assert_equals(ctm.f, 50); + }); +}, 'Test for mpath when removing href but we still have xlink:href'); + +promise_test(function(t) { + var svg = document.getElementById('svg'); + var path1 = createSVGElement(t, 'path', svg, + { 'id': 'MyPath1', 'd': 'M 0,0 L 100,0' }); + var path2 = createSVGElement(t, 'path', svg, + { 'id': 'MyPath2', 'd': 'M 0,0 L 0,100' }); + var rect = createSVGElement(t, 'rect', svg, + { 'width': '10px', 'height': '10px' }); + var animateMotion = createSVGElement(t, 'animateMotion', rect, + { 'dur': '10s' }); + var mpath = createSVGElement(t, 'mpath', animateMotion); + mpath.setAttribute('href', '#MyPath1'); + mpath.setAttributeNS(XLINKNS, 'xlink:href', '#MyPath2'); + + return waitEvent(animateMotion, 'begin').then(function() { + svg.pauseAnimations(); + svg.setCurrentTime(5); + var ctm = rect.getCTM(); + assert_equals(ctm.e, 50); + assert_equals(ctm.f, 0); + + mpath.removeAttributeNS(XLINKNS, 'href'); + assert_equals(mpath.href.baseVal, '#MyPath1'); + + ctm = rect.getCTM(); + assert_equals(ctm.e, 50); + assert_equals(ctm.f, 0); + }); +}, 'Test for mpath when removing xlink:href but we still have href'); + +</script> +</body> diff --git a/testing/web-platform/tests/svg/linking/scripted/href-script-element-markup.html b/testing/web-platform/tests/svg/linking/scripted/href-script-element-markup.html new file mode 100644 index 000000000..0c6eb23cb --- /dev/null +++ b/testing/web-platform/tests/svg/linking/scripted/href-script-element-markup.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<meta charset=utf-8> +<title>Href - script element tests on markup</title> +<script src='/resources/testharness.js'></script> +<script src='/resources/testharnessreport.js'></script> +<script src='testcommon.js'></script> +<body> +<div id='log'></div> +<svg id='svg' width='100' height='100' viewBox='0 0 100 100'> + <script id='script' href='testScripts/externalScript1.js' + xlink:href='testScripts/externalScript2.js'></script> +</svg> +<script> +'use strict'; + +// Use an independent test file for markup testing because it may affect other +// tests. + +test(function(t) { + var script = document.getElementById('script'); + assert_equals(script.href.baseVal, 'testScripts/externalScript1.js'); + assert_equals(loadedScript(), 'externalScript1'); +}, 'Test for loading external script by markup when setting both href and ' + + 'xlink:href'); + +</script> +</body> diff --git a/testing/web-platform/tests/svg/linking/scripted/href-script-element.html b/testing/web-platform/tests/svg/linking/scripted/href-script-element.html new file mode 100644 index 000000000..48f490850 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/scripted/href-script-element.html @@ -0,0 +1,112 @@ +<!DOCTYPE html> +<meta charset=utf-8> +<title>Href - script element tests</title> +<script src='/resources/testharness.js'></script> +<script src='/resources/testharnessreport.js'></script> +<script src='testcommon.js'></script> +<body> +<div id='log'></div> +<svg id='svg' width='100' height='100' viewBox='0 0 100 100'> +</svg> +<script> +'use strict'; + +// Note: +// The order of these tests shouldn't be changed because we don't unload +// the external script file even if we expect the <script> element will be +// removed by childNode.remove() and Garbage Collection after a test has been +// finished. Therefore, I intentionally make them load externalScript1 and +// externalScript2 alternately, and we can check if the results are changed +// after reloading the other script. +// Throughout this test, we periodically need to verify that a script +// *does not load* after we've made a tweak. To do that, we have to +// wait "long enough for it to have loaded", and then make sure nothing +// has changed. We estimate "long enough" by adding an extra dummy +// <script> element and watching for its load event. + +promise_test(function(t) { + var svg = document.getElementById('svg'); + var script = createSVGElement(t, 'script', svg); + + script.setAttribute('type', 'text/javascript'); + script.setAttribute('href', 'testScripts/externalScript1.js'); + assert_equals(script.href.baseVal, 'testScripts/externalScript1.js'); + + return waitEvent(script, 'load').then(function() { + assert_equals(loadedScript(), 'externalScript1', + 'Link to correct external script'); + + script.setAttributeNS(XLINKNS, 'xlink:href', + 'testScripts/externalScript2.js'); + + // Load an dummy script to trigger a load event. + var dummyScript = createSVGElement(t, 'script', svg); + dummyScript.setAttribute('href', 'testScripts/dummyScript.js'); + return waitEvent(dummyScript, 'load'); + }).then(function() { + assert_equals(script.href.baseVal, 'testScripts/externalScript1.js'); + assert_equals(loadedScript(), 'externalScript1', + 'Still link to the external script from href'); + }); +}, 'Test for loading external script from href when setting href and ' + + 'then xlink:href'); + +promise_test(function(t) { + var svg = document.getElementById('svg'); + var script = createSVGElement(t, 'script', svg); + + script.setAttribute('type', 'text/javascript'); + script.setAttributeNS(XLINKNS, 'xlink:href', + 'testScripts/externalScript2.js'); + assert_equals(script.href.baseVal, 'testScripts/externalScript2.js'); + + return waitEvent(script, 'load').then(function() { + assert_equals(loadedScript(), 'externalScript2', + 'Link to the external script from xlink:href'); + + script.setAttribute('href', 'testScripts/externalScript1.js'); + + // Load an dummy script to trigger a load event. + var dummyScript = createSVGElement(t, 'script', svg); + dummyScript.setAttribute('href', 'testScripts/dummyScript.js'); + return waitEvent(dummyScript, 'load'); + }).then(function() { + assert_equals(script.href.baseVal, 'testScripts/externalScript1.js', + 'href() should prefer href attribute over xlink:href'); + assert_equals(loadedScript(), 'externalScript2', + 'Still link to the external script from xlink:href'); + }); +}, 'Test for loading external script from xlnk:href by adding xlink:href and ' + + 'then href'); + +promise_test(function(t) { + var svg = document.getElementById('svg'); + var script = createSVGElement(t, 'script', svg); + + script.setAttribute('type', 'text/javascript'); + script.setAttribute('href', 'testScripts/externalScript1.js'); + script.setAttributeNS(XLINKNS, 'xlink:href', + 'testScripts/externalScript2.js'); + assert_equals(script.href.baseVal, 'testScripts/externalScript1.js'); + + return waitEvent(script, 'load').then(function() { + assert_equals(loadedScript(), 'externalScript1', + 'Link to the external script by href'); + + script.removeAttribute('href'); + assert_equals(script.href.baseVal, 'testScripts/externalScript2.js', + 'href() returns xlink:href attribute because href was unset'); + + // Load an dummy script to trigger a load event. + var dummyScript = createSVGElement(t, 'script', svg); + dummyScript.setAttribute('href', 'testScripts/dummyScript.js'); + return waitEvent(dummyScript, 'load'); + }).then(function() { + assert_equals(loadedScript(), 'externalScript1', + 'The external script loaded from href is still loaded'); + }); +}, 'Test for loading external script from href by adding href and ' + + 'then xlink:href, and then removing href'); + +</script> +</body> diff --git a/testing/web-platform/tests/svg/linking/scripted/testScripts/dummyScript.js b/testing/web-platform/tests/svg/linking/scripted/testScripts/dummyScript.js new file mode 100644 index 000000000..fbf3c34d6 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/scripted/testScripts/dummyScript.js @@ -0,0 +1,3 @@ +function dummyScript() { + return "This is a dummy script"; +} diff --git a/testing/web-platform/tests/svg/linking/scripted/testScripts/externalScript1.js b/testing/web-platform/tests/svg/linking/scripted/testScripts/externalScript1.js new file mode 100644 index 000000000..ba4028ca8 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/scripted/testScripts/externalScript1.js @@ -0,0 +1,3 @@ +function loadedScript() { + return "externalScript1"; +} diff --git a/testing/web-platform/tests/svg/linking/scripted/testScripts/externalScript2.js b/testing/web-platform/tests/svg/linking/scripted/testScripts/externalScript2.js new file mode 100644 index 000000000..db3b60a82 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/scripted/testScripts/externalScript2.js @@ -0,0 +1,3 @@ +function loadedScript() { + return "externalScript2"; +} diff --git a/testing/web-platform/tests/svg/linking/scripted/testcommon.js b/testing/web-platform/tests/svg/linking/scripted/testcommon.js new file mode 100644 index 000000000..7d87923f5 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/scripted/testcommon.js @@ -0,0 +1,42 @@ +/** + * The const var for SVG and xlink namespaces + */ +const SVGNS = 'http://www.w3.org/2000/svg'; +const XLINKNS = 'http://www.w3.org/1999/xlink'; + +/** + * Appends a svg element to the parent. + * + * @param test The testharness.js Test object. If provided, this will be used + * to register a cleanup callback to remove the div when the test + * finishes. + * @param tag The element tag name. + * @param parent The parent element of this new created svg element. + * @param attrs A dictionary object with attribute names and values to set on + * the div. + */ +function createSVGElement(test, tag, parent, attrs) { + var elem = document.createElementNS(SVGNS, tag); + if (attrs) { + for (var attrName in attrs) { + elem.setAttribute(attrName, attrs[attrName]); + } + } + parent.appendChild(elem); + test.add_cleanup(function() { + elem.remove(); + }); + return elem; +} + +/** + * Create a Promise object which resolves when a specific event fires. + * + * @param object The event target. + * @param name The event name. + */ +function waitEvent(object, name) { + return new Promise(function(resolve) { + object.addEventListener(name, resolve, { once: true }); + }); +} |
