Bug 1459593 [wpt PR 10868] - Add basic text 'inline-size' tests., a=testonly

Automatic update from web-platform-testsMerge pull request #10868 from Tavmjong/inline-size

Add basic text 'inline-size' tests.
--

wpt-commits: 4d887869b49459f5fc5313171b94aea62de7d7bb
wpt-pr: 10868
This commit is contained in:
Chris Lilley 2018-08-10 16:07:32 +00:00 committed by moz-wptsync-bot
parent 6e17619fbd
commit e53edc0d28
25 changed files with 1618 additions and 0 deletions

View File

@ -186143,6 +186143,102 @@
{}
]
],
"svg/text/reftests/text-inline-size-001.svg": [
[
"/svg/text/reftests/text-inline-size-001.svg",
[
[
"/svg/text/reftests/text-inline-size-001-ref.svg",
"=="
]
],
{}
]
],
"svg/text/reftests/text-inline-size-002.svg": [
[
"/svg/text/reftests/text-inline-size-002.svg",
[
[
"/svg/text/reftests/text-inline-size-002-ref.svg",
"=="
]
],
{}
]
],
"svg/text/reftests/text-inline-size-003.svg": [
[
"/svg/text/reftests/text-inline-size-003.svg",
[
[
"/svg/text/reftests/text-inline-size-003-ref.svg",
"=="
]
],
{}
]
],
"svg/text/reftests/text-inline-size-005.svg": [
[
"/svg/text/reftests/text-inline-size-005.svg",
[
[
"/svg/text/reftests/text-inline-size-005-ref.svg",
"=="
]
],
{}
]
],
"svg/text/reftests/text-inline-size-006.svg": [
[
"/svg/text/reftests/text-inline-size-006.svg",
[
[
"/svg/text/reftests/text-inline-size-006-ref.svg",
"=="
]
],
{}
]
],
"svg/text/reftests/text-inline-size-007.svg": [
[
"/svg/text/reftests/text-inline-size-007.svg",
[
[
"/svg/text/reftests/text-inline-size-007-ref.svg",
"=="
]
],
{}
]
],
"svg/text/reftests/text-inline-size-101.svg": [
[
"/svg/text/reftests/text-inline-size-101.svg",
[
[
"/svg/text/reftests/text-inline-size-101-ref.svg",
"=="
]
],
{}
]
],
"svg/text/reftests/text-inline-size-201.svg": [
[
"/svg/text/reftests/text-inline-size-201.svg",
[
[
"/svg/text/reftests/text-inline-size-201-ref.svg",
"=="
]
],
{}
]
],
"svg/text/reftests/text-multiline-001.svg": [
[
"/svg/text/reftests/text-multiline-001.svg",
@ -300685,6 +300781,46 @@
{}
]
],
"svg/text/reftests/text-inline-size-001-ref.svg": [
[
{}
]
],
"svg/text/reftests/text-inline-size-002-ref.svg": [
[
{}
]
],
"svg/text/reftests/text-inline-size-003-ref.svg": [
[
{}
]
],
"svg/text/reftests/text-inline-size-005-ref.svg": [
[
{}
]
],
"svg/text/reftests/text-inline-size-006-ref.svg": [
[
{}
]
],
"svg/text/reftests/text-inline-size-007-ref.svg": [
[
{}
]
],
"svg/text/reftests/text-inline-size-101-ref.svg": [
[
{}
]
],
"svg/text/reftests/text-inline-size-201-ref.svg": [
[
{}
]
],
"svg/text/reftests/text-multiline-001-ref.svg": [
[
{}
@ -420746,6 +420882,54 @@
"/css/selectors/selection-image-001-noref.html",
{}
]
],
"svg/text/visualtests/text-inline-size-001-visual.svg": [
[
"/svg/text/visualtests/text-inline-size-001-visual.svg",
{}
]
],
"svg/text/visualtests/text-inline-size-002-visual.svg": [
[
"/svg/text/visualtests/text-inline-size-002-visual.svg",
{}
]
],
"svg/text/visualtests/text-inline-size-003-visual.svg": [
[
"/svg/text/visualtests/text-inline-size-003-visual.svg",
{}
]
],
"svg/text/visualtests/text-inline-size-005-visual.svg": [
[
"/svg/text/visualtests/text-inline-size-005-visual.svg",
{}
]
],
"svg/text/visualtests/text-inline-size-006-visual.svg": [
[
"/svg/text/visualtests/text-inline-size-006-visual.svg",
{}
]
],
"svg/text/visualtests/text-inline-size-007-visual.svg": [
[
"/svg/text/visualtests/text-inline-size-007-visual.svg",
{}
]
],
"svg/text/visualtests/text-inline-size-101-visual.svg": [
[
"/svg/text/visualtests/text-inline-size-101-visual.svg",
{}
]
],
"svg/text/visualtests/text-inline-size-201-visual.svg": [
[
"/svg/text/visualtests/text-inline-size-201-visual.svg",
{}
]
]
},
"wdspec": {
@ -635200,6 +635384,70 @@
"51303171f09d28e3958ab74ecdce7f9cf120bd12",
"testharness"
],
"svg/text/reftests/text-inline-size-001-ref.svg": [
"6abd211584ea3b500e409c0f0fa956182fe131e6",
"support"
],
"svg/text/reftests/text-inline-size-001.svg": [
"ae1a10d190ac0f04a2a3168ff8096aaa4fa60066",
"reftest"
],
"svg/text/reftests/text-inline-size-002-ref.svg": [
"66f771e310d4de86ba8ed1aa982054c3247a2b59",
"support"
],
"svg/text/reftests/text-inline-size-002.svg": [
"141909c3e57335f7bbfda0cb04aaef1f5c76c492",
"reftest"
],
"svg/text/reftests/text-inline-size-003-ref.svg": [
"289b92a02ae5c8627cbde0d983a08cb2a096eb7c",
"support"
],
"svg/text/reftests/text-inline-size-003.svg": [
"9fcab5ba0adb13d30a0721cd83da84648b36db9b",
"reftest"
],
"svg/text/reftests/text-inline-size-005-ref.svg": [
"af756b69645d323f084f77287d58e96c8dbc6de6",
"support"
],
"svg/text/reftests/text-inline-size-005.svg": [
"e6a1d75c0502611e7648abfe83deda021731ebcb",
"reftest"
],
"svg/text/reftests/text-inline-size-006-ref.svg": [
"9c32e841a61432edaf9486caab9eb21e7c5b5922",
"support"
],
"svg/text/reftests/text-inline-size-006.svg": [
"b84e3d5302fe5b811988fb7a7d6b5261653536fc",
"reftest"
],
"svg/text/reftests/text-inline-size-007-ref.svg": [
"181785117fb4a434748870ff69518473925b5090",
"support"
],
"svg/text/reftests/text-inline-size-007.svg": [
"9d18b52d2ee957c68fb2ab0b049841bd67e052ee",
"reftest"
],
"svg/text/reftests/text-inline-size-101-ref.svg": [
"ab41dea8da5c9e7df7e7d179ed63a5f8ff2fb67f",
"support"
],
"svg/text/reftests/text-inline-size-101.svg": [
"fa8bf5ef5cfecc3c2e5793a75477dc7db9c2ac8a",
"reftest"
],
"svg/text/reftests/text-inline-size-201-ref.svg": [
"b1eb7c747354b5e6fe8b5bd251199f1ce8a4a91d",
"support"
],
"svg/text/reftests/text-inline-size-201.svg": [
"5ab3213a69be9982709b46566f42668e4f623be5",
"reftest"
],
"svg/text/reftests/text-multiline-001-ref.svg": [
"9238a88da59bb53f8c3eac1fb77d11024f850e38",
"support"
@ -635240,6 +635488,38 @@
"a4b6bf52bd2c6bd7492d18f32ded4b7590b302f9",
"reftest"
],
"svg/text/visualtests/text-inline-size-001-visual.svg": [
"086bab33b0030bb1d40dc17f960b7e3cbb098ae6",
"visual"
],
"svg/text/visualtests/text-inline-size-002-visual.svg": [
"7f58973ce359b79113247ca28a155216687e0d13",
"visual"
],
"svg/text/visualtests/text-inline-size-003-visual.svg": [
"19bf0dc9d53d81c7a65a0c2a200ec5b3c1d7e771",
"visual"
],
"svg/text/visualtests/text-inline-size-005-visual.svg": [
"dab467e1221be1da26d5194414cb54c766074a5c",
"visual"
],
"svg/text/visualtests/text-inline-size-006-visual.svg": [
"427ff09501b75b4e58429d42ad2339e43c596d7d",
"visual"
],
"svg/text/visualtests/text-inline-size-007-visual.svg": [
"8bb078f95b0743452caf08d2367260902dc1059e",
"visual"
],
"svg/text/visualtests/text-inline-size-101-visual.svg": [
"e1c5c416931ad35437bb1f480ed896e18dce50ba",
"visual"
],
"svg/text/visualtests/text-inline-size-201-visual.svg": [
"f2649eaad28fe66a6534f2e2c0f26e291c5ee38d",
"visual"
],
"svg/types/elements/SVGGeometryElement-rect.svg": [
"d4b278f2836f75fd3f6cbe8460d20147116e4bfe",
"testharness"

View File

@ -0,0 +1,50 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:html="http://www.w3.org/1999/xhtml">
<g id="testmeta">
<title>Text: Inline Size — 001</title>
<html:link rel="author"
title="Tavmjong Bah"
href="mailto:tavmjong@free.fr"/>
</g>
<style id="test-font" type="text/css">
/* Standard Font (if needed). */
@font-face {
font-family: FreeSans;
src: url("fonts/FreeSans.woff") format("woff"),
local("FreeSans");
}
text { font-family: FreeSans, sans-serif }
</style>
<style id="test-style" type="text/css">
/* Style that is being tested (if needed). */
text { font-family: FreeSans, sans-serif }
</style>
<g id="test-body-reference" style="font-size:16px;fill:black">
<g transform="translate(0,0)">
<text>
<tspan x="80" y="114.8">Lorem ipsum dolor sit amet, consectetur</tspan>
<tspan x="80" y="134.8">adipisicing elit,</tspan>
</text>
</g>
<g transform="translate(0,60)">
<text style="text-anchor:middle">
<tspan x="240" y="114.8">Lorem ipsum dolor sit amet, consectetur</tspan>
<tspan x="240" y="134.8">adipisicing elit,</tspan>
</text>
</g>
<g transform="translate(0,120)">
<text style="text-anchor:end">
<tspan x="400" y="114.8">Lorem ipsum dolor sit amet, consectetur</tspan>
<tspan x="400" y="134.8">adipisicing elit,</tspan>
</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.6 KiB

View File

@ -0,0 +1,44 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:html="http://www.w3.org/1999/xhtml">
<g id="testmeta">
<title>Text: Inline Size — 001</title>
<html:link rel="author"
title="Tavmjong Bah"
href="mailto:tavmjong@free.fr"/>
<html:link rel="help"
href="https://svgwg.org/svg2-draft/text.html#InlineSize"/>
<html:link rel="match" href="text-inline-size-001-ref.svg" />
</g>
<style id="test-font" type="text/css">
/* Standard Font (if needed). */
@font-face {
font-family: FreeSans;
src: url("fonts/FreeSans.woff") format("woff"),
local("FreeSans");
}
text { font-family: FreeSans, sans-serif }
</style>
<style id="test-style" type="text/css">
/* Style that is being tested (if needed). */
text { font-family: FreeSans, sans-serif }
</style>
<g id="test-body-content" style="font-size:16px;line-spacing:1.25">
<g transform="translate(0,0)">
<text x="80" y="114.8" style="inline-size:320px">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
</g>
<g transform="translate(0,60)">
<text x="240" y="114.8" style="inline-size:320px;text-anchor:middle">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
</g>
<g transform="translate(0,120)">
<text x="400" y="114.8" style="inline-size:320px;text-anchor:end">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.6 KiB

View File

@ -0,0 +1,50 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:html="http://www.w3.org/1999/xhtml">
<g id="testmeta">
<title>Text in Shape — 002</title>
<html:link rel="author"
title="Tavmjong Bah"
href="mailto:tavmjong@free.fr"/>
</g>
<style id="test-font" type="text/css">
/* Standard Font (if needed). */
@font-face {
font-family: FreeSans;
src: url("fonts/FreeSans.woff") format("woff"),
local("FreeSans");
}
text { font-family: FreeSans, sans-serif }
</style>
<style id="test-style" type="text/css">
/* Style that is being tested (if needed). */
text { font-family: FreeSans, sans-serif }
</style>
<g id="test-body-reference" style="font-size:16px">
<g transform="translate(0,0)">
<text transform="translate(250,10) rotate(90)">
<tspan x="90" y="114.8">Lorem ipsum dolor sit amet,</tspan>
<tspan x="90" y="134.8">consectetur adipisicing elit,</tspan>
</text>
</g>
<g transform="translate(80,0)">
<text transform="translate(250,-40) rotate(90)" style="text-anchor:middle">
<tspan x="240" y="114.8">Lorem ipsum dolor sit amet,</tspan>
<tspan x="240" y="134.8">consectetur adipisicing elit,</tspan>
</text>
</g>
<g transform="translate(160,0)">
<text transform="translate(250,-90) rotate(90)" style="text-anchor:end">
<tspan x="390" y="114.8">Lorem ipsum dolor sit amet,</tspan>
<tspan x="390" y="134.8">consectetur adipisicing elit,</tspan>
</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.7 KiB

View File

@ -0,0 +1,44 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:html="http://www.w3.org/1999/xhtml">
<g id="testmeta">
<title>Text in Shape — 002</title>
<html:link rel="author"
title="Tavmjong Bah"
href="mailto:tavmjong@free.fr"/>
<html:link rel="help"
href="https://svgwg.org/svg2-draft/text.html#InlineSize"/>
<html:link rel="match" href="text-inline-size-002-ref.svg" />
</g>
<style id="test-font" type="text/css">
/* Standard Font (if needed). */
@font-face {
font-family: FreeSans;
src: url("fonts/FreeSans.woff") format("woff"),
local("FreeSans");
}
text { font-family: FreeSans, sans-serif }
</style>
<style id="test-style" type="text/css">
/* Style that is being tested (if needed). */
text { font-family: FreeSans, sans-serif }
</style>
<g id="test-body-content" style="font-size:16px;line-spacing:1.25;writing-mode:tb-rl">
<g transform="translate(0,0)">
<text x="140" y="100" style="inline-size:200px">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
</g>
<g transform="translate(80,0)">
<text x="140" y="200" style="inline-size:200px;text-anchor:middle">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
</g>
<g transform="translate(160,0)">
<text x="140" y="300" style="inline-size:200px;text-anchor:end">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.6 KiB

View File

@ -0,0 +1,50 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:html="http://www.w3.org/1999/xhtml">
<g id="testmeta">
<title>Text: Inline Size — 003</title>
<html:link rel="author"
title="Tavmjong Bah"
href="mailto:tavmjong@free.fr"/>
</g>
<style id="test-font" type="text/css">
/* Standard Font (if needed). */
@font-face {
font-family: FreeSans;
src: url("fonts/FreeSans.woff") format("woff"),
local("FreeSans");
}
text { font-family: FreeSans, sans-serif }
</style>
<style id="test-style" type="text/css">
/* Style that is being tested (if needed). */
text { font-family: FreeSans, sans-serif }
</style>
<g id="test-body-reference" style="font-size:16px;direction:rtl">
<g transform="translate(0,0)">
<text>
<tspan x="400" y="114.8">لكن لا بد أن أوضح لك أن كل هذه الأفكار</tspan>
<tspan x="400" y="134.8">المغلوطة حول استنكار</tspan>
</text>
</g>
<g transform="translate(0,60)">
<text style="text-anchor:middle">
<tspan x="240" y="114.8">لكن لا بد أن أوضح لك أن كل هذه الأفكار</tspan>
<tspan x="240" y="134.8">المغلوطة حول استنكار</tspan>
</text>
</g>
<g transform="translate(0,120)">
<text style="text-anchor:end">
<tspan x="80" y="114.8">لكن لا بد أن أوضح لك أن كل هذه الأفكار</tspan>
<tspan x="80" y="134.8">المغلوطة حول استنكار</tspan>
</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.7 KiB

View File

@ -0,0 +1,44 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:html="http://www.w3.org/1999/xhtml">
<g id="testmeta">
<title>Text: Inline Size — 003</title>
<html:link rel="author"
title="Tavmjong Bah"
href="mailto:tavmjong@free.fr"/>
<html:link rel="help"
href="https://svgwg.org/svg2-draft/text.html#InlineSize"/>
<html:link rel="match" href="text-inline-size-003-ref.svg" />
</g>
<style id="test-font" type="text/css">
/* Standard Font (if needed). */
@font-face {
font-family: FreeSans;
src: url("fonts/FreeSans.woff") format("woff"),
local("FreeSans");
}
text { font-family: FreeSans, sans-serif }
</style>
<style id="test-style" type="text/css">
/* Style that is being tested (if needed). */
text { font-family: FreeSans, sans-serif }
</style>
<g id="test-body-content" style="font-size:16px;line-spacing:1.25;direction:rtl">
<g transform="translate(0,0)">
<text x="400" y="114.8" style="inline-size:320px">لكن لا بد أن أوضح لك أن كل هذه الأفكار المغلوطة حول استنكار</text>
</g>
<g transform="translate(0,60)">
<text x="240" y="114.8" style="inline-size:320px;text-anchor:middle">لكن لا بد أن أوضح لك أن كل هذه الأفكار المغلوطة حول استنكار</text>
</g>
<g transform="translate(0,120)">
<text x="80" y="114.8" style="inline-size:320px;text-anchor:end">لكن لا بد أن أوضح لك أن كل هذه الأفكار المغلوطة حول استنكار</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.7 KiB

View File

@ -0,0 +1,42 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:html="http://www.w3.org/1999/xhtml">
<g id="testmeta">
<title>Text: Inline Size — 005</title>
<html:link rel="author"
title="Tavmjong Bah"
href="mailto:tavmjong@free.fr"/>
</g>
<style id="test-font" type="text/css">
/* Standard Font (if needed). */
@font-face {
font-family: FreeSans;
src: url("fonts/FreeSans.woff") format("woff"),
local("FreeSans");
}
text { font-family: FreeSans, sans-serif }
</style>
<style id="test-style" type="text/css">
/* Style that is being tested (if needed). */
text { font-family: FreeSans, sans-serif }
</style>
<g id="test-body-reference" style="font-size:16px">
<g transform="translate(0,0)">
<text>
<tspan x="80" y="114.8">Lorem ipsum dolor sit amet, consectetur</tspan>
<tspan x="80" y="149.6">adipiscing <tspan style="font-size:32px">elit</tspan>, sed do eiusmod tempor</tspan>
<tspan x="80" y="174.8">incididunt ut labore et dolore magna aliqua. Ut</tspan>
<tspan x="80" y="209.6">enim ad minim veniam, <tspan style="font-size:32px">quis</tspan> nostrud</tspan>
<tspan x="80" y="234.8">exercitation ullamco laboris <tspan style="font-size:8px">nisi</tspan> ut aliquip ex ea</tspan>
<tspan x="80" y="254.8">commodo consequat.</tspan>
</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@ -0,0 +1,38 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:html="http://www.w3.org/1999/xhtml">
<g id="testmeta">
<title>Text: Inline Size — 005</title>
<html:link rel="author"
title="Tavmjong Bah"
href="mailto:tavmjong@free.fr"/>
<html:link rel="help"
href="https://svgwg.org/svg2-draft/text.html#InlineSize"/>
<html:link rel="match" href="text-inline-size-005-ref.svg" />
</g>
<style id="test-font" type="text/css">
/* Standard Font (if needed). */
@font-face {
font-family: FreeSans;
src: url("fonts/FreeSans.woff") format("woff"),
local("FreeSans");
}
text { font-family: FreeSans, sans-serif }
</style>
<style id="test-style" type="text/css">
/* Style that is being tested (if needed). */
text { font-family: FreeSans, sans-serif }
</style>
<g id="test-body-content" style="font-size:16px;line-height:1.25">
<g transform="translate(0,0)">
<text x="80" y="114.8" style="inline-size:320px" xml:space="preserve">Lorem ipsum dolor sit amet, consectetur adipiscing <tspan style="font-size:32px">elit</tspan>, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, <tspan style="font-size:2em">quis</tspan> nostrud exercitation ullamco laboris <tspan style="font-size:8px">nisi</tspan> ut aliquip ex ea commodo consequat.</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@ -0,0 +1,42 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:html="http://www.w3.org/1999/xhtml">
<g id="testmeta">
<title>Text: Inline Size — 006</title>
<html:link rel="author"
title="Tavmjong Bah"
href="mailto:tavmjong@free.fr"/>
</g>
<style id="test-font" type="text/css">
/* Standard Font (if needed). */
@font-face {
font-family: FreeSans;
src: url("fonts/FreeSans.woff") format("woff"),
local("FreeSans");
}
text { font-family: FreeSans, sans-serif }
</style>
<style id="test-style" type="text/css">
/* Style that is being tested (if needed). */
text { font-family: FreeSans, sans-serif }
</style>
<g id="test-body-reference" style="font-size:16px">
<g transform="translate(0,0)">
<text>
<tspan x="80" y="114.8">Lorem ipsum dolor sit amet, consectetur</tspan>
<tspan x="80" y="134.8">adipiscing <tspan style="font-size:32px">elit</tspan>, sed do eiusmod tempor</tspan>
<tspan x="80" y="154.8">incididunt ut labore et dolore magna aliqua. Ut</tspan>
<tspan x="80" y="174.8">enim ad minim veniam, <tspan style="font-size:32px">quis</tspan> nostrud</tspan>
<tspan x="80" y="194.8">exercitation ullamco laboris <tspan style="font-size:8px">nisi</tspan> ut aliquip ex ea</tspan>
<tspan x="80" y="214.8">commodo consequat.</tspan>
</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@ -0,0 +1,38 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:html="http://www.w3.org/1999/xhtml">
<g id="testmeta">
<title>Text: Inline Size — 006</title>
<html:link rel="author"
title="Tavmjong Bah"
href="mailto:tavmjong@free.fr"/>
<html:link rel="help"
href="https://svgwg.org/svg2-draft/text.html#InlineSize"/>
<html:link rel="match" href="text-inline-size-006-ref.svg" />
</g>
<style id="test-font" type="text/css">
/* Standard Font (if needed). */
@font-face {
font-family: FreeSans;
src: url("fonts/FreeSans.woff") format("woff"),
local("FreeSans");
}
text { font-family: FreeSans, sans-serif }
</style>
<style id="test-style" type="text/css">
/* Style that is being tested (if needed). */
text { font-family: FreeSans, sans-serif }
</style>
<g id="test-body-content" style="font-size:16px;line-height:1.25">
<g transform="translate(0,0)">
<text x="80" y="114.8" style="inline-size:320px">Lorem ipsum dolor sit amet, consectetur adipiscing <tspan style="font-size:32px;line-height:0">elit</tspan>, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, <tspan style="font-size:2em;line-height:0">quis</tspan> nostrud exercitation ullamco laboris <tspan style="font-size:8px">nisi</tspan> ut aliquip ex ea commodo consequat.</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@ -0,0 +1,42 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:html="http://www.w3.org/1999/xhtml">
<g id="testmeta">
<title>Text: Inline Size — 006</title>
<html:link rel="author"
title="Tavmjong Bah"
href="mailto:tavmjong@free.fr"/>
</g>
<style id="test-font" type="text/css">
/* Standard Font (if needed). */
@font-face {
font-family: FreeSans;
src: url("fonts/FreeSans.woff") format("woff"),
local("FreeSans");
}
text { font-family: FreeSans, sans-serif }
</style>
<style id="test-style" type="text/css">
/* Style that is being tested (if needed). */
text { font-family: FreeSans, sans-serif }
</style>
<g id="test-body-reference" style="font-size:16px">
<g transform="translate(0,0)">
<text>
<tspan x="80" y="114.8">Lorem ipsum dolor sit amet, consectetur</tspan>
<tspan x="80" y="139.6">adipiscing <tspan style="font-size:32px">elit</tspan>, sed do eiusmod tempor</tspan>
<tspan x="80" y="159.6">incididunt ut labore et dolore magna aliqua. Ut</tspan>
<tspan x="80" y="184.4">enim ad minim veniam, <tspan style="font-size:32px">quis</tspan> nostrud</tspan>
<tspan x="80" y="204.4">exercitation ullamco laboris <tspan style="font-size:8px">nisi</tspan> ut aliquip ex ea</tspan>
<tspan x="80" y="226.8">commodo consequat.</tspan>
</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@ -0,0 +1,38 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:html="http://www.w3.org/1999/xhtml">
<g id="testmeta">
<title>Text: Inline Size — 006</title>
<html:link rel="author"
title="Tavmjong Bah"
href="mailto:tavmjong@free.fr"/>
<html:link rel="help"
href="https://svgwg.org/svg2-draft/text.html#InlineSize"/>
<html:link rel="match" href="text-inline-size-007-ref.svg" />
</g>
<style id="test-font" type="text/css">
/* Standard Font (if needed). */
@font-face {
font-family: FreeSans;
src: url("fonts/FreeSans.woff") format("woff"),
local("FreeSans");
}
text { font-family: FreeSans, sans-serif }
</style>
<style id="test-style" type="text/css">
/* Style that is being tested (if needed). */
text { font-family: FreeSans, sans-serif }
</style>
<g id="test-body-content" style="font-size:16px">
<g transform="translate(0,0)">
<text x="80" y="114.8" style="inline-size:320px;line-height:20px">Lorem ipsum dolor sit amet, consectetur adipiscing <tspan style="font-size:32px">elit</tspan>, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, <tspan style="font-size:2em">quis</tspan> nostrud exercitation ullamco laboris <tspan style="font-size:8px">nisi</tspan> ut aliquip ex ea commodo consequat.</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@ -0,0 +1,50 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:html="http://www.w3.org/1999/xhtml">
<g id="testmeta">
<title>Text: Inline Size — 101</title>
<html:link rel="author"
title="Tavmjong Bah"
href="mailto:tavmjong@free.fr"/>
</g>
<style id="test-font" type="text/css">
/* Standard Font (if needed). */
@font-face {
font-family: FreeSans;
src: url("fonts/FreeSans.woff") format("woff"),
local("FreeSans");
}
text { font-family: FreeSans, sans-serif }
</style>
<style id="test-style" type="text/css">
/* Style that is being tested (if needed). */
text { font-family: FreeSans, sans-serif }
</style>
<g id="test-body-reference" style="font-size:16px">
<g transform="translate(0,0)">
<text>
<tspan x="80" y="114.8">Lorem ipsum dolor sit amet, consectetur</tspan>
<tspan x="80" y="134.8">adipisicing elit,</tspan>
</text>
</g>
<g transform="translate(0,60)">
<text style="text-anchor:middle">
<tspan x="240" y="114.8">Lorem ipsum dolor sit amet, consectetur</tspan>
<tspan x="240" y="134.8">adipisicing elit,</tspan>
</text>
</g>
<g transform="translate(0,120)">
<text style="text-anchor:end">
<tspan x="400" y="114.8">Lorem ipsum dolor sit amet, consectetur</tspan>
<tspan x="400" y="134.8">adipisicing elit,</tspan>
</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.6 KiB

View File

@ -0,0 +1,44 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:html="http://www.w3.org/1999/xhtml">
<g id="testmeta">
<title>Text: Inline Size — 101</title>
<html:link rel="author"
title="Tavmjong Bah"
href="mailto:tavmjong@free.fr"/>
<html:link rel="help"
href="https://svgwg.org/svg2-draft/text.html#InlineSize"/>
<html:link rel="match" href="text-inline-size-101-ref.svg" />
</g>
<style id="test-font" type="text/css">
/* Standard Font (if needed). */
@font-face {
font-family: FreeSans;
src: url("fonts/FreeSans.woff") format("woff"),
local("FreeSans");
}
text { font-family: FreeSans, sans-serif }
</style>
<style id="test-style" type="text/css">
/* Style that is being tested (if needed). */
text { font-family: FreeSans, sans-serif }
</style>
<g id="test-body-content" style="font-size:16px;line-spacing:1.25">
<g transform="translate(0,0)">
<text x="80" y="114.8" style="inline-size:66.66667%">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
</g>
<g transform="translate(0,60)">
<text x="240" y="114.8" style="inline-size:66.66667%;text-anchor:middle">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
</g>
<g transform="translate(0,120)">
<text x="400" y="114.8" style="inline-size:66.66667%;text-anchor:end">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.6 KiB

View File

@ -0,0 +1,54 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:html="http://www.w3.org/1999/xhtml">
<g id="testmeta">
<title>Text in Shape — 201</title>
<html:link rel="author"
title="Tavmjong Bah"
href="mailto:tavmjong@free.fr"/>
</g>
<style id="test-font" type="text/css">
/* Standard Font (if needed). */
@font-face {
font-family: FreeSans;
src: url("fonts/FreeSans.woff") format("woff"),
local("FreeSans");
}
text { font-family: FreeSans, sans-serif }
</style>
<style id="test-style" type="text/css">
/* Style that is being tested (if needed). */
text { font-family: FreeSans, sans-serif }
</style>
<g id="test-body-reference" style="font-size:16px">
<g transform="translate(0,0)">
<text style="writing-mode:tb-rl">
<tspan x="140" y="100">漢字</tspan>
<tspan x="140" y="132">Lorem ipsum</tspan>
<tspan x="140" y="227.7">漢字</tspan>
</text>
</g>
<g transform="translate(80,0)">
<text transform="translate(250,-40) rotate(90)">
<tspan x="140" y="110">漢字Lorem ipsum!漢字</tspan>
</text>
</g>
<g transform="translate(160,0)">
<text transform="translate(250,-40) rotate(90)">
<tspan x="140" y="110">漢字!لكن لا بد أن漢字</tspan>
</text>
</g>
<g transform="translate(240,0)">
<text transform="translate(250,-40) rotate(90)" style="direction:rtl;text-anchor:end">
<tspan x="140" y="110">漢字!لكن لا بد أن漢字</tspan>
</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.7 KiB

View File

@ -0,0 +1,48 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:html="http://www.w3.org/1999/xhtml">
<g id="testmeta">
<title>Text in Shape — 201</title>
<html:link rel="author"
title="Tavmjong Bah"
href="mailto:tavmjong@free.fr"/>
<html:link rel="help"
href="https://svgwg.org/svg2-draft/text.html#InlineSize"/>
<html:link rel="match" href="text-inline-size-201-ref.svg" />
</g>
<style id="test-font" type="text/css">
/* Standard Font (if needed). */
@font-face {
font-family: FreeSans;
src: url("fonts/FreeSans.woff") format("woff"),
local("FreeSans");
}
text { font-family: FreeSans, sans-serif }
</style>
<style id="test-style" type="text/css">
/* Style that is being tested (if needed). */
text { font-family: FreeSans, sans-serif }
</style>
<!-- Lorem ipsum dolor sit amet, consectetur adipisicing elit, -->
<g id="test-body-content" style="font-size:16px;line-spacing:1.25;writing-mode:tb-rl">
<g transform="translate(0,0)">
<text x="140" y="100" style="inline-size:200px">漢字Lorem ipsum!漢字</text>
</g>
<g transform="translate(80,0)" style="text-orientation:sideways">
<text x="140" y="100" style="inline-size:200px">漢字Lorem ipsum!漢字</text>
</g>
<g transform="translate(160,0)" style="text-orientation:sideways">
<text x="140" y="100" style="inline-size:200px">漢字!لكن لا بد أن漢字</text>
</g>
<g transform="translate(240,0)" style="direction:rtl;text-orientation:sideways">
<text x="140" y="100" style="inline-size:200px">漢字!لكن لا بد أن漢字</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.8 KiB

View File

@ -0,0 +1,85 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:html="http://www.w3.org/1999/xhtml">
<g id="testmeta">
<title>Text: Inline Size — 001</title>
<html:link rel="author"
title="Tavmjong Bah"
href="mailto:tavmjong@free.fr"/>
<html:link rel="reviewer"
title="NAME_OF_REVIEWER"
href="mailto:EMAIL OR http://CONTACT_PAGE" />
<!-- YYYY-MM-DD -->
<html:link rel="help"
href="https://svgwg.org/svg2-draft/text.html#InlineSize"/>
<metadata class="flags">TOKENS</metadata>
<desc class="assert">TEST ASSERTION</desc>
</g>
<style id="test-font" type="text/css">
/* Standard Font (if needed). */
@font-face {
font-family: FreeSans;
src: url("fonts/FreeSans.woff") format("woff"),
local("FreeSans");
}
text { font-family: FreeSans, sans-serif }
</style>
<style id="test-style" type="text/css">
/* Style that is being tested (if needed). */
text { font-family: FreeSans, sans-serif }
</style>
<defs>
<path id="TestPath" d="m 80,100 0,40 m 320,-40 0,40"/>
</defs>
<text id="title" x="240" y="50" style="fill:black; font-size:24px; text-anchor:middle;">Text 'inline-size' — 001</text>
<a href="https://svgwg.org/svg2-draft/text.html#InlineSize">
<text id="source" x="240" y="70" style="fill:black; font-size:12px; text-anchor:middle;">https://svgwg.org/svg2-draft/text.html#InlineSize</text>
</a>
<g id="test-body-reference" style="font-size:16px;fill:red">
<g transform="translate(0,0)">
<use xlink:href="#TestPath" style="fill:none;stroke:lightblue"/>
<circle cx="80" cy="114.8" r="1,0" style="fill:lightblue"/>
<text>
<tspan x="80" y="114.8">Lorem ipsum dolor sit amet, consectetur</tspan>
<tspan x="80" y="134.8">adipisicing elit,</tspan>
</text>
</g>
<g transform="translate(0,60)">
<use xlink:href="#TestPath" style="fill:none;stroke:lightblue"/>
<circle cx="240" cy="114.8" r="1,0" style="fill:lightblue"/>
<text style="text-anchor:middle">
<tspan x="240" y="114.8">Lorem ipsum dolor sit amet, consectetur</tspan>
<tspan x="240" y="134.8">adipisicing elit,</tspan>
</text>
</g>
<g transform="translate(0,120)">
<use xlink:href="#TestPath" style="fill:none;stroke:lightblue"/>
<circle cx="400" cy="114.8" r="1,0" style="fill:lightblue"/>
<text style="text-anchor:end">
<tspan x="400" y="114.8">Lorem ipsum dolor sit amet, consectetur</tspan>
<tspan x="400" y="134.8">adipisicing elit,</tspan>
</text>
</g>
</g>
<g id="test-body-content" style="font-size:16px;line-spacing:1.25;fill:green">
<g transform="translate(0,0)">
<text x="80" y="114.8" style="inline-size:320px">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
</g>
<g transform="translate(0,60)">
<text x="240" y="114.8" style="inline-size:320px;text-anchor:middle">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
</g>
<g transform="translate(0,120)">
<text x="400" y="114.8" style="inline-size:320px;text-anchor:end">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 3.3 KiB

View File

@ -0,0 +1,82 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:html="http://www.w3.org/1999/xhtml">
<g id="testmeta">
<title>Text in Shape — 002</title>
<html:link rel="author"
title="Tavmjong Bah"
href="mailto:tavmjong@free.fr"/>
<html:link rel="reviewer"
title="NAME_OF_REVIEWER"
href="mailto:EMAIL OR http://CONTACT_PAGE" />
<!-- YYYY-MM-DD -->
<html:link rel="help"
href="https://svgwg.org/svg2-draft/text.html#InlineSize"/>
<metadata class="flags">TOKENS</metadata>
<desc class="assert">TEST ASSERTION</desc>
</g>
<style id="test-font" type="text/css">
/* Standard Font (if needed). */
@font-face {
font-family: FreeSans;
src: url("fonts/FreeSans.woff") format("woff"),
local("FreeSans");
}
text { font-family: FreeSans, sans-serif }
</style>
<style id="test-style" type="text/css">
/* Style that is being tested (if needed). */
text { font-family: FreeSans, sans-serif }
</style>
<defs>
<path id="TestPath" d="m 110,100 40,0 m -40,200 40,0"/>
</defs>
<text id="title" x="240" y="50" style="fill:black; font-size:24px; text-anchor:middle;">Text 'inline-size' — 002</text>
<a href="https://svgwg.org/svg2-draft/text.html#InlineSize">
<text id="source" x="240" y="70" style="fill:black; font-size:12px; text-anchor:middle;">https://svgwg.org/svg2-draft/text.html#InlineSize</text>
</a>
<g id="test-body-reference" style="font-size:16px;fill:red">
<g transform="translate(0,0)">
<text transform="translate(250,10) rotate(90)">
<tspan x="90" y="114.8">Lorem ipsum dolor sit amet,</tspan>
<tspan x="90" y="134.8">consectetur adipisicing elit,</tspan>
</text>
</g>
<g transform="translate(80,0)">
<text transform="translate(250,-40) rotate(90)" style="text-anchor:middle">
<tspan x="240" y="114.8">Lorem ipsum dolor sit amet,</tspan>
<tspan x="240" y="134.8">consectetur adipisicing elit,</tspan>
</text>
</g>
<g transform="translate(160,0)">
<text transform="translate(250,-90) rotate(90)" style="text-anchor:end">
<tspan x="390" y="114.8">Lorem ipsum dolor sit amet,</tspan>
<tspan x="390" y="134.8">consectetur adipisicing elit,</tspan>
</text>
</g>
</g>
<g id="test-body-content" style="font-size:16px;line-spacing:1.25;writing-mode:tb-rl;fill:green">
<g transform="translate(0,0)">
<use xlink:href="#TestPath" style="fill:none;stroke:lightblue"/>
<text x="140" y="100" style="inline-size:200px">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
</g>
<g transform="translate(80,0)">
<use xlink:href="#TestPath" style="fill:none;stroke:lightblue"/>
<text x="140" y="200" style="inline-size:200px;text-anchor:middle">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
</g>
<g transform="translate(160,0)">
<use xlink:href="#TestPath" style="fill:none;stroke:lightblue"/>
<text x="140" y="300" style="inline-size:200px;text-anchor:end">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 3.3 KiB

View File

@ -0,0 +1,82 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:html="http://www.w3.org/1999/xhtml">
<g id="testmeta">
<title>Text: Inline Size — 003</title>
<html:link rel="author"
title="Tavmjong Bah"
href="mailto:tavmjong@free.fr"/>
<html:link rel="reviewer"
title="NAME_OF_REVIEWER"
href="mailto:EMAIL OR http://CONTACT_PAGE" />
<!-- YYYY-MM-DD -->
<html:link rel="help"
href="https://svgwg.org/svg2-draft/text.html#InlineSize"/>
<metadata class="flags">TOKENS</metadata>
<desc class="assert">TEST ASSERTION</desc>
</g>
<style id="test-font" type="text/css">
/* Standard Font (if needed). */
@font-face {
font-family: FreeSans;
src: url("fonts/FreeSans.woff") format("woff"),
local("FreeSans");
}
text { font-family: FreeSans, sans-serif }
</style>
<style id="test-style" type="text/css">
/* Style that is being tested (if needed). */
text { font-family: FreeSans, sans-serif }
</style>
<defs>
<path id="TestPath" d="m 80,100 0,40 m 320,-40 0,40"/>
</defs>
<text id="title" x="240" y="50" style="fill:black; font-size:24px; text-anchor:middle;">Text 'inline-size' — 003</text>
<a href="https://svgwg.org/svg2-draft/text.html#InlineSize">
<text id="source" x="240" y="70" style="fill:black; font-size:12px; text-anchor:middle;">https://svgwg.org/svg2-draft/text.html#InlineSize</text>
</a>
<g id="test-body-reference" style="font-size:16px;direction:rtl;fill:red">
<g transform="translate(0,0)">
<text>
<tspan x="400" y="114.8">لكن لا بد أن أوضح لك أن كل هذه الأفكار</tspan>
<tspan x="400" y="134.8">المغلوطة حول استنكار</tspan>
</text>
</g>
<g transform="translate(0,60)">
<text style="text-anchor:middle">
<tspan x="240" y="114.8">لكن لا بد أن أوضح لك أن كل هذه الأفكار</tspan>
<tspan x="240" y="134.8">المغلوطة حول استنكار</tspan>
</text>
</g>
<g transform="translate(0,120)">
<text style="text-anchor:end">
<tspan x="80" y="114.8">لكن لا بد أن أوضح لك أن كل هذه الأفكار</tspan>
<tspan x="80" y="134.8">المغلوطة حول استنكار</tspan>
</text>
</g>
</g>
<g id="test-body-content" style="font-size:16px;line-spacing:1.25;direction:rtl;fill:green">
<g transform="translate(0,0)">
<use xlink:href="#TestPath" style="fill:none;stroke:lightblue"/>
<text x="400" y="114.8" style="inline-size:320px">لكن لا بد أن أوضح لك أن كل هذه الأفكار المغلوطة حول استنكار</text>
</g>
<g transform="translate(0,60)">
<use xlink:href="#TestPath" style="fill:none;stroke:lightblue"/>
<text x="240" y="114.8" style="inline-size:320px;text-anchor:middle">لكن لا بد أن أوضح لك أن كل هذه الأفكار المغلوطة حول استنكار</text>
</g>
<g transform="translate(0,120)">
<use xlink:href="#TestPath" style="fill:none;stroke:lightblue"/>
<text x="80" y="114.8" style="inline-size:320px;text-anchor:end">لكن لا بد أن أوضح لك أن كل هذه الأفكار المغلوطة حول استنكار</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 3.4 KiB

View File

@ -0,0 +1,66 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:html="http://www.w3.org/1999/xhtml">
<g id="testmeta">
<title>Text: Inline Size — 005</title>
<html:link rel="author"
title="Tavmjong Bah"
href="mailto:tavmjong@free.fr"/>
<html:link rel="reviewer"
title="NAME_OF_REVIEWER"
href="mailto:EMAIL OR http://CONTACT_PAGE" />
<!-- YYYY-MM-DD -->
<html:link rel="help"
href="https://svgwg.org/svg2-draft/text.html#InlineSize"/>
<metadata class="flags">TOKENS</metadata>
<desc class="assert">TEST ASSERTION</desc>
</g>
<style id="test-font" type="text/css">
/* Standard Font (if needed). */
@font-face {
font-family: FreeSans;
src: url("fonts/FreeSans.woff") format("woff"),
local("FreeSans");
}
text { font-family: FreeSans, sans-serif }
</style>
<style id="test-style" type="text/css">
/* Style that is being tested (if needed). */
text { font-family: FreeSans, sans-serif }
</style>
<defs>
<path id="TestPath" d="m 80,100 0,160 m 320,-160 0,160"/>
</defs>
<text id="title" x="240" y="50" style="fill:black; font-size:24px; text-anchor:middle;">Text 'inline-size' — 005</text>
<a href="https://svgwg.org/svg2-draft/text.html#InlineSize">
<text id="source" x="240" y="70" style="fill:black; font-size:12px; text-anchor:middle;">https://svgwg.org/svg2-draft/text.html#InlineSize</text>
</a>
<g id="test-body-reference" style="font-size:16px;fill:#ffeeee">
<g transform="translate(0,0)">
<use xlink:href="#TestPath" style="fill:none;stroke:lightblue"/>
<text>
<tspan x="80" y="114.8">Lorem ipsum dolor sit amet, consectetur</tspan>
<tspan x="80" y="149.6">adipiscing <tspan style="font-size:32px">elit</tspan>, sed do eiusmod tempor</tspan>
<tspan x="80" y="174.8">incididunt ut labore et dolore magna aliqua. Ut</tspan>
<tspan x="80" y="209.6">enim ad minim veniam, <tspan style="font-size:32px">quis</tspan> nostrud</tspan>
<tspan x="80" y="234.8">exercitation ullamco laboris <tspan style="font-size:8px">nisi</tspan> ut aliquip ex ea</tspan>
<tspan x="80" y="254.8">commodo consequat.</tspan>
</text>
</g>
</g>
<g id="test-body-content" style="font-size:16px;line-height:1.25;fill:green">
<g transform="translate(0,0)">
<text x="80" y="114.8" style="inline-size:320px" xml:space="preserve">Lorem ipsum dolor sit amet, consectetur adipiscing <tspan style="font-size:32px">elit</tspan>, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, <tspan style="font-size:2em">quis</tspan> nostrud exercitation ullamco laboris <tspan style="font-size:8px">nisi</tspan> ut aliquip ex ea commodo consequat.</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.9 KiB

View File

@ -0,0 +1,66 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:html="http://www.w3.org/1999/xhtml">
<g id="testmeta">
<title>Text: Inline Size — 006</title>
<html:link rel="author"
title="Tavmjong Bah"
href="mailto:tavmjong@free.fr"/>
<html:link rel="reviewer"
title="NAME_OF_REVIEWER"
href="mailto:EMAIL OR http://CONTACT_PAGE" />
<!-- YYYY-MM-DD -->
<html:link rel="help"
href="https://svgwg.org/svg2-draft/text.html#InlineSize"/>
<metadata class="flags">TOKENS</metadata>
<desc class="assert">TEST ASSERTION</desc>
</g>
<style id="test-font" type="text/css">
/* Standard Font (if needed). */
@font-face {
font-family: FreeSans;
src: url("fonts/FreeSans.woff") format("woff"),
local("FreeSans");
}
text { font-family: FreeSans, sans-serif }
</style>
<style id="test-style" type="text/css">
/* Style that is being tested (if needed). */
text { font-family: FreeSans, sans-serif }
</style>
<defs>
<path id="TestPath" d="m 80,100 0,160 m 320,-160 0,160"/>
</defs>
<text id="title" x="240" y="50" style="fill:black; font-size:24px; text-anchor:middle;">Text 'inline-size' — 006</text>
<a href="https://svgwg.org/svg2-draft/text.html#InlineSize">
<text id="source" x="240" y="70" style="fill:black; font-size:12px; text-anchor:middle;">https://svgwg.org/svg2-draft/text.html#InlineSize</text>
</a>
<g id="test-body-reference" style="font-size:16px;fill:red">
<g transform="translate(0,0)">
<use xlink:href="#TestPath" style="fill:none;stroke:lightblue"/>
<text>
<tspan x="80" y="114.8">Lorem ipsum dolor sit amet, consectetur</tspan>
<tspan x="80" y="134.8">adipiscing <tspan style="font-size:32px">elit</tspan>, sed do eiusmod tempor</tspan>
<tspan x="80" y="154.8">incididunt ut labore et dolore magna aliqua. Ut</tspan>
<tspan x="80" y="174.8">enim ad minim veniam, <tspan style="font-size:32px">quis</tspan> nostrud</tspan>
<tspan x="80" y="194.8">exercitation ullamco laboris <tspan style="font-size:8px">nisi</tspan> ut aliquip ex ea</tspan>
<tspan x="80" y="214.8">commodo consequat.</tspan>
</text>
</g>
</g>
<g id="test-body-content" style="font-size:16px;line-height:1.25;fill:green">
<g transform="translate(0,0)">
<text x="80" y="114.8" style="inline-size:320px">Lorem ipsum dolor sit amet, consectetur adipiscing <tspan style="font-size:32px;line-height:0">elit</tspan>, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, <tspan style="font-size:2em;line-height:0">quis</tspan> nostrud exercitation ullamco laboris <tspan style="font-size:8px">nisi</tspan> ut aliquip ex ea commodo consequat.</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.9 KiB

View File

@ -0,0 +1,66 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:html="http://www.w3.org/1999/xhtml">
<g id="testmeta">
<title>Text: Inline Size — 006</title>
<html:link rel="author"
title="Tavmjong Bah"
href="mailto:tavmjong@free.fr"/>
<html:link rel="reviewer"
title="NAME_OF_REVIEWER"
href="mailto:EMAIL OR http://CONTACT_PAGE" />
<!-- YYYY-MM-DD -->
<html:link rel="help"
href="https://svgwg.org/svg2-draft/text.html#InlineSize"/>
<metadata class="flags">TOKENS</metadata>
<desc class="assert">TEST ASSERTION</desc>
</g>
<style id="test-font" type="text/css">
/* Standard Font (if needed). */
@font-face {
font-family: FreeSans;
src: url("fonts/FreeSans.woff") format("woff"),
local("FreeSans");
}
text { font-family: FreeSans, sans-serif }
</style>
<style id="test-style" type="text/css">
/* Style that is being tested (if needed). */
text { font-family: FreeSans, sans-serif }
</style>
<defs>
<path id="TestPath" d="m 80,100 0,160 m 320,-160 0,160"/>
</defs>
<text id="title" x="240" y="50" style="fill:black; font-size:24px; text-anchor:middle;">Text 'inline-size' — 007</text>
<a href="https://svgwg.org/svg2-draft/text.html#InlineSize">
<text id="source" x="240" y="70" style="fill:black; font-size:12px; text-anchor:middle;">https://svgwg.org/svg2-draft/text.html#InlineSize</text>
</a>
<g id="test-body-reference" style="font-size:16px;fill:red">
<g transform="translate(0,0)">
<use xlink:href="#TestPath" style="fill:none;stroke:lightblue"/>
<text>
<tspan x="80" y="114.8">Lorem ipsum dolor sit amet, consectetur</tspan>
<tspan x="80" y="139.6">adipiscing <tspan style="font-size:32px">elit</tspan>, sed do eiusmod tempor</tspan>
<tspan x="80" y="159.6">incididunt ut labore et dolore magna aliqua. Ut</tspan>
<tspan x="80" y="184.4">enim ad minim veniam, <tspan style="font-size:32px">quis</tspan> nostrud</tspan>
<tspan x="80" y="204.4">exercitation ullamco laboris <tspan style="font-size:8px">nisi</tspan> ut aliquip ex ea</tspan>
<tspan x="80" y="226.8">commodo consequat.</tspan>
</text>
</g>
</g>
<g id="test-body-content" style="font-size:16px;fill:green">
<g transform="translate(0,0)">
<text x="80" y="114.8" style="inline-size:320px;line-height:20px">Lorem ipsum dolor sit amet, consectetur adipiscing <tspan style="font-size:32px">elit</tspan>, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, <tspan style="font-size:2em">quis</tspan> nostrud exercitation ullamco laboris <tspan style="font-size:8px">nisi</tspan> ut aliquip ex ea commodo consequat.</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.9 KiB

View File

@ -0,0 +1,82 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:html="http://www.w3.org/1999/xhtml">
<g id="testmeta">
<title>Text: Inline Size — 101</title>
<html:link rel="author"
title="Tavmjong Bah"
href="mailto:tavmjong@free.fr"/>
<html:link rel="reviewer"
title="NAME_OF_REVIEWER"
href="mailto:EMAIL OR http://CONTACT_PAGE" />
<!-- YYYY-MM-DD -->
<html:link rel="help"
href="https://svgwg.org/svg2-draft/text.html#InlineSize"/>
<metadata class="flags">TOKENS</metadata>
<desc class="assert">TEST ASSERTION</desc>
</g>
<style id="test-font" type="text/css">
/* Standard Font (if needed). */
@font-face {
font-family: FreeSans;
src: url("fonts/FreeSans.woff") format("woff"),
local("FreeSans");
}
text { font-family: FreeSans, sans-serif }
</style>
<style id="test-style" type="text/css">
/* Style that is being tested (if needed). */
text { font-family: FreeSans, sans-serif }
</style>
<defs>
<path id="TestPath" d="m 80,100 0,40 m 320,-40 0,40"/>
</defs>
<text id="title" x="240" y="50" style="fill:black; font-size:24px; text-anchor:middle;">Text 'inline-size' — 101</text>
<a href="https://svgwg.org/svg2-draft/text.html#InlineSize">
<text id="source" x="240" y="70" style="fill:black; font-size:12px; text-anchor:middle;">https://svgwg.org/svg2-draft/text.html#InlineSize</text>
</a>
<g id="test-body-reference" style="font-size:16px;fill:red">
<g transform="translate(0,0)">
<use xlink:href="#TestPath" style="fill:none;stroke:lightblue"/>
<text>
<tspan x="80" y="114.8">Lorem ipsum dolor sit amet, consectetur</tspan>
<tspan x="80" y="134.8">adipisicing elit,</tspan>
</text>
</g>
<g transform="translate(0,60)">
<use xlink:href="#TestPath" style="fill:none;stroke:lightblue"/>
<text style="text-anchor:middle">
<tspan x="240" y="114.8">Lorem ipsum dolor sit amet, consectetur</tspan>
<tspan x="240" y="134.8">adipisicing elit,</tspan>
</text>
</g>
<g transform="translate(0,120)">
<use xlink:href="#TestPath" style="fill:none;stroke:lightblue"/>
<text style="text-anchor:end">
<tspan x="400" y="114.8">Lorem ipsum dolor sit amet, consectetur</tspan>
<tspan x="400" y="134.8">adipisicing elit,</tspan>
</text>
</g>
</g>
<g id="test-body-content" style="font-size:16px;line-spacing:1.25;fill:green">
<g transform="translate(0,0)">
<text x="80" y="114.8" style="inline-size:66.66667%">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
</g>
<g transform="translate(0,60)">
<text x="240" y="114.8" style="inline-size:66.66667%;text-anchor:middle">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
</g>
<g transform="translate(0,120)">
<text x="400" y="114.8" style="inline-size:66.66667%;text-anchor:end">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 3.1 KiB

View File

@ -0,0 +1,91 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
xmlns:html="http://www.w3.org/1999/xhtml">
<g id="testmeta">
<title>Text in Shape — 201</title>
<html:link rel="author"
title="Tavmjong Bah"
href="mailto:tavmjong@free.fr"/>
<html:link rel="reviewer"
title="NAME_OF_REVIEWER"
href="mailto:EMAIL OR http://CONTACT_PAGE" />
<!-- YYYY-MM-DD -->
<html:link rel="help"
href="https://svgwg.org/svg2-draft/text.html#InlineSize"/>
<metadata class="flags">TOKENS</metadata>
<desc class="assert">TEST ASSERTION</desc>
</g>
<style id="test-font" type="text/css">
/* Standard Font (if needed). */
@font-face {
font-family: FreeSans;
src: url("fonts/FreeSans.woff") format("woff"),
local("FreeSans");
}
text { font-family: FreeSans, sans-serif }
</style>
<style id="test-style" type="text/css">
/* Style that is being tested (if needed). */
text { font-family: FreeSans, sans-serif }
</style>
<defs>
<path id="TestPath" d="m 110,100 40,0 m -40,200 40,0"/>
</defs>
<text id="title" x="240" y="50" style="fill:black; font-size:24px; text-anchor:middle;">Text 'inline-size' — 201</text>
<a href="https://svgwg.org/svg2-draft/text.html#InlineSize">
<text id="source" x="240" y="70" style="fill:black; font-size:12px; text-anchor:middle;">https://svgwg.org/svg2-draft/text.html#InlineSize</text>
</a>
<g id="test-body-reference" style="font-size:16px;fill:red">
<g transform="translate(0,0)">
<use xlink:href="#TestPath" style="fill:none;stroke:lightblue"/>
<text style="writing-mode:tb-rl">
<tspan x="140" y="100">漢字</tspan>
<tspan x="140" y="132">Lorem ipsum</tspan>
<tspan x="140" y="227.7">漢字</tspan>
</text>
</g>
<g transform="translate(80,0)">
<use xlink:href="#TestPath" style="fill:none;stroke:lightblue"/>
<text transform="translate(250,-40) rotate(90)">
<tspan x="140" y="110">漢字Lorem ipsum!漢字</tspan>
</text>
</g>
<g transform="translate(160,0)">
<use xlink:href="#TestPath" style="fill:none;stroke:lightblue"/>
<text transform="translate(250,-40) rotate(90)">
<tspan x="140" y="110">漢字!لكن لا بد أن漢字</tspan>
</text>
</g>
<g transform="translate(240,0)">
<use xlink:href="#TestPath" style="fill:none;stroke:lightblue"/>
<text transform="translate(250,-40) rotate(90)" style="direction:rtl;text-anchor:end">
<tspan x="140" y="110">漢字!لكن لا بد أن漢字</tspan>
</text>
</g>
</g>
<!-- Lorem ipsum dolor sit amet, consectetur adipisicing elit, -->
<g id="test-body-content" style="font-size:16px;line-spacing:1.25;writing-mode:tb-rl;fill:green">
<g transform="translate(0,0)">
<text x="140" y="100" style="inline-size:200px">漢字Lorem ipsum!漢字</text>
</g>
<g transform="translate(80,0)" style="text-orientation:sideways">
<text x="140" y="100" style="inline-size:200px">漢字Lorem ipsum!漢字</text>
</g>
<g transform="translate(160,0)" style="text-orientation:sideways">
<text x="140" y="100" style="inline-size:200px">漢字!لكن لا بد أن漢字</text>
</g>
<g transform="translate(240,0)" style="direction:rtl;text-orientation:sideways">
<text x="140" y="100" style="inline-size:200px">漢字!لكن لا بد أن漢字</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 3.5 KiB