1 <!DOCTYPE html>
2 <html lang="en"><head>
3 <meta charset="utf-8">
4 <title>Whitespace and line break transformation</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="All spaces and tabs immediately preceding or following a segment break are removed. If no F, H, W or ZWSP characters involved, the segment break is converted to a space." 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>hello
19 there</span></div>
20 <div class="test" id="test2"><span>hello
21 there</span></div>
22 <div class="test" id="test3"><span>hello
23 there</span></div>
24 <div class="test" id="test4"><span>hello
25 there</span></div>
26 <div class="test" id="test5"><span>hello
27
28
29 there</span></div>
30 <div class="test" id="test6"><span>hello
31
32
33 there</span></div>
34 <div class="ref" id="ref"><span>hello there</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 more than one space is produced for any line in the test paragraph.
57 -->
58
59
60
61
62 </body></html>