Skip to content

Commit

Permalink
[css-text] Update 'line-break' tests
Browse files Browse the repository at this point in the history
### Fix test file name numbering

The problem was that `line-break-normal-*` and `line-break-strict-*` had diffrent numbering for same ranges, e.g. `line-break-normal-021` and `line-break-strict-014` for same iteration marks. It was confusing, so I changed the numbering for 'normal' to be the same as for 'strict'.

- line-break-normal-021  → line-break-normal-014
- line-break-normal-022  → line-break-normal-015
- line-break-normal-023a → line-break-normal-016a
- line-break-normal-023b → line-break-normal-016b
- line-break-normal-024a → line-break-normal-017a
- line-break-normal-024b → line-break-normal-017b

### Fix tests for Inseparatable characters

The tests for Inseparatable characters `line-break-strict-015` and `line-break-normal-015` (was `line-break-normal-022`) had wrong assertion "does not allow line breaking **before** inseparable characters". This should be "does not allow line breaking **between** inseparable characters".

I changed the tests to test line breaking **between** (not **before**) two inseparable characters.

### Fix tests for Centered punctuation marks

The tests for Centered punctuation marks `line-break-strict-016a` and `line-break-normal-016a` (was `line-break-normal-023a`) contained tests for EAW=Narrow characters (U+003A, U+003B, U+0021, U+003F) that are excluded in the current 'line-break' spec.

### Fix tests for Postfixes

The tests for Postfixes `line-break-strict-017a` and `line-break-normal-017a` (was `line-break-normal-024a`) contained tests for EAW=Narrow characters (U+0025 and U+00A2) that are excluded in the current 'line-break' spec.

### Add tests for Prefixes

Added the tests for line breaking after Prefixes `line-break-*-018`.

### Add 'loose' and 'normal' values tests that were missing

- line-break-loose-011 .. line-break-loose-017b
- line-break-normal-011 .. line-break-normal-013

### Adjust width of the test block

I changed the width of the test block `p.test, p.control {...}` that was `width: 10em` to `width: 10.2em`. This extra (.2em) width is needed to prevent unexpected line breaking caused by some symbol characters wider than 1em.

I found this problem with `line-break-loose-018`. The width of U+2116 "№" is slightly wider than 1em and if the block width is 10em the line breaking occurs before that character�, and the test always fails.
  • Loading branch information
MurakamiShinyu committed Dec 3, 2018
1 parent de9a09a commit 781fd3d
Show file tree
Hide file tree
Showing 60 changed files with 2,572 additions and 312 deletions.
94 changes: 94 additions & 0 deletions css/css-text/line-break/line-break-loose-011.xht
Original file line number Diff line number Diff line change
@@ -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:[email protected]" />
<link rel="author" title="Shinyu Murakami" href="mailto:[email protected]" />
<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">&#x3041;</span>サンプル文</span>
</p>
<p class="control" lang="ja">
<span>サンプル文サンプル文<br /><span class="target">&#x3041;</span>サンプル文</span>
</p>
</div>
<div class="wrapper">
<!-- Japanese small kana: HIRAGANA LETTER SMALL I -->
<p class="test" lang="ja">
<span>サンプル文サンプル文<span class="target">&#x3043;</span>サンプル文</span>
</p>
<p class="control" lang="ja">
<span>サンプル文サンプル文<br /><span class="target">&#x3043;</span>サンプル文</span>
</p>
</div>
<div class="wrapper">
<!-- Japanese small kana: HIRAGANA LETTER SMALL U -->
<p class="test" lang="ja">
<span>サンプル文サンプル文<span class="target">&#x3045;</span>サンプル文</span>
</p>
<p class="control" lang="ja">
<span>サンプル文サンプル文<br /><span class="target">&#x3045;</span>サンプル文</span>
</p>
</div>
<div class="wrapper">
<!-- Japanese small kana: HIRAGANA LETTER SMALL E -->
<p class="test" lang="ja">
<span>サンプル文サンプル文<span class="target">&#x3047;</span>サンプル文</span>
</p>
<p class="control" lang="ja">
<span>サンプル文サンプル文<br /><span class="target">&#x3047;</span>サンプル文</span>
</p>
</div>
<div class="wrapper">
<!-- Japanese small kana: HIRAGANA LETTER SMALL O -->
<p class="test" lang="ja">
<span>サンプル文サンプル文<span class="target">&#x3049;</span>サンプル文</span>
</p>
<p class="control" lang="ja">
<span>サンプル文サンプル文<br /><span class="target">&#x3049;</span>サンプル文</span>
</p>
</div>
</body>
</html>

66 changes: 66 additions & 0 deletions css/css-text/line-break/line-break-loose-012.xht
Original file line number Diff line number Diff line change
@@ -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:[email protected]" />
<link rel="author" title="Shinyu Murakami" href="mailto:[email protected]" />
<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">&#x30FC;</span>サンプル文</span>
</p>
<p class="control" lang="ja">
<span>サンプル文サンプル文<br /><span class="target">&#x30FC;</span>サンプル文</span>
</p>
</div>
<div class="wrapper">
<!-- Katakana-Hiragana prolonged sound mark - halfwidth -->
<p class="test" lang="ja">
<span>サンプル文サンプル文<span class="target">&#xff70;</span>サンプル文</span>
</p>
<p class="control" lang="ja">
<span>サンプル文サンプル文<br /><span class="target">&#xff70;</span>サンプル文</span>
</p>
</div>
</body>
</html>
81 changes: 81 additions & 0 deletions css/css-text/line-break/line-break-loose-013.xht
Original file line number Diff line number Diff line change
@@ -0,0 +1,81 @@
<?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:[email protected]" />
<link rel="author" title="Shinyu Murakami" href="mailto:[email protected]" />
<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 hyphens such as HYPHEN (U+2010) and ENDASH (U+2013)." />
<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">&#x2010;</span>サンプル文</span>
</p>
<p class="control" lang="ja">
<span>サンプル文サンプル文<br /><span class="target">&#x2010;</span>サンプル文</span>
</p>
</div>
<div class="wrapper">
<p class="test" lang="ja">
<span>サンプル文サンプル文<span class="target">&#x2013;</span>サンプル文</span>
</p>
<p class="control" lang="ja">
<span>サンプル文サンプル文<br /><span class="target">&#x2013;</span>サンプル文</span>
</p>
</div>
<div class="wrapper">
<p class="test" lang="ja">
<span>サンプル文サンプル文<span class="target">&#x301c;</span>サンプル文</span>
</p>
<p class="control" lang="ja">
<span>サンプル文サンプル文<br /><span class="target">&#x301c;</span>サンプル文</span>
</p>
</div>
<div class="wrapper">
<p class="test" lang="ja">
<span>サンプル文サンプル文<span class="target">&#x30a0;</span>サンプル文</span>
</p>
<p class="control" lang="ja">
<span>サンプル文サンプル文<br /><span class="target">&#x30a0;</span>サンプル文</span>
</p>
</div>
</body>
</html>
97 changes: 97 additions & 0 deletions css/css-text/line-break/line-break-loose-014.xht
Original file line number Diff line number Diff line change
@@ -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:[email protected]" />
<link rel="author" title="Shinyu Murakami" href="mailto:[email protected]" />
<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">&#x3005;</span>サンプル文</span>
</p>
<p class="control" lang="ja">
<span>サンプル文サンプル文<br /><span class="target">&#x3005;</span>サンプル文</span>
</p>
</div>
<div class="wrapper">
<p class="test" lang="ja">
<span>サンプル文サンプル文<span class="target">&#x303b;</span>サンプル文</span>
</p>
<p class="control" lang="ja">
<span>サンプル文サンプル文<br /><span class="target">&#x303b;</span>サンプル文</span>
</p>
</div>
<div class="wrapper">
<p class="test" lang="ja">
<span>サンプル文サンプル文<span class="target">&#x309d;</span>サンプル文</span>
</p>
<p class="control" lang="ja">
<span>サンプル文サンプル文<br /><span class="target">&#x309d;</span>サンプル文</span>
</p>
</div>
<div class="wrapper">
<p class="test" lang="ja">
<span>サンプル文サンプル文<span class="target">&#x309e;</span>サンプル文</span>
</p>
<p class="control" lang="ja">
<span>サンプル文サンプル文<br /><span class="target">&#x309e;</span>サンプル文</span>
</p>
</div>
<div class="wrapper">
<p class="test" lang="ja">
<span>サンプル文サンプル文<span class="target">&#x30fd;</span>サンプル文</span>
</p>
<p class="control" lang="ja">
<span>サンプル文サンプル文<br /><span class="target">&#x30fd;</span>サンプル文</span>
</p>
</div>
<div class="wrapper">
<p class="test" lang="ja">
<span>サンプル文サンプル文<span class="target">&#x30fe;</span>サンプル文</span>
</p>
<p class="control" lang="ja">
<span>サンプル文サンプル文<br /><span class="target">&#x30fe;</span>サンプル文</span>
</p>
</div>
</body>
</html>
Loading

0 comments on commit 781fd3d

Please sign in to comment.