diff options
Diffstat (limited to 'testing/web-platform/tests/css/css-text/letter-spacing/reference')
24 files changed, 830 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-200-ref.html b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-200-ref.html new file mode 100644 index 0000000000..d6e87a56d9 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-200-ref.html @@ -0,0 +1,52 @@ +<!DOCTYPE html> +<html lang="en" > +<meta charset="utf-8"> +<title>CSS Test Reference</title> +<link rel='author' title='Elika J. Etemad' href='http://fantasai.inkedblade.net/contact'> +<style type='text/css'> + @import "/fonts/ahem.css"; + .contain { + font: 20px/1 Ahem; + width: 5em; + border: solid blue; + margin: 1em; + float: left; } + .pre, .control p { + white-space: pre; + } + p { margin: 0; } +</style> + +<div id='instructions'>Test passes if the pattern is identical in all four blue boxes.</div> + +<!-- Control --> +<div class="contain control"> + <p>x x</p> + <p>x x 水<br>x x x<br>水 x x</p> + <p>x x x<br>x x<br>x x x</p> + <p>x x x<br>x x<br>x x x</p> +</div> + +<!-- Control --> +<div class="contain control"> + <p>x x</p> + <p>x x 水<br>x x x<br>水 x x</p> + <p>x x x<br>x x<br>x x x</p> + <p>x x x<br>x x<br>x x x</p> +</div> + +<!-- Control --> +<div class="contain control"> + <p>x x</p> + <p>x x 水<br>x x x<br>水 x x</p> + <p>x x x<br>x x<br>x x x</p> + <p>x x x<br>x x<br>x x x</p> +</div> + +<!-- Control --> +<div class="contain control"> + <p>x x</p> + <p>x x 水<br>x x x<br>水 x x</p> + <p>x x x<br>x x<br>x x x</p> + <p>x x x<br>x x<br>x x x</p> +</div> diff --git a/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-201-ref.html b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-201-ref.html new file mode 100644 index 0000000000..6898da609d --- /dev/null +++ b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-201-ref.html @@ -0,0 +1,50 @@ +<!DOCTYPE html> +<html lang="en" > +<meta charset="utf-8"> +<title>CSS Test Reference</title> +<link rel='author' title='Elika J. Etemad' href='http://fantasai.inkedblade.net/contact'> +<style type='text/css'> + @import "/fonts/ahem.css"; + .contain { + font: 20px/1 Ahem; + width: 5em; + border: solid blue; + margin: 1em; + float: left; } + p { margin: 0; + white-space: pre; } +</style> + +<div id='instructions'>Test passes if the pattern is identical in all four blue boxes.</div> + +<!-- Control --> +<div class="contain"> + <p> x </p> + <p>x x <br> x <br> x x</p> + <p>x x <br> x <br> x x</p> + <p>x x <br> x <br> x x</p> +</div> + +<!-- Control --> +<div class="contain"> + <p> x </p> + <p>x x <br> x <br> x x</p> + <p>x x <br> x <br> x x</p> + <p>x x <br> x <br> x x</p> +</div> + +<!-- Control --> +<div class="contain"> + <p> x </p> + <p>x x <br> x <br> x x</p> + <p>x x <br> x <br> x x</p> + <p>x x <br> x <br> x x</p> +</div> + +<!-- Control --> +<div class="contain"> + <p> x </p> + <p>x x <br> x <br> x x</p> + <p>x x <br> x <br> x x</p> + <p>x x <br> x <br> x x</p> +</div> diff --git a/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-202-ref.html b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-202-ref.html new file mode 100644 index 0000000000..08ea8e56e3 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-202-ref.html @@ -0,0 +1,14 @@ +<!DOCTYPE html> +<html lang="en" > +<meta charset="utf-8"> +<title>CSS Test Reference</title> +<link rel='author' title='Elika J. Etemad' href='http://fantasai.inkedblade.net/contact'> +<style type='text/css'> + @import "/fonts/ahem.css"; + .test { float: left; color: green; background: red; font: 20px/1 Ahem; } + .spacing { position: absolute; width: 1em; height: 2em; margin: 0 1em; background: green; } +</style> + +<div id='instructions'>Test passes if there is a green rectangle below and no red.</div> + +<div class="test"><div class="spacing"></div>xx<br>xx</div></div> diff --git a/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-203-ref.html b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-203-ref.html new file mode 100644 index 0000000000..3461347a28 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-203-ref.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html lang="en" > +<meta charset="utf-8"> +<title>CSS Test Reference</title> +<link rel='author' title='Elika J. Etemad' href='http://fantasai.inkedblade.net/contact'> +<style type='text/css'> + @import "/fonts/ahem.css"; + .contain { + font: 20px/1 Ahem; + border: solid blue; + margin: 1em; + float: left; } + .control p { + white-space: pre-wrap; + } + p { + letter-spacing: 0; + margin: 0; + } +</style> + +<div id='instructions'>Test passes if the pattern is identical in both blue boxes.</div> + +<div class="contain control"> + <!-- middle owned by containing block: simple --> + <p>AAA BBB</p> + <p>A A AB B B</p> + <!-- middle owned by containing block: double nesting --> + <p>AAAB B B</p> + <p>A A AB B B</p> + <!-- middle owned by inline: simple --> + <p>AAA BBB</p> + <p>A A AB B B</p> + <!-- middle owned by inline: double nesting --> + <p>AAAB B B</p> + <p>A A A B B B</p> + <!-- middle containing space --> + <p>AAA BBB</p> + <p>AAA B B B</p> +</div> + +<div class="contain control"> + <!-- middle owned by containing block: simple --> + <p>AAA BBB</p> + <p>A A AB B B</p> + <!-- middle owned by containing block: double nesting --> + <p>AAAB B B</p> + <p>A A AB B B</p> + <!-- middle owned by inline: simple --> + <p>AAA BBB</p> + <p>A A AB B B</p> + <!-- middle owned by inline: double nesting --> + <p>AAAB B B</p> + <p>A A A B B B</p> + <!-- middle containing space --> + <p>AAA BBB</p> + <p>AAA B B B</p> +</div> diff --git a/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-204-ref.html b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-204-ref.html new file mode 100644 index 0000000000..078656c463 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-204-ref.html @@ -0,0 +1,74 @@ +<!DOCTYPE html> +<html lang="en" > +<meta charset="utf-8"> +<title>CSS Test Reference</title> +<link rel='author' title='Elika J. Etemad' href='http://fantasai.inkedblade.net/contact'> +<style type='text/css'> + @import "/fonts/ahem.css"; + .contain { + font: 20px/1 Ahem; + border: solid blue; + margin: 1em; + float: left; } + + .block, .table, .flex, .grid { + display: inline-block; + width: 15px; + height: 15px; + background: orange; + } + .table { + display: inline-table; + } + .flex { + display: inline-flex; + } + .grid { + display: inline-grid; + } + .control p { + white-space: pre-wrap; + } + p { + letter-spacing: 0; + margin: 0; + } +</style> + +<div id='instructions'>Test passes if the pattern is identical in all blue boxes.</div> + +<div class="contain control"> + <p>A <img src="../support/swatch-orange.png"><img src="../support/swatch-orange.png"> D</p> + <p>A <img class="block" src="../support/swatch-orange.png"><img class="block" src="../support/swatch-orange.png"> D</p> + <p>A <span class="block"></span><span class="block"></span> D</p> + <p>A <span class="table"></span><span class="block"></span> D</p> + <p>A <span class="flex"></span><span class="block"></span> D</p> + <p>A <span class="grid"></span><span class="block"></span> D</p> +</div> + +<div class="contain control"> + <p>A <img src="../support/swatch-orange.png"><img src="../support/swatch-orange.png"> D</p> + <p>A <img class="block" src="../support/swatch-orange.png"><img class="block" src="../support/swatch-orange.png"> D</p> + <p>A <span class="block"></span><span class="block"></span> D</p> + <p>A <span class="table"></span><span class="block"></span> D</p> + <p>A <span class="flex"></span><span class="block"></span> D</p> + <p>A <span class="grid"></span><span class="block"></span> D</p> +</div> + +<div class="contain control"> + <p>A <img src="../support/swatch-orange.png"><img src="../support/swatch-orange.png"> D</p> + <p>A <img class="block" src="../support/swatch-orange.png"><img class="block" src="../support/swatch-orange.png"> D</p> + <p>A <span class="block"></span><span class="block"></span> D</p> + <p>A <span class="table"></span><span class="block"></span> D</p> + <p>A <span class="flex"></span><span class="block"></span> D</p> + <p>A <span class="grid"></span><span class="block"></span> D</p> +</div> + +<div class="contain control"> + <p>A <img src="../support/swatch-orange.png"><img src="../support/swatch-orange.png"> D</p> + <p>A <img class="block" src="../support/swatch-orange.png"><img class="block" src="../support/swatch-orange.png"> D</p> + <p>A <span class="block"></span><span class="block"></span> D</p> + <p>A <span class="table"></span><span class="block"></span> D</p> + <p>A <span class="flex"></span><span class="block"></span> D</p> + <p>A <span class="grid"></span><span class="block"></span> D</p> +</div> diff --git a/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-205-ref.html b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-205-ref.html new file mode 100644 index 0000000000..3c6e2aa60e --- /dev/null +++ b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-205-ref.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang="en" > +<meta charset="utf-8"> +<title>letter-spacing at element boundaries</title> +<link rel='author' title='Elika J. Etemad' href='http://fantasai.inkedblade.net/contact'> +<style type='text/css'> + @import "/fonts/ahem.css"; + .contain { + font: 20px/1 Ahem; + border: solid blue; + margin: 1em; + width: max-content; } + .ls1 { + letter-spacing: 1em; + } + span { + border: solid orange; + } + .control p { + white-space: pre-wrap; + } + p { + letter-spacing: 0; + margin: 0; + } +</style> + +<div id='instructions'>Test passes if the pattern is identical in both blue boxes.</div> + +<div class="contain control"> + <p><span></span>A<span></span><span></span> D<span></span> +</div> + +<div class="contain control"> + <p><span></span>A<span></span><span></span> D<span></span> +</div> diff --git a/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-206-ref.html b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-206-ref.html new file mode 100644 index 0000000000..36bad163f0 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-206-ref.html @@ -0,0 +1,84 @@ +<!DOCTYPE html> +<html lang="en" > +<meta charset="utf-8"> +<title>letter-spacing at element boundaries</title> +<link rel='author' title='Elika J. Etemad' href='http://fantasai.inkedblade.net/contact'> +<style type='text/css'> + @import "/fonts/ahem.css"; + .contain { + font: 20px/1 Ahem; + border: solid blue; + margin: 1em; + float: left; } + .control p { + white-space: pre; + } + p { + letter-spacing: 0; + margin: 0; + word-break: break-all; + float: left; + clear: left; + border-right: solid orange 1em; + background: yellow; + } +</style> + +<div id='instructions'>Test passes if the pattern is identical in all three blue boxes.</div> + +<div class="contain control"> +<p>A A A B B B</p> +<!-- middle owned by containing block: simple --> +<p>AAA BBB</p> +<p>A A AB B B</p> +<!-- middle owned by containing block: double nesting --> +<p>AAA B B B</p> +<p>A A A B B B</p> +<!-- middle owned by inline: simple --> +<p>AAA BBB</p> +<p>A A AB B B</p> +<!-- middle owned by inline: double nesting --> +<p>AAAB B B</p> +<p>A A A B B B</p> +<!-- middle containing space --> +<p>AAA BBB</p> +<p>AAA B B B</p> +</div> + +<div class="contain control"> +<p>A A A B B B</p> +<!-- middle owned by containing block: simple --> +<p>AAA BBB</p> +<p>A A AB B B</p> +<!-- middle owned by containing block: double nesting --> +<p>AAA B B B</p> +<p>A A A B B B</p> +<!-- middle owned by inline: simple --> +<p>AAA BBB</p> +<p>A A AB B B</p> +<!-- middle owned by inline: double nesting --> +<p>AAAB B B</p> +<p>A A A B B B</p> +<!-- middle containing space --> +<p>AAA BBB</p> +<p>AAA B B B</p> +</div> + +<div class="contain control"> +<p>A A A B B B</p> +<!-- middle owned by containing block: simple --> +<p>AAA BBB</p> +<p>A A AB B B</p> +<!-- middle owned by containing block: double nesting --> +<p>AAA B B B</p> +<p>A A A B B B</p> +<!-- middle owned by inline: simple --> +<p>AAA BBB</p> +<p>A A AB B B</p> +<!-- middle owned by inline: double nesting --> +<p>AAAB B B</p> +<p>A A A B B B</p> +<!-- middle containing space --> +<p>AAA BBB</p> +<p>AAA B B B</p> +</div> diff --git a/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-211-ref.html b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-211-ref.html new file mode 100644 index 0000000000..9b3499ed7c --- /dev/null +++ b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-211-ref.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html lang="en" > +<meta charset="utf-8"> +<title>letter-spacing at element boundaries</title> +<link rel='author' title='Elika J. Etemad' href='http://fantasai.inkedblade.net/contact'> +<style type='text/css'> + @import "/fonts/ahem.css"; + .contain { + font: 20px/1 Ahem; + margin: 1em; } + .control p { + white-space: pre-wrap; + } + p { + letter-spacing: 0; + margin: 0; + text-emphasis: dot; + } +</style> + +<div id='instructions'>Test passes if the blue pattern is identical to the black one.</div> + +<div class="contain control"> + <p>A B C +</div> + +<div class="contain control" style="color:blue"> + <p>A B C +</div> diff --git a/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-212-ref.html b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-212-ref.html new file mode 100644 index 0000000000..889803699d --- /dev/null +++ b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-212-ref.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html lang="en" > +<meta charset="utf-8"> +<title>CSS Test Reference</title> +<link rel='author' title='Elika J. Etemad' href='http://fantasai.inkedblade.net/contact'> +<style type='text/css'> + @import "/fonts/ahem.css"; + .contain { + font: 20px/1 Ahem; + margin: 1em; } + .control p { + white-space: pre-wrap; + } + p { + letter-spacing: 0; + margin: 0; + } +</style> + +<div id='instructions'>Test passes if the blue pattern is identical to the black one.</div> + +<div class="contain control"> + <p><ruby>A<rt>a</rt></ruby> <ruby>B B<rt>b</rt></ruby></p> +</div> + +<div class="contain control" style="color: blue"> + <p><ruby>A<rt>a</rt></ruby> <ruby>B B<rt>b</rt></ruby></p> +</div> diff --git a/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-bengali-yaphala-001-ref.html b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-bengali-yaphala-001-ref.html new file mode 100644 index 0000000000..a1ff2e053a --- /dev/null +++ b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-bengali-yaphala-001-ref.html @@ -0,0 +1,98 @@ +<!DOCTYPE html> +<html lang="en"> +<meta charset="utf-8"> +<title>CSS Text reference: letter-spacing and Bengali ya-phala (yo-pholo)</title> +<link rel="author" title="Jonathan Kew" href="mailto:jkew@mozilla.com"> + +<style> +/* We try various "likely" font names, as well as generics; those not available + on the platform will simply fall back to a default. */ +.outer.a { + font-family: sans-serif; +} +.outer.b { + font-family: serif; +} +.outer.c { + font-family: Bangla MN, serif; +} +.outer.d { + font-family: Bangla Sangam MN, sans-serif; +} +.outer.e { + font-family: Nirmala UI, Vrinda, sans-serif; +} +.outer.f { + font-family: Noto Sans Bengali, sans-serif; +} +.inner { + position: relative; + margin: 1em; + height: 2em; +} +.mask { + padding: 0.25em; + color: green; + background: green; + position: absolute; +} +span { + display: inline-block; +} +</style> + +<p>Test passes if the red Bengali text is entirely hidden by the green blocks.</p> + +<div class="outer a"> + <div class="inner" lang="bn"> + <div class="mask">অ্যান্টিগুয়া<span style="width:3em"></span></div> + </div> + <div class="inner" lang="bn"> + <div class="mask">এ্যাডভোকেট<span style="width:4em"></span></div> + </div> +</div> + +<div class="outer b"> + <div class="inner" lang="bn"> + <div class="mask">অ্যান্টিগুয়া<span style="width:3em"></span></div> + </div> + <div class="inner" lang="bn"> + <div class="mask">এ্যাডভোকেট<span style="width:4em"></span></div> + </div> +</div> + +<div class="outer c"> + <div class="inner" lang="bn"> + <div class="mask">অ্যান্টিগুয়া<span style="width:3em"></span></div> + </div> + <div class="inner" lang="bn"> + <div class="mask">এ্যাডভোকেট<span style="width:4em"></span></div> + </div> +</div> + +<div class="outer d"> + <div class="inner" lang="bn"> + <div class="mask">অ্যান্টিগুয়া<span style="width:3em"></span></div> + </div> + <div class="inner" lang="bn"> + <div class="mask">এ্যাডভোকেট<span style="width:4em"></span></div> + </div> +</div> + +<div class="outer e"> + <div class="inner" lang="bn"> + <div class="mask">অ্যান্টিগুয়া<span style="width:3em"></span></div> + </div> + <div class="inner" lang="bn"> + <div class="mask">এ্যাডভোকেট<span style="width:4em"></span></div> + </div> +</div> + +<div class="outer f"> + <div class="inner" lang="bn"> + <div class="mask">অ্যান্টিগুয়া<span style="width:3em"></span></div> + </div> + <div class="inner" lang="bn"> + <div class="mask">এ্যাডভোকেট<span style="width:4em"></span></div> + </div> +</div> diff --git a/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-bidi-001-ref.html b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-bidi-001-ref.html new file mode 100644 index 0000000000..e34dbc313f --- /dev/null +++ b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-bidi-001-ref.html @@ -0,0 +1,14 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>CSS test reference</title> +<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/"> +<style> +div { + font-family: monospace; + font-size: 3em; +} +</style> + +<p>Test passes if the rightmost character of the line that starts with “a” is under the number 4. +<div>12345</div> +<div>abאב</div> diff --git a/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-bidi-002-ref.html b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-bidi-002-ref.html new file mode 100644 index 0000000000..f197769f3a --- /dev/null +++ b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-bidi-002-ref.html @@ -0,0 +1,14 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>CSS test reference</title> +<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/"> +<style> +div { + font-family: monospace; + font-size: 3em; +} +</style> + +<p>Test passes if the rightmost character of the line that starts with “a” is under the number 3. +<div>12345</div> +<div>aaב<br>ב</div> diff --git a/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-bidi-003-ref.xht b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-bidi-003-ref.xht new file mode 100644 index 0000000000..d46dd7a361 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-bidi-003-ref.xht @@ -0,0 +1,30 @@ +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <meta charset="utf-8" /> + <link rel="author" title="Mike Bremford" href="http://bfo.com" /> + <style> + .control { + font: 50px/1 monospace; + width: 14ch; + font-kerning: none; + border: 1px solid black; + white-space: pre; + } + .red { + color: red; + position: absolute; + z-index: -1; + } + </style> + </head> + <body> + <p>Test passes if no red is visible except for anti-aliasing differences.</p> + <!-- bet <ls> alef <ls> <space stretched from justification> A <ls> B --> + <div class="control red">א ב<div style="float: right">A B</div></div> + <div class="control">א ב<div style="float: right">A B</div></div> + + <!-- A <ls> B <ls> <space stretched from justification> alef <ls> bet --> + <div class="control red">A B<div style="float: right">א ב</div></div> + <div class="control">A B<div style="float: right">א ב</div></div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-bidi-004-ref.xht b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-bidi-004-ref.xht new file mode 100644 index 0000000000..a0326fcbaf --- /dev/null +++ b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-bidi-004-ref.xht @@ -0,0 +1,27 @@ +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <meta charset="utf-8" /> + <link rel="author" title="Mike Bremford" href="http://bfo.com" /> + <style> + .control { + font: 50px/1 monospace; + font-kerning: none; + white-space: pre; + } + .red { + color: red; + position: absolute; + z-index: -1; + } + .control span { + background: green; + } + </style> + </head> + <body> + <p>Test passes if no red is visible except for anti-aliasing differences, and the green boxes are the width of a single letter.</p> + <!-- A <ls> B <ls> <bg>C</bg> <ls> gimel <ls> bet <ls> <bg>alef</bg> <gap> --> + <div class="control red">A B <span>C</span> ב ג <span style="unicode-bidi:embed">א</span></div> + <div class="control">A B <span>C</span> ב ג <span style="unicode-bidi:embed">א</span></div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-bidi-005-ref.xht b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-bidi-005-ref.xht new file mode 100644 index 0000000000..d93f98495a --- /dev/null +++ b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-bidi-005-ref.xht @@ -0,0 +1,27 @@ +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <meta charset="utf-8" /> + <link rel="author" title="Mike Bremford" href="http://bfo.com" /> + <style> + .control { + font: 50px/1 monospace; + font-kerning: none; + white-space: pre; + } + .red { + color: red; + position: absolute; + z-index: -1; + } + .control span { + background: green; + } + </style> + </head> + <body> + <p>Test passes if no red is visible except for anti-aliasing differences, and the green rectangle does not extend beyond B to C.</p> + <!-- A <ls> <ls> <bg>B <ls> bet <ls> alef <ls> C</bg> <ls> D <gap> --> + <div class="control red">A <span>B א ב C</span> D</div> + <div class="control">A <span>B א ב C</span> D</div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-control-chars-001.ref.html b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-control-chars-001.ref.html new file mode 100644 index 0000000000..977d821145 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-control-chars-001.ref.html @@ -0,0 +1,30 @@ +<!doctype html> +<html> +<head> +<meta charset=utf-8> +<title>letter-spacing should not be applied to zero-width format controls</title> +<style> +.test { + font: 12px/2 monospace; + letter-spacing: 4px; +} +</style> +</head> +<body> +The two lines below should match:<br> +<div class=test> +letterspacing should not be +affected by +zero-width +format +characters +</div> +<div class=test> +letterspacing should not be +affected by +zero-width +format +characters +</div> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-end-of-line-001-ref.html b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-end-of-line-001-ref.html new file mode 100644 index 0000000000..eb474ab8d2 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-end-of-line-001-ref.html @@ -0,0 +1,14 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>CSS test reference</title> +<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/"> +<style> +div { + font-family: monospace; + font-size: 3em; +} +</style> + +<p>Test passes if the rightmost character of the line that starts with “a” is under the number 4. +<div>12345</div> +<div>a aa</div> diff --git a/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-ligatures-001-ref.html b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-ligatures-001-ref.html new file mode 100644 index 0000000000..e4caf6587a --- /dev/null +++ b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-ligatures-001-ref.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html lang="en" > +<meta charset="utf-8"> +<title>text-justify:inter-character and ligatures</title> +<link rel='author' title='Florian Rivoal' href='https://florian.rivoal.net'> +<style> +@font-face { + font-family: 'mplus'; + src: url('/fonts/mplus-1p-regular.woff'); +} +div { + font-size: 2em; + font-family: mplus; + width: 12ch; + text-align: justify; + text-align-last: justify; + text-justify: inter-character; + font-variant-ligatures: none; + font-kerning: none; +} +span { + display: inline-block; + text-justify: auto; +} +.ref { color: blue;} +.noref { color: orange; font-variant-ligatures: initial;} +</style> +<p>Test passes if the black text looks like the blue one, not the orange one. +<div>office</div> +<div class=ref>office</div> +<div class=noref>o<span>ffi</span>ce</div> diff --git a/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-ligatures-002-ref.html b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-ligatures-002-ref.html new file mode 100644 index 0000000000..2cbe5b0a0c --- /dev/null +++ b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-ligatures-002-ref.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html lang="en" > +<meta charset="utf-8"> +<title>letter spacing and ligatures</title> +<link rel='author' title='Florian Rivoal' href='https://florian.rivoal.net'> +<style> +@font-face { + font-family: 'mplus'; + src: url('/fonts/mplus-1p-regular.woff'); +} +div { + font-size: 2em; + font-family: mplus; + width: 12ch; + font-variant-ligatures: none; + letter-spacing: 0; + font-kerning: none; +} +i { + padding-left: 20px; +} +.ref { + color: blue; +} +</style> +<p>Test passes if the black text looks like the blue one. +<div>o<i></i>f<i></i>f<i></i>i<i></i>c<i></i>e</div> +<div class=ref>o<i></i>f<i></i>f<i></i>i<i></i>c<i></i>e</div> diff --git a/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-ligatures-003-ref.html b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-ligatures-003-ref.html new file mode 100644 index 0000000000..2d1e7bd038 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-ligatures-003-ref.html @@ -0,0 +1,17 @@ +<!DOCTYPE html> +<html lang="en" > +<meta charset="utf-8"> +<title>text-justify:inter-character and ligatures</title> +<link rel='author' title='Florian Rivoal' href='https://florian.rivoal.net'> +<style> +div { + font-size: 2em; + width: 12ch; +} +span { float: right; } +.ref { color: blue; } +</style> +<p>Test passes if the black text looks like the blue one. +<div lang=km>សា<span>ហា</span></div> +<div lang=km class=ref>សា<span>ហា</span></div> + diff --git a/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-ligatures-004-ref.html b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-ligatures-004-ref.html new file mode 100644 index 0000000000..bb3881fc5e --- /dev/null +++ b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-ligatures-004-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html lang="en" > +<meta charset="utf-8"> +<title>letter spacing and ligatures</title> +<link rel='author' title='Florian Rivoal' href='https://florian.rivoal.net'> +<style> +div { + font-size: 2em; + width: 12ch; + font-kerning: none; +} +span { + padding-left: 20px; +} +.ref { + color: blue; +} +</style> +<p>Test passes if the black text looks like the blue one. +<div lang=km>សា<span></span>ហា</div> +<div lang=km class=ref>សា<span></span>ហា</div> diff --git a/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-nesting-001-ref.html b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-nesting-001-ref.html new file mode 100644 index 0000000000..3d003f3621 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-nesting-001-ref.html @@ -0,0 +1,14 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>CSS test reference</title> +<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/"> +<style> +div { + font-family: monospace; + font-size: 3em; +} +</style> + +<p>Test passes if the rightmost character of the line that starts with “a” is under the number 5. +<div>123456</div> +<div>aa aa</div> diff --git a/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-nesting-002-ref.html b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-nesting-002-ref.html new file mode 100644 index 0000000000..93eb6b0fca --- /dev/null +++ b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-nesting-002-ref.html @@ -0,0 +1,14 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>CSS test reference</title> +<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/"> +<style> +div { + font-family: monospace; + font-size: 3em; +} +</style> + +<p>Test passes if the rightmost character of the line that starts with “a” is under the number 3. +<div>12345</div> +<div>aaa</div> diff --git a/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-nesting-003-ref.xht b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-nesting-003-ref.xht new file mode 100644 index 0000000000..996f2a1e30 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/letter-spacing/reference/letter-spacing-nesting-003-ref.xht @@ -0,0 +1,26 @@ +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <meta charset="utf-8" /> + <link rel="author" title="Mike Bremford" href="http://bfo.com" /> + <style> + .control { + font: 50px/1 monospace; + font-kerning: none; + white-space: pre; + } + .red { + color: red; + position: absolute; + z-index: -1; + } + .control span { + background: green; + } + </style> + </head> + <body> + <p>Test passes if no red is visible except for anti-aliasing differences, and the green rectangle does not extend beyond B to C.</p> + <!-- A <ls> <ls> <bg>B <ls> <ls> C</bg> <ls> D --> + <div class="control">A <span>B C</span> D</div> + </body> +</html> |