seg-break-transformation-001

Wide characters around line break

WeasyPrint

This browser

Flags
script
Assertion
If the East Asian Width property of both the character before and after the line feed is W and neither side is Hangul, then the segment break is removed.

Source

 1 <!DOCTYPE html>
 2 <html lang="en"><head>
 3 <meta charset="utf-8">
 4 <title>Wide characters around line break</title>
 5 <link href="mailto:ishida@w3.org" rel="author" title="Richard Ishida">
 6 <link href="https://drafts.csswg.org/css-text-3/#line-break-transform" rel="help">
 7 <meta content="If the East Asian Width property of both the character before and after the line feed is W and neither side is Hangul, then the segment break is removed." name="assert">
 8 <style type="text/css">
 9 /* the CSS below is not part of the test */
10 .test span { font-size: 24px; font-family: sans-serif; background-color:#2AA5F7; color: white; }
11 .ref span { font-size: 24px; font-family: sans-serif; background-color:#270CEF; color: white; }
12 </style>
13 <script src="/resources/testharness.js"></script>
14 <script src="/resources/testharnessreport.js"></script>
15 </head>
16 <body>
17 <div id="log"></div>
18 <div class="test" id="test1"><span>日本語
19 中国话</span></div>
20 <div class="test" id="test2"><span>日本語   
21 中国话</span></div>
22 <div class="test" id="test3"><span>日本語
23         中国话</span></div>
24 <div class="test" id="test4"><span>日本語   
25      中国话</span></div>
26 <div class="test" id="test5"><span>日本語
27 
28 
29 中国话</span></div>
30 <div class="test" id="test6"><span>日本語  
31    
32    
33    中国话</span></div>
34 <div class="ref" id="ref"><span>日本語中国话</span></div>
35 <script>
36 test(function() {
37 assert_equals(document.getElementById('test1').firstChild.offsetWidth, document.getElementById('ref').firstChild.offsetWidth);
38 }, "linebreak only");
39 test(function() {
40 assert_equals(document.getElementById('test2').firstChild.offsetWidth, document.getElementById('ref').firstChild.offsetWidth);
41 }, "spaces linebreak");
42 test(function() {
43 assert_equals(document.getElementById('test3').firstChild.offsetWidth, document.getElementById('ref').firstChild.offsetWidth);
44 }, "linebreak spaces");
45 test(function() {
46 assert_equals(document.getElementById('test4').firstChild.offsetWidth, document.getElementById('ref').firstChild.offsetWidth);
47 }, "spaces linebreak spaces");
48 test(function() {
49 assert_equals(document.getElementById('test5').firstChild.offsetWidth, document.getElementById('ref').firstChild.offsetWidth);
50 }, "multiple linebreaks");
51 test(function() {
52 assert_equals(document.getElementById('test6').firstChild.offsetWidth, document.getElementById('ref').firstChild.offsetWidth);
53 }, "multiple linebreaks + spaces");
54 </script>
55 <!-- Notes:
56 The assertion will fail if space is produced for any line in the test paragraph.
57 -->
58 
59 
60 
61 
62 </body></html>