diff options
| author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 09:22:09 +0000 |
|---|---|---|
| committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 09:22:09 +0000 |
| commit | 43a97878ce14b72f0981164f87f2e35e14151312 (patch) | |
| tree | 620249daf56c0258faa40cbdcf9cfba06de2a846 /testing/web-platform/tests/css/css-text/line-break | |
| parent | Initial commit. (diff) | |
| download | firefox-43a97878ce14b72f0981164f87f2e35e14151312.tar.xz firefox-43a97878ce14b72f0981164f87f2e35e14151312.zip | |
Adding upstream version 110.0.1.upstream/110.0.1upstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/css/css-text/line-break')
125 files changed, 6956 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-001.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-001.html new file mode 100644 index 0000000000..6f2367035f --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-001.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere</title> +<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://www.w3.org/TR/css-text-3/#propdef-line-break"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-001-ref.html"> +<meta name="assert" content="line-break:anywhere puts a soft wrap opportunity around every typographic character unit, + including around punctuation or in the middle of words, + disregarding any prohibition against line breaks introduced by characters with the GL, JW, or ZJW character class."> +<style> +#green { + position: absolute; + background: green; + font-family: monospace; + width: 1ch; + height: 19em; +} +#test { + width: 1ch; + line-height: 1; + color: red; + font-family: monospace; + line-break: anywhere; +} +span { + background: red; +} +</style> + +<p>Test passes if there is a green rectangle below and no red.</p> +<div id=green></div> +<!-- with line breaks everywhere, none of the following characters should stick out from under the green div --> +<div id=test>aa-a.a)a,a）a<span> </span>aa⁠a‍a･a</div> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-002.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-002.html new file mode 100644 index 0000000000..966d5c1c7b --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-002.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere</title> +<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://www.w3.org/TR/css-text-3/#propdef-line-break"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-001-ref.html"> +<meta name="assert" content="line-break:anywhere puts a soft wrap opportunity betwwen letters in the middle of words and hyphenation is not applied."> +<style> +#green { + position: absolute; + background: green; + font-family: monospace; + width: 1ch; + height: 19em; +} +#test { + width: 1ch; + line-height: 1; + color: red; + font-family: monospace; + line-break: anywhere; + hyphens: auto; +} +</style> + +<p>Test passes if there is a green rectangle below and no red.</p> +<div id=green></div> +<!-- Hyphenation, if it occurs, will produce a hyphen that sticks out from under the green rectangle. + Also, if the words fails to be wrapped between all letters, letters will also stick out from under the green rectangle --> +<div id=test>no hyphenation</div> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-003.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-003.html new file mode 100644 index 0000000000..0b004b04a0 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-003.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere</title> +<link rel="author" title="Javier Fernandez" href="mailto:jfernandez@igalia.com" /> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://www.w3.org/TR/css-text-3/#propdef-line-break"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-003-ref.html"> +<meta name="assert" content="line-break: anywhere means lines may break between any two typographic letter units."> +<style type='text/css'> +.test { line-break: anywhere; } +/* the CSS below is not part of the test */ +.test, .ref { border: 1px solid orange; margin: 20px; padding: 10px; width: 390px; font: 36px/1 sans-serif; } +</style> +</head> +<body> +<div id='instructions'>Test passes if the two orange boxes are the same.</div> +<div class="test"><div id="testdiv"><span id="testspan">Latin latin latin latin</span></div></div> +<div class="ref"><span>Latin latin latin lati<br/>n</span></div> +<script> +var sentenceWidth = document.getElementById('testspan').offsetWidth +document.getElementById('testdiv').style.width = String(sentenceWidth - 5)+'px' +</script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-004.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-004.html new file mode 100644 index 0000000000..26bd466ae3 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-004.html @@ -0,0 +1,40 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.2. Breaking Rules for Letters: the word-break property" href="https://drafts.csswg.org/css-text-3/#word-break-property"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://www.w3.org/TR/css-text-3/#propdef-line-break"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-word-break-keep-all"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<meta name="assert" content="The second word is broken, despite the word-break: keep-all, because line-break: anywhere disregarde any prohibition against line breaks mandate by word-break."> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<style> +div { + position: relative; + font-size: 25px; + font-family: Ahem; + line-height: 1em; +} +.red { + position: absolute; + width: 100px; + height: 100px; + background: green; + color: red; + z-index: -1; +} +.test { + color: green; + width: 4ch; + line-height: 1; + word-break: keep-all; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XX X<br>XX</div> + <div class="test">XX XXX</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-005.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-005.html new file mode 100644 index 0000000000..5e286a0d76 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-005.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere</title> +<link rel="author" title="Javier Fernandez" href="mailto:jfernandez@igalia.com" /> +<link rel="help" title="3. White Space and Wrapping: the white-space property" href="https://www.w3.org/TR/css-text-3/#white-space-property"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://www.w3.org/TR/css-text-3/#propdef-line-break"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-white-space-break-spaces"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<meta name="assert" content="line-break: anywhere + break-spaces do allow a break +between the last character of a word and the first space of a sequence of preserved +spaces even if there is a previous breaking opportunity"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<style> +div { + font: 25px/1 Ahem; + width: 4ch; + line-height: 1; +} +.red { + position: absolute; + white-space: pre; + color: red; + background: green; + z-index: -1; +} +.test { + white-space: break-spaces; + line-break: anywhere; + color: green; +} +</style> +<p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> +<div class="red">X XX<br> XX <br>X XX<br> X</div> +<div class="test">X XX XX X XX X</div> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-006.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-006.html new file mode 100644 index 0000000000..802d66f0cf --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-006.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://www.w3.org/TR/css-text-3/#propdef-line-break"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<meta name="assert" content="line-break: anywhere' disgregard the prohibition against line breaks introduced by characters with the GL character class"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<style> +div { + position: relative; + font-size: 25px; + font-family: Ahem; + line-height: 1em; +} +.red { + position: absolute; + width: 100px; + height: 100px; + background: green; + color: red; + z-index: -1; +} +.test { + color: green; + width: 4ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XXXX<br> XXX<br>X X <br>X</div> + <div class="test">XXXX XXXX X X</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-007.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-007.html new file mode 100644 index 0000000000..02a4c77653 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-007.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://www.w3.org/TR/css-text-3/#propdef-line-break"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<meta name="assert" content="line-break:anywhere allows breaking opportunities around punctuaction characters."> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<style> +div { + position: relative; + font-size: 20px; + font-family: Ahem; + line-height: 1em; +} +.red { + position: absolute; + width: 100px; + height: 100px; + background: green; + color: red; + z-index: -1; +} +.test { + color: green; + width: 5ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">X XXX<br>XX</div> + <div class="test">X XX...</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-008.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-008.html new file mode 100644 index 0000000000..dddfdc1fb2 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-008.html @@ -0,0 +1,39 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="3. White Space and Wrapping: the white-space property" href="https://www.w3.org/TR/css-text-3/#white-space-property"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://www.w3.org/TR/css-text-3/#propdef-line-break"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-white-space-pre-wrap"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<meta name="assert" content="break-all breaks between the last two letters, because breaking opportunities between the punctuaction characters are forbidden."> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<style> +div { + position: relative; + font-size: 20px; + font-family: Ahem; + line-height: 1em; +} +.red { + position: absolute; + width: 100px; + height: 100px; + background: green; + color: red; + z-index: -1; +} +.test { + color: green; + width: 5ch; + white-space: pre-wrap; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">X XXX<br>XX</div> + <div class="test">X XX...</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-009.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-009.html new file mode 100644 index 0000000000..9d8e8888b5 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-009.html @@ -0,0 +1,39 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="3. White Space and Wrapping: the white-space property" href="https://www.w3.org/TR/css-text-3/#white-space-property"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://www.w3.org/TR/css-text-3/#propdef-line-break"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-white-space-break-spaces"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<meta name="assert" content="line-break: anywhere' disgregard the prohibition against line breaks introduced by characters with the GL character class"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<style> +div { + position: relative; + font-size: 25px; + font-family: Ahem; + line-height: 1em; +} +.red { + position: absolute; + width: 100px; + height: 100px; + background: green; + color: red; + z-index: -1; +} +.test { + color: green; + width: 4ch; + white-space: break-spaces; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XXXX<br> XXX<br>X X <br>X</div> + <div class="test">XXXX XXXX X X</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-010.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-010.html new file mode 100644 index 0000000000..3e8247904b --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-010.html @@ -0,0 +1,39 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="3. White Space and Wrapping: the white-space property" href="https://www.w3.org/TR/css-text-3/#white-space-property"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://www.w3.org/TR/css-text-3/#propdef-line-break"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-white-space-pre-wrap"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<meta name="assert" content="line-break: anywhere' disgregard the prohibition against line breaks introduced by characters with the GL character class"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<style> +div { + position: relative; + font-size: 25px; + font-family: Ahem; + line-height: 1em; +} +.red { + position: absolute; + width: 100px; + height: 100px; + background: green; + color: red; + z-index: -1; +} +.test { + color: green; + width: 4ch; + white-space: pre-wrap; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XXXX<br> XXX<br>X X <br>X</div> + <div class="test">XXXX XXXX X X</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-011.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-011.html new file mode 100644 index 0000000000..0565122568 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-011.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://www.w3.org/TR/css-text-3/#propdef-line-break"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<meta name="assert" content="line-break:anywhere allows breaking opportunities around slash characters."> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<style> +div { + position: relative; + font-size: 20px; + font-family: Ahem; + line-height: 1em; +} +.red { + position: absolute; + width: 100px; + height: 100px; + background: green; + color: red; + z-index: -1; +} +.test { + color: green; + width: 5ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">X XXX<br>XX</div> + <div class="test">X XX///</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-012.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-012.html new file mode 100644 index 0000000000..872dc9d31d --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-012.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://www.w3.org/TR/css-text-3/#propdef-line-break"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<meta name="assert" content="line-break:anywhere allows breaking opportunities around backslash characters."> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<style> +div { + position: relative; + font-size: 20px; + font-family: Ahem; + line-height: 1em; +} +.red { + position: absolute; + width: 100px; + height: 100px; + background: green; + color: red; + z-index: -1; +} +.test { + color: green; + width: 5ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">X XXX<br>XX</div> + <div class="test">X XX\\\</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-013.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-013.html new file mode 100644 index 0000000000..55ad0b6f74 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-013.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://www.w3.org/TR/css-text-3/#propdef-line-break"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<meta name="assert" content="line-break:anywhere allows breaking opportunities before slash characters."> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<style> +div { + position: relative; + font-size: 20px; + font-family: Ahem; + line-height: 1em; +} +.red { + position: absolute; + width: 100px; + height: 100px; + background: green; + color: red; + z-index: -1; +} +.test { + color: green; + width: 3ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XXX<br>XX</div> + <div class="test">XXX/X</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-014.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-014.html new file mode 100644 index 0000000000..568b899fd6 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-014.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://www.w3.org/TR/css-text-3/#propdef-line-break"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<meta name="assert" content="line-break:anywhere allows breaking opportunities before backslash characters."> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<style> +div { + position: relative; + font-size: 20px; + font-family: Ahem; + line-height: 1em; +} +.red { + position: absolute; + width: 100px; + height: 100px; + background: green; + color: red; + z-index: -1; +} +.test { + color: green; + width: 3ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XXX<br>XX</div> + <div class="test">XXX\X</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-015.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-015.html new file mode 100644 index 0000000000..68c3562e29 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-015.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://www.w3.org/TR/css-text-3/#propdef-line-break"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<meta name="assert" content="line-break:anywhere allows breaking opportunities after backslash characters."> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<style> +div { + position: relative; + font-size: 20px; + font-family: Ahem; + line-height: 1em; +} +.red { + position: absolute; + width: 100px; + height: 100px; + background: green; + color: red; + z-index: -1; +} +.test { + color: green; + width: 4ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XXXX<br>X</div> + <div class="test">XXX\X</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-016.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-016.html new file mode 100644 index 0000000000..ea09bb2865 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-016.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://www.w3.org/TR/css-text-3/#propdef-line-break"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<meta name="assert" content="line-break:anywhere allows breaking opportunities after slash characters."> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<style> +div { + position: relative; + font-size: 20px; + font-family: Ahem; + line-height: 1em; +} +.red { + position: absolute; + width: 100px; + height: 100px; + background: green; + color: red; + z-index: -1; +} +.test { + color: green; + width: 4ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XXXX<br>X</div> + <div class="test">XXX/X</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-017.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-017.html new file mode 100644 index 0000000000..a2521cbcbb --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-017.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.3. Line Breaking Details" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="The text is wrapped into two lines, since there is no need to break the second line using the space in the middle."> +<style> +div { + position: relative; + font: 25px / 1 Ahem; +} +.red { + position: absolute; + background: green; + color: red; + width: 100px; + height: 100px; + z-index: -1; +} +.test { + color: green; + width: 3ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XXX<br>X X</div> + <div class="test">XXXX<span> </span>X</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-001.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-001.html new file mode 100644 index 0000000000..a4158dc990 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-001.html @@ -0,0 +1,39 @@ + +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere and the white-space property</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="3. White Space and Wrapping: the white-space property" href="https://drafts.csswg.org/css-text-3/#white-space-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-white-space-pre"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="'line-break: anywhere' can't prevent overflow under 'white-space: pre', because it line wrapping is not allowed. "> +<style> +div { + position: relative; + font: 10px / 1 Ahem; +} +.red { + position: absolute; + background: green; + color: red; + height: 100px; + z-index: -1; +} +.test { + color: green; + width: 3ch; + line-break: anywhere; + + white-space: pre; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XXXX<span style="color: green">XXXX</span>XX</div> + <div class="test">XXXX XX</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-002.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-002.html new file mode 100644 index 0000000000..2fbb53dca2 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-002.html @@ -0,0 +1,40 @@ + +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere and the white-space property</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="3. White Space and Wrapping: the white-space property" href="https://drafts.csswg.org/css-text-3/#white-space-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-white-space-nowrap"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="'line-break: anywhere' can't prevent overflow under 'white-space: nowrap', because it line wrapping is not allowed. "> +<style> +div { + position: relative; + font: 10px / 1 Ahem; +} +.red { + position: absolute; + background: green; + color: red; + width: 100px; + height: 100px; + z-index: -1; +} +.test { + color: green; + width: 5ch; + line-break: anywhere; + + white-space: nowrap; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XXXX XX</div> + <div class="test">XXXX XX</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-003.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-003.html new file mode 100644 index 0000000000..3002dc1064 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-003.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere and the white-space property</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="3. White Space and Wrapping: the white-space property" href="https://drafts.csswg.org/css-text-3/#white-space-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-white-space-pre"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="'line-break: anywhere' can't prevent overflow under 'white-space: pre', because it line wrapping is not allowed. "> +<style> +div { + position: relative; + font: 25px / 1 Ahem; +} +.red { + position: absolute; + background: green; + color: red; + height: 100px; + z-index: -1; +} +.test { + color: green; + width: 2ch; + line-break: anywhere; + + white-space: pre; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red"><span style="color: green">X</span>XXX</div> + <div class="test"> XXX</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-004.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-004.html new file mode 100644 index 0000000000..e6e1b39787 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-004.html @@ -0,0 +1,40 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere and the white-space property</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="3. White Space and Wrapping: the white-space property" href="https://drafts.csswg.org/css-text-3/#white-space-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-white-space-normal"> +<link rel="help" title="4.1.3. Phase II: Trimming and Positioning" href="https://drafts.csswg.org/css-text-3/#white-space-phase-2"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="The line is wrapped ignoring the white space, which will be removed honoring 'white-space: normal'"> +<style> +div { + position: relative; + font: 25px / 1 Ahem; +} +.red { + position: absolute; + background: green; + color: red; + width: 100px; + height: 100px; + z-index: -1; +} +.test { + color: green; + width: 4ch; + line-break: anywhere; + + white-space: normal; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XXX<br>XX</div> + <div class="test">XXX<span style="background: red"> </span>XX</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-005.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-005.html new file mode 100644 index 0000000000..2f64d8704b --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-005.html @@ -0,0 +1,40 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere and the white-space property</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="3. White Space and Wrapping: the white-space property" href="https://drafts.csswg.org/css-text-3/#white-space-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-white-space-normal"> +<link rel="help" title="4.1.3. Phase II: Trimming and Positioning" href="https://drafts.csswg.org/css-text-3/#white-space-phase-2"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="The line is wrapped ignoring the white space, which will be removed honoring 'white-space: normal'"> +<style> +div { + position: relative; + font: 25px / 1 Ahem; +} +.red { + position: absolute; + background: green; + color: red; + width: 100px; + height: 100px; + z-index: -1; +} +.test { + color: green; + width: 4ch; + line-break: anywhere; + + white-space: normal; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XXXX<br>X</div> + <div class="test"><span style="background: red"> </span>XXXXX</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-006.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-006.html new file mode 100644 index 0000000000..c804e37126 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-006.html @@ -0,0 +1,39 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere and the white-space property</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="3. White Space and Wrapping: the white-space property" href="https://drafts.csswg.org/css-text-3/#white-space-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-white-space-pre-wrap"> +<link rel="help" title="4.1.3. Phase II: Trimming and Positioning" href="https://drafts.csswg.org/css-text-3/#white-space-phase-2"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="'line-break: anywhere' can't break a preserved sequence of spaces under 'white-spate: pre-wrap', which should hang instead."> +<style> +div { + position: relative; + font: 25px / 1 Ahem; +} +.red { + position: absolute; + background: green; + color: red; + height: 100px; + z-index: -1; +} +.test { + color: green; + width: 2ch; + + line-break: anywhere; + white-space: pre-wrap; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XXXX<br>XX</div> + <div class="test">X<span style="background: green"> </span>XX</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-007.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-007.html new file mode 100644 index 0000000000..d9b266db9f --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-007.html @@ -0,0 +1,40 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere and the white-space property</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="3. White Space and Wrapping: the white-space property" href="https://drafts.csswg.org/css-text-3/#white-space-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-white-space-pre-wrap"> +<link rel="help" title="4.1.3. Phase II: Trimming and Positioning" href="https://drafts.csswg.org/css-text-3/#white-space-phase-2"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="'line-break: anywhere' can't break before the first white-space affter a word under 'white-spate: pre-wrap', which should hang instead."> +<style> +div { + position: relative; + font: 25px / 1 Ahem; +} +.red { + position: absolute; + background: green; + color: red; + width: 100px; + height: 100px; + z-index: -1; +} +.test { + color: green; + width: 3ch; + + line-break: anywhere; + white-space: pre-wrap; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XXXX<br>XX</div> + <div class="test">XXX<span style="background: green"> </span>XX</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-008.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-008.html new file mode 100644 index 0000000000..aebd31ea68 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-008.html @@ -0,0 +1,39 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere and the white-space property</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="3. White Space and Wrapping: the white-space property" href="https://drafts.csswg.org/css-text-3/#white-space-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-white-space-break-spaces"> +<link rel="help" title="4.1.3. Phase II: Trimming and Positioning" href="https://drafts.csswg.org/css-text-3/#white-space-phase-2"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="'line-break: anywhere' allows preserved white spaces at the end of the line, honoring 'white-space: break-spaces'."> +<style> +div { + position: relative; + font: 25px / 1 Ahem; +} +.red { + position: absolute; + background: green; + color: red; + height: 100px; + z-index: -1; +} +.test { + color: green; + width: 4ch; + + line-break: anywhere; + white-space: break-spaces; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XX<span style="color: green">XX<br>XX</span>XX<br>XXX</div> + <div class="test">XX XXXXX</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-009.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-009.html new file mode 100644 index 0000000000..f536c907a4 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-and-white-space-009.html @@ -0,0 +1,39 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere and the white-space property</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="3. White Space and Wrapping: the white-space property" href="https://drafts.csswg.org/css-text-3/#white-space-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-white-space-break-spaces"> +<link rel="help" title="4.1.3. Phase II: Trimming and Positioning" href="https://drafts.csswg.org/css-text-3/#white-space-phase-2"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="'line-break: anywhere' allows breaking before the first character of a preserved white space sequence, honoring 'white-space: break-spaces'."> +<style> +div { + position: relative; + font: 25px / 1 Ahem; +} +.red { + position: absolute; + background: green; + color: red; + height: 100px; + z-index: -1; +} +.test { + color: green; + width: 4ch; + + line-break: anywhere; + white-space: break-spaces; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XXXX<br><span style="color: green">XXX</span>X<br>XXXX<br><span style="color: green">X</span>X</div> + <div class="test">XXXX XXXXX X</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-001.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-001.html new file mode 100644 index 0000000000..d18df4b38c --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-001.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere overrides behavior defined for the WJ, ZW, GL, and ZWJ classes</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.1. Line Breaking Details" href="https://drafts.csswg.org/css-text-3/#line-break-details"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="Except where explicitly defined by 'line-break: anywhere' line breaking behavior defined for the WJ classes in [UAX14] must be honored. "> +<style> +div { + position: relative; + font: 50px / 1 Ahem; +} +.red { + position: absolute; + width: 100px; + height: 100px; + background: red; + z-index: -1; +} +.test { + color: green; + width: 2ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red"></div> + <div class="test">XX⁠XX</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-002.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-002.html new file mode 100644 index 0000000000..1255aa14d3 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-002.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere overrides behavior defined for the WJ, ZW, GL, and ZWJ classes</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.1. Line Breaking Details" href="https://drafts.csswg.org/css-text-3/#line-break-details"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="Except where explicitly defined by 'line-break: anywhere' line breaking behavior defined for the WJ classes in [UAX14] must be honored. "> +<style> +div { + position: relative; + font: 50px / 1 Ahem; +} +.red { + position: absolute; + width: 100px; + height: 100px; + background: red; + z-index: -1; +} +.test { + color: green; + width: 2ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red"></div> + <div class="test">XXXX</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-003.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-003.html new file mode 100644 index 0000000000..7fe230e890 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-003.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere overrides behavior defined for the WJ, ZW, GL, and ZWJ classes</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.1. Line Breaking Details" href="https://drafts.csswg.org/css-text-3/#line-break-details"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="Except where explicitly defined by 'line-break: anywhere' line breaking behavior defined for the ZW classes in [UAX14] must be honored. "> +<style> +div { + position: relative; + font: 25px / 1 Ahem; +} +.red { + position: absolute; + width: 100px; + height: 100px; + color: red; + background: green; + z-index: -1; +} +.test { + color: green; + width: 4ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XXXX<br>XX</div> + <div class="test">..​...X</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-004.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-004.html new file mode 100644 index 0000000000..13706d5d9d --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-004.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere overrides behavior defined for the WJ, ZW, GL, and ZWJ classes</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.1. Line Breaking Details" href="https://drafts.csswg.org/css-text-3/#line-break-details"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="Except where explicitly defined by 'line-break: anywhere' line breaking behavior defined for the GL classes in [UAX14] must be honored. "> +<style> +div { + position: relative; + font: 50px / 1 Ahem; +} +.red { + position: absolute; + width: 100px; + height: 100px; + background: red; + z-index: -1; +} +.test { + color: green; + width: 3ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red"></div> + <div class="test">XX XX</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-005.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-005.html new file mode 100644 index 0000000000..175228d9c5 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-005.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere overrides behavior defined for the WJ, ZW, GL, and ZWJ classes</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.1. Line Breaking Details" href="https://drafts.csswg.org/css-text-3/#line-break-details"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="Except where explicitly defined by 'line-break: anywhere' line breaking behavior defined for the GL classes in [UAX14] must be honored. "> +<style> +div { + position: relative; + font: 50px / 1 Ahem; +} +.red { + position: absolute; + background: green; + color: red; + z-index: -1; +} +.test { + color: green; + width: 2ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XX<br><span style="color: green">X</span>X</div> + <div class="test">XX X</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-006.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-006.html new file mode 100644 index 0000000000..9bb557e7d3 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-006.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere overrides behavior defined for the WJ, ZW, GL, and ZWJ classes</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.1. Line Breaking Details" href="https://drafts.csswg.org/css-text-3/#line-break-details"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="Except where explicitly defined by 'line-break: anywhere' line breaking behavior defined for the GL classes in [UAX14] must be honored. "> +<style> +div { + position: relative; + font: 50px / 1 Ahem; +} +.red { + position: absolute; + background: red; + width: 100px; + height: 100px; + z-index: -1; +} +.test { + color: green; + width: 4ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red"></div> + <div class="test">XX XX</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-007.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-007.html new file mode 100644 index 0000000000..7f90bfd430 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-007.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere overrides behavior defined for the WJ, ZW, GL, and ZWJ classes</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.1. Line Breaking Details" href="https://drafts.csswg.org/css-text-3/#line-break-details"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="Except where explicitly defined by 'line-break: anywhere' line breaking behavior defined for the GL classes in [UAX14] must be honored. "> +<style> +div { + position: relative; + font: 20px / 1 Ahem; +} +.red { + position: absolute; + background: green; + height: 100px; + color: red; + z-index: -1; +} +.test { + color: green; + width: 5ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XXXXX<br>XX</div> + <div class="test">XXX<span style="background: green"> X</span>XX</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-008.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-008.html new file mode 100644 index 0000000000..40826540c9 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-008.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere overrides behavior defined for the WJ, ZW, GL, and ZWJ classes</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.1. Line Breaking Details" href="https://drafts.csswg.org/css-text-3/#line-break-details"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="Except where explicitly defined by 'line-break: anywhere' line breaking behavior defined for the GL classes in [UAX14] must be honored. "> +<style> +div { + position: relative; + font: 50px / 1 Ahem; +} +.red { + position: absolute; + background: green; + color: red; + z-index: -1; +} +.test { + color: green; + width: 3ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XX<br>X</div> + <div class="test">XX X</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-009.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-009.html new file mode 100644 index 0000000000..6d6ca3f743 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-009.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere overrides behavior defined for the WJ, ZW, GL, and ZWJ classes</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.1. Line Breaking Details" href="https://drafts.csswg.org/css-text-3/#line-break-details"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="Except where explicitly defined by 'line-break: anywhere' line breaking behavior defined for the GL classes in [UAX14] must be honored. "> +<style> +div { + position: relative; + font: 50px / 1 Ahem; +} +.red { + position: absolute; + background: green; + color: red; + z-index: -1; +} +.test { + color: green; + width: 2ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XX<br>X</div> + <div class="test">XX᠎X</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-010.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-010.html new file mode 100644 index 0000000000..5f152c6629 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-010.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere overrides behavior defined for the WJ, ZW, GL, and ZWJ classes</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.1. Line Breaking Details" href="https://drafts.csswg.org/css-text-3/#line-break-details"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="Except where explicitly defined by 'line-break: anywhere' line breaking behavior defined for the GL classes in [UAX14] must be honored. "> +<style> +div { + position: relative; + font: 50px / 1 Ahem; +} +.red { + position: absolute; + background: red; + width: 100px; + height: 100px; + z-index: -1; +} +.test { + color: green; + width: 3ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red"></div> + <div class="test">XX ᠎XX</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-011.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-011.html new file mode 100644 index 0000000000..2196d983f9 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-011.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere overrides behavior defined for the WJ, ZW, GL, and ZWJ classes</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.1. Line Breaking Details" href="https://drafts.csswg.org/css-text-3/#line-break-details"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="Except where explicitly defined by 'line-break: anywhere' line breaking behavior defined for the GL classes in [UAX14] must be honored. "> +<style> +div { + position: relative; + font: 50px / 1 Ahem; +} +.red { + position: absolute; + background: green; + color: red; + z-index: -1; +} +.test { + color: green; + width: 2ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XX<br>X</div> + <div class="test">XX͏X</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-012.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-012.html new file mode 100644 index 0000000000..110d9cafc4 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-012.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere overrides behavior defined for the WJ, ZW, GL, and ZWJ classes</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.1. Line Breaking Details" href="https://drafts.csswg.org/css-text-3/#line-break-details"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="Except where explicitly defined by 'line-break: anywhere' line breaking behavior defined for the GL classes in [UAX14] must be honored. "> +<style> +div { + position: relative; + font: 50px / 1 Ahem; +} +.red { + position: absolute; + background: red; + width: 100px; + height: 100px; + z-index: -1; +} +.test { + color: green; + width: 3ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red"></div> + <div class="test">XX ͏XX</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-013.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-013.html new file mode 100644 index 0000000000..2cda76c5cd --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-013.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere overrides behavior defined for the WJ, ZW, GL, and ZWJ classes</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.1. Line Breaking Details" href="https://drafts.csswg.org/css-text-3/#line-break-details"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="Except where explicitly defined by 'line-break: anywhere' line breaking behavior defined for the GL classes in [UAX14] must be honored. "> +<style> +div { + position: relative; + font: 50px / 1 Ahem; +} +.red { + position: absolute; + background: red; + width: 100px; + height: 100px; + z-index: -1; +} +.test { + color: green; + width: 2ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red"></div> + <div class="test">XX‑X</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-014.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-014.html new file mode 100644 index 0000000000..d79efb7aee --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-014.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere overrides behavior defined for the WJ, ZW, GL, and ZWJ classes</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.1. Line Breaking Details" href="https://drafts.csswg.org/css-text-3/#line-break-details"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="Except where explicitly defined by 'line-break: anywhere' line breaking behavior defined for the GL classes in [UAX14] must be honored. "> +<style> +div { + position: relative; + font: 25px / 1 Ahem; +} +.red { + position: absolute; + background: green; + color: red; + height: 100px; + z-index: -1; +} +.test { + color: green; + width: 4ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XX X<br>XX</div> + <div class="test">XX ‑XX</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-015.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-015.html new file mode 100644 index 0000000000..5eecd03da2 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-015.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere overrides behavior defined for the WJ, ZW, GL, and ZWJ classes</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.1. Line Breaking Details" href="https://drafts.csswg.org/css-text-3/#line-break-details"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="Except where explicitly defined by 'line-break: anywhere' line breaking behavior defined for the ZWJ classes in [UAX14] must be honored. "> +<style> +div { + position: relative; + font: 50px / 1 Ahem; +} +.red { + position: absolute; + background: red; + height: 100px; + width: 100px; + height: 100px; + z-index: -1; +} +.test { + color: green; + width: 2ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red"></div> + <div class="test">XX‍XX</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-016.html b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-016.html new file mode 100644 index 0000000000..d4ab337a7b --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-anywhere-overrides-uax-behavior-016.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test: line-break: anywhere overrides behavior defined for the WJ, ZW, GL, and ZWJ classes</title> +<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com"> +<link rel="help" title="5.1. Line Breaking Details" href="https://drafts.csswg.org/css-text-3/#line-break-details"> +<link rel="help" title="5.3. Line Breaking Strictness: the line-break property" href="https://drafts.csswg.org/css-text-3/#line-break-property"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-line-break-anywhere"> +<link rel="match" href="reference/line-break-anywhere-004-ref.html"> +<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> +<meta name="flags" content="Ahem"> +<meta name="assert" content="Except where explicitly defined by 'line-break: anywhere' line breaking behavior defined for the ZWJ classes in [UAX14] must be honored. "> +<style> +div { + position: relative; + font: 25px / 1 Ahem; +} +.red { + position: absolute; + background: green; + color: red; + height: 100px; + z-index: -1; +} +.test { + color: green; + width: 4ch; + line-break: anywhere; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div class="red">XX X<br>X</div> + <div class="test">XX ‍XX</div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-loose-011.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-011.xht new file mode 100644 index 0000000000..604466a1f4 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-011.xht @@ -0,0 +1,94 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - loose and Japanese small kana</title> + <!-- Japanese small kana --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-loose-011-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: loose' allows line breaking before Japanese small kana such as 'Japanese small kana a (U+3041)' and 'Japanese small kana i (U+3043)'." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: loose; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL A --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ぁ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぁ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL I --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ぃ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぃ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL U --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ぅ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぅ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL E --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ぇ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぇ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL O --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ぉ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぉ</span>サンプル文</span> + </p> + </div> + </body> +</html> + diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-loose-012.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-012.xht new file mode 100644 index 0000000000..0deab610cf --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-012.xht @@ -0,0 +1,66 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - loose and Katakana-Hiragana prolonged sound marks</title> + <!-- Katakana-Hiragana prolonged sound marks --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-loose-012-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: loose' allows line breaking before Katakana-Hiragana prolonged sound marks such as (U+30FC) and (U+FF70)." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: loose; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- Katakana-Hiragana prolonged sound mark - fullwidth --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ー</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ー</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Katakana-Hiragana prolonged sound mark - halfwidth --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ｰ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ｰ</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-loose-013.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-013.xht new file mode 100644 index 0000000000..089d4613ed --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-013.xht @@ -0,0 +1,65 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - loose and hyphens</title> + <!-- hyphens --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-loose-013-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: loose' allows line breaking before U+301C and U+30A0." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: loose; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <!-- hyphens --> + <div class="wrapper"> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">〜</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">〜</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">゠</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">゠</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-loose-014.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-014.xht new file mode 100644 index 0000000000..90cf3c769c --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-014.xht @@ -0,0 +1,97 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - loose and iteration marks</title> + <!-- iteration marks --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-loose-014-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: loose' allows line breaking before iteration marks such as IDEOGRAPHIC ITERATION MARK (U+3005) and VERTICAL IDEOGRAPHIC ITERATION MARK (U+303B)." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: loose; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <!-- iteration marks --> + <div class="wrapper"> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">々</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">々</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">〻</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">〻</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ゝ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ゝ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ゞ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ゞ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ヽ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ヽ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ヾ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ヾ</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-loose-015.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-015.xht new file mode 100644 index 0000000000..6384d8c14e --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-015.xht @@ -0,0 +1,66 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - loose and inseparable characters</title> + <!-- inseparable characters --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-loose-015-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: loose' allows line breaking between inseparable characters such as TWO DOT LEADER (U+2025) and HORIZONTAL ELLIPSIS (U+2026)." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: loose; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- inseparable characters TWO DOT LEADER --> + <p class="test" lang="ja"> + <span>サンプルサンプル。<span class="target">‥‥</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプルサンプル。<span class="target">‥<br />‥</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- inseparable characters HORIZONTAL ELLIPSIS --> + <p class="test" lang="ja"> + <span>サンプルサンプル。<span class="target">……</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプルサンプル。<span class="target">…<br />…</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-loose-016a.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-016a.xht new file mode 100644 index 0000000000..6397c03182 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-016a.xht @@ -0,0 +1,84 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - loose and centered punctuation marks</title> + <!-- centered punctuation marks --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-loose-016a-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: loose' allows line breaking before centered punctuation marks." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: loose; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 5px; + padding: 5px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- centered punctuation marks KATAKANA MIDDLE DOT --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">・</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">・</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks FULLWIDTH COLON --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">：</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">：</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks FULLWIDTH SEMICOLON --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">；</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">；</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks HALFWIDTH KATAKANA MIDDLE DOT --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">･</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">･</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-loose-016b.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-016b.xht new file mode 100644 index 0000000000..261cce5f67 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-016b.xht @@ -0,0 +1,102 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - loose and centered punctuation marks</title> + <!-- centered punctuation marks --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-loose-016b-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: loose' allows line breaking before centered punctuation marks." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: loose; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 5px; + padding: 5px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- centered punctuation marks DOUBLE EXCLAMATION MARK --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">‼</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">‼</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks DOUBLE QUESTION MARK --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">⁇</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">⁇</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks QUESTION EXCLAMATION MARK --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">⁈</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">⁈</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks EXCLAMATION QUESTION MARK --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">⁉</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">⁉</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks FULLWIDTH EXCLAMATION MARK --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">！</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">！</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks FULLWIDTH QUESTION MARK --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">？</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">？</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-loose-017a.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-017a.xht new file mode 100644 index 0000000000..b63f1504c2 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-017a.xht @@ -0,0 +1,84 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - loose and postfixes</title> + <!-- postfixes --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-loose-017a-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: loose' allows line breaking before postfixes." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: loose; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.1em; /* added extra .1em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- postfixes DEGREE SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">°</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">°</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes PER MILLE SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">‰</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">‰</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes PRIME --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">′</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">′</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes DOUBLE PRIME --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">″</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">″</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-loose-017b.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-017b.xht new file mode 100644 index 0000000000..6b89d125f5 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-017b.xht @@ -0,0 +1,75 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - loose and postfixes</title> + <!-- postfixes --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-loose-017b-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: loose' allows line breaking before postfixes." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: loose; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- postfixes DEGREE CELSIUS --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">℃</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">℃</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes FULLWIDTH PERCENT SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">％</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">％</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes FULLWIDTH CENT SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">￠</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">￠</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-loose-018.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-018.xht new file mode 100644 index 0000000000..d5df229cf7 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-018.xht @@ -0,0 +1,93 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - loose and prefixes</title> + <!-- prefixes --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-loose-018-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: loose' allows line breaking after prefixes." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: loose; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- prefixes EURO SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル<span class="target">€</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<span class="target">€</span><br />サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- prefixes NUMERO SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル<span class="target">№</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<span class="target">№</span><br />サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- prefixes FULLWIDTH DOLLAR SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル<span class="target">＄</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<span class="target">＄</span><br />サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- prefixes FULLWIDTH POUND SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル<span class="target">￡</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<span class="target">￡</span><br />サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- prefixes FULLWIDTH YEN SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル<span class="target">￥</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<span class="target">￥</span><br />サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-loose-hyphens-001.html b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-hyphens-001.html new file mode 100644 index 0000000000..e8200d66d4 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-hyphens-001.html @@ -0,0 +1,21 @@ +<!doctype html> +<html lang=en> +<meta charset=utf-8> +<title>CSS test: hyphens and line-break:loose</title> +<link rel=author title="Florian Rivoal" href="https://florian.rivoal.net"> +<link rel=help href="https://drafts.csswg.org/css-text-3/#propdef-line-break"> +<link rel=match href="reference/line-break-loose-hyphens-001-ref.html"> +<meta name=assert content="breaks before U+2010 or U+2013 when line-break is loose are allowed if the preceding character has class ID."> +<style> +div { + width: 2em; + line-break: loose; + border: solid cyan; +} +</style> + +<p>The test passes if the second line in each box below starts with a hyphen. +(Note: the hyphens in each box do no need to be the same size.) + +<div>文文‐文</div> +<div>文文–文</div> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-loose-hyphens-002.html b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-hyphens-002.html new file mode 100644 index 0000000000..f2841c9b10 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-hyphens-002.html @@ -0,0 +1,24 @@ +<!doctype html> +<html lang=en> +<meta charset=utf-8> +<title>CSS test: hyphens and line-break:loose</title> +<link rel=author title="Florian Rivoal" href="https://florian.rivoal.net"> +<link rel=help href="https://drafts.csswg.org/css-text-3/#propdef-line-break"> +<link rel=help href="https://drafts.csswg.org/css-text-3/#word-break-property"> +<link rel=match href="reference/line-break-loose-hyphens-002-ref.html"> +<meta name=assert content="breaks before U+2010 or U+2013 when line-break is loose are allowed if the preceding character is treated as having class ID due to word-break:break-all."> +<style> +div { + font-family: monospace; + width: 2ch; + line-break: loose; + word-break: break-all; + border: solid cyan; +} +</style> + +<p>The test passes if the second line in each box below starts with a hyphen. +(Note: the hyphens in each box do no need to be the same size.) + +<div>aa‐a</div> +<div>aa–a</div> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-loose-hyphens-003.html b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-hyphens-003.html new file mode 100644 index 0000000000..4af970f73f --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-loose-hyphens-003.html @@ -0,0 +1,22 @@ +<!doctype html> +<html lang=en> +<meta charset=utf-8> +<title>CSS test: hyphens and line-break:loose</title> +<link rel=author title="Florian Rivoal" href="https://florian.rivoal.net"> +<link rel=help href="https://drafts.csswg.org/css-text-3/#propdef-line-break"> +<link rel=match href="reference/line-break-loose-hyphens-003-ref.html"> +<meta name=assert content="breaks before U+2010 or U+2013 when line-break is loose are not allowed if the preceding character is not of line-breaking class ID."> +<style> +div { + font-family: monospace; + width: 2ch; + line-break: loose; +} +</style> + +<p>The test passes if there are two lines of text below +and they both end with a hyphen. +(Note: the hyphens do no need to be the same size.) + +<div>aa‐</div> +<div>aa–</div> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-normal-011.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-011.xht new file mode 100644 index 0000000000..692468c527 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-011.xht @@ -0,0 +1,94 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - normal and Japanese small kana</title> + <!-- Japanese small kana --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-normal-011-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: normal' allows line breaking before Japanese small kana such as 'Japanese small kana a (U+3041)' and 'Japanese small kana i (U+3043)'." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: normal; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL A --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ぁ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぁ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL I --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ぃ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぃ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL U --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ぅ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぅ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL E --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ぇ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぇ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL O --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ぉ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぉ</span>サンプル文</span> + </p> + </div> + </body> +</html> + diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-normal-012.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-012.xht new file mode 100644 index 0000000000..a4b794f0f8 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-012.xht @@ -0,0 +1,66 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - normal and Katakana-Hiragana prolonged sound marks</title> + <!-- Katakana-Hiragana prolonged sound marks --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-normal-012-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: normal' allows line breaking before Katakana-Hiragana prolonged sound marks such as (U+30FC) and (U+FF70)." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: normal; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- Katakana-Hiragana prolonged sound mark - fullwidth --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ー</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ー</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Katakana-Hiragana prolonged sound mark - halfwidth --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ｰ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ｰ</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-normal-013.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-013.xht new file mode 100644 index 0000000000..f58fe39d69 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-013.xht @@ -0,0 +1,65 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - normal and hyphens</title> + <!-- hyphens --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-normal-013-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: normal' allows line breaking before U+301C and U+30A0.." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: normal; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <!-- hyphens --> + <div class="wrapper"> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">〜</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">〜</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">゠</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">゠</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-normal-014.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-014.xht new file mode 100644 index 0000000000..86a35bfb6b --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-014.xht @@ -0,0 +1,97 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - normal and iteration marks</title> + <!-- iteration marks --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-normal-014-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: normal' does not allow line breaking before iteration marks such as IDEOGRAPHIC ITERATION MARK (U+3005) and VERTICAL IDEOGRAPHIC ITERATION MARK (U+303B)." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: normal; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <!-- iteration marks --> + <div class="wrapper"> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">々</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">々</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">〻</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">〻</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ゝ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ゝ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ゞ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ゞ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ヽ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ヽ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ヾ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ヾ</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-normal-015a.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-015a.xht new file mode 100644 index 0000000000..db3ee2a586 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-015a.xht @@ -0,0 +1,66 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - normal and inseparable characters</title> + <!-- inseparable characters --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-normal-015a-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: normal' does not allow line breaking between inseparable characters such as TWO DOT LEADER (U+2025) and HORIZONTAL ELLIPSIS (U+2026)." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: normal; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- inseparable characters TWO DOT LEADER --> + <p class="test" lang="ja"> + <span>サンプルサンプル文<span class="target">‥‥</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプルサンプル文<br /><span class="target">‥‥</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- inseparable characters HORIZONTAL ELLIPSIS --> + <p class="test" lang="ja"> + <span>サンプルサンプル文<span class="target">……</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプルサンプル文<br /><span class="target">……</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-normal-015b.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-015b.xht new file mode 100644 index 0000000000..904b009ac6 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-015b.xht @@ -0,0 +1,67 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - normal and inseparable characters</title> + <!-- inseparable characters --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-normal-015b-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: normal' does not allow line breaking between inseparable characters such as TWO DOT LEADER (U+2025) and HORIZONTAL ELLIPSIS (U+2026). Tailorable breaks between ID and CL, as well as CL and IN are also disallowed." /> + <meta name="flags" content="should" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: normal; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- inseparable characters TWO DOT LEADER --> + <p class="test" lang="ja"> + <span>サンプルサンプル。<span class="target">‥‥</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプルサンプ<br />ル。<span class="target">‥‥</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- inseparable characters HORIZONTAL ELLIPSIS --> + <p class="test" lang="ja"> + <span>サンプルサンプル。<span class="target">……</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプルサンプ<br />ル。<span class="target">……</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-normal-016a.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-016a.xht new file mode 100644 index 0000000000..c3b103ab7a --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-016a.xht @@ -0,0 +1,84 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - normal and centered punctuation marks</title> + <!-- centered punctuation marks --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-normal-016a-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: normal' does not allow line breaking before centered punctuation marks such as COLON (U+003A) and SEMICOLON (U+003B)." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: normal; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 5px; + padding: 5px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- centered punctuation marks KATAKANA MIDDLE DOT --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">・</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">・</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks FULLWIDTH COLON --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">：</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">：</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks FULLWIDTH SEMICOLON --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">；</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">；</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks HALFWIDTH KATAKANA MIDDLE DOT --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">･</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">･</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-normal-016b.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-016b.xht new file mode 100644 index 0000000000..c73bb159d0 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-016b.xht @@ -0,0 +1,102 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - normal and centered punctuation marks</title> + <!-- centered punctuation marks --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-normal-016b-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: normal' does not allow line breaking before centered punctuation marks such as COLON (U+003A) and SEMICOLON (U+003B)." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: normal; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 5px; + padding: 5px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- centered punctuation marks DOUBLE EXCLAMATION MARK --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">‼</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">‼</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks DOUBLE QUESTION MARK --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">⁇</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">⁇</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks QUESTION EXCLAMATION MARK --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">⁈</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">⁈</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks EXCLAMATION QUESTION MARK --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">⁉</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">⁉</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks FULLWIDTH EXCLAMATION MARK --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">！</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">！</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks FULLWIDTH QUESTION MARK --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">？</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">？</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-normal-017a.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-017a.xht new file mode 100644 index 0000000000..f9b5169cf4 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-017a.xht @@ -0,0 +1,84 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - normal and postfixes</title> + <!-- postfixes --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-normal-017a-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: normal' does not allow line breaking before postfixes such as PERCENT SIGN (U+0025) and CENT SIGN (U+00A2)." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: normal; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.1em; /* added extra .1em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- postfixes DEGREE SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">°</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">°</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes PER MILLE SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">‰</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">‰</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes PRIME --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">′</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">′</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes DOUBLE PRIME --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">″</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">″</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-normal-017b.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-017b.xht new file mode 100644 index 0000000000..124ece3189 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-017b.xht @@ -0,0 +1,75 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - normal and postfixes</title> + <!-- postfixes --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-normal-017b-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: normal' does not allow line breaking before postfixes such as PERCENT SIGN (U+0025) and CENT SIGN (U+00A2)." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: normal; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- postfixes DEGREE CELSIUS --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">℃</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">℃</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes FULLWIDTH PERCENT SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">％</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">％</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes FULLWIDTH CENT SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">￠</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">￠</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-normal-018.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-018.xht new file mode 100644 index 0000000000..a1042e858a --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-018.xht @@ -0,0 +1,93 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - normal and prefixes</title> + <!-- prefixes --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-normal-018-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: normal' does not allow line breaking after prefixes." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: normal; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- prefixes EURO SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル<span class="target">€</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">€</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- prefixes NUMERO SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル<span class="target">№</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">№</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- prefixes FULLWIDTH DOLLAR SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル<span class="target">＄</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">＄</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- prefixes FULLWIDTH POUND SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル<span class="target">￡</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">￡</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- prefixes FULLWIDTH YEN SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル<span class="target">￥</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">￥</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-normal-hyphens-001.html b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-hyphens-001.html new file mode 100644 index 0000000000..245ebf3f10 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-hyphens-001.html @@ -0,0 +1,21 @@ +<!doctype html> +<html lang=en> +<meta charset=utf-8> +<title>CSS test: hyphens and line-break:normal</title> +<link rel=author title="Florian Rivoal" href="https://florian.rivoal.net"> +<link rel=help href="https://drafts.csswg.org/css-text-3/#propdef-line-break"> +<link rel=match href="reference/line-break-normal-hyphens-001-ref.html"> +<meta name=assert content="breaks before U+2010 or U+2013 when line-break is normal are not allowed when the preceding character has class ID."> +<style> +div { + width: 2em; + line-break: normal; + border: solid cyan; +} +</style> + +<p>The test passes if the second line in each box below ends with a hyphen. +(Note: the hyphens in each box do no need to be the same size.) + +<div>文文‐文</div> +<div>文文–文</div> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-normal-hyphens-002.html b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-hyphens-002.html new file mode 100644 index 0000000000..d7de5c5f09 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-hyphens-002.html @@ -0,0 +1,24 @@ +<!doctype html> +<html lang=en> +<meta charset=utf-8> +<title>CSS test: hyphens and line-break:normal</title> +<link rel=author title="Florian Rivoal" href="https://florian.rivoal.net"> +<link rel=help href="https://drafts.csswg.org/css-text-3/#propdef-line-break"> +<link rel=help href="https://drafts.csswg.org/css-text-3/#word-break-property"> +<link rel=match href="reference/line-break-normal-hyphens-002-ref.html"> +<meta name=assert content="breaks before U+2010 or U+2013 when line-break is normal are not allowed if the preceding character is treated as having class ID due to word-break:break-all."> +<style> +div { + font-family: monospace; + width: 2ch; + line-break: normal; + word-break: break-all; + border: solid cyan; +} +</style> + +<p>The test passes if the second line in each box below ends with a hyphen. +(Note: the hyphens in each box do no need to be the same size.) + +<div>aa‐a</div> +<div>aa–a</div> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-normal-hyphens-003.html b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-hyphens-003.html new file mode 100644 index 0000000000..7e9054a4a8 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-normal-hyphens-003.html @@ -0,0 +1,22 @@ +<!doctype html> +<html lang=en> +<meta charset=utf-8> +<title>CSS test: hyphens and line-break:normal</title> +<link rel=author title="Florian Rivoal" href="https://florian.rivoal.net"> +<link rel=help href="https://drafts.csswg.org/css-text-3/#propdef-line-break"> +<link rel=match href="reference/line-break-loose-hyphens-003-ref.html"> +<meta name=assert content="breaks before U+2010 or U+2013 when line-break is normal are not allowed if the preceding character is not of line-breaking class ID."> +<style> +div { + font-family: monospace; + width: 2ch; + line-break: normal; +} +</style> + +<p>The test passes if there are two lines of text below +and they both end with a hyphen. +(Note: the hyphens do no need to be the same size.) + +<div>aa‐</div> +<div>aa–</div> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-shaping-001.html b/testing/web-platform/tests/css/css-text/line-break/line-break-shaping-001.html new file mode 100644 index 0000000000..4ce1da2f30 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-shaping-001.html @@ -0,0 +1,39 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>CSS Text level 3 Test: line-break:anywhere and text-shaping</title> +<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/"> +<link rel="help" href="https://drafts.csswg.org/css-text-3/#word-break-shaping"> +<link rel="help" href="https://www.w3.org/TR/css-text-3/#line-break-property"> +<link rel="match" href="reference/line-break-shaping-001-ref.html"> +<meta name="assert" content="Shaping characters are still shaped as if the word were not broken when a line is broken by line-break:anywhere"> +<style> + @font-face { + font-family: 'csstest_noto'; + src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2'); + } + div { + font-family: 'csstest_noto'; + font-size: 4em; + } + section { + float: left; /* to sizing to the intrinsic min of the ref box*/ + position: relative; + } + #ref { + border: solid orange; + margin: 1rem; + } + #test { + border: solid blue; + position: absolute; /* to avoid influencing the size of the section */ + left: 1rem; + right: 1rem; + line-break: anywhere; + } +</style> + +<p>Test passes if the blue and organge boxes are identical. Pay attention to characters at the left of the first line, and on the second line. +<section> +<div dir=rtl lang=ar id=ref>ﻋﺎﺋﻠ<br>ﺔ</div> +<div dir=rtl lang=ar id=test>عائلة</div> +</section> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-strict-011.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-011.xht new file mode 100644 index 0000000000..d9cecc788a --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-011.xht @@ -0,0 +1,94 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - strict and Japanese small kana</title> + <!-- Japanese small kana --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-strict-011-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: strict' does not allow line breaking before Japanese small kana such as 'Japanese small kana a (U+3041)' and 'Japanese small kana i (U+3043)'." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: strict; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL A --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ぁ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ぁ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL I --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ぃ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ぃ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL U --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ぅ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ぅ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL E --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ぇ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ぇ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL O --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ぉ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ぉ</span>サンプル文</span> + </p> + </div> + </body> +</html> + diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-strict-012.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-012.xht new file mode 100644 index 0000000000..d01b53f622 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-012.xht @@ -0,0 +1,66 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - strict and Katakana-Hiragana prolonged sound marks</title> + <!-- Katakana-Hiragana prolonged sound marks --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-strict-012-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: strict' does not allow line breaking before Katakana-Hiragana prolonged sound marks such as (U+30FC) and (U+FF70)." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: strict; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- Katakana-Hiragana prolonged sound mark - fullwidth --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ー</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ー</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Katakana-Hiragana prolonged sound mark - halfwidth --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ｰ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ｰ</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-strict-013.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-013.xht new file mode 100644 index 0000000000..d6746e4579 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-013.xht @@ -0,0 +1,65 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - strict and hyphens</title> + <!-- hyphens --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-strict-013-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: strict' does not allow line breaking before U+301C and U+30A0.." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: strict; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <!-- hyphens --> + <div class="wrapper"> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">〜</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">〜</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">゠</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">゠</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-strict-014.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-014.xht new file mode 100644 index 0000000000..90710cbdbe --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-014.xht @@ -0,0 +1,97 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - strict and iteration marks</title> + <!-- iteration marks --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-strict-014-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: strict' does not allow line breaking before iteration marks such as IDEOGRAPHIC ITERATION MARK (U+3005) and VERTICAL IDEOGRAPHIC ITERATION MARK (U+303B)." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: strict; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <!-- iteration marks --> + <div class="wrapper"> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">々</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">々</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">〻</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">〻</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ゝ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ゝ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ゞ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ゞ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ヽ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ヽ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">ヾ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ヾ</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-strict-015a.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-015a.xht new file mode 100644 index 0000000000..9114120bc8 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-015a.xht @@ -0,0 +1,66 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - strict and inseparable characters</title> + <!-- inseparable characters --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-strict-015a-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: strict' does not allow line breaking between inseparable characters such as TWO DOT LEADER (U+2025) and HORIZONTAL ELLIPSIS (U+2026)." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: strict; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- inseparable characters TWO DOT LEADER --> + <p class="test" lang="ja"> + <span>サンプルサンプル文<span class="target">‥‥</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプルサンプル文<br /><span class="target">‥‥</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- inseparable characters HORIZONTAL ELLIPSIS --> + <p class="test" lang="ja"> + <span>サンプルサンプル文<span class="target">……</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプルサンプル文<br /><span class="target">……</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-strict-015b.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-015b.xht new file mode 100644 index 0000000000..563ae9da9a --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-015b.xht @@ -0,0 +1,67 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - strict and inseparable characters</title> + <!-- inseparable characters --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-strict-015b-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: strict' does not allow line breaking between inseparable characters such as TWO DOT LEADER (U+2025) and HORIZONTAL ELLIPSIS (U+2026). Tailorable breaks between ID and CL, as well as CL and IN are also disallowed." /> + <meta name="flags" content="should" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: strict; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- inseparable characters TWO DOT LEADER --> + <p class="test" lang="ja"> + <span>サンプルサンプル。<span class="target">‥‥</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプルサンプ<br />ル。<span class="target">‥‥</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- inseparable characters HORIZONTAL ELLIPSIS --> + <p class="test" lang="ja"> + <span>サンプルサンプル。<span class="target">……</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプルサンプ<br />ル。<span class="target">……</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-strict-016a.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-016a.xht new file mode 100644 index 0000000000..9e6e8b8690 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-016a.xht @@ -0,0 +1,84 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - strict and centered punctuation marks</title> + <!-- centered punctuation marks --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-strict-016a-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: strict' does not allow line breaking before centered punctuation marks." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: strict; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 5px; + padding: 5px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- centered punctuation marks KATAKANA MIDDLE DOT --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">・</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">・</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks FULLWIDTH COLON --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">：</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">：</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks FULLWIDTH SEMICOLON --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">；</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">；</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks HALFWIDTH KATAKANA MIDDLE DOT --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">･</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">･</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-strict-016b.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-016b.xht new file mode 100644 index 0000000000..9a4a3c22ed --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-016b.xht @@ -0,0 +1,102 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - strict and centered punctuation marks</title> + <!-- centered punctuation marks --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-strict-016b-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: strict' does not allow line breaking before centered punctuation marks." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: strict; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 5px; + padding: 5px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- centered punctuation marks DOUBLE EXCLAMATION MARK --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">‼</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">‼</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks DOUBLE QUESTION MARK --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">⁇</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">⁇</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks QUESTION EXCLAMATION MARK --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">⁈</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">⁈</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks EXCLAMATION QUESTION MARK --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">⁉</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">⁉</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks FULLWIDTH EXCLAMATION MARK --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">！</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">！</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks FULLWIDTH QUESTION MARK --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">？</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">？</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-strict-017a.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-017a.xht new file mode 100644 index 0000000000..795f2aecb3 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-017a.xht @@ -0,0 +1,84 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - strict and postfixes</title> + <!-- postfixes --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-strict-017a-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: strict' does not allow line breaking before postfixes." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: strict; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.1em; /* added extra .1em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- postfixes DEGREE SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">°</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">°</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes PER MILLE SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">‰</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">‰</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes PRIME --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">′</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">′</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes DOUBLE PRIME --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">″</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">″</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-strict-017b.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-017b.xht new file mode 100644 index 0000000000..c41b3afae2 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-017b.xht @@ -0,0 +1,75 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - strict and postfixes</title> + <!-- postfixes --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-strict-017b-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: strict' does not allow line breaking before postfixes." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: strict; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- postfixes DEGREE CELSIUS --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">℃</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">℃</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes FULLWIDTH PERCENT SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">％</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">％</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes FULLWIDTH CENT SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル文<span class="target">￠</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">￠</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-strict-018.xht b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-018.xht new file mode 100644 index 0000000000..85a92d1688 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-018.xht @@ -0,0 +1,93 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Text Test: line-break - strict and prefixes</title> + <!-- prefixes --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <link rel="help" title="5.3. Line Breaking Rules: the 'line-break' property" href="https://drafts.csswg.org/css-text-3/#line-break-property" /> + <link rel="match" href="reference/line-break-strict-018-ref.xht" /> + <meta http-equiv="content-language" content="en, ja" /> + <meta name="assert" content="This test verifies that 'line-break: strict' does not allow line breaking after prefixes." /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + .test span { + line-break: strict; /* The property to be tested */ + } + p.test, p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- prefixes EURO SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル<span class="target">€</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">€</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- prefixes NUMERO SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル<span class="target">№</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">№</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- prefixes FULLWIDTH DOLLAR SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル<span class="target">＄</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">＄</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- prefixes FULLWIDTH POUND SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル<span class="target">￡</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">￡</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- prefixes FULLWIDTH YEN SIGN --> + <p class="test" lang="ja"> + <span>サンプル文サンプル<span class="target">￥</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">￥</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-strict-hyphens-001.html b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-hyphens-001.html new file mode 100644 index 0000000000..0d8677e3bf --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-hyphens-001.html @@ -0,0 +1,21 @@ +<!doctype html> +<html lang=en> +<meta charset=utf-8> +<title>CSS test: hyphens and line-break:strict</title> +<link rel=author title="Florian Rivoal" href="https://florian.rivoal.net"> +<link rel=help href="https://drafts.csswg.org/css-text-3/#propdef-line-break"> +<link rel=match href="reference/line-break-normal-hyphens-001-ref.html"> +<meta name=assert content="breaks before U+2010 or U+2013 when line-break is strict are not allowed when the preceding character has class ID."> +<style> +div { + width: 2em; + line-break: strict; + border: solid cyan; +} +</style> + +<p>The test passes if the second line in each box below ends with a hyphen. +(Note: the hyphens in each box do no need to be the same size.) + +<div>文文‐文</div> +<div>文文–文</div> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-strict-hyphens-002.html b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-hyphens-002.html new file mode 100644 index 0000000000..cb5b8354e5 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-hyphens-002.html @@ -0,0 +1,24 @@ +<!doctype html> +<html lang=en> +<meta charset=utf-8> +<title>CSS test: hyphens and line-break:strict</title> +<link rel=author title="Florian Rivoal" href="https://florian.rivoal.net"> +<link rel=help href="https://drafts.csswg.org/css-text-3/#propdef-line-break"> +<link rel=help href="https://drafts.csswg.org/css-text-3/#word-break-property"> +<link rel=match href="reference/line-break-normal-hyphens-002-ref.html"> +<meta name=assert content="breaks before U+2010 or U+2013 when line-break is strict are not allowed if the preceding character is treated as having class ID due to word-break:break-all."> +<style> +div { + font-family: monospace; + width: 2ch; + line-break: strict; + word-break: break-all; + border: solid cyan; +} +</style> + +<p>The test passes if the second line in each box below ends with a hyphen. +(Note: the hyphens in each box do no need to be the same size.) + +<div>aa‐a</div> +<div>aa–a</div> diff --git a/testing/web-platform/tests/css/css-text/line-break/line-break-strict-hyphens-003.html b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-hyphens-003.html new file mode 100644 index 0000000000..f0d3adc88e --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/line-break-strict-hyphens-003.html @@ -0,0 +1,22 @@ +<!doctype html> +<html lang=en> +<meta charset=utf-8> +<title>CSS test: hyphens and line-break:strict</title> +<link rel=author title="Florian Rivoal" href="https://florian.rivoal.net"> +<link rel=help href="https://drafts.csswg.org/css-text-3/#propdef-line-break"> +<link rel=match href="reference/line-break-loose-hyphens-003-ref.html"> +<meta name=assert content="breaks before U+2010 or U+2013 when line-break is strict are not allowed if the preceding character is not of line-breaking class ID."> +<style> +div { + font-family: monospace; + width: 2ch; + line-break: strict; +} +</style> + +<p>The test passes if there are two lines of text below +and they both end with a hyphen. +(Note: the hyphens do no need to be the same size.) + +<div>aa‐</div> +<div>aa–</div> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-anywhere-001-ref.html b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-anywhere-001-ref.html new file mode 100644 index 0000000000..daf17c9c0a --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-anywhere-001-ref.html @@ -0,0 +1,17 @@ +<!DOCTYPE html> +<html lang=en> +<meta charset="utf-8"> +<title>CSS Text Test Reference</title> +<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/"> +<style> +#green { + position: absolute; + background: green; + font-family: monospace; + width: 1ch; + height: 19em; +} +</style> + +<p>Test passes if there is a green rectangle below and no red.</p> +<div id=green></div> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-anywhere-003-ref.html b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-anywhere-003-ref.html new file mode 100644 index 0000000000..ceec198d03 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-anywhere-003-ref.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html lang="en" > +<head> +<meta charset="utf-8"> +<title>word-break: break-all, latin</title> +<link rel='author' title='Richard Ishida' href='mailto:ishida@w3.org'> +<style type='text/css'> +.test { word-break: break-all; } +/* the CSS below is not part of the test */ +.test, .ref { border: 1px solid orange; margin: 20px; padding: 10px; width: 390px; font: 36px/1 sans-serif; } +</style> +</head> +<body> +<div id='instructions'>Test passes if the two orange boxes are the same.</div> +<div class="ref"><span>Latin latin latin lati<br/>n</span></div> +<div class="ref"><span>Latin latin latin lati<br/>n</span></div> +</body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-anywhere-004-ref.html b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-anywhere-004-ref.html new file mode 100644 index 0000000000..0e0300a72d --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-anywhere-004-ref.html @@ -0,0 +1,16 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>CSS Text Reference File</title> +<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/"> +<style> +div { + position: relative; + width: 100px; + height: 100px; + background: green; +} +</style> +<body> + <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> + <div></div> +</body> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-011-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-011-ref.xht new file mode 100644 index 0000000000..cc6d9023c0 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-011-ref.xht @@ -0,0 +1,87 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-loose-011.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL A --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぁ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぁ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL I --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぃ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぃ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL U --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぅ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぅ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL E --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぇ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぇ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL O --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぉ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぉ</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-012-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-012-ref.xht new file mode 100644 index 0000000000..4ffd2f90ec --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-012-ref.xht @@ -0,0 +1,60 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-loose-012.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- Katakana-Hiragana prolonged sound mark - fullwidth --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ー</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ー</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Katakana-Hiragana prolonged sound mark - halfwidth --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ｰ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ｰ</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-013-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-013-ref.xht new file mode 100644 index 0000000000..27ea22e988 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-013-ref.xht @@ -0,0 +1,59 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-loose-013.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <!-- hyphens --> + <div class="wrapper"> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">〜</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">〜</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">゠</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">゠</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-014-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-014-ref.xht new file mode 100644 index 0000000000..bc8090819c --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-014-ref.xht @@ -0,0 +1,91 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-loose-014.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <!-- iteration marks --> + <div class="wrapper"> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">々</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">々</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">〻</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">〻</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ゝ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ゝ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ゞ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ゞ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ヽ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ヽ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ヾ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ヾ</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-015-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-015-ref.xht new file mode 100644 index 0000000000..c59d5af504 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-015-ref.xht @@ -0,0 +1,60 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-loose-015.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- inseparable characters TWO DOT LEADER --> + <p class="control" lang="ja"> + <span>サンプルサンプル。<span class="target">‥<br />‥</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプルサンプル。<span class="target">‥<br />‥</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- inseparable characters HORIZONTAL ELLIPSIS --> + <p class="control" lang="ja"> + <span>サンプルサンプル。<span class="target">…<br />…</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプルサンプル。<span class="target">…<br />…</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-016a-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-016a-ref.xht new file mode 100644 index 0000000000..4338d02bab --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-016a-ref.xht @@ -0,0 +1,78 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-loose-016a.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 5px; + padding: 5px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- centered punctuation marks KATAKANA MIDDLE DOT --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">・</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">・</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks FULLWIDTH COLON --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">：</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">：</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks FULLWIDTH SEMICOLON --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">；</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">；</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks HALFWIDTH KATAKANA MIDDLE DOT --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">･</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">･</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-016b-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-016b-ref.xht new file mode 100644 index 0000000000..0c80df6ec4 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-016b-ref.xht @@ -0,0 +1,96 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-loose-016b.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 5px; + padding: 5px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- centered punctuation marks DOUBLE EXCLAMATION MARK --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">‼</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">‼</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks DOUBLE QUESTION MARK --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">⁇</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">⁇</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks QUESTION EXCLAMATION MARK --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">⁈</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">⁈</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks EXCLAMATION QUESTION MARK --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">⁉</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">⁉</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks FULLWIDTH EXCLAMATION MARK --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">！</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">！</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks FULLWIDTH QUESTION MARK --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">？</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">？</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-017a-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-017a-ref.xht new file mode 100644 index 0000000000..dc1084a815 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-017a-ref.xht @@ -0,0 +1,78 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-loose-017a.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.1em; /* added extra .1em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- postfixes DEGREE SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">°</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">°</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes PER MILLE SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">‰</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">‰</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes PRIME --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">′</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">′</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes DOUBLE PRIME --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">″</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">″</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-017b-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-017b-ref.xht new file mode 100644 index 0000000000..7148339b05 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-017b-ref.xht @@ -0,0 +1,69 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-loose-017b.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- postfixes DEGREE CELSIUS --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">℃</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">℃</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes FULLWIDTH PERCENT SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">％</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">％</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes FULLWIDTH CENT SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">￠</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">￠</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-018-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-018-ref.xht new file mode 100644 index 0000000000..c8f6b56124 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-018-ref.xht @@ -0,0 +1,87 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-loose-018.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- prefixes EURO SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<span class="target">€</span><br />サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<span class="target">€</span><br />サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- prefixes NUMERO SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<span class="target">№</span><br />サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<span class="target">№</span><br />サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- prefixes FULLWIDTH DOLLAR SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<span class="target">＄</span><br />サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<span class="target">＄</span><br />サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- prefixes FULLWIDTH POUND SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<span class="target">￡</span><br />サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<span class="target">￡</span><br />サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- prefixes FULLWIDTH YEN SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<span class="target">￥</span><br />サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<span class="target">￥</span><br />サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-hyphens-001-ref.html b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-hyphens-001-ref.html new file mode 100644 index 0000000000..42746cb814 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-hyphens-001-ref.html @@ -0,0 +1,18 @@ +<!doctype html> +<html lang=en> +<meta charset=utf-8> +<title>Test reference</title> +<link rel=author title="Florian Rivoal" href="https://florian.rivoal.net"> +<style> +div { + width: 2em; + white-space: pre; + border: solid cyan; +} +</style> + +<p>The test passes if the second line in each box below starts with a hyphen. +(Note: the hyphens in each box do no need to be the same size.) + +<div>文文<br>‐文</div> +<div>文文<br>–文</div> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-hyphens-002-ref.html b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-hyphens-002-ref.html new file mode 100644 index 0000000000..a542fe86eb --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-hyphens-002-ref.html @@ -0,0 +1,19 @@ +<!doctype html> +<html lang=en> +<meta charset=utf-8> +<title>Test reference</title> +<link rel=author title="Florian Rivoal" href="https://florian.rivoal.net"> +<style> +div { + font-family: monospace; + width: 2ch; + white-space: pre; + border: solid cyan; +} +</style> + +<p>The test passes if the second line in each box below starts with a hyphen. +(Note: the hyphens in each box do no need to be the same size.) + +<div>aa<br>‐a</div> +<div>aa<br>–a</div> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-hyphens-003-ref.html b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-hyphens-003-ref.html new file mode 100644 index 0000000000..dbfc1a90c7 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-loose-hyphens-003-ref.html @@ -0,0 +1,18 @@ +<!doctype html> +<html lang=en> +<meta charset=utf-8> +<title>Test reference</title> +<link rel=author title="Florian Rivoal" href="https://florian.rivoal.net"> +<style> +div { + font-family: monospace; + white-space: pre; +} +</style> + +<p>The test passes if there are two lines of text below +and they both end with a hyphen. +(Note: the hyphens do no need to be the same size.) + +<div>aa‐</div> +<div>aa–</div> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-011-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-011-ref.xht new file mode 100644 index 0000000000..dc37069bad --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-011-ref.xht @@ -0,0 +1,87 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-normal-011.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL A --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぁ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぁ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL I --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぃ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぃ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL U --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぅ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぅ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL E --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぇ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぇ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL O --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぉ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ぉ</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-012-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-012-ref.xht new file mode 100644 index 0000000000..ecb86a902c --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-012-ref.xht @@ -0,0 +1,60 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-normal-012.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- Katakana-Hiragana prolonged sound mark - fullwidth --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ー</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ー</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Katakana-Hiragana prolonged sound mark - halfwidth --> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ｰ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">ｰ</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-013-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-013-ref.xht new file mode 100644 index 0000000000..28ebcc404e --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-013-ref.xht @@ -0,0 +1,59 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-normal-013.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <!-- hyphens --> + <div class="wrapper"> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">〜</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">〜</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">゠</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル文<br /><span class="target">゠</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-014-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-014-ref.xht new file mode 100644 index 0000000000..577bf29a51 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-014-ref.xht @@ -0,0 +1,91 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-normal-014.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <!-- iteration marks --> + <div class="wrapper"> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">々</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">々</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">〻</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">〻</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ゝ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ゝ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ゞ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ゞ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ヽ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ヽ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ヾ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ヾ</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-015a-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-015a-ref.xht new file mode 100644 index 0000000000..941e18242d --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-015a-ref.xht @@ -0,0 +1,60 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-normal-015.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- inseparable characters TWO DOT LEADER --> + <p class="control" lang="ja"> + <span>サンプルサンプル文<br /><span class="target">‥‥</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプルサンプル文<br /><span class="target">‥‥</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- inseparable characters HORIZONTAL ELLIPSIS --> + <p class="control" lang="ja"> + <span>サンプルサンプル文<br /><span class="target">……</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプルサンプル文<br /><span class="target">……</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-015b-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-015b-ref.xht new file mode 100644 index 0000000000..b4697babbc --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-015b-ref.xht @@ -0,0 +1,60 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-normal-015.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- inseparable characters TWO DOT LEADER --> + <p class="control" lang="ja"> + <span>サンプルサンプ<br />ル。<span class="target">‥‥</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプルサンプ<br />ル。<span class="target">‥‥</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- inseparable characters HORIZONTAL ELLIPSIS --> + <p class="control" lang="ja"> + <span>サンプルサンプ<br />ル。<span class="target">……</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプルサンプ<br />ル。<span class="target">……</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-016a-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-016a-ref.xht new file mode 100644 index 0000000000..4ebe678bd4 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-016a-ref.xht @@ -0,0 +1,78 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-normal-016a.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 5px; + padding: 5px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- centered punctuation marks KATAKANA MIDDLE DOT --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">・</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">・</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks FULLWIDTH COLON --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">：</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">：</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks FULLWIDTH SEMICOLON --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">；</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">；</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks HALFWIDTH KATAKANA MIDDLE DOT --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">･</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">･</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-016b-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-016b-ref.xht new file mode 100644 index 0000000000..4ee234b4cb --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-016b-ref.xht @@ -0,0 +1,96 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-normal-016b.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 5px; + padding: 5px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- centered punctuation marks DOUBLE EXCLAMATION MARK --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">‼</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">‼</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks DOUBLE QUESTION MARK --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">⁇</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">⁇</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks QUESTION EXCLAMATION MARK --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">⁈</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">⁈</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks EXCLAMATION QUESTION MARK --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">⁉</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">⁉</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks FULLWIDTH EXCLAMATION MARK --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">！</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">！</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks FULLWIDTH QUESTION MARK --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">？</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">？</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-017a-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-017a-ref.xht new file mode 100644 index 0000000000..d6d7080fdd --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-017a-ref.xht @@ -0,0 +1,78 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-normal-017a.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.1em; /* added extra .1em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- postfixes DEGREE SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">°</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">°</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes PER MILLE SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">‰</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">‰</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes PRIME --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">′</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">′</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes DOUBLE PRIME --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">″</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">″</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-017b-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-017b-ref.xht new file mode 100644 index 0000000000..7efb5296b0 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-017b-ref.xht @@ -0,0 +1,69 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-normal-024.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- postfixes DEGREE CELSIUS --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">℃</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">℃</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes FULLWIDTH PERCENT SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">％</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">％</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes FULLWIDTH CENT SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">￠</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">￠</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-018-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-018-ref.xht new file mode 100644 index 0000000000..9b23b57dfe --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-018-ref.xht @@ -0,0 +1,87 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-normal-018.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- prefixes EURO SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">€</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">€</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- prefixes NUMERO SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">№</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">№</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- prefixes FULLWIDTH DOLLAR SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">＄</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">＄</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- prefixes FULLWIDTH POUND SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">￡</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">￡</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- prefixes FULLWIDTH YEN SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">￥</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">￥</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-hyphens-001-ref.html b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-hyphens-001-ref.html new file mode 100644 index 0000000000..6b802e30e7 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-hyphens-001-ref.html @@ -0,0 +1,18 @@ +<!doctype html> +<html lang=en> +<meta charset=utf-8> +<title>Test reference</title> +<link rel=author title="Florian Rivoal" href="https://florian.rivoal.net"> +<style> +div { + width: 2em; + white-space: pre; + border: solid cyan; +} +</style> + +<p>The test passes if the second line in each box below ends with a hyphen. +(Note: the hyphens in each box do no need to be the same size.) + +<div>文<br>文‐<br>文</div> +<div>文<br>文–<br>文</div> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-hyphens-002-ref.html b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-hyphens-002-ref.html new file mode 100644 index 0000000000..23ab9b553b --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-normal-hyphens-002-ref.html @@ -0,0 +1,19 @@ +<!doctype html> +<html lang=en> +<meta charset=utf-8> +<title>test reference</title> +<link rel=author title="Florian Rivoal" href="https://florian.rivoal.net"> +<style> +div { + font-family: monospace; + width: 2ch; + white-space: normal; + border: solid cyan; +} +</style> + +<p>The test passes if the second line in each box below ends with a hyphen. +(Note: the hyphens in each box do no need to be the same size.) + +<div>a<br>a‐<br>a</div> +<div>a<br>a–<br>a</div> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-shaping-001-ref.html b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-shaping-001-ref.html new file mode 100644 index 0000000000..5543ab0729 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-shaping-001-ref.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>CSS Text level 3 Test ref</title> +<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/"> +<style> + @font-face { + font-family: 'csstest_noto'; + src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2'); + } + div { + font-family: 'csstest_noto'; + font-size: 4em; + margin: 1rem; + } + section { + float: left; /* to sizing to the intrinsic min of the ref box*/ + } + #ref { border: solid orange; } + #test { border: solid blue; } +</style> + +<p>Test passes if the blue and organge boxes are identical. Pay attention to characters at the left of the first line, and on the second line. +<section> +<div dir=rtl lang=ar id=ref>ﻋﺎﺋﻠ<br>ﺔ</div> +<div dir=rtl lang=ar id=test>ﻋﺎﺋﻠ<br>ﺔ</div> +</section> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-011-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-011-ref.xht new file mode 100644 index 0000000000..ec17a31ec5 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-011-ref.xht @@ -0,0 +1,87 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-strict-011.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL A --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ぁ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ぁ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL I --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ぃ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ぃ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL U --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ぅ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ぅ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL E --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ぇ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ぇ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Japanese small kana: HIRAGANA LETTER SMALL O --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ぉ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ぉ</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-012-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-012-ref.xht new file mode 100644 index 0000000000..fbe2222c72 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-012-ref.xht @@ -0,0 +1,60 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-strict-012.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- Katakana-Hiragana prolonged sound mark - fullwidth --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ー</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ー</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- Katakana-Hiragana prolonged sound mark - halfwidth --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ｰ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ｰ</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-013-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-013-ref.xht new file mode 100644 index 0000000000..c2e6d603ad --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-013-ref.xht @@ -0,0 +1,59 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-strict-013.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <!-- hyphens --> + <div class="wrapper"> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">〜</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">〜</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">゠</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">゠</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-014-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-014-ref.xht new file mode 100644 index 0000000000..2af0a903eb --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-014-ref.xht @@ -0,0 +1,91 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-strict-014.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <!-- iteration marks --> + <div class="wrapper"> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">々</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">々</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">〻</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">〻</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ゝ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ゝ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ゞ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ゞ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ヽ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ヽ</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ヾ</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">ヾ</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-015a-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-015a-ref.xht new file mode 100644 index 0000000000..f8a1222a33 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-015a-ref.xht @@ -0,0 +1,60 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-strict-015.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- inseparable characters TWO DOT LEADER --> + <p class="control" lang="ja"> + <span>サンプルサンプル文<br /><span class="target">‥‥</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプルサンプル文<br /><span class="target">‥‥</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- inseparable characters HORIZONTAL ELLIPSIS --> + <p class="control" lang="ja"> + <span>サンプルサンプル文<br /><span class="target">……</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプルサンプル文<br /><span class="target">……</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-015b-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-015b-ref.xht new file mode 100644 index 0000000000..8eceb2ae9d --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-015b-ref.xht @@ -0,0 +1,60 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-strict-015.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- inseparable characters TWO DOT LEADER --> + <p class="control" lang="ja"> + <span>サンプルサンプ<br />ル。<span class="target">‥‥</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプルサンプ<br />ル。<span class="target">‥‥</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- inseparable characters HORIZONTAL ELLIPSIS --> + <p class="control" lang="ja"> + <span>サンプルサンプ<br />ル。<span class="target">……</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプルサンプ<br />ル。<span class="target">……</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-016a-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-016a-ref.xht new file mode 100644 index 0000000000..9c2d497a03 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-016a-ref.xht @@ -0,0 +1,78 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-strict-016.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 5px; + padding: 5px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- centered punctuation marks KATAKANA MIDDLE DOT --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">・</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">・</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks FULLWIDTH COLON --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">：</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">：</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks FULLWIDTH SEMICOLON --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">；</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">；</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks HALFWIDTH KATAKANA MIDDLE DOT --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">･</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">･</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-016b-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-016b-ref.xht new file mode 100644 index 0000000000..d000b8087b --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-016b-ref.xht @@ -0,0 +1,96 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-strict-016.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 5px; + padding: 5px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- centered punctuation marks DOUBLE EXCLAMATION MARK --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">‼</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">‼</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks DOUBLE QUESTION MARK --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">⁇</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">⁇</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks QUESTION EXCLAMATION MARK --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">⁈</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">⁈</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks EXCLAMATION QUESTION MARK --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">⁉</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">⁉</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks FULLWIDTH EXCLAMATION MARK --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">！</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">！</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- centered punctuation marks FULLWIDTH QUESTION MARK --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">？</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">？</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-017a-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-017a-ref.xht new file mode 100644 index 0000000000..874b4ddcae --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-017a-ref.xht @@ -0,0 +1,78 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-strict-017.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.1em; /* added extra .1em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- postfixes DEGREE SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">°</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">°</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes PER MILLE SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">‰</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">‰</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes PRIME --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">′</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">′</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes DOUBLE PRIME --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">″</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">″</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-017b-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-017b-ref.xht new file mode 100644 index 0000000000..c4b5c89b20 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-017b-ref.xht @@ -0,0 +1,69 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-strict-017b.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- postfixes DEGREE CELSIUS --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">℃</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">℃</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes FULLWIDTH PERCENT SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">％</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">％</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- postfixes FULLWIDTH CENT SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">￠</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br />文<span class="target">￠</span>サンプル文</span> + </p> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-018-ref.xht b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-018-ref.xht new file mode 100644 index 0000000000..c0c236a927 --- /dev/null +++ b/testing/web-platform/tests/css/css-text/line-break/reference/line-break-strict-018-ref.xht @@ -0,0 +1,87 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml"> + <head> + <title>CSS Reftest Reference</title> + <!-- reftest for line-break-strict-018.xht --> + <link rel="author" title="Taka Oshiyama" href="mailto:takaoshiyama@gmail.com" /> + <link rel="author" title="Shinyu Murakami" href="mailto:murakami@vivliostyle.org" /> + <meta http-equiv="content-language" content="en, ja" /> + <style type="text/css"> + @font-face + { + font-family: "mplus-1p-regular"; + src: url("/fonts/mplus-1p-regular.woff") format("woff"); + /* filesize: 803300 bytes (784.5 KBytes) */ + /* + mplus-1p-regular.ttf can be downloaded at/from [TBD later] + */ + } + p.control { + border: 1px solid gray; + color: blue; + font-family: "mplus-1p-regular"; + width: 10.2em; /* added extra .2em for some symbols wider than 1em */ + } + span.target { + background-color: aqua; + } + div.wrapper { + display: inline-block; + border: 1px solid; + margin: 10px; + padding: 10px; + } + </style> + </head> + <body lang="en"> + <p> + Test passes if the highlighted characters in each pair of rectangles are at the exact same horizontal position. + </p> + <div class="wrapper"> + <!-- prefixes EURO SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">€</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">€</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- prefixes NUMERO SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">№</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">№</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- prefixes FULLWIDTH DOLLAR SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">＄</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">＄</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- prefixes FULLWIDTH POUND SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">￡</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">￡</span>サンプル文</span> + </p> + </div> + <div class="wrapper"> + <!-- prefixes FULLWIDTH YEN SIGN --> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">￥</span>サンプル文</span> + </p> + <p class="control" lang="ja"> + <span>サンプル文サンプル<br /><span class="target">￥</span>サンプル文</span> + </p> + </div> + </body> +</html> |